/***** Main Body Setup *****/
body{
	background-color: #FFF;
	margin:0 auto;
}

/****** Master Page Setup *******/
div#main_ad_container{
	width:95%;
	margin:10px auto 0px;
}
div.container_border_top{
	border-top: 5px solid #38813E;
	width:95%;
	margin: 15px auto 0px;
	padding: 15px 0px 0px;
}
div.container_border_top_nomargin{
	border-top: 5px solid #38813E;
	width:95%;
	margin: 0px auto;
	padding:1px 0px;
}
div.container_border_top_mcl{
	border-top: 5px solid #df102d;
	width:95%;
	margin: 15px auto 0px;
	padding: 15px 0px 0px;
}
div.container_border_top_nomargin_mcl{
	border-top: 5px solid #df102d;
	width:95%;
	margin: 0px auto;
	padding:1px 0px;
}
div.container_border_top.blend{
	margin-top:0px;
}
div.container_border_top.no-border{
	border-top:none;
	padding: 0 0 15px 0;
}

/* For Screen Reader, Search Engine Optimization, or Image Replacement */
.spacer span {
	height: 0px;
	width: 0px;
	display: block;
	overflow: hidden;
	font-size:1px;
}
	
/* Floats */
.float-left{
	float:left;
}
.float-right{
	float:right;
}

/***** Index Page Information *****/
/* Emergency Action Messages */
#message{
	width:85%;
	margin:10px auto 0px;
	padding:10px 35px;
	background-color: #999999;
}
#message h4{ color:#FFF; font-size:125%; font-weight:bold; margin-bottom:5px; }
#message p{ color:#FFF; font-size:105%;}
#message ul li{color:#FFF; font-size:105%; list-style-type:circle;}
#message a{color:#000;} #message a:hover{color:#000; text-decoration:underline;}


/***** For new responsive layout *****/
/*----- Toggle Button -----*/
.toggle-nav,.toggle-nav-mcl, .toggle-logo, .toggle-back, .toggle-back-sub, .toggle-home-mobile, .sub-menu{
    display:none;
}
 
/*----- Menu -----*/
.menu {
	width:95%;
	padding:10px 18px;
	box-shadow:0px 1px 1px rgba(0,0,0,0.15);
	border-radius:3px;
	margin:auto;
	text-align:center;
 }
.menu.green {
 	background:#38813E;
 }
.menu.mcl {
	background:#df102d;
}
.menu ul {
    display:table;
	margin:auto;
}
.menu li {
    display:table-cell;
	vertical-align: middle;
	padding:0px 50px 0px 0px;
    list-style:none;
    font-size:17px;
}
.menu li:last-child {
    margin-right:0px;
}
.menu a {
    text-shadow:0px 1px 0px rgba(0,0,0,0.5);
    color:#FFF;
    transition:color linear 0.15s;
}
.menu a:hover, .menu .current-item a {
	text-decoration: none;
	color: #000;
}
/*----- Search -----*/
.search-form {
    float:right;
    display:inline-block;
}
.search-form input {
    width:75px;
    height:15px;
    padding:0px 8px;
    float:left;
    border-radius:2px 0px 0px 2px;
    font-size:10px;
}
.search-form button {
    height:15px;
    padding:0px 7px;
    float:right;
    border-radius:0px 2px 2px 0px;
    background:#66a992;
    font-size:10px;
    font-weight:600;
    text-shadow:0px 1px 0px rgba(0,0,0,0.3);
    color:#fff;
}
/* --- Address Container --------*/
.address_container{	display:inline; text-align:center;}
.address_container ul li {list-style-type: none;}

#copyright{
	width:95%;
	margin: 5px auto 25px;
	text-align:center;
}

/*----- Grid Layout Default Values -----*/
.one-col-main{
	padding:10px 35px;
}

.grid-fluid{
	width:45%;
	max-width:460px;
	max-height:300px;
	margin-left:3%;
	float:left;
	margin-bottom:2.5%;
}

.grid-fluid-center{
	width:45%;
	max-width:460px;
	max-height:300px;
	margin-left:3%;
	text-align: center;
	margin-bottom:2.5%;
}

.square-touch-fluid{
	border:2px solid #C0C0C0;
	-moz-border-radius:20px;
	-webkit-border-radius:20px;
	border-radius:20px;
}
		
.square-touch-fluid:hover{
	border-color: #47AE4B;
}

.square-touch-fluid-mcl{
	border:2px solid #C0C0C0;
	-moz-border-radius:20px;
	-webkit-border-radius:20px;
	border-radius:20px;
}
		
.square-touch-fluid-mcl:hover{
	border-color: #df102d;
}
	
.species-touch-fluid{
	display:block;
	-moz-border-radius:20px 20px 0 0;
	-webkit-border-radius:20px 20px 0 0;
	border-radius:20px 20px 0 0;
}

.species-title{
	padding:5px 8px 0 0;
	-moz-border-radius:0 0 10px 10px;
	-webkit-border-radius:0 0 10px 10px;
	border-radius:0 0 10px 10px;
	background-color:#38813E;	
}

.selection-square{
	max-width:100%;
	max-height:100%;
}

/* - Begin Media Queries - */
@media only screen and (max-width: 500px) { 
.grid-fluid{
	width:95%;
	float:none;
}
}
@media only screen and (min-width: 1001px){
.grid-fluid{
	width:29%;
	max-width:460px;
	max-height:300px;
	float:left;
}
}
/* - End Media Queries - */
	

/*-----	Main Advertisements -----*/
#main_ad_container img{ max-width:100%; max-height:100%;	}
	
/*- Title -*/
.title_ad_1{	 max-width:58%; max-height:100%;	}
.title_ad_2, .title_ad_3{ max-width:40%; max-height:100%; }
	
/*- Products -*/
.products_ad_1{	max-width:48%; max-height:100%; }
.products_ad_2, .products_ad_3{	max-width:50%; max-height:100%; }
	
/*- Species Select -*/
.species_select_ad_1{ max-width:43%; max-height:100%; }
.species_select_ad_2, .species_select_ad_3{	max-width:55%; max-height:100%;	}

/*- Species -*/
.species_ad_1{ width:49%; position:relative; z-index:1; } 
.species_ad_2{ width:49%; }
.species_ad_background{
	position:absolute; z-index:0; left:12%; top:41%;
}

/*- Wholesale -*/
.wholesale_ad_1 { max-width:43%; max-height:100%; }
.wholesale_ad_2, .wholesale_ad_3 { max-width:55%; max-height:100%; }

/*- Retail -*/
.retail_ad_1, .retail_ad_2 { max-width:51%; max-height:100%; }
.retail_ad_3 { max-width:47%; max-height:100%; }

/*- Customers -*/
.customers_ad_1{ max-width:45%;	}
.customers_ad_2, .customers_ad_3{ max-width:53%;	 }
		
/*- Services -*/
.services_ad_1{	max-width:50%; max-height:100%;	}
.services_ad_2, .services_ad_3{	max-width:48%; max-height:100%;	}
	
/*- Accounts -*/
.accounts_ad_1{	max-width:49%; max-height:100%; }
.accounts_ad_2, .accounts_ad_3{	max-width:49%; 	max-height:100%; }
	
/*- Social Networking -*/
.social_ad_1{ max-width:48%; max-height:100%; }
.social_ad_2{ max-width:50%; max-height:100%; }
	
/*- Conatct Us -*/
.contact_us_ad_1{ max-width:43%; }
.contact_us_ad_2{ max-width:55%; }
	/*- ** Quote Request -*/
	.quote_request_ad_1{max-width:46%;}
	.quote_request_ad_2{max-width:52%;}
	
/*- Marine Lumber & Plywood -*/
.marine_ad_1{ max-width:41%; }
.marine_ad_2{ max-width:57%; }
.plywood_listings_ad1{max-width:49%;}
.veneer_face_ad2{max-width:49%;}

/*- Commercials -*/
.ads_title_ad_1{ max-width:51%; }
.ads_title_ad_2, .ads_title_ad_3{ max-width:47%; }
	

/* - Begin Media Queries - */
@media only screen and (min-width: 1001px){
#main_ad_container{	max-width:940px; }
	
/*- Title -*/
.title_ad_1{ max-width:529px; }
.title_ad_2, .title_ad_3{ max-width:411px; }
	
/*- Products -*/
.products_ad_1{	max-width:454px; } 
.products_ad_2, .products_ad_3{	max-width:486px; }
	
/*- Species Select -*/
.species_select_ad_1{ max-width:400px; }
.species_select_ad_2, .species_select_ad_3{	max-width:540px; }

/*- Species -*/
.species_ad_1{ width:469px; position:relative; z-index:1; } 
.species_ad_2{ width:469px; }
.species_ad_background{ 	position:absolute; z-index:0; left: 117px; top: 146px; }

/*- Wholesale -*/
.wholesale_ad_1 { max-width:400px; }
.wholesale_ad_2, .wholesale_ad_3 { max-width:540px; }

/*- Retail -*/
.retail_ad_1, .retail_ad_2 { max-width:479px; max-height:100%; }
.retail_ad_3 { max-width:461px; max-height:100%; }
	
/*- Customers -*/
.customers_ad_1{ max-width:434px; }
.customers_ad_2, .customers_ad_3{ max-width:506px; }
	
/*- Services -*/
.services_ad_1{	max-width:483px; }
.services_ad_2, .services_ad_3{	max-width:457px; }

/*- Accounts -*/
.accounts_ad_1{	max-width:461px; }
.accounts_ad_2, .accounts_ad_3{ max-width:479px; }
	
/*- Social Networking -*/
.social_ad_1{ max-width:463px; }
.social_ad_2{ max-width:467px; }

/*- Conatct Us -*/
.contact_us_ad_1{ max-width:418px; }
.contact_us_ad_2{ max-width:522px; }
	/*- ** Quote Request -*/
	.quote_request_ad_1{max-width:434px;}
	.quote_request_ad_2{max-width:506px;}
	
/*- Marine Lumber and Plywood -*/
.marine_ad_1{ max-width:382px; }
.marine_ad_2{ max-width:558px; }
.plywood_listings_ad1{max-width:463px;}
.veneer_face_ad2{max-width:477px;}

/*- Commercials -*/
.ads_title_ad_1{ max-width:497px; }
.ads_title_ad_2, .ads_title_ad_3{ max-width:443px; }
	
} /* - End Media Queries - */

/*-----	End Main Advertisement ----*/

@media screen and (max-width: 1150px) {
.wrap { width:90%; }
}
 
@media screen and (max-width: 767px) {
.menu { position:relative; display:inline-block; }
	.menu.mcl { position:relative; display:inline-block; }
.menu ul.active { display:none; }
	.menu.mcl ul.active { display:none; }
.menu ul.active a{ color: #FFF; }
	.menu.mcl ul.active a{ color: #FFF; }
.menu ul {
	width:80%;
	position:absolute;
	top:120%;
	left:0px;
	padding:10px 18px;
	box-shadow:0px 1px 1px rgba(0,0,0,0.15);
	border-radius:3px;
	border: 1px solid #000;
	background:#38813E;
	z-index:999;
}
	.menu.mcl ul {
	width:80%;
	position:absolute;
	top:120%;
	left:0px;
	padding:10px 18px;
	box-shadow:0px 1px 1px rgba(0,0,0,0.15);
	border-radius:3px;
	border: 1px solid #000;
	background:#df102d;
	z-index:999;
}
.menu ul:after {
	width:0px;
	height:0px;
	position:absolute;
	top:0%;
	left:0px;
	content:'';
	transform:translate(0%, -100%);
	border-left:7px solid transparent;
	border-right:7px solid transparent;
	border-bottom:7px solid #303030;
}
	.menu.mcl ul:after {
	width:0px;
	height:0px;
	position:absolute;
	top:0%;
	left:0px;
	content:'';
	transform:translate(0%, -100%);
	border-left:7px solid transparent;
	border-right:7px solid transparent;
	border-bottom:7px solid #303030;
}
.menu li { margin:5px 0px 5px 0px; padding:12px 0px; float:none; display:block; }
	.menu.mcl li { margin:5px 0px 5px 0px; padding:12px 0px; float:none; display:block; }
.menu a { display:block; }
	.menu.mcl a { display:block; }


/* Hide logo on desktop navigation */	
.toggle-home-desktop{display:none;}
.toggle-home-mobile{display:inline-block;}
	
.toggle-nav {
	padding:20px;
	position:absolute;
	display:inline-block;
	box-shadow:0px 1px 1px rgba(0,0,0,0.15);
	border-radius:3px;
	background:#38813E;
	text-shadow:0px 1px 0px rgba(0,0,0,0.5);
	color:#000;
	font-size:20px;
	transition:color linear 0.15s;
}
.toggle-nav-mcl {
	padding:20px;
	position:absolute;
	display:inline-block;
	box-shadow:0px 1px 1px rgba(0,0,0,0.15);
	border-radius:3px;
	background:#df102d;
	text-shadow:0px 1px 0px rgba(0,0,0,0.5);
	color:#000;
	font-size:20px;
	transition:color linear 0.15s;
}
	
.toggle-nav:hover, .toggle-nav.active { text-decoration:none; color:#66a992; }
.toggle-logo{ display:block; margin:auto; width:20%;	}
.toggle-back{ 
	padding:20px; 
	position:absolute; 
	right:20px;
	display:inline-block;
	box-shadow:0px 1px 1px rgba(0,0,0,0.15);
	border-radius:3px;
	background:#38813E;
	text-shadow:0px 1px 0px rgba(0,0,0,0.5);
	color:#000;
	font-size:20px;
	transition:color linear 0.15s;
}
	.toggle-back:hover, .toggle-back.active { text-decoration:none; color:#66a992; }
 
.search-form { margin:12px 0px 0px 20px; float:left; }
.search-form input { box-shadow:-1px 1px 2px rgba(0,0,0,0.1); }

/* ----------- Footer ----------*/
/*  Basic stucture =====================*/
#accordion{ margin:25px auto;width:95%; }
#accordion ul{ margin:0;padding:0; }
#accordion ul li{ list-style:none; }
.accordion{ display:none; }
.accordion:target{ display:block; }
#accordion ul li a{ text-decoration:none;display:block;padding:10px; }
.accordion{ padding:4px; }

/*  Colors ====================*/
#accordion ul{
/*box-shadow*/
	-webkit-box-shadow:0 4px 10px #BDBDBD;
	-moz-box-shadow:0 4px 10px #BDBDBD;
    box-shadow:0 4px 10px #BDBDBD;
/*border-radius*/
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
    border-radius:5px;
}
#accordion ul li a{	background:#fff; border-bottom:1px solid #47AE4B; color:#999; }
	#accordion.mcl ul li a{	background:#fff; border-bottom:1px solid #df102d; color:#999; }
.accordion{ background:#fdfdfd; color:#999; }
.accordion:target{ border-top:3px solid #FFCDCD; }
} /*@media screen and (max-width: 767px)*/

@media screen and (min-width: 768px) {
.sub-menu{ width:95%; display:block;	background:#C0C0C0;	padding:3px 18px; margin:auto; }
.sub-menu a{ text-shadow:0px 1px 0px rgba(0,0,0,0.5); color:#000; transition:color linear 0.15s; }
.sub-menu a:hover{ text-decoration: none; color: #FFF; }

.toggle-back-sub{
	display:block;
	text-shadow:0px 1px 0px rgba(0,0,0,0.5);
	text-align:left;
    color:#000;
    font-size:17px;
    transition:color linear 0.15s;
}

#accordion{	padding: 2px 0;	background-color: #38813E; border: 2px solid #C0C0C0; text-align:center; }
#accordion.mcl{ background-color: #DF102D;}
#accordion ul{ display:inline-block; }
#accordion ul li{ margin:0px 30px 0px 0px; list-style-type:none; float:left; }
#accordion ul li a{	
	color:#FFF;	
	text-decoration:none; 
	text-shadow:0px 1px 0px rgba(0,0,0,0.5); 
	transition:color linear 0.15s;
}
#accordion ul li a:hover{ color:#000; text-decoration:none; }

} /*@media screen and (min-width: 768px)*/


/*--- Navigation Font Adjustments ---*/
@media screen and (min-width:768px) and (max-width:800px){
.menu li{ font-size:98%; margin:0px 35px 0px 0px; }
} /*@media screen and (min-width:768px) and (max-width:800px)*/

@media screen and (min-width:800px) and (max-width:900px){
.menu li{ margin:0px 35px 0px 0px; }
} /*@media screen and (min-width:800px) and (max-width:900px)*/
