@font-face {
	font-family: 'Arial';
	src: url('../fonts/arial/arialmt.eot');
	src: url('../fonts/arial/arialmt.eot?#iefix') format('embedded-opentype'),
		url('../fonts/arial/arialmt.woff2') format('woff2'),
		url('../fonts/arial/arialmt.woff') format('woff'),
		url('../fonts/arial/arialmt.ttf') format('truetype'),
		url('../fonts/arial/arialmt.svg#ArialMT') format('svg');
	font-weight: normal;
	font-style: normal;
}

#main_cont {
    height: 600px;
    width: 800px;
    background-color: #e1e1e1;
    border: 1px solid;
    position: relative;
}

body {
    overflow: hidden;
    margin: 0px;
    cursor: default;
    font-family:'Arial';
}

#container {
    position: relative;
    width: 100%;
    background-color: #666666;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    height: 610px;
    top: 30px;
}


#container1 {
    width: 525px;
    height: 450px;
    position: relative;
    display: inline-block;
}

.sel_pxl_txt {
    color: white;
    font-size: 14px;
    position: relative;
    display: inline-block;
    width: 87px;
    vertical-align: top
}

td{
	border: 1px solid transparent;
    color: rgba(255,255,255,.50);
    font-size: 12px;
	width: 20px;
    height: 23px;
}

td:hover{
	border-color: lawngreen;
    background-color:rgba(255, 255, 255,0.7)!important;
    }

table{
		text-align: center;
		width: 515px;
        padding-top:5px;
		height: 450px;
        margin: 3px 0px 0px 3px;
/*		border: 1px solid black;*/

}

#container2 {
    position: relative;
    display: inline-block;
    width: 250px;
    vertical-align: top;
    margin-left: 15px;
}

#drop_down {
    width: 125px;
    position: relative;
    height: 17px;
    border-radius: 4px;
    font-size: 13px;
    background-color: #444;
    border: 1px black solid;
    display: inline-block;
}

#drop_down:hover{
background-color: #999999;
}

.surc_pxl_txt {
	color: #ff9900;
    font-size: 13px;
    position: relative;
    font-weight: 900;
}

.surc_pxl_table {
    width: 120px;
    height: 139px;
    position: relative;
    background-image: url('../img/bg_img3.png');
    background-repeat: repeat-y;
/*    background: rgba(255,255,255,1);*/
    overflow-x: hidden;
    overflow-y: auto;

}


.surc_numbr_txt {
	color: white;
    font-size: 12px;
    position: relative;
    display: inline-block;
    width: 100px;
    vertical-align: top;
}

.surc_numbr_rslt {
    color: #ff9900;
    font-size: 15px;
    font-weight: 600;
    margin: 15px 0px;
}

.surc_sum_txt {
	color: white;
    font-size: 12px;
    position: relative;
    width: 102px;
}

.surc_sum_rslt {
    color: #ff9900;
    font-size: 15px;
    font-weight: 600;
    position: relative;
    margin: 5px 0;
}

.bg_pxl_txt {
	color: #0899ff;
    font-size: 13px;
    font-weight: 900;
    position: relative;
}

.bg_pxl_table {
    width: 120px;
    overflow-x: hidden;
    overflow-y: auto;
/*    background: rgba(255,255,255,1);*/
    background-image: url('../img/bg_img3.png');
    background-repeat: repeat-y;
    height: 139px;
    position: absolute;
}

.bg_numbr_txt {
	color: white;
    font-size: 12px;
    position: relative;
}

.bg_numbr_rslt {
	color: #0899ff;
    font-size: 15px;
    position: relative;
    font-weight: 600;
    margin: 15px 0px;
}

.bg_sum_txt {
	color: white;
    font-size: 11px;
    position: relative;
}

.bg_sum_rslt {
	color: #0899ff;
    font-size: 15px;
    position: relative;
    font-weight: 600;
    margin: 5px 0;
}

.sum_surc_txt,.str_txt,.mins ,.avg_bg_txt,.mult,.no_of_surc_txt,.equal{
    font-size: 12px;
    font-weight: 600;
    color: white;
    }

.mins {
    position: relative;
    font-weight: bold;
    top: -5px;
    width: 40px;
    font-size: 20px;
}

.sum_surc_txt {
    position: relative;
    width: 115px;
}

.avg_bg_txt {
    position: relative;
    width: 190px;
}

.mult {
    position: relative;
    font-weight: bold;
    width: 27px;
}

.no_of_surc_txt {
    position: relative;
/*    width: 160px;*/
}

.equal {
    position: relative;
    font-weight: bold;
    width: 40px;
    text-align: center;
    font-size: 20px;
    top: 7px;
}

.str_txt {
    position: relative;
    width: 85px;
}

.reslt_1 {
    position: relative;
    font-size: 15px;
    color: #ff9900;
    font-weight: 600;
    width: 70%;
    text-align: center;
}

.reslt_2 {
    position: relative;
    font-size: 15px;
    color: #0899ff;
    font-weight: 600;
    width: 90%;
    text-align: center;

}

.reslt_3 {
    position: relative;
    font-size: 15px;
    color: #ff9900;
    font-weight: 600;
    width: 100%;
    text-align: center;
}

.reslt_4 {
    position: relative;
    font-size: 20px;
    color: lawngreen;
    width: 100%;
    text-align: center;
    top: -3px;
}

.dropdown-content {
    display: none;
    position: absolute;
    font-size: 13px;
    background-color: white;
    overflow: auto;
    z-index: 1;
    top: 18px;
    width: 125px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}
.dropdown-content .source,.dropdown-content .bg {
    color: black;
    padding: 4px 0px;
    font-size: 12px;
    display: block;
}
.dropdown-content .source:hover,
.dropdown-content .bg:hover {
    background-color: #d6e1ef;
}

.selectedItem {
    width: 125px;
    height: 17px;
    border-radius: 4px;
    background-image: url('../img/bg_img1.png');
    background-repeat: repeat-x;
}

.headr {
    width: 120px;
    height: 18px;
    background: url('../img/bg_img1.png') repeat-x;
    background-color: #444;
    border-bottom: 1px solid black;
}

.selectedItem:hover{
    opacity: 0.6;
}
.headr:hover{
        opacity: 0.6;

}
.td_item{
    width: 120px;
    height: 29px;
    background: url('../img/bg_img3.png');
    font-size: 15px;
}
.surc_table {
    border: 1px solid white;
    width: 120px;
    height: 158px;
    position: relative;
    margin-top: 15px;
    display: inline-block;
    
}

.bg_table {
    border: 1px solid white;
    width: 120px;
    height: 158px;
    position: relative;
    margin-top: 15px;
    display: inline-block;
}

.selectedItem1 {
    width: 125px;
    height: 17px;
}

.aa {
    position: relative;
    width: 19px;
    display: inline-block;
    height: 17px;
    vertical-align: top;
    border-left: 1px solid #444;
    background: url('../img/bg_img2--.png') no-repeat right top;
}


.drop_txt {
    width: 98px;
    position: relative;
    height: 100%;
/*    background: red;*/
    display: inline-block;
    padding: 1px;
    padding-left: 6px;
}

.cont {
    background-color: #444444;
    position: relative;
    top: 30px;
    height: 570px;
}
.selected{
    background-color: #a8c6ee !important;
}



#sub_cont1 {
    position: relative;
    margin-top: 20px;
    height: 25px;
}

#sub_cont2 {
    position: relative;
    margin-top: 20px;
}

#sub_cont3 {
    position: relative;
    margin-top: 15px;
}

.surc_txt {
    width: 110px;
    display: inline-block;
    vertical-align: top;
    margin-top: 15px;
    margin-left: 10px;
}

.bg_txt {
    width: 110px;
    display: inline-block;
    vertical-align: top;
    margin-left: 10px;
    margin-top: 15px;
}

#container3 {
    margin-top: 15px;
    position: relative;
    margin-left: 10px;
/*    width: 660px;*/
}
#container3 div {
    display: inline-block;
    vertical-align: top;
}
#loadInfo {
    position: absolute;
    width: 176px;
    height: 50px;
    margin: auto;
    left: 0px;
    right: 0px;
    top: 0px;
    bottom: 0px;
    font-size: 24px;
    text-align: center;
}
        #main_cont{
                opacity: 0;
        }