/* ui.css со старого сайта. Изменены только пути: /i/ → ../i/, шрифты → ../fonts/Manrope/. */
/* Шрифт Manrope подключается в functions.php (Google Fonts либо локальная папка assets/fonts/Manrope). */

 * {font-family: 'Manrope'; font-size: 16px; color: #757575; font-weight: 500;}
html, body {margin: 0; padding: 0;}
html {/*overflow-y: scroll;*/ min-height:100%;}
A {text-decoration: none;}



.title1 {color: white; font-size: 50px; font-weight: 600;  background-color: #e84f35; text-transform: uppercase; padding: 0 35px; clip-path: polygon(7% 0%, 0% 100%, 93% 100%, 100% 0%);}
/*.title2 {color: white; font-size: 32px; font-weight: 600; text-transform: uppercase; padding: 0 35px; clip-path: polygon(6% 0%, 0% 100%, 94% 100%, 100% 0%); background-color: #212c42;}*/
.title2 {color: white; font-size: 32px; font-weight: 600; text-transform: uppercase; }
.title2_bg {background-color: #212c42; background-image: url(../i/bottom-bg.jpg); background-repeat: no-repeat; background-position: center; background-size: cover; padding: 10px 20px;}
.title3 {display: block; color: #212c42; font-size: 38px; line-height: 44px; font-weight: 800;}

.main_bg {position: relative; width: 100%; height: 100%; background-image: url(../i/main-bg.png); background-repeat: no-repeat; background-position: center; background-size: cover; box-shadow: 0px 0px 24px rgba(0, 0, 0, 0.8);}
.main_bg_partners_logo {position: absolute; bottom: 20px; right: 20px; max-width: 200px;}
.main_bg_presentation {position: absolute; bottom: 20px; left: 50%; margin: 0 0 0 10px; color: silver; font-size: 12px; font-weight: 200; clip-path: polygon(6% 0%, 0% 100%, 94% 100%, 100% 0%); background-color: #00142f; padding: 10px 40px;}
.main_bg_presentation A {border-bottom: 1px solid white; text-decoration: none; color: white; font-weight: 600;}


.second_bg {position: relative; width: 100%; height: 120px; background-image: url(../i/bottom-bg.jpg); background-repeat: no-repeat; background-position: center; background-size: cover; box-shadow: 0px 0px 24px rgba(0, 0, 0, 0.8);}
.second_bg .logo {max-width: 300px;  margin: 40px 0 0 0;}
.second_bg .t_menu {margin:25px 0 0 0}


.t_menu {background-color: rgba(0, 20, 47, 0.6);  text-align: center; margin: 10% 0 0 0; padding: 0px 0; display: flex; align-items: center; justify-content: center; border: 0px solid silver;  box-shadow: 0px 0px 10px rgba(255, 255, 255, 0.1);}
.t_menu A, .t_menu EM { font-size: 16px; font-weight: 800; color: white; text-decoration: none;}
.t_menu A:hover {text-decoration: underline;}
.t_menu EM  {font-size: 32px; color: #293043 font-style: normal; font-weight: 200; padding: 0 10px 0 8px;}



/*.t_menu {background-color: rgba(0, 20, 47, 0.5); text-align: center; margin: 10% 0 0 0; padding: 0px 40px; display: flex; align-items: center; justify-content: center; border: 0px solid silver;   clip-path: polygon(4% 0%, 0% 100%, 96% 100%, 100% 0%); background: linear-gradient(to right, #202c42, #00142f);}

.second_bg .t_menu {background: linear-gradient(to right, #00142f, #202c42);}*/


.main_logo {margin: 68% 0 0 0;}
.main_logo IMG {max-width: 500px;}
.main_logo_text {background-color:#cb4f3a; color: white; font-size: 30px; font-weight: 800; text-align: center; margin: 30px 0 0 0;}

.bg_to_img {position:absolute; width:100%; height:100%; background: linear-gradient(to top, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.3)); z-index: 100; }
.bg_to_img_margin  {margin-bottom:25px}
.bg_to_img_a {display: block; position:absolute; width: 100%; height: 100%; z-index: 102;}
.bg_to_img_item {position:relative; display:block; width: 100%; height: 300px; background-repeat: no-repeat; background-size: cover; background-position: center;}
.bg_to_img_item SPAN {display:block; width: 90%; position:absolute; z-index: 101; bottom:20px; left:30px; color:white; font-weight:600; font-size:20px; line-height: 24px;}
.bg_to_img_item SPAN EM {display:block; font-style: normal; color:#cb4f3a; font-weight:600; font-size:14px; line-height: 18px; margin: 10px 0 0 0;}
.bg_to_img_block {position:relative; -webkit-box-shadow: 0px 0px 10px 7px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0px 0px 10px 7px rgba(0, 0, 0, 0.2); box-shadow: 0px 0px 10px 7px rgba(0, 0, 0, 0.2);}

.lnk1 {color: #0f1b32; font-size: 14px; font-weight: 400;}
.lnk1 A {border-bottom: 1px solid #0f1b32; text-decoration: none; color: #0f1b32; font-weight: 600;}

.bottom {background-color: #0f1b32; padding: 40px 0; box-shadow: 0px 24px 24px 24px rgba(0, 0, 0, 0.6); background-image: url(../i/bottom-bg.jpg); background-repeat: no-repeat; background-position: center; background-size: cover;}
.bottom .tel, .bottom .mail {color: white; }
.bottom .tel {font-size: 28px; text-decoration: none; margin: 60px 0 10px 0; display: block;}
.bottom .mail {font-size: 20px; font-weight: 200; text-decoration: none; border-bottom: 1px solid white;}
.bottom .address {font-size: 18px; font-weight: 200; color: #e84f35; display: block; margin: 20px 0 0 0;}
.bottom .logo {max-width: 300px; position: absolute; bottom:0; right:0;}
.bottom .logo_block {position:relative}

.portfolio_filter SELECT {width: 33%; color: #00142f; padding: 6px;}

.cd-header {display: none !important;}

.card {border:0; margin:0 0 20px 0; -webkit-box-shadow: 0px 0px 10px 7px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0px 0px 10px 7px rgba(0, 0, 0, 0.2); box-shadow: 0px 0px 10px 7px rgba(0, 0, 0, 0.2);}


.about .list1 {font-size: 18px; font-weight: 600; color: #212c42; }
.about .list1 STRONG {font-size: 18px; font-weight: 800; color: #e84f35;}
.about .list1 IMG {width: 100px; margin: 0 40px 0 0; }
.about .img1 {max-width:600px;}


.vakansy A {text-decoration: none;}
.vakansy .txt STRONG {font-size: 24px; color: #00142f; border-bottom: 1px solid #00142f; }
.vakansy .txt EM {display: block; font-style: normal; color: #212c42; margin: 10px 0 0 0;}
.vakansy .txt2 H1 {font-size: 30px; font-weight: 800; color: #00142f; display: block; margin: 0 0 20px 0;}
.vakansy .txt2 * {color: #212c42;}
.vakansy .txt2 STRONG {font-weight: 800;}



/*custom*/
@media (min-width: 2000px)
{
    .main_logo {margin: 100% 0 0 0;}
    .main_logo IMG {max-width: 120%;}
}
@media (max-height: 950px)
{
    .main_logo {margin: 50% 0 0 0;}
}



/*xxxl*/
@media (max-width: 1700px)
{

}


@media (max-width: 1500px)
{

}


/*xxl*/
@media (max-width: 1400px)
{
    .about .list1, .about .list1 STRONG {font-size: 16px;}
    .about .list1 IMG {width: 80px; margin: 0 30px 0 0;}
}


/*xl*/
@media (max-width: 1200px)
{
    .t_menu {margin: 10% 0 0 0; padding: 14px 0;}
    .t_menu A, .t_menu EM { font-size: 16px;}
    .second_bg .logo {max-width: 250px;}
    .second_bg .t_menu {margin:34px 0 0 0}

    .about .list1 IMG {display: none;}
}


/*lg*/
@media (max-width: 992px)
{
    .title3 {font-size: 30px; line-height: 35px;}

    .t_menu {display: none;}
    .cd-header {display: block !important;}
    .main_logo {margin: 50% 0 0 0; text-align: center;}
    .main_bg_presentation {bottom: 200px; left: 0%; margin: 0; text-align: center;  width: 100%;}
    .second_bg {height: 70px;}
    .second_bg .logo {margin: 20px 0 0 0;}

    .portfolio_filter SELECT {display: block; margin: 0 0 10px 0; padding: 6px; width: 100%;}


}


/*md*/
@media (max-width: 768px)
{
    .lnk1 {text-align: center;}
    .title1, .title2 { font-size: 30px; padding: 0 35px; text-align: center; display: block}
    .title2 {font-size: 18px;}
    .title3 {font-size: 24px; line-height: 30px;}

    .main_logo {margin: 90% 0 0 0; text-align: center;}
    .main_logo IMG {max-width: 400px;}

    .bottom {padding: 80px 0;}
    .bottom .tel {font-size: 22px; margin: 60px 0 10px 0; text-align: center;}
    .bottom .mail {font-size: 16px; text-align: center; display: block; border: 0; text-decoration: underline;}
    .bottom .address {font-size: 16px; margin: 20px 0 50px 0; text-align: center;}
    .bottom .logo {max-width: 250px; position:inherit;}
    .bottom .logo_block {position:inherit; text-align: center}

    .about .img1 {max-width:100%;}

    .bg_to_img_item SPAN {font-size:24px; line-height: 28px;}

}




/*sm*/
@media (max-width: 576px)
{
    .title3 {font-size: 22px; line-height: 26px;}

    .main_logo IMG {max-width: 300px;}
    .main_bg_presentation A {font-size: 12px;}

    .about .list1, .about .list1 STRONG {font-size: 14px;}

    .vakansy .txt STRONG {font-size: 20px; }
    .vakansy .txt2 H1 {font-size: 26px;}


}
