/********************Normal stuff for all browsers ******************/


body {
	font-family: Garamond, Cambria, Palatino, Baskerville, Georgia, "times new roman", times, serif;
	line-height:19px;
	font-size:13px;
	font-size:100%;
	color: #333;
	letter-spacing:normal;
	background: url(../images/bg3.jpg), url(../images/bg3_bottom.jpg);
	background-position: top, bottom;
	background-repeat:repeat-x, repeat-x;
	

	}
	
head { z-index: 999; }
	
sup { vertical-align: top; font-size: .75em; position: relative;  top: -0.5em;}
	

	
/************Tyesetting****************/

.viewArticle {font-family:'Crimson Text', serif;}

p.big_first_letter {margin-top:2.25em; } 

p.big_first_letter:first-letter {
  font-size:400%; 
  margin:-10px 0 -5px 0; 
  padding:0 .1em 0 0; 
  height:.7em; 
  line-height:.85em; 
  float:left; 
  *line-height:1em; /* IE7 Only */ 
  color: #4682B4;
  font-family: "Bookman", "Palatino", "Garamond", "Georgia", serif ; 
	 }
	
p.big_first_letter:first-line {font-variant:small-caps;}

h1,h2,h3 { font-family:Georgia, "Times New Roman", Times, serif; color: #333;} }

h1{ font-size:56px; margin:0; }

h2 {
	font-size:22px; font-weight:bold; 
	font-family:'Headland One';
	line-height:26px;
	color: #222;
	/*font-family: 'Arial black', arial, sans-serif;
	padding-bottom: 0;*/	
}

h3 a {font-size:22px;font-weight:bold; font-family: 'Avant Garde', Avantgarde, 'Century Gothic', CenturyGothic, 'AppleGothic', sans-serif;}

p,ul,ol{ margin-top:0; line-height:140%; text-align:inherit;}

a { color:#0078ff; text-decoration:none; }
a:hover{ text-decoration:underline;  }

.list1 li { float:left; line-height:normal; }
.list1 li img { margin:0 30px 30px 0;}
.list1 li.alt img { margin-right:0; }

#li a { font-weight:400; text-decoration:none; padding:0 0 0 20px; }
#li a:hover {font-weight:400; color:#666; text-decoration:none; }

hr.light_line { 
margin-top:1.25em;
margin-bottom:1.25em;
border: 0; 
height: 1px; 
background-image: -webkit-linear-gradient(left, rgba(100,100,100,0), rgba(100,100,100,0.85), rgba(100,100,100,0));
background-image: -moz-linear-gradient(left, rgba(100,100,100,0), rgba(100,100,100,0.85), rgba(100,100,100,0));
background-image: -ms-linear-gradient(left, rgba(100,100,100,0), rgba(100,100,100,0.85), rgba(100,100,100,0));
background-image: -o-linear-gradient(left, rgba(100,100,100,0), rgba(100,100,100,0.85), rgba(100,100,100,0)); }

hr.fancy_section {
    padding: 0;
    width:0px;
    border: none;
    text-align: center;
}
hr.fancy_section:after {
    font-family: 'Bookman';
    content: "\00a7";
    display: inline-block;
    top:-.15em;
    
    position: relative;  
    font-size: 4em;
    line-height:.1em;
    left:-.5em;
    
    -webkit-transform: scale(1,.5) rotate(-90deg);
   -moz-transform: scale(1,.5) rotate(-90deg);
   -ms-transform: scale(1,.5) rotate(-90deg)
   -o-transform: scale(1,.5) rotate(-90deg);
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
    
    }
.viewArticle img {max-width:100%; height:auto; margin-left: 5px; margin-right:5px;}
	


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


footnote { 
	  font-family:Georgia, "Times New Roman", Times, serif;
	  font-size: 1em;
	  font-weight: normal;
	  color: #333333;
	  } 

span.math {
font-family: Times, serif;
background-color:#CDD6DE;
padding:5px;
margin-bottom:0em;
font-size:115%;
letter-spacing:.1em;
}




/******************Tooltips*************************/
#aToolTip {
position: absolute;
display: none;
z-index: 50000;
}

#aToolTip .aToolTipContent {
position:relative;
margin:0;
padding:0;
font-size: 80%;
}
/*
END: Required Styles
*/
/**
Default Theme
*/
.defaultTheme {
border:2px solid #444;
background:white;
margin:0;
padding:6px 12px;	
padding-top:15px;
padding-bottom: 15px;
width: 240px;

/*-moz-border-radius: 12px 12px 12px 0;
-webkit-border-radius: 12px 12px 12px 0;
-khtml-border-radius: 12px 12px 12px 0;
border-radius: 12px 12px 12px 0; */

-moz-box-shadow: 2px 2px 5px #111; /* for Firefox 3.5+ */
-webkit-box-shadow: 2px 2px 5px #111; /* for Safari and Chrome */
box-shadow: 2px 2px 5px #111; /* for Safari and Chrome */
}

.defaultTheme:before {content: ' '; height: 0; position: absolute; width: 0; border: 10px solid transparent; border-top-color: #444; top: 102% ; left: 10px;	
}

.defaultTheme:after { content: ' '; height: 0; position: absolute; width: 0; border: 10px solid transparent; border-top-color: white; top: 100%; left: 10px;	
}


.defaultTheme #aToolTipCloseBtn {
display:block;
height:82px;
width:38px;
background-image:url(http://www.fogmagazineonline.com/../images/css/close.png); 
background-repeat:no-repeat; 
background-position:13px 15px;
font-weight:normal;
text-indent:-9999px;
outline:none;
position:absolute;
top:-30px;
right:-30px;
margin:2px;
padding-right:0px;
padding-top:14px;
padding-left:10px;
}


#textarea
{
	float:left;
	width:620px;
	margin-left:2px;
	display:inline;
	padding:0 10px 20px 0;
}


/***************front box image styles ****************************/

.fade_box {position: relative; overflow:hidden;}

.fade_box img{
 opacity:1;
-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_Projects>.fade_box img{ border-radius: 50%; }


.fade_box .details{
position:absolute;
padding:15px;
padding-left:20px;
top:0px;
left:0px;
height: 224px; 
width: 216px;
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_Projects>.fade_box .details{ -webkit-border-radius:50%; border-radius: 50%; }

.fade_box .details:hover{
opacity: 1;
visibility: visible;
background-color:rgba(150,150,150,0.6);
-webkit-transition: opacity;
-webkit-transition-timing-function: ease-in;
-webkit-transition-duration: 500ms;
-moz-transition: opacity;
-moz-transition-timing-function: ease-in;
-moz-transition-duration: 500ms;
overflow: hidden;
}

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

.Block_Projects>.fade_box .details .inside p, .Block_Projects>.fade_box .details .inside p:hover {padding-left:20px; padding-right:20px; text-align:center; }

.fade_box b {
font-family: 'Avant Garde', Avantgarde, 'Century Gothic', CenturyGothic, 'AppleGothic', sans-serif;
font-weight: normal;
}

/******************IOS hacks for boxes************************/
.touch .fade_box {position: relative; display: block; height: 250px; 
width: 250px; }

.touch .fade_box:hover{}

.touch .fade_box .details{
position:absolute;
padding:15px;
padding-left:20px;
top:15px;
left:15px;
background: #fff;
visibility: hidden;
display: block;
} 

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

.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 .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 {}


/*.fade_box > img .details:hover{opacity: .4;} */


/******** hompepage layout for blocks class margin left affects where the blocks are************/




/* START specialized link styles that corespond with category ids styled as <a class="xxx"> where xxx== <?php echo htmlspecialchars( $results['categories'][$article->categoryId]->name)?> */
.Science {
color: #E42A79;
}
a.Science:link{  color: #E42A79;}
a.Science:hover {color: #000;}

.Other {color: #0AAD4A;}
a.Other:link{color: #0AAD4A;}
a.Other:hover {color: #000;}

.Medicine {color: #4676E5;}
a.Medicine:link{color: #4676E5;}
a.Medicine:hover {color: #000;}

.Projects {color: #566D7E;}
a.Projects:link{color: #566D7E;}
a.Projects:hover {color: #000;}

.Music {color: orange;}
a.Music:link{color: orange;}
a.Music:hover {color: #000;}


/* END specialized link styles*/


/***************START layout design for archive page lists********************/

/* class for beginning or archive layout, based on .Block_Text class for blocks class margin left affects where the blocks are*/
.Archive_List {
	position:relative;
	float: left;
	width:1000px;
	background:#fff;
	margin-left: 26px;
	padding:10px;
}

.archive_padding {padding:18px;}

/* Archive block layout for <li id="Archive_x">*/
.Archive_Medicine {
 		width: 26.5em;
 		min-height:9.5em;
        display: -moz-inline-stack;
        display: inline-block;
       border-bottom: 1px solid #D6E0EB;
       /* #4676E5; */
        vertical-align: top;
        margin: 0px;
        zoom: 1;
        *display: inline;
        _height: 250px;
        padding-bottom: 0em;
        position: relative;
        z-index:100;
}

.Archive_Medicine:active{background-color: #CAE0F6;}

.Archive_Science {
 		width: 26.5em;
 		min-height:9.5em;
        display: -moz-inline-stack;
        display: inline-block;
        border-bottom: 1px solid #D6E0EB; 
        /*background: #E42A79; */
        vertical-align: top;
        margin: 0px;
        zoom: 1;
        *display: inline;
        _height: 250px;
        padding-bottom: 0em;
        position: relative;
        z-index:100;
}

.Archive_Science:active{background-color: #F6CAE0;}

.Archive_Other {
 		width: 26.5em;
 		min-height:9.5em;
        display: -moz-inline-stack;
        display: inline-block;
        border-bottom: 1px solid #D6E0EB;
        /*#0AAD4A; */
          vertical-align: top;
        margin: 0px; /*used to be 5 */
        zoom: 1;
        *display: inline;
        _height: 250px;
        padding-bottom: 0em;
        position: relative;
        z-index:100;
        clear:both;
}

.Archive_Other:active{background-color: #CAF6DC;}

.Archive_Projects {
 		width: 26.5em;
 		min-height:9.5em;
        display: -moz-inline-stack;
        display: inline-block;
        border-bottom: 1px solid #D6E0EB;
          vertical-align: top;
        margin: 0px; /*used to be 5 */
        zoom: 1;
        *display: inline;
        _height: 250px;
        padding-bottom: 0em;
        position: relative;
        z-index:100;
}

.Archive_Music {
 		width: 26.5em;
 		min-height:9.5em;
        display: -moz-inline-stack;
        display: inline-block;
        border-bottom: 1px solid #D6E0EB;
         vertical-align: top;
        margin: 0px;
        zoom: 1;
        *display: inline;
        _height: 250px;
        padding-bottom: 0em;
        position: relative;
        z-index:100;
}



.pubDate_if {
  
  font-size: .8em;
  color: #eb6841;
  top: 10em;
  right: .5em;
  
  float: right; 
  vertical-align: bottom;
  text-align: bottom;
  text-transform: uppercase;
  display: inline;
  

}

.pubDate_view {
  

  color: #eb6841;

  top: 128px;
  right: 10px;
  
  float: right; 
  vertical-align: bottom;
  text-align: bottom;
  text-transform: uppercase;
  display: inline;
  
}




	
/*END layout design for archive page lists */




/* image ids!!  when putting an image in a post, use  <img id="page_image" src= ""alt="" width="250" height="250"/> */
img { border:0; margin-top:0; }

#thumb_image{
opacity:1.0;
filter:alpha(opacity=100);
background: #fff;
z-index: 10;
}

#thumb_image:link {
opacity:1.0;
filter:alpha(opacity=100);
background: #fff;
z-index: 10;
}

#thumb_image:hover {
opacity:0.4; 
filter:alpha(opacity=40);
background: #fff;
z-index: 10;
}

img.archive_image{
float: left;
border: 1px solid grey;
margin-bottom: 1em;
margin-right: 1em;
z-index: 10;
width:100px;
height:100px;
/*-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-khtml-border-radius: 5px;
border-radius: 5px; */
}

.center_archive {text-align: center;max-width:850px;}


.right_img{
float: right;
margin-left: 1em;
margin-bottom: 0 em;
}

.right_img_border{
float: right;
margin-left: 1em;
margin-bottom: 0em;
border:1px solid #B4BCBB;
}

.left_img{
float: left;
margin-right: 1em;
}

.left_img_border{
float: left;
margin-right: 1em;
border:1px solid #B4BCBB;
}

.center_img{
display: block; ΚΚ
margin:1em;
margin-bottom:1em;
}

.center_img_border{
display: block; ΚΚ
margin:1em;
margin-bottom:1em;
border:1px solid #B4BCBB;
}

.shadow_img{
display: block; ΚΚ
margin:1em;
margin-bottom:1em;
border: 1px solid grey;
-webkit-border-radius: 20px; 
-moz-border-radius: 20px; 
border-radius: 20px; 
-moz-box-shadow: 10px 10px 5px #888;
-webkit-box-shadow: 5px 5px 5px #888;
box-shadow: 5px 5px 5px #888;}

.round_img{
display: block; ΚΚ
margin:1em;
margin-bottom:1em;
border: 1px solid grey;
-webkit-border-radius: 20px; 
-moz-border-radius: 20px; 
border-radius: 20px; 
}

/* end image ids*/

#content_entry{padding:2em}


	
.persist-area {background:green; z-index:9999;}
.floatingHeader { position: fixed; top: 0; z-index:9999; visibility: hidden; }

.persist-area .floatingHeader {width:100%; display: block; padding-left: 0px; padding-bottom:1px; border-bottom: 1px solid grey; margin-left: 0px; overflow:hidden; z-index:9999; }

.floatingHeader:before {content:"Fog | "}