body{
font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
overflow-x: hidden;
}
header{position: relative; z-index: 99;}
input,textarea,select{outline:0;}
.container{position: relative;}
a:hover{text-decoration: none;}
.col-10{width: 10%;}
.col-20{width: 20%;}
.col-30{width: 30%;}
.col-35{width: 35%;}
.col-40{width: 40%;}
.col-50{width: 50%;}
.col-60{width: 60%;}
.col-65{width: 65%;}
.col-70{width: 70%;}
.col-80{width: 80%;}
.col-90{width: 90%;}
.col-100{width: 100%;}
.col-10,.col-20,.col-30,.col-35,.col-40,.col-50,.col-60,.col-65,.col-70,.col-80,.col-90,.col-100{float: left;}
.clear{clear: both;}
.TextAlign-center{text-align: center;}
.MarginTB50{margin: 50px 0;}
.Header{
position: absolute;top: 0;
width: 100%;
padding: 10px 0;
background-size: cover;
background-repeat: no-repeat;
}
.Header .navbar-default {
background-color: transparent;
border:none;
}
.Header .navbar-default .navbar-nav>li>a {
text-align: center;
color: #1a1a1a;
font-weight: bold;
}
.Header .navbar-default .navbar-nav>li.active>a {
color: #ec1b23;
}
.Header .nav>li>a {
padding: 20px 28px;
margin-top: 20px;
}
.navbar-brand {
position: absolute;
width: 100%;
left: 0;
top: 0;
text-align: center;
margin: auto;
padding: 0;
}
.navbar-toggle {
z-index: 1;
}
.navbarLogo {width: 120px;height: auto;}
.navbar-default .navbar-nav>.active>a,
.navbar-default .navbar-nav>.active>a:hover,
.navbar-default .navbar-nav>.active>a:focus,
.navbar-default .navbar-nav>.active>a:active {
color: #ec1b23;
background-color: transparent;
}
.flexContent{
display: flex;
}
.flexContent .right {
display: flex;
flex-direction: column;
flex: 1;
}
.flexContent .left {
flex: 2;
background: #000;
}
.flexContent .left .homegrid-lg{
cursor: pointer;
position: relative;
width: 100%;
height: 100%;
max-height: 500px;
}
.flexContent .right .homegrid-sm{
cursor: pointer;
position: relative;
width: 100%;
height: 100%;
max-height: 250px;
}
.homegrid-lg img,.homegrid-sm img{
position: absolute;
width: 100%;
height: 100%;
top: 0;left: 0;
object-fit:cover;
}
.flexContent .right .sm-box{max-height: 250px;}
.flexContent .right img{
width: 100%;
height: 100%;
max-height: 250px;
object-fit: cover;
}
.Intro{
width: 100%;float: left;padding: 80px 15px;
text-align: center;
}
.Intro h4{margin: 15px 0;font-weight: bold;font-style: italic;}
.Intro h2,.news h2{
margin: 0 0 30px 0;
font-size: 26px;
font-weight: bold;
color: #014da1;
letter-spacing: 2px;
text-align: center;
}
.Intro p{
margin: 0 auto 50px auto;
width: 100%;
max-width: 850px;
line-height: 160%;
color: #808080;
}
.Intro a{
text-decoration: none;
}
.styleBTN{
padding: 8px 16px;
background-color: #c0c0c0;
color: #5a5a5a;
text-decoration: none;
transition: background .2s ease-in-out;
-moz-transition: background .2s ease-in-out;
-webkit-transition: background .2s ease-in-out;
}
.BTN-HoverRed:hover{
background-color: #ec1b23;
color: #fff;
text-decoration: none;
}
.PhotoGrid{
width: 100%;
padding: 20px 0;
float: left;
}
.PhotoGrid img{
width: 100%;
height: 430px;
object-fit:cover;
}
.news{
width: 100%;float: left;
padding: 80px 0;
background-size: cover;
background-repeat: no-repeat;
}
.col-33Padding{
width: 33.33%;
float: left;
padding: 0 8px;
margin-bottom: 15px;
}
.newsContent{
width: 100%;
text-align: center;
}
.productCol{width: 25%;padding:10px;float: left;}
.newsContent img{
width: 100%;height: 197px;object-fit:cover;
}
.productCol img{
border: 1px solid #ddd;
padding: 10px;
width: 100%;height: 197px;object-fit:cover;
-webkit-box-shadow: 2px 3px 6px 0px rgba(140,140,140,1);
-moz-box-shadow: 2px 3px 6px 0px rgba(140,140,140,1);
box-shadow: 2px 3px 6px 0px rgba(140,140,140,1);
}
.newsContent h3,.productCol h3{
color: #1a1a1a; font-weight: normal; font-size: 18px;
text-align: center;
height: 35px;
overflow: hidden;
}
.newsContent p{
text-align: center;
color: #808080;
font-size: 14px;
margin-bottom: 30px;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 4;
-webkit-box-orient: vertical;
}
.borderBTN{
border: 1px solid #808080;color: #808080;
text-decoration: none;
padding: 5px 10px;
transition: background .2s ease-in-out;
-moz-transition: background .2s ease-in-out;
-webkit-transition: background .2s ease-in-out;
}
.borderBTN:hover{
text-decoration: none;
border: 1px solid #ec1b23;
background-color: #ec1b23;
color: #fff;
}
.footer{
width: 100%;float: left;
padding: 40px 0;
background-color: #f1f1f1;
text-align: center;
}
.footerLink{margin-top: 20px;}
.footer .footerLink a{
margin: 0 15px;color: #4d4d4d;
font-size: 13px;
}
.footer .footerLink a:hover{
color: #ec1b23;
text-decoration: none;
}
.socialMedia{
margin:25px 0;
}
.socialMedia a{margin: 0 10px;}
.subpageContent{
width: 100%;float: left;
margin-top: 120px;
min-height: 600px;
}
.greyBG{background-color: #f8f8f8;}
.ProductRow{width:100%; float: left;}
.ProductGrid-lg{
position: relative;
width: 66%;float: left;}
.ProductGrid-sm{width: 33.33%;float: left;}
.imgcontainer{width: 100%;float: left;padding: 10px;}
.downloadContainer{width: 100%;float: left;}
.imgcontainer img{object-fit:cover;border: 1px solid #ddd;}
.ProductGrid-lg .imgcontainer img{width: 100%;height: 420px;}
.ProductGrid-sm .imgcontainer img{width: 100%;height: 200px;}
.Video-Wrapper{padding: 10px;}
.videocontainer {
position: relative;
width: 100%;
height: 100%;
padding-bottom: 56.25%;
}
.productvideo{
cursor: pointer;
position: absolute;
width: 100%;height: 100%;
object-fit:cover;
bottom: 0;left: 0;
padding: 10px;
padding-bottom: 0;
}
.video {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 420px;
}
.Home-lg-Video{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
max-height: 500px;
}
.Home-sm-Video{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
max-height: 250px;
}
.dataContainer{
width: 100%;
float: left;
padding: 10px;
}
.dataContent{
background-color: #f1f1f1;
padding: 20px;
height: auto;
}
.dataContent h2{
font-size: 20px;
margin: 0;
font-weight: bold;
margin-bottom: 15px;
color: #333333;
}
.dataContent p{line-height: 220%;color: #333333;}
.otherIMG{width: auto;height: 70px;}
.downloadContent{
position: relative;
text-align: center;
padding: 20px;
background-color: #f1f1f1;
color: #999999;
width: 100%;height: 200px;
transition: background .2s ease-in-out;
-moz-transition: background .2s ease-in-out;
-webkit-transition: background .2s ease-in-out;
}
.downloadContent:hover{
background-color: #014da1;
color: #fff;
}
.product-downloadContainer{padding: 10px;}
.myIcon{font-size: 60px;line-height:0}
.download{
width: 100%;
position: absolute;
margin: auto;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.scrollToTop{
text-align:center;
font-weight: bold;
color: #444;
text-decoration: none;
position:fixed;
bottom:20px;
right:20px;
display:none;
}
.scrollToTop:hover{text-decoration:none;}
.scrollToTop img{width: 30px;height: auto;}
.about,.contacts{
width: 100%;
float: left;
}
.aboutBanner{
width: 100%;
padding: 40px 0;
background-size: cover;
color: #fff;text-align: center;
background-repeat: no-repeat;
margin-bottom: 20px;
}
.aboutBanner h2{margin: 5px;}
.about .aboutBanner p{text-align: center;}
.about h3{
font-size: 18px;font-weight: bold;margin: 10px 0;
}
.about p{
font-size: 14px;line-height: 180%;
text-align: left;
}
.pageContainer{
width: 100%;
float: left;
}
.npageContainer h3{text-align: left;margin: 10px 0 30px 0;}
.pageNoContainer{
width: 100%;float: left;
text-align: right;
padding: 10px;
margin: 30px 0;
}
.pageNoContainer a{
padding: 5px 8px;
background-color: #fff;
color: #222;
transition: background .2s ease-in-out;
-moz-transition: background .2s ease-in-out;
-webkit-transition: background .2s ease-in-out;
}
.pageNoContainer a:hover,.pageNoContainer a.active{
text-decoration: none;
background-color: #ec1b23;
color: #fff;
}
.download-IMG{
position: relative;
float: left;
width: 100%;max-height: 200px;
}
.download-IMG img{width: 100%;height: 200px;object-fit:cover;}
.download-IMG-Title{
position: absolute;bottom: 0;left: 0;
width: 100%;
color: #fff;
padding: 8px 5px;background-color: rgba(0,0,0,0.5);
}
.Links{width: 100%;float: left;padding: 20px 0;border-bottom: 1px solid #ddd;}
.linksIMG{width: 30%;float: left;}
.linksIMG img{width: 100%;height: auto;}
.linkscontent{width: 70%;float: left;padding: 0 15px;}
.linkscontent h2{font-size: 20px;margin: 0 0 10px 0}
#map{width: 100%;height: 400px;margin-bottom: 30px;}
.contactForm{
width: 68%;float: left;
margin-left: -10px;
}
.contactForm h2,.Findus h2{margin: 10px 0 10px 10px;font-size: 20px;}
.contactForm input[type="text"]{
padding: 6px;
width: 100%;
margin: 0 0 20px 0;
}
.contactForm textarea{
width: 100%;padding: 6px;
min-height: 150px;
resize:none;
}
.contactForm input[type="submit"]{
margin: 20px 0;
padding: 6px 18px;
border:1px solid #cccccc;
background-color: #cccccc;
color: #707070;
transition: background .2s ease-in-out;
-moz-transition: background .2s ease-in-out;
-webkit-transition: background .2s ease-in-out;
}
.contactForm input[type="submit"]:hover{
background-color: #ec1b23;
color: #fff;
border:1px solid #ec1b23;
}
.contactForm .col-50, .contactForm .col-100{padding: 0 10px}
.Findus{width:32%;float: left;margin-left: -10px;}
.FindusContent{padding: 0 10px;width: 100%;line-height: 180%;}
.location{
position: relative;
width: 100%;padding: 15px 0;
text-align: center;float: left;
clear: both;
color: #014da1;
}
.location h2{margin: 0 0 0 0;text-align: left;font-size: 24px;}
.location a{color: #888;}
.locationLink{position: absolute;top: 12px;right: 0;}
.myicon{position: relative;top: 2px;}
.GridLocation{
padding:5px 10px 10px 15px;
}
.newsDetailIMG img{
float: left;
width: 100%;
max-height: 300px;
margin-bottom: 20px;
object-fit:cover;
}
.newsDetails{width: 100%;float: left;}
.ProductFilter{
width: 100%;float: left;
padding: 5px 8px 20px 8px;
}
.ProductFilter select{
padding: 8px;
width: 200px;
margin-right: 20px;
border:1px solid #ddd;
}
.ProductFilter input[type="submit"]{
padding: 8px 15px;
background-color: #ec1b23;
color: #fff;
border: 0;
}