/* main tags */

html, body {height: 100%;}

body {font: normal 100% Tahoma, Arial;}

/* structure */

#outer {position: relative; min-width: 999px; width: 100%; height: 100%;}
    * html #outer {width:expression(document.body.clientWidth > 999?"100%":"999px");}
    #logo {position: absolute; z-index: 1; min-width: 999px; width: 100%; text-align: center;}
    

#box {position: relative; min-width: 999px; position: relative; width: 100%; height: 100%;}
    * html #box {width:expression(document.body.clientWidth > 999?"100%":"999px");}
    
    #box td {width: 50%; padding: 0 0 20px 0;}    
        #box td.c1 {background: url(../img/bg_left.jpg) right 0;}
            #box td.c1 #pic1 {position: relative; z-index: 2; padding: 125px 70px 0 0; text-align: right;}
            
        #box td.c2 {background: url(../img/bg_right.jpg) 0 0;}
            #box td.c2 #pic2 {position: relative; z-index: 2; padding: 125px 0 0 70px;}
    
    #ramka1 {width: 240px; height: 117px; margin: 25px 130px 0 auto; background: url(../img/ramka1.png) 0 0 no-repeat;}
        #ramka1 td {padding: 5px 0 0; text-align: center; vertical-align: middle;}
        #ramka1 a {display: block; font-size: 15px; color: #f9cd7f;}
        #ramka1 a:hover {text-decoration: none;}
    
    #ramka2 {width: 227px; height: 129px; margin: 15px 0 0 140px; background: url(../img/ramka2.png) 0 0 no-repeat;}
        #ramka2 td {padding: 10px 0 0; text-align: center; vertical-align: middle;}
        #ramka2 a {display: block; font-size: 15px; color: #400608;}
        #ramka2 a:hover {text-decoration: none;}

/* styles */