@charset "UTF-8";

@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,800italic,700italic,700,600italic,600,400italic,300italic,300&subset=latin,latin-ext);

/* Global ------------------------------------------------------------------------------------------------------------------------------------ */
* { font-family: 'Open Sans', sans-serif; box-sizing: border-box; outline: none; }
body { background-color: #fff; color: #000; margin: auto; font-size: 16px; }
a:link {  text-decoration: none; outline: none; }
a:visited { text-decoration: none; }
a:hover { -moz-outline-style: none; color: inherit; text-decoration: underline; }
a:active { color: inherit; text-decoration: none; }
h1,h2,h3,h4,h5 { all: initial; font-family: inherit; font-size: inherit; color: inherit; display: inline; }
.modal { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.4); z-index: 99999; }
.modal .box { position: relative; top: 50%; left: 50%; transform: translateY(-50%) translateX(-50%); display: table; min-width: 320px; padding: 30px 40px; border-radius: 4px; background: white; box-shadow: 0 0 15px rgba(0,0,0,0.4); }
.modal .box .title { font-size: 20px; font-weight: bold; text-align: center; }
.modal .box .content { font-size: 16px; padding: 20px 0; text-align: center; }
.modal button.close { margin: auto; display: table; }
.modal button { display: initial; margin: 0 5px; }
.modal .modal-box { position: relative; top: 50%; left: 50%; transform: translate(-50%, -50%); display: table; min-width: 320px; padding: 30px 40px; border-radius: 4px; background: white; box-shadow: 0 0 15px rgba(0,0,0,0.4); text-align: center; }
.modal .modal-box .title { font-size: 20px; font-weight: bold; text-align: center; }
.modal .modal-box .content { font-size: 18px; font-weight: 600; padding: 20px 0; text-align: center; }
.modal-dialog { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(126,133,140,0.9); z-index: 999; display: flex; justify-content: center; align-items: center; }
.modal-dialog .wrapper { box-shadow: 0 0 15px rgba(0,0,0,0.4); min-width: 400px; display: table; }
button { background: #999; color: white; font-size: 14px; font-weight: 600; border: 0px; padding: 0 40px; height: 40px; border-radius: 30px; transition: 0.2s; cursor: pointer; }
button:active { transform: scale(0.98); background: #aaa; }
button.green { background: #0da512; }
button.red { background: #e00220; }
button:disabled { background: #78c57c; }
*::-webkit-scrollbar { width: 12px!important; height: 12px!important; }
*::-webkit-scrollbar-thumb { background: #424c5a; }
*::-webkit-scrollbar-track { background-color: #f2f2f2; border: none; }
input, select, textarea { width: 100%; font-size: 16px; font-weight: 500; height: 50px; padding: 0 10px; border: 0px; box-shadow: 0 0 7px rgba(0,0,0,0.2); transition: 0.2s; }
input { padding: 0px 15px 0; -webkit-user-select:text; }
input:focus, select:focus, textarea:focus { box-shadow: 0 0 8px rgba(0,0,0,0.4); }
.floating input[type="file"] { padding-top: 18px !important; }
textarea { line-height: 150%; }
select { cursor: pointer; font-weight: 600; }
.floating { position: relative; }
.floating input, .floating select { padding: 6px 15px 0 !important; }
.floating input::placeholder { color: rgba(0, 0, 0, 0); }
.floating label { display: block; position: relative; max-height: 0; font-weight: 500; pointer-events: none; }
.floating label:before { color: #222; content: attr(data-content); display: inline-block; transform-origin: 0 0; transition: all 0.02s ease; left: 5px; padding: 3px 8px; position: relative; font-size: 13px; }
.floating input:focus + label::after { transform: scale3d(1, 1, 1); opacity: 1; }
.floating input:placeholder-shown + label::before, .floating select + label::before { font-size: 12px; transform: perspective(1px) translate3d(0, -37px, 0) scale3d(1, 1, 1) translateZ(0); color: #999; font-weight: 500; background: white; border: 1px solid transparent; left: 5px; top: initial; -webkit-font-smoothing: antialiased; }
.floating label::before, .floating input:focus + label::before, .floating select + label::before { font-size: 10px; transform: perspective(1px) translate3d(0, -62px, 0) scale3d(1, 1, 1) translateZ(0); background: #fff; color: #111; border: 1px solid #bbb; font-weight: 600; text-transform: uppercase; left: -1px; -webkit-font-smoothing: antialiased; }
.floating input:focus + label::before { color: black; }
.floating .select2 + label::before { transform: perspective(1px) translate3d(0, -70px, 0) scale3d(1, 1, 1) translateZ(0); }
.floating label.textarea { position: absolute; top: -9px; }
.floating label.textarea::before { transform: perspective(1px) translate3d(0, 0px, 0) scale3d(1, 1, 1) translateZ(0); }
label.checkbox { display: table; position: relative; padding: 3px 0 0 40px; margin: 20px 0 20px 0px; cursor: pointer; font-size: 14px; font-weight: 600; text-transform: uppercase; }
label.checkbox input { display: none; }
label.checkbox:hover input ~ .checkmark { background-color: #ccc; }
label.checkbox input:checked ~ .checkmark { background: #263536; border: 2px solid #263536; }
label.checkbox input:checked ~ .checkmark:after { display: block; }
label .checkmark { position: absolute; top: 0; left: 0; height: 24px; width: 24px; border: 2px solid #888; border-radius: 2px; }
label.checkbox .checkmark:after { left: 6px; top: 1px; width: 5px; height: 13px; border: solid white; border-width: 0 3px 3px 0; transform: rotate(45deg); content: ""; position: absolute; display: none; }
.loader { top: 0; position: fixed; background: url('/modules/_site/images/loader.gif') no-repeat, #97d6f2; background-position: center center; width: 100%; height: 100%; z-index: 999; opacity: 0.7; }
/* ------------------------------------------------------------------------------------------------------------------------------------------- */

/* Content ----------------------------------------------------------------------------------------------------------------------------------- */
.panel { width: 300px; height: 100%; padding: 20px 0 0 0; top: 0; left: 0; position: fixed; background: #2c3d40; color: black; overflow-y: auto; box-shadow: 0 15px 25px rgba(0,0,0,0.2); }
.logo { width: 160px; margin: auto; display: table; color: #ddd; font-size: 11px; letter-spacing: 2px; text-align: center; }
.logo img { width: 100%; }
ul { list-style-type: none; margin: 30px 0; padding: 25px 0; background: #263536; color: white; }
ul a { color: white; padding: 15px 0px 15px 40px; display: block; text-transform: uppercase; letter-spacing: 1px; font-size: 14px; }
ul a:hover { color: white; background: #405a5f; text-decoration: none; }

@media (max-width: 1440px) {
.panel { width: 240px; }
.logo { width: 140px; font-size: 9px; }
ul { list-style-type: none; margin: 20px 0; padding: 15px 0; }
ul a { color: white; padding: 10px 0px 10px 30px; font-size: 12px; }

input, select, textarea { font-size: 14px; height: 42px; padding: 0 10px; }
.floating label:before { padding: 1px 8px; }
.floating input:placeholder-shown + label::before, .floating select + label::before { font-size: 11px; transform: perspective(1px) translate3d(0, -33px, 0) scale3d(1, 1, 1) translateZ(0); }
.floating label::before, .floating input:focus + label::before, .floating select + label::before { font-size: 8px; transform: perspective(1px) translate3d(0, -54px, 0) scale3d(1, 1, 1) translateZ(0); }
.floating input, .floating select { padding: 6px 12px 0 !important; }

label.checkbox { padding: 3px 0 0 35px; margin: 15px 0 15px 0px; font-size: 11px; }
label .checkmark { height: 22px; width: 22px; }
label.checkbox .checkmark:after { left: 5px; top: 1px; width: 5px; height: 11px; }
}
/* ------------------------------------------------------------------------------------------------------------------------------------------- */