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: 6px 0px;
    width: 160px;
}
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;
}
/*changes width: 215px;*/
.canvas_control_2 {
    width: 150px;
    float: left;
    height: 26px;
    background-color: #193036;
}


#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"] {
	 cursor: pointer;
	   -moz-appearance: none;
    margin: 0px;
    padding: 0px;
    height: 12px;
    width: 12px;
   
}

input[type="checkbox"] {
	 cursor: pointer;
	 -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
}


.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;
}
.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: 11px;
    font-size: 11pt;
    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%;
}
.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;
	margin-bottom: 10px;
    font-size: 12px;
    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_rotation_txt {
    font-size: 12px;
    color: #1aa8b6;
    text-align: center;
    line-height: 1;
}
.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;
}
.correctIcon {
    display: none;
    position: absolute;
    left: -11px;
    width: 12px;
    height: 12px;
    background: url('../img/correct.png') no-repeat;
    margin-right: 2px;
}

.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"]:enabled,
input[type="checkbox"]:enabled {
    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;
}

.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: -1px;
    margin-bottom: 0;
    margin-left: 2px;
}

.tempLabelAdjustment{
	 margin-left: 1px  !important;
	  margin-right: 0px  !important;
}

.scenario23LabelAlgnment {
	 margin-top: -2px !important;
}
.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: 13px;
    font-family: Arial;
    padding-left: 5px;
}
#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: 96%;
    margin-left: 2%;
    margin-right:2%;
    margin-top:2%;
    margin-bottom:2%;
    height: 336px;
    float: left;
    overflow : hidden;
}
#Region2outputbox1,#Region3outputbox1 {
  width: 100%;
    height: 336px;
    float: left;
    margin-top: 2%;
    margin-bottom: 2%;
    margin-right: 2%;
    margin-left: 2%;
    overflow: hidden;
}

.scenario1QuestionsScroll {
    max-height: 345px;
    overflow: hidden;
    width: 166px;
    padding-right: 4px;
    outline: none;
}

#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;
}
#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;
}
/* 16April */
/* #equationsRightScenario2 {
    width: 20%;
    margin-left: 3%;
    margin-top: 1%; 
    float: left;
    font-size: 11pt;
    font-weight: bold;
}
#equationsCenterScenario2 {
    width: 20%;
    margin-left: 3%;
     margin-top: 1%; 
    float: left;
    font-size: 11pt;
    font-weight: bold;
    border-right: 1px solid #ccc;
}
#equationsLeftScenario2 {
    width: 50%;
    margin-left: 3%;
    margin-top: 1%; 
    float: left;
    font-size: 11pt;
    font-weight: bold;
    border-right: 1px solid #ccc;
}
#equationsRightScenario3 {
    width: 25%;
    margin-left: 5%;
	margin-top: -1%;
	margin-bottom: -1%;
    float: left;
    font-size: 11pt;
    font-weight: bold;
}
#equationsCenterScenario3 {
    width: 29%;
    margin-left: 3%;
    margin-top: -1%;
    margin-bottom: -1%;
    float: left;
    font-size: 11pt;
    font-weight: bold;
    border-right: 1px solid #ccc;
}
#equationsLeftScenario3 {
 	 width: 33%;
    margin-left: 4%;
    margin-top: 1%;
    float: left;
    font-size: 11pt;
    font-weight: bold;
    border-right: 1px solid #ccc;
}
#scenaio2EquationsModal{
	display: none;
	width: 430px;
}
#scenaio3EquationsModal{
	display: none;
	width: 430px;
} */
.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%;
}
/* .vertices{
	color:#009911;;
}
.foci{
	color:#e30405;
}
.hyperbolaButton{
	margin-top: -5PX;
}
.graphButton{
	border-color: rgb(26, 55, 182);
    background-color: #ffffff;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 13px;
    border-radius: 5px;
   
}
.graphButtonActive{
	border-color: rgb(26, 55, 182);
    background-color: #0000ff;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 13px;
    border-radius: 5px;
    
} */
.tempAdjustRedio{
		margin-left: 6px !important
	   
}
.tempAdjustCorrectIcon{
		left: -6px !important
	   
}
.hyperbolaEqLeftRight,.hyperbolaEqUpDown{
	margin-top: 3%;
	margin-bottom: -5%;
}



/*For topic25 16-8-2016*/
.mathMLEquations {
    width: 98.5%;
    height:18%;
    overflow-y: hidden;
    overflow-x: hidden;
    margin-top:1%;
}

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

.scenario2{
	 width: 104.5%;
    height:120%;
    overflow-y: auto;
}

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

#equationsRightScenario1 {
    width: 45%;
    margin-top: 1%;
    float: left;
    font-size: 11pt;
    height:89%;
    margin-left:1%;
}
#equationsLeftScenario1 {
    width: 49%;
    margin-left: 1%;
    margin-top: 2%;
    float: left;
    font-size: 11pt;
    height:89%;
}

#equationsRightScenario2 {
    width: 50%;
    margin-right: 1%;
    margin-top: .5%;
    float: left;
    font-size: 11pt;
    overflow: hidden;	
}
#equationsLeftScenario2 {
    width: 45%;
    margin-right: 1%;
    margin-left: 1%;
    float: left;
    font-size: 11pt;
    border-right: 1px solid #ccc;
    height:189 px;
    overflow:hidden;
}
#equationsRightScenario3 {
    width: 50%;
    margin-right: 1%;
    margin-top: 2%;
    float: left;
    font-size: 11pt;
    height:89%;
}
#equationsLeftScenario3 {
    width: 45%;
    margin-right: 1%;
    margin-left: 1%;
    margin-top: 2%;
    float: left;
    font-size: 11pt;
    border-right: 1px solid #ccc;
    height:89%;
}

#scenario1_Slider1{
	width:90%;
	height:21%;
	margin-top:10%;
	margin-left:1%;
}
#scenario1_Slider2{
	width: 90%;
    margin-top: -11%;
    margin-left: 1%;
}
#slider_name1{
	width:16%;
	height:90%;
	margin-top:9%;
	margin-left:1%;
}
#scenario1_Slider3{
	width:90%;
	height:29%;
	margin-top:3%;
	margin-left:1%;
}
#scenario1_Slider3_text{
	width:25%;
	height:32%;
	margin-top:1%;
	margin-left:1%;
	float:left;
}

.scenarioValue1,.scenarioValue2{
	width:96%;
	height:21%;
	margin-top:1%;
	margin-left:1%;
}
.scenarioValue1{
	margin-top:0%;
}
.scenario2Value1{
	margin:1%;
	margin-bottom:0%; 
}
.scenarioValue3{
	width:99%;
	height:48%;
	margin-top:-3%;
	margin-left:1%;
}

#scenario1Value3{
	width:99%;
	height:48%;
	margin-top:1%;
	margin-left:1%;
}
#scenario1_slider111{
	width: 85%;
    margin-top: -10%;
    float: right;
    margin-right: -11px;
}
#scenario1SliderN{
    width: 74%;
    float: left;
    margin-left: 20%;
}
#scenario1SliderAB{
	width: 63%;
    margin-left: 36%;
}

#scenario1SliderAB label {
  position: absolute;
  width: 20px;
  margin-top: 10px;
  margin-left: -10px;
  text-align: center;
}	

#scenario1_slider3_slider,#scenario2_slider1_slider{
	width: 100%;
}

#scenario1SliderN label {
  position: absolute;
  width: 20px;
  margin-top: 10px;
  margin-left: -12px;
  text-align: center;
}	



.canvas_control_11 {
    border: 1px solid #acacac;
    border-radius: 0px 0px 2px 2px;
    border-top: none;
    background-color: #fff;
    margin: 0 auto;
    color: #15a7b6;
    font-size: 14px;
    height: 16px;
    width: auto;
    float: left;
    margin-left: 2%;
    margin-top: 4.5%;
}


 #scenario2_slider1{
	width:25%;
	height:32%;
	margin-top:1%;
	margin-left:1%;
	
} 
#scenario2_Slider1_text{
	width:25%;
	height:32%;
	margin-top:0%;
	margin-left:1%;
}


#scenario2-slider1{
	width:90%;
	height:32%;
	margin-top:1%;
	margin-left:1%;
}
.canvas_control_22 {
    border: 1px solid #acacac;
    border-radius: 0px 0px 2px 2px;
    border-top: none;
    background-color: #fff;
    margin: 0 auto;
    color: #15a7b6;
    font-size: 14px;
    height: 16px;
    width: auto;
    float: left;
    margin-left:24%;
    margin-top:-10%;
}

#animate_container11,#animate_container22,#animate_container33 {
    float: left;
    background: #193037;
    text-align: center;  
    margin-left: 1%;
}

#scenario1SliderReR,#scenario2SliderReR,#scenario3_slider1_slider{
	width: 96%;
    margin-top: 2%;
    margin-left: 2%;
    float:left;
}
#scenario3_slider1_slider{
	margin-top: 0%;
}
#scenario3SliderReR {
    width: 100%;
    margin-top: 2%;
    margin-left: 0%;
}
#scenario2_Slider2{
	width:90%;
	height:21%;
	margin-top:3%;
	margin-left:1%;
	
}

#scenario2_slider211{
	width:73%;
	height:90%;
	 margin-top:-9%; 
	margin-left:29%;
}

#scenario2SliderN{
	width:89%;
	 margin-top:3%; 
	margin-left:6%;
}

#scenario2SliderN label {
  position: absolute;
  width: 20px;
  margin-top: 8%;
  margin-left: -7%;
  text-align: center;
}	

#scenario2SliderHR{
	width:67.5%;
	 margin-top:6%; 
	margin-left:34%;
	
	
}
#scenario2SliderHR label {
  position: absolute;
  width: 20px;
  margin-top: 8%;
  margin-left: -10%;
  text-align: center;
}
 #scenario2_Slider3{
	width:87%;
	height:21%;
	margin-top:14%;
	margin-left:1%;
} 
#slider_name2{
	width:18%;
	height:90%;
	margin-left:1%;
}

/*for scenario3 control area*/
#scenario3_Slider1{
	width:90%;
	height:22%;
	margin-top:8%;
	margin-left:1%;
	
}
#scenario3_Slider1_text{
	width:25%;
	height:32%;
	margin: 0% 0% 1% 1%;
}
.canvas_control_33 {
    border: 1px solid #acacac;
    border-radius: 0px 0px 2px 2px;
    border-top: none;
    background-color: #fff;
    margin: 0 auto;
    color: #15a7b6;
    font-size: 14px;
    height: 16px;
    width: auto;
    float: left;
    margin-left:25%;
    margin-top:-12%;
}

#scenario3_Slider2{
	width:90%;
	height:21%;
	margin-top:7%;
	margin-left:1%;
	
} 
#slider_name3{
	width:18%;
	height:90%;
	margin-top:-9%; 
	margin-left:1%;
}

#scenario3_slider311{
	width:74%;
	height:90%;
	 margin-top:-7%; 
	margin-left:30%;
}
#scenario3SliderN{
	width: 93%;
    margin-top: 2%;
    margin-left: 3%;
}
#scenario3SliderN label {
  position: absolute;
  width: 20px;
  margin-top: 6%;
  margin-left: -12%;
  text-align: center;
}	
#scenario3_Slider3{
	width:69%;
	height:8px;
	margin-top:15%; 
	margin-left:25%;
}
 #scenario3SliderAB label {
  position: absolute;
  width: 20px;
  margin-top: 6%;
  margin-left: -10%;
  text-align: center;
}

#scenario3SliderAB{
	width: 91%;
    margin-top: 17%;
    margin-left: 7%;
}
#scenario3-slider4{
	width:88%;
	height:32%;
	margin-top:14%;
	margin-left:1%;
}

#scenario3SliderC{
	width:71%;
	margin-top:5%; 
	margin-left:33%;
}
#scenario3SliderC label {
  position: absolute;
  width: 20px;
  margin-top: 6%;
  margin-left: -10%;
  text-align: center;
}

.scenario1QuestionsScroll {
    max-height: 315px;
    overflow: hidden;
    width: 166px;
    padding-right: 4px;
    outline: none;
}
.scrollbox {
    overflow: auto; 
   
    /* This is changed by enscroll, but must be defined */
    width: 170%;
}
.scenario3ControlScroll{
	max-height: 345px;
	overflow-x: hidden;
    overflow: hidden;
   	width: 97%;
    padding-right: 4px;
    outline: none;
}
.scenario2ControlScroll{
	max-height: 345px;
	overflow-x: hidden;
    overflow: hidden;
   	width: 97%;
    padding-right: 4px;
    outline: none;
}
.scenario1ControlScroll {
    max-height: 93px;
    overflow-x: hidden;
    overflow: hidden;
    width: 97%;
    padding-right: 4px;
    outline: none;
}
.sceanrio1Image{
	margin-left:46%;
	margin-top:0%;
	height:22px;
	width:70px;
}
.sceanrio2Image{
	width: 5%;
    height: 37px;
    float: left;
    margin-left: -0.5%;
    margin-top: 27%;
}
.sceanrio3Image{
	width: 5%;
    height: 37px;
    float: right;
    margin-left: -0.5%;
    margin-top: 27%;
}
.arrowImage1{
	height:90%;
	width:62%;
	margin-top:2%;
}
.arrowImage2{
    height: 93%;
    width: 82%;
    /* margin-top: 2%; */
    margin-left: 19%;
}
.arrowImage3{
    height: 93%;
    width: 82%;
    /* margin-top: 2%; */
  /*   margin-right: 19%; */
}




/*Topic25 css On 12 oct*/


canvas {
	width: 566px!important;
	height: 336px!important;
}

#scenario2AValue{
	margin:1%;
}
.ui-widget {
    font-family: Trebuchet MS,Tahoma,Verdana,Arial,sans-serif;
    font-size: -0.9em;
}
.unwantedScroll{
	 overflow-y: hidden; overflow-x: hidden; 
}
.ui-widget-content .ui-state-default{
	margin-left: -10px;
    width: 10px;
    height: 10px;
    padding: 5px;
    padding-top: 2px;
    line-height: 11px;
    font-weight: bold;
    color: #1c94c4;
    font-size: 12px;
    left: 40%;
}

.revolveRegionLabel{
	font-size: 14px;
	float: left;
	margin: 4px 8px;
	margin-right: .5%; 
	color: #15a7b6;
}
.scenarioSliderContener{
    width: 70.5%;
    margin-left: .4%;
    float: left;
    height: 25px;
    background-color: #193036;
}
.ui-helper-clearfix {
    min-height: 0;
    height: 24px;
}
.boardline {
    border-right: 1px solid #ccc;
    float: left;
    height: 85px;
    margin: .5% 0.5%;
}
#scenario1rSliderDiv,#scenario1RSliderDiv,#scenario2rSliderDiv,#scenario2hSliderDiv,#scenario3ASliderDiv,#scenario3BSliderDiv,#scenario3CSliderDiv{
	float: left;
    width: 50%;
}
#scenario1rSliderInputBox,#scenario1RSliderInputBox,#scenario2hSliderInputBox,#scenario2rSliderInputBox,#scenario3ASliderInputBox,#scenario3BSliderInputBox,#scenario3CSliderInputBox{
	 width: 45px;
}
#scenario1SliderText{
	margin-left: 32%;
	margin-top:3%;
}
#scenario3SliderText{
	margin-left: 6%;
	margin-top:4%;
}
#scenario2SliderText {
    margin-left: 28%;
    margin-top: -5%;
}
  .scenario1rAndRSliderLabel,.scenario2hAndrSliderLabel,.scenario3AAndBSliderLabel,.scenario3ACSliderLabel{
  	float: left;
    margin: 4%;
  }
  #scenario3CSliderText{
 	margin-left: 31%;
    margin-top: 3%;
  }
 .scenario3Value3 {
    width: 99%;
    height: 48%;
    margin-top: 1%;
    margin-left: 1%;
 } 
 
 .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.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.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: -18px;
}


.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%;
}

.newlyAddedSection{
	max-height: 410px; 
}
.resetDiv{
	width:4.7%;
	float: right;
	background: #193036;
   /*  margin-left: .4%; */
}


#scenario1ResetButton,#scenario2ResetButton,#scenario3ResetButton{
	cursor: pointer;
}
.disabled {
    opacity: 0.5;
    cursor: default !important;
}