@font-face {
    
   /*  font-family: myFirstFont;
    src: url(sansation_light.woff);*/
  font-family: 'gothic';
	src: url('../fonts/gothic/century_gothic.eot');
	src: url('../fonts/gothic/century_gothic.eot?#iefix') format('embedded-opentype'),
		url('../fonts/gothic/century_gothic.woff') format('woff'),
		url('../fonts/gothic/century_gothic.ttf') format('truetype'),
		url('../fonts/gothic/century_gothic.svg#ArialMT') format('svg');
}



body {
    overflow: hidden;
    font-family: 'gothic';
    margin: 0px;
    font-size: 16px;
}

 #main_cont {
    height: 600px;
    width: 800px;
    background-color: #666666;
    border: 1px solid;
    position: relative;
}

#head
{
    position: relative;
    width: 100%;
    height: 30px;
    //background-color: #dcdcdc;
    //border: 1px solid;
    background-size: 100% 100%;
    background-image: url(../images/head_bg.png);
    background-repeat: repeat-x;
}

#container {
    position: relative;
    width: 90%;
    background-color: #666666;
    height: 559px;
    top: 4px;
//    border: 1px solid #909090;
//  background-size: 100% 100%;
//  background-image: url(../images/bg_img.png);
}




.title
{
    width: 70px;
    height: 20px;
    position: absolute;
    top: 11px;
    left: 360px;
    border-top: 2px solid #ff9900;
    border-right: 2px solid #ff9900;
    border-left: 2px solid #ff9900;
    color: #ff9900;
    font-family: gothic;
    font-size: 16px;
    text-align: center;
        
}
#content
{
    position: absolute;
    top: 34px;
    left: 95px;
    width: 610px;
    height: 300px;
    border-radius: 10px;
    background-color: #000000;
    border: 2px solid #ff9900;
    overflow: hidden;
}
#txt
{
    position: absolute;
    top: 350px;
    left: 170px;
    color: #ff9900;
    font-family: gothic;
    font-size: 14px;
}

#opt
{
       position: absolute;
    top: 349px;
    left: 378px;
    width: 73px;
    height: 20px;
    border-radius: 3px;
    
    border: 1px solid #b7babc;
    background-color: #c8c8c8;
    background-image: url(../images/drop_bg.png);
    background-repeat: repeat-x;
}
/*
#opt:hover,#opt_val:hover,#opt_drop:hover
{
    background-color: #c8c8c8;
    background-image: transparent;
}
*/
#opt_val
{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 51px;
    height: 16px;
    padding-top: 3px;
    font-family: gothic;
    font-size: 12px;
    text-align: center;
    vertical-align: middle;
    
   border-right: 1px solid #b7babc;
}
#opt_drop
{
    width: 20px;
    height: 20px;
    position: absolute;
    left: 52px;
    /border: 1px solid #b7babc;
    border-left: 0px solid #666666;
    cursor: default;
}
.opt_list
{
    width: 73px;
    height: 20px;
    height: 86px;
    background-color: #fff;
    position: absolute;
    top: 370px;
    left: 378px;
    display: none;
    z-index:10;
    cursor: default;
    
}
.opt1
{
    float:left;
    width:72px;
    height: 20px;
    text-indent: 6px;
    border: 1px solid #b7babc;
    cursor: default;
    font-size:12px;
}
#opt_1:hover,#opt_2:hover,#opt_3:hover,#opt_4:hover
{
    border: 1px solid #0093f0;
    background-color: #daf1ff;
    cursor: default;
}
.arw
{
    position: absolute;
    top: 8px;
    left: 7px;
    width: 9px;
    height: 5px;
    background-image: url(../images/arw.png);
    background-repeat: repeat-x;
    background-size: 100% 100%;
}
#next_btn
{
    position: absolute;
    top: 349px;
    left: 473px;
    border-radius: 3px;
    border: 1px solid #b7babc;
    background-color: #c8c8c8;
    background-image: url(../images/drop_bg.png);
    background-repeat: repeat-x;
    width: 47px;
    height: 17px;
    padding-top: 3px;
    font-family: gothic;
    font-size: 12px;
    text-align: center;
    vertical-align: middle;
    opacity: 0.5;
    
}
#next_btn:hover
{
    border: 1px solid #0089df;
}

.title1
{
    width: 100px;
    position: absolute;
    top: 402px;
    left: 340px;
    border-top: 2px solid #ff9900;
    border-right: 2px solid #ff9900;
    border-left: 2px solid #ff9900;
    color: #ff9900;
    font-family: gothic;
    font-size: 16px;
    text-align: center;
    
}
.content1
{
    position: absolute;
    top: 424px;
    left: 95px;
    width: 610px;
    height: 110px;
    border-radius: 10px;
    border: 2px solid #ff9900;
}

.txt1
{
    position: absolute;
    top: 20px;
    left: 23px;
    color: #ff9900;
    font-family: gothic;
    font-size: 12px;
}
.txt2
{
    position: absolute;
    top: 68px;
    left: 38px;
    color: #ff9900;
    font-family: gothic;
    font-size: 12px;
}
.lineTxt
{
    color: #fff;
    font-family: gothic;
    font-size: 14px;
    position: absolute;
}

#lineTxt_1
{
    top: 10px;
    left: 110px;
}
#lineTxt_2
{
    top: 11px;
    left: 557px;
}
#lineTxt_3
{
    top: 58px;
    left: 110px;
}
#lineTxt_4
{
    top: 58px;
    left: 557px;
}

.hr1
{
    position: absolute;
    top: 28px;
    left: 110px;
    width: 480px;
    height: 1px;
    background-color: #dbdcdd;
    border: 1px solid #c6c7c8;
}
.hr2
{
    position: absolute;
    top: 75px;
    left: 110px;
    width: 480px;
    height: 1px;
    background-color: #dbdcdd;
    border: 1px solid #c6c7c8;
}
#drag1
{
    position: absolute;
       top: 452px;
    left: 202px;
    width: 488px;
    height: 14px;
    /*border: 1px solid;*/
}
#drag2
{
    position: absolute;
    top: 499px;
    left: 202px;
    width: 488px;
    height: 14px;
   /* border: 1px solid;*/
}

#dragArw_1
{
    position: absolute;
    top: 0px;
    left: 220px;
    width: 14px;
    height: 14px;
     background-image: url(../images/drag_key.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

#dragArw_2
{
    position: absolute;
    top: 0px;
    left: 220px;
    width: 14px;
    height: 14px;
    background-image: url(../images/drag_key.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

#dragArw_1:hover,#dragArw_2:hover
{
     background-image: url(../images/drag_key_hover.png);
}

#nextEnableContent1
{
    position: absolute;
    top: -34px;
    left: 2px;
    width: 794px;
    height: 380px;
    /*background-color: #666666;*/
    opacity: 0.5;
   /* display:block;*/
}
#nextEnableContent2
{
    position: absolute;
        top: 346px;
    left: 2px;
    width: 374px;
    height: 40px;
    /*background-color: #666666;*/
    opacity: 0.5;
   /* display:block;*/
}
#nextEnableContent3
{
    position: absolute;
      top: 346px;
    left: 456px;
    width: 342px;
    height: 40px;
   /* background-color: #666666;*/
    opacity: 0.5;
  /*  display:block;*/
}
#nextEnableContent4
{
    position: absolute;
    top: 372px;
    left: 3px;
    width: 794px;
    height: 189px;
    background-color: #666666;
    opacity: 0.9;
   /* display:block;*/
}
#drop_hiden
{
    position: absolute;
    top: 372px;
    left: 3px;
    width: 794px;
    height: 189px;
    background-color: #666666;
    opacity: 0.1;
    display:none;
   /* display:block;*/
}
.nextEnableContent
{
   /* position: absolute;
    top: 372px;
    left: 3px;
    width: 794px;
    height: 189px;
    background-color: #666666;
    opacity: 0.5;*/
    display:block;
}

#img
{
    position: absolute;
    top: 5px;
    left: 35px;
    width: 541px;
    height: 301px;
   /* background-image: url(../images/img_1.png);*/
    background-repeat: no-repeat;
   
    /*-webkit-filter: blur(8px);
    -moz-filter: blur(8px);
    -o-filter: blur(8px);
    -ms-filter: blur(8px);
    filter: blur(8px);*/
   
   /* transform: scale(2);*/
     /*-webkit-box-shadow: 0px 0px 15px 5px #d8d8d8;
    -moz-box-shadow: 0px 0px 15px 5px #d8d8d8;
    box-shadow: 0px 0px 15px 5px #d8d8d8;*/
    
    /* border-radius: 10px;
    background-color: #000000;
    border: 2px solid #ff9900;*/
}

#img_1_1
{
    position: absolute;
    top: 15px;
    left: 251px;
    /*width: 47px;
    height: 46px;*/
    width: 103px;
    height: 103px;
    /*background-image: url(../images/image1_s1.png);*/
    background-image: url(../images/2.png);
    background-repeat: no-repeat;
    display: none;
   
}

#img_1_2
{
    position: absolute;
    top: 138px;
    left: 215px;
    width: 47px;
    height: 46px;
    background-image: url(../images/image1_s2.png);
    background-repeat: no-repeat;
    display: none;
}

#img_1_3
{
    position: absolute;
    top: 74px;
    left: 75px;
    width: 132px;
    height: 129px;
    background-image: url(../images/image1_b1.png);
    background-repeat: no-repeat;
    display: none;
}

#img_1_4
{
    position: absolute;
    top: 51px;
    left: 260px;
    width: 172px;
    height: 167px;
    background-image: url(../images/image1_b2.png);
    background-repeat: no-repeat;
    display: none;
}

.glowEffect{
    margin: auto;
    width: 147px;
    height: 90px;
    background-color: #1f5afe;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
    -webkit-box-shadow: 0px 0px 15px 5px rgba(255, 255, 190, .75);
    -moz-box-shadow: 0px 0px 15px 5px rgba(255, 255, 190, .75);
    box-shadow: 0px 0px 15px 5px rgba(255, 255, 190, .75);
}

/*#img_1_4 {
    position: absolute;
    top: 230px;
    left: 440px;
    width: 2px;
    height: 2px;
    background-color: #d7d7d7;
    // background-image: url(../images/image1_b2.png); 
    background-repeat: no-repeat;
    display: block;
    border-radius: 125px;
    box-shadow: 0px 0px 19px 13px #d8d8d8;
}*/

.objs_1,.objs_2,.objs_3,.objs_4,.objs_5,.objs_6,.objs_7,.objs_8,.objs_9
{
    position: absolute;
    background-image: url(../images/dot.png);
    background-repeat: no-repeat;
    background-size:100% 100%;
    -webkit-filter: blur(8px);
    -moz-filter: blur(8px);
    -o-filter: blur(8px);
    -ms-filter: blur(8px);
    filter: blur(8px);
   
}


#obj_1_1{ top: 131px;left: 277px;width: 110px;height: 110px;display: none; z-index: 10; }

#obj_1_2{ top: 164px;left: 377px;width: 50px;height: 50px;display: none; }

#obj_1_3{ top: 100px;left: 418px;width: 150px;height: 150px;display: none; z-index: 10; }



#obj_2_1{ top: 146px; left: 332px;width: 25px;height: 25px;display: none; }

#obj_2_2{ top: 140px;left: 350px;width: 100px;height: 100px; display: none; }

#obj_2_3{ top: 180px;left: 454px;width: 30px;height: 30px; display: none; }

    


#obj_3_1{ top: 127px; left: 260px;width: 125px;height: 125px;display: none;}

#obj_3_2{ top: 150px;left: 458px;width: 84px;height: 84px;display: none; }

#obj_3_3{ top: 213px;left: 449px;width: 35px;height: 35px;display: none; }



#obj_4_1{ top: 136px; left: 294px;width: 105px;height: 105px;display: none;}

#obj_4_2{ top: 163px;left: 405px;width: 50px;height: 50px;display: none; }




#obj_5_1{ top: 106px;left: 317px;width: 33px;height: 33px;display: none;}

#obj_5_2{ top: 107px;left: 320px;width: 160px;height: 160px;display: none;z-index: 10; }




#obj_6_1{ top: 190px;left: 479px;width: 25px;height: 25px;display: none;}

#obj_6_2{ top: 121px;left: 340px;width: 140px;height: 140px;display: none; }



#obj_7_1{ top: 116px; left: 219px;width: 135px;height: 135px;display: none;}

#obj_7_2{ top: 198px;left: 370px;width: 50px;height: 50px;display: none; }

#obj_7_3{ top: 110px;left: 412px;width: 40px;height: 40px;display: none; }

#obj_7_4{ top: 116px;left: 434px;width: 170px;height: 170px;display: none;z-index: 10; }



#obj_8_1{ top: 115px;left: 241px;width: 100px;height: 100px;display: none; }

#obj_8_2{ top: 167px;left: 439px;width: 50px;height: 50px;display: none; }

#obj_8_3{ top: 127px;left: 454px;width: 50px;height: 50px;display: none; }

#obj_8_4{ top: 163px;left: 483px;width: 50px;height: 50px;display: none; }


   
    
#obj_9_1{ top: 139px; left: 322px;width: 105px;height: 105px; display: none; z-index: 10;}

#obj_9_2{  top: 222px;left: 392px;width: 35px;height: 35px;display: none; }

#obj_9_3{  top: 170px;left: 434px;width: 42px;height: 42px;display: none; }

#obj_9_4{ top: 161px;left: 503px;width: 50px;height: 50px;display: none; }


#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;
        }

/*

#clik{
cursor:pointer;
}
#div2{
display:none;
width:50px;
height:50px;
border:1px solid;
cursor:pointer;
}

*/