@font-face {
    font-family: 'citroen_lightregular';
    src: url('../fonty/citroen_light-webfont.eot');
    src: url('../fonty/citroen_light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonty/citroen_light-webfont.woff') format('woff'),
         url('../fonty/citroen_light-webfont.ttf') format('truetype'),
         url('../fonty/citroen_light-webfont.svg#citroen_lightregular') format('svg');
    font-weight: normal;
    font-style: normal;
	-moz-font-feature-settings: "liga=0";
	-moz-font-feature-settings: "liga" 0;
	}
	
@font-face {
    font-family: 'citroenregular';
    src: url('../fonty/citroen_regular-webfont.eot');
    src: url('../fonty/citroen_regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonty/citroen_regular-webfont.woff') format('woff'),
         url('../fonty/citroen_regular-webfont.ttf') format('truetype'),
         url('../fonty/citroen_regular-webfont.svg#citroenregular') format('svg');
    font-weight: normal;
    font-style: normal;
	-moz-font-feature-settings: "liga=0";
	-moz-font-feature-settings: "liga" 0;
	}
	
@font-face {
    font-family: 'citroenbold';
    src: url('../fonty/citroen_bold-webfont.eot');
    src: url('../fonty/citroen_bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonty/citroen_bold-webfont.woff') format('woff'),
         url('../fonty/citroen_bold-webfont.ttf') format('truetype'),
         url('../fonty/citroen_bold-webfont.svg#citroenbold') format('svg');
    font-weight: normal;
    font-style: normal;
	-moz-font-feature-settings: "liga=0";
	-moz-font-feature-settings: "liga" 0;
	}

p             { font-family: 'citroenregular'; 
                font-size: 16px; line-height: 15px; font-weight: normal;
                color: #555; display: inline;  }

h1            { font-family: 'citroenbold'; 
                font-size: 38px; line-height: 60px; font-weight: normal;
                color: #000; display: inline; }

h2            { font-family: 'citroenbold'; 
                font-size: 25px; line-height: 30px; font-weight: normal;
                color: #000; display: inline; }            

h3            { font-family: 'citroenbold'; 
                font-size: 15px; line-height: 16px; font-weight: normal;
				color: #d20013; display: inline; }

h4            { font-family: 'citroenregular'; 
                font-size: 18px; line-height: 20px; font-weight: normal;
                color: #000; display: inline;  }

h5            { font-family: 'citroenbold'; 
                font-size: 18px; line-height: 20px; font-weight: normal;
                color: #FFF; display: inline;  }

h6            { font-family: 'citroenbold'; 
                font-size: 26px; line-height: 35px; font-weight: normal;
                color: #555; display: inline; }    


table.center { margin-left:auto; 
               margin-right:auto;
               margin-top: 15px;
             }

#hp_odeslat          { border: 1px solid #999; background-color: #AAA; width: 150px; height: 30px; margin: 0; display: inline-block; cursor: pointer;
                       font-family: 'citroenregular'; 
                       font-size: 17px; line-height: 30px; font-weight: normal;
                       color: #FFF; text-align: center;
                     }
#hp_odeslat:hover    { background-color: #d20013; }

input[id=hp_email]   { border: 1px solid #999; width: 250px; height: 30px; margin: 0; padding: 0; background-color: #EEE; display: inline-block; text-align: center;
                       font-family: 'citroenregular'; 
                       font-size: 17px; line-height: 30px; font-weight: normal;
                       color: #000; }
  
body          { width:   100%; height:   100%; background-color: #EEE; margin: 0; padding: 0;  }

#site         { width: 1000px; height: 770px; position: relative; background: url("../img/bg.jpg") no-repeat #FFF; margin: 0 auto;  }

#fader        { width: 100%; height: 100%; position: absolute; left: 0px; top: 0px; background-color: #FFF; display: none; z-index: 77; cursor: pointer; }

#headline     { width: 1000px; height: auto; position: absolute; left: 0px; top:  20px; text-align: center; }
#formular     { width: 700px; height: auto; position: absolute; left: 50px; top: 620px; text-align: left; }
#podcarou     { width:  980px; height: 40px; position: absolute; left: 0px; top: 750px; text-align:   left; padding-top: 20px; padding-left: 20px; background-color: #FFF; }

#bubbles      { position: absolute; top: 10px; z-index: 50; }
#h_airbump    { width: 100px; height: 100px; border: 0px solid black; position: absolute; left:  80px; top: 300px; text-align: center; padding-top:  5px; cursor: pointer; z-index: 55; background-color: #FFF; }
#h_digital    { width: 100px; height: 100px; border: 0px solid black; position: absolute; left: 310px; top: 185px; text-align: center; padding-top:  5px; cursor: pointer; z-index: 55; background-color: #FFF; }
#h_ergo       { width: 100px; height: 100px; border: 0px solid black; position: absolute; left: 835px; top: 215px; text-align: center; padding-top: 25px; cursor: pointer; z-index: 55; background-color: #FFF; }
#h_interier   { width: 100px; height: 100px; border: 0px solid black; position: absolute; left:  60px; top: 495px; text-align: center; padding-top: 20px; cursor: pointer; z-index: 55; background-color: #FFF; }
#h_provoz     { width: 120px; height: 120px; border: 0px solid black; position: absolute; left: 840px; top: 420px; text-align: center; padding-top: 25px; cursor: pointer; z-index: 55; background-color: #FFF; }
#h_topbox     { width: 100px; height: 100px; border: 0px solid black; position: absolute; left: 565px; top: 180px; text-align: center; padding-top: 25px; cursor: pointer; z-index: 55; background-color: #FFF; }
#h_vyska      { width: 100px; height: 100px; border: 0px solid black; position: absolute; left: 690px; top: 575px; text-align: center; padding-top: 15px; cursor: pointer; z-index: 55; background-color: #FFF; }

#b_airbump    { width: 100px; height: 100px; border: 0px solid black; position: absolute; left:  80px; top: 300px; text-align: center; padding-top:  5px; cursor: pointer; z-index: 40; }
#b_digital    { width: 100px; height: 100px; border: 0px solid black; position: absolute; left: 310px; top: 185px; text-align: center; padding-top:  5px; cursor: pointer; z-index: 40; }
#b_ergo       { width: 100px; height: 100px; border: 0px solid black; position: absolute; left: 835px; top: 215px; text-align: center; padding-top: 25px; cursor: pointer; z-index: 40; }
#b_interier   { width: 100px; height: 100px; border: 0px solid black; position: absolute; left:  60px; top: 495px; text-align: center; padding-top: 20px; cursor: pointer; z-index: 40; }
#b_provoz     { width: 120px; height: 120px; border: 0px solid black; position: absolute; left: 840px; top: 420px; text-align: center; padding-top: 25px; cursor: pointer; z-index: 40; }
#b_topbox     { width: 100px; height: 100px; border: 0px solid black; position: absolute; left: 565px; top: 180px; text-align: center; padding-top: 25px; cursor: pointer; z-index: 40; }
#b_vyska      { width: 100px; height: 100px; border: 0px solid black; position: absolute; left: 690px; top: 575px; text-align: center; padding-top: 15px; cursor: pointer; z-index: 40; }

#bL_airbump    { width: 280px; height: 250px; border: 0px solid black; position: absolute; left: -20px; top: 170px; text-align: center; padding-top: 30px; background: url("../img/kolo.png"); display: none; cursor: pointer; z-index: 50; }
#bL_digital    { width: 280px; height: 250px; border: 0px solid black; position: absolute; left: 220px; top: 120px; text-align: center; padding-top: 30px; background: url("../img/kolo.png"); display: none; cursor: pointer; z-index: 50; }
#bL_ergo       { width: 280px; height: 250px; border: 0px solid black; position: absolute; left: 745px; top: 150px; text-align: center; padding-top: 30px; background: url("../img/kolo.png"); display: none; cursor: pointer; z-index: 50; }
#bL_interier   { width: 280px; height: 195px; border: 0px solid black; position: absolute; left: -20px; top: 420px; text-align: center; padding-top: 85px; background: url("../img/kolo.png"); display: none; cursor: pointer; z-index: 50; }
#bL_provoz     { width: 280px; height: 250px; border: 0px solid black; position: absolute; left: 750px; top: 355px; text-align: center; padding-top: 30px; background: url("../img/kolo.png"); display: none; cursor: pointer; z-index: 50; }
#bL_topbox     { width: 280px; height: 220px; border: 0px solid black; position: absolute; left: 475px; top: 115px; text-align: center; padding-top: 60px; background: url("../img/kolo.png"); display: none; cursor: pointer; z-index: 50; }
#bL_vyska      { width: 280px; height: 220px; border: 0px solid black; position: absolute; left: 600px; top: 510px; text-align: center; padding-top: 60px; background: url("../img/kolo.png"); display: none; cursor: pointer; z-index: 50; }

#bF_airbump    { width: 130px; height: 130px; border: 0px solid black; position: absolute; left: 75px; bottom: -30px; text-align: center; background: url("../img/b_airbump.png"); }
#bF_digital    { width: 130px; height: 130px; border: 0px solid black; position: absolute; left: 75px; bottom: -30px; text-align: center; background: url("../img/b_digital.png"); }
#bF_ergo       { width: 130px; height: 130px; border: 0px solid black; position: absolute; left: 75px; bottom: -30px; text-align: center; background: url("../img/b_ergo.png"); }
#bF_interier   { width: 130px; height: 130px; border: 0px solid black; position: absolute; left: 75px; bottom: -30px; text-align: center; background: url("../img/b_interier.png"); }
#bF_provoz     { width: 130px; height: 130px; border: 0px solid black; position: absolute; left: 75px; bottom: -30px; text-align: center; background: url("../img/b_provoz.png"); }
#bF_topbox     { width: 130px; height: 130px; border: 0px solid black; position: absolute; left: 75px; bottom: -30px; text-align: center; background: url("../img/b_topbox.png"); }
#bF_vyska      { width: 130px; height: 130px; border: 0px solid black; position: absolute; left: 75px; bottom: -30px; text-align: center; background: url("../img/b_vyska.png"); }


#vice          { text-decoration: underline; cursor: pointer; }
#form          { width: 400px; height: 365px; position: absolute; left: 50%; top: 50%; margin-left: -250px; margin-top: -230px; background-color: white; padding: 20px; padding-left: 100px; background: url("../img/logo_form.png") 20px 30px no-repeat #FFF; z-index: 99; display: none; }
#form h2       { color: #d20013; }
#form p,td     { font-family: 'citroenregular'; 
                 font-size: 18px; line-height: 20px; font-weight: normal;
                 color: #555; display: inline;  }
#form tr       { height: 30px; }
#form table    { margin-top: 15px; padding: 0; margin-bottom: 10px; }

#form input[type=text] { border: 1px solid #666; width: 220px; height: 15px; padding: 5px;
                         font-family: 'citroenregular'; 
                         font-size: 20px; line-height: 20px; font-weight: normal;
                         color: #444; }

#form .texte      { width: 150px; padding: 0px;
                    overflow: hidden;
                    display: inline-block;
                    white-space: nowrap;
                  }

#souhlas       { width: 400px; height: auto; position: absolute; left: 0px; top: 400px; background-color: white; padding: 20px; padding-left: 100px; z-index: 99; display: none; }
#souhlas p     { font-size: 14px; } 

#odeslat          { border: 0px solid #999; background-color: #c8c100; width: 150px; height: 20px; display: inline-block; cursor: pointer; padding: 10px; position: absolute; right: 25px; top: 350px; text-align: center;
                    font-family: 'citroenregular'; 
                    font-size: 23px; line-height: 20px; font-weight: normal;
                    color: #FFF;
                  }
#odeslat:hover    { background-color: #d20013; }                

#viceoc4          { border: 2px solid #FFF; background-color: #d20013; width: 170px; height: 35px; margin: 0; display: inline-block; margin-top: -35px; cursor: pointer;
                    font-family: 'citroenregular'; 
                    font-size: 17px; line-height: 36px; font-weight: normal; text-decoration: none;
                    color: #FFF; text-align: center;
                  }
#viceoc4:hover    { background-color: #999; }
   
:focus            { outline: 0px solid blue!important; }