body {
    font-family: Monospace;
    background-color: #000;
    color: #000;
    margin: 0px;
    overflow: hidden;
}

#demo {
    width: 100%;
}

.navbar {
    margin-bottom: 0px;
}

.container-custom {
    background: -webkit-gradient(linear, 0 0, 0 100%, from(#251E0F), to(#BFA994));
    width: 100%;
    z-index: -100;
}
.navbar-header{
	 font-weight: bold;
   float: right;
}
.navbar-custom2 {
    margin-bottom: 10px;
    /*width: 30%;*/
    /*align-content: center;*/
}

#iconMenu ul li a {
    color: black !important;
    font-weight: bold !important;
    padding-top: 50px;

    /*font-weight: 600;*/
}

#iconMenu ul li.home a {
    background: url('../../shared/img/stlyeImgs/HomeIcon.png') no-repeat center;
    background-size: 40px 40px;

}

#iconMenu ul li.reset a {
    background: url('../../shared/img/stlyeImgs/ExpermentIcon.png') no-repeat center;
    background-size: 40px 40px;
}

#iconMenu ul li.mcq a {
    background: url('../../shared/img/stlyeImgs/mcqIcon.png') no-repeat center;
    background-size: 40px 40px;
}

#iconMenu ul li.quiz a {
    background: url('../../shared/img/stlyeImgs/quizIcon.png') no-repeat center;
    background-size: 40px 40px;
}

#iconMenu ul li.video a {
    background: url('../../shared/img/stlyeImgs/videoIcon.png') no-repeat center;
    background-size: 40px 40px;
}

#iconMenu ul li.tutorial a {
    background: url('../../shared/img/stlyeImgs/tutorial.png') no-repeat center;
    background-size: 40px 40px;
}

#iconMenu ul li.tableIcon a {
    background: url('../../shared/img/stlyeImgs/tableIcon2.png') no-repeat center;
    background-size: 40px 40px;
}

#iconMenu ul li.plot a {
    background: url('../../shared/img/stlyeImgs/plirIcon.png') no-repeat center;
    background-size: 40px 40px;
}

#iconMenu ul li.settings a {
    background: url('../../shared/img/stlyeImgs/settingsIcon.png') no-repeat center;
    background-size: 40px 40px;
}

.navbar-transperant {
    border-width: 0px;
    -webkit-box-shadow: 0px 0px;
    box-shadow: 0px 0px;
    background-color: rgba(0, 0, 0, 0.0);
    background-image: -webkit-gradient(linear, 50.00% 0.00%, 50.00% 100.00%, color-stop(0%, rgba(0, 0, 0, 0.00)), color-stop(100%, rgba(0, 0, 0, 0.00)));
    background-image: -webkit-linear-gradient(270deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.00) 100%);
    background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 0.00) 100%);
}

body {
    margin: 0;
    padding: 0;

    color: #ffffff;
}

.table {
    z-index: 100;
    width: 100%;
    position: absolute;
    bottom: 13px;
    font-family: "Courier New";
    font-size: 13px;
    font-weight: bold;
    /*color: #ffffff;*/
    opacity: .70;
}

.comboBox {
    list-style: none;
    width: 150px;
    margin: 30px auto 0px auto;
    height: 20px;
}

#scenecontainer {
    position: absolute;
    /*border: solid 1px #000000;*/
    top: 0;
    width: 100%;
    height: 100%;
    left: 0;
    right: 0;
    z-index: -1;
}

#load {
    position: absolute;
    /*border: solid 1px #000000;*/
    top: 30;
    width: 99.99%;
    height: 100%;
    background-color: #797979;
    z-index: 1;
}
#showCorrectAnswer {
    width: 150px;
}
#bestLine {
    width: 150px;
}
.header {
    height: 35px;
    top: 0;
    padding-right: 20px;
    padding-left: 20px;
    /*background-color: #4D4D4D;*/
    background: -webkit-gradient(linear, 0 0, 0 100%, from(#251E0F), to(#BFA994));
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff2f2f2', GradientType=0);
    *zoom: 1;
    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
    -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
    z-index: 1;
}

.Exp_title {
    background: #666666; /* Old browsers */
    background: -moz-linear-gradient(top, #666666 0%, #000000 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #666666), color-stop(100%, #000000)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #666666 0%, #000000 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #666666 0%, #000000 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #666666 0%, #000000 100%); /* IE10+ */
    background: linear-gradient(to bottom, #666666 0%, #000000 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#294b70', endColorstr='#192d42', GradientType=0); /* IE6-9 */

    -moz-border-radius-topleft: 0px;
    -moz-border-radius-topright: 0px;
    -moz-border-radius-bottomleft: 20px;
    -moz-border-radius-bottomright: 20px;
    -webkit-border-top-left-radius: 0px;
    -webkit-border-top-right-radius: 0px;
    -webkit-border-bottom-left-radius: 20px;
    -webkit-border-bottom-right-radius: 20px;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
    width: 500px;
    height: 30px;
    margin-left: auto;
    margin-right: auto;
    top: 30px;
    display: block;
    z-index: 1;
}

.transparent {
    background: transparent;
    border: 0px;
}

.massageText {
    color: #001b3c;
    font: 18px bold Arial, Helvetica, sans-serif;
}

.inside_title {
    font-size: 18px;
    font-family: 'Source Sans Pro', sans-serif;
    color: #d4d4d4;
    font-weight: bolder;
    text-align: center;
    z-index: 1;
}

.footer {
    bottom: 0px;
    height: 12px;
    width: 100%;
    color: #ffffff;
    padding-right: 20px;
    padding-left: 20px;
    background-color: #666666;
    border-radius: 4px;
    font-family: Courier New;
    font-size: 12px;
    position: fixed;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff2f2f2', GradientType=0);
    *zoom: 1;
    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
    -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
    z-index: 1;
}

.headerIcons {
    float: right;
    margin-right: 3px;
}

td {
    /*background: #a2a2a2;*/
    border: 1px solid #faf2cc;
}

.td {
    background: #a2a2a2;
    border: 1px solid #faf2cc;
    color: #000000;
}

.styled-button {
    font-family: Arial;
    color: #ffffff;
    font-size: 13px;
    padding: 5px;
    text-decoration: none;
    -webkit-border-radius: 9px;
    -moz-border-radius: 9px;
    text-shadow: 0px 1px 3px #757075;
    border: solid #989b9e 0;
    background: -webkit-gradient(linear, 0 0, 0 100%, from(#888c8f), to(#131314));
    background: -moz-linear-gradient(top, #888c8f, #131314);
    float: right;
    width: 100px;
    margin-right: 10px;
    height: 25px;
    z-index: 100;
}

.hide {
    font-family: Arial;
    color: #ffffff;
    font-size: 13px;
    padding: 5px;
    text-decoration: none;
    -webkit-border-radius: 9px;
    -moz-border-radius: 9px;
    text-shadow: 0px 1px 3px #757075;
    border: solid #989b9e 0;
    background: -webkit-gradient(linear, 0 0, 0 100%, from(#888c8f), to(#131314));
    background: -moz-linear-gradient(top, #888c8f, #131314);
    float: right;
    width: 100px;
    margin-right: 10px;
    height: 25px;
    z-index: 100;
}

.styled-button:hover {

    background: -webkit-gradient(linear, 0 0, 0 100%, from(#999999), to(#ffffff));
    background: -moz-linear-gradient(top, #999999, #ffffff);

}

.styled-button:disabled {

    background: -webkit-gradient(linear, 0 0, 0 100%, from(#888c8f), to(#888c8f));
    background: -moz-linear-gradient(top, #888c8f, #888c8f);

}

.styled-button:active {
    position: relative;
    top: 1px;
}

.graphRightHand {
    margin-left: 500px;
    float: right;
}

#messageStyle {
    width: 500px;
}

.message {
    position: absolute;
    display: none;
    margin-left: 500px;
    top: 200px;
    z-index: 120;
}

.header-search {
    -webkit-border-radius: 15px;
    -moz-border-radius: 10px;
    border-radius: 15px;
    border: 1px solid #8e8e8e;
    height: 20px;
    font-size: 18px;
    font-family: 'Source Sans Pro', sans-serif;
    color: #c5e0f7;
    width: 40px;
    -moz-box-shadow: inset 5px 5px 5px #000000;
    -webkit-box-shadow: inset 5px 5px 5px #000000;
    box-shadow: inset 2px 2px 2px #000000;
    float: right;
    margin-right: 10px;
}

.sliderDiv {
    width: 90px;
    float: right;
    margin-right: 25px;
    margin-top: 4px;
}

.sliderDivArabic {
    width: 90px;
    float: left;
    margin-left: 25px;
    margin-top: 4px;
}

.sliderSpan {
    float: left;
    color: #ffffff;
}

.sliderSpanArabic {
    float: right;
    direction: rtl;
    color: #ffffff;
}

.sliderValue {
    float: right;
    margin-right: 17px;
    width: 20px;
    color: #ffffff;
}

.sliderValueArabic {
    float: left;
    margin-left: 17px;
    width: 20px;
    color: #ffffff;
}

li {
    color: #ffffff;
}

.mapControl {
    background: url("../../shared/img/mc.png") no-repeat scroll 1000px 1000px transparent;
}

#controls {
    position: absolute;
    background-image: url("../../shared/img/navigation.png");
    background-size: 75%;
    background-repeat: no-repeat;
    background-position: left top;
    background-attachment: scroll;
    width: 80px;
    height: 228px;
    margin-left: 15px;
    top: 105px;
}

#pan-up {
    position: absolute;
    top: 2px;
    left: 10px;
}

#pan-up-link {
    position: absolute;
    top: 0px;
    left: 10px;
    width: 15px;
    height: 15px;
    background-color: transparent;
    /*border: 1px solid yellow;*/
}

#pan-down {
    position: absolute;
    top: 18px;
    left: 10px;
}

#pan-down-link {
    position: absolute;
    top: 15px;
    left: 10px;
    width: 15px;
    height: 15px;
    background-color: transparent;
    /*border: 1px solid yellow;*/
}

#pan-left {
    position: absolute;
    top: 9px;
    left: 1px;
}

#pan-left-link {
    position: absolute;
    top: 10px;
    left: 1px;
    width: 15px;
    height: 15px;
    background-color: transparent;
    /*border: 1px solid yellow;*/
}

#pan-right {
    position: absolute;
    top: 9px;
    left: 17px;
}

#pan-right-link {
    position: absolute;
    top: 10px;
    left: 17px;
    width: 15px;
    height: 15px;
    background-color: transparent;
    /*border: 1px solid yellow;*/
}

#rotate-up {
    position: absolute;
    top: 0px;
    left: 17px;
}

#rotate-left {
    position: absolute;
    top: 64px;
    left: 1px;
    background-color: #003f81;

}

#rotate-left-link {
    position: absolute;
    top: 16px;
    left: 3px;
    width: 15px;
    height: 15px;
    background-color: transparent;
    /*border: 1px solid yellow;*/
}

#rotate-right {
    position: absolute;
    top: 64px;
    left: 8px;
    background-color: #003f81;
}

#rotate-right-link {
    position: absolute;
    top: 17px;
    left: 33px;
    width: 15px;
    height: 15px;
    background-color: transparent;
    /*border: 1px solid yellow;*/
}

#rotate-down {
    position: absolute;
    top: 33px;
    left: 17px;
}

#rotate-down-link {
    position: absolute;
    top: 63px;
    left: 5px;
    width: 15px;
    height: 15px;
    background-color: transparent;
    /*border: 1px solid yellow;*/
}

#rotate-up-link {
    position: absolute;
    top: 62px;
    left: 5px;
    width: 13px;
    height: 13px;
    background-color: transparent;

}

#reset {
    position: absolute;
    top: 63px;
    left: 5px;
    background-color: #003f81;
}

#reset-link {
    position: absolute;
    top: 15px;
    left: 17px;
    width: 15px;
    height: 15px;
}

#zoom-out {
    position: absolute;
    top: 80px;
    left: 15px;

}

#zoom-out-link {
    position: absolute;
    top: 80px;
    left: 5px;
    width: 20px;
    height: 20px;
    /*border: 1px solid yellow;*/
}

#zoom-in {
    position: absolute;
    top: 65px;
    left: 15px;

}

#zoom-in-link {
    position: absolute;
    top: 65px;
    left: 5px;
    width: 20px;
    height: 20px;
    background-color: transparent;
    /*border: 1px solid yellow;*/
}

.combo {
    height: 18px;
    min-width: 130px;
    margin-right: auto;
}

#progressbar {
    z-index: 100;
    position: absolute;
    top: 250px;
    left: 500px;
    width: 300px;
    margin: 20px auto;
}

/*.link {*/
/*color: #0000ff;*/
/*font-size: 30px;*/
/*}*/

label {
    position: relative;
    display: inline-block;
}

select {
    display: inline-block;
    padding: 4px 3px 5px 5px;
    width: 150px;
    height: 28px;
    outline: none;
    color: #000000;
    border: 1px solid #C8BFC4;
    border-radius: 4px;
    box-shadow: inset 1px 1px 2px #ddd8dc;
    background-color: #ffffff;
}

input[type=radio] {
    display:none;
}

input[type=radio] + label {
    color: #f2f2f2;
    font-family: Bold, Georgia;

    height:19px;
    display:inline-block;
    line-height:19px;
    background-repeat:no-repeat;
    padding-right:24px;

    background-position: right 0;
    font-size:16px;
    vertical-align:middle;
    cursor:pointer;


    background-image:url(../img/icon/pic4.png);
}
input[type=radio]:checked + label {
    background-position: right -19px;
    /*background-image:url(../img/pic1.png);*/
}

.arabicQuestion {
    direction: rtl;
    float: right;
    width: 700px;
    color: #BFA994;
    font-family: Bold, Georgia;
    font-size: 17px;
}
.no-close .ui-dialog-titlebar-close {
    display: none;
}

.noteBookDialog {
    background: transparent;
    border: transparent;
    color: #800000;
}