@font-face {font-family: barlow_thin;src: url(./../fonts/Barlow-Thin.ttf);}
@font-face {font-family: barlow;src: url(./../fonts/Barlow-Regular.ttf);}
@font-face {font-family: barlow_semibold;src: url(./../fonts/Barlow-SemiBold.ttf);}
@font-face {font-family: barlow_bold;src: url(./../fonts/Barlow-Bold.ttf);}
@font-face {font-family: inter;src: url(./../fonts/inter.ttf);}
@font-face {font-family: inter_semibold;src: url(./../fonts/Inter-SemiBold.ttf);}
@font-face {font-family: gothic;src: url(./../fonts/gothic.ttf);}
@font-face {font-family: gothic_bold;src: url(./../fonts/gothic_bold.ttf);}
@font-face {font-family: eurostileLT_thin;src: url(./../fonts/eurostileLT-Demi_thin.ttf);}
@font-face {font-family: eurostileLT;src: url(./../fonts/eurostileLT-Demi.otf);}

body {background: #fff;margin: 0;padding: 0;font-family: barlow;overflow-x: hidden;color: #000;font-size: 18px;}
a, a:hover{ text-decoration: none;}
* {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; outline: none; transition: all 0.3s ease-in-out;}
*:before,*:after {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
h1,h2,h3,h4,h5, ul {margin: 0;padding: 0;display: block; letter-spacing: 0.5px;}

h1{font-size: 48px; line-height: 50px; font-family: SofiaPro_bold; text-transform: capitalize; text-align: center; margin-bottom: 10px; color: #fff; }

h2{font-family: eurostileLT_thin; color: #2f2f2f; text-transform: uppercase; font-size: 52px; margin-bottom: 25px; }
h2 span{font-family: eurostileLT; position: relative;}
h2:after {content: unset; }
h2 span:after { content: ""; height: 10px; width: 100%; background: #ddd; transform: skewX(-15deg);position: absolute;width: 100%;left: 9px;bottom: 7px; z-index: -1;}

h3{font-family: eurostileLT; color: #2f2f2f; text-transform: uppercase; font-size: 48px; line-height: 48px; margin-bottom: 25px; }
h3 strong{width: 100%; display: inline-block;font-family: eurostileLT; }
h3 span{  font-family: eurostileLT_thin; font-weight: 100; position: relative;}
h3 span:after { content: ""; height: 10px; width: 90%; background: #ddd; transform: skewX(-15deg);position: absolute; left: 0; bottom: 0; z-index: -1;}

.pageTitle {
  margin-top:50px;
  padding-bottom: 25px;
}

.info-row {
  padding:25px 10px;
  width:100%;
  text-align: center;  
  display:block;
}

.info-row:nth-child(odd) {
  background-color:rgb(231, 233, 231);
  border-radius: 10px;
}

h4{font-size: 27px; font-family: eurostileLT_thin; font-weight: 100; text-transform: uppercase; }
h4 strong{font-family: eurostileLT; }
.mt-5{margin-top: 50px;}

.nav-bar { height: 20px; background-color:#b60e0e; border-bottom: solid #fff 2px; }

p{font-size: 16px; line-height: 30px; font-family: inter; color: #4e4e4e}
ul{padding: 0; list-style: none;}
.btn{font-size: 19px; text-transform: uppercase; color: #fff; font-family: inter_semibold; padding: 20px 10px; min-width: 230px; display: inline-flex; justify-content: center; }
.btn img {margin-left: 10px;}
.btn-red{ background-color: #b60e0e;}
.btn-skew{ transform: skewX(-30deg); border-right: 10px solid #ddd;}
.btn-skew span{ transform: skewX(30deg); display: flex; align-items: center;}
.btn-yellow{ background-color: #feec00; color: #000; }
.btn-bordered{background: transparent; border: 2px solid #cf142b; color: #cf142b; font-size:14px; padding: 8px 10px; min-width: 150px; }
.btn-gradient{background: linear-gradient(to right, #feeb00 0%, #cf152b 100%); color: #fff; border: 0; font-size:23px; padding: 15px 10px; min-width: 300px; }
.btn-default{border: 2px solid #fff; background: transparent;}
.d_block{display: block;}
.text_italic {font-family: GreatVibes; display: block; }
.text_red {color: #c00306;}
@media screen and (max-width: 1079px) {p{font-size: 16px; line-height: 24px;}}

.container-fluid{width: 100%; }
.container{width: 100%; max-width: 1440px; margin: 0 auto; padding-left: 15px; padding-right: 15px;}
@media screen and (max-width: 1470px) {.container{max-width: 1280px}}    
@media screen and (max-width: 1299px) {.container{max-width: 1080px}}    
@media screen and (max-width: 1079px) {.container{max-width: 980px}}
.row{display: flex; width: 100%;}
@media screen and (max-width: 991px) {.row{flex-wrap: wrap;}}
.text-center{text-align: center;}
.d-flex{display: flex;}
.align-item-center{align-items: center;}
.justify-content-center{justify-content: center;}
[class*="col-"] { padding: 10px; }
.col-1{flex:0 0 auto;width:8.33333333%}
.col-2{flex:0 0 auto;width:16.66666667%}
.col-3{flex:0 0 auto;width:25%}
.col-4{flex:0 0 auto;width:33.33333333%}
.col-5{flex:0 0 auto;width:41.66666667%}
.col-6{flex:0 0 auto;width:50%}
.col-7{flex:0 0 auto;width:58.33333333%}
.col-8{flex:0 0 auto;width:66.66666667%}
.col-9{flex:0 0 auto;width:75%}
.col-10{flex:0 0 auto;width:83.33333333%}
.col-11{flex:0 0 auto;width:91.66666667%}
.col-12{flex:0 0 auto;width:100%}

.topHeader{padding: 13px 0; background: #535353;}
.topHeader .row {align-items: center;justify-content: space-between;}
.topHeader a {color: #fff; font-size: 17px; line-height: 17px;}
.topHeader .tEmail a {line-height: 22px;display: flex;align-items: center;}
.topHeader .tEmail a img { margin-right: 5px }
.topHeader ul {display: flex;}
.topHeader li { padding-left: 15px; padding-right: 15px; }
.topHeader li + li {border-left: 1px solid rgba(255, 255, 255, .5); }

#nav {margin-left: 80px;}
.tLogo img {width: 100%; max-width: 320px;}
.navigation{background: linear-gradient(to right, #fff 80%, #b50e0e 20%); position: relative; width: 100%; display: flex;position: -webkit-sticky;position: sticky;top: 0; z-index: 999;}
.navigation .row{align-items: center; background-color: #fff;}
.nav_menu{display: flex; width: 100%;}
.nav_menu > ul{width: 100%; display:flex !important; align-items:center; justify-content: center;}
.nav_menu > ul > li > a{text-transform: uppercase; display: flex; font-size: 18px; color: #000; font-family: inter; padding: 23px 0 21px; border-bottom: 2px solid #fff; }
.nav_menu > ul > li > a.active{border-color: #b50e0e; }
.nav_menu > ul > li {padding: 0 25px; position: relative;}
.nav_menu > ul > li:first-child {padding-left: 0;}
.nav_menu > ul > li:last-child {padding-right: 0;}
.nav_menu > ul ul a {text-transform: capitalize; white-space: nowrap; line-height: 20px; padding: 10px 0; float:left; width:100%;color: #fff; font-size: 16px; }

.callTo, .callTo span{position: relative; text-align: right; font-family: gothic; line-height: 20px;}
.callTo span{padding-left: 20px; z-index: 3; position: relative;}
.callTo:before{ content:"";height: 100%; position: absolute; z-index: 2; left: 0; right: 0; top:0; width: 200%; background-color: #b50e0e; transform: skewX(-15deg); }
.callTo:after{ content:"";height: calc(100% - 25px); z-index: 1; position: absolute; left: -12px; right: 0; bottom:0; width: 50px; background-color: #dbdbdb; transform: skewX(-15deg); }
.callTo, .callTo a{ color: #fff;}
.callTo {display: flex;justify-content: center;align-items: center;height: 115px; margin-left: 51px;}
.callTo a {display: flex;align-items: center; font-size: 22px; font-family: gothic_bold;}
.callTo a img{margin: 5px 5px 0 0;}

/* Slider */
.slick-slider {position: relative;display: block;box-sizing: border-box;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;-webkit-touch-callout: none;-khtml-user-select: none;-ms-touch-action: pan-y;touch-action: pan-y;-webkit-tap-highlight-color: transparent;}
.slick-list {position: relative;display: block;overflow: hidden;margin: 0;padding: 0;}
.slick-list:focus {outline: none;}
.slick-list.dragging {cursor: pointer;cursor: hand;}
.slick-slider .slick-track,
.slick-slider .slick-list {
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
-o-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.slick-track {position: relative;top: 0;left: 0;display: block;margin-left: auto;margin-right: auto;}
.slick-track:before, 
.slick-track:after {display: table;content: '';}
.slick-track:after {clear: both;}
.slick-loading .slick-track {visibility: hidden;}
.slick-slide {display: none;float: left;min-height: 1px;}
[dir='rtl'] .slick-slide {float: right;}
.slick-slide.slick-loading img {display: none;}
.slick-slide.dragging img {pointer-events: none;}
.slick-initialized .slick-slide {display: block; position: relative}
.slick-loading .slick-slide {visibility: hidden;}
.slick-vertical .slick-slide {display: block;height: auto;border: 1px solid transparent;}
.slick-prev, .slick-next {font-size: 0;line-height: 0;position: absolute;z-index: 99; border: 0; top: 50%;display: block;width: 40px;height: 40px;padding: 0;-webkit-transform: translate(0, -50%);-ms-transform: translate(0, -50%);transform: translate(0, -50%);cursor: pointer;color: transparent;outline: none;background: transparent; opacity: 0.8;}
.slick-prev:hover, .slick-next:hover{opacity: 1;}
.slick-prev {left: 60px;background: url(../images/arrow.png) no-repeat center;transform: rotate(180deg) translateY(50%);}
.slick-next {right: 60px;background: url(../images/arrow.png) no-repeat center;}

.slider {position: relative;}

@media screen and (min-width: 768px) {
#menu-button{display: none;}
.nav_menu > ul ul {display: none !important;}
.nav_menu > ul .has-sub:hover ul {display: block !important;}
.nav_menu > ul > li.has-sub ul{position: absolute;top: 100%;padding: 15px 0; z-index: 999;background: #c5081f;}
.nav_menu > ul ul a { padding: 5px 15px; }
.nav_menu > ul ul a:hover { background-color: #cf142b; }
.nav_menu > ul > li.has-sub > a { padding-right: 15px; background-image: url(./../images/downArrow.png); background-position: right center; background-repeat: no-repeat;}
}

.slider{text-align: center;}
h1{font-family: eurostileLT_thin; font-weight: 100; text-transform: uppercase; font-size: 65px; line-height: 65px; color: #fff;}
h1 span {font-family: eurostileLT;font-size: 76px; display: block; color: rgba(0,0,0,0); -webkit-text-stroke-width: 2px; -webkit-text-stroke-color: white;}
.sliderContent {position: absolute;top: 0;left: 0;height: 100%;width: 100%;display: flex;justify-content: center;align-items: center;}
.slider p {font-size: 23px; color: #fff; max-width: 500px; margin: 0 auto 20px; }
.slick-slide > img { width: 100%; height: 786px; object-fit: cover; object-position: center;}

.squareBoxRow{display: block; padding: 0 0 170px; margin-top: -140px; }
.squareBoxes .row {justify-content: center; align-items: center; }
.box{zoom:0.8; height: 380px; width: 380px; transform: rotate(45deg); display: flex;justify-content: center;align-items: center;flex-direction: column; }
.box.active{zoom:1; background: #b50e0e; position: relative; z-index: 1; border: 7px solid #fff; margin: 0 30px; }
.boxSubdiv{ position: relative; z-index: 1; height: 381px; width: 381px; transform: rotate(-45deg); display: flex;justify-content: center;align-items: center;flex-direction: column; padding: 0 70px; }
.boxSubdiv, .boxSubdiv p{color: #fff;}
.boxSubdiv p{ line-height: 24px;}
.boxTitle{font-family: eurostileLT_thin; font-size: 31px; line-height: 26px; text-transform: uppercase;}
.boxTitle span {font-family: eurostileLT;}
.box:after{content: ""; height: 100%; width: 100%; position: absolute; opacity: 0.2; left: 0; top: 0; }
.ourProductBox { background: #2e2e2e; }
.ourProductBox:after { background: url(./../images/manyWaysBg.jpg) no-repeat; background-size: cover; background-position: center; }
.manyways { background: #b50e0e; }
.manyways:after{background: url(./../images/manyWaysBg.jpg) no-repeat;}
.steelFabrication { background: #646464; }
.steelFabrication:after{background: url(./../images/manyWaysBg.jpg) no-repeat;}

.squareBoxes {padding-bottom: 100px;}
.squareRow{text-align: center; max-width: 991px; margin: 0 auto; }
.caption{ font-family: eurostileLT_thin; letter-spacing: 2px; text-transform: uppercase; font-size: 25px; color: #b30d0c; }
.font-26{font-size: 26px; line-height: 40px;}
.squareRow p {margin-bottom: 30px;}
.sfContent{padding: 0 50px}
.sfContent p {font-size: 20px;}

.stSteelFabrication{padding: 100px 0;}
.stSteelFabrication .row {align-items: center;}
.sfPic {flex: 0 0 50%; padding: 0 50px;}
.sfPicDiv{width: 100%; position: relative; }
.sfPicDiv img{ display: block; max-width: 100%; }
.sfPicDiv span {position: absolute; right: -50px; bottom: -20px;}

.ourProducts{padding: 50px 0 100px; background: linear-gradient(120deg, #e9e9e9 70%, #d5d5d5 30%); }
.ourProducts h2{font-weight: 100; text-align: center; width: 100%; position: relative; padding-bottom: 25px;}
.ourProducts h2:after{content: ""; width: 70px; height: 5px; background-color: #b50e0e; position: absolute; left: calc(50% - 35px); bottom: 10px;}
.ourProducts .row{width: 100%;}
.ourProductsRow{ display: flex; flex: 0 0 100%; flex-wrap: wrap; justify-content: center; }
.ourProducts h4 {position: relative; display: block;}
.ourProducts h4:after {content: ""; width: 70px; height: 3px; background: #bcbcbc; position: absolute;bottom: -10px; left:calc(50% - 35px); }
.ourProducts p {font-size: 20px; font-family: inter;}
.ourProducts a {font-size: 15px; color: #b40e0e; font-family: inter; text-transform: uppercase; text-decoration: underline;}
.prodPic {display: block;}
.prodPic img { width: 100%; height: 303px; object-fit: cover; object-position: center;}
.prodContent{ position: relative; text-align: center; background: #fff; width: calc(100% - 40px); display: block; margin: -60px auto 0; padding: 25px 40px;}
.prod {flex: 0 0 30%;margin: 20px 1.66%;}

h5{font-size: 35px; font-family: eurostileLT; color: #fff; margin-bottom: 20px; padding-bottom: 7px; position: relative; text-transform: uppercase;}
h5::after{content: ""; position: absolute; height: 3px; width: 75px; background: #fff; left: 0; bottom: 0; }
.requestQuote{background: url(./../images/requestQuote.jpg) no-repeat center left; background-size: 60%; }
.requestQuoteBg{background: linear-gradient(110deg, transparent 45%, #b11c1c 45%);}
.emptyDiv, .requestQuoteForm{ flex: 0 0 50%; }
.requestQuoteForm {padding: 100px 50px;}
.form-row{display: flex;}
.form-row .form-group{flex: 0 0 50%; }
.form-group {position: relative; padding: 3px 5px; }
.form-group span {position: absolute; left: 18px; top: 14px; color: #fff;}
.form-control {border: 1px solid #fff; font-family: barlow; font-size: 18px; color: #fff; width: 100%; padding: 10px; background: transparent; padding-left: 40px; }
textarea.form-control { padding-left: 10px; }
.form-control::-webkit-input-placeholder { color: #fff;}
.form-control:-ms-input-placeholder {color: #fff;}
.form-control::placeholder {color: #fff;}
input[type="submit"] {color: #fff; background: #5c0707; cursor: pointer; text-transform: uppercase; font-family: inter_semibold; font-size: 19px; margin-top: 15px; padding: 16px 46px; border: 2px solid #5c0707; }
input[type="submit"]:hover {background: transparent; border: 2px solid #5c0707; }

.fSocial{ display: flex; align-items: center; width:100%; margin: 0; padding: 0;}
.fSocial a {height:39px; width: 38px; display: flex; margin: 0 3px;}
.fSocial .fb{background: url(./../images/social_stripe.png) no-repeat 0 0;}
.fSocial .fb:hover{background: url(./../images/social_stripe.png) no-repeat 0 -39px;}
.fSocial .twitter{background: url(./../images/social_stripe.png) no-repeat -45px 0;}
.fSocial .twitter:hover{background: url(./../images/social_stripe.png) no-repeat -45px -39px;}
.fSocial .youtube{background: url(./../images/social_stripe.png) no-repeat -89px 0;}
.fSocial .youtube:hover{background: url(./../images/social_stripe.png) no-repeat -89px -39px;}
.fSocial .insta{background: url(./../images/social_stripe.png) no-repeat -133px 0;}
.fSocial .insta:hover{background: url(./../images/social_stripe.png) no-repeat -133px -39px;}

.footer{background: linear-gradient(110deg, #fff 35%, #232323 35%); display: flex; flex-direction: column; position: relative;}
.footer:after{content: ""; background: url(./../images/footerShadow.png) no-repeat; background-size: cover; background-position: center; position: absolute; height: 100%; width: 100%; }
.footer .container, .footer > p {position: relative; z-index: 1;}
.fDetail {flex: 0 0 40%; padding-top: 125px; padding-bottom: 50px; }
.fDetailContent{max-width: 350px}
.fLogo{color: #3a3a3a; font-family: eurostileLT; font-size: 38px;}
.fLogo span{color: #b62121}
.fLogoCaption{color: #3a3a3a; font-family: eurostileLT_thin; font-size: 18px;}
.fDetail p {font-size: 14px; line-height: 17px; }

.fQuickLinks{width: 20%; padding-top: 125px; padding-bottom: 50px;}
.fTitle{ position: relative; text-transform: uppercase; color: #fff; font-size: 18px; font-family: inter_semibold; padding-bottom: 10px; margin-bottom: 25px;}
.fTitle:after{content: ""; height: 2px; width: 35px; position: absolute; background: #fff; bottom: 0; left: 0; }
.fQuickLinks li{margin-bottom: 10px;}
.fQuickLinks, .fQuickLinks a { color: #fff; }
.fQuickLinks a:hover {color: #c41f1a;}
.fContact li{display: flex; align-items: center; margin-bottom: 20px; }
.cuIcon { margin-right: 10px }
.fContact li div {font-size: 15px; display: flex; flex-direction: column; text-transform: uppercase;}
.fContact li div span{ font-size: 20px; font-family: barlow_bold; margin-top: 3px; }
.fContact li div a{text-transform: lowercase; margin-top: 3px; word-break: break-all; }
.footer > p {color: #e4e4e4; font-size: 14px; text-align: center; font-family: inter; border-top: 1px solid rgba(228, 228, 228, .3); padding: 25px 0; }

.manyWaysSec{position: relative; background: url(./../images/manywaysBg.jpg) no-repeat center left; background-size: cover;}
.manyWaysSecBgPic{background: url(./../images/maywaysPic.png) no-repeat; background-size: auto 750px; background-position: 100% 50%;  padding: 140px 0;}
.manyWaysSec .row {align-items: center;}
.manyWaysTitle {font-size: 50px; font-family: eurostileLT; text-transform: uppercase; background: url(./../images/manyWaysTitle_bg.png) no-repeat center right; padding: 10px 50px 10px 20px; color: #fff; margin-left: -20px; margin-bottom: 10px; }
.maywaysContent {max-width: 510px; display: flex;flex-direction: column;align-items: flex-start;}
.maywaysContent p{font-size: 23px;}
.maywaysContent p{font-family: barlow; margin-bottom: 0;}
.maywaysContent p.strong{font-family: barlow_semibold;}
.maywaysContent p.thin{font-family: barlow_thin;}
.maywaysContent a {margin-top: 50px;}
.maywaysPic img{height: 775px; width: 100%; display: block; object-fit: cover; object-position: left;}

.gallery {padding: 50px 0 100px}
.gallery h2{font-weight: 100; text-align: center; width: 100%; position: relative; padding-bottom: 25px;}
.gallery h2:after{content: ""; width: 70px; height: 5px; background-color: #b50e0e; position: absolute; left: calc(50% - 35px); bottom: 10px;}
.gallery h2 span:after{content: unset;}
.groupWrap{display: flex; flex-wrap: wrap; transform: skewX(-10deg); width: 90%; margin: 0 auto; }
.yBox { position: relative; width: calc(25% - 1%); display: inline-block; flex: 0 0 calc(25% - 1%); margin: 0.5%; display: block; padding: 0 5px; overflow: hidden; }
.yBox:hover:after {content: ""; background: rgba(0, 0, 0, .3) url(./../images/zoomIcon.png) no-repeat center center ; height: 100%;width: 150%;left: -25%;top: 0;position: absolute; transform: skewX(10deg); }
.yBox img {width: 142%;height: 250px;margin-left: -21%;object-fit: cover;object-position: center; transform: skewX(10deg); display: block;}
.yBoxOverlay.active {z-index: 9999;}
.yBoxFrame, .yBoxImgZoom {background: transparent;}

@media screen and (max-width: 1920px ) {
.footer{background: linear-gradient(110deg, #fff 36%, #232323 36%)}
}
@media screen and (max-width: 1680px ) {
.footer{background: linear-gradient(110deg, #fff 35%, #232323 35%)}
}
@media screen and (max-width: 1470px ) {
#nav {margin-left: 50px;}
.nav_menu > ul > li > a {font-size: 16px;}
.nav_menu > ul > li { padding: 0 13px; }
.callTo a {font-size: 20px;}
.footer{background: linear-gradient(110deg, #fff 33%, #232323 33%)}
}
@media screen and (max-width: 1299px ) {
.tLogo img{max-width: 220px}
.callTo, .callTo span{font-size: 15px;}
.callTo a {font-size: 16px;white-space: nowrap;}
.nav_menu > ul > li > a{font-size: 14px;}
.sfPic {padding-left: 0}
.sfContent {padding-right: 0;}
.ourProducts p {font-size: 16px; line-height: 20px;}
.prodContent {padding: 25px 15px; width: calc(100% - 20px);}
.ourProducts h4:after {width: 50px; left: calc(50% - 25px)}
.footer{background: linear-gradient(110deg, #fff 32%, #232323 32%)}
.squareBoxRow {zoom: 0.8;}
.slick-slide > img {height: 686px;}
.manyWaysSecBgPic{background-position: 140% 50%;}
}
@media screen and (max-width: 1179px ) {
.manyWaysSecBgPic{background-position: 210% 50%;}
}
@media screen and (max-width: 1080px ) {
.callTo{height: 75px; font-size: 14px;}
.callTo a img {height: 20px}
.nav_menu > ul > li > a {padding: 19px 0; font-size: 13px;}
#nav, .callTo {margin-left: 30px;}
.nav_menu > ul > li{padding: 0 9px;}
h3{font-size: 36px; line-height: 36px;}
.sfPicDiv span img { max-height: 300px; }
h4{font-size: 20px;}
.requestQuote {background-size: cover;}
.requestQuoteBg{ background: rgba(177, 28, 28, .9);}
.emptyDiv {display: none;}
.requestQuoteForm {flex: 0 0 75%; margin: 0 auto;}
.footer{background: #232323;}
.footer .row {flex-wrap: wrap;}
.fDetail {flex: 0 0 100%; text-align: center; padding-bottom: 0;}
.fQuickLinks {flex: 0 0 33.33%;}
.fDetailContent {margin: 0 auto;}
.fSocial {justify-content: center;}
.fLogo, .fLogoCaption, .fDetail p {color: #fff;}
.fSocial a {background-color: #c41f1a !important; border-radius: 100%;}
.fSocial a:hover {background-color: #fff !important; border-radius: 100%;}
.boxSubdiv p {font-size: 20px;}
.groupWrap{width: 80%; margin: 0 auto;}
.yBox img {width: 140%;margin-left: -20%;height: 200px;object-fit: cover;object-position: center;}
.slick-prev img, .slick-next img {height: 25px;}
}
@media screen and (max-width: 991px ) {
.navigation {background: white;}
.callTo {height: 30px; width: 30px; margin-left: 20px; background-color: #c5081f; border-radius: 100%;}
.callTo span, .callTo a{font-size: 0; padding: 0;}
.callTo:before, .callTo:after {content: unset;}
.callTo, .callTo span {line-height: 0;}
.callTo a img {margin: 0}
.tLogo img {max-width: 158px;}
.sfPic{margin: 0 auto 50px;}
.sfContent {flex: 0 0 100%; padding-left: 0; text-align: center; }
.prodPic img {height: 200px;}
h1{font-size: 45px; line-height: 50px;}
h1 span{font-size: 56px;}
.boxSubdiv {width: 440px}
.box {zoom: 0.6;}
.box.active {zoom: 0.8;}
.box.active .boxSubdiv {width: 525px;}
.box.active .boxSubdiv .boxTitle{font-size: 35px; line-height: 38px;}
.box.active .boxSubdiv p{font-size: 24px; line-height: 28px;}
.box:not(.active) p {display: none;}
.box:not(.active) .boxTitle {margin-bottom: 25px;line-height: 36px;}
.slick-slide > img {height: 600px;}
.font-26 {font-size: 18px;line-height: 30px;}
.manyWaysTitle {font-size: 36px;}
.manyWaysSecBgPic {background-size: cover; padding: 100px 0; background-position: left center }
.manyWaysSecBgPic .container{position: relative; z-index: 1;}
.manyWaysSecBgPic:after {content: ""; position: absolute; top: 0;left: 0;width: 100%;height: 100%;background: rgba(255, 255, 255, .8);}
.maywaysContent p {font-size: 18px;}
.yBox {flex: 0 0 48%; margin: 1%;}
}
@media screen and (max-width: 767px ) {
#menu-button{background: url(./../images/menu.png) no-repeat; background-position: center; font-size: 0; height: 30px; width: 30px;  margin-left: auto; position: absolute; right: 0; top: -38px; }
.nav_menu{flex-direction: column;}
.nav_menu > ul{flex-direction: column; display: none !important; margin-top: 10px; margin-bottom: 15px; }
.nav_menu > ul > li > a{padding: 10px 10px; border: 0;}
.nav_menu > ul.open {display: flex !important; background: #ae2519;}
.callTo {position: absolute; top: 11px; right: 65px;}
#nav{margin-left: auto; width: 100%; position: relative; }
.navigation .row {align-items: baseline; flex-direction: row;}
.tLogo {margin-top: 10px; margin-bottom: 5px;}
.sfPic{flex: 0 0 100%;}
.prod {flex: 0 0 45%;}
.prodContent {padding: 25px 10px;}
.prodPic img {height: 150px;}
.ourProducts p{font-size: 14px;}
.ourProducts a{font-size: 13px;}
.fDetail{padding-top: 100px;}
.fQuickLinks {flex: 0 0 100%; justify-content: center; text-align: center; padding-top: 50px; padding-bottom: 0; }
.fTitle:after{left: calc(50% - 17px);}
.fContact ul {justify-content: center;align-items: center;display: flex;flex-direction: column;text-align: left;}
.requestQuoteForm {flex: 0 0 100%; padding: 100px 0px}
.box, .boxSubdiv{transform: rotate(0deg)}
.box{zoom: 0.45;}
.box.active {margin: 0;}
.box:not(.active) .boxSubdiv {padding: 0 40px}
.box:not(.active) .boxTitle {font-size: 44px; line-height: 44px;}
h1 {font-size: 35px;line-height: 35px;}
h1 span {font-size: 36px;}
.slider p {font-size: 16px;}
.btn {font-size: 16px;padding: 15px 10px; min-width: 200px;}
.slick-slide > img {height: 500px;}
.squareBoxRow {margin-top: 0; padding-bottom: 70px; }
h2 {font-size: 36px;}
.caption {font-size: 20px;}
.font-26, .sfContent p {font-size: 16px; line-height: 26px;}
.nav_menu > ul > li {width: 100%;}
.nav_menu > ul li a, .nav_menu > ul ul a { color: #fff; text-align: center; align-items: center; justify-content: center;}
.has-sub ul {background: #921d13;display: flex;flex-direction: column;}
.topHeader a {font-size: 14px;}
.topHeader li {padding-left: 5px;padding-right: 5px;}
.manyWaysSecBgPic {padding: 60px 0;}
.groupWrap{width: 100%;}
.yBox{padding: 0;}
.groupWrap, .yBox img, .yBox:hover:after {transform: skew(0);}
.yBox img {width: 100%; margin: 0; height: 175px;}
}
@media screen and (max-width: 575px ) {
h5{font-size: 30px;}
.form-row {flex-direction: column;}
.sfPicDiv span img {max-height: 150px;}
.prod {flex: 0 0 100%; margin-left: 0; margin-right: 0;}
.box:not(.active) p {display: block; font-size: 22px; line-height: 30px; }
.box, .box.active {border: 0; zoom: 1;}
.box, .box.active .boxSubdiv {width: 100%; padding: 0 20px;}
.box:after {background-size: cover; background-position: center;}
.slick-slide > img {height: 400px;}
.squareBoxRow {margin-top: 20px;}
.stSteelFabrication {padding-bottom: 70px;}
.topHeader ul {display: none;}
.yBox img {height: 130px;}
}