body{padding:0; margin:0; font-size:18px; font-family: 'Gotham'; font-weight:normal; line-height:26px; color:#1c1c1a;}


/* Tag */

a:hover,
a:focus{outline:none; text-decoration:none;}
p{margin:0;}


.no-gutter > [class*='col-'] {
    padding-right:0;
    padding-left:0;
}



/* Typography */
h1{ font-size:32px; font-family: 'Gotham'; margin:0 0 10px; color:#ffffff; font-weight:bold; }
h2{ font-size:22px; font-family: 'Facit'; margin:0 0 10px; line-height:24px; font-weight: normal; color:#4d80a1;}
h3{font-size:18px; font-family: 'Gotham'; margin:0 0 10px; line-height:22px; font-weight:bold;}
h4{font-size:16px; font-family: 'Gotham'; margin:0 0 10px; line-height:20px; font-weight: normal;}

.small-t{ font-size:14px;}
.x-small-t{ font-size:12px;}

.font-nor{ font-weight:500;}

/* Letter Spacing */
.ls-2{letter-spacing:2px;}
.ls-3{letter-spacing:3px;}
.ls-6{letter-spacing:6px;}


/* Text Color */
.white-title{color:#ffffff;}
.blue-title{color:#99c9d9;}
.grey-title{color:#9a9a9b;}
.black-title{color:#1c1c1a;}

/* Text Inline */

.inline{display:inline;}
.list-none{list-style-type:none;}
.list-inside{padding-left:20px; margin:0;}
.list-inline {margin: 0; padding-left: 0;}
.list-inline > li {padding:0 10px;}


.bdr {position:relative;}
.bdr:before {background:#4d81a2; content:""; position:absolute; right:0; width:2px; height:100%;}
.about .bdr:before{background:#c7cacb; right:40px;}


/* Overflow */

.overflow{overflow:hidden;}


/* Backfround Color */

.grey6-bg{background-color: #666666; padding: 30px;}
.grey-bg{ background:#999999;}
.blue-bg{ background:#007aa2;}
.black-bg{background:#000000;}
.pettent-bg{background:url(../images/pattent.png) repeat-y 0 0; width:100%; background-size:100%; overflow:hidden;}
.paralex{background:url(../images/paralex.jpg) no-repeat center center; background-attachment:fixed; height:100%; width:100%; background-size:cover;}
.min-height{height:500px;}

/* Margin */

.m-0{margin:0;}
.mt-2{margin-top:-2px; position:relative;}
.mt-30{margin-top:30px;}
.mt-50{margin-top:50px;}
.mb-40{margin-bottom:40px;}
.mb-50{margin-bottom:50px;}
.mb-60{margin-bottom:60px;}

/* Section Padding */
.pd-0{padding:0;}
.pb-0{padding-bottom:0;}
.pl-20{padding-left:20px;}
.pd-30{padding:30px;}
.pd-40{padding:40px;}
.page-section-ptb{ padding:80px 0px;}
.pd-tb-30{padding:30px 0;}


/* Button */

.big-btn{background:#0079a0;  border-radius:0; border:none; font-size:25px; font-weight:bold; font-family: 'Facit'; padding:20px 90px; line-height:72px;}
.medium-btn{background:#0079a0;  border-radius:0; border:none; font-size:22px; font-weight:500; font-family: 'Facit'; padding:18px 40px;}
.small-btn{background:#dd2437; padding:25px 20px; border-radius:0; border:1px solid #1e6e93; color:#ffffff; font-size:18px; width:15%; position: absolute; right: 15px; bottom:0;}
.big-btn:hover,
.medium-btn:hover{background:#ffffff; color:#0079a0;}
.medium-btn:hover span{background:url(../images/arrow-hover.png) no-repeat 0 0;}



/* Font Face */

@font-face {
	font-family: 'Gotham';
	src: url('../fonts/GothamMedium.eot');
	src: url('../fonts/GothamMedium.eot?#iefix') format('embedded-opentype'),
		url('../fonts/GothamMedium.woff') format('woff'),
		url('../fonts/GothamMedium.ttf') format('truetype');
	font-weight: 500;
	font-style: normal;
}


@font-face {
	font-family: 'Gotham';
	src: url('../fonts/GothamBold.eot');
	src: url('../fonts/GothamBold.eot?#iefix') format('embedded-opentype'),
		url('../fonts/GothamBold.woff') format('woff'),
		url('../fonts/GothamBold.ttf') format('truetype');
	font-weight: bold;
	font-style: normal;
}

@font-face {
	font-family: 'Gotham';
	src: url('../fonts/Gotham-Book.eot');
	src: url('../fonts/Gotham-Book.eot?#iefix') format('embedded-opentype'),
		url('../fonts/Gotham-Book.woff') format('woff'),
		url('../fonts/Gotham-Book.ttf') format('truetype');
	font-style: normal;
}

@font-face {
	font-family: 'Facit';
	src: url('../fonts/Facit-Regular.eot');
	src: url('../fonts/Facit-Regular.eot?#iefix') format('embedded-opentype'),
		url('../fonts/Facit-Regular.woff') format('woff'),
		url('../fonts/Facit-Regular.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}


@font-face {
	font-family: 'Facit';
	src: url('../fonts/Facit-Bold.eot');
	src: url('../fonts/Facit-Bold.eot?#iefix') format('embedded-opentype'),
		url('../fonts/Facit-Bold.woff') format('woff'),
		url('../fonts/Facit-Bold.ttf') format('truetype');
	font-weight: bold;
	font-style: normal;
}


/* Transation */

.transation,
a{-webkit-transition:all 0.5s;-moz-transition:all 0.5s;-ms-transition:all 0.5s;-o-transition:all 0.5s;transition:all 0.5s;}

.eq-height { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex;}




/* Header */

.site-header{position:relative; z-index:9999; top: 30px;}
.banner{background-color:#04223e; background-position: center center; background-repeat:no-repeat; background-size: cover; display: inline-block; position: relative; width: 100%; padding-top:80px; margin-top: -65px;}
.nav-menu {margin-right: 60px;}
.logo{ margin-bottom:35px;}

/* Scroll Down */

.scroll-down {bottom: 40px; left: 50%; position: absolute; text-align: center; z-index: 12; transition: all 0.3s ease 0s; margin-left:-37px;}
.scroll-down .text {color: #ffffff; display: block; margin-top:20px; font-size:15px;}
.scroll-down .arrow {border:2px solid #ffffff; border-radius:10px; display: block; height: 45px; margin: 0 auto; width: 25px; overflow:hidden;}
.scroll-down .fa-angle-down {background: #fff none repeat scroll 0 0; height: 10px; width: 5px; border-radius:10px;}
.scroll-down .fa-angle-down:before {content: "";}
.scroll-down .fa {-webkit-animation-name:fadebounce; -moz-animation-name:fadebounce; -ms-animation-name:fadebounce;	-o-animation-name:fadebounce; animation-name:fadebounce; -webkit-animation-duration:3s;	-moz-animation-duration:3s;	-ms-animation-duration:3s;
-o-animation-duration:3s; animation-duration:3s; -webkit-animation-iteration-count:infinite; -moz-animation-iteration-count:infinite; -ms-animation-iteration-count:infinite; -o-animation-iteration-count:infinite; animation-iteration-count:infinite;}




.section1 { margin-top: -7px; position: relative;}
.inner-section{ overflow: hidden;}
.seven-cols{ margin:0;}
.seven-cols .col-md-1, .seven-cols .col-sm-1, .seven-cols .col-lg-1 {width: 14.2857%;}
.box-inner{position:relative; padding-top:25px;}
.box-inner::before {background: #666666; bottom: 0; content: ""; display: inline-block; height: 100%; left: -1px; position: absolute; width: 1px;}
.box-inner:last-child::after {background: #666666; bottom: 0; content: ""; display: inline-block; height: 100%; position: absolute; right: -1px; width: 1px;}
.box-inner:hover{background:#ffffff;}
.box-inner:hover .caption{ color:#2a799f;}
a.thumbnail {background: none; border:none; border-radius: 0; display: block; line-height: inherit; margin-bottom: 0; padding:0 10px 10px; margin-top:0px; cursor: pointer; text-decoration:none; outline:none;}
.box-inner.active{background:#ffffff;} 
.box-inner.active .thumbnail .caption{ color:#2a799f;}
.thumbnail .caption {padding:10px 0 0; min-height: 62px; color:#ffffff; line-height:18px; font-weight:400;} 
.home .pettent-bg{padding-bottom:0;}
.media {margin-right: 50px;}
.media-left, .media > .pull-left {padding-right: 20px; position:relative;}
.right-con {padding-left: 15px;}

.color-box{float: left; display:inline-block; min-width: 230px; margin-top:7px;}
.color-box a{color:#ffffff; text-decoration:none;  padding: 10px 24px 9px; background:#000000;}
.color-box a:hover{background:#0079a0;}
.color-sec ul li{float:left; list-style-type:none;}

.learn-more{ margin-top:30px; position:relative;}
.learn-more img{display:inline-block;}
.learn-more span {bottom: 30px; color: #fff; font-size: 18px; left: 45%; margin-left: -53px; position: absolute; font-family: 'Gotham'; letter-spacing:3px; font-weight:500;} 
.learn-more span:hover{color:#000000;}

.footer{background:#e3e3e3;}
.menu{margin-bottom:30px;}
.menu ul li{list-style-type:none; display:inline-block;}
.menu ul li a{color:#0076a0; font-size:16px; padding-right:18px; text-decoration:none; font-weight:500;}
.menu ul li a:hover{color:#000000;}
.footer-text a{font-size:22px; text-decoration:none; margin-top:10px; display:inline-block;}
.footer-text span{display:block; color:#000000; font-weight:500; font-size:12px; margin-top:10px; margin-bottom:25px;}
.footer-text p{ font-size:12px; color:#787878;}





/* Inner Page */

.inner-header{background:#e3e3e3; position:relative; display:inline-block; width:100%;}
.inner-logo{display:inline-block; float:left; margin-left:100px;}
.inner-header h2{float:left; margin-left: 20px; margin-top: 35px;}
.inner-header .site-header {display: inline-block; position: inherit; top: 0;}
.small-banner{background-color:#04223e; background-repeat:no-repeat; background-size: cover; display: inline-block; position: relative; width: 100%; margin-top:-6px;}
.mob-view{display:none;}
.mob-view img{display:none; background-repeat:no-repeat; background-size:cover; display: inline-block; position: relative; width: 100%;}
.inner-page .inner-section{margin:0;}
a.call{display: inline-block; float: left; padding-top: 35px; margin-right:60px; text-decoration:none; font-weight:500; outline:none;}
.inner-header a.nav-expander{display:inline-block;}
.big-btn span{background:url(../images/pdf-btn.png) no-repeat left center; margin-right:10px; display:inline-block; height:72px; width:52px; float:left;}
.list-group{margin-top:50px;}
.list-group-item {background: none; border:none; margin-bottom: 0; padding: 10px 15px; position: relative; font-size:25px; font-weight:500; margin-bottom:15px; padding:0; line-height:40px;}
.badge {background: #99c9d9; color:#ffffff; border-radius: 100%; display: inline-block; font-size: 25px; height: 40px; line-height: 40px; padding: 0; text-align: center; width: 40px; margin-right:10px;}
.btn-box{margin-left:40px; display:inline-block;}
.ventilator {height:100%;}
.ventilator .media{margin:0;}
.medium-btn span{background:url(../images/arrow.png) no-repeat 0 0; width:13px; height:15px; display:inline-block; margin-right:5px;}
.big-txt{font-size:24px;}
.popup-gallery {margin-top: 80px;}
.inner-page .popup-gallery a {display: inline-block; float: left; width: 20%;}
.inner-page .popup-gallery img {width: 100%; -o-object-fit: cover; object-fit: cover; font-family: 'object-fit: cover;'}
.popup-gallery > a {float: left; width: 25%;}
.ventilator .list-inside li{font-size:16px;}
.list-inline h3{font-weight:500;}
.form-inline .form-control {font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;width: 100%; height:auto; border-radius:0; padding:10px 15px 20px 15px; margin-bottom:15px; border:1px solid #48a0bb;}
.form-control::-moz-placeholder { color: #7d7d7d; font-size:18px;}
.form-inline textarea.form-control{height:150px; width:80%; margin:0;}
label.error {color: red; font-size: 12px; font-weight: 500; position: absolute; right: 25px; text-align: right; top: 0; width: 100%;}
#message-error.error{right:22%;}
.map iframe{display:block;}
.about .pettent-bg .blue-title{color:#0079a0;}
.adrs{font-size:22px;}
.adrs .small-t{font-size:18px; margin-top:10px;}


.cupolas {padding-left:25px; padding-right:25px;}
.cupolas ul {padding-left: 15px;}

#colourhead h1 {font-weight: bold;font-size: 36px;text-transform: uppercase;color: #FFFFFF;text-align: left;}
#colourhead h2 {font-family: 'Gotham';font-weight: bold;font-size: 25px;line-height: 30px;text-transform: uppercase;color: #80BCD0;text-align: left}
#colourhead p {text-align: left;}
#selector {position: relative;}
#selector img {display: none;position: absolute;top: 0;left: 0;width: 100%;height: auto;}
#selector img:first-of-type { display: block; position: relative; }
#colours { font-size: 14px; line-height: 26px; color: #FFFFFF; }
#colours h1, #colours h2, #colours h3 { text-transform: uppercase; font-family: 'Gotham'; font-weight: bold; font-size: 18px; color: #FFFFFF; margin: 2px 0; padding: 12px 20px;}
#colours h1 { margin-top: 20px; }
#colours h1 span { text-transform: none; font-weight: normal;}
#colours h2:first-of-type {margin-top: 0;}
#colours h3 {text-align: center; text-transform: uppercase; letter-spacing: 1px;}
#colours a:not(#reset) { display:inline-block; width: 48px; height: 48px; margin-right: -5px;}
#colours .indent {padding-left: 60px;text-indent:-60px;}
#colours .uppercase {text-transform: uppercase}
#colours a.showing:not(#reset) {width: 20px;height:20px;display: inline-block; vertical-align: middle; margin-right:10px; margin-bottom: 3px; }
#reset { cursor: pointer; display: inline-block; font-family: 'Gotham'; font-weight: bold; font-size: 18px; color: #FFFFFF; margin: 20px; padding: 12px 20px; color: #FFFFFF; }
.rightside { border-bottom: 1px solid #666666; }
@media(min-width: 768px) {
	#colours a:not(#reset) { width: 30px; height: 30px; }
	.rightside { max-width: 350px; max-height: 919px; overflow: hidden; border-right: 1px solid #666666; }
	#greycolours { height: 481px; border-bottom: 1px solid #666666; }
}
@media(min-width: 992px) {
	.rightside { max-width: 467px; }
	#greycolours { height: auto; }
}


/*=========COLORS COLOURS COLORS==========*/
.cpick {background-color:#ff69b4; background-size: cover}
.BoneWhite {background-color:#c7c9bb}
.BrightWhite {background-color:#fafdfe}
.CambridgeWhite {background-color:#f1f2ef}
.AntiqueLinen {background-color:#efe9c4}
.WhiteWhite {background-color:#e1e3e7}
.Ivory {background-color:#efebbf}
.StoneGrey {background-color:#b2ad9f}
.PebbleKhaki {background-color:#a89f88}
.RegentGrey {background-color:#a1a4a6}
.Tan {background-color:#a69a71}
.MetroBrown {background-color:#5f5848}
.CoffeeBrown {background-color:#433729}
.OakBrown {background-color:#492215}
.GreyBerry {background-color:#766d67}
.Charcoal {background-color:#4f514e}
.Black {background-color:#0a0d0d}
.DarkBrown {background-color:#322a22}
.Buckskin {background-color:#85776f}
.SlateGrey {background-color:#323e47}
.BrightRed {background-color:#b32527}
.Burgundy {background-color:#4c2626}
.DarkRed {background-color:#7c161d}
.MelchersGreen {background-color:#1a3c26}
.Gold {background-color:#c9a340}
.HeronBlue {background-color:#0a2d4a}
.Orange {background-color:#df5e25}
.MediumGreen {background-color:#2d6e4a}
.MistGreen {background-color:#9db896}
.PacificTurquoise {background-color:#657e6d}
.RoyalBlue {background-color:#004f7b}
.SlateBlue {background-color:#4a6b7b}
.TileRed {background-color:#942c20}
.Copper {background-image: url('../images/copper.jpg')}
.Galvalume {background-image: url('../images/galvalume.jpg')}
.Galvanized {background-image: url('../images/galvanized.jpg')}

.building .Copper {display: none !important}

/*================= responciv view =================*/

@media (max-width: 1200px){
h3{font-size:16px;}
.media {margin-right: 20px;}
.media p{font-size:15px;}
.right-con{ padding:0;}
.right-con h2 {font-size: 17px;}
.right-con p{font-size:15px;}
.color-box {float: none; margin-bottom: 10px;}
.list-group-item{font-size:22px;}
.ventilator{margin-bottom:30px;}
.ventilator .media-left, .media-right, .media-body {/*display: inline-block;*/ margin-top:20px; width: auto;}
.list-inline li {width: 40%;}
.about .bdr::before {right: 20px;}
}


@media (max-width: 996px){

.eq-height {display:block;}	
.js-fullheight {height: 600px !important;}
.inner-section {margin-top: 0;}
.inner-page .section1 {padding:0;}
.seven-cols {margin-left: -25px;  margin-right: -25px;}
.box-inner {background: #007aa2; border-bottom:1px solid #666666; width: 100% !important; padding-top:0;}
.box-inner::before, .box-inner:last-child::after {display:none;}
a.thumbnail{ padding:20px 0 0; width:100%; display:inline-block;}
.thumbnail img {display: inline-block; width:15%;}
.thumbnail .caption { display: inline-block; padding-left: 15px; text-align: left; width: 200px; min-height: auto;}
a.thumbnail:hover, a.thumbnail:focus, a.thumbnail.active {border-color:inherit;}
.media {margin-bottom: 30px;}
.right-con{margin-bottom: 30px;}
.right-con h2 {font-size: 22px;}
.right-con p{font-size:18px;}
.right-con .mb-60{ margin-bottom:30px}
.inner-logo {margin-left: 30px;}
a.call{display:none;}
.list-group-item {font-size: 15px;}
.badge {font-size: 22px; height: 35px; line-height: 35px; width: 35px;}
.btn-box {margin:20px 0 0;}
.list-inline li {width: 100%; display:block; text-align: center;}
.list-inline{display: inline-block; text-align: center;}
.min-height {height: 300px;}
.about .bdr::before{display:none;}
.ventilator .media-left, .media-right, .media-body {display: table-cell; margin-top:0px;}

}

@media (max-width: 991px) {
	.bdr:before {
		display: none;
	}
}

@media (max-width: 767px){
h1{font-size:26px;}
.logo {margin-bottom: 20px;}
.nav-menu {display: block; margin-right: 20px;}
.js-fullheight {height:600px !important;}
.small-banner.js-fullheight {height: auto !important;}
.banner  .small-t {margin-top: 250px;}
.scroll-down{display:none;}
.media-left {display: block; float: none; width: 100%; text-align:center; margin-bottom:30px;}
.media-object {display: inline-block;}
.banner .grey-title {margin-top:100px;}	
.banner-text li {list-style-position:inside; text-align:center;}
.box-inner {padding: 0;}
.thumbnail .caption {font-size: 18px;}
.home .pettent-bg .col-sm-12{padding:0;}
.color-sec{text-align:center;}
.color-sec ul{display:none;}
.paralex{background-size:cover;}
.menu ul li {display: block;}
.inner-header {text-align: center; padding-top:50px;}
.inner-logo {float: none; margin:0 0 10px; width:100%;}
.inner-logo img{display:inline-block;}
.inner-header h2{float:none; margin:0;}
.inner-header .site-header {margin-top: -120px;}
.small-banner{background:#4d4d4d; background-image:none !important; text-align:center; padding:40px 0;}
.small-banner .banner-text{color:#ffffff;}
.mob-view{display:block;}
.mob-view img {height: 200px; -o-object-fit:cover; object-fit:cover;font-family: 'object-fit: cover;'}
.small-banner .scroll-down {display: block; position:inherit; margin:20px 0 0;}
.scroll-down .arrow {border: 2px solid #0079a0;}
.scroll-down .text{ color:#0079a0;}
.scroll-down .fa-angle-down {background: #0079a0;}
.inner-page .popup-gallery a {width: 50%;}
.inner-page .pettent-bg.page-section-ptb{padding-bottom:0;}
.big-btn {font-size: 20px; padding: 18px 70px; line-height: 62px;}
.big-btn span {height: 62px; width: 42px;}
.list-group {margin-top: 20px;}
.list-group-item {display: inline-block;}
.medium-btn {font-size: 18px; padding: 18px 20px; margin-bottom:30px;}
.small-banner.min-height{display:none;}
.form-inline textarea.form-control {width: 100%;}
.small-btn {position:inherit; width:30%; right:inherit; margin-top:20px; padding:20px;}
.about .section1{padding:40px 0; margin:0;}
.about .pettent-bg.page-section-ptb{padding:40px 0 0;}
.popup-gallery a { width: 50%;}
.ventilator .media-body {display: inline-block; margin-top:20px; width:100%;}
#message-error.error {right: 5%;}
}


@media (max-width: 479px){
.nav-menu {margin-right: 10px;}
.inner-header .nav-menu {top: 10px;}
a.nav-expander {font-size: 10px; height: 50px; width: 50px;}
a.nav-expander .line {height: 4px;}
.js-fullheight {height: 500px !important;}
.banner{padding-top: 50px;}
.banner h2{font-size:14px;}
.nav-menu {top: -20px;}
.logo img {width: 50%;}
.inner-logo img {width: 50%;}
.mob-view img {height: 150px;}
.thumbnail .caption {font-size: 16px;}
.inner-header .site-header {margin-top: -130px;}
.list-group {margin-top: 20px;}
.big-btn {font-size: 18px; padding: 18px 30px; line-height: 52px;}
.big-btn span {height: 52px; width: 42px;}
.banner-text p br{display:none;}
.list-group-item {font-size: 14px;}
}











/*====================================================================
							Animation Key
====================================================================*/
/*==== Fade Bounce ====*/
v@-moz-keyframes fadebounce {
0% {
-moz-transform:translateY(0);
transform:translateY(0);
opacity:1
}
50% {
-moz-transform:translateY(25px);
transform:translateY(25px);
opacity:1
}
100% {
-moz-transform:translateY(0);
transform:translateY(0);
opacity:1
}
}
@-webkit-keyframes fadebounce {
0% {
-webkit-transform:translateY(0);
transform:translateY(0);
opacity:1
}
50% {
-webkit-transform:translateY(25px);
transform:translateY(25px);
opacity:1
}
100% {
-webkit-transform:translateY(0);
transform:translateY(0);
opacity:1
}
}
@-o-keyframes fadebounce {
0% {
-o-transform:translateY(0);
transform:translateY(0);
opacity:1
}
50% {-o-transform:translateY(25px);transform:translateY(25px);opacity:1}
100% {-o-transform:translateY(0);transform:translateY(0);opacity:1}
}
@-ms-keyframes fadebounce {
0% {
-ms-transform:translateY(0);
transform:translateY(0);
opacity:1
}
50% {-ms-transform:translateY(25px);transform:translateY(25px);opacity:1}
100% {-ms-transform:translateY(0); transform:translateY(0); opacity:1}
}
@keyframes fadebounce {
0% {
transform:translateY(0);
opacity:1
}
50% {transform:translateY(25px);opacity:1}
100% {transform:translateY(0);opacity:1}
}


/* ---------------------------------------------------------------------- */