/* normal */ @font-face { font-family: "Helvetica Now Display"; font-weight: 400; src: url("fonts/HelveticaNowDisplay-Regular.ttf") } @font-face { font-family: "Helvetica Now Display"; font-weight: 400; font-style:italic; src: url("fonts/HelveticaNowDisplay-RegIta.ttf") } @font-face { font-family: "Helvetica Now Display"; font-weight: 700; src: url("fonts/HelveticaNowDisplay-Bold.ttf") } @font-face { font-family: "Helvetica Now Display"; font-weight: 600; src: url("fonts/HelveticaNowDisplay-Medium.ttf") } @font-face { font-family: "Helvetica Now Display"; font-weight: 700; font-style:italic; src: url("fonts/HelveticaNowDisplay-BoldIta.ttf") } @font-face { font-family: "Helvetica Now Display"; font-weight: 600; font-style:italic; src: url("fonts/HelveticaNowDisplay-MedIta.ttf") } * { margin: 0px; padding: 0px; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; } html, body { font-family: 'Helvetica Now Display', sans-serif; font-size: 22px; color: #262626; font-weight: 400; line-height:2; } body { background: #fff;color:inherit; } img { border: 0px; display: block; max-width: 100%; height:auto; } a{color:inherit; text-decoration: none; transition-duration:0.2s;} input, select, textarea, button{ -webkit-appearance: none;-moz-appearance:none; appearance:none; outline: none;} input[type="checkbox"]{-webkit-appearance: unset;-moz-appearance:unset; appearance:unset;} ul { list-style: disc; } h1,.h1, h2,.h2, h3,.h3, h4,.h4, h5,.h5, h6,.h6 { font-weight: 700; line-height:1.1; margin-bottom:1rem } h1, .h1{font-size:60px;} h2, .h2{font-size:45px;} h3, .h3{font-size:28px;} h4, .h4{font-size:26px;} h5, .h5{font-size:24px;} h6, .h6{font-size:20px;} p{margin-bottom:1em} .content_container ul, .content_container ol{margin-left:30px; margin-bottom:1em} .content_container a{color:#FF561C} .orange_bg .content_container a{color:#Fff} .maxw1{max-width:1920px; margin:0 auto; padding: 0 70px;} .maxw2{max-width:920px; margin:0 auto; padding: 0 70px;} .clear{clear:both;} .flexbox{display:flex; flex-wrap:wrap} .flexbox.space_between{justify-content: space-between;} .flexbox.align_center{align-items: center;} .flexbox.align_right{justify-content: flex-end;} .flexbox.align_bottom{align-items: flex-end;} .flexbox.align_top{align-items: flex-start;} .wrap{width:calc(100% + 40px); margin: 0 -20px} .wrap .col16{width:calc(16.666% - 40px); margin: 0 20px;} .wrap .col25{width:calc(25% - 40px); margin: 0 20px;} .wrap .col33{width:calc(33.3333% - 40px); margin: 0 20px;} .wrap .col40{width:calc(40% - 40px); margin: 0 20px;} .wrap .col50{width:calc(50% - 40px); margin: 0 20px;} .wrap .col60{width:calc(60% - 40px); margin: 0 20px;} .wrap .col66{width:calc(66.666% - 40px); margin: 0 20px;} .wrap .col75{width:calc(75% - 40px); margin: 0 20px;} .wrap .col100{width:calc(100% - 40px); margin: 0 20px;} .center_text{text-align:center;} .btn_bar{display:block; margin-top:2em;} .btn_bar .btn{margin:5px 5px 5px 0} .btn{display:inline-block; line-height:1; border:none} .btn.l_btn{padding: 20px 30px; font-size:20px; font-weight:700} .btn.n_btn{padding: 15px 20px; font-size:18px; } .btn.s_btn{padding: 10px 20px; font-size:18px; } .btn.white_border{color:#fff!important; border:1px solid #fff!important} .btn.black_border{color:#262626!important; border:1px solid #262626!important} .btn.orange_white{color:#fff!important; background:#FF561C!important} .btn.white_orange{color:#FF561C!important; background:#fff!important} .btn.white_border:hover{background:#fff!important; border:1px solid #fff!important; color:#FF561C!important} .btn.black_border:hover{background:#262626!important; border:1px solid #262626!important; color:#fff!important} .btn.orange_white:hover{color:#fff!important; background:#262626!important} .btn.white_orange:hover{color:#FF561C!important; background:#262626!important} .orange_bg{color:#fff; background:#FF561C} .black_bg{color:#fff; background:#262626} .mob_menu{position:absolute; z-index:99999999; width:0; overflow:hidden; right:0; top:0; } .mob_menu.open{width:100%} .mob_menu .inner{padding: 20px 30px; background:#262626; color:#fff; min-height:100vh} .mob_menu .top_menu{text-align:right; margin-bottom:20px} .mob_menu .close_btn{font-size:20px; font-weight:700; text-transform:uppercase;} .mob_menu .menu{margin-bottom:30px} .mob_menu .menu ul{list-style:none; text-align:center; font-size:20px; font-weight:700; text-transform:uppercase;} .mob_menu .menu ul li{margin: 10px 0px;} .mob_menu .menu ul li.menu-item-has-children .fa-regular{display:inline-block; margin-left:10px} .mob_menu .menu ul li.sub > a > i{transform:rotate(180deg); } .mob_menu .menu ul ul{display:none; font-size:90%; color:#FF561C} .mob_menu .search_bar{max-width:400px; margin: 0 auto} .mob_menu .search_bar form {background:#fff; } .mob_menu .search_bar form input{border:none; background:#fff; font:inherit; padding: 0 15px; width: calc(100% - 100px); } .mob_menu .search_bar form button{border:none; background:#FF561C; color:#fff; font:inherit; padding: 0 15px; width:95px} .header{position:fixed; z-index:9999; width:100%; padding: 20px 0; color:#fff; transition-duration:0s} .header .logo_black{display:none} .header .logo{width:150px; margin-right:40px} .header .menu{font-weight:700; text-transform:uppercase; font-size:20px; transition-duration:0} .header .menu ul a:hover{color:#FF561C} .header .menu ul li{display:inline-block; margin-right: 20px} .header .menu ul li.menu-item-has-children:after{content:"\f107"; font-family:"Font Awesome 6 Pro"; font-weight:900} .header.white_bg .logo_black{display:block} .header.white_bg .logo_white{display:none} .header.white_bg .menu{color:#262626; transition-duration:0s} .header.white_bg {color:#262626} .header .menu ul ul{display:none; background:#262626; position:absolute; padding: 20px } .header .menu ul li:hover ul{display:block;} .header .menu ul ul li{display:block; } .header .right .btn {margin-right: 20px} .header .right .btn img {width:40px;} .header .right form {background:#fff; margin-left:30px} .header .right form input{border:1px solid #efefef; background:#fff; font:inherit; padding: 0 15px; width: 150px; } .header .right form button{border:1px solid #FF561C; background:#FF561C; color:#fff; font:inherit; padding: 0 15px} .header .menu_btn{display:none; font-size:20px; font-weight:700; text-transform:uppercase;} .header .menu_btn i{font-size:24px} .header.sticky{background:#262626; padding: 10px 0; color:#fff} .header.sticky .logo .logo_black{display:none} .header.sticky .logo .logo_white{display:block} .header.sticky .logo img{width:100px} .header.white_bg.sticky .menu{color:#fff; transition-duration:0s} .spacer_top{padding-bottom:120px;} .hero{min-height:85vh; position:relative; width:100%} .hero .hero_content{position:absolute; background:rgba(0,0,0,0.19); width:100%; height:100%; color:#fff; text-shadow:0 0 15px rgba(0,0,0,0.3)} .hero .hero_content .hero_text{width:100%; display:block; margin-bottom:50px;} .hero .hero_content .hero_text .pretitle{font-size:50px; line-height:1.1; margin-bottom:30px} .text_block{padding: 60px 0; margin-bottom:60px} .text_block .col33{text-align:right} .text_block .logo{width:250px; display:inline-block; max-width: 100%;} .image_block{margin-bottom:60px} .categories{padding: 0px 0 60px} .categories .h1{margin-bottom:1em;} .categories .category_item{position:relative; margin-bottom:40px; overflow:hidden;} .categories .category_item:after{padding-bottom: 65%; content:""; display:block;} .categories .category_item .image{position:absolute; width:100%; height:100%; transition-duration:0.2s;} .categories .category_item:hover .image{transform:scale(105%)} .categories .category_item .inner{position:absolute; width:100%; height:100%; background:rgba(0,0,0,0.19); color:#fff; padding: 20px } .categories .category_item .title{width: 250px; max-width:100%; margin-bottom:0} .latest_project .col60{width:50%} .latest_project .col60 .image_slider{height:100%} .latest_project .col60 .image_slider .slick-dots{position:absolute; bottom:15px; width:100%; text-align:center;} .latest_project .col60 .image_slider .slick-dots li{display:inline-block; margin: 0 5px; } .latest_project .col60 .image_slider .slick-dots li button{border:none; background:none; border:1px solid #fff; font-size:0; border-radius:100%; height:18px; width:18px;} .latest_project .col60 .image_slider .slick-dots li.slick-active button{background:#fff} .latest_project .col60 .slick-list{height:100%} .latest_project .col60 .slick-track{height:100%} .latest_project .col60 .slick-slide{height:100%} .latest_project .col40{padding:40px 30px; width:40%} .latest_project .col40 .pretitle{font-size:30px} .product_page .latest_products{padding:0; margin-bottom:60px} .latest_products{padding:60px 0} .latest_products .margin_btm{margin-bottom: 1em;} .latest_products .slick-list{ padding: 20px 0 20px calc(50% - 890px)} .latest_products .slick-arrow{font-size:24px; margin-left:20px} .latest_products .product_item{width:300px; margin: 0 20px; } .latest_products .h1{margin-bottom:0} .product_item {box-shadow: 0px 5px 10px #00000029;} .product_item .image{} .product_item .image:after{padding-bottom: 85%; content:""; display:block;} .product_item .text{padding: 20px 15px;} .product_item .title{font-weight:600; line-height:1.2} .product_item .btn_bar{margin-top:1em; text-align:center;} .about{margin-bottom:60px} .about .h1{margin-bottom:60px;} .about .text_img_block{margin-bottom:60px} .about .text_img_block:nth-of-type(2n - 1) .flexbox{flex-direction:row-reverse} .about .text_img_block h2{color:#FF561C} .reviews {margin-bottom:60px} .reviews .black_bg{padding: 30px} .reviews .h1{margin-bottom:1em;} .reviews .reviews_slide{padding-bottom:70px} .reviews .reviews_slide .slick-dots{position:absolute; bottom:15px; width:100%; text-align:center;} .reviews .reviews_slide .slick-dots li{display:inline-block; margin: 0 5px; } .reviews .reviews_slide .slick-dots li button{border:none; background:none; border:1px solid #fff; font-size:0; border-radius:100%; height:18px; width:18px;} .reviews .reviews_slide .slick-dots li.slick-active button{background:#fff} .contact_bar{margin-bottom:60px} .contact_bar .orange_bg .col66{padding: 30px} .contact_bar .orange_bg .col33{padding: 30px 30px 0px 30px} .contact_bar .orange_bg .col33 .img:after{content:""; padding-bottom:100%; display:block;} .quote{margin-bottom:60px} .tax_text_block{padding: 20px 0 50px; margin-bottom:70px} .tax_text_block .flexbox{flex-direction: row-reverse;} .tax_text_block .col33{text-align:right} #breadcrumbs{font-size:80%} .product_info{margin-bottom:50px} .product_info h1{color:#FF561C} .product_info .gallery{position:relative; margin-bottom:40px;} .product_info .gallery .slick-dots{position:absolute; bottom:20px; width:100%; text-align:center;} .product_info .gallery .slick-dots li{display:inline-block; margin: 0 4px} .product_info .gallery .slick-dots li button{width:18px; height:18px; border-radius:100%; border:1px solid #fff; background:transparent; font-size:0} .product_info .gallery .slick-dots li button[aria-selected="true"]{background:#fff} .product_info .gallery .img{display:block;} .product_info .gallery .img:after{content:""; padding-bottom:75%; display:block} .product_info .video_item{display:block; margin-bottom: 30px; position:relative} .product_info .video_item:after{padding-bottom:55%; display:block; content:"";} .product_info .video_item .play{position:absolute; top:50%; left:50%; transform:translate(-50% , -50%); color:#fff; -webkit-text-shadow: 0px 0px 30px #000000; -moz-text-shadow: 0px 0px 30px #000000; text-shadow: 0px 0px 30px #000000; font-size: 70px} .product_info .specs .spec {border-bottom:1px solid #262626; padding:10px 0} .product_info .specs .spec.hidden{display:none} .product_info .specs .spec:first-of-type{border-top:2px solid #262626} .product_info .specs .spec .label{width:50%} .product_info .specs .spec .value{width:50%} .product_info .specs #read_more{color:#FF561C;} .product_info .specs #read_more.hidden{display:none} .product_info #read_more_btn{Display:none} .form_bar{margin-bottom:60px; border-top:1px solid #FF561C; border-bottom:1px solid #FF561C; padding:30px 0 0} .form_bar .title{color:#FF561C; margin-bottom:0; padding:10px 30px 10px 0} .form_bar .quote_form{padding-bottom:30px} .form_bar.open{background:#FF561C; color:#fff; } .form_bar.open .h3{color:#fff} .form_bar.open .btn.orange_white{background:transparent; border:1px solid #fff;} .form_bar > .maxw1 > .flexbox{padding-bottom:30px;} .form_bar .form_block{display:none} .form_bar .form_block.open{display:block; padding-top:50px} .form_bar .form_block.contact_bar{margin-bottom:0} .form_bar .form_block.contact_bar .orange_bg .col66 { padding: 30px 0;} .form_bar .form_block .wpcf7 input{background:none; border:none; border-bottom:1px solid #fff; height:70px; color:#fff; -webkit-text-fill-color: #fff !important; -webkit-background-clip: text !important; background-clip: text !important;} .form_bar .form_block .wpcf7 input::placeholder{color:#fff} .form_bar .form_block .wpcf7 textarea{background:none; border:none; border-bottom:1px solid #fff; height:70px; color:#fff} .form_bar .form_block .wpcf7 textarea::placeholder{color:#fff} .form_bar .form_block .wpcf7 input[type="submit"]{border:1px solid #fff; line-height:1; height:auto; padding:15px 20px} .form_bar .form_block .wpcf7 select{background:none; border:none; border-bottom:1px solid #fff; height:70px; color:#fff; -webkit-text-fill-color: #fff !important; -webkit-background-clip: text !important; background-clip: text !important;} .form_bar .form_block .wpcf7 select option{color:#000} .form_bar .form_block .wpcf7 .countrycode{width:30%} .form_bar .form_block .wpcf7 .phone{width:70%} .footer .bottom{padding: 30px 0} .footer a:hover{color:#FF561C} .footer .title{font-weight:700} .footer ul{list-style:none; } .footer ul ul{Display:none} .footer .fab{font-size:130%; margin-right:10px} .footer .border{border-bottom:2px solid #FF561C; margin-bottom:30px} .footer .border .logo{background:#FF561C; padding:10px; width: 120px; height:120px} .footer form .wpcf7-spinner{float:left;} .footer form {border-bottom:1px solid #FF561C;} .footer form input{border:none; font:inherit; width:calc(100% - 70px); color:#FF561C} .footer form input::placeholder{ color:#FF561C} .footer form input[type="submit"]{width: 60px; background:none; color:#262626; padding:0} .product_list {margin-bottom:50px} .product_list .product_item{margin-bottom:40px; } .wrap .news_item {margin-bottom:40px} .news_item .image:after{padding-bottom: 75%; content:""; display:block;} .news_item .text{padding: 20px 0px;} .news_item .date{color:#FF561C; font-size:80%} .news_item .title{font-weight:700; line-height:1.2; margin-bottom:0} .news_item .text{ font-size:80% } .news_item .more{color:#FF561C; } .latest_news .news_item{width:300px; margin: 0 20px; } .product_page .latest_news{padding:0; margin-bottom:60px} .latest_news{padding:60px 0} .latest_news .margin_btm{margin-bottom: 1em;} .latest_news .slick-list{ padding: 20px 0 20px calc(50% - 870px)} .latest_news .slick-arrow{font-size:24px; margin-left:20px} .news_head h1{color:#FF561C} .news_bottom{border-top:1px solid #FF561C; padding: 10px 0; color:#FF561C} .team_block{margin-bottom:50px} .team_block h2{margin-bottom:1em} .team_block .wrap .col25{margin-bottom:40px;} .team_block .team_member .image{position:relative;} .team_block .team_member .image:before{content:""; padding-bottom:130%; display:block} .team_block .team_member .image .btn_bar{text-align:center; position:absolute; left:0; bottom:10px; width:100%;} .team_block .team_member .text{line-height:1.5; padding: 10px 0 0} .team_block .team_member .name{font-weight:700} .team_block .team_member .function{color:#FF561C;} .content_text_block{margin-bottom:60px} .content_text_block h2{color:#FF561C} .content_text_block .wpcf7 .wpcf7-form-control-wrap{Display:block} .content_text_block .wpcf7 input{background:none; border:none; border-bottom:1px solid #FF561C; height:70px; color:#262626; padding: 10px 0; width:800px; max-width:100%} .content_text_block .wpcf7 input::placeholder{color:#262626} .content_text_block .wpcf7 textarea{background:none; border:none; border-bottom:1px solid #FF561C; height:70px; color:#262626; padding: 10px 0; width:800px; max-width:100%} .content_text_block .wpcf7 textarea::placeholder{color:#262626} .content_text_block .wpcf7 input[type="submit"]{border:1px solid #FF561C; background:#FF561C; color:#fff; line-height:1; height:auto; padding:15px 20px } .content_text_block .address .btn{ width:300px; max-width:100%; text-align:center; } .search_list {margin-bottom:125px;} .search_list .search_item{padding: 20px 0; border-bottom:1px solid #FF561C; display:block} .search_list .search_item .h3{margin-bottom:0.5em} .search_list .search_item .search_item_bottom{color:#FF561C} .wpcf7 .form_item{margin-bottom: 20px;} .wpcf7 .label{width: 180px; display:inline-block; vertical-align:top} .wpcf7 .form_field{width: calc(100% - 190px); display:inline-block; vertical-align:top} .wpcf7 input, .wpcf7 textarea, .wpcf7 select{width:100%; padding:5px 15px; border: 1px solid #202020 ; font:inherit } .wpcf7 input[type="submit"]{width:auto;} .wpcf7 input[type="submit"]:hover{} .wpcf7 select{background:url(img/angle-down.png) no-repeat calc(100% - 10px) 50% #fff;} span.wpcf7-list-item {display: inline-block;margin: 0px 0 0;} span.checkbox{margin-top:10px; display: block;} .wpcf7 .wpcf7-list-item {display: inline-block; margin-right:30px} .wpcf7-list-item-label {margin-left: 30px;display: inline-block; vertical-align: top;} .wpcf7-checkbox {padding: 5px 0px; display:inline-block} .wpcf7-checkbox label {position: relative;cursor: pointer;} .wpcf7-checkbox input[type=checkbox] {position: absolute;visibility: hidden;width: 16px;height: 16px;top: 0;left: 0;} .wpcf7-checkbox input[type=checkbox] + span:before {display: block;position: absolute;content: '';border-radius: 0;height:16px;width: 16px;top: 2px;left: 0px;border: 1px solid #1b1a1a; background:#fff} .wpcf7-checkbox input[type=checkbox] + span:after {display: block;position: absolute;content: "\f00d";font-family:"Font Awesome 6 Pro";font-weight:900;height: 16px;width: 16px;color:#202020;top: 3px;left: 1px;visibility: hidden;font-size: 16px;text-align: center;line-height: 16px;} .wpcf7-checkbox input[type=checkbox]:checked + span:before {background: transparent;} .wpcf7-checkbox input[type=checkbox]:checked + span:after {visibility: visible;} .wpcf7-radio label {position: relative;cursor: pointer;} .wpcf7-radio input[type=radio] {position: absolute;visibility: hidden;width: 16px;height: 16px;top: 0;left: 0;} .wpcf7-radio input[type=radio] + span:before {display: block;position: absolute;content: '';border-radius: 100%;height: 16px;width: 16px;top: 2px;left: 0px;border: 1px solid #1b1a1a; background:#fff} .wpcf7-radio input[type=radio] + span:after {display: block;position: absolute;content: "";font-family:"Font Awesome 6 Pro";font-weight:900;height: 12px;width: 12px;color:#202020; background:#202020; border-radius:100%; top: 5px;left: 3px;visibility: hidden;font-size: 15px;text-align: center;line-height: 16px;} .wpcf7-radio input[type=radio]:checked + span:before {background: transparent;} .wpcf7-radio input[type=radio]:checked + span:after {visibility: visible;} @media only screen and (max-width: 1820px) { .latest_products .slick-list{padding-left:calc(20px)} .latest_news .slick-list{padding-left:calc(20px)} } @media only screen and (max-width: 1540px) { .maxw1{padding:0 20px;} .maxw2{padding:0 20px;} .reviews { margin-bottom: 50px;} .categories { padding: 50px 0;} .text_block { padding:50px 0; margin-bottom: 50px;} .latest_products { padding: 50px 0;} .about { margin-bottom: 50px;} .content_text_block { margin-bottom: 50px;} .quote { margin-bottom: 50px;} } @media only screen and (max-width: 1400px) { .header .logo{width:100px;} .spacer_top { padding-bottom: 94px;} } @media only screen and (max-width: 1400px) { .header .menu_btn{display:inline-block; margin-left: 30px} .header .menu{display:none} } @media only screen and (max-width: 1250px) { h1, .h1{font-size:50px;} h2, .h2{font-size:35px;} .product_list .col25{width:calc(33.333% - 40px)} .news_list .news_item {width:calc(33.333% - 40px)} .team_block .wrap .team_member{width:calc(33.333% - 40px)} } @media only screen and (max-width: 1080px) { .hero { height:auto; min-height:0;} .hero .wrap .col33{width:calc(100% - 40px)} .hero .wrap .col33 br{display:none} .hero .wrap .col33.center_text{ margin-top:40px;} .reviews { margin-bottom: 40px;} .categories { padding: 40px 0;} .text_block { padding:40px 0; margin-bottom: 30px;} .about { margin-bottom: 40px;} .latest_products { padding: 40px 0;} .content_text_block { margin-bottom: 40px;} .quote { margin-bottom: 40px;} .tax_text_block { padding: 20px 0 30px; margin-bottom: 40px;} .footer .wrap .col16{width:calc(33.33% - 40px); margin-bottom: 30px} .footer .wrap .col33{width:calc(66.66% - 40px); margin-bottom: 30px} } @media only screen and (max-width: 1020px) { h1, .h1{font-size:45px;} h2, .h2{font-size:30px;} .hero .hero_content .hero_text .pretitle{font-size:40px} .latest_project .col60{width:50%} .latest_project .col40{width:50%} .content_text_block .wrap .col33{width:calc(100% - 40px);} .content_text_block .wrap .col66{width:calc(100% - 40px); margin-bottom:50px} } @media only screen and (max-width: 900px) { .header .search_bar{display:none} .categories .category_item.col33{width:calc(50% - 40px)} .about .text_img_block .col50{width:calc(100% - 40px)} .about .text_img_block .image:after{content:""; padding-bottom:60%; display:block; margin: 30px 0} .latest_project .col60{width:100%} .latest_project .col40{width:100%} .latest_project .image:after{content:""; padding-bottom:60%; display:block; margin: 30px 0} .contact_bar .orange_bg .col66 { padding: 30px 0 30px 30px;} .contact_bar .orange_bg .col33 { padding: 30px 30px 0px 0px;} .product_list .col25{width:calc(50% - 40px)} .news_list .news_item {width:calc(50% - 40px)} .tax_text_block .col66{width:calc(100% - 40px)} .tax_text_block .col33{width:calc(100% - 40px); text-align:left} .team_block .wrap .team_member{width:calc(50% - 40px)} .product_info .col50{width:calc(100% - 40px);} .news_page .col33, .news_page .col66{width:calc(100% - 40px);} .product_info #read_more_btn{Display:block} .product_info #read_more_btn.hidden{Display:none} .product_info .col50 .read_more{height: 250px; overflow:hidden; position:relative} .product_info .col50 .read_more:after{content:""; display:block; width:100%; height: 100px; background:linear-gradient(0, rgba(255,255,255,1) , rgba(255,255,255,0)); position:absolute; left:0; bottom:0; } .product_info .col50 .read_more.show{height:auto} .product_info .col50 .read_more.show:after{Display:None} } @media only screen and (max-width: 700px) { .contact_bar .orange_bg {position:relative;} .contact_bar .wrap .col66 { width:50% } .contact_bar .orange_bg .col66 { width:100% ; padding: 30px 30px 0%;} .contact_bar .orange_bg .col33 { width: 75%; bottom:0; right:0; padding: 0 30px 0px 0px;} } @media only screen and (max-width: 600px) { html, body{font-size:18px} h1, .h1{font-size:40px;} h2, .h2{font-size:28px;} h3, .h3{font-size:24px;} h4, .h4{font-size:22px;} h5, .h5{font-size:20px;} h6, .h6{font-size:18px;} .wrap { width: calc(100% + 20px); margin: 0 -10px;} .wrap .col16{width:calc(16.666% - 20px); margin: 0 10px;} .wrap .col25{width:calc(25% - 20px); margin: 0 10px;} .wrap .col33{width:calc(33.3333% - 20px); margin: 0 10px;} .wrap .col40{width:calc(40% - 20px); margin: 0 10px;} .wrap .col50{width:calc(50% - 20px); margin: 0 10px;} .wrap .col60{width:calc(60% - 20px); margin: 0 10px;} .wrap .col66{width:calc(66.666% - 20px); margin: 0 10px;} .wrap .col75{width:calc(75% - 20px); margin: 0 10px;} .wrap .col100{width:calc(100% - 20px); margin: 0 10px;} .hero .hero_content .hero_text .pretitle{font-size:28px} .hero .wrap .col33{width:calc(100% - 20px)} .categories .category_item.col33{width:calc(50% - 20px); margin-bottom:20px} .about .text_img_block .col50{width:calc(100% - 20px)} .latest_products .product_item { margin: 0 10px;} .footer .wrap .col16{width:calc(50% - 20px);} .footer .wrap .col33{width:calc(100% - 20px); } .text_block .wrap .col66{width:calc(100% - 20px); margin-bottom:30px } .text_block .wrap .col33{width:calc(100% - 20px); text-align:center} .product_list .wrap .col25{width:calc(50% - 20px); margin-bottom:20px} .news_list .wrap .news_item {width:calc(50% - 20px); margin-bottom:20px} .tax_text_block .col66{width:calc(100% - 20px)} .tax_text_block .col33{width:calc(100% - 20px); } .news_page .wrap .col33, .news_page .wrap .col66{width:calc(100% - 20px);} .product_info .col50{width:calc(100% - 20px);} .team_block .wrap .team_member{width:calc(50% - 20px)} .content_text_block .wrap .col33{width:calc(100% - 20px)} .content_text_block .wrap .col66{width:calc(100% - 20px)} .search_list .search_item .flexbox{flex-direction: column-reverse;} .search_list .search_item .col25{width:calc(100% - 20px)} .search_list .search_item .col75{width:calc(100% - 20px)} } @media only screen and (max-width: 500px) { .header .right .btn {margin-right:10px} .header .right .btn img {width: 30px;} .header .logo{margin-right:10px} .text_block { padding: 50px 0;} .about { margin-bottom: 50px;} .categories { padding: 30px 0;} .text_block { margin-bottom: 20px;} .latest_products { padding: 30px 0;} .tax_text_block { margin-bottom: 30px;} .content_text_block { margin-bottom: 30px;} .content_text_block .wrap .col66 { margin-bottom: 20px; } .footer .bottom { padding: 20px 0;} .quote { margin-bottom: 50px;} } @media only screen and (max-width: 450px) { h1, .h1{font-size:35px;} h2, .h2{font-size:24px;} h3, .h3{font-size:22px;} h4, .h4{font-size:20px;} h5, .h5{font-size:19px;} h6, .h6{font-size:18px;} .btn.l_btn{padding: 15px 20px; font-size:18px; } .hero .hero_content .hero_text .pretitle{font-size:24px} .categories .category_item .h2{ font-size:20px;} .product_list .wrap .col25{width:calc(100% - 20px); margin-bottom:20px} .news_list .wrap .news_item {width:calc(100% - 20px);} .product_info .specs .spec { line-height: 1.5;} .product_info .specs .spec .label{width:100%; font-weight:700} .product_info .specs .spec .value{width:100%} .team_block .wrap .team_member{width:calc(100% - 20px)} } @media only screen and (max-width: 400px) { .header .menu_btn span{display:none} .header .menu_btn{margin-left:20px} .categories .category_item .inner{padding: 10px} .footer .border .logo { width: 80px; height: 80px;} .footer .wrap .col16:nth-of-type(2n){width:calc(40% - 20px);} .footer .wrap .col16:nth-of-type(2n -1){width:calc(60% - 20px);} } @media only screen and (max-width: 350px) { .footer .wrap .col16:nth-of-type(2n){width:calc(100% - 20px);} .footer .wrap .col16:nth-of-type(2n -1){width:calc(100% - 20px);} } @media print { html, body { page-break-after: avoid; page-break-before: avoid; border: 1px solid white; height: 99%;} div{display:block; width:100%} }