@import url(http://fonts.googleapis.com/css?family=Open+Sans);

body { 
  font-family: 'Open Sans', sans-serif;
  color: #666;
  background-color:#E8E5E5;
  margin: 0;
	padding: 0;
	border: 0;
	width:100%;

}

label.filebutton {
    height:92px;
width:73px;
position:relative;
margin-left:10px;
float:left;
}
#prof
{
float:right;
color:#003366;
font-size:14px;
width:320px;
height:15px;
cursor:pointer;
}
#prolist
{
height:170px;
width:180px;
background:#FFFFFF;
border:solid #f2f2f2 1px;
box-shadow:0px 1px 3px #003366;
display:none;
}
#drp
{
float:left;
line-height:70px;
padding-left:40px;
padding-right:10px;
}
#stro
{
width:300px;
}
#prl
{
height:25px;
line-height:25px;
padding-left:15px;
font-size:12px;
color:#333333;
}
#prl:hover
{
background:#9966FF;
color:#FFFFFF;
font-weight:bold;

}
#prolist:hover #prolist
{
display:block;
}
label span input {
height:92px;
width:70px;
    opacity:0;
	position:absolute;
	margin-top:-10px;
    filter: alpha(opacity = 0);
    -ms-filter: "alpha(opacity=0)";
    cursor: pointer;
	border:#0033CC solid 4px;
}




#invalue2
{
width:70%;
height:auto;
float:left;
padding-top:5px;
padding-bottom:5px;
line-height:70px;
}
#gph
{
height:92px;
width:73px;
position:relative;
margin-left:10px;
float:left;

}


#imagePreview {
   height:92px;
    width:73px;
    background-position: center center;
    background-size: cover;
    -webkit-box-shadow: 0 0 1px 1px rgba(0, 0, 0, .3);
	box-shadow: 0 0 1px 1px rgba(0, 0, 0, .3);
    display: inline-block;
}
.newch
{
margin-left:10px;
margin-top:-20px;
}
#cbox
{
background:#000000;
padding-top:80;
}
#cls
{
height:30px;
width:80px;
border-radius:0px 5px 0px 15px;
background:#FF0000;
float:right;
}
#catlist
{
width:100%;
}
#elisti
{
float:left;
width:40%;
height:35px;
padding-left:10px;
}
#topics
{
float:left;
width:80%;
height:35px;
padding-left:10px;
}

#cturl
{
color:#0066FF;
}
#delist
{
float:left;
width:9%;
height:35px;
}
#uplist
{
float:left;
width:9%;
height:35px;
}
#attr
{
width:30%;
height:auto;
float:left;
padding-top:5px;
padding-bottom:5px;
}
#inpbox
{
height:30px;
width:80%;
}
#inform
{
width:100%;
padding-bottom:100px;
}
#invalue
{
width:70%;
height:auto;
float:left;
padding-top:5px;
padding-bottom:5px;
}
#addplus
{
float:right;
height:60px;
width:60px;
}
#txtearea
{
width:100%;
height:250px;
}
#txtsyllabus
{
width:100%;
height:100px;
}
#txtbook
{
width:100%;
height:50px;
}
#print
{
width:100%;
background:#FFFFFF;
}
#headk
{
width:100%;
}
.printhead
{

font-size:36px;
padding-top:10px;
border-bottom:solid 2px #00FF99;
}
#printsub
{
font-size:16px;
}
#printt
{
font-size:36px;
float:left;
line-height:75px;
}
#blowbtn
{
margin-top:50px;
width:95%;
text-align:right;
margin-bottom:10px;
}
#urlbtn
{
margin-right:30px;
	background: #25A6E1;
	background: -moz-linear-gradient(top,#25A6E1 0%,#188BC0 100%);
	background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#25A6E1),color-stop(100%,#188BC0));
	background: -webkit-linear-gradient(top,#25A6E1 0%,#188BC0 100%);
	background: -o-linear-gradient(top,#25A6E1 0%,#188BC0 100%);
	background: -ms-linear-gradient(top,#25A6E1 0%,#188BC0 100%);
	background: linear-gradient(top,#25A6E1 0%,#188BC0 100%);
	filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#25A6E1',endColorstr='#188BC0',GradientType=0);
	padding:8px 13px;
	color:#fff;
	font-family:'Helvetica Neue',sans-serif;
	font-size:17px;
	border-radius:4px;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	border:1px solid #1A87B9
}
#urlbtnk
{
margin-right:30px;
	background: #25A6E1;
	background: -moz-linear-gradient(top,#25A6E1 0%,#188BC0 100%);
	background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#25A6E1),color-stop(100%,#188BC0));
	background: -webkit-linear-gradient(top,#25A6E1 0%,#188BC0 100%);
	background: -o-linear-gradient(top,#25A6E1 0%,#188BC0 100%);
	background: -ms-linear-gradient(top,#25A6E1 0%,#188BC0 100%);
	background: linear-gradient(top,#25A6E1 0%,#188BC0 100%);
	filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#25A6E1',endColorstr='#188BC0',GradientType=0);
	padding:6px 9px;
	color:#fff;
	font-family:'Helvetica Neue',sans-serif;
	font-size:17px;
	border-radius:4px;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	border:1px solid #1A87B9;
	float:right;
}

.roundnews
{
border:#000000 solid 2px;
border-radius:50%;
}
#maingrade
{
width:100%;
line-height:50px;
float:none;
height:53px;
margin-bottom:20px;
margin-left:20px;


}
#photor
{
height:50px;
width:50px;
float:left;
}

.roundnews1 {border:#FFFFFF solid 2px;
border-radius:50%;
}
#gratitile
{
line-height:52px;
width:150px;
font-size:18px;
color:#FFFFFF;
float:left;
padding-left:10px;
}
#grdm
{
background-color:#FFFFFF;
height:30px;
width:30px;

border-radius:50%;
float:left;
line-height:30px;
color:#990099;
text-align:center;
vertical-align:middle;
margin-top:12px;
margin-left:30px;
font-weight:bold;
}
#urlbtnk
{ font-size:12px;
	float:right;
	margin-right:12px;
	font-weight:200;
} 
#watermark
{
height:500px;
padding-top:20%;
width:100%;
}               
#del
{
float:right;
}
#vido
{
width:100%;
height:50px;
float:left;
line-height:65px;
font-size:14px;
font-weight:bold;
border-bottom:#CCCCCC solid 1px;
padding-left:5px;

}
#content {
	width: 19%;
	float: left;
	padding: 5px 15px;
	margin-left:10px;
	
}

#middle {
	width: 53%; /* Account for margins + border values */
	float: left;
	padding: 5px 15px;
	margin: 0px 15px 10px 15px;
	
}

#sidebar {
	width: 19%;
	padding: 5px 15px;
	float: left;
}
#footer {
	clear: both;
	
	background-color:#242b33;
	color:#cce3fe;
	font-size:12px;
}

#utop
{
width:100%;
height:45px;
border-bottom:#f2f2f2 solid 1px;
}
#stopic
{
width:100%;
margin-bottom:10px;
padding-left:5px;
border-bottom:#f2f2f2 solid 1px;
}
#uits
{
float:left;
height:40px;
width:48px;
border-right:#FF3333 solid 5px;
margin-top:3px;
text-align:center;
font-weight:bold;
font-size:12px;
}
#uitsn
{
font-size: 2.40vw; 
font-weight:bold;
line-height:22px;
font-stretch:extra-condensed;
}
#topic
{
float:left;
line-height:45px;
font-size:16px;
}
#ltitile
{
width:100%;
height:50px;
float:left;
line-height:65px;
font-size:14px;
font-weight:bold;
border-bottom:#CCCCCC solid 1px;
padding-left:5px;
}
#gltitile
{
width:100%;
height:50px;
float:left;
line-height:65px;
font-size:14px;
font-weight:bold;
border-bottom:#CCCCCC solid 1px;
padding-left:5px;
margin-top:30px;
}

#rthumb
{
   border: 1px solid #ccc;
	border-radius: 5px;
	text-align: center;
	margin-left:10px;
	margin-top:10px;
	height:120px;
	width:200px;
	background:#FFFFFF;
	float:left;
}
#arthumb
{
   border: 1px solid #ccc;
	border-radius: 5px;
	text-align: center;
	margin-left:10px;
	margin-top:10px;
	height:125px;
	width:200px;
	background:#FFFFFF;
	float:left;
	padding-bottom:50px;
}
#rthumb:hover {
box-shadow: 0px 1px 4px 2px #ccc;
}
#rlti
{
height:35px;
width:100%;
border-top:#0033FF solid 1px;
font-weight:bold;
color:#999999;
}
#rlh
{
height:84px;
padding-left:4px;
padding-right:4px;
padding-top:5px;
vertical-align:baseline;

}
#arlh
{
height:64px;
padding-left:4px;
padding-right:4px;
padding-top:5px;
vertical-align:baseline;

}
#controls
{
height:20px;
line-height:20px;
}

#gradesth
{
width:165px;
height:222px;
border:#9900FF solid 2px;
background-color:#9900FF;
margin-top:30px;
margin-left:40px;
float:left;

}
#gradeti
{
height:15px;
background:#9900FF;
font-weight:bold;
font-size:12px;
color:#FFFFFF;
line-height:13px;
text-align:center;
border-top:#FFFFFF solid 1px;
}
#gradetii
{
height:15px;
background:#9900FF;
font-weight:bold;
font-size:12px;
color:#FFFFFF;
line-height:13px;
text-align:center;

}
.cont
{
border:#ECE8FD solid 1px;
margin-top:5px;
width: 100%;
overflow:auto;

}
.pcont
{
border:#ECE8FD solid 1px;
margin-top:5px;
width: 90%;
overflow:auto;
margin-left:5%;

}
.contg
{
border:#ECE8FD solid 2px;
margin-top:10px;
padding-bottom:10px;
width: 100%;
overflow:auto;
padding-top:15px;

}

.contr
{
border:#ECE8FD solid 1px;
background:#f2f2f2;
margin-top:1px;
width: 100%;
overflow:auto;
padding-bottom:50px;
}
#assignment
{
width:97%;
margin:5px;
height:130px;
background:#FFFFFF;
border-radius:5px;
box-shadow: 0px 1px 4px 2px #ccc;
}
#due
{
height:100%;
width:20%;
background:#FF0000;
float:left;
border-radius: 5px 0px 0px 5px;
font-size:4.0em;
color:#FFFFFF;
text-align:center;
}
#assigntitile
{
float:left;
width:60%;
padding:10px;
height:40px;
font-size:16px;
font-weight:bold;
border-bottom:#FF0000 solid 1px;
}
#assibody
{
float:left;
width:75%;
padding:10px;
overflow:auto;
height:80px;
}
#asdate
{
text-align:center;
line-height:14px;
color:#FFFFFF;
font-size:12px;
}
#edate
{
text-align:center;
line-height:14px;
color:#FFFFFF;
font-size:14px;
}
/* STRUCTURE */
#header {
	height: 60px;
	width:100%;
	position:fixed;
	background-color:#FFFFFF;
	z-index:1000;
}
/* Lecture Notes*/


#lecthold
{

width:120px;
height:110px;
background-color:#0099CC;
margin-left:15px;
border-radius:5px;
margin-top:15px;
display:block;
float:left;
overflow:auto;
}
#pecthold
{

width:120px;
height:110px;
background-color:#003399;
margin-left:15px;
border-radius:5px;
margin-top:15px;
display:block;
float:left;
overflow:auto;
}
#qtnhold
{

width:120px;
height:110px;
background-color:#6dbe4d;
margin-left:15px;
border-radius:5px;
margin-top:15px;
display:block;
float:left;
overflow:auto;
}


#ficon
{
width:120px;
height:65px;
background-color:#FFFFFF;
border:#0099CC solid 1px;
position:relative;
overflow:hidden;
transition: 0.2s;
}
#filetitile
{
font-size:10px;
font-weight:900;
color:#FFFFFF;
}
#slider
{
width:100%;
height:65px;
bottom:-65px;
background-color:#000000;
transition: 0.5s;
position:absolute;
line-height:90px;
opacity: 0.8;
filter: alpha(opacity=80);
}
#win
{
width:100%;
height:190px;
bottom:-190px;
background-color:#000000;
transition: 0.5s;
position:absolute;
opacity: 0.8;
filter: alpha(opacity=80);
}
#txtt
{
font-weight:bold;
}
#imgh
{
height:185;
width:100%;
position:relative;
overflow:hidden;
transition: 0.2s;
}
#imgh:hover #win{
transition: 0.2s;
bottom:0px;
}

#vslider
{
width:185px;
height:120px;
bottom:-120px;
background-color:#000000;
transition: 0.5s;
position:absolute;
line-height:150px;
opacity: 0.8;
filter: alpha(opacity=80);
}
#sid
{
opacity:1;
filter: alpha(opacity=100);
}

#ficon:hover #slider{
transition: 0.2s;
bottom:0px;
}

#thumbimg:hover #vslider{
transition: 0.2s;
bottom:0px;
}

#logo
{
float:left;
height:58;
width:60;
margin-left:25px;
margin-top:5px;
}
#subjtitile
{
font-size:20px;
color:#0066FF;
line-height:50px;

}

#newsbar
{
width:100%;
height:100px;
}
#nbarhd
{
background-color:#0099FF;
height:100px;
width:15%;
line-height:100px;
}
	
#roundnum
{
font-size:18px;
color:#FFFFFF;
line-height:30px;
font-weight:bold;
}
#roundtxt
{
font-size:12px;
color:#FFFFFF;
line-height:12px;
}
#newsthrd
{
width:100%;
height:50px;
background:#FFFFFF;
border:#f2f2f2 solid 1px;
margin-top:5px;

}
#thrdhd
{
background:#c9d3d4;
float:left;
width:25px;
height:49px;
}
#thrdnum
{
color:#FFFFFF;
font-size:15px;
line-height:35px;
font-weight:bold;
}
#thrdtxt
{
color:#FFFFFF;
font-size:12px;
line-height:12px;
}
#newstxt
{
font-size:12px;
padding-left:25px;
margin-left:5px;
vertical-align:super;
}
#arw
{
width:20px;
float:right;
}


#limenu
{
line-height: 40px;
}
#icn
{
margin-right:10px;
float:left;
padding-top:6px;
}

#sidtxt
{
line-height:20px;
}

#subcont
{
padding-left:5px;
border-radius:2px;
}
#headsub
{
background:#99CCFF;
font-size:14px;
font-weight:bold;
color:#666666;

}


#pagewrap {
	width: 100%;
	padding-top:69px;
}

.contsamll
{
border:#ECE8FD solid 1px;
margin-top:10px;
overflow:auto;
text-align:center;
}
.contsamli
{
border:#ECE8FD solid 1px;
margin-top:10px;
overflow:auto;
}
.counts
{
border:#ECE8FD solid 1px;
margin-top:20px;
height:150px;
width:100%;
background:#00FFCC;
}
#pview
{
border:#ECE8FD solid 1px;
height:70px;
background:#CCCCCC;
font-size:36px;
line-height:50px;
}
#pviewtext
{
font-size:12px;
line-height:15px;
}
#con1, #con2, #con3
{
margin-top:10px;
float:left;
margin-left:2%;
text-align:center;
width:30%;
background:#00FFFF;
height:60px;
font-size:25px;
line-height:50px;
}
#insm{
font-size:12px;
line-height:12px;
}
#headc
{
width:100%;
}

.conthead
{
line-height:68px;

float:left;

}
.contheadi
{
width:80px;
float:left;
line-height:68px;
}
#thumbnail
{
width:188px;
height:160px;
background:#FF0000;
border:#FF0000 solid 2px;
border-bottom-radius:5px;
margin-left:22px;
margin-top:20px;
float:left;

}
#thumbimg
{
width:185px;
height:120px;
position:relative;
overflow:hidden;
transition: 0.2s;
}
#thumbtitile
{
height:38px;
border-radius:5px;
font-size:12px;
line-height:12px;
font-weight:bold;
color:#FFFFFF;
}

/************************************************************************************
MEDIA QUERIES
*************************************************************************************/
/* for 980px or less */
@media screen and (max-width: 980px) {
	
	#pagewrap {
		width: 100%;
	}
	#content {
		width: 25%;
		padding: 1% 1%;
	}
	#middle {
		width: 65%;
		padding: 1% 4%;
		margin: 0px 0px 5px 5px;
		float: right;
	}
	
	#sidebar {
		clear: both;
		padding: 1% 4%;
		width: auto;
		float: none;
	}

	#header, #footer {
		padding: 1% 4%;
	}
	
}

/* for 700px or less */
@media screen and (max-width: 800px) {
#drp
{
padding-left:0px;
float:right;
}
#adt
{
display:none;

}

}
@media screen and (max-width: 600px) {
#adt
{
display:none;
z-index:1000;


}
#drp
{
padding-left:0px;
z-index:1000;
float:right;
padding-right:0px;
}

	#content {
		width: auto;
		float: none;
	}
	
	#middle {
		width: auto;
		float: none;
		margin-left: 0px;
	}
	
	#sidebar {
		width: auto;
		float: none;
	}
	  
	  #assignment
       {
	   height:150px;
	   }
	   #due
	   {
	   font-size:2.0em;
	  
	   }
	   #assigntitile
	   {
	   font-size:12px;
	   }
	  
}

/* for 480px or less */
@media screen and (max-width: 480px) {
#drp
{
display:none;
}
#adt
{
display:block;
float:none;
text-align:center;
width:100%;
}
#prof
{
width:100%;
}
	#header {
		height: auto;
	}
	h1 {
		font-size: 2em;
	}
	
	
	#content {
		
		float: none;
		width:100%;
		margin-left:0px;
		margin-top:25px;
	}
	
	#middle {
		width:100%;
		float: none;
		margin:0px;
	}
	#sidebar {
		display: none;
	}
	#footer {
	width:100%;
	}
	#logo
	{
	margin-left:5px;
	float:none;
	}
	#subjtitile{
	font-size:12px;
	line-height:12px;	
	}
	
#ficon
{
width:100%;
}
	
	#gratitile
{
width:60px;
font-size:14px;

}
#grdm
{
display:none;
}
	.counts
	{
	display:none;
	}
	 #maingrade
{
margin-left:0px;
}

}


#content {
	background: #FFFFFF;
}
#sidebar {
	background:#FFFFFF;
}
#middle
{
background:#FFFFFF;
}
#header, #content, #middle, #sidebar {
	margin-bottom: 5px;

}
 #content, #middle, #sidebar, #footer {
	border: solid 1px #ccc;
}
 #header
 {
 border-bottom: solid 1px #333333;
 }