
@media screen {
/*
Theme Name: Bryn Mawr Template - your ultimate Bryn Mawr styled theme
Description: A theme for Bryn Mawr College blogs that want to mimic the look of www.brynmawr.edu website templates.
Theme URI:http://blogt.brynmawr.edu/wordpress/orgs/wp-content/themes/bryn-mawr-template
Author: Catherine Farman webmaster@brynmawr.edu REVISED By YIKES, Inc.
Author URI: brynmawr.edu/web
Version: 3.5
*/

/* ************** IMPORTANT NOTE: unless otherwise notated, all styles in the aboutus theme and the megatron theme are identical, so please change in both places, when updating/reskinning

ALL OTHER STYLES for both themes are from all_styles_combined.css, which is called in the header.php for this theme.  

Please also change mobile.js, if changing mobile breakpoints

CLEANED/revised -- 4.11.2013 ~ALK

 *******************************************  */


/*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*
begin 	regular styles for large screens -- 
		@media (screen) == 86em-60em aka 1920px-960px  == default @media screen
		width: 60.625em == 970px ÷ 16 == for default BMC layout width
*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*/	

/* ==========================================================================
   Layout
   ========================================================================== */

/* ==========================================================================
   Global
   ========================================================================== */
#siteContentContainer *, #siteContentContainer *:before, #siteContentContainer *:after {
			/* Chrome 9-, Safari 5-, iOS 4.2-, Android 3-, Blackberry 7- */
			-webkit-box-sizing: content-box; 
		  
			/* Firefox (desktop or Android) 28- */
			-moz-box-sizing: content-box;
		  
			/* Firefox 29+, IE 8+, Chrome 10+, Safari 5.1+, Opera 9.5+, iOS 5+, Opera Mini Anything, Blackberry 10+, Android 4+ */
			box-sizing: content-box;
		  }		



/* ==========================================================================
   Header
   ========================================================================== */
 
/* ==========================================================================
=============================================================================
	BEGIN  5. LOGO -- div#siteHeader -- FROM bico.css on our regular site
=============================================================================
========================================================================== */
			
				  
	  /* ==========================================================================
	  =============================================================================
			  END  -- div#siteHeader -- LOGO
	  =============================================================================
	  ========================================================================== */

/* ==========================================================================
   Content
   ========================================================================== */
	   
	/* home page styles */
			  .attachment-loop-thumb {
				 margin: .5em .5em .5em 0 !important;
				 float: left;
				 padding-right: 5px;}

/* ==========================================================================
   Sidebars
   ========================================================================== */

			  select#cat {
				  width: 200px;}
			  
			  div#sidebar{
				  width:15em; 
				  margin-left:15px; 
				  margin-right:0; 
				  padding:0 10px;}
			  
			  div#sidebar div.title {
				  color: #435361;
				  font-size: 1.333em;
				  margin: 1.6em 0 0.4em;
				  font-weight: normal;
				  font-family: Arial,Helvetica,sans-serif;}
			  
			  div#sidebar #s {
				  width:100px;}
				  
			  div#sidebar .hidden {
				  display:none;}
			  
			  div#sidebar div.textwidget {
				  color: #000;
				  font-size: 12px;
				  margin-bottom: 0px;}
			  
			  div#sidebar  ul {
				  list-style-type: disc;
				  color: #000; clear:both;}
			  
			  div#sidebar li {
				  padding-bottom: .5em;
				  line-height:1.2em;
				  font-size: 100%;}
				  
			  div#sidebar select#extended-categories-select-1 {
				  max-width: 14em;}
				  
			  div#sidebar a.rsswidget img {margin:0 !important}	  
				  

/* ==========================================================================
   Footer
   ========================================================================== */
   
/* ==========================================================================
   Previous Megatron styles (we can organize these better in the future)
   ========================================================================== */
  





			  .post .attachment-thumbnail {
				  float:left;}
			  
	/*for archives.php list */
			  div#wp_get_archives_list_container {
				  position:relative;
				  left:35px;
				  top:15px;}
	
	/*AZ Index Plugin styles */
			  .azindex {
				  width:99.9%;
				  float:left;
				  padding:1em !important;}
			  
			  .azindex .head {
				  color: #026990 !important;
				  font-size: 14px !important;
				  font-weight: bold !important;
				  border-bottom: none !important;}
				  
			  .azindex li.subhead {
				  clear:left; 
				  float:left; 
				  margin-left:0px !important; 
				  padding-left:0 !important; 
				  list-style-type:disc !important;}
			  
			  .azindex .desc {
				  clear:left; 
				  float:left; 
				  font-size:80%; 
				  padding-left:20px;}
				  
			  .azindex .head .azcont,
			  .azindex .subhead .azcont {
				  font-size:90%;
				  font-style:italic;}
				  
			  .azindex h2 {
				  padding-top:0;
				  margin-top:0}
				  
			  .azindex h2 .azcont {
				  font-size:50%;
				  font-style:italic;}
				  
			  .azindex ul {
				  list-style:none; 
				  padding:0 5px 0 5px; 
				  margin:0;width:100% !important;}
				  
			  .azindex ul li {
				  clear:both; 
				  padding-top:5px; 
				  list-style-type:none !important; 
				  margin-left:-20px !important;
				  width:99% !important;}
				  
			  .azindex ul li.azalt {
				  float:left; 
				  width:100%; 
				  background-color:lightgray;}
			  
			  .azindex ul li li {
				  clear:both;
				  list-style-type:disc !important;}
			  
			  .azindex .spacer {
				  height:20px;}
			  
			  .azlinkspacer {
				  height:20px;}
			  
			  .azlinks,
			  .azpagelinks {
				  text-align:center;}
	
	/*Styles for Subscribe to Feedburner Feed Plugin form widget ("Feedburner RSS by Email" plugin)
	-----------------------------------------------------------*/
			  form#rss_by_email p {
				  text-align:left !important;}
				  
			  form#rss_by_email input.submit_button {
				  position:relative !important;
				  top:-32px !important;
				  left: -12px !important;
				  margin-left:0 !important;}
			  
			  form#rss_by_email {
				  border:none !important;}
	
	/*Added from old stylesheet for BMC Theme 
	-----------------------------------------------------------*/
			  div.meta {
				  margin-top:30px !important;
				  clear:both;
				  width:100%;}
			  
			  div.attachments { /*for EG-Attachments plugin */
				  padding-top: 20px;
				  width:100%;
				  padding-bottom:20px;}
			  
			  div.attachments dt dl{
				  width:100%;}
			  
			  dt.icon img {	/*for EG-Attachments plugin */
				  padding-right: 5px;
				  float:left;}
			  
			  ul#pagelist {
				  display:none;}
			  
			  :focus {
				  outline: 0;}
			  
			  .tfe{
				  float: left;
				  width: 100px;
				  margin: .75em 1em .5em 0;}
			  
			  .hide{
				  display:none;}
			  
			  .wp-caption-text {
				  font-size:80%;
				  font-weight:bold;
				  margin-bottom:5px;}
			  
			  .aligncenter {
				  padding-bottom:1em;}
			  
			  .more-link {
				  margin-top:-10px; 
				  align: right;}
			  
			  div#siteContentContainer .post {
				  margin-bottom: 1em;}
			  
			  div#siteContentContainer div.storycontent .alignright {
				  float:right; 
				  position:relative;
				  margin-left: 6px;
				  padding-left: 6px;}
			  
			  div#siteContentContainer div.storycontent .size-full{
				  clear:none;}
			  
			  div#siteContentContainer img.alignleft,
			  div#siteContentContainer .alignleft {
				  float: left;
				  position:relative;
				  margin-left: 0;
				  padding-left: 0;
				  margin-right: 6px;
				  padding-right: 6px;	}
				  
			  div#secondaryNav .alignleft {
				  float: left;
				  padding-left: 0;
				  padding-right: 6px;	
				  margin-top: -6px;}
				  
				  
				  	  /* ******  begin ContactUs styles    */
	  div#secondaryNav #ContactUs {	/* contact us area ;*/
		  position: relative;
		  background-image:none !important;
		  float: none;
		  margin: 0em 0 0;/* all browsers, of course */
		  margin: 0em 0 0\9; /* IE8 and below */ 
		  *margin:0px 0 0 !important; /* IE7 and below */}
	  
	   div#secondaryNav #ContactUs dl {/* contact us area smaller area */
		  color: black;}
		  
	  div#secondaryNav #ContactUs dl a,
	  div#secondaryNav #ContactUs dl dt, 
	  div#secondaryNav #ContactUs dl dt a { /*  */
		  color: #2b313a; }
		 div#secondaryNav #ContactUs a  {font-size:100% !important;}
	 div#secondaryNav #ContactUs dl dt { /* contact us title*/ 
		  font-size: 1.167em;
		  font-weight:bold;
		  border-bottom:solid medium #435361;}
	  
	  div#secondaryNav #ContactUs dl dd { /* contact us content */
		  font-size: 0.917em;
		  line-height:1.3em;
		  padding: 0.5em;
		  margin:0;}
	  
	  div#secondaryNav #ContactUs dd a { /*contact us -- for when emails appear in contact us section */
		  border-bottom:0 !important;
		  padding: 0.2em 0 !important;}
	  /* ******  end ContactUs styles    */
				  
			  
			  div#siteContentContainer .post {
				  margin-bottom:1.5em;
				  width:100%;
				  clear:both;}
			  
			  div#siteContentContainer .post h3, 
			  div#siteContentContainer .post h4, 
			  div#siteContentContainer .post h5, 
			  div#siteContentContainer .post h6 {
				  margin-top:10px !important;
				  margin-bottom:6px !important;}
			  
			  div#siteContentContainer .post ul {
				  margin-bottom:10px !important;}
	
	/** tweet/like/share button from addthis.com added by cfarman 12-13-10 **/
			  div.addthis_toolbox {
				  float:right !important;
				  margin-left:15px !important;}
			  
			  div.post-date {
				  float:left;}
	
	/*** comments Form ***/
			  h3#respond{
				  padding-top: 20px;}
			  
			  div#siteContentContainer#respond {
				  width: 100%;
				  border:1px solid #b0b0b0;
				  padding: 10px 0px 10px 0px;}
			  
			  div#siteContentContainer#commentform {
				  width: 97%;}
			  
			  div#siteContentContainer#author,
			  div#siteContentContainer#email,
			  div#siteContentContainer#url {
				  border:1px solid #b0b0b0;}
			  
			  div#siteContentContainer#submit {
				  background:#f0f0f0;
				  border:1px solid #b0b0b0;}
			  
			  div#siteContentContainer#submit:hover {
				  background: #e8e9ea;
				  border: 1px solid #848484;
				  cursor: pointer;}
	div#siteContentContainer a>h2:hover {text-decoration:none;}
	/*copied from news-test.brynmawr.edu news theme */
			  .topbox {
				  border-width: 3px;
				  border-style: solid solid dotted solid;
				  border-color:#CCCCCC;
				  padding: 0px 8px;}
				  
			  .bottombox {
				  border-width: 0 3px 3px 3px; 
				  border-style: dotted solid solid solid;
				  border-color:#CCCCCC;
				  padding: 0px 8px;}
				  
			  .midbox {
				  border-width:0 3px 3px 3px; 
				  border-style: dotted solid dotted solid;
				  border-color:#CCCCCC;
				  padding: 0px 8px;}
				  
			  .topbox p,
			  .bottombox p,
			  .midbox p {
				  padding:.85em 0; 
				  margin-bottom:0 !important;} 
				  
			  .continued {
				  padding-top:25px; 
				  border-bottom: dotted #CCCCCC}
			  
			  div#siteContentContainer .featurebox {
				  width:200px; 
				  border:#CCCCCC 2px solid; 
				  padding: .7em; 
				  float:right; 
				  margin-left:.7em;}
			  
			  div#siteContentContainer div.excerpt p.wp-caption-text { /* so photo caption doesn't appear in excerpt */
				  display:none;}		
			  
			  #siteContentContainer ol.commentlist li {
				  text-indent:1.5em;}
				  
				  
				  
				  
			  
			  
			  
			  div#secondaryNav li#current dl {   
				  border: none !important;/**/}
				  
			 
/*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*
end 	regular styles for large screens -- 
		@media (screen) == 86em-60em aka 1920px-960px  == default @media screen
		width: 60.625em == 970px ÷ 16 == for default BMC layout width
*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*/	
}
    
 
 
/*   @Media queries styles
9. Begin @Media queries styles for smaller screens and mobile devices. 
/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */
/* em breakpoint styles */
/*
86em-60em
1920px-960px  === default @media screen
*/
/*	@media (min-width: 86em) /* 1382px ÷ 16  for wide screens*/ 
/*	@media (min-width: 64em) /* 1024px ÷ 16 for narrow desktop browsers and iPad landscape*/ 
/*	@media (min-width: 62em) /* 992px ÷ 16 iPad landscape*/ 
/*	@media (min-width: 60.625em) /* 970px ÷ 16   for default BMC layout width*/
/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */

@media  (max-width: 60em){
	  


}/*/mediaquery*/


/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */
/*
53em-45em
850px-720px === switch top nav to logo+dropdown+mobilemore
				switch width for 1/3 last so columns display better
				switch width of footer, keeping default styles
				switch width for pictext so it fits screen */			
/*	@media (min-width: 52em) /* 830px ÷ 16 Android portrait*/ 
/*	@media (min-width: 50em) /* 800px ÷ 16 */ 
/*	@media (min-width: 48em) /* 768px ÷ 16 iPad portrait*/ 				
/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */

@media (max-width: 50em){
	

	  
	  /* ==========================================================================
	  =============================================================================
		max-width: 53em	  BEGIN  -- div#siteHeader -- LOGO
	  =============================================================================
	  ========================================================================== */
			  
			
				  	  
	  /* ==========================================================================
	  =============================================================================
			  END  -- div#siteHeader -- LOGO
	  =============================================================================
	  ========================================================================== */
	
	
	
			  
	  
	  /* ==========================================================================
	  =============================================================================
			 BEGIN  -- div#secondaryNav -- NEW
	  =============================================================================
	  ========================================================================== */

	  
/* ==========	used with .width-480 which changes utility of secondary nav menu to mobile within the mobile.js file for screens less than 800 px wide  	 =================================	====== */

	  /* ==========	  div#secondaryNav	 =================================	====== */
 	 			 		
		div#secondaryNav { /*	changes width of secondary nav for ***MOBILE***  */
			display:block;/*   */
			border-bottom: 1px solid rgb(209, 211, 210);/*  */}
					  
				  
		div#secondaryNav.mobileSecNavVisible {  /* modal overlay style for ***MOBILE*** secondary nav */
			max-height:180%;/*    */
			height:180%;/*   */}
 
		div#secondaryNav ul { /*	changes style of secondary nav elements for ***MOBILE***  */
			
		 	margin-bottom: 0;/*  */}
	
			
			
		div#secondaryNav li#current.mobileSecNavVisible {
			  border-bottom: 1px solid rgb(61, 68, 79);/*  === -- NEW -- ===  */}	
				
		div#secondaryNav li#current a {
			 color:#017db0;/*   */}
			
		div#secondaryNav #ContactUs dl a, div#secondaryNav #ContactUs dl dt, div#secondaryNav #ContactUs dl dt a {
    color: #fff;
}
			
		div#secondaryNav li#current dt a, 
		div#secondaryNav li#current dt a:hover {
			background-image:none !important;
			background-color:white;
			color:#017db0 !important; /*  */}	  
	   
		div#secondaryNav li#current dt a:after {/* changes style of secondary nav elements for mobile  */
				   width:20px;
				   display:inline-block;
				   content:".";
				   color:#fff;
				   background: url(http://www.brynmawr.edu/includes/images/arrow-down-blue.png) right center no-repeat;}	
			  
			  div#secondaryNav li#current dt.mobileSecNavVisible a:after {/*	sets arrow for secondary nav mobile menu  */ 
				   color:#2b313a;
				   background: url(http://www.brynmawr.edu/includes/images/arrow-up-blue.png) right center no-repeat;}		
		
		
		div#secondaryNav li#current dl.mobileSecNavVisible dt.mobileSecNavVisible a, 
		div#secondaryNav li#current dl.mobileSecNavVisible dt.mobileSecNavVisible a:hover {
			color: rgb(255, 255, 255) !important;/*  */
			background-color: #2b313a;
			background-image:none !important; /* */}	
	  
			

		  div#secondaryNav li#current dt {/*	changes style of secondary nav elements for current selected item  for ***MOBILE***  */
			 
			  background: #fff;/*  */}  
			
	
		
		  
		  
			
			#siteContentContainer {
				margin-top:1em !important;/*  */}
			
		
		  
		  div#secondaryNav dt a br { /*	changes style of secondary nav elements for mobile  */ 
			   display:none;/*  === -- OLD -- ===  */}


		
	  /* ==========	 	 dd.mobileSecNavVisible    a	 ======================================= */
                  
		
			
		  div#secondaryNav li#current dd a, 
		  div#secondaryNav dd a, 
		  div#secondaryNav h2.mobileSecNavVisible a  { /*	changes style of secondary nav elements for ***MOBILE***  */
			  padding-top:1em;/*  */
			  padding-bottom:1em;/*  */
			  color: #fff;/*  */}


			 
		
				  
		  div#secondaryNav li#current dd:last-child { /* */
			  padding:0em 0em 0em 2em;/*  */
			  margin-left:0 !important;/*  */}
			  
	
	  		
			  
	  /* ==========	  h2.giving mobileSecNavVisible a, h2.hepburn mobileSecNavVisible a	 =============
	  	=============		these h2s are the extra "button-like-nav" under the left nav 
							.. used to be yellow boxes in old design		============= */

	


			  
			  div#secondaryNav li#ContactUs.mobileSecNavVisible {/*	changes style of secondary nav elements for mobile  */
				
				   padding-top:0 !important;/*  */
				   padding-left:0 !important;/*  */}
			  

			  
			  div#secondaryNav li#ContactUs.mobileSecNavVisible dd {/* changes style of secondary nav elements for mobile	  */ 
				   color: #fff;/*  */
				  padding-bottom:1.75em;/*  */}
			  
	
	  
	  /* ==========================================================================
	  =============================================================================
			  END  -- div#secondaryNav -- NEW
	  =============================================================================
	  ========================================================================== */



	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	 }/*/mediaquery*/


/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */
/*
43.75em-37.5em
700px-600px  === default @media screen */
/*	@media (min-width: 43.75em) /* 700px ÷ 16  */ 
/*	@media (min-width: 37.5em) /* 600px ÷ 16 */ 
/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */

@media  (max-width: 43.75em){
	
	  /* ==========================================================================
	  =============================================================================
		max-width: 43.75em	  BEGIN  -- div#siteHeader -- LOGO
	  =============================================================================
	  ========================================================================== */
			  
			
		  
	  
	  /* ==========================================================================
	  =============================================================================
			  END  -- div#siteHeader -- LOGO
	  =============================================================================
	  ========================================================================== */
	
	 }/*/mediaquery*/


/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */
/*
43.75em-37.5em

660px - 600px  ===  */
/*	@media (min-width: 41.25em) /* 660px ÷ 16  */ 
/*	@media (min-width: 37.5em) /* 600px ÷ 16 */ 
/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */

@media  (max-width: 41.25em){
  
	  /* ==========================================================================
	  =============================================================================
		max-width: 41.25em	  BEGIN  -- div#siteHeader -- LOGO
	  =============================================================================
	  ========================================================================== */
			   
			
			
	  /* ==========================================================================
	  =============================================================================
			  END  -- div#siteHeader -- LOGO
	  =============================================================================
	  ========================================================================== */
	
}/*/mediaquery*/


/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */
/*
37.5em-28em
600px-450px	=== switch 2nd nav to mobile
				switch footer to mobile
				switch width of most elements to 95%
*/			
/*	@media (min-width: 37.5em) /* 600px ÷ 16 for iPhone/Android portrait */
/*	@media (min-width: 32em) /* 525px ÷ 16 for iPhone/Android portrait*/ 
/*	@media (min-width: 28em) /* 450px ÷ 16 for iPhone/Android portrait*/ 
/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */
@media (max-width: 37.5em){	
		 

	  /* ==========================================================================
	  =============================================================================
		max-width: 37.5em	  BEGIN  -- div#siteHeader -- LOGO
	  =============================================================================
	  ========================================================================== */
			  
			
	  /* ==========================================================================
	  =============================================================================
			  END  -- div#siteHeader -- LOGO
	  =============================================================================
	  ========================================================================== */
	
	
			  div#siteContentContainer div.profile img, 
			  div#siteContentContainer div.featured img { /*  */
				  width: 100%;}
			  
			
	    

}/*/mediaquery*/



/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */
/*
26em-15em				
420px-240px === switch all widths to 95-100%
				change top nav height to have logo above nav items
*/
/*	@media (min-width: 26em) /* 420px ÷ 16 */ 
/*	@media (min-width: 20em) /* 320px ÷ 16 Smartphones (portrait)*/ 
/*	@media (min-width: 15em) /* 240px ÷ old phones*/ 
/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */

@media (max-width: 26em){
		
	  
	  /* ==========================================================================
	  =============================================================================
		max-width: 26em	  BEGIN  -- div#siteHeader -- LOGO
	  =============================================================================
	  ========================================================================== */
	  
			 
				  
	  /* ==========================================================================
	  =============================================================================
			  END  -- div#siteHeader -- LOGO
	  =============================================================================
	  ========================================================================== */	  	  		

/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */
/* ************  ********************************** ************************** */
}/*/mediaquery*/