/* 13-07_BWG */

/*Course Theme Colors*/
@courseLight: #EBF1FA ;
@courseDark: #709DBC;
@courseFocus: #FFAA54 ;
@courseCream: #F5D3AC ;

/*Background shading*/
.fade { background-image: url(http://jukebox.esc13.net/spaap_common/EpsilenHeaderFade.png); background-size: contain; background-position: bottom; background-repeat: repeat-x; }
.fadeRight { background-image: url(http://jukebox.esc13.net/spaap_common/EpsilenHeaderFadeRight.png); background-size: contain; background-position: top right; background-repeat: repeat-y; }

/*Text Area Formatting*/
.normal {
				vertical-align: top;
				-webkit-transition: height 0.2s;
				-moz-transition: height 0.2s;
				transition: height 0.2s;
				margin-bottom: 15px;
			}

/* Video player and playlist styling */
#spaap_brightcove { float: right; width: 360px; margin: 2px 5px 15px 10px; }
#spaap_videoIntro { width: 360px; margin: auto; margin-bottom: 15px; }
#spaap_video { width: 360px; margin: 2px 5px 15px 10px; float: right; }
#spaap_videoFull { width: 700px; margin: auto; margin-top: 10px; margin-bottom: 15px; }
#spaap_playlist { width: 358px; margin: 0px; padding: 0px; background-color: @courseLight; overflow: auto; list-style-type: none; border: 1px solid @courseDark; }
#spaap_playlistFull { width: 698px; margin: 0 0 25px; padding: 0px; background-color: @courseLight; overflow: auto; list-style-type: none; border: 1px solid @courseDark; }
.spaap_media { padding: 0px; border-top: 1px solid @courseDark; }
.spaap_media p { padding: 0px; margin: 0px; }
.spaap_media:hover { background-color: @courseFocus; cursor: pointer; cursor: hand; }
.current { background-color: @courseDark; }
#spaap_disclaimer p { font-size: 10px; color:#999; }
#spaap_playlist li p { padding: 0px 2px; font-size: 12px; }
#spaap_filmDate { color: white; z-index: 1000; font-weight: bold; text-align: right; position: relative; top: 20px; right: 10px; }
.spaap_videoTime { float: right; }
.captionToggle { float: right; display: none; }
.vjs-subtitles-button { display: none; }

/* Accordion */
#accordion { width: 340px; margin-left: 10px; }
#accordionFull { width: 700px; margin: auto; }
.accordionButton { width: 326px; padding: 2px; padding-left: 10px; font-size: 12px; font-weight: bold; text-align: left; float: left; background: @courseLight; cursor: pointer; .fade; border: 1px solid @courseDark; border-bottom: 0px; border-radius: 2px; }
#accordionFull .accordionButton { width: 686px; }
div.accordionButton > span.icon { position: relative; top: 3px; margin-left: -10px; background-image:url(http://code.jquery.com/ui/1.9.2/themes/base/images/ui-icons_454545_256x240.png); width: 16px; height: 16px; background-position: -32px -16px; display: inline-block; }
div.on > span.icon { background-position: -64px -16px; }
.accordionContent {	width: 320px; padding: 5px 10px; float: left; background: #EBF1FA; border-top: 1px solid @courseDark; display: none; overflow: hidden; border-radius: 0px 0px 2px 2px; }
#accordionFull .accordionContent { width: 680px; }
.on { background: @courseDark; .fade; border-radius: 2px 2px 0px 0px; }
.over { background: @courseDark; .fade; }
.Last { margin-bottom: 15px; border-bottom: 1px solid @courseDark; }
.Last.on { margin-bottom: 0px; }

/* Accordion Horizontal*/
#accordionH { margin: 20px auto; overflow: hidden; height: 300px; width: 700px; clear: both; }
.accordionHButton { width: 48px; padding: 2px;  font-size: 12px; font-weight: bold; text-align: left; float: left; background: @courseLight; cursor: pointer; .fadeRight; border: 1px solid @courseDark; border-right: 0px; border-radius: 5px; height: 294px; }
.accordionHContent {	width: 0px; height: 296px; padding: 4px 0px 0px 0px; float: left; background: @courseLight; border-radius: 0px 0px 2px 2px; transition:width 0.5s; -moz-transition:width 0.5s; -webkit-transition:width 0.5s; -o-transition:width 0.5s; opacity: 0; overflow: hidden; }
.accordionHContentMargin { padding: 5px;}
.onHButton { background: @courseDark; .fadeRight; border-radius: 5px; border: 1px solid @courseDark; }
.overHButton {background: @courseDark; .fadeRight; }
.accordionHButton span.rotate { display: block; width: 200px; position: relative; top: 90px; left: -80px; -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg);   }
.accordionHButton span.rotateIE { font-size: 16px; font-weight: 100; display: block; width: 200px; position: relative; top: 100px; left: -85px; 
-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=3.061616997868383e-16, M12=1, M21=-1, M22=3.061616997868383e-16, SizingMethod='auto expand')";   
margin-left: 90px; margin-top: -79px; }

/* Drag and Drop */
.draggable p, .droppable p { float: left; margin: 4px;}
#dragDrop { width: 700px; min-height: 400px; margin: auto; display: block; border-radius: 5px; background-color: #FCFCFC; border: 1px solid @courseDark; clear: both; }
#intro { position: relative; width: 665px; min-height: 50px; background-color: @courseLight; padding: 5px 15px 5px 20px; border-bottom: 1px solid @courseDark; border-radius: 5px; }
#container { position: relative; width: 700px; height: 100%; float: left; }
#dragTray { width: 340px; height: 100%; padding: 10px 0px; float: left; font-size: 12px;}
#dropTray { width: 350px; float: right; padding-left: 10px; font-size: 12px;}
.draggable { width: 280px; height: 120px; float: left; margin: 2px; border: 1px solid @courseDark; background-color: @courseLight; border-radius: 10px;}
div.draggable p { width: 95%; line-height: 18px; }
.draggable:hover { cursor: move; background-color: @courseFocus; }
.droppable { width: 285px; min-height: 160px; padding: 0.5em; float: left; margin: 10px; border: 1px solid white; background-color: @courseDark; border-radius: 5px; }
p.dropHeading { width: 100%; background-color: #FFFFFF; position: relative; top: -15px; left: -9px; text-align: center; border-radius: 3px 3px 0px 0px; }
.dropped { width: 280px; height: 120px; float: right; margin: 1px; border: 1px solid white; background-color: @courseLight; text-align: center; border-radius: 10px; }
/*.droppable .dropped { clear: both; }*/
.droppedCorrect { background-image: url(../../HTML_images/Accept-icon.png); background-position: bottom right; background-repeat: no-repeat; }
.droppedWrong { background-image: url(../../HTML_images/Deny-icon.png); background-position: bottom right; background-repeat: no-repeat; cursor: pointer; }
.droppableHover { border: 1px solid @courseFocus; }
#reset { width: 100%; margin: auto; padding: 4px 0px; background-color: @courseLight; position: relative; clear: left; text-align: center; font-weight: bold; border-top: 1px solid @courseDark; border-radius: 5px; /*background-image: url(../../HTML_images/Reset-icon.png); background-repeat: no-repeat; background-position: middle left;*/ }
#reset:hover { cursor: pointer; background-color: @courseFocus; }
#dragHelp_icon { position: absolute; bottom: 2px; right: 5px; width: 28px; height: 28px; background-image: url(../../HTML_images/dragHelp_icon.png); }
#dragHelp { position: relative; max-width: 300px; padding: 20px 30px; background-color: white; border: 4px @courseDark solid; top: 25%; left: 25%; cursor: default; border-radius: 10px; }
#dragHelpContain { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-image: url(../../HTML_images/50pct_trans.png); background-repeat: repeat; z-index: 10000; text-align: center; }
#dragHelpClose { position: absolute; bottom: 0; right: 5px; font-size: .8em; color: @courseFocus; }

/* Card Sort */
  #widget #sortable { list-style-type: none; margin: 0; padding: 0; width: 650px; float: left; cursor: move; border: 1px solid @courseDark; }
  #widget #sortable li { position: relative; margin: 0 3px 3px 3px; padding: 5px 5px 10px 10px; font-size: .8em; height: 65px; background-color: @courseLight; border-bottom: 1px solid @courseDark; }
  #widget #sortable li:hover { border-left: 5px solid @courseFocus; padding-left: 5px; }
  #widget #sortable li:last-child { border-bottom: 0; }
  #widget #sortable li:first-child { margin-top: 3px; }
  #widget #sortable li select { float: right; margin: 15px 0 0 5px; }
  #widget #sortable li span { position: absolute; margin-left: -1.3em; }
  #widget .numberSection { list-style-type: none; float: left; margin-top: 0; padding: 0; }
  #widget .numberSection li { height: 83px; width: 30px; margin: 2px 0; text-align: center; }
  #widget .numberSection li:first-child { margin-top: 0; }
  
/* Card Match */

#cardMatchWidget th { border-right:none; border-left:none; border-top:none; }
#cardMatchWidget td { background-color:#fff; padding:5px; }  
#cardMatchWidget .quizFeedbackMsg { position: relative; font-size: 0.9em; margin-left: 0px; padding-left: 25px; line-height: 1.4em; }
#cardMatchWidget .textFieldColumn { border-right:none; }
#cardMatchWidget .textFieldColumn input { margin: 0px 8px 0px 5px; vertical-align: middle; }  
#cardMatchWidget .feedbackColumn { border-left:none; }
#cardMatchWidget .correctSmall { background-image: url(../../HTML_images/Accept-icon_20.png); background-repeat: no-repeat; background-position: left top; }
#cardMatchWidget .incorrectSmall { background-image: url(../../HTML_images/Deny-icon_20.png); background-repeat: no-repeat; background-position: left top; }

#cardMatchWidget #printButton { float:left; margin-left: 15px; }
#cardMatchWidget .matchButton { float: right; margin: 10px 15px 10px 0px; padding: 5px 15px; }
#cardMatchWidget #submitButton { margin-right: 22px; }

/* Entry Fields Table */
#entryFieldsTable { margin:0px; padding:0px; font-size:12px; }
entryFieldsTable { margin:0px; }
#entryFieldsTable td { background-color:#fff; padding: 2px;} 
#entryFieldsTable .heading { background-color:@courseLight; }
#entryFieldsTable .largeHeading { font-weight:bold; font-size:12px; } 

#entryFieldsTable #printButton { float:right; margin-right: 270px; padding: 5px 15px; }
#entryFieldsTable textarea { font-family: Arial, Helvetica, sans-serif; font-size:12px; vertical-align: top; resize: vertical; margin: 0px; text-align: center;}


.spaap_sm_table { overflow:auto; clear: both; margin:0px auto; width: 200px; text-align: left; cell-spacing: 0px; cellpadding: 2px; border: 1px gray solid; background-color: @courseLight; border-collapse: collapse; margin-top: 10px;}
.spaap_sm_tableTop{ padding:5px; }
.spaap_sm_table table { border-collapse:collapse;}
.spaap_sm_table td { padding: 5px; vertical-align: middle; border: 1px gray solid; }
.spaap_sm_table th { padding: 5px; text-align: center; }


/* Fill in the blanks  */
#fftb_container { width: 640px; margin: 0 auto; padding: 10px 20px 20px 20px; background-color: @courseLight; border: 1px solid @courseDark; border-radius: 20px; overflow: visible; font-size: 14px;} 
#fftb_container .dropDownChoices { background-color:#d1d1d1; }
#fftb_container #fftb_showAnswers { text-align: right; }
#fftb_container button { padding: 5px 15px; margin: 10px 15px 10px 0px; }
#fftb_container .greenText { color:#339966; }
#fftb_container .redText { color:#d90000; }
#fftb_container .correctGreenBorder { border: 3px solid #339966; }
#fftb_container .incorrectRedBorder { border: 3px solid #d90000; }
#fftb_container th { background-color:@courseDark; border: 1px solid #808080; }
#fftb_container td { padding: 5px; }
#fftb_container #printButton { float:left; padding: 5px 15px; margin-top:10px; }

/* Quiz Activity - OCCRRC course  */
  .quiz { width: 600px; margin: 20px auto; background-color: @courseLight; display: block; border: 1px solid @courseDark; border-radius: 20px; overflow: visible; }
  .quizText { margin: 15px 20px 10px 20px; font-weight: bold; }
  .quizRadio { padding: 0px 50px; }
  .quizFeedback { position: relative; font-size: 1.2em; margin-left: 25px; margin-top: 10px; padding-left: 45px; line-height: 1.4em; }
  .smallTxtFeedback { font-size:14px; margin-right:30px;}
  .quizRadio p { margin: auto; font-size: 1.2em; line-height: 1.6em; }
  .quizRadio input { margin-right: 10px; }
  .quiz .qqCheck { text-align: right; }
  .quiz .entryFieldCheck { text-align: right; }
  .quiz .pulldownCheck { text-align: right; }
  .quiz button { padding: 5px 15px; margin: 10px 15px 10px 0px; }
  .correct { background-image: url(../../HTML_images/Accept-icon.png); background-repeat: no-repeat; background-position: left top; }
  .incorrect { background-image: url(../../HTML_images/Deny-icon.png); background-repeat: no-repeat; background-position: left top; }
  .quiz textArea { margin-left: 10px; }
  .textArea { font-family: Arial, Helvetica, sans-serif; vertical-align: top; -webkit-transition: height 0.2s; -moz-transition: height 0.2s; transition: height 0.2s; resize: vertical; }
  .activityText { margin: 20px 15px; }
  .quiz .pulldownSection { padding: 0px 50px; }
  .quiz .dropDownChoices { background-color:#d1d1d1; }
  .quiz .greenText { color:#00CC33; }
  .quiz .redText { color:#d90000; }
  .quiz .correctGreenBorder { border: 3px solid #00CC33; }
  .quiz .incorrectRedBorder { border: 3px solid #d90000; }
  .quiz .quizFeedbackMsg { display:none; font-size: 0.9em; padding-left: 45px; padding-bottom: 20px; line-height: 1.6em; }
  .quiz .checkboxExplanation { margin-left: 20px; margin-right: 20px; }

  
/* Quick Quiz */
.quiz { width: 650px; margin: 20px auto; background-color: @courseLight; display: block; border: 1px solid @courseDark; border-radius: 20px; overflow: visible; }
.quizText { margin: 15px 20px 10px 20px; font-weight: bold; }
.quizRadio { padding: 0px 50px; }
#quizFeedback { position: relative; font-size: 1.4em; margin-left: 25px; margin-top: 10px; padding-left: 45px; line-height: 1.4em; }
.quizRadio p { margin: auto; font-size: 1.2em; line-height: 1.6em; }
.quizRadio input { margin-right: 10px; }
.quiz #qqCheck { text-align: right; }
.quiz button { padding: 5px 15px; margin: 10px 15px 10px 0px; }
.correct { background-image: url(../../HTML_images/Accept-icon.png); background-repeat: no-repeat; background-position: left top; }
.incorrect { background-image: url(../../HTML_images/Deny-icon.png); background-repeat: no-repeat; background-position: left top; }

.quizFeedback { position: relative; font-size: 1.2em; margin-left: 25px; margin-top: 10px; padding-left: 45px; line-height: 1.4em; }


/* Print Text */
.printText { width: 95%; overflow: auto; padding: 5px 10px; margin: auto; background-color: @courseLight; clear: both; }
#textArea { font-family: Arial, Helvetica, sans-serif; vertical-align: top; -webkit-transition: height 0.2s; -moz-transition: height 0.2s; transition: height 0.2s; resize: vertical; }

/* Radio Button Quiz */
.radioQuiz { max-width: 750px; background-color: @courseLight; margin-bottom: 15px; }
.radioQuiz ul { list-style-type: none; padding: 10px 5px; }
.radioQuiz ul li { padding: 3px 25px 0; border-top: 2px solid @courseDark; }
.radioQuiz label { display: inline-block; width: 100px; margin-right: 30px; }
.radioQuiz input { margin-left: 20px; }

/* Nested Tabs */
div#nestedTabs { width: 700px; margin: 20px auto; background-color: @courseLight; border-radius: 5px; }
div#nestedTabs > div { border: 1px solid @courseDark; padding: 10px; position: relative; top: -1px; z-index: 1; border-radius: 5px; background-color: @courseLight; background-image: url(../../HTML_images/EpsilenTabFade.png); background-size: contain; background-position: top; background-repeat: repeat-x; }
div#nestedTabs > div > div { border: 1px solid @courseDark; padding: 10px; position: relative; top: -1px; z-index: 1; border-radius: 5px; background-color: @courseLight; background-image: url(../../HTML_images/EpsilenTabFade.png); background-size: contain; background-position: top; background-repeat: repeat-x; }
ul.tabs { position: relative; margin: 0px; z-index: 10; }
ul.tabs li { list-style: none; display: inline; padding: 0px; font-weight: bold; }
.tabs a { padding: 5px 10px; display: inline-block; background-color: @courseDark; color: #fff; text-decoration: none; border-radius: 5px 5px 0px 0px; }
.tabs a:hover { background-color: @courseFocus; }
.tabs a.active { border: 1px solid @courseDark; border-bottom: 1px solid #FFF; color: #000; background-color: #FFF; }

/* Slider Bar */
.sliderBarQuestion { margin:0px; padding:0px; }
.sliderBarQuestion .labelText { margin-left:20px; font-size:14px; }
.sliderBarQuestion .levelSelected { border:0; color:#f6931f; font-weight:bold; font-size:16px; }
.sliderBarQuestion .sliderBar { width:300px; margin-left:30px; }


/* Touch Slider */
.sliderContainer { width: 680px; height: 400px; margin: 25px auto; border-radius: 15px; overflow: hidden; }
.sliderButton { height: 400px; width: 30px; background-color: @courseDark; float: left; line-height: 400px; text-align: center; color: white; font-weight: bold; font-size: 24px; }
.sliderButton:hover { color: white; background-color: @courseFocus; }
.sliderFloat { float: left; }
.iosSlider { position: relative; top: 0; left: 0; overflow: hidden; width: 620px; height: 400px; }
.iosSlider .slider { width: 100%; height: 100%; }
.iosSlider .slider .slide { float: left; background-color: @courseLight; width: 620px; height: 400px; }

/* Number Generator */
.generator { width: 500px; margin: 20px auto; background-color: @courseLight; display: block; border: 1px solid @courseDark; border-radius: 20px; overflow: visible; }
.generatorText { margin: 15px 20px 10px 20px; font-weight: bold; }

.generateResults #generateButton { padding-left: 20px;}
#generateButton { padding: 5px 15px; margin: 10px 15px 10px 15px; }
#resultingNumber { display: inline; margin: auto; font-size: 1.2em; padding: 15px; }


/* Card Sort */

  #widget10-1-heading { clear: both; margin: 0px; padding: 0px; }

  #widget10-1-heading1 { float: left; width: 100px; margin: 0px; padding: 0px; font-size: .8em; font-weight:bold; text-align: center; }
  #widget10-1-heading2 { float: left; width: 273px; margin: 0px; padding: 0px; font-size: .8em; font-weight:bold; text-align: center; }
  #widget10-1-heading3 { float: left; width: 356px; margin: 0px; padding: 0px; font-size: .8em; font-weight:bold; text-align: center; }

  #widget10-1 { display: inline-block; width: 730px; margin: auto; border: 1px solid @courseDark; background-color: @courseCream; }
  
  #widget10-1 .numberSection { list-style-type: none; float: left; width: 100px; margin-top: 0; padding: 0; margin-bottom: 0; border-right: 1px solid @courseDark; }
  #widget10-1 .numberSection li { font-size: .8em; height: 87px; width: 100%; margin: 1px 0 1px; padding: 10px 0; text-align: center; border-bottom: 1px solid @courseDark; }
  #widget10-1 .numberSection li:last-child { border-bottom: none; }
  
  #widget10-1 #sortable { list-style-type: none; margin: 0; padding: 0; width: 629px; float: left; cursor: move; }
  #widget10-1 #sortable li { position: relative; padding: 5px 5px 10px 10px; font-size: .8em; height: 93px; background-color: @courseLight; border-bottom: 1px solid @courseDark; }
  #widget10-1 #sortable li:hover { border-left: 5px solid @courseFocus; padding-left: 5px; }
  #widget10-1 #sortable li:last-child { border-bottom: 0; }
  #widget10-1 #sortable li p { width: 280px; }
  #widget10-1 #sortable li select { margin: 5px 0 20px 0; }
  #widget10-1 #sortable li span { position: absolute; margin-left: -1.3em; }
  
  .sortTable { display: block; position: absolute; top: 5px; right: 5px; }
  .sortTable td { width: 50px; font-size: .8em; text-align: center; vertical-align: top; padding: 0 5px; border-right: 1px solid blue; }
  .sortTable td:last-child { border-right: 0; }
  .sortTable tr:last-child td { border-right: 0}
  
/* Card Sort */

  #widget08-9-heading { clear: both; margin: 0px; padding: 0px; }

  #widget08-9-heading1 { float: left; width: 100px; margin: 0px; padding: 0px; font-size: .8em; font-weight:bold; text-align: center; }
  #widget08-9-heading2 { float: left; width: 290px; margin: 0px; padding: 0px; font-size: .8em; font-weight:bold; text-align: center; }
  #widget08-9-heading3 { float: left; width: 338px; margin: 0px; padding: 0px; font-size: .8em; font-weight:bold; text-align: center; }

  #widget08-9 { display: inline-block; width: 730px; margin: auto; border: 1px solid @courseDark; background-color: @courseCream; }
  
  #widget08-9 .strategy { list-style-type: none; float: left; width: 100px; margin-top: 0; padding: 0; margin-bottom: 0; border-right: 1px solid @courseDark; }
  #widget08-9 .strategy li { font-size: .8em; height: 97px; width: 100%; margin: 1px 0 1px; padding: 10px 0; text-align: center; border-bottom: 1px solid @courseDark; }
  #widget08-9 .strategy li:last-child { border-bottom: none; }
  
  #widget08-9 .description { list-style-type: none; float: left; width: 290px; margin-top: 0; padding: 0; margin-bottom: 0; border-right: 1px solid @courseDark; }
  #widget08-9 .description li { font-size: .8em; height: 97px; margin: 1px 0 1px; padding: 10px 5px; text-align: left; border-bottom: 1px solid @courseDark; }
  #widget08-9 .description li:last-child { border-bottom: none; }
  
  #widget08-9 #sortable { list-style-type: none; margin: 0; padding: 0; width: 338px; float: left; cursor: move; }
  #widget08-9 #sortable li { position: relative; padding: 5px 5px 10px 10px; font-size: .8em; height: 103px; background-color: @courseLight; border-bottom: 1px solid @courseDark; }
  #widget08-9 #sortable li:hover { border-left: 5px solid @courseFocus; padding-left: 5px; }
  #widget08-9 #sortable li:last-child { border-bottom: 0; }
  #widget08-9 #sortable li p { width: 280px; }
  #widget08-9 #sortable li span { position: absolute; margin-left: -1.3em; }


/* Question Generator */
.generator #resultingQuestion { margin: 10px 20px; font-size:16px; font-weight:bold; display:none; }
.generator #randomQAnswer { margin-left: 20px; resize: vertical;}
.generateQuestion { margin-left: 10px; }
.generatorQText { margin: 15px 20px 10px 20px; font-weight: bold; font-size: 14px; }
.generator #print { display:none; float:right; padding: 5px 15px; margin: 5px 32px 10px 15px;}
#genQuestionBox { padding-bottom: 70px; }



/* Text styling */
div.spaap_container_geogebra, 
div.spaap_container_geogebra p,
div.spaap_container_geogebra h1, 
div.spaap_container_geogebra li, 
div.spaap_container_geogebra td { font-family:Verdana,sans-serif; font-size: 1em; padding: 0px 5px; color:#333; line-height: 1.4em; }
div.spaap_container_geogebra p { margin-top: 10px; }
div.spaap_container_geogebra h1 { font-weight:bold; }

/* Misc Elements and Layout */
body { margin-top: -10px; }
.spaap_container_geogebra { width:1290px; margin:0 auto; background-color:#fefefe; overflow:auto; }















/* Text styling */
div.spaap_container, 
div.spaap_container p,
div.spaap_container h1, 
div.spaap_container li, 
div.spaap_courseStage p, 
div.spaap_container td { font-family:Verdana,sans-serif; font-size: 1em; padding: 0px 5px; color:#333; line-height: 1.4em; }
div.spaap_container p { margin-top: 10px; }
div.spaap_container h1 { font-weight:bold; }
div.spaap_container td {font-size: 12px} /* materials to download */
.spaap_bold, .spaap_prompt{ font-weight: bold }
.spaap_epsilenMenu { font-style:italic; }
.spaap_handoutTitle{ font-weight:bold; font-style:italic; }
.spaap_otherCourseTitle {font-style: italic;}
.spaap_sectionName {font-weight: bold; font-size: 13px}
.spaap_lessonTitle{text-decoration: underline}

/* Links */
.spaap_container a { color:#3875d7; text-decoration:underline;}
.spaap_container a:visited { color:#3875d7; }
.spaap_container a:hover { color:#444; }
.spaap_container a:active { color:#444; }
a img { border: none; }

/* Page-Top Background */
.spaap_Header { font-size:14px; font-weight:bold; background-color: @courseDark; border-top: 15px solid @courseDark; padding: 5px 0px; .fade; }

/* Misc Elements and Layout */
body { margin-top: -10px; }
.spaap_image{ padding:0px 10px 10px 10px;}
.spaap_container { width:735px; margin:0 auto; background-color:#fefefe; overflow:auto; }
.spaap_content { margin-top: -10px; }
div.spaap_FloatLeft { float:left; }
div.spaap_FloatRight { float:right; }
div.spaap_FloatClear { clear: both; }

/* Focus Question */
.spaap_focusQuestion { padding: 0px; font-size: 1em; border-left:5px solid @courseFocus; clear: left; }
.spaap_focusQuestion ul { padding-left: 25px; *margin-left:0px}

/* Quote Block */
.spaap_quote { display: block; margin: 0px 15%; padding: 10px; background-color: @courseLight; font-style: italic; border: 2px outset @courseDark; }

/* Tables */
.spaap_table { overflow:auto; clear: both; margin:0px auto; width: 700px; text-align: left; cell-spacing: 0px; cellpadding: 2px; border: 1px gray solid; background-color: @courseLight; border-collapse: collapse; margin-top: 10px;}
.spaap_tableTop{ padding:5px; }
.spaap_table table { border-collapse:collapse;}
.spaap_table td { padding: 5px; vertical-align: middle; border: 1px gray solid; }
.spaap_table th { padding: 5px; text-align: center; }

/* Geogebra */
#geogebraBackround { background-color:#FFF; }
#geogebraTitle { color:#3776BD; font-size: 1.3em; text-align:center; margin-top:10px; }
#geogebraFrame { width:1024px; margin: 10px auto; }

/* Materials To Download Links */
.spaap_container td a { color:#3875d7; text-decoration:none; font-size: 12px}
.spaap_container td a:visited { color:#3875d7; }
.spaap_container td a:hover { color:#444; }
.spaap_container td a:active { color:#444; }

/* Spaap Citation */
div.spaap_citation{ padding: 10px 0 0 0; }
div.spaap_citation p{ font-size: 10px; color:#999; padding-bottom: 5px; }
div.spaap_citation a{ font-size: 10px; color:#3875d7; text-decoration:underline; }

/* Spaap Footer */
.spaap_footer { clear: both; height:44px; margin-top:10px; background-image:url(http://jukebox.esc13.net/spaap_common/footer2015.jpg); background-repeat:no-repeat; overflow-x: hidden; overflow-y: hidden;}