/* Studiware Succeed Style Sheet
 * Version Number: 0.3
 *   Site Colour Schema
 *   Body Light Background:       #D1D1D1; 
 *   Dark-grey Container:         #8B8B8B;
 *   Darker Grey Border:          #3F3F3F 
 *   Calculator Blue              #9FDAF7   
 *   Text Aqua Blue:              #00A0C6
 *   Green Link Hover:            #86FF22; 
 *
 *   Other Grays: #7F7F7F, #E1E1E1
 *         
 */ 
html, body {height:100%;}
body {
	min-width: 1140px;         
	font-family:arial;
	margin: 0;
	padding: 0;
	background: #D1D1D1;
	color: #000000;
	text-align:center;
}

img
{  border-style: none;
}

.centered {
text-align: center;
margin-left: auto;
margin-right: auto;
}

A {text-decoration: none; color: #FFFFFF;}
A:visited {color: #FFFFFF; }

A:hover {color:#86FF22; }
P {margin-bottom:1em;}

h1 { font-size:140%;}
h2 { font-size:130%; margin-top:10px; margin-bottom:10px;}
h3 { font-size:110%; margin-bottom:10px; text-align:center; font-weight: bold;}
h4 { margin-top:5px; margin-bottom:5px;}

.clearDiv{clear: both;}
.fullDiv{width:100%;text-align:center;}

#container {
  width: 1000px;
  margin: 0px auto;
  min-height:100%;
  position:relative;
  text-align:left;
  background: #8B8B8B;
  border-left: 1px solid #3F3F3F;
  border-right: 1px solid #3F3F3F;
}

#main {
  margin: 0px auto; 
  text-align:left;
  padding-top:20px;
  font-size:14px;
  min-height: 650px; 
  position: relative;
  padding-bottom: 70px; 
}

#succeed{float:left}

/*
#topOuter{margin:0px auto; margin-top:30px; width:860px;  background-color: #8B8B8B;padding:1px;}
#top { background:#FFFFFF; padding:10px;}
#topText{margin-top:20px; margin-left:330px; margin-right:30px; line-height: 1.5em;}
*/

/*#topText{clear:left; margin-top:0px; margin-left:320px; margin-right:30px; line-height: 1.5em; font-weight: bold;} */
#topOuter{ padding:10px; background-color: #FFFFFF; }
#top {line-height: 1.5em;}
#topHeader{padding-top:50px; text-align:center; font-weight: bold;line-height: 2.0em; font-size:1.2em;}
#topText{clear:left; padding: 20px; margin-right:30px; }

#middle {
  margin-top:10px;
  color: #FFFFFF;
}

#middle ul
{
list-style: none;
padding: 0;
margin: 0;
padding-left:30px;
}

#middle li
{
  float: left;
  height: 2em;
  line-height: 2em;
  padding-left:7px;
  padding-right:7px; 
  display: block;
  border-right: 0.1em solid #dcdce9;
  text-decoration: none;
  text-align: center;
  font-weight: bold;
}

#middle li.firstItem {padding-left:0px;}
#middle li.lastItem {border:0px;}

#bottom {position:relative;margin-top:40px;padding:30px; padding-top:20px; color:#FFFFFF;}

#bottom A {text-decoration: underline}; 

#contentWrapper{margin:0px auto; margin-top:20px; width:700px; text-align:center;}

/* #contentLeft, #contentCenter, #contentRight { */
.contentColumn {
  width:  190px;
  background-color: #8B8B8B;
  padding:1px;  
  text-align:left;
  float:left;
  /*margin:0px auto;*/
  margin-left:20px;
  margin-right:20px;
  cursor:pointer;
}

/*
 #contentLeft  {float:left;}
 #contentRight {float:right;}
*/
/* .contentRight {margin-right:0px} */

.contentBox {
  background: #FFFFFF;
  padding:10px;
  color: #000000;
  height: 300px;
  /*font-size: 16px; */
}

.contentBox:hover{ background-color: #C8FFFF;}

.contentHeader{font-size: 16px;font-weight:bold; text-align:center;padding-top:10px;padding-bottom:10px;}
.contentSubheader{text-align:center; color:#00A0C6; margin-bottom:15px;}

.contentBox li {margin-bottom:15px;}

#displayArea {
  position: absolute;
  left:350px;
  top:1px;
  background: #FFFFFF;
}

.contactInfo {
  margin-left:50px;
}

.contactInfo tr {
  line-height:1.5em;
}

.contactInfo .tdFirst {
  font-weight: bold;
}

#aboutCol1 {
  float:left;
  width:400px;
}

#aboutCol2 {
  float:right;
  width:400px;
}

#aboutCol1 ul, #aboutCol2 ul {
  list-style: disc;
}

#bottom h3 { font-size:110%; margin-bottom:10px; margin-top:10px; text-align:center; font-weight: bold;} 

#bottom ul li {margin-left:20px; }


/*
 Example areas for the Fold and move approach
#studyExample, #videoExample, #calculatorExample {
  display:none; 
  width:600px;
  height:300px;
  padding:10px;
}
*/

#footer-wrapper {
	position: absolute;
	width: 100%; 
	/*height: 95px; */
	/*margin-top:20px; */
	bottom:0;
	height: 68px;
}

#footer {
  /*border: 2px solid #D1D1D1; */
  margin:2px;
  padding:5px;   
  background: #FFFFFF;
  color: #7F7F7F;
}

.clearFix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

#footer #left { float: left; line-height:54px; font-size:12px;}

#footer #right { float: right;}


.borderGrey {
  background-color: #8B8B8B;
  padding:1px;
}

#trialSignup {margin-bottom:20px;}

#trialTable {margin-top: 20px; margin-bottom: 20px;}
#trialTable td {padding:5px;}

.signupInput{width:300px;}


/* ************************************************************* */
/*                          Dialog Styles                        */

/*
#dialog-mask {position:absolute; top:0; left:0; min-height:100%; width:100%; background:#FFF; opacity:.75; z-index:20000; visibility: hidden;}  
* html #dialog-mask {position:absolute; top:0; left:0; min-height:100%; width:100%; background:#FFF; opacity:.75; filter:alpha(opacity=75); z-index:100;  visibility: hidden;}
*/

#dialog-mask {position:absolute; top:0; left:0; min-height:100%; width:100%; background:#000000; opacity:.85; z-index:20000; visibility: hidden;}  
* html #dialog-mask {position:absolute; top:0; left:0; min-height:100%; width:100%; background:#000000; opacity:.85; filter:alpha(opacity=75); z-index:100;  visibility: hidden; }

#exampleWindow{position:absolute; width:960px; z-index:20005; background:#FFFFFF; top:0px; left:0px; visibility: hidden;}
#dialog       {position:absolute; width:425px; padding:10px; z-index:20005; background:#FFFFFF} 
#dialog-header {display:block; position:relative; padding:4px 6px 4px; height:20px; line-height:20px; font-size:14px; font-weight:bold}
#dialog-title {text-align:center; margin-left:20px; margin-right:20px;}
#dialog-close {float:right; cursor:pointer; margin:3px 3px 0 0; height:11px; width:11px; background:url(../images/dialog/dialog_close.gif) no-repeat}
#dialog-content {display:block; height:160px; padding:6px; color:#666666; font-size:13px; position: relative}
 
.error {background:#fff url(../images/dialog/error_bg.jpg) bottom right no-repeat; border:1px solid #924949; border-top:none}
.errorheader {background:url(../images/dialog/error_header.gif) repeat-x; color:#6f2c2c; border:1px solid #924949; border-bottom:none}
.warning {background:#fff url(../images/dialog/warning_bg.jpg) bottom right no-repeat; border:1px solid #c5a524; border-top:none}
.warningheader {background:url(../images/dialog/warning_header.gif) repeat-x; color:#957c17; border:1px solid #c5a524; border-bottom:none}
.success {background:#fff url(../images/dialog/success_bg.jpg) bottom right no-repeat; border:1px solid #60a174; border-top:none}
.successheader {background:url(../images/dialog/success_header.gif) repeat-x; color:#3c7f51; border:1px solid #60a174; border-bottom:none}
.prompt {background:#fff url(../images/dialog/prompt_bg.jpg) bottom right no-repeat; border:1px solid #4f6d81; border-top:none}
.promptheader {background:url(../images/dialog/prompt_header.gif) repeat-x; color:#355468; border:1px solid #4f6d81; border-bottom:none}

.example {      border:1px solid #3F3F3F; border-top:none}
.exampleheader { background-color:#8B8B8B; color:#FFFFFF; border:1px solid #3F3F3F; border-bottom:none;}
#example-content {display:block; color:#000000; position: relative; height: 500px; overflow:auto;}

#dialog-simple {position:absolute; padding:0px; margin:0px;z-index:200; background:#123123}

#dialog-text {
}

#dialogButtonArea {
position:absolute; width:95%;
bottom: 20px;
left: 5px;
/*text-align: center; */
}
#dialogButton,#dialogButtonCancel {
width:100px;
/*background-color: Blue; */
background-color: #D8D8D8;
margin-top: 10px;
margin-left: auto;
margin-right: auto;
cursor:pointer;
border: 1px solid #D8D8D8;
text-align:center;
font-weight:bold;
}
#dialogButton:hover,#dialogButtonCancel:hover {
border: 1px solid black;
}

#studySkillsExample{border: 5px solid #FFC859;}
#videoExample{border: #A5FF4C solid 5px;}
#calculatorExample{border: #EA69B6 solid 5px;}


/* ************************************************************************** */
/* ************************************************************************** */
/*                        Pulled from Main Examples                           */

h1.title{margin:60px 0px 20px 0px; padding:12px 20px;text-align:center;color:black;}
h2.heading{text-align:center;font-style:italic; color:#6D6D6D; padding-top:30px;padding-bottom:30px;}
h2.heading2{padding-top:30px;padding-bottom:30px;}
h3.subheading{text-align:left;color:#6D6D6D;padding:10px 30px 30px 30px;line-height:1.5em;}

.studyHeading      {text-align:center; font-weight:bold;margin-bottom:1em; font-size:1.1em;}
.studyHeadingPlain {text-align:center; margin-bottom:1em; font-size:1.1em;}

.first{background-color: #A5FF4C;}
.firstColor, .firstColor_v:hover, .videoBack_first:hover, .videoBackActive_first
{background-color: #A5FF4C;}
.firstColor_a, .firstColor_v{background-color: #CCFF99;}
.firstColorBorder{border-color: #A5FF4C;}
.firstColorText{color: #A5FF4C;}

/* Revision */
.thirdColor_a {background-color: #FFBDE9;}
.thirdColorBorder{border-color: #EA69B6;}
.thirdColorText{color: #FFBDE9;}
/* Presentations */
.fourthColor{background-color: #FFC859;}



.videoPageHeader{text-align: center; background-color: #FCFF82; margin:30px -20px 50px -20px; padding:12px 20px;}
.videos { padding-top:50px; padding-bottom:50px; }
.videoBorder {  margin-left:0px;  margin-right:0px;  cursor:pointer;  border-top-style: solid;  border-top-width: 1px;  border-bottom-style: solid;  border-bottom-width: 1px;  margin-top:-1px;}
.videoOuterBorder{ background-color: #898989;  padding:1px;   margin-top:10px;  margin-bottom:10px;}
.videoOuter{  text-align:center;  cursor:pointer;}
.videoBack_first { background: transparent;}
.videoHeader{  text-align:left;  font-weight: bold;  margin: 0px auto;  padding-top:10px;  padding-bottom:15px;  font-size:1.2em;  width:470px;}
.videoTop{  text-align:left;  padding:5px;}
.videoImage { float:left; padding:5px; }
.videoImageImage {width: 120px; border: 1px solid #8B8B8B; background-image: url('../images/video_thumb2.png'); background-repeat:no-repeat;}
.videoText { margin-left:150px; padding:5px; max-width:700px; padding-right:20px;padding-bottom:20px;}
.videoText P {margin-bottom: 1em;}
.video{display: none; text-align: center; margin: 0px auto; padding-bottom:20px; text-align:center;}
.video_caption{padding-top:5px;color:black;text-align: left;font-style:italic;}
.videoVideo{display:block; width:580px;height:362px;text-align:center;margin:0px auto;}
.videoPlayer{display:block; width:580px;height:362px;text-align:center;margin:0px auto;}
.videoMedia{width:670px; height:440px; text-align:center;margin:0px auto;}

.stepBorder {  margin-left:0px;  margin-right:0px;  border-top-style: solid;  border-top-width: 1px;  border-bottom-style: solid;  border-bottom-width: 1px;  margin-top:-1px;}
.stepOuter{  text-align:left;  padding:5px;  padding-top: 35px;  padding-bottom: 35px;}
.stepLeftSide{color:#FFFFFF;float:left; padding:5px; text-align:center; font-weight:bold; margin-left:20px;}
.stepStep{ font-size:20px; font-family: arial; line-height:25px;}
.stepNumber{font-size:150px; font-family: arial; line-height:120px;}
.stepHeading{font-weight:bold; font-size: 1.2em; text-align:center; padding-bottom:35px;}
.stepText { margin-left:150px; padding:5px; max-width:700px; padding-right:20px;padding-bottom:20px;}
#stepList ol li {margin-left:20px;}
.templateLink { float:right; margin: 0 0 10px 10px; }


/*box style*/
.box_outer {
  background-color: #8B8B8B;
  padding:1px;
  max-width:650px;
  margin:0 auto; margin-top:30px; margin-bottom:30px;
}
.box{text-align:left;padding:3px;}
.box_header{text-align:center;padding:10px 1px 5px 1px;font-weight: bold;margin-top:-5px;}
.box_header_top{font-size:15px; margin-bottom:5px;}
.box_body, .box_body_step {background-color:#FFF;padding:10px 20px 5px 20px; clear:both;}
.box_body P, .box_body_step P {margin-bottom:1em;}
/*.box_body li, .box_body_step li{margin-bottom:0.5em;} */
.box_body_step {padding:20px 20px 15px 20px;}


#studySkillsExample ul, #studySkillsExample ol{margin-top:10px;margin-bottom:10px;}
#studySkillsExample ul li {list-style-type: disc; margin-left:20px; margin-bottom:0.8em;}
#studySkillsExample ol li {list-style-type: decimal; margin-left:50px; margin-bottom:0.8em;}



.calculator_container{margin:0px auto; margin-top:55px;margin-bottom:10px;padding:0;text-align:center; color:black; font-size:15px; font-weight: bold;}
.calculator_header{position:absolute; left:20px; right:20px;top:2px; height: 25px; line-height: 25px; text-align:center; font-weight: bold; font-size:18px;}
.calculator_button{width: 119px; height: 49px; line-height: 50px; text-align:center; cursor:pointer; background-image: url('../images/calculatorButton_s.png'); background-repeat:no-repeat;}
.calculator_button:hover{background-position:0px -49px}
.calculator_button:active{background-position:0px -98px}
.calculator_button_small{width:151px; height: 30px; line-height: 30px; text-align:center; cursor:pointer; background-image: url('../images/feedback-button.png'); background-repeat:no-repeat;}
.calculator_button_small:hover{background-position:0px -30px}
.calculator_button_small:active{background-position:0px -60px}

.calculator_input         {border:0;text-align:center; padding:0px 5px 0px 5px; width:95px; font-size:15px; height:20px; vertical-align:middle; line-height: 20px;}
.calculator_inputLarge    {border:0;text-align:center; padding:0px 5px 0px 5px; width:150px; font-size:15px; height:20px; vertical-align:middle; line-height: 20px;}
.calculator_inputSmall    {border:0;text-align:center; padding:0px 5px 0px 5px; width:20px; font-size:15px; height:20px; vertical-align:middle; line-height: 20px;}
.calculator_dropdown      {border:0;text-align:center; padding:0px;             width:40px; font-size:15px; vertical-align:middle;}
.calculator_dropdownMedium{border:0;text-align:left;   padding:0px 5px 0px 5px; width:100px; font-size:15px; vertical-align:middle;}
.calculator_input_outer       {width:110px; height: 40px; line-height: 40px;}
.calculator_input_outerSmall  {width:45px; height: 40px; line-height: 40px;}
.calculator_input_outerMedium {width:110px; height: 40px; line-height: 40px;}

/* ================================== */
/*  Revision   Calculator   */
 
#calculator_revision {margin:0px auto;padding:0;text-align:center; position:relative; background-image: url('../images/revisionCalculator_s.png'); background-repeat:no-repeat; width:500px; height:434px;}
/*#calculator_revision_header {position:absolute; left:50px; top:5px; width:430px; height: 30px; line-height: 30px; text-align:center; font-weight: bold; font-size:20px;} */
#calculator_revision_labelDays {position:absolute; left:40px; top:65px; width:300px; height: 45px; line-height: 45px;}
#calculator_revision_labelTopics {position:absolute; left:40px; top:142px; width:300px; height: 45px; line-height: 45px;}

#calculator_revision_inputDays{position:absolute; left:350px; top:68px;}
#calculator_revision_inputTopics{position:absolute; left:350px; top:145px;}

#calculator_word_labelAns{position:absolute; left:40px; top:300px; width:190px; height: 45px; line-height: 45px;}
#calculator_word_labelAnsTopic{position:absolute; left:355px; top:300px; width:100px; height: 45px; line-height: 45px;}

#calculator_word_labelFooter1{position:absolute; left:20px; top:350px; width:460px; height: 30px; line-height: 30px; text-align:center;}
#calculator_word_labelFooter2{position:absolute; left:20px; top:380px; width:460px; height: 30px; line-height: 30px; text-align:center;}

#calculator_revision_button{position:absolute; left:190px; top:220px;}

#daysOutput {position:absolute; left:235px; top:307px; width: 110px; height: 30px; line-height: 30px;}

/* ================================== */
/*            Feedback               */

#feedback {margin:0px auto;padding:0;text-align:center; position:relative; background-image: url('../images/feedback_s.png'); background-repeat:no-repeat; width:500px; height:330px;}
#feedback_header{text-align:center;color:#000000;}
#feedbackInput {position:absolute; width:460px;height:155px; left:20px;top:40px; border:0;}
#feedback_button{position:absolute; left:190px; top:290px;}
.calculator_input_feedback{border:0;text-align:left; padding-top:2px; padding-bottom:3px; width:230px;}
.calculator_input_outer_feedback{position:absolute;border:0;width:245px; font-size:14px; height:20px;line-height:20px;}
#feedback_label_name      {position:absolute; top:217px; left: 30px; width:200px;padding-left:0px; text-align:left; font-size:14px; height:20px;line-height:20px;vertical-align:middle;}
#feedback_label_email     {position:absolute; top:252px; left: 30px; width:200px;padding-left:0px; text-align:left; font-size:14px; height:20px;line-height:20px;vertical-align:middle;}
#feedback_name_input { left:220px; top:217px;}
#feedback_email_input{ left:220px; top:252px;}

#ui-datepicker-div { display: none; }

.informational {
    border: 1px solid rgb(200,200,200);
    padding: 20px;
}
.panelheader {
    
    padding: 20px 0px 20px 0px;
}