﻿@font-face {
    font-family: "GeogrotesqueRegular";
    src: url("../fonts/geogtq-rg-webfont.eot");
    src: url("../fonts/geogtq-rg-webfont.eot?#iefix") format('embedded-opentype'), 
    url("../fonts/geogtq-rg-webfont.woff") format('woff'), 
    url("../fonts/geogtq-rg-webfont.ttf") format('ruetype'), 
    url("../fonts/geogtq-rg-webfont.svg#GeogrotesqueRegular") format('svg');
    font-weight: normal;
    font-style: normal;
}


/*
Basic elements
------------------------------------------------------------- */

html, body {
    font-size: 12px;
    text-rendering: optimizeLegibility !important;
    -webkit-font-smoothing: antialiased !important;
    font-family: GeogrotesqueRegular, Trebuchet MS, Verdana, Arial, Sans-Serif;
    color: #7f7f7f;
    background: #fff;
}

h1{font-size: 20px;}
h2{font-size: 18px;}
h3{font-size: 16px;}
b{font-weight: bold}
div.clear{clear: both}

div.wrapper{
    width: 980px;
    min-height: 900px;
}

/*
Top elements
------------------------------------------------------------- */

div.topwrap{
    position: relative;
    width: 980px;
    height: 551px;
}

    div.deling{position: absolute;top: 5px;right: 5px;padding: 5px;border: solid 1px #F00}

    div.layer{
        position: absolute;
        width: inherit;
        height: inherit;
    }
    
    
    div.controls{
        position: absolute;
        bottom: 5px;
        width: inherit;
        height: 32px
    }
    
        div.arrow_prev{
            position: absolute;
            left: 5px;
            width: 32px;
            height: 32px
        }
        
            div.arrow_prev img{
                width: 32px;
                height: 32px
            }
        
        div.arrow_next{
            position: absolute;
            right: 5px;
            width: 32px;
            height: 32px
        }
        
            div.arrow_next img{
                width: 32px;
                height: 32px
            }
        
        div.zoom{
            position: absolute;
            right: 40px;
            width: 32px;
            height: 32px
        }
        
            div.zoom img{
                width: 32px;
                height: 32px
            }
    
        div.close_skuffe{
            position: absolute;
            right: 5px;
            width: 32px;
            height: 32px
        }
        
            div.close_skuffe img{
                width: 32px;
                height: 32px
            }
    
    div.cr{
        float: left;
        width: 490px;
        height: 275px;
    }
    
       div.cr img{width: 490px;height: 275px;} 
    
    div.crb{
        height: 276px;
    }
    
        div.crb img{width: 490px;height: 276px;} 
        
        
    .choose{
        position: absolute;
        top: 10px;
        left: 10px;
        width: 280px;
        height: 530px;
        background: #FFF;
    }
    
    .soc{
        width: 820px;
    }
    
        .innerchoose{
             position: absolute;
             top: 10px;
             left: 10px;
             width: 260px;
             height: 510px;
        }
        
        
        .soc .innerchoose{
             width: 800px;
        }
        
        .choose-header{
             position: absolute;
             width: 260px;
             height: 30px;
             background: #fff;
        }
        
            .soc .choose-header{
                 width: 800px;
            }
        
            .choose-header h1{
                 position: absolute;
            }
        
            .choose-header h2{
                 position: absolute;
                 top: 20px;
            }
        
            .choose-header-close{
                 position: absolute;
                 right: -3px;
                 width: 20px;
                 height: 20px
            }
        
        .choose-content{
             position: absolute;
             top: 35px;
             width: 265px;
             height: 475px;
             overflow: auto;
             overflow-x: hidden;
        }
        
        .soc .choose-content{
             width: 800px;
             
        }
        
            .choose-content-inner{
                 width: 250px;
            }
            
            .soc .choose-content-inner{
                 width: 800px;
                 
            }
            
                    .choose-content-inner table{
                        margin: 5px 0px 10px 0px;
                    }
                
                    .choose-content-inner table td{
                        width: 85px;
                        border: solid 0px #F00
                    }
                    
                    .pro-img{
                        width: 80px;
                    }
                    
                    .pro-img img{
                        width: 80px;
                    }
                    
                    .pro-info{
                        width: 80px;
                    }
                    
                    .pro-info p{
                        margin: 2px 2px 5px 0px;
                        font-size: 10px
                    }
                    
         .choose-pg{
             position: absolute;
             bottom: 0px;
             width: 250px;
             height: 20px;
         } 
            
            .choose-pg ul{
             margin-top: 5px
            }
            
            .choose-pg ul li{
                display:inline;
            }
            
            .choose-pg ul li a{
                color: #7f7f7f
            }
            
            .choose-pg ul li a:hover, .choose-pg ul li a.s{
                color: #ffa303
            }           
        
            
     .ld{
        position: absolute;
        top: 10px;
        right: 10px;
        width: 670px;
        height: 530px;
        background: #FFF;
    }
    
        .innerld{
             position: absolute;
             top: 10px;
             left: 10px;
             width: 650px;
             height: 510px;
        }
        
        .ld-header{
             position: absolute;
             width: 650px;
             height: 60px;
        }
        
            .ld-header h1{
                 position: absolute;
            }
        
            .ld-header h2{
                 position: absolute;
                 top: 20px;
            }
        
            .ld-header-close{
                 position: absolute;
                 right: -3px;
                 width: 20px;
                 height: 20px
            }
        
        .ld-content{
             position: absolute;
             top: 60px;
             width: 650px;
             height: 450px;
             overflow: hidden;
        }
        
            .ld-content-left{
                 position: absolute;
                 width: 270px;
                 height: 450px;
                 overflow: hidden;
            }
            
                 .ld-content-left table{
                    width: 100%;
                    margin-bottom: 10px
                }
                
                .ld-content-left table td{
                    width: 87px;
                    padding-bottom: 5px
                }
                
                .ld-content-left table td a{
                    color: #7f7f7f
                }
                
                .ld-content-left table td a:hover{
                    color: #e7604a
                }
                
                 .ld-content-left table td img{
                    width: 87px;
                }
                
                .ld-content-left table td.sp{
                    width: 5px;
                    background: #FFF
                }
                
                .ld-content-left table td.sp div{
                    width: 5px;
                    height: 10px;
                }
                
                .ld-content-left table td.hd{
                    padding-bottom: 5px
                }
            
                
            
            .ld-content-right{
                 position: absolute;
                 right: 0px;
                 width: 370px;
                 height: 450px;
                 overflow: hidden;
            }
            
            .ld-content-right div.ld_layer{
                 position: absolute;
                 width: 370px;
                 height: 450px;
                 overflow: hidden;
            }
            
            .ld-content-bottom{
                position: absolute;
                 right: 0px;
                 bottom: 0px;
                 background: #e7604a;
            }
            
                .ld-content-bottom span{
                      font-size: 20px;
                    color: #FFF;
                    padding: 10px;
                    display: block
                }
            
            .ld-content-right img{
                 width: 370px;
            }
            
            
.share-wrap{
            position: absolute;
            right: 10px;
            top: 10px;
            border: solid 0px #F00
        }
        
        .share{
            float: right;
            margin-left: 5px;
            cursor: pointer;
        }
      
        .pinimg{
             float: right;
        }            
            
            
      .sharefb{
            position: absolute;
            left: 360px;
            top: 170px;
            background: #fff;
            border: solid 0px #F00
        }
        
        .shfb2{
            left: 450px;
            top: 170px;
            padding: 20px;
            
        }

        
        .sharefb  h1{margin-bottom: 20px}
        
        .sharefb  table{
            margin-left: 15px;
  
        }
        
        .sharefb  table td.sp{
            width: 20px;
        }
        
        .sharefb  table td.sp div{
            width: 20px;
            height: 10px;
        }
       

        
            
/*
Bottom elements
------------------------------------------------------------- */        

div.bottomwrap{
    width: 980px;
}

    div.innerwrap{
        margin: 20px auto;
        width: 920px;
        min-height: 50px;
        background: url("../gfx/border.png") repeat-y top center
    }
    
        div.left{
            position: relative;
            float: left;
            width: 449px;
            min-height: 50px;
        }
        
            .bigred{
                width: 449px;
                height: 89px;
                background: #e7604a;
            }
            
            .bigred span{
                font-size: 35px;
                color: #FFF;
                padding: 30px 0px 0px 20px;
                display: block
            }
            
            .pricerbox{/*e7604a*/
                float: left;
                position: relative;
                width: 180px;
                height: 89px;
                text-align: center;
                background: #e7604a;
            }
            
            .pricerbox span.info{
                position: absolute;
                top: -12px;
                left: 28px;
                font-size: 12px;
                border: solid 0px #000
            }
            
            @media screen and (-webkit-min-device-pixel-ratio:0) {
                .pricerbox span.info{
                    position: absolute;
                    top: -12px;
                    left: 15px;
                    font-size: 12px;
                    width: 80px;
                    border: solid 0px #000
                }
            }
            
            .pricerbox span.info2{
                position: absolute;
                top: -12px;
                left: 18px;
                font-size: 12px;
            }
            
             @media screen and (-webkit-min-device-pixel-ratio:0) {
                .pricerbox span.info2{
                    position: absolute;
                    top: -12px;
                    left: 3px;
                    font-size: 12px;
                    width: 80px;
                    border: solid 0px #000
                }
            }
            
            .pricerbox span{
                font-size: 35px;
                color: #FFF;
                padding: 30px 0px 0px 0px;
                display: block
            }
            
            div.left ul{
               list-style-type:none;
               margin-bottom: 5px
            }
            
            div.left ul li{
               display:inline;
            }
            
            .infobox{
                float: right;
                width: 250px;
                min-height: 95px;
            }
            
                .infobox table td{
                    padding-bottom: 5px
                }
                
                    .infobox table td span{
                        display: block
                    }
        
        div.right{
            position: relative;
            float: right;
            width: 450px;
            min-height: 50px;
        }
        
            div.categories{
                float: left;
                width: 451px;
                min-height: 89px;
            }
            
                div.category{
                    float: left;
                    margin-right: 1px;
                    width: 89px;
                    height: 89px;
                }

            
            div.sysf{
                float: left;
                margin-top: 10px;
                width: 449px;
                min-height: 62px;
            }
            
                div.sys{
                    float: right;
                    margin-left: 1px;
                    width: 62px;
                    height: 62px;
                }

