body {
    margin: 0;
    padding: 0;
    font-family: Arial, Verdana, Helvetica, sans-serif;
    font-size: 14px;
}
h1 {
    font-size: 3em;
    margin: 20px 0;
}
.container {
    width: 800px;
    height: 600px;
    margin: 0 auto;
    border: 1px solid #b9dce2;
}
.desc {
    border-top: #ebeced 3px solid;
    padding: 5px 0;
    margin: 0;
}
.desc1 {
    border-bottom: #ebeced 1px solid;
    padding: 5px 0;
    margin: 0;
    font-size: 13px;
    font-weight: bold;
}
.tab2-cont_inner .desc1 {
    padding-right: 6px;
    border-bottom: none;
    padding-top: 0px;
}
h4 {
    line-height: 23px;
    padding: 0px 0;
    margin: 0;
}
.titlebg {
    width: 800px;
    height: 28px;
    background-color: #323b47;
}
.title {
    height: 20px;
    color: #fff;
    padding: 2px 0px 0px 7px;
    font-size: 12px;
    width: 200px;
    float: left;
}
.close_main {
    float: right;
    padding: 3px 5px 0px 0px;
}
ul.tabs {
    margin: 0px;
    padding: 0;
    float: left;
    list-style: none;
    height: 41px;
    width: 800px;
    margin-top: 2px;
}
ul.tabs li {
    float: left;
    margin: 0;
    padding: 0;
    height: 44px;
    line-height: 16px;
    margin-bottom: -1px;
    overflow: hidden;
    position: relative;
    text-align: center;
}
ul.tabs li a {
    text-decoration: none;
    color: #323a46;
    display: block;
    font-size: 13px;
    padding: 6px 0px;
    outline: none;
    width: 200px;
}
ul>li:first-child.active {
    border-left: 0px solid #e5e9ea!important;
}
ul>li:last-child.active {
    border-right: 0px solid #e5e9ea!important;
}
ul.tabs li a:hover {
    background-color: #ebeced;
    font-weight: bold;
}
html ul.tabs li.active a {
    color: #15a7b6;
    font-weight: bold;
    background: #fff;
}
.tab_container {
    clear: both;
    float: left;
    width: 800px;
    margin-top: -1px;
    overflow:hidden;
}
.active_thumb {
    border: 0px solid red;
}
.tab_content {
    visibility: hidden;
    font-size: 13px;
}
.tab_content h2 {
    font-weight: normal;
    padding-bottom: 10px;
    font-size: 14px;
}
.tab_content h3 a {
    color: #254588;
}
.tab_content img {
    float: left;
 /*    margin: 0 0 15px 0; */
    max-width: 100%;
    max-height: 100%;
}
.netarea {
    width: 415px;
    text-align: right;
    padding-top: 12px;
    padding-bottom: 8px;
    font-size: 12px;
}
.tab_inner_wraper {
    width: 800px;
    margin: 0px auto;
    height: 530px;
    background-color: #fff;
}
.canvas_area_l {
    float: left;
    width: 610px;
    height: 524px;
    background-color: #f9fbfb;
    border-radius: 0 5px 5px 0;
    overflow: hidden;
    margin-top: 5px;
    position: relative;
}
.canvas_area_r {
    float: left;
    width: 190px;
    height: 530px;
    background-color: #fff;
}
.r_inner {
    margin: 0px 0px 12px 0;
    height: 465px;
}
.r_inner p,
label {
   /*  font-size: 11pt; */
    position: relative;
}
/* change added width: 160px;*/
label {
    display: block;
    margin: 5px 2px;
    width: 160px;
  /*   margin-left:2px; */
}
form {
    line-height: 16px;
    padding: 0 0 0 0;
}
.tab2-cont_inner {
    padding: 10px;
    padding-top: 0px;
}
.canvas-title {
    padding: 13px 0px 7px 10px;
    color: #15a7b6;
    font-size: 12px;
    font-weight: bold;
    position: relative;
}
.canvas_cont {
    width: 590px;
    height: 340px;
    border: 1px solid #acacac;
    border-radius: 2px 2px 0px 0px;
    background-color: #fff;
    margin: 0 auto;
}
.canvas_area_1 {
    width: 592px;
    height: 340px;
    background-color: #fff;
    float: left;
    position: relative;
}
.areaaccordion {
    float: left;
    margin-left: -2px;
    width: 185px;
    height: 539px;
}
.areaaccordion h2 {
    font-family: Arial !important;
    font-size: 13px!important;
    font-weight: bold!important;
    padding: 5px!important;
    margin: 0;
    background: #ebeced;
    margin-bottom: 2px;
    line-height: 20px;
    border: #ebeced 1px solid;
    cursor: pointer;
}
.areaaccordion h2.active,
.ui-accordion-header-active {
    color: #15a7b6 !important;
    font-weight: bold !important;
    background: #fff !important;
}
.areaaccordion .cont {
    border: #ebeced 1px solid;
    padding: 5px!important;
    margin-top: -2px;
    margin-bottom: 2px;
    height: 410px;
    overflow: hidden;
    color: #000000;
}
.areaaccordion .cont p strong {
    color: #666;
}
/*changes width: 190px;*/
/* .canvas_control_1 {
    width: auto;
    display: inline-flex;
    height: 26px;
    float: left;
    text-align: right;
} */
.canvas_control_1 .axis-txt {
    width: 35px;
    color: #15a7b6;
    text-align: left;
    font-size: 11px;
    padding: 3px 5px 0;
    line-height: 1;
}

.hyperbolaC{
	color:#e30405;
	font-size: 14px;
	 font-weight: bold;
	 float: left;
	 margin: 4px 8px; 
}
#revolve_region_text {
    float: left;
    width: 110px;
    font-size: 14px;
    padding: 5px 5px 0;
    line-height: 1;
}
.axis-txt {
    float: left;
    font-size: 10px;
    margin-top: 1px;
}
input[type="radio"] {
	   -moz-appearance: none;
    margin: 0px;
    padding: 0px;
    height: 12px;
    width: 12px;
}

input[type="checkbox"] {
	 -moz-appearance: none;
    margin: 0px;
    padding: 0px;
    height: 12px;
    width: 11px;
    /* margin-left:6px; */
}

.axis-radio {
    float: left;
    margin-top: 2px;
    margin-left: 30px;
    color: black;
}
.slider-cont {
    margin: 5px auto 0px 9px;
    position: absolute;
    right: 10px;
    top: 0;
}
.slider-cont-1 {
    width: 310px;
    height: 20px;
}
.slider-div {
    width: 310px;
    height: 29px;
}
.video-slider-cont-1 {
    float: right;
    height: 20px;
    margin-top: -30px;
    width: 189px;
}
.video-slider-div {
    width: 170px;
    height: 15px;
    margin-top: 5px;
    margin-left: 28px;
    cursor: pointer;
}
.slider_solid1 {
    width: 101px;
    height: 29px;
    margin-right: 2px;
    float: left;
    color: #fff;
    text-align: center;
    text-decoration: none;
    font-size: 14px;
    font-weight: normal;
    padding: 2px 0 0 0;
}
#id_solid1,
#id_solid2,
#id_solid3 {
    background-color: #183138;
    height: 21px;
    padding-top: 2px;
    cursor: pointer;
    width: inherit;
    display: block;
}
.video-slider_solid1.arrow {
    background: url(../img/down_arrow.png) no-repeat 50% 24px;
    font-weight: bold;
    color: #11A7B6;
}
.video-slider_solid1 a {
    background-color: #183138;
    display: block;
    height: 21px;
    font-size: 14px;
    padding-top: 2px;
}
.video-slider_solid1 a {
    background-color: #183138;
    display: block;
    height: 21px;
    font-size: 14px;
    padding-top: 2px;
}
.video-slider_solid1 {
    width: 79px;
    height: 29px;
    margin-right: 2px;
    float: left;
    color: #fff;
    text-align: center;
    text-decoration: none;
    font-size: 10px;
    font-weight: bold;
    padding: 2px 0 0 0;
}
.slider_solid2 {
    width: 102px;
    height: 29px;
    float: left;
    color: #fff;
    text-align: center;
    text-decoration: none;
    font-size: 14px;
    font-weight: normal;
    padding: 2px 0 0 0;
}
.video-slider_solid2 {
    width: 92px;
    height: 20px;
    float: left;
    color: #fff;
    text-align: center;
    text-decoration: none;
    font-size: 10px;
    font-weight: normal;
    padding: 2px 0 0 0;
}
.slider_solid1 a,
.slider_solid2 a {
    color: #fff;
    text-decoration: none;
    text-align: center;
    font-weight: bold;
}
.slider_solid1 a:active,
.slider_solid2 a:active {
    color: #11a7b6;
    text-decoration: none;
    text-align: center;
    font-weight: bold;
}
.video-slider_solid1 a:active,
.video-slider_solid2 a:active {
    color: #11a7b6;
    text-decoration: none;
    text-align: center;
    font-weight: bold;
}
.arrow {
    background: url(../img/down_arrow.png) no-repeat 50% 24px;
    font-weight: bold;
    color: #11A7B6;
}
.slider-box-div {
    width: 292px;
    height: 77px;
}
.slider-box-div .active {
    border: 2px solid #231f20;
}
.video-slider-box-div {
    width: 198px;
    height: 77px;
}
.video-slider-box-div .active {
    border: 2px solid #231f20;
}
.slider-box1 {
    width: 90px;
    height: 75px;
    border: 1px solid #333;
    margin-right: 5px;
    float: left;
    overflow: hidden;
    padding: 1px;
}
.video-slider-box1 {
    width: 90px;
    height: 75px;
    border: 1px solid #333;
    margin-right: 5px;
    float: left;
    overflow: hidden;
}
.video-slider-box1 a:active,
.video-slider-box1 a:active {
    border: 2px solid #231f20;
}
.slider-box1 a:active,
.slider-box1 a:active {
    border: 2px solid #231f20;
}
.slider-box2 {
    width: 90px;
    height: 75px;
    border: 1px solid #333;
    float: left;
    overflow: hidden;
    padding: 1px;
}
.video-slider-box2 {
    width: 90px;
    height: 75px;
    border: 1px solid #333;
    float: left;
    overflow: hidden;
}
.rect-text {
    font-size: 12px;
    color: #15a7b6;
    margin: 4px 0px 0px 0px;
}
.input {
    font-size: 12px;
    background-color: #15a7b6;
    border: 1px solid #333;
}
.next-but {
    border-color: #9bccd5 !important;
    background: #fff !important;
}
.next-but a {
    color: #15a7b6 !important;
}
.submit-but,
.next-but {
    font-size: 12px;
    font-weight: bold;
    /*width: 108px;*/
    border: 2px solid #15a7b6;
    color: #fff;
    /*padding: 10px 0px 11px 0px;*/
    padding: 2px 0px 2px 0px;
    width: 100%;
    text-align: center;
    margin: 0 auto;
    margin-top: 0px;
    margin-left: 2px;
    float: left;
    background: #1aa8b6;
    cursor: pointer;
}
.next-but {
    display: none;
}
.submit_but_hover {
    text-decoration: none;
    color: #fff;
}
.next-but:hover,
.submit-but:hover {
    text-decoration: none;
    color: #fff;
}
.next-but a,
.submit-but a {
    color: #fff;
    text-decoration: none;
}
.reset-but {
    font-size: 12px;
    font-weight: bold;
    width: 120px;
    background-color: #15a7b6;
    color: #fff;
    padding: 13px 0px 13px 0px;
    text-align: center;
    margin: 0 auto;
    margin: 11px 0 0 100px;
    float: left;
    border: 2px solid #15a7b6;
}
.reset_but_hover {
    text-decoration: none;
    color: #fff;
    border: 2px solid #333;
}
.reset-but:hover {
    text-decoration: none;
    border: 2px solid #333;
    color: #fff;
}
.reset-but a {
    color: #fff;
    text-decoration: none;
}
.rangeslider__fill {
    background: none repeat scroll 0 0 #6aa1d6;
}
.rangeSlider {
    width: 200px;
}
.FL {
    float: left;
}
.H10 {
    height: 5px;
}
#fx,
#x,
#y {
    font-size: 11px;
    height: 10px;
}
.formulaFont {
    font-size: 10px;
}
.display_block {
    display: block;
}
.display_none {
    display: none;
}
.xslider {
    margin: 9px 0px 0px 3px;
    width: 136px;
    height: 10px;
}
.round {
    background-color: #d8dad9;
    width: 9px;
    height: 9px;
    border-radius: 10px;
    float: right;
    margin: -12px 7px 0px 0px;
    display: none;
}
.round_y_disable {
    background-color: #637276;
    width: 9px;
    height: 9px;
    border-radius: 10px;
    float: right;
    margin: -104px 7px 0px 0px;
    opacity: 0.99;
    display: none;
}
.round_y_enable {
    background-color: #eeeeee;
    width: 9px;
    height: 9px;
    border-radius: 10px;
    float: right;
    margin: -104px 7px 0px 0px;
    opacity: 0.99;
    display: none;
}
/*Modal Box*/
#mask {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 9000;
    background-color: #000;
    display: none;
}
#boxes .window {
    position: fixed;
    left: 0;
    top: 0;
    width: 440px;
    height: 200px;
    display: none;
    z-index: 9999;
}
#boxes #dialog {
    width: 400px;
    height: 300px;
    background-color: #ffffff;
    overflow: auto;
}
/*error popup page css*/
.error_header {
    width: 400px;
    height: 47px;
    background-color: #1aa8b6;
}
.header_titile {
    padding: 14px 0px 14px 10px;
    color: #fff;
    float: left;
    width: 350px;
    font-weight: bold;
}
.close-popup {
    padding: 10px;
    float: right;
    width: 15px;
    height: 16px;
}
.tick {
    width: 20px;
}
#ans_grid_html {
    padding: 10px;
}
/* vertical range slider */
.ui-slider-range {
   background: #1aa8b6; 
   /*   background: 0xFFFFFF;  for white */
}

/* .scenario1 .rangeslider .ui-slider-range, .scenario2 .rangeslider .ui-slider-range, .scenario3 .rangeslider .ui-slider-range {
    background: #5e6f83;  
} */

.ui-slider a {
    outline: none;
}
.ui-slider .ui-slider-handle:focus {
    outline: none;
}
#rangeSlider2 {
    padding: 10px 7px 0 8px;
}
#idSlider2 {
    width: 128px;
}
.ui-slider-handle {
    border: none !important;
    outline: none !important;
    top: -6px !important;
}
.slider2_container {
    border: 0px solid red;
    height: 26px;
    background: none repeat scroll 0 0 #193036;
    float: right;
}
#animate_stop {
    display: none;
}
.imageBlock {
    display: block;
    float: left;
    width: 234px;
    padding-left: 7px;
    font-size: 12px;
    padding-right: 18px;
    overflow: hidden;
}
.question {
    min-height: 465px;
    padding-top: 1px;
    font-size: 12px !important;
}
.form1 p label {
    padding: 5px;
}
.vjs-default-skin .vjs-big-play-button {
    left: 40%;
    top: 42%;
}
.reset {
    width: 30px;
    height: 26px;
    float: left;
    margin: 0 1px 0 0;
    text-align: center;
    background: #193037;
}
.reset img {
    float: none;
    margin: 5px 0px;
}
#animate_container {
    width: 30px;
    height: 26px;
    float: left;
    background: #193037;
    text-align: center;
}
#animate_container img {
    float: none;
    margin: 0px;
}

#animate_container2 img {
    float: none;
    margin: 0px;
}

#how_video_1 {
    margin: 10px auto;
}
.slider2_container.inactive {
    background: #d6d7d7;
}
.slider2_container.inactive .ui-slider-range,
.slider2container.inactive .ui-widget-content,
#idSlider2 {
    background: #aaabab;
}
.rangeslider,
.slider2_container .ui-widget-content {
    background: #5e6f83;
   /*  background:#ffffff; */
}
.slider2_container.inactive .ui-slider-handle {
    background: url("../img/nav_but-inactive.png") 50% 50% no-repeat;
    cursor: default;
}
.slider2_container .ui-slider-handle {
    cursor: pointer;
}
#rangeSlider1 {
    margin-top: 10px;
}
.rangeslider__handle {
    top: -7px !important;
}
.arrow a {
    color: #15a7b6;
}
.questions {
    display: none;
    line-height: 15px;
    padding-left: 9px;
    /* font-size: 11pt; */
    font-size:14px;
    font-weight: bold;
    font-family: Times New Roman;
    min-height: 345px;
}

.vertical-track {
    width: 4px;
    background-color: #999999;
}
.vertical-handle {
    width: 4px;
    background-color: #1aa8b6;
}
#question1,
#question2,
#question3 {
    margin-bottom: 12px;
}
.questions.active {
    display: block;
   /*  margin-right: 1.6%; */
     margin-right: 0.1%;
}
.questions .correctOption {
    background: url("../img/correct.png") 50% 50% no-repeat;
    width: 12px;
    height: 12px;
    position: absolute;
    left: -12px;
}
.questions .incorrectOption {
    background: url("../img/incorrect.png") 50% 50% no-repeat;
    width: 12px;
    height: 12px;
    position: absolute;
    left: -13px;
}
.navigation {
    width: 170px;
    margin: 9px auto;
    margin-left:15px;
}
.navigation::after {
    content: '';
    clear: both;
    display: block;
}
.quesNav {
    width: 16px;
    height: 16px;
    border: 1px solid #454948;
    border-radius: 8px;
    text-align: center;
    float: left;
    margin: 0px 5px;
    line-height: normal;
    text-decoration: none;
    color: #000;
    font-family: Times New Roman;
    font-weight: bold;
    font-size: 9pt;
}
.quesNav.inActive {
    background: #cdcccc;
    border-color: #b0b0af;
}
.quesNav.active {
    background: #1aa8b6;
    border-color: #454948;
    color: #fff;
}
.quesNav img {
    margin: 0px 0px;
    float: none;
}
.quesNav span {
    margin: 2px 0px;
    font-family: Times New Roman;
    font-weight: bold;
}
.equations {
    margin: 3px;
    /* font-size: 12px; */
    font-size: 13px;
    font-weight: bold;
    line-height: 15px;
    font-family: Arial;
}
.equationDiv {
    float: left;
    margin: 0 0 0 9px;
}
.equationDiv .equa {
    display: none;
    width: 341px;
    height: 120px;
    text-align: center;
    border-top: none;
}
.discDiv {
    width: 248px;
    height: 120px;
    float: left;
    border-left: none;
}
.feedback {
    height: 54px;
    border-radius: 5px;
    background: #f6f7f8;
    border: 1px solid transparent;
    color: #323b47;
    font-size: 18px;
    text-align: center;
    line-height: 54px;
    display: none;
}
.headText {
    font-weight: bold;
}
.rangeslider__handle,
.rangeslider__handle:active {
    background-position: 6px 0px;
}
.popupParent {
    background: rgba(0, 0, 0, 0.5);
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    display: none;
    z-index: 999999;
}
.popupContent img {
    max-width: 100%;
    max-height: 100%;
    max-height: 475px;
    max-width: 663px;
}
.popup {
    position: relative;
    z-index: 99999;
    background: #ffffff;
    height: 475px;
    width: 663px;
    text-align: center;
    margin: auto;
    top: 105px;
}
.popupContent {
    max-height: 475px;
    max-width: 663px;
}
.closePopup {
    position: absolute;
    right: 10px;
    cursor: pointer;
    top: 5px;
}
#submit:disabled {
    opacity: 0.5;
    cursor: default;
}
.equaText {
    font-size: 12px;
    font-family: Arial;
    color: #1aa8b6;
    text-decoration: none;
    cursor: default;
    text-align: left;
    position: absolute;
    left: 10px;
    top: 10px;
}
.videoLink {
    height: 20px;
    width: 189px;
    position: absolute;
    left: 47px;
    bottom: 43px;
    cursor: pointer;
}
.slider-box-div .slider-box1.selected,
.slider-box-div .slider-box2.selected {
    border: 2px solid #231F20;
    padding: 0;
}
/*changed width: 130px;*/
.canvas_control_4 {
    float: right;
    width: 265px;
    height: 26px;
}

.axis_radio_container {
    text-align: center;
    font-size: 11px;
}
.discDiv_right,
.discDiv_left {
    float: left;
    padding: 37px 0 0 5px;
}
.discDiv_left {
    width: 153px;
}
.discDiv_text,
.discDiv_value {
    padding-bottom: 15px;
    color: #000000;
    font-size: 13px;
}
.inner_content_container {
    text-align: left;
    height: 60px;
    vertical-align: middle;
}
#region_header_text_0_0,
#region_header_text_0_1 {
    display: inline-block;
    padding: 37px 10px 0 10px;
    vertical-align: middle;
    height: 23px;
    color: #000000;
    font-size: 12px;
}
#region_header_text_0_2,
#region_header_text_0_3 {
    display: inline-block;
    padding: 23px 2px 0 1px;
    vertical-align: middle;
    height: 35px;
    color: #000;
    font-size: 13px;
}
#region_header_text_1_2,
#region_header_text_1_3 {
    display: inline-block;
    padding: 23px 2px 0 1px;
    vertical-align: middle;
    height: 35px;
    color: #000;
    font-size: 13px;
}
#region_header_text_2_2,
#region_header_text_2_3 {
    display: inline-block;
    padding: 23px 2px 0 1px;
    vertical-align: middle;
    height: 35px;
    color: #000;
    font-size: 13px;
}
#region_equation_image_0_0,
#region_equation_image_0_1 {
    display: inline-block;
    vertical-align: middle;
}
#region_equation_image_0_0 img {
    margin: 3px 0 0 25px;
}
#region_equation_image_0_1 img,
#region_equation_image_1_1 img,
#region_equation_image_2_1 img {
    margin: 1px 0 0 -12px !important;
}
#region_header_text_1_0,
#region_header_text_1_1 {
    display: inline-block;
    padding: 37px 10px 0 10px;
    vertical-align: middle;
    height: 23px;
    color: #000000;
    font-size: 12px;
}
#region_equation_image_1_0,
#region_equation_image_1_1 {
    display: inline-block;
    vertical-align: middle;
}
#region_equation_image_1_0 img,
#region_equation_image_1_1 img {
    margin: 24px 0 0 7px;
}
#region_header_text_2_0,
#region_header_text_2_1 {
    display: inline-block;
    padding: 37px 10px 0 10px;
    vertical-align: middle;
    height: 23px;
    color: #000000;
    font-size: 12px;
}
#region_equation_image_2_0,
#region_equation_image_2_1 {
    display: inline-block;
    vertical-align: middle;
}
#region_equation_image_2_0 img {
    margin: 23px 0 0 0 !important;
}
/* .canvas-control {
    border: 1px solid #15A7B6;
    background: #fff;
    width: 590px;
    margin: 0 auto;
} */
.canvas-control::after {
    clear: both;
    float: none;
}
.integration_equation_y,
.integration_equation_x {
    display: none;
}
.integration_equation_y.active,
.integration_equation_x.active {
    display: block;
}
.vjs-text-track-display {
    bottom: 1em !important;
}
.vjs-control-bar {
    bottom: -30px !important;
}
#no_of_discs,
#width_of_discs,
#sum_volume_of_discs,
#region_header_text_0_3,
#region_header_text_1_3,
#region_header_text_2_3 {
    color: #1AA8B6 !important;
}
.integration_equation_y,
.integration_equation_x {
    max-width: 88px !important;
    max-height: 57px !important;
}
.questions label input {
    vertical-align: top;
}
/*-----------Washer----------*/
#washer_instruction {
    margin-top: 5px;
    width: 251px;
    position: absolute;
    height: 118px;
    background-color: #FFF;
    z-index: 100000;
    opacity: 1;
    border-radius: 10px;
    border: 2px solid #15A7B6;
    font-size: 12px;
}
#washer_text {
    padding: 5px;
}
#washer_header {
    padding: 3px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    width: 245px;
    height: 14px;
    background-color: #15A7B6;
    color: #fff;
    font-weight: 600;
}
.washer_volume_indicator {
    display: inline-block;
    width: 25px;
    height: 20px;
    text-align: center;
    background-color: #15A7B6;
    padding-top: 2px;
    color: red;
    font-weight: 600;
    margin-left: -15px;
    font-size: 17px;
}
.washer_volume_indicator_arrow {
    display: inline-block;
    width: 150px;
    height: 40px;
    background: url('../img/arrow_washer_indicator.png') no-repeat;
}
.drawTangent {
    float: left;
    padding: 3px 0;
    color: #15a7b6;
}
.radioType {
    float: right;
    padding: 3px 0;
    margin-right: 10px;
}
.coordinateInput {
    width: 40px;
    padding: 0;
}
#equation_container {
    float: left;
    width: 100%;
    height: 115px;
    padding-left: 10px;
    padding-top: 9px;
    font-weight: bold;
    text-align: center;
}
.pointsContainer {
    float: left;
    width: 322px;
    height: 115px;
    padding-top: 9px;
    font-weight: bold;
    text-align: center;
}
#graph_equation_1_eq1 {
    width: inherit;
    height: inherit;
    /*background: url('../img/equations/scenario01_eq02.svg') no-repeat 50% 50%;*/
    background: url('../img/equations/region01_eq03.svg') no-repeat center center;
    padding-top: 5px;
    font-size: 13px;
}
#graph_equation_2_eq2 {
    width: inherit;
    height: inherit;
    /*background: url('../img/equations/scenario01_eq02.svg') no-repeat 50% 50%;*/
    background: url('../img/equations/region02_eq03.svg') no-repeat center center;
    padding-top: 5px;
    font-size: 14px;
}
#graph_equation_3_eq3 {
    width: inherit;
    height: inherit;
    /*background: url('../img/equations/scenario01_eq02.svg') no-repeat 50% 50%;*/
    /*background: url('../img/equations/region03_eq02.svg') no-repeat center center;*/
    padding-top: 5px;
    font-size: 13px;
    background: none;
}
#rotation_arrow_container {
    float: left;
    position: relative;
    width: 175px;
    height: 128px;
}
#claculation_container {
    float: left;
    width: 175px;
    height: 128px;
}
#graph_equation_2 {
    /*width: inherit;*/
    height: inherit;
    /*background: url('../img/equations/scenario01_eq02.svg') no-repeat 50% 50%;*/
    background: url('../img/equations/region02_eq01.svg') no-repeat center center;
    padding-top: 5px;
    width: 100%;
}
#graph_equation_3 {
    /*width: inherit;*/
    height: inherit;
    background: url('../img/equations/region03_eq01.svg') no-repeat center center;
    padding-top: 5px;
    width: 100%;
}
#graph_equation_1 {
    /*width: inherit;*/
    height: inherit;
    background: url('../img/equations/region01_eq01.svg') no-repeat center center;
    padding-top: 5px;
    width: 100%;
}
.equation_left {
    float: left;
    width: 296px;
    border-right: 1px solid #ccc;
}
.equation_right {
    float: left;
    width: 296px;
}
#u_vector_container {
    position: relative;
}
#d_frac_image_container {
    position: absolute;
    background: url('../img/equations/region02_eq02.svg') no-repeat 50% 50%;
    width: 60px;
    height: 50px;
    left: -28px;
}
#equal_container {
    position: absolute;
    top: 16px;
    left: 38px;
    font-size: 14px;
}
#coor_image_container {
    position: absolute;
    top: 11px;
    left: 50px;
}
#d_vector_container {
    position: relative;
    top: 60px;
    left: -10px;
}
#d_image_container {
    position: absolute;
    width: 50px;
    height: 50px;
    background: url('../img/equations/region02_d.svg') no-repeat 50% 50%;
}
#equal_container1 {
    position: absolute;
    top: 21px;
    left: 37px;
}
#coor_input_container {
    position: absolute;
    top: 15px;
    left: 50px;
}
#rotation_arrow {
    left: 84px;
    top: 53px;
    position: absolute;
    width: 44px;
    height: 25px;
    background: url('../img/equations/region02_arrow.svg') no-repeat;
}
.question_inner_container {
    position: relative;
    min-height: 490px;
    display: none;
}
.question_inner_container.active {
    display: block;
}
.submit-but.disable {
    opacity: 0.5;
    cursor: default;
}
.incorrectIcon {
    position: absolute;
    left: -11px;
    width: 12px;
    height: 12px;
    background: url('../img/incorrect.png') no-repeat;
    margin-right: 2px;
    display: none;
    margin-top:1px;
}
.correctIcon {
    display: none;
    position: absolute;
    left: -11px;
    width: 12px;
    height: 12px;
    background: url('../img/correct.png') no-repeat;
    margin-right: 2px;
     margin-top:1px;
}

.incorrectIcon1 {
    position: absolute;
    left: -8px;
    width: 12px;
    height: 12px;
    background: url('../img/incorrect.png') no-repeat;
    margin-right: 2px;
    display: none;
}
.correctIcon1 {
    display: none;
    position: absolute;
    left: -8px;
    width: 12px;
    height: 12px;
    background: url('../img/correct.png') no-repeat;
    margin-right: 2px;
}



#draggableArrow {
    margin-left: 20px;
    cursor: pointer;
}
#output_container {
    position: absolute;
    right: 10px;
    top: 334px;
    font-family: times;
    font-size: 30px;
    color: #fff;
    height: 40px;
    vertical-align: middle;
    width: 370px;
    text-align: right;
}
#output_container img {
    float: none;
    margin: 0 0 -14px 0;
    padding: 0;
}
#popup_container {
    display: none;
    position: absolute;
    padding: 10px;
    width: 200px;
    border: 1px solid white;
    border-radius: 5px;
    color: black;
    top: 266px;
    right: 11px;
    background-color: white;
}
#triangle-down {
    z-index: 10000;
    position: absolute;
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 20px solid white;
    top: 66px;
    right: 10px;
}
.coordinateInput:disabled {
    background-color: #eee;
}
[type="radio"],
[type="checkbox"] {
    cursor: pointer;
}
input[type="radio"]:disabled,
input[type="checkbox"]:disabled {
    cursor: default;
}
.coorRadio {
    float: left;
    width: 13px;
    height: 13px;
    background-color: transparent;
    margin: 0 2px 0 0;
    border-radius: 10px;
    border: 1px solid gray;
    cursor: pointer;
}
.coorRadio.active {
    background-color: blue;
    cursor: default;
}
.vjs-captions-button,
.vjs-text-track-display {
    /*display: none !important;*/
}
.pointsInput .bluePoints {
    width: 40px;
    color: #15a7b6;
    text-align: center;
}
.pointsInput {
    color: #15a7b6;
}
.clearfix {
    display: block;
    clear: both;
}
.pointsContainer .row {
    width: 100%;
    display: block;
    position: relative;
    /*height:40px;*/
    padding: 10px;
}
.pointText {
    display: inline-block;
    width: 200px;
}
.bluePoints.readonly {
    border: none;
    background: none;
    width: 60px;
    text-align: right;
}
.secentLine,
.tangentLine {
    width: 157px;
    float: right;
    /*margin-right:20px;;
margin-top: -6px;*/
}
.blue {
    color: #15a7b6;
}
.ui-slider-handle {
    padding-left: 8px;
    padding-bottom: 2px;
}
#delta1_slider,
#delta2_slider {
    width: 241px;
    height: 26px;
    padding: 0 10px 0 10px;
    float: left;
    background-color: #183138;
}
#delta1_slider_track,
#delta2_slider_track {
    width: 35px;
    height: 20px;
    background-color: white;
    float: left;
    width: inherit;
    height: 5px;
    background-color: #aaabab;
    margin-top: 10px;
}
.tooltip {
    position: absolute;
    z-index: 1030;
    display: block;
    visibility: visible;
    font-size: 11px;
    line-height: 1.4;
    opacity: 0;
    filter: alpha(opacity=0);
}
.tooltip.in {
    opacity: 0.8;
    filter: alpha(opacity=80);
}
/* .tooltip.top {
    margin-top: -3px;
    padding: 5px 0;
    top: -200%;
} */
.tooltip.right {
    margin-left: 3px;
    padding: 0 5px;
}
.tooltip.bottom {
    margin-top: 3px;
    padding: 5px 0;
}
.tooltip.left {
    margin-left: -3px;
    padding: 0 5px;
}
.tooltip-inner {
    /*width:23px;*/
    min-width: 35px;
    padding: 8px;
    color: #ffffff;
    text-align: center;
    text-decoration: none;
    background-color: #000000;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}
.tooltip-arrow {
    position: absolute;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
}
/* .tooltip.top .tooltip-arrow {
    bottom: 0;
    left: 50%;
    margin-left: -5px;
    border-width: 5px 5px 0;
    border-top-color: #000000;
} */
.tooltip.right .tooltip-arrow {
    top: 50%;
    left: 0;
    margin-top: -5px;
    border-width: 5px 5px 5px 0;
    border-right-color: #000000;
}
.tooltip.left .tooltip-arrow {
    top: 50%;
    right: 0;
    margin-top: -5px;
    border-width: 5px 0 5px 5px;
    border-left-color: #000000;
}
.tooltip.bottom .tooltip-arrow {
    top: 0;
    left: 50%;
    margin-left: -5px;
    border-width: 0 5px 5px;
    border-bottom-color: #000000;
}
.slider-tip {
    opacity: 1;
    top: 85%;
    /*margin-left: -1.1em;*/
    margin-left: -18px;
}
.myLabel {
    border: 1px solid black;
    border-radius: 3px;
    padding: 5px;
    background: #DAE7EF;
    font-size: 10px;
    width: 95px;
    display: none;
}
#jsxgbox2 .myLabel {
    background: red !important;
    color: white !important;
    font-size: 16px;
    width: 80px;
    display: block;
}
.xpointinputbox {
    float: left;
    width: 60px;
}
.xPoint {
    width: 35px;
    text-align: center;
}
#xPoint1 {
    position: relative;
    top: 9px;
    left: 29px;
}
#xPoint2 {
    position: relative;
    top: 3px;
    left: 28px;
    width: 45px;
}
#xPoint3 {
    position: relative;
    top: 4px;
    left: 62px;
}
#xPoint1_Int,
#xPoint1_Int1,
#xPoint2_Int,
#xPoint2_Int1,
#xPoint3_Int,
#xPoint3_Int1 {
    border: 0;
    background: none;
}
#xPoint1_Int {
    position: relative;
    top: -6px;
    left: 65px;
    font-size: 10px;
}
#xPoint1_Int1 {
    position: relative;
    top: 36px;
    left: 26px;
    font-size: 10px;
}
#xPoint2_Int {
    position: relative;
    top: -11px;
    left: 56px;
    font-size: 10px;
}
#xPoint2_Int1 {
    position: relative;
    top: 36px;
    left: 18px;
    font-size: 10px;
}
#xPoint3_Int {
    position: relative;
    top: -11px;
    left: 96px;
    font-size: 10px;
}
#xPoint3_Int1 {
    position: relative;
    top: 33px;
    left: 57px;
    font-size: 10px;
}
#graph_equation_1_eq1 .secentLine {
    position: relative;
    /*top: 96px;*/
    top: 89px;
    left: -29px;
}
#graph_equation_2_eq2 .secentLine {
    position: relative;
    /*top: 80px;*/
    top: 94px;
    left: -20px;
}
#graph_equation_3_eq3 .secentLine {
    position: relative;
    top: 78px;
    left: 26px;
}
.ui-slider-handle {
    cursor: pointer !important;
}
.questions label p,
.questions label input {
    float: left;
}
.questions label input {
    margin-right: 2px;
    margin-top: 1.5px;
}
.questions label p {
    max-width: 140px;
    margin-top: -2px;
    margin-bottom: 0;
    margin-left: 3px;
}
.questions label:after {
    content: " ";
    clear: both;
    display: block;
}
.questions sub {
    left: -7px;
    /* right: 3px; */
    position: relative;
    top: 2px;
    font-size: 9px;
}
.questions sup {
    font-size: 9px;
    position: relative;
    top: -3px;
}
.rightLabel {
    left: 150px!important;
    top: -336px !important;
    position: relative;
    font-weight: bold;
}
.leftLabel {
    left: 165px!important;
    top: -336px !important;
    position: relative;
    font-weight: bold;
}
/* .topic5 ellipse {;
display: none;;
} */
.redText {
    color: red;
}
/*heading title */
.titlebg {
    background-color: #273a7d;
}
.title {
    font-family: Arial;
    text-transform: uppercase;
    font-size: 13px;
    font-weight: bold;
    height: 17px;
    padding-top: 5px;
    padding-top: 7px;
    padding-left: 15px;
}
.close_main a {
    font-family: webdings;
    color: white;
    text-decoration: none;
    font-size: 20px;
}
.close_main {
    padding: 1px 15px 0px 0;
    transform: scale(1.3, 1.3);
}
/*Concept Tab*/
html ul.tabs li.active a {
    color: white;
    background: #2288c7;
}
ul.tabs li a {
    background: #aecfea;
    width: 265px;
    font-family: Arial;
    font-size: 13px;
    font-weight: bold;
}
ul.tabs {
    /*height: 30px;*/
}
ul.tabs li {
    margin-right: 2px;
    /*    height: 30px;;
line-height: 20px;*/
}
ul.tabs li:last-child {
    margin-right: 0;
}
ul.tabs li:last-child a {
    width: 266px;
}
.wrapper {
    border-bottom: 1px solid #ebeced;
    padding: 5px;
    padding-top: 0px;
}
p.desc {
    border: 0;
    margin: 0;
    padding: 0;
}
.body-data {
    font-family: Times New Roman;
    font-size: 15px;
    font-weight: normal;
}
.footer-data {
    font-family: Times New Roman;
    font-size: 12px;
}
/*Explore and Test Tab*/
.canvas-title {
    font-size: 11px;
    font-family: Arial;
    padding-left: 2px;
    text-transform: uppercase;
}
#id_solid1,
#id_solid2,
#id_solid3 {
    font-size: 13px;
    font-family: Arial;
    line-height: 18px;
}
.desc1 {
    font-family: Arial;
    font-weight: bold;
    font-size: 13px;
}
.imageBlock-contents {
    font-size: 15px;
    font-family: Times New Roman;
}
/*graph section*/
.equationDiv {
    font-size: 12px;
}
.yAxisLabel {
    width: 2%;
    height: 1%;
    float: left;
    margin-left: auto;
    margin-right: auto;
    -ms-transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    font-size: 9.5px;
}
.xAxisLabel1 {
    margin-left: 25%;
    width: 30%;
    height: 4px;
    font-size: 9.5px;
}
.xAxisLabel2 {
    margin-left: 25%;
    width: 100%;
    height: 2px;
    font-size: 9.5px;
    margin-top: 57%;
}
.xAxisLabel3 {
    margin-left: 25%;
    width: 100%;
    height: 2px;
    font-size: 9.5px;
}
.scenario3YAxisLabel1 {
    margin-top: 23em;
    margin-left: 2.2%;
}
.scenario3YAxisLabel2 {
    margin-top: 15.7em;
    margin-left: 2.2%;
}
.scenario3YAxisLabel3 {
    margin-top: 34em;
    margin-left: -6px;
}
 
#Region1outputbox1{
	
	width: 98%;
    height: 348px;
    float: left;
    margin: 1% 1%;
    /* margin-top: 1%;
    margin-bottom: 2%;
    margin-right: 1%; */
      overflow : hidden;
}
#Region2outputbox1 {
   
    width: 98%;
    height: 348px;
    float: left;
    margin: 1% 1%;
    /* margin-top: 1%;
    margin-bottom: 2%;
    margin-right: 1%; */
      overflow : hidden;
  
}

#Region3outputbox1 {
	
	width: 98%;
    height: 348px;
    float: left;
    margin: 1% 1%;
    /* margin-top: 1%;
    margin-bottom: 2%;
    margin-right: 1%; */
      overflow : hidden;
	
}

#mathMLEquationsLeft {
    width: 30%;
    margin-left: 1%;
    margin-top: 1%;
    float: left;
    border-right: 1px solid #ccc;
    height: 85px;
}
#mathMLEquationsCenter {
    width: 34%;
    margin-right: 1%;
    margin-left: 1%;
    margin-top: 1%;
    float: left;
    border-right: 1px solid #ccc;
    height: 85px;
}
#mathMLEquationsRight {
    width: 31%;
    margin-right: 1%;
    margin-top: 1%;
    float: left;
}
 
.textOnGraph {
    font-family: MathJax_Math-italic;
}
.prev img {
    margin: -1px 0px;
    margin-right: 2px;
    border: none;
}
.next img {
    margin: -1px 0px;
    margin-left: 2px;
      border: none;
}
#questions_container {
    padding-top: 35px;
   /*  overflow: hidden; */
}
#tangentEquations {
    font-size: 11pt;
    font-weight: bold;
    font-family: Times New Roman;
    width: 100%;
    float: left;
    /* margin-left: 7%; */
    margin-top: 1.5%;
}
button.ui-state-default {
    border: #e9e9e9;
    background: #e9e9e9;
    font-weight: bold;
    background-image: none;
}
.ui-dialog-titlebar {
    display: none!important;
}
.ui-button-text {
    background: #ffffff;
    border: 1px solid #aaa;
    border-radius: 7px;
}
.ui-widget-header {
    border: none;
}
.ui-widget-content {
  /*   border: none; */
    /*background: #e9e9e9;*/
}
.ui-state-default .ui-icon {
    background-image: none;
}
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
    float: none;
    margin-left: 45%;
}
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
    border: #e9e9e9;
}
.ui-dialog {
    border: 3px solid #ffffff;
    border-radius: 7px;
}
#dialog-message {
    display: none;
}
.twoDecimalNumbersOnly {
    width: 58px;
    height: 15px;
    vertical-align: -webkit-baseline-middle;
    text-align: center;
    position: relative;
    top: 10%;
}
/* #showTangent {
    margin-right: 0;
    position: relative;
    top: 4px;
} */
.MathJax,.MathJax_Display {
    vertical-align: baseline;
}
.mathMLFont {
    font-family: MathJax_Math-italic;
    /*font-weight: normal; */
   /*  font-weight: bold; */
}
.scenario2QuestionsScroll {
    max-height: 345px;
    overflow: hidden;
    width: 166px;
    padding-right: 4px;
    outline: none;
}

.dialogModalBG{
	background-color: rgba(189, 187, 187, 0.85);
    height: 360px;
    z-index: 10;
    opacity: 0.8;
}
.overlay {
    position: absolute;
    top: 78px;
    left: 99px;
    height: 268px;
    z-index: 10;
    background-color: white;
}
#centerBtn{
	width: 25%;
    margin-left: 38.5%;
    margin-top: 1%;
    float: left;
    font-size: 11pt;
    font-weight: bold;
}
#checkBtn{
	border: none;
    height: 32px;
    border-radius: 3px;
    cursor: pointer;
    font-weight: 500;
}
#centerBtnscenario3{
	width: 29%;
    margin-left: 41.5%;
    margin-top: 1%;
    float: left;
    font-size: 11pt;
    font-weight: bold;
}
#canvas_cont_navigationbar {
    padding: 4px !important;
    background-color: #d2d2d2 !important;
}
#canvas_cont_navigationbar span:nth-child(3) {
    margin-right: 5px;
}
.SectionButton{
	margin:0 3%;
}

.tempAdjustRedio{
		margin-left: 4px !important
	   
}
.tempAdjustCorrectIcon{
		left: -7px !important
	   
}
.hyperbolaEqLeftRight,.hyperbolaEqUpDown{
	margin-top: 3%;
	margin-bottom: -5%;
}



/*For topic25 16-8-2016*/
.mathMLEquations {
    width: 98.5%;
    height:23%;
  /*   overflow-y: auto;
     overflow-x: hidden; */
}

.scenario1{
	 width: 100%;
  /*   height:98%; */
   /*  overflow-y: auto; */
}

.scenario2{
	 width: 98%;
  /*   height:98%; */
   /*  overflow-y: auto; */
}

.scenario3{
	 width: 98%;
   /*  height:98%; */
  /*   overflow-y: auto; */
}

.tooltip{position:absolute;z-index:1030;display:block;visibility:visible;font-size:11px;line-height:1.4;opacity:0;filter:alpha(opacity=0);}.tooltip.in{opacity:0.8;filter:alpha(opacity=80);}
.tooltip.top{margin-top:-3px;padding:5px 0;top:-200%;}
.tooltip.right{margin-left:3px;padding:0 5px;}
.tooltip.bottom{margin-top:3px;padding:5px 0;}
.tooltip.left{margin-left:-3px;padding:0 5px;}
.tooltip-inner{/*width:23px;*/min-width:35px;padding:8px;color:#ffffff;text-align:center;text-decoration:none;background-color:#000000;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;}
.tooltip-arrow{position:absolute;width:0;height:0;border-color:transparent;border-style:solid;}
.tooltip.top .tooltip-arrow{bottom:0;left:50%;margin-left:-5px;border-width:5px 5px 0;border-top-color:#000000;}
.tooltip.right .tooltip-arrow{top:50%;left:0;margin-top:-5px;border-width:5px 5px 5px 0;border-right-color:#000000;}
.tooltip.left .tooltip-arrow{top:50%;right:0;margin-top:-5px;border-width:5px 0 5px 5px;border-left-color:#000000;}
.tooltip.bottom .tooltip-arrow{top:0;left:50%;margin-left:-5px;border-width:0 5px 5px;border-bottom-color:#000000;}


.slider-tip {
    opacity: 1;
    top: 85%;
    /*margin-left: -1.1em;*/
	margin-left: -18px;
}

.ui-slider-handle{
	border:none !important;
	outline:none !important;
	top:-6px !important;
}

.ui-slider-handle{
    padding-left: 8px;
  padding-bottom: 2px;
}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
    /* border: 1px solid #cccccc; */
    background: url("../img/nav_but.png") 50% 50% no-repeat;
    font-weight: bold;
     color: #1c94c4; 
}


/* .scenario2 .tooltip.top.slider-tip,
.scenario3 .tooltip.top.slider-tip  */

.scenario1 .tooltip.top.slider-tip,
.scenario2 .tooltip.top.slider-tip
{
    margin-left: -20px;
    top: -200%;
}

/*Topic21 css On 17 nov*/

canvas {
	width: 580px!important;
	height: 350px!important;
	 margin: 2px 2px;
}

#scenario1Div1{
	width: 99%;
    float: left;
    height:25%;
}

.checkboxDiv{
	width: 26%;
	text-align: center;
    float: left;
}

.sliderDiv{
	 width: 70%;
     float: left;
     margin-left: 22px;
}
#scenario1RectangleSlider{
	width: 90%;
    margin-left: 4%;
    margin-right: 1%;
    float: left;
    height:5px;
}

#scenario1Div2{
	width: 99%;
    margin-left: 1%;
    float: left;
    height:38%;
    margin-top: 2%;
}
.integral1Value1{
	width: 60%;
    float: left;
}

.integral1Value2{
    width: 38%;
    text-align: right;
    margin-top: 2%;
    float: right;
}
.integral1Value3{
	 float: right;
    text-align: right;
    margin-top: 13px;
}
.integral1Value4{
    width: 60%;
    float: left;
    margin-top: 1%;
}


#scenario1Div3{
	width: 99%;
    margin-left: 1%;
    float: left;
    height:38%;
}

#equationsRightScenario2 {
    width: 50%;
    margin-right: 1%;
    margin-top: 2%;
    float: left;
    font-weight: bold;
    height:89%;
    
}
#equationsLeftScenario2 {
    width: 45%;
    margin-right: 1%;
    margin-left: 1%;
    margin-top: 1%;
    float: left;
    font-weight: bold;
    height:89%;
}


.scenario2Slider2{
	width : 49%;
	height :28%;
	float : left;
}

#scenrio2SliderEndTime{
	width:90%;
	height:8px;
	margin-left: 80px;
    margin-top: -12px;
}

.Scenario2SliderValue2{
	width:5%;
	height:8px;
	float:right;
	margin-top: -11px;
    margin-right: -90px;
	
}

.scenario2Left1{
	width : 15%;
	height :15%;
	float:left;
}

.SpeedinIntegral3{
	float: left;
    padding-left: 15px;
    border-right: 3px solid #15A7B6;
    height: 20px;
    margin-top: -7px;
    padding-bottom: 7px;
    padding-right: 28px;
    width: 197;
    padding-top: 4px;
}
.scenario3RBtn{
	margin-top: 4px;
    margin-left: 13px;
}

#scenario3Div1{
	 width: 98%;
    float: left;
    height:35%;
}

.scenario3MathmlEquation{
	margin-left:5px;
}


#IdforSLowInScene3{
	margin-top: 5px;
    margin-left: 10px;
    float: left;
}
#IdforFastInScene3{
	margin-top: -16px;
    margin-left: 13px;
    float: left;

}
#IdforSpeedInScene3{
	margin-top: 3px;
    margin-left: 3px;
    float: left;
}
#IdfornInScene1{
	margin-top: 3px;
    margin-left: 3px;
    float: left;
}

#scenario3Label1{
	width : 24%;
	height: 90%;
	float:left;
	margin-left:1px;
	margin-top:-2px;
}
#scenario3RadioBtnDiv{
	height: 90%;
	margin-left:1px;
}

.scenario3Slider{
	width : 59%;
	height: 30%;
	float:right;
	margin-right:1px;
}
.scenario3SliderLabel1{
	width : 24%;
	height: 30%;
	float:left;
	/* margin-right:1px; */
}
.scenario3SliderDiv{
	width : 63%;
	height: 30%;
	float:left;
	margin-top:3px;
}

#MarginTopForAnswer{
	margin-top: 0;
}
/*Slider divs css  */
.TimeDivInScenario2{
	border: 1px solid #15A7B6;
    height: 27px;
    margin-top: -7%;
    margin-left: 3%;
    width: 226%;
}
.TimeDivInScenario2_2{
	
    border: 1px solid #15A7B6;
    border-left-width: initial;
    height: 27px;
    margin-top: -12px;
    margin-left: 19%;
    width: 204%;
}
.graphSliderContainerInScene2{
	background: black;
    width: 193px;
    height: 27px;
    margin-left: -15%;
    margin-top: -18%;
}
.graphSliderContainerInScene2_2{
    background: black;
    width: 193px;
    height: 27px;
    margin-left: -14%;
    margin-top: -35px;
}
.TimeinScene2{
	width: 252px;
    height: 31px;
    float: left;
    /* padding-left: 295px; */
    padding-top: 12px;
    margin-top: -8px;
    margin-left: 7px;
   
}
.TimeinScene2_2{
	width: 252px;
    height: 31px;
    float: left;
    /* padding-left: 295px; */
    padding-top: 12px;
    margin-top: -8px;
    margin-left: 12px;
   
}

.RectanglesInScene1{
	float: left;
    /* border: 1px solid #15A7B6;
    border-left-width: initial; */
    margin-left: -277%;
    height: 27px;
    padding-top: 3%;
}
.TimeinIntegral2{
    width: 252px;
    height: 27px;
    float: left;
   /*  padding-left: 295px; */
    padding-top: 6px;
}
.graphSliderContainer {
       background: black;
    /* float: right; */
    width: 285px;
    height: 27px;
    /* margin-right: -242px; */
    margin-left: 264px;
    padding-top: 10px;
}
.scenario3SliderValue{
	padding-left: 0px;
    float: right;
    margin-top: -30px;
    margin-right: 1px;
    height: 9px;
    width: 29px;
}
.sliderMaxValue{
	
}

/*Slider divs css  */
.scrollbox {
   /*  overflow: auto !important;  */
    overflow-y:hidden !important; 
   
   /*  This is changed by enscroll, but must be defined */
    width: 170%;
}

.ControlAreaFont{
	font-size: 13px;
	font-family: "Times New Roman";
	font-weight: bold;
}
/*  .css updated for control area */
.canvas-control {
    border: 1px solid #15A7B6;
    background: #fff;
    width: 590px;
    margin: 0 auto;
}
.canvas_control_1 {
    width: 100%;
    display: inline-flex;
    height: 26px;
    float: left;
    text-align: right;
}
.integral1_nAndinfinity{
	width:18%;
}
.nAndinfinity{
	 font-size: 14px;
	 font-weight: bold;
	 float: left;
	 width:72%;
	 margin-top:3px;
	 color:#1aa8b6;
	/*  margin: 4px 8px; */ 
}
.NumberRectangles{
	width: 22%;
    padding-top: 4px;
  /*   border-left-color: 1px solid blue; */
    margin-right: 1%;
     margin-left: 1%;
    font-size: 13px;
    font-weight: bold;
    font-family: "Times New Roman";
    	 border: 0px solid #15A7B6;
    	  border-left-width: 3px;
   color:#1aa8b6;
}
.scenarioSliderContener {
    width: 52%;
    /* float: right; */
    height: 26px;
    background-color: #193036;
}
.timeValInScene1{
	/* color:#000; */
	font-size: 14px;
	 font-weight: bold;
	 float: left;
	 width:6%;
	 text-align: center;
    margin-top: 3.5px;
    color:#1aa8b6;
	/*  margin: 4px 15px;  */
}
.canvas_control_2 {
    width: 100%;
    float: left;
    height: 26px;
    display: inline-flex;
}
.StartTimeInScene2{
	 font-size: 13px;
	 font-weight: bold;
	 float: left;
	 width:11%;
	 text-align:center;
	  padding-top: 4px;
	/*  margin: 4px 8px;  */
	 font-family: "Times New Roman"
}

.TimeValInScene2{
	float: left;
   /*  margin-left: 6px;
    margin-top: 4px; */
    width:6%;
     text-align:center;
     margin-top:3.5px;
}
.EndTimeInScene2{
	width: 11%;
    padding-top: 4px;
   /*  margin-right: 1%; */
    margin-left: 1%;
    font-size: 13px;
    font-weight: bold;
    font-family: "Times New Roman";
    border: 0px solid #15A7B6;
    border-left-width: 3px;
	float:left;
	height:initial;
	text-align:center;
}

.scenarioSliderContener2 {
    width: 32%;
    float: left;
    height: 26px;
    background-color: #193036;
}
#scenrio2SliderStartTime{
	width: 85%;
    height: 5px;
    margin-top: 10px;
    margin-left: 7%;
}
#scenrio2SliderEndTime{
    width: 81%;
    height: 5px;
    margin-left: 13px;
    margin-top: 10px;
}


.integral2Div1{
	width: 98%;
    margin-left: 1%;
  /*   margin-right: 1%; */
    height: 54px;
      float:left;
}
.integral2Div2{
	width: 98%;
    margin-left: 1%;
    float:left;
  /*   margin-right: 1%; */
    height: 54px;
}
.scenario2Integral1Value{
	width : 45%;
	height :28%;
	float:left;
	/* margin : 3px 2px;
	margin-top:17px; */
	text-align:center;
	margin-top:20px;
}

.scenario2Integral2Value{
	width : 45%;
	height :28%;
	float:right;
/* 	margin : 3px 2px; */
	text-align:center;
	margin-top:20px;
}

.scenario2Integral3Value{
	width : 45%;
	height :28%;
	float:left;
/* 	margin : 3px 2px; */
	text-align:center;
	/* margin-top:20px; */
}

.scenario2FunctionIntegralValue{
	width : 45%;
	height :28%;
	float:right;
/* 	margin : 3px 2px; */
	text-align:center;
	/* margin-top:20px; */
}

.canvas_control_3 {
    width: 100%;
    display: inline-flex;
    height: 26px;
    float: left;
    text-align: right;
}
.SpeedInInt3{
	float: left;
	width: 8%;
    margin-top: 4px;
}
.Radio1InInt3{
	float: left;    
	margin-top: 5px;
    width: 3%;
}
.SLowInInt3{
	float: left;
    width: 5%;
    margin-top: 4px;
}
.scenarioSliderContener3{
	width: 53%;
    float: left;
    height: 26px;
    background-color: #193036;
}
#scenario3TimeSlider{
	margin-top: 9px;
    width: 90%;
    margin-left: 4%;
}
.TimeDivInInt3{
	border: 0px solid #15A7B6;
    border-left-width: initial;
    width: 12%;
    margin-right: 2%;
    padding-top: 4px;
    height: 89%;
}
.FastInInt3{
	width: 4%;
    margin-top: 4px;
    margin-right: 2%;
}

#equationsScenario3 {
  
    width: 98%;
     margin-left: 4px;
    margin-top: 5%;
    float: left; 
    text-align:center;
    /* font-size: 11pt; */
    font-weight: bold;
    
}
/*css for unwanted scrollbar in windows 8*/
.unwantedScroll{
	  overflow-y: hidden;
	 overflow-x:hidden;
}