
body {font-family: 'Open Sans', sans-serif;font-size: 22px;margin: 0;color: black;line-height: 35px;background-color:#003366}
    @media (min-width: 4001px) {body{font-size: 34px;line-height: 45px;}}
    @media (min-width: 3501px) and (max-width: 4000px){body{font-size: 32px;line-height: 45px;}}
    @media (min-width: 3001px) and (max-width: 3500px){body{font-size: 30px;line-height: 45px;}}
    @media (min-width: 2501px) and (max-width: 3000px){body{font-size: 28px;line-height: 45px;}}
    @media (min-width: 2001px) and (max-width: 2500px){body{font-size: 26px;line-height: 45px;}}
    @media (min-width: 1601px) and (max-width: 2000px){body{font-size: 24px;line-height: 45px;}}
    @media (min-width: 993px) and (max-width: 1600px){body{font-size: 22px;}}
    @media (min-width: 769px) and (max-width: 992px){body{font-size: 18px;}}
    @media (min-width: 577px) and (max-width: 768px){body{font-size: 16px;}}
    @media (min-width: 321px) and (max-width: 576px) {body{font-size: 14px;}}
    @media (max-width: 321px) {body{font-size: 12px;}}
#up {display: none; z-index: 1; position:fixed; right:1%; bottom:16px;  border-radius: 5px; background:#999; color: #fff; background-color: rgba(0,0,0,.5);}
    @media (max-width: 1600px) {#up {width:40px; height:40px;}}
    @media (min-width: 1601px) {#up {width:60px; height:60px;}}
.user {font-size: 45px!important; margin: -5px 5.5px; color: #fff;}
    @media (max-width: 1600px) {.user {font-size: 45px!important; margin: -5px 5.5px; color: #fff;}}
    @media (min-width: 1601px) {.user {font-size: 75px!important; margin: -9px 5.5px; color: #fff;}}
a {text-decoration: none; color: inherit; font-weight: 600; font-size: 0.9em;}
    @media (min-width: 1601px) {a {font-size: 1.1em;}}
.page {padding-top: 150px;overflow: hidden;display: block;box-sizing: border-box;}
    @media (min-width: 769px) and (max-width: 992px){.page {padding-top: 120px; }}
    @media (min-width: 577px) and (max-width: 768px){.page {padding-top: 100px; }}
    @media (min-width: 275px) and (max-width: 576px) {.page {padding-top: 70px; }}
    @media (max-width: 274px) {.page {padding-top: 100px; }}
main.page .background-image {background-image: url(../img/images/background_big1.jpg); background-size: contain;background-repeat: no-repeat;background-size: 1600px; background-position: center top;}
.background-image {position: absolute; top: 0;left: 0; width: 100%; height: 100%; z-index: -10; background-repeat: no-repeat; background-position: 50%; background-size: cover;}
    @media (max-height: 1000px) {.background-image {height: 200%}}
    @media (min-width: 4001px) {main.page .background-image {background-size: 4000px;}}
    @media (min-width: 3501px) and (max-width: 4000px){main.page .background-image {background-size: 4000px;}}
    @media (min-width: 3001px) and (max-width: 3500px){main.page .background-image {;background-size: 3500px;}}
    @media (min-width: 2501px) and (max-width: 3000px){main.page .background-image {background-size: 3000px;}}
    @media (min-width: 2001px) and (max-width: 2500px){main.page .background-image {background-size: 2500px;}}
    @media (min-width: 1601px) and (max-width: 2000px){main.page .background-image {background-size: 2000px;}}
    @media (min-width: 993px) and (max-width: 1600px){main.page .background-image {background-size: 1600px;}}
    @media (min-width: 769px) and (max-width: 992px){main.page .background-image {background-size: 992px;}}
    @media (min-width: 577px) and (max-width: 768px){main.page .background-image {background-size: 768px;}}
    @media (max-width: 576px) {main.page .background-image {background-size: 576px;}}
.ifn {display: contents;}
    @media (max-width: 768px){.ifn{display: block;}}
    @media (max-width: 576px) {.ifn {line-height: 1;} }
.container, .container_old {box-sizing: border-box; width: 100%; margin: 0 auto; max-width: 1700px; padding:  40px 50px 40px 50px}
.container_old {padding-top:  0px; padding-bottom: 0px}
    @media (min-width: 2001px) {.container, .container_old {max-width: 2000px;}}
    @media (min-width: 769px) and (max-width: 992px){.container, .container_old {padding: 20px}}
    @media (max-width: 768px){.container, .container_old {padding: 10px 20px}}
 
.infoBlok {display: block; box-sizing: border-box; margin-bottom: 50px;}
.Blok {padding: 60px 70px; background: #fff;}
    @media (min-width: 769px) and (max-width: 992px){.Blok {padding: 30px;}}
    @media (min-width: 577px) and (max-width: 768px){.Blok {padding: 30px 20px;}}
    @media (max-width: 576px) {.Blok {padding: 15px 15px;}}
.Blok h2 {color: #333366; text-align: center;  font-size: 2em;line-height: 1;}
    @media (min-width: 577px) and (max-width: 768px){.Blok h2 {padding: 0; margin: 10px 0}}
    @media (max-width: 576px) {.Blok h2 {padding: 0; margin: 10px 0}}
.color_blok {background-color: #B0C4DE;}
.color_blok h2 {color: #fff;} 
.info_cont {padding-top: 0}
.col_1 {box-sizing: border-box; position: relative; width: 100%; padding-right: 15px; padding-left: 15px;}
    @media (max-width: 1024px) {.col_1 {padding: 0;}}
.Flex {display: -webkit-box; display: -ms-flexbox;display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap;}
.header {position: absolute; top:  0; left: 0; width: 100%;}
.header_Blok.Flex {align-items: center;-webkit-box-align: center;-ms-flex-align: center;-webkit-box-pack: justify!important; justify-content: space-between!important;}
.header_row {position: relative;flex: 0 0 auto; width: auto; max-width: 100%; -webkit-box-flex: 0;padding-right: 15px; padding-left: 15px;}
    @media (max-width: 576px) {.header_row{padding: 0 2px}}
.header_logo, .footer_logo {background-image: url(../img/logo/CalmSea_logo.png); display: block;width: 210px;height: 80px; background-size: cover; background-repeat: no-repeat;position: relative; z-index: 20;cursor: default;}
    @media (min-width: 2001px) {.header_logo, .footer_logo   {width: 300px;height: 110px;}}   
    @media (min-width: 1601px) and (max-width: 2000px){.header_logo, .footer_logo   {width: 250px;height: 90px;}}
    @media (min-width: 769px) and (max-width: 992px){ .header_logo, .footer_logo {width: 160px; height: 60px;}}
    @media (min-width: 577px) and (max-width: 768px){.header_logo, .footer_logo {width: 142px; height: 53px;}}
    @media (min-width: 321px) and (max-width: 576px) {.header_logo, .footer_logo {width: 100px; height: 39px;}}
    @media (max-width: 320px) {.header_logo {width: 90px; height: 35px;}}
.headerInfo {display: flex;flex-wrap: wrap; padding-left: 0; margin-bottom: 0;align-items: center;}
    @media (min-width: 577px) and (max-width: 768px){.header_email {padding-bottom: 10px;}}
    @media (max-width: 576px) {.header_email {padding-bottom: 5px;}}
.header_row img {width: 50px; padding: 0 10px 0 0;} 
    @media (min-width: 2001px) {.header_row img {width: 80px;}}
    @media (min-width: 1601px) and (max-width: 2000px){.header_row img {width: 70px;}}
    @media (min-width: 769px) and (max-width: 992px){.header_row img {width: 40px;}}
    @media (min-width: 577px) and (max-width: 768px){.header_row img {width: 30px}}
    @media (max-width: 576px) {.header_row img {width: 30px}}
.headerSection {height: 650px;}

    @media (min-width: 4001px) {.headerSection {height: 1450px;}}
    @media (min-width: 3501px) and (max-width: 4000px){.headerSection {height: 1450px;}}
    @media (min-width: 3001px) and (max-width: 3500px){.headerSection {height: 1250px;}}
    @media (min-width: 2501px) and (max-width: 3000px){.headerSection {height: 1050px;}}
    @media (min-width: 2001px) and (max-width: 2500px){.headerSection {height: 850px;}}
    @media (min-width: 1601px) and (max-width: 2000px){.headerSection {height: 650px;}}
    @media (min-width: 993px) and (max-width: 1600px){.headerSection {height: 500px;}}
    @media (min-width: 769px) and (max-width: 992px){.headerSection {height: 300px;}}
    @media (min-width: 577px) and (max-width: 768px){.headerSection {height: 220px;}}
    @media (max-width: 576px) {.headerSection {height: 170px;}}
.headerSection .container {padding-top: 0}
    @media (min-width: 577) and (max-width: 768px){.headerSection .container {padding-left: 18vw/*60px*/;padding-right: 18vw/*60px*/;}}
    @media (max-width: 576px) {.headerSection .container {padding-left: 8vw;padding-right: 8vw;}}
.headerSection h1 {text-align: center;font-size: 30px; line-height: 45px; padding-top: 30px; max-width: 900px;font-weight: 600;margin: 100px auto;color: #fff;background-color: rgba(0,0,0,0.3);border-radius: 5px; padding: 30px;}
    @media (min-width: 3001px) {.headerSection h1 {max-width: 1500px; font-size: 1.6em; line-height: 100px; margin-top: 250px;padding:100px;}}
    @media (min-width: 2001px) and (max-width: 3000px){.headerSection h1 {max-width: 1300px; font-size: 1.6em; line-height: 60px; margin-top: 150px;padding: 70px;}}
    @media (min-width: 1601px) and (max-width: 2000px){.headerSection h1 {max-width: 1300px; font-size: 1.4em; line-height: 60px; margin-top: 100px;}}
    @media (min-width: 769px) and (max-width: 992px){.headerSection h1 {font-size: 1.2em; line-height: 35px;margin-top: 30px; max-width: 650px}}   
    @media (min-width: 577px) and (max-width: 768px){.headerSection h1 {font-size: 1.1em; line-height: 25px;margin-top: 10px; max-width: 550px;padding: 30px;}}   
    @media (max-width: 576px) {.headerSection h1 {font-size: 1.1em; line-height: 17px;margin-top: 10px;padding:20px  ;}}  
.List {list-style: none; padding-left: 0;}
.Choose_list {align-items: center;}
.Choose_list .col_2 {padding: 10px 20px}
    @media (max-width: 576px) {.Choose_list .col_2 {padding: 0 10px 0 0}}
.contentBlok {box-sizing: border-box;text-align: justify;}
    @media (min-width: 577px) and (max-width: 768px){.contentBlok {padding: 10px 20px; box-sizing: border-box; text-align: justify;}}
    @media (max-width: 576px) {.contentBlok {padding: 0 10px 0 0; box-sizing: border-box; text-align: justify;}}
.allCont {-webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
.col_2 {-webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%;max-width: 50%;}
    @media (min-width: 769px) and (max-width: 1279px){.col_2 {-ms-flex: 0 0 100%; flex: 0 0 100%;max-width: 100%;}}
    @media (max-width: 768px){.col_2 {-ms-flex: 0 0 100%; flex: 0 0 100%;max-width: 100%;}}
.OnList{display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: center;}
    @media (min-width: 769px) {.allContPad {padding: 0 20px;}}
.icon {background-repeat: no-repeat; background-size: auto; background-position: 50%; background-size: contain; max-width: 65px; /*height: 65px; */width: 100%; display: block; margin-right: 9%; -ms-flex-negative: 0; flex-shrink: 0;}
    @media (min-width: 1601px) {.icon {max-width: 80px;}}
.icon img{height: 60px; width: 60px;}
    @media (min-width: 1601px){.icon img{height: 80px; width: 80px;}}
    @media (min-width: 577px) and (max-width: 768px){.icon_list {max-width: 50px;height: 50px;margin-right: 5%}}
    @media (max-width: 576px) {.icon_list {max-width: 40px;height: 40px;margin-right: 5%}}
.icon_list img{height: 75px; width: 75px;}
    @media (min-width: 1601px) {.icon_list img {height: 100px; width: 100px}}
    @media (min-width: 577px) and (max-width: 768px){.icon_list img {height: 50px; width: 50px}}
    @media (max-width: 576px) {.icon_list img {height: 40px; width: 40px}}
.OnList_text {min-height: 40px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center;}
    @media (max-width: 768px){.OnList_text {line-height: 22px;}}
.Fuel_cont {width: 100%;max-width: unset;}
.fuel_h3 {width: 100%; text-align: left; font-size: 1.3em;color: #333366}
    @media (max-width: 768px){.fuel_h3 {margin: 5px 0;}}
.icon_port, .icon_fuel {max-width: 100px; height: 100px;}
    @media (min-width: 1601px) {.icon_port, .icon_fuel {height: 130px; width: 130px; margin-right: 5%}}
    @media (min-width: 577px) and (max-width: 768px){.icon_port, .icon_fuel {height: 80px; width: 80px; margin-right: 5%}}
    @media (max-width: 576px) {.icon_port, .icon_fuel {height: 50px; width: 50px; margin-right: 5%}}
.icon_port img, .icon_fuel img {height: 100px; width: 100px;}
    @media (min-width: 1601px) {.icon_port img, .icon_fuel img {height: 130px; width: 130px;}}
    @media (min-width: 577px) and (max-width: 768px){.icon_port img, .icon_fuel img {height: 80px; width: 80px;}}
    @media (max-width: 576px) {.icon_port img, .icon_fuel img {height: 50px; width: 50px;}}
.blok_in_flex {font-size: 1em; max-width: 1020px; margin: 0 auto; font-weight: 300; text-align: center;}
    @media (min-width: 2001px) {.blok_in_flex {max-width: 1720px; }}
    @media (min-width: 1601px) and (max-width: 2000px){.blok_in_flex {max-width: 1320px; }}
    @media (min-width: 769px) and (max-width: 992px){.blok_in_flex p {line-height: 30px;padding: 0 20px}}
    @media (min-width: 577px) and (max-width: 768px){.blok_in_flex p {line-height: 22px;padding: 0 10px}}
    @media (max-width: 575px) {.blok_in_flex p {line-height: 22px;} }
.contact-us {width: 100%; text-align: center; font-weight: 600; font-size: 1.2em;}
    @media (max-width: 768px){.contact-us {font-size: 1.1em;}}
    @media (min-width: 577px) and (max-width: 768px){.contact_blok_flex {padding: 0 30px}}
    @media (max-width: 576px) {.contact_blok_flex {padding: 0 20px}}
    @media (max-width: 576px) {.contact_br {display: flex; flex-wrap: wrap;} span.br_1 {width: 100%} span.br_2 {display: none;} span.br_3 {width: 100%}}
.col_3 {-webkit-box-flex: 0; -ms-flex: 0 0 40%; flex: 0 0 40%; max-width: 40%;}
    @media (max-width: 768px){.col_3 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}}
.footer {padding-bottom: 40px;}
.footer, .footer .Flex {position: relative;}
    @media (min-width: 769px) and (max-width: 992px){.footer {padding-bottom: 20px;}}
    @media (min-width: 577px) and (max-width: 768px){.footer {padding-bottom: 20px;}}
    @media (max-width: 576px) {.footer {padding-bottom: 20px;}}
.footer_logo {display: block; margin-bottom: 60px;}
    @media (min-width: 2001px) {.footer_logo {margin-bottom: 100px;}}
    @media (max-width: 769px) {.footer_logo {margin-bottom: 30px;}}
.Flex .footerTelAdr div {min-height: 60px; max-width: 450px;}
    @media (min-width: 1601px) {.Flex .footerTelAdr div {min-height: 60px; max-width: 1000px;}}
h5 {font-size: 0.9em; line-height: 22px; position: relative; font-style: italic;}
.footerInfo {display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; margin-bottom: 20px;}
.class_1 {-webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1;}
.class_1 div p.boldTel {margin: 10px 0;}
    @media (max-width: 768px){.class_1 {align-items: center;}}
    @media (min-width: 2001px) {.class_1 div p.boldTel {margin: 20px 0;}}
    @media (min-width: 1601px) and (max-width: 2000px){.class_1 div p.boldTel {margin: 15px 0;}}
    @media (min-width: 769px) and (max-width: 992px){.class_1 div p.boldTel {margin: 5px 0;}}
    @media (min-width: 577px) and (max-width: 768px){.class_1 div p.boldTel {margin-top: 15px;}}
    @media (max-width: 576px) {.class_1 div p.boldTel {margin-top: 20px;}} 
.class_2 {-webkit-box-ordinal-group: 4; -ms-flex-order: 3; order: 2;}
.class_2 div p.bold {font-weight: 600;font-size: 0.9em; margin-top: 10px;}
    @media (min-width: 2001px) {.class_2 div p.bold {font-size: 1.1em;margin-top: 20px; line-height: 45px}}
    @media (min-width: 1601px) and (max-width: 2000px){.class_2 div p.bold {font-size: 1.1em;margin-top: 15px; line-height: 45px}}
    @media (min-width: 769px) and (max-width: 992px){.class_2 div p.bold {margin: 5px 0 10px 0;line-height: 30px}}
    @media (max-width: 768px){.class_2 div p.bold {margin-top: 5px; line-height: 22px}}
.footerTelAdr {margin-bottom: 40px;}
    @media (min-width: 577px) and (max-width: 1024px){.footerTelAdr {margin-bottom: 0px;padding: 0 0 0 10px;}}
    @media (max-width: 576px){.footerTelAdr {margin: 0 10px;}}
.footerInfo .icon {height: 60px; width: 60px; -ms-flex-negative: 0; flex-shrink: 0; margin-right: 20px;}
    @media (min-width: 2001px) {.footerInfo .icon {height: 90px; width: 90px;margin-right: 40px;}}
    @media (min-width: 1601px) and (max-width: 2000px){.footerInfo .icon {height: 80px; width: 80px;margin-right: 40px;}}
    @media (min-width: 769px) and (max-width: 992px){.footerInfo .icon {width: 40px; height: 40px;}}
    @media (min-width: 577px) and (max-width: 768px){.footerInfo .icon {width: 30px; height: 30px;}}
    @media (max-width: 576px) {.footerInfo .icon {width: 25px; height: 25px;}}
.footerInfo .icon img {width: 50px; height: 50px;}
    @media (min-width: 2001px) {.footerInfo .icon img {width: 80px; height: 80px;}}
    @media (min-width: 1601px) and (max-width: 2000px){.footerInfo .icon img {width: 70px; height: 70px;}}
    @media (min-width: 769px) and (max-width: 992px){.footerInfo .icon img {width: 40px; height: 40px;}}
    @media (min-width: 577px) and (max-width: 768px){.footerInfo .icon img {width: 30px; height: 30px;}}
    @media (max-width: 576px) {.footerInfo .icon img {width: 30px; height: 30px;}}
.io_item {width: 100%;}
.io_button_wrap {text-align: center; margin-top: 10px;}
.io_button {display: inline-block;border: 2px solid #f00;width: auto;padding: 5px 20px;line-height: 32px;font-size: 1.1em;font-weight: bold;vertical-align: top;text-transform: uppercase;color: #f00 !important;ont-size: 10pt;border-radius: 10px;cursor: pointer;}
    @media (min-width: 769px) and (max-width: 992px){.io_button{line-height: 25px;}}
    @media (min-width: 577px) and (max-width: 768px){.io_button{line-height: 20px;border: 1px solid #f00;}}
    @media (max-width: 576px){.io_button{line-height: 20px;border: 1px solid #f00;}}
a.io_button:hover {text-decoration: none;}
.io_item .btn_close {display: none;}
.io_item .btn_open {display: inline-block;}
.io_item.open .btn_close {display: inline-block;}
.io_item.open .btn_open {display: none;}
.io_trans {width: inherit; position: absolute; height: 150px; bottom: 0; pointer-events: none;background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%); transition: 1s;}
.io_item.open .io_trans {height: 0; transition: 1s;}
.io_item_wrap { position: relative; overflow: hidden; max-height: 600px; width: inherit; transition: max-height 0.5;}
.io_item.open .io_item_wrap {max-height: 2500px !important; transition: max-height 1s;}

.form-contact-us {vertical-align: baseline;border: 0;max-width: 70%;margin:0 auto;padding:10px 20px;resize: vertical;}
    @media (min-width: 2001px) {.form-contact-us {max-width: 100%;}}
    @media (min-width: 769px) and (max-width: 1024px){.form-contact-us {max-width: 90%;}}
    @media (min-width: 577px) and (max-width: 768px){.form-contact-us {max-width: 100%;}}
    @media (max-width: 576px){.form-contact-us {max-width: 100%;padding: 0}}
.emb {height: 4vw;}
    @media (max-width: 768px){.emb {height: auto;}} 
.emb img {width: 4vw;text-align: center; margin: 0 auto; display: block;}
    @media (min-width: 577px) and (max-width: 768px){.emb img {width: 30px;}}
    @media (max-width: 576px){.emb img {width: 25px;}}
.telText {padding: 24px 0 20px 0; text-align: center;font-weight: 600; font-size: 1.1em;}
    @media (min-width: 577px) and (max-width: 768px){.telText {font-size: 1.1em; padding: 14px 0}}
    @media (max-width: 576px){.telText {font-size: 1em; padding: 14px 0}}
.adressText {padding: 10px 0 20px 0;text-align: center; font-weight: 600; font-size: 1.1em;line-height: 1.5;}
    @media (min-width: 769px) and (max-width: 992px){.adressText {padding: 10px 0;}}
    @media (min-width: 577px) and (max-width: 768px){.adressText {font-size: 1.1em; padding: 10px 5px}}
    @media (max-width: 576px){.adressText {font-size: 1em; padding: 10px 5px}}
.telText a {text-decoration: none; color: black;}
#contact {display: block;position: relative;}
.txt_1, .txt_2, .txt_3 {background-color: rgba(153,153,153,.12);flex-wrap: wrap;border-radius: 5px 5px 5px 5px;border-color: rgba(0,0,0,0);border-width: 0 0 0 0;
    font-size:0.8em;margin-bottom: 10px;min-height: 40px;flex-basis: 100%;line-height: 1;transition: all 0.3s ease;box-sizing: border-box;overflow: visible;}
.txt_1 {width:49.5%; padding:10px 13px; color: #555;}
.txt_2 {width:49.5%; padding:10px 15px;}
    @media (min-width: 769px) and (max-width: 1279px){.txt_1, .txt_2 {width: 100%;}}
.txt_3 {min-width: 100%; padding:10px 15px;}
.txtarea {font-family: inherit;display:inline-block;background-color: rgba(153,153,153,.12);width:100%;margin: 0 0 5px 0;border-radius: 5px 5px 5px 5px;
    border-color: rgba(0,0,0,0);border-width: 0 0 0 0;padding:10px 15px;font-size:0.8em;line-height:1.4em;height:220px;flex-basis: 100%;line-height: 1;
    transition: all 0.3s ease;box-sizing: border-box;overflow: visible;}
    @media (max-width: 768px){.txt_1, .txt_2, .txt_3, .txtarea {width: 100%; font-size: 0.8em;min-height: 30px}}    
.txt_1:focus, .txtarea:focus {border-style:solid;border-color:rgb(133, 133, 133);color:#444;}
input:focus {border-color: grey;}
input.error, textarea.error {border-color:rgba(153,153,153,.12);border-style:solid;background:#F0BEBE;color:#A35959;}
input.error:focus, textarea.error:focus {border-color:rgba(153,153,153,.12);color:#A35959;}
.send, .form_sub {font-family: inherit;flex-basis: 100%;min-height: 40px;width: 100%;cursor:pointer;padding:12px 40px 12px 40px;font-size:0.8em;border:solid 1px #F9F9F9;
    border-radius:5px 5px 5px 5px;display: inline-block;font-weight: 700;margin: 0 0 20px 0;white-space: normal;-webkit-box-flex: 0;-ms-flex-positive: 0;
    flex-grow: 0;background-color: #003366;color: #fff;text-align: center;letter-spacing: .1em;line-height: 1;transition: all 0.3s ease;box-sizing: border-box;overflow: visible;}
    @media (min-width: 769px) and (max-width: 992px){.send, .form_sub {margin: 0; }}
    @media (max-width: 768px){.send, .form_sub{min-height: 20px;padding: 10px 40px}}
.send:hover {background-color: #1a9fdb; opacity: .6;}

.page-wrapper {width: 100%;height: 100%;background-size: cover;}
a.btn {text-decoration: none;}
.modal-wrapper {width: 100%;height: 100%;position: fixed;top: 0; left: 0;visibility: hidden;opacity: 0;-webkit-transition: all 0.25s ease-in-out;transition: all 0.25s ease-in-out;background: rgba(0, 0, 0, 0.5);}
.modal-wrapper.open {opacity: 1;visibility: visible;}
.modal {width: 500px;display: block; margin: 30% 0 0 -250px; position: relative;top: 50%; left: 50%;opacity: 0;-webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; background: #fafafa;}
    @media (min-width: 360px) and (max-width: 768px){.modal {width: 350px;margin: 30% 0 0 -175px;}}
    @media (max-width: 359px){.modal {width: 250px;margin: 30% 0 0 -125px;}}
.modal-wrapper.open .modal {margin-top: -200px;opacity: 1;}
.head{width: 100%;height: 100%;margin: 0 0 14px;padding: 5px 30px;overflow: hidden;position: absolute;}
.btn-close {font-size: 28px; display: block; float: right; color: #fff;}
.modal .content {  padding: 20px;}
.good-job {text-align: center;font-family: 'Montserrat', Arial,Helvetica, sans-serif; color: #e2525c;}
.good-job .fa-thumbs-o-up {font-size: 60px;}
.good-job h1 {font-size: 45px;}
.form_modal_window{max-width: 70%;display: flex;flex-direction: column;margin: auto;}
.modal .content .text{color: #fff;padding: 10px;margin: 20px 0;}
.modal .content .text h2{margin:0;font-size: 35px;}
.modal .content .text p{margin:0;font-size: 14px;}
.modal-wrapper{margin: 0 0 20px 0;}
#open_okno_nav {overflow-x: all; width: 100%; height: 100%; text-align: left; padding: 6px 10px; background-color: #2c5ca8; position: fixed; top: 0; right: 0; bottom: 0; margin: 0 0 0 0; opacity: 0; transition: top 1.5s, opacity 1.0s;}
#open_okno_nav.open-menu {opacity: 1; position: fixed;}
#open_okno_nav:target {display: block;}
    @media (max-width: 769px){#open_okno_nav{padding: 5px 20px 15px 10px; box-sizing: border-box;}}
.zatemnenie {width: 100%; height: 100%; position: fixed; top: 0; left: 0; display: none; z-index: 9998;}
    @media (min-width: 500px) and (max-width: 768px){.close {text-align: center; display: inline-block; color: #FFF; width: 12%; margin: 0px; text-decoration: none; font-size: 2em; cursor:pointer;}}
    @media (max-width: 499px) {.close {text-align: center; display: inline-block; color: #FFF; width: 12%; margin: 0px; text-decoration: none; font-size: 1.5em; cursor:pointer;}}
    @media (min-width: 500px) and (max-width: 768px){.close i {padding: 15px 0 0 0;}}
    @media (max-width: 499px) {.close i {padding: 10px 0 0 0;}}
.a-close {text-align: right; display: flex; width: 100%;}
.humbLogo {display: inline-flex; text-align: left; width: 100%;}
    @media (min-width: 500px) and (max-width: 768px){.a-close img {width: 300px;}}
    @media (max-width: 499px) {.a-close img {padding-left: 0;width:200px;}}
    @media (max-width: 499px) {.a-close img {width: 150px;padding: 5px 0 0 0;}}
    @media (max-width: 768px) {.hl_2_3 {display: none;}}


   @media (max-width: 1159px) {.ifn {display:none;}}
.close_up {display:none}
@media (min-width: 1160px) {#menu, #menu_1, .menu-bg, .menu-bg_1 {display:none;}}
#menu, #menu_1 {z-index: 2;}
#menu-bar {width: 70px;height: 70px; margin: 50px 40px 0 0;cursor: pointer;}
#menu-bar_1 {width: 50px;height: 40px; margin: 15px 0px 0 0;cursor: pointer;}
.bar, .bar_1 {width: 30px;display: block;transition: 0.3s ease;}
.bar img, .bar_1 img {width: 30px;}
.nav, .nav_1 {transition: 0.3s ease;display: none;}
.nav_1 {margin-right: -60px;}
.nav {margin-right: 20px;}
.nav ul, .nav_1 ul {padding: 0 22px;}
.nav li, .nav_1 li {list-style: none; padding: 12px 0;    display: flex;   align-items: center;}
.nav li a, .nav_1 li a {color: white;font-size: 1.2em; text-decoration: none;}
.nav li a:hover, .nav_1 li a:hover {font-weight: bold;}
.menu-bg, #menu { top: 0; right: 0; position: absolute;}
.menu-bg_1, #menu_1 { top: 0; right: 75px; position: absolute;}
.menu-bg {z-index: 1; width: 0; height: 0; margin: 30px 0 20px 20px; background: radial-gradient(circle, rgba(0,51,102,1),rgba(0,51,102,0.8)); border-radius: 20%; transition: 0.3s ease;}
.menu-bg_1 {z-index: 1; width: 0; height: 0; margin: 30px 0 20px 20px; background: radial-gradient(circle, rgba(255,255,255,1),rgba(255,255,255,0.6)); border-radius: 10%; transition: 0.3s ease;}
.change { display: block;}
#ch li a {color:  black}
.change-bg { width: 230px; height: 300px; transform: translate(0.5%,-40%);}
.change-bg_1 { width: 520px; height: 580px; transform: translate(24%,-30%);}    
@media (min-width: 321px) and (max-width: 576px) {.change-bg { width: 220px; height: 290px; transform: translate(0.5%,-40%);}
.change-bg_1 { width: 310px; height: 310px; transform: translate(27%,-30%);}}
@media (max-width: 321px) {.change-bg { width: 190px; height: 270px; transform: translate(0.5%,-40%);}
.change-bg_1 { width: 300px; height: 300px; transform: translate(30%,-30%);}}
.menu-bg_1 .change-bg { right: 0;}
.change #bar1 {position: absolute; right:35px;}
.change #bar2 {position: absolute; right:15px;}
@media (min-width: 993px) and (max-width: 1160px) {#menu-bar {margin: 50px 40px 0 0}}
@media (min-width: 769px) and (max-width: 992px){#menu-bar {margin: 20px 30px 0 0}.change-bg_1 { width: 430px; height: 480px; transform: translate(24%,-30%);}}
@media (min-width: 577px) and (max-width: 768px){#menu-bar {margin: 15px 0px 0 0}}
@media (max-width: 576px){#menu-bar {width: 40px;height: 20px;margin: 15px 0px 0 0}}
#nav-icon1 {width: 60px;height: 45px; right: 50px; position: absolute; margin: 7px auto; transform: rotate(0deg); transition: .5s ease-in-out; cursor: pointer;}
#nav-icon1 span { display: block; position: absolute; height: 9px; width: 100%; background:  #333366; border-radius: 9px; opacity: 1; left: 0; transform: rotate(0deg);
    transition: .25s ease-in-out;}
#nav-icon1 span:nth-child(1) { top: 0px;}
#nav-icon1 span:nth-child(2) { top: 20px;}
#nav-icon1 span:nth-child(3) { top: 40px;}
#nav-icon1.open span:nth-child(1) { top: 20px;    transform: rotate(135deg);}
#nav-icon1.open span:nth-child(2) { opacity: 0; left: -60px;}
#nav-icon1.open span:nth-child(3) {top: 20px; transform: rotate(-135deg);}
@media (min-width: 769px) and (max-width: 993px){.change-bg_1 { width: 420px; height: 420px; transform: translate(24%,-30%);} #menu-bar {width: 50px;height: 40px; margin: 25px 40px 0 0;cursor: pointer;}}
@media (min-width: 577px) and (max-width: 768px) {.change-bg_1 { width: 370px; height: 400px; transform: translate(24%,-30%);}   #menu-bar {width: 50px;height: 40px; margin: 15px 40px 0 0;cursor: pointer;}
#nav-icon1 {width: 45px;height: 45px; right: 50px; position: absolute; margin: 5px auto; transform: rotate(0deg); transition: .5s ease-in-out; cursor: pointer;}
#nav-icon1 span { display: block; position: absolute; height: 9px; width: 100%; background:  #333366; border-radius: 9px; opacity: 1; left: 0; transform: rotate(0deg);
    transition: .25s ease-in-out;}
#nav-icon1 span:nth-child(1) { top: 0px;}
#nav-icon1 span:nth-child(2) { top: 15px;}
#nav-icon1 span:nth-child(3) { top: 30px;}
#nav-icon1.open span:nth-child(1) { top: 15px;    transform: rotate(135deg);}
#nav-icon1.open span:nth-child(2) { opacity: 0; left: -60px;}
#nav-icon1.open span:nth-child(3) {top: 15px; transform: rotate(-135deg);}}
@media (max-width: 576px) {#nav-icon1 {margin: 0px auto;width: 35px;height: 35px;right: 40px}
                            #nav-icon1 span { height: 7px;}
                            #nav-icon1.open span:nth-child(1) { top: 12px;    transform: rotate(135deg);}
#nav-icon1 span:nth-child(2) { top: 12px;}
#nav-icon1 span:nth-child(3) { top: 24px;}
#nav-icon1.open span:nth-child(1) { top: 12px;    transform: rotate(135deg);}
#nav-icon1.open span:nth-child(3) {top: 12px; transform: rotate(-135deg);}}