/************************************/
/*                                  */
/*  TABLET STYLES @ 720px - 1023px  */
/*                                  */
/************************************/


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

.masthead, .banner, .content, .section, .footer { width: 720px; }

/* MASTHEAD */

/* Add this to make the masthead be transparent over the slide show. Probably best for it not to kick in until Tablet size. */
/*
.masthead_wrapper { background-color: transparent; position: absolute; top: 0px; left: 0px; width: 100%; }
*/

/* SOCIAL ICONS */

.social_icons { display: block; }
	
/* BANNER */

.banner_wrapper, .banner, .bx-wrapper, .bxslider, .bxslider li {  height: 405px; /* 16:9 - height: 394px; if width is standard 700px */ }
.banner_wrapper {  }
.banner {  }
.banner_overlay { height: 405px; }
.banner_overlay_text { font-size: 2.0625em; }
	
/* MENU */

.masthead_logo { left: 10px; }

/* CONTENT */

.col { float: left; }
.col_full { width: 700px; float: none; clear: both; }
.col_full.nomargin { width: 720px; }
.col_half { width: 340px; }
.col_half.nomargin { width: 360px; }
	.col_half.nomargin .col_half { width: 160px; }
	.col_half.nomargin .col_third { width: 100px; }
	.col_half.nomargin .col_quarter { width: 70px; }
.col_third { width: 220px; }
.col_third.nomargin { width: 240px; }
.col_twothirds { width: 460px; }
.col_twothirds.nomargin { width: 480px; }
	.col_twothirds.nomargin .col_half { width: 220px; }
	.col_twothirds.nomargin .col_third { width: 140px; } /* Can't do on DESKTOP - Not Divisible */
	.col_twothirds.nomargin .col_quarter { width: 100px; }
.col_quarter { width: 160px; }
.col_quarter.nomargin { width: 180px; }
.col_threequarters { width: 520px; }
.col_threequarters.nomargin { width: 540px; }
	.col_threequarters.nomargin .col_half { width: 250px; }
	.col_threequarters.nomargin .col_third { width: 160px; }
	.col_threequarters.nomargin .col_quarter { width: 115px; }

/* OVERVIEW */

.pic_half { width: 50%; float: right; margin: 8px 0px 20px 20px; }

/* OVERVIEW PICS */

.pic_box {
	clear: right;
	float: right;
	margin: 18px 0px 10px 20px;
	width: 380px;
	}
.pic { margin: 0px auto; }
.caption { padding: 8px 0px 0px 0px; }
.youtube_box { margin-bottom: 0px; }
.youtube { width: 380px; height: 214px; }
.pic_multi { width: 120px; height: 80px; }
.pic_multi:nth-child(2n) { margin-right: 10px; }
.pic_multi:nth-child(3n) { margin-right: 0px; }
.pic_multi_spacer { width: 120px; height: 80px; }

/* OVERVIEW MULTI-PIC GALLERY */

.gallery { padding: 10px 0px 0px 0px; margin: 15px 0px 0px 15px; float: right; }
.gallery_main { width: 340px; height: 227px; }
.gallery_thumb { width: 85px; height: 57px; }
.gallery_count { padding-top: 14px; }

/* DOWNLOADS */

.downloads { float: right; margin: 18px 0px 10px 20px; width: 380px; clear: right; }

/* BROWSE */

.browse_pic_box { }
.browse_more { width: 40%; }
.browse_more a { }

/* FOOTER */

.content_wrapper { padding-bottom: 165px; } /* Padding matches footer height. This container JUST makes room for footer. Add about 20px to footer height to ensure bottom content pad */
.footer_wrapper, .footer { height: 165px; } 
.footer_wrapper { margin-top: -165px; }

.footer_text, .fineprint { 
	text-align: left;
	padding-left: 10px; 
	}
.footer_companylogo {
	margin: 0px;
	}
.company_name { padding-top: 10px; }
.company, .tagline {  
	
	}
.company { }
.tagline { 
	font-size: 20px;
	line-height: 26px; 
	display: inline; 
	}
.company_name .divider, .footer .divider {  }
.address {
	padding-top: 5px;
	}
.fineprint {
	padding-top: 10px;
	}
.contact_numbers, .phone, .fax, .credits { display: inline; }
.footer_logos { bottom: 20px; left: auto; margin-left: 0px; right: 10px; }
	
}

/* HIDE ON TABLETS @ 720px - 1023px */

@media only screen and (min-width: 720px) AND (max-width: 959px) { .t_hide { display: none !important; visibility: hidden !important; } }
