/*STYLE*/

* {   -webkit-font-smoothing: antialiased;    -moz-osx-font-smoothing: grayscale;box-sizing: border-box;}
body {background-color: #f7f7f7;font-family: 'Montserrat', sans-serif; color:#242424;padding:0px;margin:0px;}
h1 {color: #008c95; font-family: 'Nunito', sans-serif;}
h2 {color: #242424; font-family: 'Nunito', sans-serif;margin:0;font-size:28px;}
p {font-size:15px;}
a, a:active, a:visited {color:#00275b;text-decoration: none;}
a:hover {color:#ce002e;text-decoration: none;}

.header-container {background-color: #00275b; color:#ffffff;min-height:100px;}
.header-area {max-width:1200px; margin: 0 auto;}
.header-logo {float:left; width:180px;padding-top: 25px;}
.header-logo img {width:170px;}
.header-menu {float:left;width: calc(100% - 180px);padding-top:40px;text-align:right;padding-right:14px;}
.header-menu a {color:#fff;padding-left:20px;font-size:14px;font-weight:bold;}
.header-menu a:hover {text-decoration: underline;}

/*main area*/
.main-area {max-width:1200px; margin: 0 auto;}
.panel {min-height:200px; background:#fff;-webkit-box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.10); box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.10);padding:20px 25px;}
.panel p {line-height:160%;}
.panel td,.panel th {text-align:left;font-size:15px;}
.panel tr {line-height: 150%;}
.panel-type1 {}
.panel-type2 {min-height:360px;}
.panel-type3 {min-height: 230px;}
.row-04 .panel-type2 {min-height:350px;}

.row-01 {padding:10px 0 5px 0;}
.area-invoices {padding: 14px;}

.row-02 {padding:0px 0; overflow:auto;}
.area-companydata {padding: 14px;float:left; width:50%;}
.area-contracts {padding: 14px; float:left; width:50%;}

.row-03 {padding:0px 0 20px 0;overflow:auto;}
.area-support {padding: 14px;float:left; width:50%;}
.area-contactperson {padding: 14px; float:left; width:50%;}

.panel-type1 a {color:#00275b;font-size:14px;}
.panel-type1 a:hover {color:#ce002e;}
.panel-type3 a {color:#00275b;font-weight:bold;}
.panel-type3 a:hover {color:#ce002e;}

.view-more {text-align:right; width:100%;font-size:14px; font-weight:bold;}
.view-more a{color:#00275b;}
.view-more a:hover{color:#ce002e;}

.tr-bg-grey {background-color:#efefef;}
.area-invoices-page tr {line-height:200%;}
.panel-type1 tr {line-height:200%;}

.row-04 {padding:10px 0 25px 0; overflow:auto;}

.row-05 {padding:10px 0 5px 0;overflow:auto;}
.row-06 {padding:0px 0 5px 0;overflow:auto;}
.row-07 {padding:0px 0 25px 0;overflow:auto;}

.row-08 {padding:10px 0 5px 0; overflow:auto}
.area-applications-title {padding: 14px;width:70%;float:left;}
.area-applications-info {padding: 14px;width:30%;float:left;}

.row-09 {padding:10px 0 5px 0; overflow:auto}
.area-applications-personaldata {padding: 14px;width:50%;float:left;}
.area-applications-motivation {padding: 14px;width:50%;float:left;padding-bottom:50px;}

.panel-type4 a {color:#00275b;font-size:14px;}
.panel-type4 a:hover {color:#ce002e;}
.panel-type4 h2 {font-size:28px;}
.panel-type4 h4 {font-size:16px;padding-top:10px;color:#00275b;}

.panel-type5 a {color:#00275b;font-size:14px;}
.panel-type5 a:hover {color:#ce002e;}
.panel-type5 h2 {font-size:20px;padding-bottom:10px;padding-top:5px;}

.panel-type5 textarea {width:100%; padding:5px 10px; border:1px solid #ccc; outline: none;border-radius:5px;}
input[type="file"] {font-size:11px;}
.upload-section {overflow:auto; padding:10px 0 25px 0;}
.upload-section-left {float:left;width:50%;font-size:14px;}
.upload-section-right {float:right;width:50%;}

.label-approved {background:#2ecc71;}
.label-declined {background:#e74c3c;}
.label-inprogress {background:#e67e22;}
.label-open {background:#2980b9;}
.label-all {border-radius:50px;padding: 5px 10px;color:#fff;margin-bottom:10px;max-width:140px;text-align:center;font-weight:bold;font-size:13px;}
.check-row {overflow:auto;width:100%;min-height:30px;padding:15px 0;border-bottom:1px solid #efefef;}
.check-text {float:left;overflow:auto;width:33%;font-size:15px;}
.check-label {float:left;overflow:auto;width:33%;}
.check-action {float:left;overflow:auto;width:33%;font-size:12px;font-style: italic;}
.check-action a {font-size:14px;font-style:normal; font-weight:bold;color:#008c95; }
.check-action a:hover {font-size:14px;font-style:normal; font-weight:bold;color:#000; }



/* The Modal (background) */
.modal { display: none; /* Hidden by default */ position: fixed; /* Stay in place */   z-index: 1; /* Sit on top */ left: 0;    top: 0;
    width: 100%; /* Full width */  height: 100%; /* Full height */  overflow: auto; /* Enable scroll if needed */ background-color: rgb(0,0,0); /* Fallback color */ background-color: rgba(0,0,0,0.4); /* Black w/ opacity */}

/* Modal Content/Box */
.modal-content { background-color: #fefefe; margin: 20px auto; padding: 20px;   border: 1px solid #888; width: 80%;  max-width:720px;}
.modal-content p {line-height:150%;}

/* The Close Button */
.close { color: #aaa;float: right; font-size: 38px; font-weight: bold;position: absolute;    right: 32px;}
.close:hover, .close:focus { color: black;  text-decoration: none; cursor: pointer;}

.full-input {display: inline-block; padding: 3px; width:98%; border: 1px solid #ccc; margin-bottom:5px;}
.full-input input{width:100%;}
.half-input {display: inline-block; padding: 3px; width:48%; margin-right:2%; float:left;margin-bottom:5px; border: 1px solid #ccc;}
.clientportal-form-wrapper input {outline: none; border: none; display:block; line-height: 1.1em;font-size: 14pt; padding:2px 10px!important;}
.clientportal-form-wrapper label { display: block;font-size: 12px; color: #373936;padding-left:10px; padding-top:3px; margin-bottom: 0;}

.btn-container {text-align:right;padding:20px 0;}
.btn-save {background:#00275b;color:#fff!important;padding:15px 30px;border-radius:10px;font-weight:bold;font-size:14px;margin-right:10px;}
.btn-save:hover {background:#00275b;color:#fff;padding:15px 30px;border-radius:10px;}
.img-panel img {width:130px; height:130px; object-fit: cover;margin-top:5px;}

.btn-register {background:#fff;color:#00275b!important;border:2px solid #00275b;padding:12px 30px;border-radius:10px;font-weight:bold;font-size:14px;margin-right:10px;}
.btn-register:hover {background:#00275b;color:#fff!important;border:2px solid #00275b;padding:12px 30px;border-radius:10px;}
.btn-container-register {text-align:left;padding:20px 0 30px 0;}
.register-newaccount {overflow:auto;padding-top:15px;border-top: 1px solid #ccc;}

/*LOGIN*/
.container-login {width: 80%; max-width:1100px; margin: 25px auto; background:#fff;overflow:auto;border-radius:10px;-webkit-box-shadow: 0px 4px 15px 0px rgba(0,0,0,0.49); box-shadow: 0px 4px 15px 0px rgba(0,0,0,0.20);}
.area-login-left {float:left; width:50%;background:#333; min-height:650px;background-image: url("../img/bg-db-clientportal.jpg"); background-repeat: no-repeat;background-size:cover;background-position:center center;}
.area-login-left-logo {text-align:center;padding-top:180px;}
.area-login-left-logo img{max-width:65%;}
.area-login-right {float:left; width:50%; padding:50px 40px;}
.area-login-right h2 {font-size:28px;}
.area-login-right p {padding-bottom:20px;line-height:160%;}
.container-login .full-input {border-radius:10px;}
.container-login .btn-container {padding-bottom:40px;}
.login-right-footer {padding-top:20px;line-height:160%;font-size:15px;border-top:1px solid #ccc;}
.login-right-footer a {font-weight:bold;color:#00275b;}

/*404*/
.notfound-area {text-align:center;}
.notfound-area img {max-width:100%;}


@media screen and (max-width: 768px) {
    .container-login {width: 90%;}
    .area-login-left {width:100%;min-height:100px;}
    .area-login-left-logo {padding-top: 50px;  padding-bottom: 40px;}
    .area-login-right { width: 100%;    padding: 20px 20px;}

}