/* Color Scheme:
Beige Page Background      #fff8e6	R255 G248 B230  Video #fff7e4
Darker Beige / Background  #d4be8d	R212 G190 B141
Dashboard Container        #feefc9  R254 G239 B201
Accent Blue                #01559a	R1 G85 B154
Lighter Blue               #0289c5	R2 G137 B197
Accent Orange              #ffc900  R255 G201 B0
Darker Orange Pumpkin      #ffa31b  R255 G163 B27
Rich Brown                 #7c5227	R124 G82 B39
Hover Green                #6fa14c	R111 G161 B76
Google Map Background      #e9e5dc  R233 G229 B220
Brain Color                #a5946e  R165 G148 B110
Powerpoint Yellow Gold              R255 G202 B8   
*/

@charset "utf-8";

/* Using Adam Kaplan's Grid Structure - Nice! */
*, *:before, *:after {-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}

body {font-family: Verb Regular, Verdana, Arial, Helvetica, sans-serif;
	  font-size: 80%; font-weight: normal; background: transparent; margin: 0; padding: 0; color: #000;}  /*Background was #d4be8d*/
h1,h2 {color: #7c5227; font-weight: bold; margin: 6px auto 12px;}
h1,h4 {font-size: 1.5em;}
h4 {color:#01559a; font-weight: 700;}
h5 {font-size: 1.25em;}
p {margin:.25em; padding: 2px; line-height: 16px; /*background-color: rgba(255, 248, 230, .5);*/}
i {margin-right: 6px;}

/* Small/mobile screens are the default */
html { font-size: 1.0em; /*background: url('../images/basetiles_500x500.png') no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;*/}
.column {float: none; padding-left: .25rem; padding-right: .25rem;}
.column.full { width: 100%;}
.column.three-fourths { width: 100%;}
.column.two-thirds { width: 100%;}
.column.half { width: 100%;}
.column.third { width: 100%;}
.column.fourth { width: 100%;}
.column.flow-opposite { float: none;}

.clearfix:before, .clearfix:after {content: " "; display: table;}  /*Use table (not block) to avoid Firefix issues*/
.clearfix:after {clear: both;}
.clearfix {zoom: 1;}  /* Zoom:1 is some sort of bizzaro IE thang related to clearing floats */

.container,.dashboardcontainer {margin: 0 auto; max-width: 72rem; width: 100%; min-width: 300px; background: #fff8e6;} /* url('../images/basetiles_500x500.png'); background-size:cover*/
.dashboardcontainer {background: transparent;}  /*{background: url('../images/basetiles_500x500.png'); background-size:cover;}*/

#headwrap {width: 100%; position: fixed;}
.header{width: 100%; height:40px; background: #000; border-bottom: solid 0px #7c5227;}  /*Was 5px for other pages. Makes video player top too big*/
/*.header#logo {width: 50%; background: #000 url('../images/essaysuite_299x63.png') no-repeat; background-size:contain; float:left;}*/
.header#logo {width: 50%; background: #000 url('../images/essaysuite_133x40.png') no-repeat; background-size:contain; float:left;}
.header#admaplogo {width: 50%; background: #000 url('../images/admissionmap_257x40.png') no-repeat; background-size:contain; float:left;}
.header#menu {width: 50%; float:right;}   /*For mobile, use 50/50. For larger, use 33.3/66.7.*/

	nav {width: 80%; height: 28px; font-size: .45rem; line-height: 28px; margin: 0 auto; position: absolute; left:10%; top:40px;}
	nav #innernav {background-color: #7c5227; display: none;}
	nav #innernav:last-child {border-radius: 0 0 24px 24px;}    /*Round off last menu item*/
	nav #innernav a {display:block;	color: #eee; text-decoration: none; text-align: center; font-size: 2em; border-bottom: solid 1px #aaa;}  /* display:block is important! */
	nav #innernav a:last-child {border-radius: 0 0 24px 24px;}
	nav #innernav a:hover {background-color: #6fa14c;}
	nav #innernav a:hover:last-child {border-radius: 0 0 24px 24px;}	
	#hamburger {display: block;	margin-right:1em; margin-top:5px; float:right;}

/* Dashboard (Home) */

#homesidebar {margin-top: 12px;}
#homemain p, #homesidebar p{line-height: 1.25em; /*box-shadow: 0px 0px 15px #d4be8d inset;*/}
#introhead {max-width: 100%; min-width: 320px; margin: 12px auto;}

.icon {width:64px; height:64px;}
.icon {display:block; margin-right: 6px; float: left;}

#guide.icon {background:url("../images/guideicon_64x64.png");} 
#guide.icon:hover {background:url("../images/guideicon_hover_64x64.png");} 
#tip.icon {background:url("../images/tipicon_64x64.png");} 
#tip.icon:hover {background:url("../images/tipicon_hover_64x64.png");} 
#gloss.icon {background:url("../images/glossicon_64x64.png");} 
#gloss.icon:hover {background:url("../images/glossicon_hover_64x64.png");} 
#organizer.icon {background:url("../images/organizericon_64x64.png");} 
#organizer.icon:hover {background:url("../images/organizericon_hover_64x64.png");} 

.blurb {width: 100%; margin-top: 1% auto;}
.blurb h1, #homesidebar h1{text-align: left; margin-bottom: 0;} 
.blurb a {color:#7c5227; text-decoration: none;}
.blurb a:hover {color:#6fa14c; text-decoration: underline;}

.blueline {display:block; background-image: url("../images/blueline2_220x30.png"); margin: 20px auto; max-width: 100%; height: 30px; width: 220px;}

/* How-To Guide */

#mainbody {position:relative; top:46px;}  /*Was 40px*/

/* *** Original for iSpring *** #videoWrapper {position: relative; top: -6px; padding-bottom: 48.667%;	padding-top: 0px; height: 0;} /* 56.25% bot 25px top padding for 16:9 */
.iWrapper {position: relative; top: -6px; padding-bottom: 48.667%;	padding-top: 0px; height: 0; overflow: hidden; max-width: 100%; height: auto;} /* 56.25% bot 25px top padding for 16:9 */
.iWrapper iframe, .iWrapper-container object, .iWrapper-container embed {position: absolute; top: 0; left: 0; width: 100%; height: 100%;} /* 83% height fixes extra space above and iframe but adds it below (was 100%) */

#videoWrapper {position: relative; top: -6px; padding-bottom: 56.25%;	padding-top: 25px; height: 0; overflow: hidden; max-width: 100%; height: auto;} /* 56.25% bot 25px top padding for 16:9 */
#videoWrapper iframe, #videoWrapper-container object, #videoWrapper-container embed {position: absolute; top: 0; left: 0; width: 100%; height: 100%;} /* 83% height fixes extra space above and iframe but adds it below (was 100%) */


/*.embed-container {position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; height: auto;}
.embed-container iframe, .embed-container object, .embed-container embed {position: absolute; top: 0; left: 0; width: 100%; height: 100%;} */


#pagetitle h1 {line-height: 24px; font-size: 1rem; padding-right: 3%; float:left;}
#selectandrate, #moduleselector {float:left;}
#moduleselector select {background-color: #d4be8d;}
#mcaption {display: block; margin: 0px 12px 0 12px; font-size: .6rem; height: 16px; line-height: 16px; float:none;}

#rating {float:right;}
#ratestar {width: 140px; height: 24px; background-color: #d4be8d; border: solid 1px #7c5227; border-radius:12px; line-height: 29px; text-align: center; float:left;}
#ratestar a {color: #7c5227; font-weight: bold; font-size: 1.8em; text-decoration: none; margin:0 2px 0 2px;}
#ratestar a:hover {color: #6fa14c;}
#ratecaption {display: none; margin: 9px 9px 0 12px; font-size: .6rem; line-height: 16px;}

#modulenotes {margin: 9px auto; max-width: 100%; line-height: 1.2rem;}
#modulenotes .boldbrowntext {color: #7c5227; font-weight: bold;}
#modulenotes a {color: #01559a; text-decoration: none}
#modulenotes a:hover {color: #6fa14c; text-decoration: underline;}

.htdownload {float:left; margin-top:12px;}
.htdownload h3, .htdownload a {font-size: .8rem; color: #7c5227; text-decoration: none;}
.htdownload h3 {font-weight: bold;}
.htdownload a {color: #01559a; display: block; line-height: 1rem; margin-bottom: .4rem;}
.htdownload a:hover {color: #6fa14c; text-decoration: underline;}
.htdownload p {font-size: .6rem; font-style: italic; display: block; text-align: left;}

.hticon {display: block; width:64px; height:64px; float:left; margin: 4px 12px 1px 0;}
#pdfdownload {background: url('../images/pdf_64x64.png') no-repeat;}
#pdfdownload:hover {background: url('../images/pdf_hover_64x64.png') no-repeat;}
#mp3download {background: url('../images/mp3_64x64.png') no-repeat;}
#mp3download:hover {background: url('../images/mp3_hover_64x64.png') no-repeat;}
#weblinks {background: url('../images/web_64x64.png') no-repeat; margin-bottom: 18px;}
#weblinks:hover {background: url('../images/web_hover_64x64.png') no-repeat;}

	
 /***********/

/* Tips */

.ticon {width:48px; height:48px;}
.ticon {display:block; margin-right: 6px; float: left;}

 /***********/

#sidebar, #content {min-width:200px; padding-bottom: 2%;}
#footer {height: 66px; padding: 0 6px; background: black; border-top:solid 5px #7c5227; border-bottom:solid 5px black; position: relative; line-height:100%;} 
#footer #logo {margin: 10px; height:40px; width: 40px; background-image: url("../images/CACentral_AlternateLogo_NoText_DarkBackground_Transparent_40x40.png"); background-repeat: no-repeat; float:left;}
#footer h6{font-size: .6rem; color: #d4be8d; padding: 6px; margin: 4px 0 4px 6px;}
#stepnum1, #stepnum2, #stepnum3, #stepnum4 {width:100%; margin: 4% auto; padding: 4%; overflow: auto; background-color: #fff; border: solid 3px #7c5227; border-radius: 12px 0 0 12px;}
#stepnum2, #stepnum3 {display: none;}  /*Reveal step #2 and #3 sequentially*/
#stepnum3 {margin: 0 auto;}            /*When on small screen, remove margin*/
#stepnum4 {border-radius: 12px;}
.stepnum.box {margin: 2% 0; padding: 2%;}

#listbox, #previewbox {padding: 4%; background-color: #fff; border: dashed 1px #7c5227; border-right: none; border-radius: 12px 0 0 12px;}
.nobullet{list-style-type: none;}
#listbox a{color: black; text-decoration: none; line-height: 1.2rem;}
#listbox a:hover{color: #6fa14c; margin-left: 6px;}

/*Hide on mobile*/
#bluesquiggle {display: block; height:217px; margin:0 auto; margin-top: 4%; background: url('../images/bluesquiggle_200x217.png') no-repeat; background-size:contain;}
#scroll {display: none; max-width: 480px; height: 58px; margin:2% auto; background: url('../images/scroll_480x58.png') no-repeat; background-size:contain;}
#lightbulb {display: none; max-width: 300px; height: 414px; margin:2% auto; background: url('../images/lightbulb_386x500.png') no-repeat; background-size:contain;}

#preview {margin: 0 auto; padding: 12px; overflow:auto; background-color: #fff; border: solid 3px #7c5227; border-radius: 12px 0 0 12px;}
#preview p{line-height: 1.5rem;}

/*Select/Cancel Button Group*/
#buttonpad{display: none; position: relative; width: 80%; min-width: 240px; max-width: 360px; height: 140px; margin:3% auto; padding: 1%;}
#select, #cancel {position: absolute; top:0; width: 110px; height: 110px;}
#select{left: 0; background: url('../images/orangecheck_107x100.png') no-repeat;}
#cancel{right: 0; background: url('../images/greenx_100x100.png') no-repeat;}
#selectbutton, #cancelbutton {position: absolute; bottom: 6px; width:110px; height:24px; border-radius:24px; line-height: 25px; text-align: center; background-color: #01559a; color:#eee; text-decoration:none;} 
#selectbutton {left: 0;} 
#cancelbutton {right: 0;}
a#selectbutton:hover, a#cancelbutton:hover, #selectbutton a:active, #selectbutton.nav a:focus {background: #6fa14c; color: #FFF;}
a#select:hover, a#cancel:hover {transform: scale(1.2,1.2); -ms-transform: scale(1.2,1.2); /* IE 9 */ -webkit-transform: scale(1.2,1.2); /* Safari and Chrome */} 

 /*===================== GlossBody =====================*/


#gbcontent {width:100%; height: 100%; overflow: hidden;}
.essaytitle {margin-top: 12px; text-align: center}

#leftgloss,#rightgloss {height:10px;}
#stepnum4 { height: 80%; overflow: auto;}

#essaybody {xwidth: 100%;}
#essaybody .gla {background-color: #e6ffe6; border-bottom: 1.5px dashed #6fa14c;}
#essaybody .glb {background-color: #daecff; border-bottom: 1.5px dashed #0289c5;}
#essaybody i {margin-right: 0px; font-style: italic;}


.return, .topjump {width:100px; margin:0 auto; margin-bottom: 16px; height:24px; border-radius:24px; line-height: 25px; text-align: center; background-color: #01559a; float:left;}
.return a, .topjump a {color:#eee; text-decoration:none;} 
.return:hover, .topjump:hover {background: #6fa14c; color: #FFF;}
.return {float: right;}

#radio1, #radio2, #sticky {margin-top: 14px; margin-bottom: 12px; float:none;}
#return {color: #01559a; text-decoration: none; margin-top: 14px; float:right;}

/*Tooltip Styling*/

.ui-tooltip, .arrow:after {background: black; border: 2px solid white;}
.ui-tooltip {padding: 10px 20px; color: white; border-radius: 20px; box-shadow: 0 0 7px black; line-height: 1.25em; max-height: 300px;}
.custom-tooltip-styling-blue, .custom-tooltip-styling-green{overflow:auto;}
.custom-tooltip-styling-blue {background-color: rgba(1,85,154,.95);} /*blueish*/
.custom-tooltip-styling-green {background-color: rgba(111,161,76,.95);}  /*greenish*/
.custom-tooltip-styling-gray {background-color: rgba(128,128,128,.75);} /*grayish*/

 /*===================== Media Queries =====================*/

/* Small-Medium screens (480px) */
/*@media (min-width: 32rem) {
#mcaptionshort {display: block;}
#ratecaptionshort {display: block;} 
#mcaption {display: none;}
#ratecaption {display: none;} 
}*/


/* Medium screens (640px) */
@media (min-width: 42rem) {
html { font-size: 1.10em; }
p {margin:1em; padding: 6px;}

.column {float: left; padding-left: 1rem; padding-right: 1rem;}
.column.full { width: 100%;}
.column.three-fourths { width: 74.95%;}
.column.two-thirds { width: 66.7%;}
.column.half { width: 50%;}
.column.third { width: 33.3%;}
.column.fourth { width: 24.95%;}
.column.flow-opposite { float: right;}

.header {height:40px;}
.header#logo {width: 33.3%;}
.header#admaplogo {width: 33.3%;}
.header#menu {width: 66.7%;}   /*For mobile, use 50/50. For larger, use 33.3/66.7.*/

	nav {width: 100%; font-size: .35rem; line-height: 40px; margin: 0 auto; position: static;}
	nav #innernav {background-color: #000; display: block;}
	nav #innernav:last-child {border-radius: 0;}
	nav #innernav a {width:20%; color: #d4be8d; text-decoration: none; text-align: center; font-size: 2em; border-bottom: none; float:left;}
	nav #innernav a:last-child {border-radius: 0;}
	nav #innernav a:hover {background-color: #6fa14c;}
	nav #innernav a:hover:last-child {border-radius: 0;}
	nav #innernav #active {color: #fff8e6; font-weight: 500;}
	#hamburger {display: none;}

#stepnum3 {margin: 4% auto;}
#bluesquiggle, #lightbulb {display: block;}

#headwrap {position: static;}
.icon {width:128px; height:128px; margin: 0 auto; float:none; }
#guide.icon {background:url("../images/guideicon_128x128.png");} 
#guide.icon:hover {background:url("../images/guideicon_hover_128x128.png");} 
#tip.icon {background:url("../images/tipicon_128x128.png");} 
#tip.icon:hover {background:url("../images/tipicon_hover_128x128.png");} 
#gloss.icon {background:url("../images/glossicon_128x128.png");} 
#gloss.icon:hover {background:url("../images/glossicon_hover_128x128.png");} 
#organizer.icon {background:url("../images/organizericon_128x128.png");} 
#organizer.icon:hover {background:url("../images/organizericon_hover_128x128.png");} 
.blurb h1, #homesidebar h1{text-align: center; margin-bottom: 12px;} 

.ticon {width:48px; height:48px;}

#mainbody {position:static; margin-top:6px;}
#modulenotes {margin: 9px auto; margin-bottom: 18px; max-width: 80%; line-height: 1.2rem;}

#essaybody {width: 80%; max-width: 38rem; margin: 0 auto;}

}
 
/* Large screens (1024px) */
@media (min-width: 64rem) {
html { font-size: 1em;}
.header {height:40px;}
nav {font-size: .5rem; position: static; line-height: 40px;}

}



}
/* CSS Document */
/*
.star-rating,
.star-rating a:hover,
.star-rating a:active,
.star-rating .current-rating{
background: url(images/star.gif) left -1000px repeat-x;
}
.star-rating{
position:relative;
width:125px;
height:25px;
overflow:hidden;
list-style:none;
margin:0;
padding:0;
background-position: left top;
}
.star-rating li{
display: inline;
}
.star-rating a,
.star-rating .current-rating{
position:absolute;
top:0;
left:0;
text-indent:-1000em;
height:25px;
line-height:25px;
outline:none;
overflow:hidden;
border: none;
}
.star-rating a:hover,
.star-rating a:active{
background-position: left bottom;
}
.star-rating a.one-star{
width:20%;
z-index:6;
}
.star-rating a.two-stars{
width:40%;
z-index:5;
}
.star-rating a.three-stars{
width:60%;
z-index:4;
}
.star-rating a.four-stars{
width:80%;
z-index:3;
}
.star-rating a.five-stars{
width:100%;
z-index:2;
}
.star-rating .current-rating{
z-index:1;
background-position: left center;
}
*/