/* ========================== */
/* -- iPhone, etc portrait -- */
/* ========================== */

@media only screen and (min-width: 320px) {
    
    body {
    	background: url( ../images/mobile/mobile-bg.png ) repeat;
    }
    
    #wrapper {
    	width: 99%;
    	margin: 0 auto;
    	box-shadow: 0px 3px 12px rgba(0,0,0,0.5);
    	overflow: hidden;
    }

    
    /* normalize grid sizes */
    .saran, .c980, .c740, .c320, .c320 + .c320, .c240, bodyMain, .bodyHead {
    	width: 100%;
    	float: left;
    	margin: 0;
    	padding: 0;
    }
    
    /* hide other site links, image rotator */
    .brand-tabs,
    .bannerLeft {
    	display: none;
    }
    
    /* reel in images  */
    img {
    	max-width: 95%;
    }
    
    /* make sit nicely inside of wrapping div */
    /* .mastHead, */
    .bodyMainHome,
    .homeFeatures   {
    	width: 95%;
    	padding: 0;
    }
    

  	/* --- header --- */
  	
  	.highHeader {
  		display: none;
  	}
  	
  	.logo {
  		float: none;
  		margin: 0 auto;
  	}
  	
  	/* navigation */
  	
  	.nav { 
  		width: 100%; 	
  		text-align: center;
  		background: #4f4f4f url( ../images/mobile/mobile-nav-bg.png ) repeat;
  		border-top: 1px solid #444;
  		border-bottom: 1px solid #444;
  	}
  	
  	.nav ul {
  		position: relative;
  		left: 50%;
  		text-align: center;
  		padding: 5px 0;
  	}
  	
  	.nav ul li {
  		position: relative;
  		right: 50%;
  		font-size: 12px;
  		margin-right: 5px;
  	}
  	
  	.nav ul li a,
  	.nav ul li a:hover,
  	.nav ul li.current_page_item a, 
  	.nav ul li.current_page_parent a, 
  	.nav ul li.current_page_ancestor a,
  	.nav ul li.current_page_item a:hover, 
  	.nav ul li.current_page_parent a:hover, 
  	.nav ul li.current_page_ancestor a:hover {
  		background: rgba(0,0,0,0.2);
  		border-radius: 5px;
  		color: #fff;
  		text-shadow: 0 -1px 0 #000;
  		line-height: 22px;
  		padding: 5px 8px;
  		display: block;
  		border: none;
  	}

	.subnav ul li a {
		margin: 2px 0;
	}
	
	.subnav {
		width: 100%;
	}
  	
  	/* hide estimate button */
  	.promo { display: none; }
  	
  	
  	/* hide mobile menu */
  	#menu-icon {
  		display: block;
  		background: #f0f0f0 url( ../images/mobile/menu-icon.png) no-repeat 15px center;
  		border: 1px solid #ccc;
  		padding: 5px 5px 5px 50px;
  		float: left;
  		width: 100%;
  	}
  	
  	.subnav ul {
  		display: none;
  	}
  	
  	.subnav ul li {
  		margin: 3px;
  		font-size: .7em;
  	}
  	
  	.subnav ul li a,
  	.subnav ul li a:hover,
  	.subnav ul li.current_page_item a, 
  	.subnav ul li.current_page_parent a, 
  	.subnav ul li.current_page_ancestor a,
  	.subnav ul li.current_page_item a:hover, 
  	.subnav ul li.current_page_parent a:hover, 
  	.subnav ul li.current_page_ancestor a:hover{
  		background: none;
  		border: none;
  		margin: 0px;
  		background: rgba(0,0,0,0.2);
  		border-radius: 5px;
  	}
  	
  	/* --- content - home --- */
  	
  	.homeText,
  	.bannerCon,
  	.bannerRight {
  		width: 100%;
  		margin: 0 auto;
  	}
  	
  		.bannerRight {
  			padding-top: 20px;
  		}
  	
  		.bannerRight img,
  		.contactModal {
  			display: block;
  			margin: 0 auto;
  		}
  		
  		.contactModal {
  			margin: 0 auto;
  			text-align: center;
  			background: none;
  			border: none;
  		}
  		
  		.homeFeature {
  			width: 95%;
  			margin-left: 7%;
  		}
  		
  		.homeAnnounce {
  			width: 90%;
  			margin-left: 7%;
  		}
  		
  		.homeAnnounce ul {
  			margin: 0 35px;
  		}
  		
  		.homeAnnounce ul li {
  			text-align: center;
  			font-size: 12px;
  			line-height: 20px;
  		}
  		
  		/* align social icons */
  		.homeAnnounce ul li.social {
  			float: left;
  			width: 49%;
  		}
  		
  		.homeAnnounce ul li strong {
  			float: none;
  		}
  		
  		.homeAnnounce ul li.mission {
  			font-size: 12px;
  			line-height: 18px;
  			font-weight: normal;
  		}
  		
  		.flooring-warranty {
  			width: 90%;
  			margin-left: 7%;
  		}
  		
  		.homeSummary {
  			width: 100%;
  			background: none;
  		}
  	
	  	/* -- home text - home page drop downs -- */
	 
	 	.homeText h2 {
	 		color: #fff;
	 		text-shadow: 0 -1px 0 #000;
	 		padding: 8px 10px;
			border: 1px solid #53565b;
			background: #6f6f6f url(../images/mobile/mobile-button.png) repeat;
	 		position: relative;
	 		z-index: 99;
	 	}
	 	
	 	.homeText h2 span {
	 		position: relative;
	 		z-index: 999;
	 		width: 35px;
	 		height: 22px;
	 		float: right;
	 		background: url(../images/mobile/down-arrow.png) no-repeat center right;
	 	}
	 	
	 	.homeText ul,
	 	.homeText .contact-dl {
	 		display: none;
	 	}

	 
	 	.homeText ul li, 
	 	.homeText ol li {
	 		border-bottom: none;
	 		border-radius: 5px;
	 		padding: 10px;
	 		margin-bottom: 2px;
	 		background: #444 url(../images/mobile/menu-li.png) no-repeat 98% center;
	 	} 
	 	
	 	.homeText a {
	 		text-decoration: none;
	 		color: #fff;
	 		text-shadow: 0 -1px 0 #000;
	 	}

	 	.homeText .services-ul a,
	 	.homeText .blog-ul a{
	 		padding-right: 25px;
	 	}
	 	
	 	
	 	/* contact section links */
	 	
	 	.contact-dl a{
	 		color: #444;
	 		text-shadow: 0 1px 0 #fff;
	 	}
	 	.contact-dl a.cButton{
	 		color: #fff;
	 		text-shadow: 0 -1px 0 #444;
	 	}
	 	
	 	
	 	/* -- deals -- */
	 	
	 	.c740 .introCon {
	 		background: url( ../images/mobile-bkg-introCon.png ) no-repeat center top;
	 		padding-top: 100px;
	 		width: 90%;
	 		float: left;
	 		padding: 0;
	 		text-align: center;
	 	}
	 	
	 	.eNewsForm,
	 	.eNewsFormCon {
	 		width: 90%;
	 		float: left;
	 	}
	 	
	 	.eNewsFormCon input.text {
	 		float: left;
	 	}
	 	
	 	.eNewsFormCon label {
	 		margin-left: 50px;
	 	}
	 	
	 	.introCon span.header {
	 		margin-top: 175px;
	 		font-size: 30px;
	 	}
	 	
	 	.introCon span.calltoaction {
	 		font-size: 30px;
	 	}
	 	
	 	.carpetTypes h3	{
	 		text-align: center;
	 	}


	 /* pages */
	 
	 .bodyMain {
	 	width: 100%;
	 	float: left;
	 }	
	 
	 .c740 .post {
	 	width: 90%;
	 	float: left;
	 } 
	 
	 .pageTitle {
	 	width: 100%;
	 	text-align: center;
	 }
	 
	 .pageTitleAlert {
	 	display: none;
	 }
	 
	 .post ul, .post ol {
	 	margin: 0;
	 }
	 
	 /* hide tables */
	 
	 table {
	 	display: none;
	 }
	 
	 /* blog */
	 
	 .postArchive {
	 	width: 90%;
	 	float: left;
	 }
	 
	 .obj-txt p {
	 	clear: both;
	 }
	 
	 
	 /* sidebar navigation */
	 .sidenav {
	 	width: 94%;
	 	float: left;
	 	padding: 10px 0;
	 	margin: 0;
	 }
	 
	 .sidenav ul {
	 	width: 100%;
	 	border-top: none;
	 }
	 
	 .sidenav li {
	 	width: 90%;
	 	border-bottom: none;
	 	padding: 3px;
	 	margin: 0 auto;
	 	float: none;
	 	display: block;
	 }
	 
	 .sidenav li a,
	 .sidenav li.current_page_item a, 
	 .sidenav li.current_page_item a:hover, 
	 .sidenav li.current_page_parent a, 
	 .sidenav li.current_page_parent a:hover, 
	 .sidenav li.current_page_ancestor a, 
	 .sidenav li.current_page_ancestor a:hover  {
	 	width: 95%;
	 	background: rgba(0,0,0,0.2);
	 	display: block;
	 	border-radius: 5px;
	 	text-shadow: 0 1px 0 rgba(250,250,250,0.4);
	 }
	 
	 .sidenav li.current_page_item a, 
	 .sidenav li.current_page_item a:hover, 
	 .sidenav li.current_page_parent a, 
	 .sidenav li.current_page_parent a:hover, 
	 .sidenav li.current_page_ancestor a, 
	 .sidenav li.current_page_ancestor a:hover {
	 	color: #fff;
	 	width: 95%;
	 	text-shadow: 0 -1px 0 rgba(0,0,0,0.2);
	 }
	 
	 /* contact page */
	 
	 .cform {
	 	width: 100% !important;
	 }
	 
	 .cform label span,
	 .cform input span{
	 	text-align: left !important;
	 	margin-left: 10px;
	 }
	 
	 .cform select {
	 	width: 90% !important;
	 	margin-left: 10px !important;
	 }
	 
	 span.reqtxt, span.emailreqtxt {
	 	margin-left: 10px !important;
	 }
	 
	 .cform textarea, 
	 .cform input{
	 	width: 90% !important;
	 	margin-left: 10px;
	 }
	 
	 p.cf-sb {
	 	text-align: center !important;
	 }
  	
  	/* --- footer --- */
  	.branding,
  	.footnav,
  	.legal {
  		width: 95%;
  		float: left;
  		text-align: center;
  	}
  	
  	.footnav {
  		display: none;
  	}

	.footer p {
		font-size: 12px;
		line-height: 18px;
	}
	
	.footer a {
		display: none;
	}
  
}  


/* ============================*/
/* -- iPhone, etc landscape -- */
/* ============================*/

@media only screen and (min-width: 480px) {
	
	#wrapper {
		width: 95%;
		margin: 0 auto;
	}
  
}


/* ============ */
/* -- Tablet -- */
/* ============ */

@media only screen and (min-width: 768px) {

	
	/*
	.brand-tabs,
	.bannerLeft {
		display: block;
	}
	
	.bannerLeft {
		width: 70%;
		float: left;
	}
	
	.bannerRight {
		width: 25%;
		float: right;
	}
	*/
	
	#wrapper {
		width: 100%;
		margin: 0 auto;
	}
	
	/* home - slider & cta */
	
	.bannerLeft {
		display: block;
		width: 485px;
		overflow: hidden;
	}
		#slideshow {
			width: 475px;
			height: 225px;
			margin-top: 20px;
			margin-left: 10px;
		}
		
		#slideshow #slidesContainer {
			width: 475px;
			height: 223px;
		}
		
		#slideshow #slidesContainer .slide {
			width: 475px;
			height: 223px;
		}
		
		#slideshow img {
			width: 475px;
			height: 223px;
		}
	
	.bannerRight {
		width: 250px;
		float: right;
	}
		.contactModal {
			width: 200px;
		}
		
		.contactModal h3 span {
			font-size: 20px;
		}

	/* home - bottom call outs */
	.homeFeatures .c320 {
		width: 33.3%;
		float: left;
	}
	
	.emailreqtxt {
		display: block;
	}

}