html, body, p, ul, li { margin: 0; padding: 0; border: 0; vertical-align: baseline; }

html, body{ height: 100%; }

a { text-decoration: none; }

li { list-style: none; }

body { font-family: "Open Sans"; }

/* отступ фоновой картинки сверху*/

.otstup1 { height: 55px; }
@media only screen and (max-width: 760px) { .otstup1 { display: none; } }

/* тень под меню*/

.ten1 { position: fixed; top: 0; left: 0; right: 0; z-index: 10; background: #fff; box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); }
@media only screen and (max-width: 760px) { .ten1 { position: relative; } }

/* шапка*/

.header { height: 86px; font-size: 0.01px; }

/* общая ширина страницы*/

.page-line { max-width: 1328px; margin: auto; padding: 0 10px; *zoom: 1; position: relative; }
.page-line:after { content: " "; display: table; clear: both; }


/* шапка левый блок */

.header_left { float: left; padding-top: 7px; }
.logo { display: inline-block; vertical-align: top; }
.logo img { width: 68px; }

/* шапка правый блок */

.header_right { *zoom: 1; float: right; }


/* меню */

.menu { float: left; margin-right: 44px; padding-top: 42px; *zoom: 1; }

@media only screen and (max-width: 760px) { 
/* скрываем верхнее меню, отменяем обтекание, позиционируем его, сместив на высоту шапки сайта */ 
.menu { max-height: 0; background: white; float: none; position: absolute; overflow: hidden; top: 92px; right: 0; left: 0; margin: 0; padding: 0; z-index: 3; }
/* класс, который будет добавлен в верхнему меню при нажатии на кнопку и покажет скрытое меню*/
.menu.active { display: block; max-height: 165px; } 
}

.menu_link { float: left; margin-right: 34px; }
.menu_link a { display: block; color: #242424; font-family: "Open Sans"; font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; line-height: 9px; padding-bottom: 8px; border-bottom: 2px solid #fff; }
.menu_link a:hover { border-bottom: 2px solid #2ba8e2; }

@media only screen and (max-width: 760px) { 
.menu_link { float: none; margin: 0; display: block; padding-left: 15px; border-bottom: 1px solid #EBEBE3; margin-right: 0; }
.menu a { color: #111; text-transform: uppercase; letter-spacing: 1px; font-weight: 600; display: block; line-height: 40px; border: none !important; }
.menu a:hover { color: #2ba8e2; border: none !important; }
}

.nav-toggle { position: absolute; top: 34px; right: 10px; display: none; cursor: pointer; width: 25px; height: 14px; border-top: 3px solid #2ba8e2; border-bottom: 3px solid #2ba8e2; z-index: 11; -webkit-transition: 0.1s linear; transition: 0.1s linear; }

@media only screen and (max-width: 760px) { .nav-toggle { display: block; } }

.nav-toggle:before, .nav-toggle:after { position: absolute; top: 50%; left: 0; right: 0; display: block; content: ''; height: 3px; background: #2ba8e2; margin-top: -1.5px; -webkit-transition: 0.1s linear; transition: 0.1s linear; }


/* шапка правый блок */


.header_address { float: left; position: relative; padding-left: 20px; padding-top: 30px; }

.header_address:before { position: absolute; top: 25px; left: 0; display: block; content: ''; width: 2px; height: 40px; background: #2ba8e2; }

.header_address p { color: #242424; font-family: "Open Sans"; font-size: 16px; font-weight: 300; letter-spacing: 0.5px; line-height: 8px; padding-top: 7px; }

@media only screen and (max-width: 760px) { 
.header_address { padding-left: 0; padding-right: 40px; padding-top: 28px; }
.header_address:before { display: none; } 
}
.header_phone { color: #242424; font-family: "Open Sans"; font-size: 14px; font-weight: 300; letter-spacing: 2px; line-height: 5px; padding-bottom: 7px; }

/* главный блок оффер */

.block { background-position: center; background-repeat: no-repeat; background-size: cover; padding: 140px 0 100px 0; margin-bottom: 50px; position: relative; overflow: hidden; }

@media only screen and (max-width: 1000px) { .block { padding: 150px 0 70px 0; } }

@media only screen and (max-width: 760px) { .block { padding: 40px 0; margin-bottom: 40px; } }


.text { padding: 0 0 53px 0; text-align: center; font-size: 0.01px; }

.video_offer1 { color: #f5f5f5; font-weight: 600; font-size: 50px; text-transform: uppercase; letter-spacing: 1.5px; line-height: 60px; padding-bottom: 68px; }
@media only screen and (max-width: 760px) { 
.video_offer1 { padding-bottom: 40px; font-size: 20px; line-height: 28px; } 
}

.video_offer2 { color: #f5f5f5; font-family: "Open Sans"; font-size: 24px; font-weight: 300; letter-spacing: 1.2px; line-height: 27px; }
@media only screen and (max-width: 760px) { 
.video_offer2 { font-size: 18px; line-height: 26px; } 
}

/* главный блок иконки */

.icon { text-align: center; font-size: 0.01px; padding-bottom: 60px; }

.main_icon { display: inline-block; vertical-align: top; margin-right: 249px; width: 33px; color: #f5f5f5; font-family: "Open Sans"; font-size: 12px; font-weight: 300; line-height: 18px; text-transform: uppercase; letter-spacing: 0.6px; position: relative; }

.main_icon:last-child { margin-right: 0; }

.main_icon:last-child:after { display: none; }

.main_icon:before { display: block; margin: auto; content: ''; margin-bottom: 27px; background-image: url("../img/icons.png"); width: 35px; height: 35px; }

.main_icon:after { position: absolute; top: 13px; width: 198px; height: 1px; background: rgba(255, 255, 255, 0.2); display: block; content: ''; right: -224px; }

.main_icon span { display: block; position: relative; width: 200px; left: 50%; margin-left: -100px; }

@media only screen and (max-width: 760px) { 
.main_icon { display: block; width: auto; margin: 0 0 30px 0; }
.main_icon:after { display: none; }
.main_icon:last-child { margin-bottom: 0; } 
}

/* заголовок нового блока */

.title_block { text-align: center; padding-bottom: 56px; color: #242424; font-family: "Open Sans"; font-size: 30px; font-weight: 300; line-height: 35px; position: relative; overflow: hidden; }

.title_block:before { position: absolute; top: 20px; left: 0; right: 0; border-top: 1px solid #e5e5e5; display: block; content: ''; }

@media only screen and (max-width: 760px) { .title_block { font-size: 24px; line-height: 30px; padding-bottom: 30px; } }

@media only screen and (max-width: 760px) { .title_block:before { display: none; } }

.title_block span { display: inline-block; vertical-align: top; position: relative; background: #fff; padding: 0 47px; }

@media only screen and (max-width: 760px) { .title_block span { padding: 0; } }


/* портфолио */

.content_block { max-width: 1228px; margin: auto; }

.content_block_left { float: left; width: 50%; }

@media only screen and (max-width: 760px) { .content_block_left { float: none; width: auto; padding-bottom: 30px; } }

.content_block_right { float: right; width: 50%; padding-left: 80px; box-sizing: border-box; }

@media only screen and (max-width: 1000px) { .content_block_right { padding-left: 30px; } }

@media only screen and (max-width: 760px) { .content_block_right { padding: 0; width: auto; float: none; display: none; } } /* скрывает блок в мобильной версии дисплей: ноне */


/* белый блок и тень для видео */

.block_video { position: relative; border-radius: 0 0 2px 2px; background-color: #ffffff; box-shadow: 0 20px 49px rgba(5, 38, 74, 0.29); margin-bottom: 68px; }

@media only screen and (max-width: 760px) { .block_video { margin-bottom: 30px; } }

/* видеоролик */

.video_foto { height: 325px; background-position: center; background-repeat: no-repeat; background-size: cover; position: relative; background-position: top; background-color: #637784; }

@media only screen and (max-width: 760px) { .video_foto { height: 230px; } }

.video_foto:before { position: absolute; top: 50%; left: 50%; display: block; content: ''; margin-top: -37px; margin-left: -37px; background-image: url("../img/icons_play.png"); width: 75px; height: 75px; background-position: 0px -75px; }

.block_video:hover .video_foto:before { background-image: url("../img/icons_play_white.png"); width: 75px; height: 75px; background-position: -75px 0px; }

.popup-youtube { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; background: transparent; }

.popup-vimeo { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; background: transparent; }

.popup-rutube { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; background: transparent; }

/* подпись под видеороликом */

.video_text { padding: 25px 28px; }

@media only screen and (max-width: 760px) { .video_text { padding: 15px; } }

.video_title { color: #2ba8e2; font-family: "Open Sans"; font-size: 16px; line-height: 19px; padding-bottom: 5px; }

.block_video p { color: #505050; font-family: "Open Sans"; font-size: 12px; }


/* текст справа от видеоролика */

.block_text p { color: #242424; font-size: 14px; font-weight: 300; line-height: 21px; font-weight: 300; }

.block_text p b { font-style: italic; font-weight: 400; }

@media only screen and (max-width: 760px) { .block_text { margin-bottom: 40px; } }

.text_title1 { color: #2ba8e2; font-family: "Open Sans"; font-size: 24px; font-weight: 300; padding-bottom: 32px; line-height: 27px; }

.text_title2 { color: #242424; font-size: 14px; font-weight: 300; line-height: 21px; font-weight: 600; padding-bottom: 20px; }

.description { color: #242424; font-size: 14px; font-weight: 300; line-height: 21px; font-weight: 300; padding-bottom: 62px; }

@media only screen and (max-width: 760px) { .description { padding-bottom: 30px; } }

/* точка около списка */

.video_item { position: relative; padding-left: 10px; }

.video_item:before { position: absolute; top: 0; left: 1px; display: block; content: '•'; color: #2ba8e2; }

/* разделитель между роликами */

.divider { text-align: center; padding-bottom: 56px; color: #242424; }

.divider:before { position: absolute; top: 20px; left: 0; right: 0; border-top: 1px solid #e5e5e5; display: block; content: ''; }

@media only screen and (max-width: 760px) { .divider { padding-bottom: 30px; } }

@media only screen and (max-width: 760px) { .divider:before { display: none; } }

/* информация */

.information { position: relative; z-index: 1; max-width: 1235px; margin: auto; margin-top: 0px; margin-bottom: 505px; *zoom: 1; }

@media only screen and (max-width: 1000px) { .information { margin: 0 -5px; margin-top: 0px; margin-bottom: 105px; } }

@media only screen and (max-width: 760px) { .information { margin-bottom: 50px; } }

.information_item { float: left; width: 33.333%; }

@media only screen and (max-width: 760px) { .information_item { float: none; width: auto; padding-bottom: 30px; } }

.information_over { margin: 0 22px; min-height: 450px; box-shadow: 0 20px 49px rgba(5, 38, 74, 0.3); border-radius: 2px; background-color: #ffffff; }

@media only screen and (max-width: 1000px) { .information_over { margin: 0 5px; min-height: 0; } }

.information_foto { height: 175px; background-position: center; background-repeat: no-repeat; background-size: cover; border-radius: 2px; }

.information_text { padding: 35px 40px; }

@media only screen and (max-width: 760px) { .information_text { padding: 20px 10px; } }

.information_title { color: #242424; font-size: 24px; font-weight: 300; padding-bottom: 22px; line-height: 28px; }

.information p { color: #242424; font-size: 14px; font-weight: 300; line-height: 21px; }

/* контакты */

.block_contacts { max-width: 1080px; margin: auto; *zoom: 1; padding-bottom: 540px; }

@media only screen and (max-width: 1000px) { .block_contacts { padding-bottom: 90px; } }

@media only screen and (max-width: 760px) { .block_contacts { padding-bottom: 40px; } }

.contacts_block_left { float: left; width: 50%; box-sizing: border-box; }

@media only screen and (max-width: 1000px) { .contacts_block_left { float: none; width: auto; } }

.contacts_block_right { float: right; width: 50%; }

@media only screen and (max-width: 1000px) { .contacts_block_right { float: none; width: auto; } }

/* фото в контактах */

.contacts_foto { max-width: 1228px; margin: auto; }

.foto-people { margin: 0 50px; position: relative; }

@media only screen and (max-width: 1000px) { .foto-people { max-width: 100%; margin: 0 10px 60px 10px; } }

.foto-people_image { height: 500px; background-position: center; background-repeat: no-repeat; background-size: cover; position: relative; box-shadow: 0 45px 59px rgba(5, 38, 74, 0.3); }

@media only screen and (max-width: 1000px) { .foto-people_image { height: 400px; } }

.foto-people_title { position: absolute; bottom: 46px; right: -26px; border-radius: 2px; background-color: #2ba8e2; padding: 16px 25px 21px 25px; min-width: 214px; box-sizing: border-box; }

.foto-people_title span { display: block; color: #f5f5f5; font-size: 16px; font-weight: 300; line-height: 16px; padding-bottom: 3px; }

.foto-people_title p { color: #f5f5f5; font-size: 12px; font-weight: 300; line-height: 12px; }

@media only screen and (max-width: 760px) { .foto-people_title { left: 0; right: 0; bottom: 0; } }

/* текст в контактах */

.author_title { color: #242424; font-size: 14px; font-weight: 300; line-height: 30px; padding-bottom: 24px; }

.author_title span { font-size: 25px; display: block; padding-bottom: 0px; }

/* список в контактах */

.contacts_offer { color: #242424; font-size: 20px; font-weight: 300; line-height: 30px; padding-bottom: 16px; }

.contacts { color: #242424; font-size: 14px; font-weight: 300; line-height: 21px; font-weight: 300; padding-bottom: 24px; }

@media only screen and (max-width: 760px) { .contacts { padding-bottom: 30px; } }

.contacts_item { position: relative; padding-left: 10px; }

.contacts_item:before { position: absolute; top: 0; left: 1px; display: block; content: '•'; color: #2ba8e2; }

.contacts a { color: #242424; text-decoration: none; }

.contacts a:hover { text-decoration: underline; }