/* * Prefixed by https://autoprefixer.github.io * PostCSS: v8.4.14, * Autoprefixer: v10.4.7 * Browsers: */ @media screen and (max-width: 1430px){ /*HEADER*/ #header nav ul li a { padding: 20px 30px; } } @media screen and (max-width: 1366px){ p, ul li { line-height: 1.6em; } /*BANNER*/ .banner-container { top: 55%; } .banner-content .content-text p { margin: 20px 0; } /*CONTENT*/ .content-text h1, .content-text h2 { font-size: 50px; } /*ABOUT*/ .about-content .content-text p { margin: 20px 0; } } @media screen and (max-width: 1024px){ p, ul li { font-size: 16px; line-height: 1.4em; } /*HEADER*/ .header-right .header-nav { width: 72%; padding: 0; } .header-right .header-info { width: 28%; } /*BANNER*/ .banner-content .content-text p { margin: 15px 0; } /*CONTENT*/ .content-text h1, .content-text h2 { font-size: 45px; } /*ABOUT*/ .about-content .content-text p { margin: 15px 0; } } @media screen and (max-width: 960px){ p, ul li { font-size: 16px; line-height: 1.4em; } /*HEADER*/ #header nav ul li a { padding: 15px 20px; } .header-right .header-nav { width: 72%; padding: 0; } .header-right .header-info { width: 28%; } .header-right .header-wrap { gap: 20px; } /*BANNER*/ .banner-content .content-text p { margin: 15px 0; } .banner-container { top: 60%; } /*CONTENT*/ .content-text h1, .content-text h2 { font-size: 45px; } /*ABOUT*/ .about-content .content-text p { margin: 15px 0; } } @media screen and (max-width: 800px){ body { min-width: 380px!important; } p, ul li { font-size: 16px; } p { margin: 15px 0!important; } .formLabel label { font-size: 14px!important; } .db { display: inline; } .inbM { display: block; } .flex, .flexs, .flexc, .flexe, .flexstr { flex-wrap: wrap; } .tl, .tr { text-align: center; } .lg-text { font-size: 16px!important; } .rr { flex-direction: unset; } /*SOCIALS*/ .socials ul li { margin: 0 auto; } /*FORM*/ .ctc-form input[type="text"] { height: 45px; margin: 0 auto 8px; padding: 10px; } .ctc-form textarea { padding: 10px; } .ctc-form input[type="text"], .ctc-form textarea { font-size: 14px; } .ctc-form .formLabel { width: 100%; } form [type="submit"], .ctc-form .g-recaptcha div { margin: 0 auto; } /*BUTTON*/ .btn { max-width: 130px; font-size: 12px!important; padding: 12px 0; } /*.ctc-form .btn { max-width: 190px!important; padding: 10px 0; }*/ /*STICKY*/ /*.sticky .header-left { width: 10%; }*/ #header.sticky nav ul li a { padding: 10px 15px!important; color: #333333!important; } .sticky .header-left { width: 160px; } /*.sticky .header-left { width: 45px; }*/ /* #header.sticky .header-right { padding: 0; } #header.sticky #pull img { filter: brightness(0) invert(1); }*/ /*DROPDOWN*/ /* #menu_drop #dropdown { display: none!important; background: #FEFEFE!important; } #header nav ul #dropdown li a { color: #444444!important; background: #FEFEFE!important; } #dropdown li { padding: 0!important; } #menu_drop { position: relative; } #menu_drop::after { content: '\f0d7'; font-family: 'FontAwesome'; font-size: 14px; color: #86B0AF; position: absolute; top: 10px; right: 15px; } #menu_drop:hover > #dropdown { display: block!important; position: static; max-width: 100%!important; width: 100%!important; padding: 0!important; } #header nav ul #dropdown li.active-menu a, #header nav ul #dropdown li a:hover { color: #FFFFFF!important; background: #86B0AF!important; } #header nav ul #dropdown li a { padding: 10px 30px; } #header nav ul #menu_drop:hover::after { content: '\f0d8'; color: #86B0AF; }*/ /*HEADER*/ #header { top: 0; padding: 0; min-width: 320px; } #header, #header * { box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; } #header .row {width: 100%} #header nav {display:block; height: auto; width: 100%;} #header nav ul { max-width: 100%; width: 100%; display: none; height: auto; padding: 0; margin: 0!important; } #header nav ul li { width: 100%;position: relative; margin: 0!important; padding: 0!important; } #header nav ul li a { background: #FFFFFF; color: #0A0A0A; font-size: 18px; display: block; float:none; padding: 10px 15px!important; } #header nav ul li a::before { display: none; } #header nav a {text-align: left; width: 100%;} #header nav a strong {position: absolute; top: 50%; transform: translateY(-50%); left: 15px;} #header nav a#pull { display: block; color: #fff; background-color: transparent; height: 55px;padding: 10px 0; width: 100%; position: relative; opacity: 1;} #header nav a#pull:after { content:''; background: url('../images/nav-icon.png') no-repeat; width: 20px; height: 20px; display: inline-block; position: absolute; right: 15px; top: 50%; transform: translateY(-50%); } /*#pull img { position: relative; width: 60px; padding-left: 15px; top: 0; }*/ #pull img { display: none; } #header nav ul li.active-menu { padding: 0; width: 100%; } #header nav ul li.active-menu a, #header nav ul li a:hover { width: 100%; background: #00382E; color: #FFFFFF!important; } .header-left { max-width: 70px; width: 100%; position: absolute; top: 10px; left: 15px; z-index: 2; } .header-right, .header-right .header-nav { width: 100%; padding: 0; } .header-right .header-wrap { max-width: 100%; width: 100%; } .header-right .header-info { max-width: 150px; width: 100%; position: absolute; top: 9px; right: 55px; } .header-right .header-info .button { width: 75%; } .header-right .header-info .tel { width: 20%; margin-left: auto; } .header-right .header-info .tel a { font-size: 12px; } .header-right .header-info .tel .desk, .header-right .header-info .tel::before, .header-right .header-info .tel::after { display: none; } .header-right .header-info .tel .mob { display: flex; align-items: center; justify-content: space-around; border: 2px solid #FFFFFF; line-height: 1.2em; background: #002C24; border-radius: 100%; width: 35px; height: 35px; } /*BANNER*/ .main-banner { padding: 55px 0 0; } .banner-slide .content-img img { min-height: 400px; object-fit: cover; } .banner-container { top: 50%; } .banner-content { max-width: 100%; width: 100%; } .banner-content .content-text h2 { margin: 0 0 15px; } .banner-content .content-text p { max-width: 100%; width: 100%; } /*CONTENT*/ #content { padding: 0!important; } .content-text h1, .content-text h2 { font-size: 40px; } /*ABOUT*/ .about-section { padding: 30px 15px; } .about-wrap { flex-direction: column-reverse; } .about-left, .about-right { width: 100%; } .about-content .content-text h6 { margin: 0 0 15px; } .about-right .about-content { max-width: 100%; } /*FOOTER*/ footer { } #footer { padding: 30px 15px; } #footer .main-logo, #footer .copyright, #footer .socials { width: 100%; } #footer .copyright { order: 1; } #footer .main-logo .content-img { max-width: 230px; width: 100%; margin: 0 auto; } #footer .socials ul { margin: 0 auto; } #footer .copyright .content-text p { margin: 0!important; } #footer .copyright .content-text .db { display: block; } /*INFO*/ .info-section { padding: 30px 15px; } .info-wrap { margin: 20px auto 0; gap: 30px; } .info-col { width: 100%; } .info-col .loc, .info-col .tel, .info-col .mail { padding: 70px 0 0; } /*INNER*/ .inner #banner { min-height: 120px; } .inner .banner-container { top: 50%!important; } .inner .banner-slide .content-img img { min-height: 250px; object-fit: cover; } .inner #content { padding: 30px 15px!important; min-height: 600px; } /*ABOUT*/ .inner.about #content { padding: 0!important; } .inner.about .about-wrap { flex-direction: unset; gap: 0; } .inner.about .about-section { padding: 30px 15px; } }