
:root{
	--primaryblue:#2e527d;
	--primaryblue-dark:#223c5b;
	--primaryblue-light:#3f70a8;


	--accentorange:#F19C17;
	--accentorange-light:#FCB647;
	--accentorange-dark:#C07806;	 

	--accentgold:#F1C217;
	--accentgold-dark:#C09806;	
	--accentgold-light:#FFE070;	

	--palegrey:#eee;
	--lightgrey:#ccc;
	--mediumgrey:#777;
	--darkgrey:#444;	 	
	
	--desktopmenuheight:50px;
}

.fullpage{width:100%; min-height:100vh;}
.halfpage{width:100%; min-height:50vh;} 
.thirdpage{width:100%; min-height:66vh;} 
.largebackground{height:700px;background:#444444 url("/images/construct/largebackground1.jpg")  center center no-repeat;z-index:1;background-size:cover; background-attachment:fixed;}
.largebackgroundhome{margin-top:100px;height:calc(100vh - 175px);background:url("/images/construct/largebackground-homepage-rev.jpg")  center center no-repeat;z-index:1;background-size:cover; background-attachment:fixed;}
.largebackgroundinside{margin-top:0px;height:550px;background:url("/images/construct/largebackgroundinside-horsehead.jpg")  center center no-repeat;z-index:1;background-size:cover; background-attachment:scroll;}
.largebackgroundinside .textoverlay{height:550px;}
.largebackground divp{height:700px;}
.largebottomimage{background:url("/images/construct/largebottomimage-redbrick.jpg")  center center no-repeat;z-index:1;background-size:cover; background-attachment:fixed;  }
.largeinstagramimage{background:url("/images/construct/homepage-flooring.jpg")  center center no-repeat;z-index:1;background-size:cover; background-attachment:fixed;  }

.mastheadouter{height:150px;}
.mastheadouter .container{height:150px;}
.mastheadphone{height:150px;left:50px;top:0;}
.mastheadsocial{height:150px;right:50px;top:0;}

.desktopmenu { transition:  0.3s ease;font-family:"Open Sans", sans-serif;height:var(--desktopmenuheight); width:100%;z-index:200;background:var(--primaryblue-dark);}
.desktopmenu .container{z-index:200;}
.desktopmenu ul{list-style:none;width:auto;margin:0px auto;}
.desktopmenu li{transition:background 0.4s ease, color 0.4s ease;display:inline-block; height:var(--desktopmenuheight);line-height:var(--desktopmenuheight);text-align:center;margin:0px;padding:0px ;font-size:1em; font-weight:400;letter-spacing:0px;text-transform:uppercase; }
.desktopmenu li a{color:#ebe4dd;width:100%; height:100%;float:left;padding:0px 15px;transition:background 0.4s ease, color 0.4s ease;}
.desktopmenu li:hover{background:var(--primaryblue-light);color:var(--accentgold-light);}
.desktopmenu li:hover a{color:var(--accentgold-light);}
.desktopmenu ul li {position:relative;}
.desktopmenu ul li > ul {background:var(--primaryblue-dark);display:none; position:absolute;top:100%;-webkit-transition-duration:0.3s;transition-duration:0.3s;width:320px; transition: background 0.3s ease;z-index:500;}
.desktopmenu ul ul li{display:block;clear:both;float:left;text-align:left;width:100%;}
.desktopmenu ul ul li, .desktopmenu ul ul li a{font-size:.95em;height:50px;line-height:50px;}
.desktopmenu li:hover ul a{padding-left:20px;color:#fff;}
.desktopmenu ul li:hover >  ul{height:auto;display:block;box-shadow:0px 5px 10px rgba(0,0,0,0.5)}
.desktopmenu ul ul li:hover a{color:var(--accentgold-light);background:var(--primaryblue-light);}
.desktopmenuscrolled{position:fixed; top:0px;}
.mastheadscrolled{margin-bottom:50px;}

.mobilemenu {background:var(--primaryblue-dark); height:50px;position:fixed;z-index:100;width:100%;}
.mobilemenu ul{width:100%; list-style:none;float:left;margin-left:0px; }
.mobilemenu li{width:50px !important;height:50px;line-height:50px;text-align:center;margin:0px;padding:0px; font-size:20px;}
.mobilemenu li:hover{background:var(--primaryblue-light);}
.mobilemenu li.social{width:50px;}
.mobilemenu li.nohover:hover{background:#222;}

#menu_opener{display:none;}

.leftdrawermenu {background: #222222;width: 100%;color: white;font-family: 'Roboto Condensed', serif; font-weight:300;}
.leftdrawermenu ul{margin-left:0;}
.leftdrawermenu h3, .leftdrawermenu h4 {font-size: 18px;line-height: 34px;padding: 0px;padding-left:0px;cursor: pointer;border-bottom:1px solid #444;margin:0px;transition: all 0.25s;color:white;}
.leftdrawermenu h4 a{padding:5px;padding-left:10px;font-size: 18px;}
.leftdrawermenu i{float:right;transform:rotate(90deg) translateY(10px); font-style:normal;font-family: 'Zapf Dingbats';}
.leftdrawermenu h3{padding:5px;	padding-left:10px;}
.leftdrawermenu h3:hover {background: #ebe4dd;}
.leftdrawermenu li {list-style-type: none;padding:0px; margin:0px;}
.leftdrawermenu li a{color:#fff;display:block}
.leftdrawermenu li a:hover{background:#ebe4dd;}
.leftdrawermenu li a:click{background:#ebe4dd;}
.leftdrawermenu ul ul li a {background:#444;color: white;text-decoration: none;font-size: 18px;line-height: 30px;display: block;padding: 5px 10px;transition: all 0.25s;border-left: 5px solid #444;}
.leftdrawermenu ul ul li a:hover {background: #ebe4dd;border-left: 15px solid #534d48;}
.leftdrawermenu ul ul {display: none;margin-bottom:0px;padding-top:0px;}
.leftdrawermenu li.active ul {display: block;}

.bg-primary{background:var(--primaryblue);}
.bg-primary-dark{background:var(--primaryblue-dark);}
.bg-primary-light{background:var(--primaryblue-light);}

.fg-primary{color:var(--primaryblue);}
.fg-primary-dark{color:var(--primaryblue-dark);}
.fg-primary-light{color:var(--primaryblue-light);}

.bdr-primary{border-color:var(--primaryblue);}
.bdr-primary-dark{border-color:var(--primaryblue-dark);}
.bdr-primary-light{border-color:var(--primaryblue-light);}

.bg-accent{background:var(--accentorange);}
.bg-accent-dark{background:var(--accentorange-dark);}
.bg-accent-light{background:var(--accentorange-light);}

.fg-accent{color:var(--accentorange);}
.fg-accent-dark{color:var(--accentorange-dark);}
.fg-accent-light{color:var(--accentorange-light);}

.bdr-accent{border-color:var(--accentorange);}
.bdr-accent-dark{border-color :var(--accentorange-dark);}
.bdr-accent-light{border-color:var(--accentorange-light);}


.btn.ghost-primary{border-color:var(--primaryblue);}
.btn.ghost-primary:hover{background:var(--primaryblue);border-color:var(--primaryblue);color:white;text-shadow:0 1px 2px rgba(0,0,0,0.5),0 1px 1px rgba(0,0,0,0.9)}

.btn.ghost-accent{border-color:var(--accentorange);}
.btn.ghost-accent:hover{background:var(--accentorange);border-color:var(--accentorange);color:white;text-shadow:0 1px 2px rgba(0,0,0,0.5),0 1px 1px rgba(0,0,0,0.9)}

.bg-primary.btn:hover{background:var(--primaryblue-dark);transform:scale(.96) translate3d(0,0,0);}
.bg-accent.btn:hover{background:var(--accentorange-dark);transform:scale(.96) translate3d(0,0,0);}

.card img {transition: 0.4s ease;-webkit-filter:grayscale(80%);filter:grayscale(80%);}
.card:hover img{-webkit-filter:grayscale(0%);filter:grayscale(0%);}
.card {-webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s;-ms-transition-duration: 0.3s;-o-transition-duration: 0.3s;transition-duration: 0.3s;}


.homepagectacontainer{background:var(--palegrey);padding-top:50px; padding-bottom:50px;}

.footer {background:#2e527d;}
.footer h6{color:#ffffff; font-size:1.0em; letter-spacing:1px;font-weight:300;}
.footer h5{color:#ffffff; letter-spacing:1px;}
.footer h4{color:#ffffff; border-bottom:1px solid #ebe4dd; letter-spacing:1px;}
.footer p{color:#ffffff}
.footer li{color:#ffffff; font-weight:300;}
.footer ul, .footer li{list-style:none;margin-left:0px;}
.footer a{color:#ffffff; transition:color 0.2s ease;}
.footer a:hover{color:#e9850f;}

.footerareas{padding-left:25%; padding-right:25%;}
/* YOUTUBE VIDEO WRAPPER FOR RESPONSIVE - START */
.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}
.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}


.articlelistitem{margin:100px 0px;padding-bottom:0 0 20px 0;}
.articlelistthumbcontainer{height:auto;overflow:hidden;text-align:center;line-height:1px;vertical-align:top;padding:0px; margin:0px;}
.articlelistthumb{width:100%;margin:0px;padding:0px; text-align:center;}
.articlelistheadline{color:#444;text-align:center;}
.articlelistsummary{margin-left:20px;margin-bottom:0em;padding-top:0px;font-size:1.2em;}
.articlelistreadmore{text-align:left;margin-left:20px;margin-bottom:20px;font-size:1.2em;}
.articlelistsidebar{width:325px;float:left;}
.articlesidecategories{display:none;}
.articlelistbox{}
.articletopsearch{display:none;}
.articletopsearchcategories{display:inline-block;width:49%;text-align:right;}
.articletopsearchsearchbox{display:inline-block;width:49%;}
.articletopphoto{width:100%;height:400px;}
.articletophototext{line-height:400px}
.articlelistitemfooter{float:left;width:64px;overflow:hidden;height:64px;margin:0px 5px 5px 0px;}
.articlelistthumbfooter{height:100%;width:100%;}
.card, .card .articlelistthumb{-webkit-transition-duration:0.3s;-moz-transition-duration:0.3s;-ms-transition-duration:0.3s;-o-transition-duration:0.3s;transition-duration:0.3s;}
.card:hover .articlelistthumb{transform:scale(1.2);}
.articlelistitem.card:hover{transform:scale(1.1);z-index:200;}



/* ------------------ */
/* Responsive layouts */
/* ------------------ */

/* --------------------------------------------------------------------------------------------- */
/* ---------- 1400 Layout ---------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------------- */
@media all and (min-width: 1400px) {
	#debugcsslayoutvalue:before{left:100px;font-size:1em;color:white;content:"L1400";top:10px;}
	p, ol, ul, blockquote, code, dl, dt, dd{font-size:1.2em;letter-spacing:.0em;line-height:1.5em;}
	.desktopmenu ul ul li, .desktopmenu ul ul li a{font-size:.8em;}
}

/* --------------------------------------------------------------------------------------------- */
/* ---------- 1200 Layout ---------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------------- */
@media all and (min-width: 1280px) and (max-width: 1399px) {
	#debugcsslayoutvalue:before{left:100px;font-size:1em;color:white;content:"L1200";top:10px;}
	.articleheadline{font-size: 3em;}
	
}


/* --------------------------------------------------------------------------------------------- */
/* ---------- 960 Layout ----------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------------- */
@media all and (min-width: 960px) and (max-width: 1279px)  {
	#debugcsslayoutvalue:before{left:100px;font-size:.9em;color:white;content:"L960";top:10px;}
	.articleheadline{font-size: 2.5em;}
}

/* --------------------------------------------------------------------------------------------- */
/* ---------- Tablets  ------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------------- */
@media all and (min-width:720px) and (max-width:959px) {
	#debugcsslayoutvalue:before{left:100px;font-size:1em;color:white;content:"Ltab";top:10px;}
	#menu_opener{display:inline-block;}
	.menucontainer{height:50px;}
	.mainmenu {width:100%; list-style:none;float:left;margin-left:0px; height:50px;line-height:50px;}
	.mainmenu li{float:left; padding:0px;text-align:center;margin:0px 10px 0px 10px;height:50px;width:40px;}
	.mainmenu li img{width:35px; height:35px;margin-top:7px;}
	.functionbar{margin-top:50px;padding:0px; padding-top:5px;}

	.justifiedtablet{text-align:justify;}
	.mastheadscrolled{margin-bottom:0px;}	
	.mastheadouter{margin-top:50px;}
	.mastheadphone{left:20px;}
	.mastheadphone .h3{font-size:2.2em}
	.mastheadsocial {right:20px;}
	.footerareas{padding-left:5%; padding-right:5%;}	
	.articleheadline{font-size: 2.5em;}
}


/* --------------------------------------------------------------------------------------------- */
/* ---------- Smartphones  --------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------------- */
@media only screen and (max-width:719px) {
	html {min-width:320px;}
	#debugcsslayoutvalue:before{left:100px;font-size:1em;color:white;content:"Lsp";top:10px;}
	h1,.h1 {font-size:2.4em;line-height:1.17em;letter-spacing:-.03em;margin:0px 0px .5em 0px;}
	h2,.h2 {font-size:2.1em;line-height:1.18em;letter-spacing:-.03em;margin:0px 0px .8em 0px;}
	h3,.h3 {font-size:1.8em;line-height:1.25em;letter-spacing:-.03em;margin:0px 0px 0.9em 0px;} /*was 1.65 and 0.5 */
	h4,.h4 {font-size:1.5em;line-height:2em;letter-spacing:-.03em;margin:0px 0px .5em 0px;}
	h5,.h5 {font-size:1.2em;line-height:1.2em;letter-spacing:-.03em;margin:0px 0px .5em 0px;}
		
	.pagescontainer{position:relative;}
	.paginationprevious{position:absolute; left:0px;width:100px !important; height:35px !important;}
	.paginationnext{position:absolute; right:0px;width:100px !important; height:35px !important;}
	#menu_opener{display:inline-block;}
	.menucontainer{height:50px;}
	.mainmenu {width:100%; list-style:none;float:left;margin-left:0px; height:50px;line-height:50px;}
	.mainmenu li{float:left; padding:0px;text-align:center;margin:0px 10px 0px 10px;height:50px;width:40px;}
	.mainmenu li img{width:35px; height:35px;margin-top:7px;}

	.functionbar-scrolled{background:rgba(255,255,255,1);height:50px;line-height:28px;}
	.functionbar-scrolled .logo{height:75%;margin-top:0;}
\	
	.halfpage{height:10px;min-height:auto;max-height:auto;height:auto;}
	.contactblock li.contactheading{font-size:1.8em;line-height:1.8em;font-weight:500;}

	.smartphonetext_left{text-align:left;}
	.smartphone-text-center{text-align:center;}

	.mastheadouter{margin-top:50px;}	
	.mastheadsocial, .mastheadphone{display:none;}
	.mastheadscrolled{margin-bottom:0px;}
	.largebackgroundinside{height:350px;}
	.largebackgroundinside .textoverlay{height:350px;}	
	
	.homepagectacontainer h1{line-height:1.6em;}
	
	.footer h6{font-size:1.2em;line-height:1.3em;}
	.footerareas{padding-left:0; padding-right:0;}	
}

@media print {
	* {background:white; color:black; box-shadow:none;}
	.notprintable{display:none;}
	.printonly{display:block;}
	.softwhitebox{box-shadow:none;}
	body{background:white; color:black;}
	p, h1, h2, h3, h4, h5, h6 {color:black;}
	#content{background:white;}
}