/****************** hompepage block layout for <li id="Block_x">******************************/

@media (min-width:591px)
{
/*some radius options: 
	-webkit-border-top-left-radius: 20px; -moz-border-radius-bottomright: 20px; border-bottom-right-radius: 20px; */

.Block_Text {margin-left:auto; margin-right:auto;}


.nav {max-width: 900px; position:relative; }

#menu_container {max-width:690px;}

	
	
img.block_img {
	width: 250px;
	height: 252px; 
	margin-left:0px; 
	margin-top: 0px; }
	


.Block_Text > ul {width:100%; list-style: none; margin:0; padding:0; }

.Block_Science {
 		width: 250px;
        min-height: 250px;
        max-height:250px;
        border: 15px solid #E42A79;
        display: -moz-inline-stack;
        display: inline-block;
        vertical-align: top;
        margin: 6px;
        zoom: 1;
        *display: inline;
        _height: 250px;
        
        float:left;
        overflow:hidden;
        
        -webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	
		 -webkit-transition: all .2s ease-in-out;
	 -moz-transition: all .2s ease-in-out;
	 -o-transition: all .2s ease-in-out;
	 transition: all .2s ease-in-out;
}

.Block_Science:hover { 
	transform: scale(1.1);
	-webkit-transform: scale(1.1); 
	-moz-transform: scale(1.1);
	-ms-transform: scale(1.1);
	
	-moz-box-shadow: 0 0 20px #888;
	-webkit-box-shadow: 0 0 20px#888;
	box-shadow: 0 0 20px #888;}

.Block_Other {
 		width: 250px;
        min-height: 250px;
        max-height:250px;
        border: 15px solid #00FF00;
        display: -moz-inline-stack;
        display: inline-block;
        background: #fff;
        vertical-align: top;
        margin: 6px;
        padding-bottom:0px;
        zoom: 1;
        *display: inline;
        _height: 250px;
        float:left;
        overflow:hidden;
        
        -webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	
	-webkit-transition: all .2s ease-in-out;
	 -moz-transition: all .2s ease-in-out;
	 -o-transition: all .2s ease-in-out;
	 transition: all .2s ease-in-out;
	
	/*transform: scale(0.75) rotate(45deg);
	-webkit-transform:scale(0.75) rotate(45deg);*/
}

/*.Block_Other .fade_box {transform: scale(1.5) rotate(-45deg);
	-webkit-transform:scale(1.5) rotate(-45deg);}

.Block_Other .fade_box:hover {transform:scale(1.5) rotate(-45deg); -webkit-transform: scale(1.5) rotate(-45deg);}

.Block_Other .fade_box .details .inside:hover{transform:scale(1.0); -webkit-transform:scale(1.0);}
*/

.Block_Other:hover { 
	transform: scale(1.1);
	-webkit-transform: scale(1.1); 
	-moz-transform: scale(1.1);
	-ms-transform: scale(1.1);
	
	-moz-box-shadow: 0 0 20px #888;
	-webkit-box-shadow: 0 0 20px#888;
	box-shadow: 0 0 20px #888;}

.Block_Projects {
		width: 250px;
        min-height: 250px;
        max-height:250px;
        border: 15px solid #566D7E;
        display: -moz-inline-stack;
        display: inline-block;
        vertical-align: top;
        margin: 6px;
        zoom: 1;
        *display: inline;
        _height: 250px;
        float:left;
		overflow:hidden;
		
    -webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	 border-radius: 50%;
	 -webkit-transition: all .2s ease-in-out;
	 -moz-transition: all .2s ease-in-out;
	 -o-transition: all .2s ease-in-out;
	 transition: all .2s ease-in-out;
	
}

.Block_Projects:hover { 
	 transform: scale(1.1);
	-webkit-transform: scale(1.1); 
	-moz-transform: scale(1.1);
	-ms-transform: scale(1.1);
	-moz-box-shadow: 0 0 20px #888;
	-webkit-box-shadow: 0 0 20px#888;
	box-shadow: 0 0 20px #888;}

.Block_Medicine {
 		width: 250px;
        min-height: 250px;
        max-height:250px;
        border: 15px solid #4676E5;
        display: -moz-inline-stack;
        display: inline-block;
        vertical-align: top;
        margin: 6px;
        zoom: 1;
        *display: inline;
        _height: 250px;
         padding-bottom: 0em; 
        overflow: hidden;
        float:left;
        overflow:hidden;  
        
        -webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	
		 -webkit-transition: all .2s ease-in-out;
	 -moz-transition: all .2s ease-in-out;
	 -o-transition: all .2s ease-in-out;
	 transition: all .2s ease-in-out;
}

.Block_Medicine:hover { 
	transform: scale(1.1);
	-webkit-transform: scale(1.1); 
	-moz-transform: scale(1.1);
	-ms-transform: scale(1.1);
	
-moz-box-shadow: 0 0 20px #888;
	-webkit-box-shadow: 0 0 20px#888;
	box-shadow: 0 0 20px #888;}

.Block_Music {
 		width: 250px;
        min-height: 250px;
        max-height:250px;
        border: 15px solid #FFFF00;
        /*border-style: dotted; */
        vertical-align: top;
        margin: 6px;
        zoom: 1;
        *display: inline;
        padding-bottom: 0 px; 
        overflow: hidden;
        _height: 250px;
        z-index: 100;
        float:left;
        overflow:hidden;
        
        -webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	
		 -webkit-transition: all .2s ease-in-out;
	 -moz-transition: all .2s ease-in-out;
	 -o-transition: all .2s ease-in-out;
	 transition: all .2s ease-in-out;
}
	
.Block_Music:hover { 
	transform: scale(1.1);
	-webkit-transform: scale(1.1); 
	-moz-transform: scale(1.1);
	-ms-transform: scale(1.1);
	
-moz-box-shadow: 0 0 20px #888;
	-webkit-box-shadow: 0 0 20px#888;
	box-shadow: 0 0 20px #888;}

.Block_ALERT {
 		width: 280px;
        min-height: 280px;
        /*border: 15px solid #000;
        border-style: dotted;*/
        background-image:url(../images/css/alert.jpg);
        background-repeat:no-repeat; 
        display: -moz-inline-stack;
        display: inline-block;
        vertical-align: top;
        margin: 5px;
        zoom: 1;
        *display: inline;
        _height: 280px;
        float:left;
        
        	 -webkit-transition: all .2s ease-in-out;
	 -moz-transition: all .2s ease-in-out;
	 -o-transition: all .2s ease-in-out;
	 transition: all .2s ease-in-out;
}

.Block_ALERT:hover { 
	transform: scale(1.1);
	-webkit-transform: scale(1.1); 
	-moz-transform: scale(1.1);
	-ms-transform: scale(1.1);
	
-moz-box-shadow: 0 0 20px #888;
	-webkit-box-shadow: 0 0 20px#888;
	box-shadow: 0 0 20px #888;}



.touch .fade_box {position: relative; display: block; height: 250px; 
width: 250px; padding: 0px;} /***for iPad ***/

.touch .Block_Projects .fade_box .details .inside {
padding-left: 10px;
padding-right: 22px;
padding-top:30px;
text-align:center;}

.viewArticle {
	position:relative;
	float: center;
	/*width:900px;*/
	max-width: 700px;
	background:#fff;
	/*margin-left:164px;*/
	margin-left:auto;
	margin-right:auto;
	padding:10px;	
	padding-left:100px;
}

#viewArticlecontents {width: 88%; font-size:100%; line-height:130%; margin-bottom: 2em;}

blockquote {
	/*border-left: 2px solid #616D7E; */
	/*border-top:  2px solid #616D7E; */
	margin:15px;
	margin-right:10px;
	padding:5px;
	padding-left:15px;
	padding-right:5px;
	background-color: #CDD6DE; 
	font-size: 100%; 
	border-right: 10px solid #CDD6DE;
} 

.right_float_quote {float:right; width: 35%; padding:10px; margin:5px; font-size: 1.5em; line-height:28px; color:#555; border:2px sold grey; margin-top:-65px;}

.right_float_quote p {z-index:100; margin-top:-210px;}

div.right_float_quote::before {font:10em Georgia, serif; color: #ddd; z-index:1; content:'\201C';}

.right_float_quote:after {font:10em Georgia, serif; color: #ddd; float:right; margin-top: -100px; margin-bottom: -9em;  content:'\201D'}

.left_float_quote {float:left; width: 30%; padding:10px; margin:5px; font-size: 1.5em; line-height:28px; color:#555; border:2px sold grey; margin-top:-65px;}

.left_float_quote p {z-index:100; margin-top:-210px;}

div.left_float_quote::before {font:10em Georgia, serif; color: #ddd; z-index:1; content:'\201C';}

.left_float_quote:after {font:10em Georgia, serif; color: #ddd; float:right; margin-top: -100px; margin-bottom: -9em;  content:'\201D'}

.right_float_blue {float:right; width: 35%; padding:10px; padding-top:0px; margin:10px; margin-bottom:0px;padding-bottom:0px; font-size: 1.5em; line-height:28px; color: #4682B4; }


}

@media (min-width : 760px) and (max-width:870px) {
.Block_Projects, .Block_Other, .Block_Science, .Block_Music, .Block_Medicine {
zoom:0.85;
}

.Block_Text { max-width:740px}

.Archive_List {zoom:0.85}
}



@media (max-width : 640px), (-webkit-min-device-pixel-ratio: 2), 
(min-resolution: 192dpi) {



#menu_container {
	position: relative;
	padding-top: 0px; 
	display: block;
	max-width:308px;
	width:100%;
	margin-left:auto;
	margin-right:auto;
	margin-top: -4em;

}

.nav {max-width: 308px; margin-left:auto; margin-right:auto; }

	
.viewArticle {

	max-width: 640px;
	width:95%;
	background:#fff;
	margin-left:auto;
	margin-right:auto;
	padding-left:auto;
	padding-right:auto;
}

#viewArticlecontents {margin-left:auto;margin-right:auto; font-size:1.3em; line-height:130%; margin-bottom: 2em;}

.right_float_quote, .left_float_quote {display:none}

blockquote {
	margin:0px;
	padding:10px;

	background-color: #CDD6DE; 
	font-size: 100%; 
	border-right: 10px solid #CDD6DE;
} 

 .viewArticle ol { list-style-position:inside;padding-left:0px;margin-left:0px;  counter-reset: my-badass-counter;list-style-type:none; /*list-style-position:inside; background-color:#F5FAFF;*/}

.viewArticle ol li::before { 
	display:block;
	content: counter(my-badass-counter) ". \A" ;
	counter-increment: my-badass-counter;
    margin-right: 5px;
    font-weight: bold;
    font-size:1.5em;
    white-space:pre;
    padding-left:30px;
    color: #4775A3;
	border-bottom:1px solid #D6E0EB;}



 .viewArticle ol li::after {display:block;content:"\A \A"; white-space:pre;}
.viewArticle ol li> img {margin:0px;}

#foglogo img { margin-left:auto; margin-right:auto;margin-top:0px; top:0px; padding-left:10px }	

 img.right_img, img.left_img {float:none; clear: both; max-width:100%; height:auto; margin-left:auto; margin-right:auto; display: block;}


.Block_Text {max-width: 308px; margin-left:auto; margin-right:auto; padding:0px;}

.Block_Text > ul {width:100%; list-style: none; margin-left:auto; margin-right:auto; }

img.block_img {
width: 250px;
height: 250px; 
margin: px;

}


.fade_box .details{
position:absolute;
padding:15px;
padding-left:15px;
top:0px;
left:0px;
height: 224px; 
width: 224px;
background: #fff;
background-color:rgba(150,150,150,0.6);
opacity: 0;
-webkit-transition: opacity;
-webkit-transition-timing-function: ease-out;
-webkit-transition-duration: 500ms;
-moz-transition: opacity;
-moz-transition-timing-function: ease-out;
-moz-transition-duration: 500ms;
overflow: hidden;
}

.Block_Science {
 		width: 250px;
        min-height: 250px;
        max-height:250px;
        border: 15px solid #E42A79;
        display: -moz-inline-stack;
        display: inline-block;
        vertical-align: top;
        margin: 6px;
        margin-left:auto;
        margin-right:auto;
        zoom: 1.1;
        *display: inline;
        _height: 250px;
        
        float:left;
        overflow:hidden;
        
        -webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
}

.Block_Other {
 		width: 250px;
        min-height: 250px;
        max-height:250px;
        border: 15px solid #00FF00;
        display: -moz-inline-stack;
        display: inline-block;
        background: #fff;
        vertical-align: top;
        margin: 6px;
       margin-left:auto;
        margin-right:auto;
        padding-bottom:0px;
        zoom: 1.1;
        *display: inline;
        _height: 250px;
        float:left;
        overflow:hidden;
        
        -webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
}

.Block_Projects {
		width: 250px;
        min-height: 250px;
        max-height:250px;
        border: 15px solid #566D7E;
        display: -moz-inline-stack;
        display: inline-block;
        vertical-align: top;
        margin: 6px;
       margin-left:auto;
        margin-right:auto;
        zoom: 1.1;
        *display: inline;
        _height: 250px;
        float:left;
		overflow:hidden;
		
		border-radius: 50%;
}

.Block_Medicine {
 		width: 250px;
        min-height: 250px;
        max-height:250px;
        border: 15px solid #4676E5;
        display: -moz-inline-stack;
        display: inline-block;
        vertical-align: top;
        margin: 6px;
     margin-left:auto;
        margin-right:auto;
        zoom: 1.1;
        *display: inline;
        _height: 250px;
         padding-bottom: 0em; 
        overflow: hidden;
        float:left;
        overflow:hidden;  
        
        -webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
}

.Block_Music {
 		width: 250px;
        min-height: 250px;
        max-height:250px;
        border: 15px solid #FFFF00;
        /*border-style: dotted; */
        vertical-align: top;
        margin: 6px;
      margin-left:auto;
        margin-right:auto;
        zoom: 1.1;
        *display: inline;
        padding-bottom: 0 px; 
        overflow: hidden;
        _height: 250px;
        z-index: 100;
        float:left;
        overflow:hidden;
        
        -webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
}

.Archive_List {
	max-width:640px; margin-left:auto; margin-right:auto;}
	
.Archive_Medicine {
 		max-width: 95%;
 		width:100%;
 		min-height:6em;
 		border-bottom: 0px;
 		}
 		
.Archive_Science {
 		max-width: 95%;
 		width:100%;
 		min-height:6em;
 		border-bottom: 0px;
 		} 	

.Archive_Other {
 		max-width: 95%;
 		width:100%;
 		min-height:6em;
 		border-bottom: 0px;
 		}
 		
.Archive_Projects {
 		max-width: 95%;
 		width:100%;
 		min-height:6em;
 		border-bottom: 0px;
 		}

.Archive_Music {
 		max-width: 95%;
 		width:100%;
 		min-height:6em;
 		border-bottom: 0px;
 		}
 		
	
/*#footer {max-width: 590px;}*/
/******************IOS hacks for boxes on 480 px screens************************/
.touch .fade_box {position: relative; display: block; height: 250px; 
width: 250px; padding: 0px;}

.touch .fade_box:hover{ padding:0px; margin:0px;}

.touch .fade_box .details{
position:absolute;
padding:0px;
top:0px;
left:0px;
height:250px;
width: 250px;
background: #fff;
visibility: hidden;
display: block;
} 


.touch .fade_box .details:hover{
position:absolute;
padding:0px;
top:0px;
left:0px;
height: 250px; 
width: 250px;
background: #fff;
background-color:rgba(150,150,150,0.6);
visibility: visible;
overflow:hidden;
} 

.touch .fade_box .inside{
position: absolute;
height: 170px; 
width: 230px;
left:0px; 
margin-top: 15px;
padding-left: 10px;
padding-right: 10px;
padding-top: 5px;
border-top: 5px solid grey;
border-bottom: 5px solid grey;
background:#fff;
visibility: visible;
overflow: hidden;}

.touch .Block_Projects .fade_box .details .inside {
padding-left: 10px;
padding-right: 22px;
padding-top:30px;
text-align:center;}

.touch .fade_box .inside:hover{
position: absolute;
width: 230px;
left:0px; 
margin-top: 15px;
padding-left: 10px;
padding-right: 10px;
padding-top: 5px;
border-top: 5px solid grey;
border-bottom: 5px solid grey;
color: #000;
background:#fff;
background-color:rgba(255,255,255,0.8);
visibility: visible;
overflow: hidden;}

.touch .fade_box b a{position: absolute; opacity: 0; width: 230px;  height: 200px; padding-top: 20px;}
.touch .fade_box p {}


.pubDate_view {
  color: #eb6841;
  width:100%;
  max-width:480px;
  
  float: left; 
  vertical-align: bottom;
  text-align: bottom;
  text-transform: uppercase;
  display: inline;
  
}

}