body{
	font: 15px/1.5 Arial, Helvetica, sans-serif;
	padding: 0;
	margin: 0;
	background-color: #c0c0c0; 
	width: 100%
	height:100%;
}
/*Global*/
.container{
	width: 80%;
	margin: auto;  
	overflow: hidden; 
}
ul{  
 	padding: 0;
 	margin: 0;
}
 

.w{
	color: #e8491d;
}
label{
	float: right;
	margin: 0 40px 0 0;
	font-size: 26px;
	line-height: 70px;
	display: none;
	padding-right: 0;
	margin-right: 0;

}
#toggle{
	display: none;
}
#pic{
	width: 100%
}

/*Header*/
header{
	background: #f4f4f4;
	padding-top: 10px;
	min-height: 70px; 
	border-bottom: #e8491d 3px solid;
}
header a{
 	color: #000;
 	text-decoration: none;
 	text-transform: uppercase;
 	font-size: 16px;
}
  
header li{
 	float: left;
 	display: inline;
 	padding: 0px 20px 0 20px;
}

header #logo img{
 	float: left;
 	width:350px;
 	margin: 0px;
}
header nav{
 	float: right;
 	margin-top: 55px;
}
header .highlight, header .current a{
	color: #e8491d;
	font-weight: bold;
}
header a:hover{
 	color: #e78100;
 	font-weight: bold;
}

/*showcase*/
#showcase{
 	min-height: 300px;
 	background: url(../images/showcase1.jpg) no-repeat 0px  -300px;
 	text-align: center;
 	color: #fff;
 	border-bottom: #e8491d 3px solid;
}

#showcase h1{
 	margin-top: 100px;
 	margin-bottom: 10px;
 	font-size: 65px;
}
#showcase p{
	font-size: 25px ;
}
#showcase1{
 	min-height: 300px;
 	background: url(../images/publications.png) no-repeat 0px -300px;
 	text-align: center;
 	border-bottom: #e8491d 3px solid;
 	text-align: center;
}

#showcase1 h1{
	color: #fff;
	font-size: 65px;
	margin-top: 0px;
}

#showcase1 p{
	margin-top: 100px;
	margin-bottom: 0px;
	font-size: 25px ;
	font-weight: bold;
	color: #fff;
}
#showcase2{
 	min-height: 300px;
 	background: url(../images/research.png) no-repeat -80px -200px;
 	text-align: center;
 	border-bottom: #e8491d 3px solid;
 	text-align: center;
}

#showcase2 h1{
	color: #fff;
	font-size: 65px;
	margin-top: 0px;
}

#showcase2 p{
	margin-top: 100px;
	margin-bottom: 0px;
	font-size: 25px ;
	font-weight: bold;
	color: #fff;
}
#showcase3{
 	min-height: 300px;
 	background: url(../images/teaching.jpg) no-repeat 0px -100px;
 	text-align: center;
 	border-bottom: #e8491d 3px solid;
 	text-align: center;
}

#showcase3 h1{
	color: #fff;
	font-size:65px;
	margin-top: 0px;
}

#showcase3 p{
	margin-top: 100px;
	margin-bottom: 0px;
	font-size: 25px ;
	font-weight: bold;
	color: #fff;
}
#showcase4{
 	min-height: 300px;
 	background: url(../images/awards.png) no-repeat 0px -100px;
 	text-align: center;
 	border-bottom: #e8491d 3px solid;
 	text-align: center;
}

#showcase4 h1{
	color: #fff;
	font-size: 65px;
	margin-top: 0px;
}

#showcase4 p{
	margin-top: 100px;
	margin-bottom: 0px;
	font-size: 25px ;
	font-weight: bold;
	color: #fff;
}


/*main-col*/
#main{
	min-height:300px;
	background: #35424a ;
	width: 100%;
	
}
article#main-col{
	float: left;
	width: 65%;
	background: #35424a;
	margin:10px 0 0 0; 
	padding: 0 0 10px 10px; 
}
.title{
	margin: 10px 0 0 0;
	padding-left: 50px;
	color: #e8491d;
	font-size:30px;
	width: 600px;
	
}

.dark1{
	background: #35424a;
	margin:0 10px 10px 55px;
	float:right;
	padding:3px 18px 20px 15px;
	color: #fff;
	text-align:justify;
	font-size: 18px;
	border-style: solid;
	border-color:  #35424a #35424a #e8491d #e8491d;
}
/*sidebar*/
aside#sidebar{
	min-height: 260px;
	float:right;
	width: 30%;
	margin-top: 10px;
	padding-bottom: 20x;		
}
#sidebar h2{
	margin-bottom: 5px;
	padding-left: 10px;
	color: #ccc;
}
.hoverable a{
	padding: 0px 0px 7px 20px;
	text-decoration: none;
	font-size: 18px;
	color: #e8491d;
	display: block;
}
.hoverable a:hover {
	color: #f4f4f4;
}

/*boxes*/
#boxes{
	
	margin-top: 5px;
	background: #fff;
}
#boxes .box{
	float:left;
	width: 22.5%;
	padding: 10px;
	text-align:center; 
}
#boxes .box img{
	width: 90px;
}

#main h3{
	color: #fff;
	padding-left: 50px;
}
ul.lists{
	padding-left: 50px;
}
ul.lists li{
	list-style: none;
	padding: 10px;
	border: #ccc solid 1px;
	margin-bottom: 5px;
	text-align:justify;
	border-style: solid;
	border-color-bottom:#e8491d;
	background: #35424a;
	color: #fff;
}
.lists a{
	text-decoration: none;
	color: #e8491d;
}

footer{
	padding: 20px;
	margin-top: 3px;
	color: #fff;
	background-color: #e8491d;
	text-align: center;
}
/* Media Queries */
@media(max-width: 768px){
  header nav,
  header nav li,
  article#main-col,
  aside#sidebar,
  #boxes .box,
 .lists, #pic img{
    float:none;
    text-align:center;
    width:100%;
  }

  header{
  	margin-top: 0px;
  	padding-top: 0px;
    padding-bottom:0px;
  }
  header nav{
  	margin: 0px;
  }
 
  #showcase  h1,
  #showcase1 h1,
  #showcase2 h1,
  #showcase3 h1,
  #showcase4 h1{
    margin-top:40px;
    font-size:40px;
    
  }

  .title{
  	width: 285px;
	margin-top: 5px;
	padding-left: 10px;
	padding-right: 10px;
	text-align: center;
  }
  .dark1{
  	text-align: center;
  	margin: 0px 0px 5px 0;
  	border-color: #35424a #35424a #e8491d #35424a;
  	padding: 0 5px 5px 0;
  }
  #main h3,#main p{
  	margin: 0px;
	padding-left: 0px;
	padding-bottom: 5px;
	text-align: center;
  }
  ul.lists{
	padding-left: 3px;
	padding-right: 3px;

  }
  ul.lists li{
	list-style: none;
	padding: 0px 5px 0 5px;
	margin:0 7px 1px 1px; 
	text-align:center;
	border-top: 0px;
  	border-right: 0px;
  	border-left: 0px;
	
  }


 label{
	display: block;
	cursor: pointer;
	width: 26px;
	float: right;

  }
  .menu{
	text-align: center;
	width: 100%;
	display: none;
  }
  .menu li a{
	display: block;
	border-bottom: 1px solid #e78100;
	margin: 0px;
	clear: right;
  }
  #toggle:checked + .menu{
	display: block;
  }
  #logo{
	display: none;
  }

}