html {
position:absolute;
left:0;
top:0;
height:100%;
width:100%;


}
body {
	

	margin:0;
	padding:0;
	font:16px/150% Arial, Helvetica, sans-serif;
	font-family: 'Open Sans', sans-serif;
	font-family: 'Roboto', sans-serif;
	font-weight:100;
	color:#333;
	background-color:#444;
		overflow:scroll;
	
}
#maxwindow {
	position:absolute;
	width:100%;
	height:100%;
}
.clickable {
z-index:1000;
	cursor:pointer;
/*	box-shadow:0 0 10px #aaa;*/
/*	-webkit-transition: transform 0.2s ease;
    transition: transform 0.2s ease;*/
	background-image:url(mag.png)
}
.clickable:hover {
/*box-shadow: #000 0 0 20px;
outline:6px solid #fff;*/
z-index:1000;
/*-ms-transform: scale(1.1,1.1);  
    -webkit-transform: scale(1.1,1.1); 
    transform: scale(1.02,1.02);*/
}
.mag {
position:absolute;
z-index:0;

}
.mag:before {

  display:block;
  position:absolute;
  height:100%;
  width:100%;
  content:' ';
}
.mag:hover {
display:none;
z-index:-1000;
}
#picoverlay {
position:absolute;
background:rgba(0,0,0,0.2);
}
h1 {
	margin-top:0;
	margin-bottom:30px;
	line-height:130%;
	color:#000;
	font-size:20px;
}
#leftbar {

position:relative;
float:left;
width:20%;
height:auto;
color:#444;
background-color:#444;
  overflow:hidden;
padding-bottom:40px;  

}
#wrap {
position:relative;
	width:75%;
	
	min-height:500px;
		overflow:hidden;
		padding:0;

background: rgb(204,204,204); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(204,204,204,1) 0%, rgba(255,255,255,1) 56%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(204,204,204,1)), color-stop(56%,rgba(255,255,255,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(204,204,204,1) 0%,rgba(255,255,255,1) 56%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(204,204,204,1) 0%,rgba(255,255,255,1) 56%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(204,204,204,1) 0%,rgba(255,255,255,1) 56%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(204,204,204,1) 0%,rgba(255,255,255,1) 56%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cccccc', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */

	
	
}
#innerwrap {	
	padding:50px 10% 50px 50px;
	min-height:400px;
	overflow:auto;
	
	
}
#content {
	position:relative;
	overflow:visible;
	width:100%;
	height:100%;
	outline:0px solid #aaa;
	border-top-left-radius:10px;
	border-bottom-left-radius:10px;
	border-radius:0px;
	outline:1px solid #ccc;
	background-color:#FFFFFF;
}
article{
  padding:50px 20% 80px 60px;
  padding:4% 10% 7% 6%;
  color:#000;
  font-family: 'Oswald', sans-serif;
  font-family: 'Cuprum', sans-serif;
  font-family: 'Pontano Sans', sans-serif;
  font-family: 'Questrial', sans-serif;
  font-family: 'Catamaran', sans-serif;
  font-weight:400;
 height:auto;
 width:84%;
 overflow:hidden;
 text-align:justify;
}
#nav {
	float:right;
   margin-top:50px;
   margin-right:50px;
   max-width:220px;
   overflow:hidden;
  
   
}

#nav ul {
	list-style:none;
	margin:0;
	padding:0;
}
#nav ul li {
	margin:0;
	margin-top:20px;
}
#nav ul li a {
	color:#fff;
	text-decoration:none;
	
	line-height:20px;
	 font-family: Arial,'Catamaran', sans-serif;
  font-weight:bold;
	
}
#nav>ul>li:hover a,#nav2 ul li:hover a {
color:#ccc;
}
#nav ul li ul,#nav2 ul li ul {
	display:none;
	margin:0;
	padding:0;
}
#nav ul li ul li:hover a,#nav2 ul li ul li:hover a{
	color:#fff;
}
#nav ul li ul li,#nav2 ul li ul li {
	margin-left:20px;
	margin-top:5px;
	padding:0;
	
}
#nav ul li ul li a,#nav2 ul li ul li a{
	font-weight:normal;
}
.cursub {
font-style:normal;
color:#999 !important;
}
#nav2 {
	position:absolute;
	left:20px;
    top:50px;
   width:200px;
   margin:0;
   padding-bottom:40px;
  
   
}

#nav2 ul {
	list-style:none;
	margin:0;
	padding:0;
}
#nav2 ul li {
	margin:0;
	margin-top:20px;
}
#nav2 ul li a {
	color:#fff;
	text-decoration:none;
	
	line-height:20px;
	 font-family: Arial,'Catamaran', sans-serif;
  font-weight:bold;
	
}
#author {
	position:absolute;
	top:-35px;
	left:0px;
	
	height:20px;
	font-weight:bold;
	letter-spacing:5px;
	color:#666;
}
img {
	/*box-shadow:#ccc 0px 0px 10px;*/
	border:0px solid #fff;
}
#mobilenav{
	position:absolute;
	left:-250px;
	top:0;
	width:250px;
	height:100%;
	z-index:1000;
	background:#444;
	display:block;
	padding-bottom:0px;  
	overflow:visible;
	z-index:1000;
	
	
}
#stack {
	position:absolute;
	right:-30px;
	width:30px;
	top:200px;
	height:200px;
	background-color:#666666;
	background-image:url(img/arrow_r.png);
	background-repeat:no-repeat;
	background-position:center center;
	z-index:9999;
}
.arrow_l {
background-image:url(img/arrow_l.png) !important;;
}
img {
/*margin:20px 20px 20px 0px;*/
}
@media screen and (max-width:1200px) {
  nav {
  	
  }
  #wrap {
width:72%;
}
   #leftbar {
  
    width:28%;
   }
   #innerwrap {	
	padding:50px 5% 50px 5%;
	min-height:400px;
	overflow:auto;
	
	
}
 }
 @media screen and (max-width:800px) {
   #leftbar {
  
    width:0%;
   }
     #wrap {
width:100%;
}
#mobilenav{ display:block !important;}
 }
  @media screen and (min-width:800px) {
#mobilenav{ display:none;}
 }