/* CSS Document */

#nav-icon3 {
	display: none;
}

@media only screen and (max-width: 1024px) {
.container {
	width: 100%;
	padding-left: 0;
	padding-right: 0;
}
.copywrite {
	margin-bottom: 0;
}
.hero > .buttonframe {
	margin-left: -20px;
	background-color: rgba(250, 212, 6, 0.26);
	border-radius: 8px;
}
.hero > .contactinfo {
	margin-left: -40px;
}
.beforeafter2, .beforeafter1 {
	background-size: 500px auto;
	background-position: center;
}
.hero {
	background-size: 120%;
	background-position: 20px auto;
}
.topnavlinks {
	font-size: 16px;
	margin-right: 20px
}
.home {
	margin-left: 20px;
}
.WYSIWYG {margin-right: 20px;}
}

@media only screen and (max-width: 900px) {
.hero > .contactinfo {
	margin-left: -50px;
}
	.contactinfotext {
		font-size: 18px;
	}
}

@media only screen and (max-width: 860px) {
.topnavlinks {
	display: none;
	justify-content: flex-start;
	width: 100%;
}
.topnavlinks a {
	display: block;
	float: none;
	margin-top: 24px;
	text-align: right;
	margin-left: 0;
}
.topnav {
	height: auto;
	width: 100%;
}
#nav-icon3 {
	display: block;
	margin-right: 20px
}
/* Icon 3 */

#nav-icon3:active > .topnavlinks {
	display: block;
}
#nav-icon1, #nav-icon2, #nav-icon3, #nav-icon4 {
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	-webkit-transition: .5s ease-in-out;
	-moz-transition: .5s ease-in-out;
	-o-transition: .5s ease-in-out;
	transition: .5s ease-in-out;
	cursor: pointer;
	position: absolute;
	right: 10px;
	top: 10px;
	width: 24px;
	height: 14px;
	margin: 0;
}
#nav-icon1 span, #nav-icon3 span, #nav-icon4 span {
	display: block;
	position: absolute;
	height: 2px;
	width: 100%;
	background: #fff;
	border-radius: 0;
	opacity: 1;
	left: 0;
	top: 4px;
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
	-webkit-transition: .25s ease-in-out;
	-moz-transition: .25s ease-in-out;
	-o-transition: .25s ease-in-out;
	transition: .25s ease-in-out;
}
#nav-icon3 span:nth-child(1) {
	top: 0px;
}
#nav-icon3 span:nth-child(2), #nav-icon3 span:nth-child(3) {
	top: 6px;
}
#nav-icon3 span:nth-child(4) {
	top: 12px;
}
#nav-icon3.open span:nth-child(1) {
	top: 18px;
	width: 0%;
	left: 50%;
}
#nav-icon3.open span:nth-child(2) {
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	transform: rotate(45deg);
}
#nav-icon3.open span:nth-child(3) {
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
#nav-icon3.open span:nth-child(4) {
	top: 18px;
	width: 0%;
	left: 50%;
}
.subpage img.mrsilohero {width: 180px;}
.WYSIWYG {margin-left: 210px;}
.subpage h1 {padding-left: 210px;}

}

@media only screen and (max-width: 768px) {
.image0 {
	width: 100%;
	height: 192px;
	background-image: url(../templates/img/twin-silos@2x.jpg);
	background-size: 100% auto;
	background-position: center 30%;
}
.image1, .image2 {
	display: none;
}
.blueframe, .homesections {
	width: 100%;
}
.hero > .buttonframe {
	position: absolute;
	top: auto;
	width: 100%;
	left: 20px;
	padding: 0;
	right: auto;
	z-index: 1;
	border-radius: 0;
	background: #fad406;
	height: 50px;
}

.hero > .contactinfo {
	position: absolute;
	top: 55px;
	width: 100%;
	left: 30px;
	padding: 0;
	right: auto;
	z-index: 1;
	border-radius: 0;
	height: 50px;
	text-align: right;
}

.contactinfotext {
	color: #1c2942;
	font-size: 18px;
	text-align: right;
}

.contactinfotext a{
	color: #1c2942;
	font-size: 18px;
	font-weight: 100;
}

img.mrsilohero {
	z-index: 3;
	position: absolute;
}
.buttonframe > .button {
	margin-left: 180px;
	color: #1c2942;
	border: 0;
	height: auto;
	padding: 0;
	text-align: right;
	float: right;
	margin-right: 20px;
}
.buttonframe > .button > img {
	display: none;
}
.beforeafter1, .beforeafter2 {
	height: 200px;
}
.beforeafter1 span, .beforeafter2 span {
	margin-top: 0;
	font-size: 24px;
}
}

@media only screen and (max-width: 540px) {
.heromessage {
	font-size: 34px;
}
img.mrsilohero {
	width: 170px;
}
.hero {
	height: 270px;
}
.beforeafter1, .beforeafter2 {
	height: 120px;
}
.heromessage {
	padding: 10px 0 10px 220px;
}
.buttonframe > .button {
	font-size: 20px;
	margin-top: 6px;
	width: 150px;
}
.subpage img.mrsilohero {z-index: -1;
opacity: .125;
margin-top: -100px;}
.WYSIWYG {
	margin-left:20px;
}
.subpage h1 {
	text-align:center;
	padding-left:20px;
	padding-right:20px;
}
}

@media only screen and (max-width: 440px) {
.WYSIWYG img {
	max-width: 100% !important;
}
}

@media only screen and (max-width: 375px) {
.heromessage {
	float: none;
	text-align: left;
	padding-top: 70px;
	padding-left: 20px;
}
.heromessage > br {
	display: none;
}
.hero {
	height: 200px;
}
img.mrsilohero {
	width: 130px;
}
.sectioneven, .sectionodd {
	padding: 26px;
}
}

/*PRINT*/

@media print {
body {
	background: #fff;
	color: #000;
}
p h1, h2, h3, h4, h5, a {
}
a {
	font-weight: bold;
}
.navigation, .topnav {
	display: none;
}
.WYSIWYG p {
	font-size: 12px;
}
.subcontainer h1 {
	font-size: 20px;
}
.WYSIWYG h2 {
	font-size: 16px;
}
.WYSIWYG h3 {
	font-size: 14px;
}
}
