@font-face{font-family:'Roboto';font-style:normal;font-weight:400;font-display:swap;src:url(https://001.opton.com.ua/files/fonts/roboto-400-ce.woff2) format('woff2');unicode-range:U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;}
@font-face{font-family:'Roboto';font-style:normal;font-weight:700;font-display:swap;src:url(https://001.opton.com.ua/files/fonts/roboto-700-ce.woff2) format('woff2');unicode-range:U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;}
@font-face{font-family:'Roboto';font-style:normal;font-weight:400;font-display:swap;src:url(https://001.opton.com.ua/files/fonts/roboto-400-c.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}
@font-face{font-family:'Roboto';font-style:normal;font-weight:400;font-display:swap;src:url(https://001.opton.com.ua/files/fonts/roboto-400-le.woff2) format('woff2');unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Roboto';font-style:normal;font-weight:400;font-display:swap;src:url(https://001.opton.com.ua/files/fonts/roboto-400-l.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Roboto';font-style:normal;font-weight:700;font-display:swap;src:url(https://001.opton.com.ua/files/fonts/roboto-700-c.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}
@font-face{font-family:'Roboto';font-style:normal;font-weight:700;font-display:swap;src:url(https://001.opton.com.ua/files/fonts/roboto-700-le.woff2) format('woff2');unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Roboto';font-style:normal;font-weight:700;font-display:swap;src:url(https://001.opton.com.ua/files/fonts/roboto-700-l.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}

*,:after,:before{box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;}
*{-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:none;-ms-text-size-adjust:none;}
html{-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;}
body{padding:0;margin:0;font-family:'Roboto',Arial,sans-serif;font-size:16px;background:#f5f5f5;}
a{outline:0;text-decoration:underline;}
a:hover{text-decoration:none;}
form{padding:0;margin:0;}
img{border:0;max-width:100%;height:auto;}
td{vertical-align:top;}
.row{width:100%;min-width:320px;margin:0 auto;}
@media only screen and (min-width:1200px){.row{max-width:1162px;}}
.b{font-weight:bold;}
.i{font-style:italic;}
.j{text-align:justify;}
.img{vertical-align:bottom;}
.block:after{content:'';display:table;clear:both;}
.ul{list-style:none;padding:0;margin:0;}
.input,.textarea,.select,.button,.submit{-webkit-appearance:none;-moz-appearance:none;border:0;border-radius:0;-webkit-border-radius:0;-moz-border-radius:0;-khtml-border-radius:0;background:none;outline:none;}
.input,.textarea{font-family:'Roboto',Arial,sans-serif;font-size:1rem;}
.input-2{font-family:Arial,sans-serif;font-size:1rem;}
.input{-moz-appearance:textfield;}
.input::-webkit-inner-spin-button{display:none;}
.select{width:100%;height:34px;padding:0 5px;border:1px solid #ddd;background:url('/files/design/select-off.png') no-repeat scroll right center transparent;}
.select:focus,select:active{background:url('/files/design/select-on.png') no-repeat scroll right center transparent;}

a{color:#097680;text-decoration:none;}
a:hover{text-decoration:underline;}

.row-p{padding:0 20px;}
@media only screen and (min-width:1200px){.row-p{padding:0;}}

.scroll,.url{cursor:pointer;}

header{position:fixed;top:0;left:0;width:100%;height:70px;z-index:10;background:#097680;}

.header{display:flex;justify-content:space-between;}

@media only screen and (min-width:1200px){
nav{display:flex;justify-content:center;}
}

.header a{color:#fff;}

.h-logo{height:70px;flex:0 0 162px;cursor:pointer;}

.h-button-m{width:280px;height:50px;line-height:46px;margin:20px auto 0 auto;text-align:center;font-size:20px;font-weight:700;color:#fff;border:2px solid #fff;flex:0 0 280px;cursor:pointer;}
.h-button-m:hover{color:#097680;background:#fff;}


.h-button{display:none;}
@media only screen and (min-width:1200px){
.h-button{display:block;height:50px;line-height:46px;margin:10px 0 0 0;text-align:center;font-size:20px;font-weight:700;color:#fff;border:2px solid #fff;flex:0 0 280px;cursor:pointer;}
.h-button:hover{color:#097680;background:#fff;}
}

.nav-m-case{display:none;width:100%;padding:0 0 20px 0;background:#086570;}

.nav-i{padding:0 0 0 20px;line-height:48px;font-size:20px;color:#fff;}

.nav-c{display:none;}
@media only screen and (min-width:1200px){
.nav-c{display:block;flex:1 0 calc(100% - 442px);}
.nav-i{padding:0 20px;line-height:70px;font-size:20px;color:#fff;}
.nav-i:hover{background:rgba(0,0,0,.2);}
}

@media only screen and (max-width:320px){
.h-logo{background:url('/files/logo-top.png') no-repeat scroll center center transparent;background-size:auto 50px;}
}
@media only screen and (min-width:321px) and (max-width:959px){
.h-logo{background:url('/files/logo-top.png') no-repeat scroll center center transparent;background-size:auto 50px;}
}
@media only screen and (min-width:960px){
.h-logo{background:url('/files/logo-top.png') no-repeat scroll left center transparent;}
}
.h-logo{background:url('/files/logo-top.png') no-repeat scroll center center transparent;background-size:auto auto;}

.h-menu{width:70px;height:70px;background:url('/files/h-menu.png') no-repeat scroll center center transparent;background-size:32px 32px;}
@media only screen and (min-width:1200px){
.h-menu{display:none;}
}

.content{margin:70px 0 0 0;}


.intro{max-width:1440px;height:550px;padding:150px 0 0 0;margin:0 auto;position:relative;background:url('/i/2/intro.jpg') no-repeat scroll center center transparent;}

.intro-case{position:absolute;top:0;left:0;width:100%;height:550px;background:rgba(0,0,0,.4);display:flex;justify-content:center;align-items:center;}

@media only screen and (min-width:1200px){
.intro-case{position:absolute;top:0;left:0;width:600px;height:550px;background:rgba(0,0,0,.4);display:flex;justify-content:flex-end;align-items:center;}
.intro-case>div{padding:0 220px 0 0;}
}

.intro-name{width:280px;line-height:54px;padding:0 10px;margin:0 0 20px 0;font-size:32px;color:#fff;background:rgba(0,0,0,.4);}
.intro-slogan{width:280px;line-height:34px;padding:0 10px;margin:0 0 20px 0;font-size:20px;color:#fff;background:rgba(0,0,0,.4);}

.intro-button{width:280px;line-height:54px;font-size:18px;text-align:center;color:#fff;background:#097680;border:2px solid #097680;}
.intro-button:hover{color:#097680;background:#fff;}

.button{width:280px;line-height:50px;margin:0 auto;font-size:18px;text-align:center;color:#fff;border:1px solid #097680;background:#097680;cursor:pointer;}
.button:hover{color:#097680;background:transparent;}

.intro-more{padding:50px 0 0 0;}
.intro-more-i{margin:0 0 20px 0;}
.intro-more-ii{padding:20px;background:#fff;}
.intro-more-icon{width:100px;margin:0 auto 10px auto;}
.intro-more-text p{padding:0;margin:0;line-height:28px;}

.intro-button{margin:0 auto 50px auto;}

@media only screen and (min-width:768px){
.intro-more{margin:0 -15px;display:flex;flex-wrap:wrap;}
.intro-more-i{padding:0 15px;margin:0 0 30px 0;display:flex;flex:1 1 50%;}
}

@media only screen and (min-width:1200px){
.intro-more-ii{display:flex;}
.intro-more-text{width:calc(100% - 100px);padding:0 0 0 40px;}
.intro-more-text p{padding:0;margin:0;line-height:28px;}
}

.about-h{height:204px;background:url('/i/11/about.jpg') no-repeat scroll center center transparent;}
.about-sub{padding:100px 0 0 0;font-size:32px;color:#fff;}


.about{padding:50px 0 0 0;}
.about-i{margin:0 0 30px 0;}
.about-name{line-height:34px;font-size:20px;font-weight:700;}
.about-text p{margin:0;line-height:28px;}

.about-button{margin:0 auto 50px auto;}

@media only screen and (min-width:768px){

.about{margin:0 -30px;display:flex;flex-wrap:wrap;}
.about-i{padding:0 30px;flex:1 1 50%;}

}

.plans{padding:50px 0;background:rgba(9,118,128,.4);}

.plans-sub{text-align:center;font-size:32px;}
.plans-about{padding:10px 0 20px 0;text-align:center;font-size:18px;}

.imap{position:relative;}
.imap-s{position:absolute;z-index:10;top:0;right:0;bottom:0;left:0;}

.imap path{fill:transparent;transition:.1s fill;cursor:pointer;stroke:#097680;stroke-width:.5px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:0;}
.imap path:hover{fill:rgba(9,118,128,.25);stroke-opacity:1;}

.place{padding:50px 0;}
.place-sub{text-align:center;font-size:32px;color:#097680;}

.place-map{text-align:center;}


.catalog{padding:100px 0 50px 0;color:#fff;background:#097680;}
.catalog-i{max-width:300px;margin:0 auto;}
.catalog-ii{position:relative;padding:30px 20px 20px 20px;margin:0 0 60px 0;border:1px solid #fff;}
.catalog-icon{position:absolute;top:-44px;left:20px;background:#097680;}
.catalog-icon img{width:60px;height:auto;}
.catalog-name{font-weight:700;}
.catalog-note{margin:15px 0 0 0;font-size:14px;}
.catalog-data{font-size:28px;}

@media only screen and (min-width:360px){
.catalog-name{font-size:18px;}
.catalog-note{font-size:16px;}
}

@media only screen and (min-width:1200px){

.catalog{padding:120px 0 40px 0;}
.catalog-case{margin:0 -15px;display:flex;}
.catalog-i{max-width:100%;padding:0 15px;margin:0;flex:1 1 33.33333333333333%;}
.catalog-ii{padding:40px 20px 20px 20px;margin:0 0 40px 0;}
.catalog-icon{position:absolute;top:-84px;left:18px;}
.catalog-icon img{width:auto;height:auto;}
.catalog-name{font-size:28px;}
.catalog-note{margin:20px 0 0 0;font-size:24px;}
.catalog-data{font-size:40px;}

}

.catalog-button{width:280px;line-height:50px;margin:0 auto;text-align:center;font-size:18px;color:#fff;border:1px solid #fff;cursor:pointer;}
.catalog-button:hover{color:#097680;background:#fff;}

.news-line{padding:40px 0;}

.news-sub{font-size:32px;color:#097680;}

.news{margin:20px 0 10px 0;}

@media only screen and (min-width:768px){
.news-1{float:left;width:50%;}
.news-2{float:right;width:50%;padding:0 0 0 40px;}
}

.news-image{margin:0 0 20px 0;}
.news-date{padding:5px 0 10px 0;}
.news-date span{padding:3px 10px;font-size:14px;color:#fff;background:#097680;}
.news-name{font-weight:700;}
.news-name a{color:#000;}
.news-name a:hover{color:#097680;}
.news-about{padding:10px 0 0 0;font-size:14px;line-height:1.5;}
.news-more{margin:10px 0 20px 0;font-size:14px;font-weight:700;cursor:pointer;}
.news-more:hover{color:#097680;text-decoration:underline;}

.news-1 .news-i{margin:0 0 10px 0;border-bottom:3px solid #097680;}
@media only screen and (min-width:768px){
.news-1 .news-i{margin:0;border-bottom:0;}
}
.news-2 .news-i{margin:0 0 10px 0;border-bottom:3px solid #097680;}
.news-2 .news-i:last-child{border-bottom:0;}

.news-link{text-align:center;font-size:20px;}

footer{padding:20px 0;color:#fff;background:#097680;}
footer a{color:#fff;}

.footer-i{margin:0 0 30px 0;line-height:1.75;}

.footer-logo{text-align:center;}
@media only screen and (min-width:1200px){
.footer-logo{text-align:left;}
}

.footer-menu{font-size:22px;line-height:36px;}

.footer-phones{font-size:18px;line-height:32px;}

@media only screen and (min-width:1200px){
.footer{display:flex;}
.footer-i:nth-child(1){flex:1 1 30%;}
.footer-i:nth-child(2){padding:20px 0 0 0;flex:1 1 24%;}
.footer-i:nth-child(3){padding:20px 0 0 0;flex:1 1 30%;}
.footer-i:nth-child(4){padding:20px 0 0 0;flex:1 1 16%;}
}

.footer-sn{text-align:center;}
@media only screen and (min-width:1200px){
.footer-sn{text-align:left;}
}
.footer-sn img{margin:0 15px;}
@media only screen and (min-width:1200px){
.footer-sn img{margin:0 27px 0 0;}
}

.popup{display:none;}
.popup{z-index:20;position:fixed;top:0;right:0;bottom:0;left:0;padding:0 20px;background:rgba(0,0,0,.5);justify-content:center;align-items:center;}
.popup-case{width:100%;min-width:300px;max-width:500px;background:#fff;}
.popup-close{line-height:40px;padding:0 20px 0 0;text-align:right;color:#fff;background:#097680;cursor:pointer;}
.popup-content{padding:20px 20px;}
.popup-label{}
.popup-field{margin:5px 0 15px 0;}
.popup-field .input{width:100%;padding:0 10px;height:40px;border:2px solid #ccc;}
.popup-field .textarea{width:100%;padding:5px 10px;height:92px;line-height:26px;border:2px solid #ccc;}
.popup-button{width:260px;margin:0 auto;line-height:50px;text-align:center;font-size:18px;color:#fff;background:#097680;cursor:pointer;}

.list-i{padding:0 0 20px 0;margin:0 0 20px 0;border-bottom:3px solid #097680;}
.list-p{padding:0 0 10px 0;}
.list-p img{vertical-align:bottom;}
.list-n{padding:0 0 10px 0;}
.list-n a{display:block;padding:5px 0;font-weight:700;}
.list-more{margin:20px 0 0 0;font-weight:700;}

@media only screen and (min-width:600px){
.list-p{float:left;width:200px;}
.list-c{float:right;width:calc(100% - 220px);}
.list-n a{display:block;padding:0;}
.list-a{padding:10px 0 0 0;}
}
@media only screen and (min-width:600px){
.list-p{width:300px;}
.list-c{width:calc(100% - 320px);}
}

.gallery-i{margin:0 0 10px 0;}
.gallery-i img{vertical-align:bottom;}
@media only screen and (min-width:360px){
.gallery-i{float:left;width:calc(50% - 5px);margin:0 10px 10px 0;}
.gallery-i:nth-child(2n){margin:0 0 10px 0;}
}
@media only screen and (min-width:600px){
.gallery-i{width:calc(33.33333333333333% - 6.666666666666667px);margin:0 10px 10px 0;}
.gallery-i:nth-child(2n){margin:0 10px 10px 0;}
.gallery-i:nth-child(3n){margin:0 0 10px 0;}
}
@media only screen and (min-width:960px){
.gallery-i{width:calc(25% - 7.5px);margin:0 10px 10px 0;}
.gallery-i:nth-child(3n){margin:0 10px 10px 0;}
.gallery-i:nth-child(4n){margin:0 0 10px 0;}
}
@media only screen and (min-width:1200px){
.gallery-i{width:calc(16.66666666666667% - 8.333333333333333px);margin:0 10px 10px 0;}
.gallery-i:nth-child(4n){margin:0 10px 10px 0;}
.gallery-i:nth-child(6n){margin:0 0 10px 0;}
}