/* ===============================================================================================================
FILE: tablet.css
DESC: This file contains styles specific to the screen widths indicated below (SCRN). Any styles applying to all
			layouts MUST be added to base.css. If media queries are updated within html.tpl.php, the thresholds should
			be updated below accordingly.
SCRN: 501px - 799px
================================================================================================================== */

/* main menu button and arrow styles */
.menu-button {
	display:block;
	margin:0 auto 0;
	width:90%;
	height:18px;
	text-transform:uppercase;
	font-size:.9em;
	font-weight:normal;
	text-align:center;
	color:#666666;
	border-bottom:1px solid #999999;
	cursor:pointer;
}
.menu-arrow {
	width:0;
	height:0;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-top: 7px solid #666666;
	display:inline-block;
	position:relative;
	top:-2px;
	left:5px;
	margin:0;
}


/* ================== TOP PAGE LAYOUT ================== */
#branding {
	width:90%;
}
#header {
	width:90%;
}
#topnav {
	width:90%;
}

/* ================ FEATURE SLIDESHOW ================= */
#block-views-frontpage-slideshow-block .group_slide_info {
  padding:6px 0 4px 0;
}
#block-views-frontpage-slideshow-block .group_slide_info .field {
  padding:2px 8px 2px 12px;
}
#block-views-frontpage-slideshow-block .group_slide_info .field-name-field-slide-headline {
  font-size:1.2em;
}
#block-views-frontpage-slideshow-block .group_slide_info .field-name-field-slide-description .field-item {
  text-overflow:ellipsis;
  white-space:nowrap;
  overflow:hidden;
}


#content {
	width:90%;
}

/* =============== BLOCK/CONTENT LAYOUT =============== */
/* sidebar left or sidebar right */
.region-sidebar-first,
.region-sidebar-second {
	width:100%;
	margin:0;
}
.sidebar-first .region-sidebar-first .block,
.sidebar-first .region-sidebar-second .block,
.sidebar-second .region-sidebar-first .block,
.sidebar-second .region-sidebar-second .block,
.two-sidebars .region-sidebar-first .block,
.two-sidebars .region-sidebar-second .block {
	margin-right:0;
	margin-left:0;
}

.sidebar-first .region-sidebar-first,
.sidebar-second .region-sidebar-second {
	padding: 0;
}

/* BOTH SIDEBARS */
.two-sidebars #content-main {
	width:100%;
  margin-left: 0;
  margin-right: 0; /* LTR */ /* Negative value of #content-main's width + left margin. */
}
.two-sidebars .region-sidebar-first,
.two-sidebars .region-sidebar-second {
	width:50%;
  margin-right:0;
  margin-left:0;
	padding:0;
	float:left;
}
.two-sidebars .region-sidebar-first .section,
.two-sidebars .region-sidebar-second .section {
  padding: 5px;
}


/* ================== SITE FOOTER ==================== */
#site-footer {
	width:90%;
	background-size:170px;
}
#site-footer .sf-left,
#site-footer .sf-main,
#site-footer .sf-right {
	margin:0;
}
#site-footer .sf-left{
	width:34%;
	margin-right:10px;
}
#site-footer .sf-main {
	width:62%;
}
#site-footer .sf-right {
	text-align:left;
	margin-top:40px;
	width:140px;
	font-size:10px;
}
#site-footer .sf-right #sf-lehigh-logo {
	width:120px;
	padding:0 12px 9px 4px;
}
#site-footer h4 {
	font-size:1.1em;
}
#site-footer hr {
	display:none;
}



/* ================ HIDDEN FEATURES ================= */
#branding .secondary-menu {
	display:none;
}
.region-header #block-search-form {display:none;}
#top-search {
	display:none;
}


/* ========= OPTIMIZE FEATURES FOR TABLETS ========== */
/* optimize main menu for tablets */
#topnav {
	display:none;
}
#topnav .hide-main-menu {
	display:none;
}
#topnav a {
	display:block;
	padding:7px 15px;
	margin:0;
	color:#666666;
	text-decoration:none;
	position: relative;
	border-bottom:1px solid #cccccc;
	background-color:#dddddd;
}
#topnav a:hover,
#topnav a:active {
	color:#222222;
	background-color:#e4e4e4;
}
#topnav a:hover:after,
#topnav a.active:after,
#topnav a.active-trail:after,
#topnav a.current-section:after {
	top:0;
	border:0;
	content:"";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-bottom-color: #999999;
	border-width:0;
	left:0;
	margin-left:0;
}

/* ================ HIGHLIGHTS LAYOUT ================= */
.region-highlights {
  width:90%;
}
.region-highlights .highlight {
	width:99%;
	min-height:100px;
	padding:0;
	margin:10px auto 0;
	border:0;
	border-bottom:1px solid #d4d4d4;
}
.region-highlights .highlight img {
	width:140px;
  height:auto;
	float:left;
	margin-right:15px;
}
.region-highlights .highlight h4 {
	margin:2px 5px 0;
}
.region-highlights .highlight p {
	font-size:.95em;
}

/* ================ FEATURE SLIDESHOW ================= */
#feature-show {
	width:90%;
	
}
#feature-show .view-frontpage-slideshow img {
	width:100%;
	/* height:auto; */
}