@font-face {
  font-family: 'u39';
  src: url('../type/u39.eot');
  src: url('../type/u39.eot?#iefix') format('embedded-opentype'),
  url('../type/u39.woff') format('woff'),
  url('../type/u39.ttf') format('truetype'),
  url('../type/u39.svg#u39') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
    font-family: 'u45';
    src: url('../type/u45.eot');
    src: url('../type/u45.eot?#iefix') format('embedded-opentype'),
         url('../type/u45.woff') format('woff'),
         url('../type/u45.ttf') format('truetype'),
         url('../type/u45.svg#u45') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
  font-family: 'u57';
  src: url('../type/u57.eot');
  src: url('../type/u57.eot?#iefix') format('embedded-opentype'),
       url('../type/u57.woff') format('woff'),
       url('../type/u57.ttf') format('truetype'),
       url('../type/u57.svg#u57') format('svg');
  font-weight: normal;
  font-style: normal;
}

.code{
  width:1024px;
  height:690px;
  position:absolute;
}

.code_head{
  width:1024px;
  height:156px;
  float:left;
}

.code_buttons{
  width:664px;
  height:156px;
  position:absolute;
  padding-left:229px;
}

.code_buttons div{
  float:left;
  width:179px;
  height:67px;
  margin-top:81px;
  margin-left:-1px;
  background-color: #ccc;
  opacity:.5;
  border:1px solid #000;
  -moz-border-radius:5px 5px 0px 0px; 
  -webkit-border-radius:5px 5px 0px 0px; 
  border-radius:5px 5px 0px 0px;
  cursor:pointer;
}

.code_buttons p{
  text-align:center;
  padding-top:5px;
  font-family:u57;
  font-size:18px;
  color:#000;
  opacity:1;
}

.code_body_dreamlens{
  height:534px;
  width:1024px;
  position:relative;
  float:left;
  overflow:hidden;
}

.code_body_preres{
  height:534px;
  width:1024px;
  position:relative;
  float:left;
  display:none;
  overflow:hidden;
}

.code_body_ddc{
  height:534px;
  width:1024px;
  position:relative;
  float:left;
  display:none;
  overflow:hidden;
}

.code_text{
  float:left;
  width:222px;
  height:529px;
  border-right:1px solid #000;
}

.code_text p{
  font-family:u45;
  font-size:12px;
  line-height:14px;
  padding:0px 10px 0px 10px;
  margin-top:-2px;
}

.code_display{
  height:519px;
  width:794px;
  float:left;
  padding-left:4px;
  margin-top:-2px;
}

.code_display img{
  height:260px;
  width:391px;
  position:absolute;
  
  margin:2px;
  border:1px solid #000;
  -moz-border-radius:5px 5px 5px 5px; 
  -webkit-border-radius:5px 5px 5px 5px; 
  border-radius:5px 5px 5px 5px;
}

#tryit1{
  font-family:u57;
  font-size:70px;
  position:absolute;
  z-index:2;
  top:339px;
  left:740px;
  color:#ccc;
}

#tryit2{
  font-family:u57;
  font-size:18px;
  position:absolute;
  z-index:2;
  top:425px;
  left:737px;
  color:#ccc;
}

.code_display_dreamlens_02{
  left:625px;
}

.code_display_dreamlens_03{
  top:266px;
}

.code_display_dreamlens_04{
  top:266px;
  left:625px;
}

.code_display_dreamlens_04:active{
  opacity:.5;
}

.code_display_preres_01{
  top:-2px;
  left:227px;
}

.code_display_preres_02{
  top:-2px;
  left:625px;
}

.code_display_preres_03{
  top:266px;
  left:227px;
}

.code_display_preres_04{
  height:182px;
  width:393px;
  top:269px;
  left:400px;
  position:relative;
  -moz-border-radius:5px 5px 5px 5px; 
  -webkit-border-radius:5px 5px 5px 5px; 
  border-radius:5px 5px 5px 5px;
}

#code_vid01{
  -moz-border-radius:5px 5px 5px 5px; 
  -webkit-border-radius:5px 5px 5px 5px; 
  border-radius:5px 5px 5px 5px;
}

.code_display_preres_01{
  left:227px;
}

.code_display_ddc_02{
  left:625px;
}

.code_display_ddc_03{
  top:266px;
  left:227px;
}

.code_display_ddc_04{
  height:263px;
  width:351px;
  top:269px;
  left:400px;
  position:relative;
  -moz-border-radius:5px 5px 5px 5px; 
  -webkit-border-radius:5px 5px 5px 5px; 
  border-radius:5px 5px 5px 5px;
}

#code_vid02{
  -moz-border-radius:5px 5px 5px 5px; 
  -webkit-border-radius:5px 5px 5px 5px; 
  border-radius:5px 5px 5px 5px;
}

.code_dreamlens_close{
  opacity:0;
  z-index:100;
  height:35px;
  width:35px;
  position:absolute;
  float:right;
  top:20px;
  right:20px;
  background:url('../inc/code/close.svg') no-repeat;
}

.code_preres_close{
  opacity:0;
  z-index:100;
  height:35px;
  width:35px;
  position:absolute;
  float:right;
  top:104px;
  right:20px;
  background:url('../inc/code/close.svg') no-repeat;
}

.code_ddc_close{
  opacity:0;
  z-index:100;
  height:35px;
  width:35px;
  position:absolute;
  float:right;
  top:20px;
  right:20px;
  background:url('../inc/code/close.svg') no-repeat;
}