@charset "utf-8";
/* CSS Document */

/*
   /
  /_\
 |___\
 \___|
  \ /
   /		Unless otherwise noted, all code created for the MSOE Center for BioMolecular Modeling
  /_\		Copyright
 |___\		For questions or comments, contact:
 \___|
  \ /		Mark Hoelzer
   /		hoelzer@msoe.edu
  /_\
 |___\
 \___|
  \ /
   /		
   
*/


/* overall styles */

html{
	height:100%;
	width:100%;
	padding:0px;
	margin:0px;
	overflow:hidden;
}
body{
	height:100%;
	overflow:hidden;
	width:100%;
	padding:0px;
	margin:0px;
	font-family: Calibri, Arial, sans-serif;
	font-weight:normal;
	font-size: 90%;
	line-height: 140%;
	background-color:#f5f4f3;
	margin:0px;
	overflow:hidden;
}	

#contentMain{
	height:500px;
	width:1000px;
}


/* header */
#headerMain{
	width:100%;
	height:70px;
	background-image:url(images/templateImages/exportHeaderBackground1.png);
	background-repeate:repeat-x;
}
#headerInner{
	width: 1000px;
	overflow:hidden;
	height:70px;
	margin:auto;
}
#headerInner img{
	max-height:60px;
	max-width:100%;
}
#headerCBMLogo{
	max-height:60px;
	padding:5px;
	float:left;
}
#headerCBMLogo{
	max-height:60px;
	padding:5px;
	float:left;
}
#headerGuestLogo{
	max-height:60px;
	padding:5px;
	float:right;
}
#headerTitle{
	margin:auto;
	font-family:"Times New Roman", Times, serif;
	text-align:center;
	font-weight:bold;
	font-size:20px;
	padding:25px 20px 15px 20px;
}


/* Left pannel */
#leftSidePanel{
	height:500px;
	width:200px;
	margin:0px;
	padding:0px;
	float:left;
}
#contents{
	width:190px;
	margin:10px 0px 10px 10px;
	padding:0px;
}
#contentsTitle{
	width:170px;
	height:12px;
	font-size:12px;
	font-weight:bold;
	padding:10px;
	margin:0px;
	text-align:center;
	border-radius: 10px 10px 0px 0px; 
	-moz-border-radius: 10px 10px 0px 0px; 
	-webkit-border-radius: 10px 10px 0px 0px; 
}
#contentsContent{
	width:170px;
	margin:0px 0px 10px 0px;
	padding:10px;
	height:180px;
	border-radius: 0px 0px 10px 10px; 
	-moz-border-radius: 0px 0px 10px 10px; 
	-webkit-border-radius: 0px 0px 10px 10px; 
	overflow-y:scroll;
	background-image:url(images/templateImages/sidebarBackground.jpg);
	background-repeat:repeat-y;
}
#contributors{
	width:190px;
	margin:10px 0px 10px 10px;
	padding:0px;
}
#contributorsTitle{
	width:170px;
	height:12px;
	font-size:12px;
	font-weight:bold;
	padding:10px;
	margin:0px;
	text-align:center;
	border-radius: 10px 10px 0px 0px; 
	-moz-border-radius: 10px 10px 0px 0px; 
	-webkit-border-radius: 10px 10px 0px 0px; 
}
#contributorsContent{
	width:170px;
	margin:0px 0px 10px 0px;
	padding:10px;
	height:180px;
	border-radius: 0px 0px 10px 10px; 
	-moz-border-radius: 0px 0px 10px 10px; 
	-webkit-border-radius: 0px 0px 10px 10px; 
	overflow-y:scroll;
	background-image:url(images/templateImages/sidebarBackground.jpg);
	background-repeat:repeat-y;
}
#creatorVersion{
	font-size:11px; 
	color:#cccccc; 
	line-height:12px;
	text-align:center;
	margin:auto;
}
#contributorSpacer{	
	width:150px; 
	background-color:#000000; 
	height:2px; 
	margin:10px 0px 10px 0px;
}
.contentTitleLink{
	color:#3A9BDD;
	text-decoration:none;
	font-weight:bold;
	font-size:12px;
}
.contentTitleLink:hover{
	color:#7ABFED;
	text-decoration:underline;
}
.contentSubtitleLink{
	color:#3A9BDD;
	text-decoration:none;
	font-weight:bold;
	font-size:12px;
	margin:0px 0px 0px 15px;
}
.contentSubtitleLink:hover{
	color:#7ABFED;
	text-decoration:underline;
}




/* central tutorial */
#tutorial{
	width:385px;
	height:470px;
	margin:10px 0px 10px 10px;
	padding:0px;
	background-color:#ffffff;
	float:left;
	-moz-border-radius: 10px;
	border-radius: 10px;
}
#tutorialTitle{
	width:365px;
	height:12px;
	font-size:12px;
	font-weight:bold;
	padding:10px;
	margin:0px;
	text-align:center;
	border-radius: 10px 10px 0px 0px; 
	-moz-border-radius: 10px 10px 0px 0px; 
	-webkit-border-radius: 10px 10px 0px 0px; 
}
#tutorialContent{
	width:365px;
	margin:0px 0px 10px 0px;
	padding:10px;
	height:423px;
	border-radius: 0px 0px 10px 10px; 
	-moz-border-radius: 0px 0px 10px 10px; 
	-webkit-border-radius: 0px 0px 10px 10px; 
	background-color:#ffffff;
	overflow-y:scroll;
}


/* jmol */
#jmol{
	height:480px;
	width:385px;
	margin:10px;
	float:left;
	-moz-border-radius: 10px;
	border-radius: 10px;
}
#jmolTitle{
	width:365px;
	height:12px;
	font-size:12px;
	font-weight:bold;
	padding:10px;
	margin:0px;
	text-align:center;
	border-radius: 10px 10px 0px 0px; 
	-moz-border-radius: 10px 10px 0px 0px; 
	-webkit-border-radius: 10px 10px 0px 0px; 
}
.jmolApplet{
	height:340px;
	width:385px;
}
.jmolCaption{
	width:96%;
	height:34px;
	border-top:2px solid #666;
	padding:2px 2% 2px 2%;
	overflow-y:scroll;
	background-color:#FFFFFF;
	text-align:center;
	color:#666666;
	font-size:12px;
	line-height: 110%; 
}


/* Content Styles */
h1{
	font-size:14px;
	font-weight:bold;
	padding:5px;
	margin:10px 0px 20px 0px;
	text-align:center;
	background-image:url(images/templateImages/exportHeaderBackground2.png)
	background-repeate:repeat-x;
	font-family: Calibri, Arial, sans-serif;
}
h2{
	font-size:12px;
	font-weight:bold;
	padding:5px;
	margin:10px 0px 20px 0px;
	text-align:left;
	color:#000000;
}
.jmolButton{
	height:16px;
	padding:5px;
	margin:10px 0px 20px 0px;
	background-color:#ececec;
	border:1px solid #e5e5e5;
	color:#999999;
	text-align:left;
	font-weight:bold;
	font-size:12px;
	border-radius:8px;
	-moz-border-radius:8px;
	border-radius:8px;
	-moz-border-radius:8px;
	display:inline-block;
}
.jmolButton:hover{
	cursor:pointer;
	color:#333333;
}
.image{
	max-width:90%;
	margin:10px auto 20px auto;
	display:block;
	padding:5px;
	text-align:center;
	margin:auto;
}
.imageCaption{
	width:100%;
	font-size:12px;
	text-align:center;
	color:#999999;
	line-height:12px;
	margin:10px 0px 20px 0px;
}
.video{
	width:420px;
	height:315px;
	margin:10px 0px 10px 0px;
	padding:5px;
	text-align:center;
	margin:auto;
}
.videoCaption{
	width:90%;
	text-align:center;
	font-size:12px;
	color:#999999;
	line-height:12px;
	margin:0px 0px 20px 0px;
}
.question{
	margin:10px 0px 20px 0px;
	padding:0px 0px 0px 25px;
	background-image:url(images/templateImages/questionMark.jpg);
	background-position:top left;
	background-repeat:no-repeat;
}
.shortAnswer{
	width:90%;
	resize:none;
}
.multipleChoiceAnswer{
	padding:5px;
	margin:0px;
}
#printQuestions{
	min-height:16px;
	padding:5px;
	margin:30px 0px 50px 0px;
	background-color:#ececec;
	border:1px solid #e5e5e5;
	color:#999999;
	text-align:center;
	font-weight:bold;
	font-size:12px;
	border-radius:8px;
	-moz-border-radius:8px;
	border-radius:8px;
	-moz-border-radius:8px;
	display:block;
}
#printQuestions:hover{
	cursor:pointer;
	color:#333333;
}


/* Customized Styles (made using the Jmol Tutorial Creator Tool) */
#headerMain{ 
 	background-color:#db281b; 
	color:#000000; 
}
#contentsTitle{ 
 	background-color:#ebd6b7; 
	color:#000000; 
}
#contributorsTitle{ 
 	background-color:#ebd6b7; 
	color:#000000; 
}
#tutorialTitle{ 
 	background-color:#ebd6b7; 
	color:#000000; 
}
#jmolTitle{ 
 	background-color:#ebd6b7; 
	color:#000000; 
}
h1{ 
 	background-color:#db281b; 
	color:#000000; 
} 
h2{ 
 	border-bottom:2px solid #ebd6b7; 
} 
.image{ 
  	border:1px solid #ebd6b7; 
} 
.video{ 
 	border:1px solid #ebd6b7; 
}