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


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

.masthead, .banner, .banner_content, .content, .section, .footer, .footer_extra { __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%; }
*/
	
/* MENU */

.masthead_logo {  }
.menu_icons .mb { padding-bottom: 15% !important; }

/* BANNER */

.banpic {
	width: 66.66%; 
	opacity: 100%;
	}
.bantext {
	width: 60%;
	text-align: right;
	padding: 40px 35px;
	}
.bantext_small { color: rgba(255,255,255,0.6); }
.bantext_large { font-size: 60px; line-height: 54px; margin-top: 4px; }
.banbutton { 
	padding: 15px 30px 18px 30px;
	bottom: 35px;
	right: 35px;
	width: auto;
	min-width: 0%;
	transition: 0.4s;
	}
.banner:hover .banbutton {
	transition: 0.4s;
	right: 0px;
	min-width: 100%;
	}
	

/* FEATURED MULTI-BOX - PROBABLY 3-UP */

.feat .text {
	font-size: 34px;
	line-height: 34px;
	}

/* 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; }

/* OVERVIEW MULTI-PIC GALLERY */

.gallery { margin: 25px 0px 20px 20px; float: right; width: 50%; clear: right; position: relative; }
.gallery_main { width: 100%; height: calc(((100vw - 80px) / 2) * .6667); }
.gallery_thumb { width: 25%; height: calc(((100vw - 80px) / 8) * .6667); }
.gallery_count {  }

/* BROWSE RECORDS */

.browse_text { padding: 10px 20px 20px 20px; clear: none; float: left; width: 60%; }

/* BROWSE EVENTS */

.browse_event .mbc {
	border-radius: 4px 0px 0px 0px;
	}
.browse_price {
	text-align: center;
	}
.price1,.price2,.price_divide {
	margin-top: 0px;
	display: inline-block;
	}
.price_divide {
	padding: 0px 10px;
	font-size: 28px;
	line-height: 28px;
	color: #999;
	}

/* BROWSE EVENTS */

.includes { width: calc(50% - 20px); display: inline-block; font-size: 20px; line-height: 24px; }
.inc_label { font-size: 16px; line-height: 20px; }
.include { width: auto; margin-right: 40px; margin-top: 10px; padding-left: 36px; }

/* NEW INCLUDES */

.test {
	display: inline-block;
	width: calc(50% - 20px);
	text-align: left;
	margin-top: 20px;
	}
.icon_set {
	margin: 10px 25px 0px 0px;
	}
.icon {

	}
.icon_label {
	text-align: center;
	}

/* CALENDAR */
    
.google_calendar { width: calc(100% * 1); min-height: 480px; }

/* FOOTER */

.content_wrapper { padding-bottom: ; } /* 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: ; } 
.footer_wrapper { margin-top: ; }
	
}

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

@media only screen and (min-width: 720px) AND (max-width: 959px) { 
	.t_hide { display: none !important; visibility: hidden !important; }
	.upcoming.m10 .mb { width: calc((100% - 30px) / 2) !important; padding-bottom: calc(((100% - 30px) / 2) * .5625) !important; }
	.icon_scroll { display: none; } 
	.browse_event .mb { width: 40% !important; padding-bottom: calc(40% * 1) !important; }
	.scr { width: calc((100% - 60px) / 2) !important; padding-bottom: calc(calc((100% - 60px) / 2) * .1667) !important; }
	}