/* content with or without sidebar */


/*  CONTENT */

#content_area {
	text-align: left;
	
}

@media screen and (min-width: 900px) {
	#content_area {
		padding:2em 0em 2em 0em;
	}
      #content_area.noSidebar #content {
            width: 90%;
      }
	#content, #content_area.homepage #content {
		width:66%;
		margin-right: 0;
		float:left;
	}

}
@media (min-width: 550px) and (max-width: 1230px) {
	#content_area {
		padding:2em 1em 2em 1em;
	}
	#content {
		width:66%;
		float:left;
	}

}


@media (min-width: 1px) and (max-width: 549px) {
	#content_area {
		padding:1em 0 2em .8em;
	}
	#content {
		width:65%;
	}

}

@media (min-width: 550px) and (max-width: 899px) {
	#content_area {
		padding:1em 0 2em 0;
	}
	#content {
		width:65%;
	}

}

/* if the section has a sidebar ... */
#content_area.hasSidebar {
      position:relative;
}
#content_area.noSidebar #content {
	width: 97%;
}

@media screen and (max-width: 900px) {
	#content_area.hasSidebar #content {
		
	}
}
@media screen and (max-width: 899px) {

	#content_area.hasSidebar #content {
		width: 63%;
	}
}

@media screen and (max-width: 549px) {

	#content_area.hasSidebar #content {
		width: 96% !important;
	}
}

#content_area.hasSidebar #sidebar-top, #content_area.hasSidebar #sidebar-bottom{
	float: right;
	width: 26%;
	
	clear: both;
}
#content_area.hasSidebar #sidebar-top{
	top: 2em;
}
#content_area.hasSidebar #sidebar-bottom{
	bottom: 1em;
}

@media screen and (max-width: 549px) {

	#content_area.hasSidebar #sidebar-top, #content_area.hasSidebar #sidebar-bottom {
		display:none;
	}
}

#content_area.theBottomContent {
	padding-bottom: 0;
}


/* sidebar */
.sb_side_menu {
    display: block;
}

#content_area.hasSidebar #sidebar-top, #content_area.hasSidebar #sidebar-bottom{
	float: right;
	width: 26%;
	clear: both;
	margin-right: 0;
}
#content_area.hasSidebar #sidebar-top{
	top: 2em;
}
#content_area.hasSidebar #sidebar-bottom{
	bottom: 1em;
}

@media screen and (max-width: 549px) {

	#content_area.hasSidebar #sidebar-top, #content_area.hasSidebar #sidebar-bottom {
		display:none;
	}
}



@media (min-width: 550px) and (max-width: 899px) {


#content_area.hasSidebar #sidebar-top, #content_area.hasSidebar #sidebar-bottom {
    float: right;
    width: 29%;
    clear: both;
    margin-right: .7em;
	}

}



/**************************** CUSTOM ************************************/
/*** homepage ***/








.homeContent {
	width: 88%;
	margin: 0 auto;
	text-align: center;
	
	}
	
.headerTag {
font-size: 1.33em;
font-weight: 400;
color: #008641;
text-transform: uppercase;
margin-bottom: .5em;

}	

.homeContentCentered {
	text-align: center;
}

.homeContentMargins {
	margin: 2em auto;
}

.structuresTourBanner {
	width: 100%;
	max-width: 1120px;
	position: relative;
	margin: 0 auto;
}

.saveStructuresCaptions {
	width: 100%;
}

.saveStructuresTitle {
	font-size: 1.8em;
	font-weight: 700;
	color: #ffffff;
	text-transform: uppercase;
	position: absolute;
	top: 34%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	text-align: center;
	
}

.saveStructuresButton {
	
	
	position: absolute;
	top: 63%;
	left: 50%;
	transform: translate(-50%, -50%);
	text-align: center;
}

.saveStructuresButton a {
	font-size: 1.2em;
	font-weight: 700;
	color: #ffffff;
	text-transform: uppercase;
	
	padding: .5em .85em;
	display: block;
	border: 2px solid #ffffff;
	text-align: center;
}

.saveStructuresButton a:hover {
	background: #008641;
	border: 2px solid #008641;
}

.homeButtonOnLinkedin {
	display: block;
	text-align: center;
	margin-top: 1.4em;
}

.homeButtonOnLinkedin a {
	display: inline-block;
	font-size: .9em;
	font-weight: 700;
	color: #018641;
	padding: .7em 1.8em;
	border: 2px solid #018641;
	text-transform: uppercase;
}

.homeButtonOnLinkedin a:hover {
	background: #018641;
	color: #ffffff;
	border: 2px solid #018641;
}



.homeContent p {
	line-height: 1.7em;
}

.homeboxesContainer {
	width: 100%;
	background: #f5f5f5;
	border-top: 1px solid #d8d8d8;
	border-bottom: 1px solid #d8d8d8;
}

.homeboxes {
	width: 100%;
	display: flex;
	flex-flow: row wrap;
	justify-content: flex-start;
}

.homebox1 {
	float: left;
	width: 31.5%;
	max-width: 370px;
	margin-right: 2%;
	
	
	display: flex;
	flex-flow: column nowrap;
}

.homebox2 {
	float: left;
	width: 31.5%;
	max-width: 370px;
	margin-right: 2%;
	
	display: flex;
	flex-flow: column nowrap;
}

.homebox3 {
	float: right;
	width: 31.5%;
	max-width: 370px;
	
	display: flex;
	flex-flow: column nowrap;
}


.homeboxPic {
	background: #000000; 
}

.homeboxPic img {
	vertical-align: bottom;
}

.homeboxPic img:hover {
	opacity: .85;
}

.homeboxTitle {
	margin-top: 1em;
	text-align: center;
}

.homeboxTitle a {
	font-size: 1.2em;
	font-weight: 400;
	color: #000000;
	text-transform: uppercase;
}

.homeboxTitle a:hover {
	color: #018641;
}

.homeboxContent {
	line-height: 1.7em;
	text-align: center;
	margin-top: 1.25em;
	width: 97.5%;
	margin-bottom: 2em;
	
}

.homeboxButton {
	text-align: center;
	display: block;
	margin-top:auto;
	margin-bottom: 1.4em;
	
}

.homeboxButton a {
	font-size: .95em;
	font-weight: 700;
	color: #018641;
	border: 2px solid #018641;
	padding: .55em 1.2em;
	text-align: center;
}

.homeboxButton a:hover {
	background: #018641;
	color: #ffffff;
}



.pageboxes {
	width: 100%;
	margin-top: 2em;
	
	display: flex;
	flex-flow: row wrap;
	justify-content: flex-start;
}

.pagebox {
	float: left;
	width: 30%;
	margin-right: 1.5%;
	margin-left: 1.5%;
	margin-bottom: 2em;
	display: flex;
	flex-flow: column nowrap;
}


.pageboxPic {
	
}

.pageboxPic img {
	vertical-align: bottom;
}

.pageboxPic img:hover {
	opacity: .85;
}

.pageboxTitle {
	margin-top: 1em;
	text-align: center;
}

.pageboxTitle a {
	font-size: 1.2em;
	font-weight: 400;
	color: #000000;
	text-transform: uppercase;
}

.pageboxTitle a:hover {
	color: #018641;
}

.pageboxContent {
	line-height: 1.7em;
	text-align: center;
	margin-top: 1.25em;
	width: 97.5%;
	margin-bottom: 2em;
	
}

.pageboxButton {
	text-align: center;
	display: block;
	margin-top:auto;
	margin-bottom: 1.4em;
	
}

.pageboxButton a {
	font-size: .95em;
	font-weight: 700;
	color: #018641;
	border: 2px solid #018641;
	padding: .55em 1.2em;
	text-align: center;
}

.pageboxButton a:hover {
	background: #018641;
	color: #ffffff;
}


.halfpageboxes {
	width: 100%;
	display: flex;
	flex-flow: row wrap;
	justify-content: flex-start;
}

.halfpagebox {
	float: left;
	width: 47%;
	margin-right: 1.5%;
	margin-left: 1.5%;
	margin-bottom: 2em;
	display: flex;
	flex-flow: column nowrap;
}


.halfpageboxPic {
	
}

.halfpageboxPic img {
	vertical-align: bottom;
}

.halfpageboxPic img:hover {
	opacity: .85;
}

.halfpageboxTitle {
	margin-top: 1em;
	text-align: center;
	
}

.noPageContent {
	margin-bottom: 2em;
}

.halfpageboxTitle a {
	font-size: 1.2em;
	font-weight: 400;
	color: #000000;
	text-transform: uppercase;
}

.halfpageboxTitle a:hover {
	color: #018641;
}

.halfpageboxContent {
	line-height: 1.7em;
	text-align: center;
	margin-top: 1.25em;
	width: 97.5%;
	margin-bottom: 2em;
	
}



.halfpageboxButton {
	text-align: center;
	display: block;
	margin-top:auto;
	margin-bottom: 1.4em;
	
}

.halfpageboxButton a {
	font-size: .95em;
	font-weight: 700;
	color: #018641;
	border: 2px solid #018641;
	padding: .55em 1.2em;
	text-align: center;
}

.halfpageboxButton a:hover {
	background: #018641;
	color: #ffffff;
}

.featuresPresentations {
	float: left;
	margin-bottom: 1.5em;
	clear: both;
}

.featuresPresentationsTitle {
	font-size: 1.1em;
	font-weight: 700;
	color: #292929;
	text-transform: uppercase;
	
}

.featuresPresentations p {
	margin-bottom: 1.5em;
	max-width: 800px;
}

.featuresButton {
	
	display: block;
	margin-top:auto;
	margin-bottom: 1.2em;
	
}

.featuresButton a {
	font-size: .95em;
	font-weight: 700;
	color: #018641;
	border: 2px solid #018641;
	padding: .3em 1.2em;
	text-align: center;
	display: inline-block;
}

.featuresButton a:hover {
	background: #018641;
	color: #ffffff;
}

.featuresSeparator {
	clear: both;
	padding-top: .4em;
	border-bottom: 1px solid #292929;
	margin-bottom: 1.5em;
}

.bottomBannerText {
	float: left;
	font-size: 1.2em;
	font-weight: 700;
	color: #ffffff;
	letter-spacing: 1px;
	width: 72%;
	margin-left: 0;
	padding: 1.65em 0;
	text-transform: uppercase;
	margin-left: 0;
	
}

.bottomBannerButton {
	float: right;
	
	font-size: 1.2em;
	font-weight: 700;
	color: #ffffff;
	letter-spacing: 2px;
	padding: .55em 1em;
	border: 2px solid #ffffff;
	margin-right: 7.15%;
	margin-top: 1.1em;

}

.bottomBannerButton:hover {
	color: #ffffff;
background: #000000;
border: 2px solid #000000;	
}

.bottomHomeContent {
	width: 100%;
}

.bottomHomeContent p {
	line-height: 1.7em;
}

.homeVideoPlaceholder {
	float: right;
	background: #000000;
	width: 44.3%;
	max-width: 540px;
	margin: 0 0 0 12%;
	text-align: right;
	
}

.homeVideoPlaceholder img {
	vertical-align: bottom;
}

.homeVideoPlaceholder img:hover {
	opacity: .85;
}


/**********side contact form*************/


#side-contact-form {
	background: #edecec;
	
	padding:1vw 7% 2vw 7%;
	
	font-size:79%;
	font-weight:700;
	line-height:150%;
	margin-top: 3em;
	}
	
@media (min-width: 550px) and (max-width: 1000px) {
	#side-contact-form { 
		pppfont-size:1.35vw; 
		line-height:150%;
	}
}

@media (max-width: 549px) {
	#side-contact-form { 
		pppfont-size:2.85vw; 
		line-height:150%;
	}
}


.sideformtxt1 {font-size:1.6em;font-weight:700; color: #222222; margin: 0; line-height: 1.3em; letter-spacing: 1px;}
.sideformtxt2 {font-size:1.15em;font-weight:400;color:#222222; margin: 0 0 1.5em 0; text-transform: none; }


#side-contact-form  form {
	display:inline;
}
#side-contact-form  form div {
	display:block;
	background: #fafafa;
	
	margin:0 0 .8em 0;
	padding:.5em;
	}
	
#side-contact-form  form input[type='text'],
#sideform-comments {
	width:100%;
	margin:0;
	border:0;
	padding:0;
	font-family: 'Lato', sans-serif;
	font-size: 12px;
	font-weight:400;
	color:black;
	vertical-align:middle;
	background: #fafafa;
	}
	

#sidebutton {
	font-family: 'Lato', sans-serif;
	padding:0.6em 1em;
	cursor:pointer;
	background: #0f75bc;
	border: 2px solid #0f75bc;
	text-align: center;
	color: #ffffff;
	margin-top: .8em;
	letter-spacing: 1px;
	font-weight:600;
	}
	
#sidebutton:hover {
background: #222222;
border: 2px solid #222222;	
color: #ffffff;

}





/*bulk of mobile here */

@media (min-width: 1px) and (max-width: 549px) {
	
	.halfpagebox {
    float: none;
    width: 94%;
    margin: 0 auto;
    margin-bottom: 2em;
    display: block;
	}
	
	.pagebox {
    float: none;
    width: 94%;
    margin: 0 auto;
    margin-bottom: 2em;
    display: block;
	}
	
	.homeVideoPlaceholder {
    float: left;
    background: #000000;
    width: 96%;
    margin: 0 0 1em 0;
    text-align: left;
    
	}
	
	.headerTag {
    font-size: 1.13em;
	}
	
	.structuresTourBanner {
    width: 96%;
    max-width: 1120px;
    position: relative;
    margin: 0 auto;
    float: left;
	}
	
	.saveStructuresTitle {
    font-size: 1.1em;
    font-weight: 700;
    color: #ffffff;
    text-transform: uppercase;
    position: absolute;
    top: 28%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    text-align: center;
	}
	
	.saveStructuresButton {
    position: absolute;
    top: 59%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
	}
	
	.saveStructuresButton a {
    font-size: .9em;
    font-weight: 700;
    color: #ffffff;
    text-transform: uppercase;
    padding: .35em .75em;
    display: block;
    border: 2px solid #ffffff;
    text-align: center;
	}
	
	.showBannerStructuresWide {
		display: none;
	}
	
	.beautifulStaircaseHome {
	float: none;
	width: 96%;
	margin: 0 0 1em 0;
	}
	
	h2.home {
    margin-top: 1em;
	margin-bottom: .5em;
	}
	
	.broserGalleriesBoxes {
		width: 96%;
	}
	
	.browseGalleriesLeft {
    float: none;
    width: 100%;
    margin: 0 auto 1em auto;
	}
	
	.browseGalleriesRight {
    float: none;
    width: 100%;
    margin: 0 auto 1em auto;
	}
	
	.browseGalleriesTitle {
    text-align: center;
    margin: .5em auto;
	}
	
	.testyWrapper {
     margin-bottom: .3em;
	}
	
	.homeboxes {
		margin-top: .5em;
	}
	
	.homebox1, .homebox2, .homebox3 {
    float: none;
    width: 96%;
	margin: 0 auto;
	display: block;
	}
	
	
	.homeContentMargins {
		margin-bottom: 0;
	}
	
	
	.bottomBannerText {
	float: none;
    font-size: 1.05em;
    width: 93%;
    margin: 0 auto;
	text-align: center;
	padding: .75em 0 .5em 0;
	line-height: 1.2em;
	}
	
	.bottomBannerButton {
	float: none;
    font-size: 1.05em;
	margin: 0 auto;
	padding: .4em 0;
	width: 215px;
	text-align: center;
	margin-bottom: .7em;
	}
	
	.mobileLaserCutting {
		float: left;
		width: 96%;


	}
	
	.homeContent {
    width: 95%;
    float: left;
	text-align: left;
	}
	
	h1 {
    font-size: 1.3em;
	line-height: 1.35em;
	line-height: 1.28em;
    }
	
	h1.home {
    font-size: 1.3em;
	line-height: 1.28em;
	}
	
	h2 {
    font-size: 1.15em;
	line-height: 1.28em;
	}
	
	.homeContentTagline {
    font-size: 1.2em;
	}
	
	h1.home br {
		display: none;
	}
	
	.servicesCategory {
    float: left;
    width: 95%;
    margin-bottom: 1.4em;
	}
	
	.servicesCategoriesDivider {
    width: 95%;
	}
	
	.bottomServicsPicLeft {
		display: none;
	}
	
	.bottomServicesContentRight {
    float: left;
    width: 97%;
	}
	
	.bottomServicePicTablet {
		float: right;
		width: 39%;
		margin: 0 0 1em 1em;
	}

}	
	
	

@media (min-width: 550px) and (max-width: 899px) {
	
	
	
	.halfpageboxTitle a {
		font-size: 1em;
	}
	
	.pageboxTitle a {
    font-size: 1em;
	}
	
	.showBannerStructuresMobile {
		display: none;
	}
	
	.saveStructuresButton {
    top: 69%;
    }
	
	.browseGalleriesTitle {
    margin: .7em auto;
	}
	
	h1.home {
    font-size: 1.8em;
	}
	
	h1.home br {
    display: none;
	}
	
	
	
	h2.home {
    font-size: 1.35em;
    margin-top: 1.1em;
    margin-bottom: .9em;
    }
	
	
	
	.bottomBannerText {
	float: none;
    font-size: 1.05em;
    width: 96%;
    margin: 0 auto;
	text-align: center;
	padding: .75em 0 .5em 0;
	}
	
	.bottomBannerButton {
	float: none;
    font-size: 1.05em;
	margin: 0 auto;
	padding: .4em 0;
	width: 225px;
	text-align: center;
	margin-bottom: .7em;
	}
	
	.homeContent {
    width: 96%;
	}
	
	
}

@media screen and (min-width: 900px) {
	
	.showBannerStructuresMobile {
		display: none;
	}
	
	
	
	
	
}
	




@media (min-width: 900px) and (max-width: 1109px) {
	
	.bottomBannerText {
    font-size: .9em;
    width: 74%;
    margin-left: 1em;
	}
	
	.bottomBannerButton {
    font-size: .9em;
    margin-right: 3%;
    margin-top: 1.08em;
	padding: .55em .8em;
	}
	
}


@media (min-width: 1110px) and (max-width: 1230px) {
	
	.bottomBannerText {
    font-size: 1em;
    width: 72%;
    margin-left: 1em;
	}
	
	.bottomBannerButton {
    font-size: .95em;
    margin-right: 3%;
    margin-top: 1.08em;
	padding: .55em .8em;
	}
	
}		


@media (min-width: 900px) and (max-width: 1230px) {
	
	
	.browseGalleriesTitle a {
    font-size: 1.2em;
    }
	
	#content_area {
    margin-left: 1em;
	margin-right: 1em;
	}
	
	.homeContent {
    width: 93%;
	}
	
	
	
}

/* Overriding */

#sidebar-top.sidebarPart #side-contact-form {
	display: none;
}

#sidebar-top.sidebarPart section.sb_widget.sidebar_widget {
	background: #d0d3d061;
    padding: 20px 10px;
    border-radius: 5px;
}

#sidebar-top.sidebarPart section.sb_widget.sidebar_widget p {
	margin-bottom: 0.5em;
}

/* register button */

a#lnkRegister {
    text-align: center;
    font-size: 18px;
    padding: 5px 0;
	padding: 5px 40px;
    border-radius: 5px;
	color: #fafafa; 
	background-color: #006633; 
	font-family: Arial, Helvetica, sans-serif;
	font-weight: 500;
}

a#lnkRegister:hover{
	background-color: rgb(9, 143, 76);
}

/* sidebar */

@media screen and (max-width: 549px) {

	#content_area.hasSidebar #sidebar-top, #content_area.hasSidebar #sidebar-bottom {
		display:block;
	}

	#content_area.hasSidebar {
		display: flex;
		flex-direction: column;
	}

	#content_area.hasSidebar > #sidebar-top {
		padding-right: .8em;
	}
	
	#content_area.hasSidebar > #content {
		order: 1!important;
		width: 100%;
	}
	
	#content_area.hasSidebar > #sidebar-top {
		order: 2!important;
		width: 100%;
	}
	
	
	#content_area.hasSidebar > #jsSidebarWrap > #sidebar-top > .sb_widget {
		width: fit-content;
		margin: 0 auto;
	}
}
