/*   load the main media CSS file    */

@import url('../../../common/styles/media.css');

html, body {
	margin:0;
	height:100%;
}
#flashContent {
	width:98%;
	height:98%;
}

/*#flashContent { border:1px solid red;}
#flashContent div { border:1px solid red;}*/

#mainDiv
{
width:420px;
height:388px;
position:absolute;
top:10px;
left:34px;}
#main_wrapper{width:419px;height:393px;position:absolute;top:0px;}
#main_container{width:420px!important;height:167px!important;position: absolute;top: 50px; left: -2px; display:block !important;}
.main_bg_1 { position:absolute; top:-18px; left:0px;}
.main_bg_2 { position:absolute; top:-18px; left:0px; opacity:0;}
.box {left: 0;
    position: absolute;
    top: 142px;}

#front { left: 20px;
    position: absolute;
    text-align: center;
    top: 337px;
    width: 170px; cursor:pointer; background-image:url(button_after.jpg); background-repeat:repeat-x; height: 20px; font-size:12px; padding-top: 3px; border-radius: 4px 4px 4px 4px; color:#3B66B2;}
#front:hover,#rear:hover {background-image:url(button_after.jpg) !important; background-repeat:repeat-x; color:#3B66B2 !important;}
#rear {left: 229px;
    position: absolute;
    text-align: center; color:#FFF;
    top: 337px;
    width: 170px;cursor:pointer; background-image:url(button_before.jpg); background-repeat:repeat-x; height: 20px; font-size:12px; padding-top: 3px; border-radius: 4px 4px 4px 4px;}
.mark_a {left: 67px;
    position: absolute;
    top: 114px;cursor:pointer;}
.glow_a {border-radius: 5px 5px 5px 5px;
    cursor: pointer;
	box-shadow: 1px -3px 10px #00A1E3 !important;
	box-shadow: 1px 3px 10px #00A1E3;
    height: 19px;
    left: 67px;
    position: absolute;
    top: 114px;
    width: 109px;}
.img_a {box-shadow: -1px 3px 10px #00A1E3;}
.mark_b {left: 214px;
    position: absolute;
    top: 85px; opacity:0;}
.mark_B1 {height: 27px;
    left: 214px;
    position: absolute;
    top: 85px;
    width: 25px;cursor:pointer;}
.mark_B11 {height: 23px;
    left: 214px;
    position: absolute;
    top: 85px;
    width: 23px;cursor:pointer;/* z-index:-1;*/}
.glow_b {border-radius: 5px 5px 5px 5px;
    box-shadow: 4px 4px 10px #00A1E3;
    cursor: pointer;
    height: 24px;
    left: 214px;
    position: absolute;
    top: 85px;
    width: 25px;}
.glow_b1 {
    box-shadow: -4px -4px 10px #00A1E3 !important;
}
.mark_B2 {cursor: pointer;
    height: 23px;
    left: 241px;
    position: absolute;
    top: 86px;
    width: 81px;}
.glow_c {cursor: pointer;
    height: 23px;
    left: 241px;
    position: absolute;
    top: 86px;
    width: 81px; border-radius: 5px 5px 5px 5px; box-shadow: -4px -4px 10px #00A1E3;}
.glow_b2 {box-shadow: 4px 4px 10px #00A1E3 !important;}
.mark_B22 {cursor: pointer;
    height: 23px;
    left: 241px;
    position: absolute;
    top: 86px;
    width: 81px;}
.title {float: left;
    height: 15px;
    width: 100%;}
.title > b {
    float: left;
    font-size: 11px;
    margin: 0 0 0 5px;
    padding: 0;
	color:#483058;
}
.matter { float:left; width:100%;}
.matter p { float: left;
    font-size: 11px;
    margin: 7px 0 0 6px;
    padding: 0;
    width: 97%;}	

.title_1 > b {
    float: left;
    font-size: 11px;
    margin: 0 0 0 5px;
    padding: 0;
	color:#483058;
}
.matter_1 {float: left;
	margin-top: 9px;
    height: 92px;
    margin-top: 8px;
    overflow-y: scroll;
    width: 98%;}
.matter_1 p {float: left;
    font-size: 11px;
    margin-left: 7px;
    margin-top: 0;
    padding: 0;
    width: 97%;}
	
.matter_1 p ul {
    margin-left: 32px;
    margin-top: 0 !important;
    padding: 0;
}
	
.title_2 {float: left;
    height: 15px;
    width: 100%;}
.title_2 > b {
    float: left;
    font-size: 11px;
    margin: 0 0 0 5px;
    padding: 0;
	color:#483058;
}
.matter_2 { float:left; width:100%;}
.matter_2 p { float: left;
    font-size: 11px;
    margin: 7px 0 0 6px;
    padding: 0;
    width: 97%;}

.title_3 {float: left;
    height: 15px;
    width: 100%;}
.title_3 > b {
    float: left;
    font-size: 11px;
    margin: 0 0 0 5px;
    padding: 0;
	color:#483058;
}
.matter_3 { float:left; width:100%;}
.matter_3 p { float: left;
    font-size: 11px;
    margin: 7px 0 0 6px;
    padding: 0;
    width: 97%;}
.title_4 {float: left;
    height: 15px;
    width: 100%;}
.title_4 > b {
    float: left;
    font-size: 11px;
    margin: 0 0 0 5px;
    padding: 0;
	color:#483058;
}
.matter_4 { float:left; width:100%;}
.matter_4 p { float: left;
    font-size: 11px;
    margin: 7px 0 0 6px;
    padding: 0;
    width: 97%;}
#front_box {left: 0;
    position: absolute;
    top: 143px;
    width: 94%;}
#front_box_hotspot {left: 0;
    position: absolute;
    top: 143px;
    width: 100%; opacity:0;}
#rear_box {left: 0;
    position: absolute;
    top: 143px;
    width: 94%; opacity:0;}
#internet_box {left: 0;
    position: absolute;
    top: 143px;
    width: 94%; opacity:0;}
#ethernet_box {left: 0;
    position: absolute;
    top: 143px;
    width: 94%; opacity:0;}
/*	
@media only screen and (device-width: 768px) {
.matter_1 {float: left;
    height: 114px;
    margin-top: -12px;
    overflow-y: scroll;
    width: 98%; border:1px solid red;}
.matter_1 p {float: left;
    font-size: 11px;
    margin-left: 7px;
    padding: 0;
    padding: 0;
    width: 97%;}
	
.matter_1 p ul {
    margin-left: 32px;
    margin-top: 0 !important;
    padding: 0;
}
}*/