/* Copyright (c) 2010-2020 SWG Media - All Rights Reserved */

body {background-color:#222;
	margin:0px;
	padding:0px;
	font-family:'Segoe Ui', Calibri, 'Myriad Pro', Helvetica, 'Sans-Serif';}

img {border:none;}

header, section, nav, p, h1, h2 {margin:0px;
	padding:0px;}
			
h2 {font-size:18pt;
	font-family:'Adelle', 'Palatino Linotype', 'Book Antiqua', Palatino, serif;
	font-weight:normal;}

.wrapper {width:97%;
	max-width:1100px;
	margin:0px auto;
	padding:0;}
	
#pagelightbg {width:100%;
	margin:0;
	overflow:hidden;
	background-color:#ccc;}
	
.spadding {padding:10px; overflow:hidden;}
.mpadding {padding:20px; overflow:hidden;}
.lpadding {padding:40px 0px;}
	
		#top {width:100%;
			margin:0px auto;
			padding:0;
			overflow:hidden;}
			
			#toplr:nth-of-type(1) {display:none;}
			#toplr {width:100%;
				float:left;
				padding:0;
				margin:0;
				font-size:16pt;
				color:#fff;
				text-align:center;
				font-family:'Adelle', 'Palatino Linotype', 'Book Antiqua', Palatino, serif;}
			
			/* Bakersfield Epoxy Floors Logo */
			#toplogo {width:100%;
				float:left;
				padding:15px 0 10px 0;
				text-align:center;}
				#toplogo img {width:100%;
					max-width:350px;}
				
			#topnav {width:100%;
				float:left;
				text-align:center;
				color:#fff;
				margin:0;
				font-family:'Adelle', 'Palatino Linotype', 'Book Antiqua', Palatino, serif;}
						
			/** Dropdown Menu. Code from http://osvaldas.info/drop-down-navigation-responsive-and-touch-friendly **/
				#nav {width:100%;
					top: 0;
					left:0px;
					margin:0;
					padding:10px 0 0 0;
					position: relative;
					float:left;
					z-index:1200;
					font-size:14pt;}

					#nav > a {display: none;
						text-decoration:none;
						width:97%;
						height:24px;
						padding:0 0 10px 2%;
						text-align:left;
						position: relative;
						color:#ffffff;
						font-size:16pt;}
						#nav > a > img {width:32px;}

					#nav li {position: relative;
						list-style:none;}
						#nav li a {
							display: block;}
						#nav li a:active {background-color: #666 !important;
							color:#ccc  !important;}

					#nav span:after {width: 0;
						height: 0;
						content: '';
						vertical-align: middle;
						display: inline-block;
						position: relative;
						right: -5px;}

					/* first level */

					#nav > ul {width:200px;
						height: 50px;
						height: auto;
						display: none;
						position: absolute;
						left: 5px;
						right: 0;
						top:28px;
						list-style:none;
						background-color:#555;
						color:#eee;
						padding:0px;}
						#nav:target > ul {display: block;}
						#nav > ul > li {height: 100%;
							width: 100%;
							float: none;}
							#nav > ul > li > a {height: 100%;
								text-decoration:none;
								padding:7px 18px;
								text-align: left;
								color:#ffffff;}
								#nav > ul > li:not( :last-child ) > a
									{/** border-right: 1px solid #cc470d; **/
									border-right: none;
									border-bottom: 1px solid #888;}
								#nav > ul > li:hover > a,
								#nav > ul:not( :hover ) > li.active > a
									{color:#cc9900;
									text-decoration:underline;}

				#nav:not( :target ) > a:first-of-type,
				#nav:target > a:last-of-type
					{display: block;}	
				
	#slideshow {width:100%;
		float:left;
		margin:35px 0 0 0;}
		#slideshow img {width:100%;
			max-width:1100px;}
		
	.pagebody {width:90%;
		float:left;
		margin:35px 0 0 0;
		padding:5% 5%;
		font-size:13pt;
		line-height:27px;
		background-color:#fff;}
	.pagebodydark {width:90%;
		float:left;
		margin:0 0 -35px 0;
		padding:2.5% 5%;
		background-color:#999;
		font-size:13pt;
		text-align:center;
		line-height:27px;}
		.pagebodydark img {width:100%;
			margin:0 auto;}
		
		.pagesection {width:100%;
			float:left;
			margin:0 0 5% 0;}
			.pagesection:nth-last-of-type(1) {margin:0;}
			
			.halfpage {width:100%;
				float:left;
				margin:0 0 10px 0;}
				.halfpageimg {display:none;}
			
			.mhalfpageimg {width:50%;
				max-width:350px;
				margin:10px 0 5px 0;}
				.purpletext >.mhalfpageimg {float:left;
					margin-right:5px;}
				.bluetext >.mhalfpageimg {float:right;
					margin-left:5px;}
			
			.purpleh {color:#9a2576;}
			.purpletext {font-weight:normal;
				border-top:1px solid #9a2576;}
				
			.blueh {color:#2e2d72;}
			.bluetext {font-weight:normal;
				border-top:1px solid #2e2d72;}
			
		.pagebody h3 {font-weight:normal;
			font-size:15pt;
			font-family:'Adelle', 'Palatino Linotype', 'Book Antiqua', Palatino, serif;
			margin:0;}
			
		@media only screen and (min-width:600px) {
		.flooringcolor {width:30%;
			float:left;
			margin:0 0 20px 0;
			padding:0 0 10px 0;
			border-bottom:1px solid #ddd;}
			.flooringcolor:nth-of-type(3n) {padding:0 4% 10px 4%;}
		}
		@media only screen and (max-width:599px){
		.flooringcolor {width:48%;
			float:left;
			margin:0 0 20px 0;
			padding:0 0 10px 0;
			border-bottom:1px solid #ddd;}
			.flooringcolor:nth-of-type(2n) {padding:0 2% 10px 0;}
			.flooringcolor:nth-of-type(2n+1) {padding:0 0 10px 2%;}
		}
			.flooringcolor img {width:100%;}
			
	/*--- Slideshow Stuff (most is now on seperate flexslider.css page) ---*/
		
		.slides img {width:100%;
			max-width:1000px;
			margin:0;}
			
	/*--- End of Slideshow Stuff ---*/	
			
	.photospage {width:100%;
		float:left;
		margin:0px;
		text-align:center;}
		.doublephoto {width:100%;
			margin:10px 0;}
		.singlephoto {width:100%;
			margin:10px 0;}			
	
			
	#bottom {width:100%;
		float:left;
		text-align:center;
		background-color:#333;
		color:#fff;}
		#bottom a {color:#fff;
			text-decoration:none;}
			#bottom a:hover {color:#cc9900;
				text-decoration:underline;
				-webkit-transition: all 0.3s ease-in-out;
				-moz-transition: all 0.3s ease-in-out;
				-o-transition: all 0.3s ease-in-out;
				-ms-transition: all 0.3s ease-in-out;
				transition: all 0.3s ease-in-out;}
		
		#bottomnav {width:98%;
			margin:25px auto;
			font-size:14pt;
			color:#fff;
			font-family:'Adelle', 'Palatino Linotype', 'Book Antiqua', Palatino, serif;}
			#bottomnav a, #bottomnav u {margin:0px 10px;
				padding:5px 10px;}
		#spyder {width:98%;
			font-size:10pt;
			color:#eee;
			margin:60px 0 40px 0;}
			#spyder a {color:#eee;
				text-decoration:none;}