/****************************************************
*   Beloit College - Fade Boxes CSS     			*
*   By: Nick Mischler                               *
****************************************************/

@charset "utf-8";
/* CSS Document */

div#fade_boxes{width:100%;margin:1% 0 0;}
div#fade_boxes h3{margin-top:0;}
div#fade_boxes div.fade_box,
div#col_sect_2 div#fade_boxes div.fade_box,
div#col_sect_3 div#fade_boxes div.fade_box{width:100%;height:auto;position:relative;overflow:hidden;margin:0 0 1%;}
div#fade_boxes div.fade_box div.image{width:100%;}
div#fade_boxes div.fade_box div.image div.image_space {
	width: 100%;
	height: 0;
	position: relative;
	/*padding-bottom defined inline*/
	/*background image defined inline*/
}
div#fade_boxes div.fade_box a {display:block;}
div#fade_boxes div.fade_box a div.overlay {
	position: absolute;
	top: 0;
	left: 0;
	padding: 2%;
	width: 100%;
	height: 100%;
	background: rgba(75,75,75,0.75);
	transition: all 0.5s ease-in-out 0s;
}
div#fade_boxes div.fade_box a:hover div.overlay {opacity:0;}
div#fade_boxes div.fade_box a div.overlay div.overlay_text {
	font-size: 10vw;
	color: rgba(255,255,255,0.9);
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 96%;
}
div#fade_boxes div.fade_box a div.overlay div.overlay_text span {
	display: block;
	text-align: center;
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
}

div#fade_boxes div.fade_box a div.overlay div.overlay_text span.title {
	font-weight: bold;
}

div#fade_boxes div.fade_box a div.overlay div.overlay_text span.subtitle {
	font-family: "Book Antiqua",serif;
	padding: 0 10%;
	font-size: 0.5em;
	font-style: italic;	
	font-weight: normal;
	letter-spacing: 0.05em;
}

@media screen and (min-width: 700px){
	div#fade_boxes.col_2 div.fade_box{width:49.5%;float:left;}
	div#fade_boxes.col_2 div.fade_box:nth-of-type(odd){margin-right:0.5%;}
	div#fade_boxes.col_2 div.fade_box:nth-of-type(even){margin-left:0.5%;}
	div#fade_boxes.content.col_2 div.fade_box a div.overlay div.overlay_text{font-size:5vw;}
	div#fade_boxes.full_width.col_2 div.fade_box a div.overlay div.overlay_text{font-size:5.5vw;}
}

@media screen and (min-width: 1025px){
	div#fade_boxes.content div.fade_box a div.overlay div.overlay_text {font-size:6vw;}
	div#fade_boxes.content.col_2 div.fade_box a div.overlay div.overlay_text {font-size:3vw;}
	div#col_sect_2 div#fade_boxes.content div.fade_box a div.overlay div.overlay_text{font-size:3vw;}
	div#col_sect_3 div#fade_boxes.content div.fade_box a div.overlay div.overlay_text{font-size:2vw;}
}

@media screen and (min-width: 1200px){
	div#fade_boxes.col_3 div.fade_box{width:32.6666%;float:left;}
	div#fade_boxes.col_3 div.fade_box:nth-of-type(3n+1){margin-right:0.5%;}
	div#fade_boxes.col_3 div.fade_box:nth-of-type(3n+2){margin-right:0.5%;margin-left:0.5%;}
	div#fade_boxes.col_3 div.fade_box:nth-of-type(3n+3){margin-left:0.5%;}
	div#fade_boxes.content.col_3 div.fade_box a div.overlay div.overlay_text{font-size:2vw;}
	div#fade_boxes.full_width.col_3 div.fade_box a div.overlay div.overlay_text{font-size:3.5vw;}
}

@media screen and (min-width: 1920px){
	div#fade_boxes.content div.fade_box a div.overlay div.overlay_text{font-size:115.2px;} /* 1920 x 6% */
	div#fade_boxes.content.col_2 div.fade_box a div.overlay div.overlay_text{font-size:57.6px;} /* 1920 x 3% */
	div#fade_boxes.content.col_3 div.fade_box a div.overlay div.overlay_text{font-size:38.4px;} /* 1920 x 2% */
	div#fade_boxes.full_width.col_2 div.fade_box a div.overlay div.overlay_text{font-size:105.6px;} /* 1920 x 5.5% */
	div#fade_boxes.full_width.col_3 div.fade_box a div.overlay div.overlay_text{font-size:67.2px;} /* 1920 x 3.5% */
	div#col_sect_2 div#fade_boxes.content div.fade_box a div.overlay div.overlay_text{font-size:57.6px;} /* 1920 x 3% */
	div#col_sect_3 div#fade_boxes.content div.fade_box a div.overlay div.overlay_text{font-size:38.4px;} /* 1920 x 2% */
}