/* CSS Document */
html {height: 100%; font-size: 62.5%;} /* 16 px × 62,5 % = 10 px */

@font-face {
  font-family: 'Gotham';
  src: url('fonts/Gotham-Ultra.otf'); /* IE9 Compat Modes */
     url('fonts/Gotham-Ultra.otf') format('otf'); /* Modern Browsers */
   font-weight: 900;
   font-style: normal;
 }
 
@font-face {
  font-family: 'Gotham';
  src: url('fonts/Gotham-Thin.otf'); /* IE9 Compat Modes */
     url('fonts/Gotham-Thin.otf') format('otf'); /* Modern Browsers */
   font-weight: 400;
   font-style: normal;
 } 
 
@font-face {
  font-family: 'Gotham Narrow';
  src: url('fonts/GothamNarrow-Light.otf'); /* IE9 Compat Modes */
     url('fonts/GothamNarrow-Light.otf') format('otf'); /* Modern Browsers */
   font-weight: 400;
   font-style: normal;
 }
   
p{
  font-family: Gotham Narrow;
  margin:0px 20px;
}

a{
text-decoration: none;
}

a.menu{
color:#000;
}

a.menu:hover{
color:#000;
font-weight:800;
}

.upper{
text-transform: uppercase;
}

.dovetek{
  font-family: Gotham Narrow;
  font-style: italic;
  font-size: 14px;
  font-weight:bold;
}

h1{
  font-family:Gotham;
  font-weight: bold;
  color:#000;
  margin:20px;  
}

h2{
  font-size:20px;
  font-family:Gotham Narrow;
  font-weight: 800;
  color:#000;
  margin:30px 0px 10px 20px;  
}

.clear{
  clear: both;
} 

.copy{
  font-size:13px;
  font-weight: 400;
  color:#000;
  text-align: center;
  margin:75px 0px 50px;
}

body {
  font-family: Gotham Narrow;
	font-size:150%;
	margin:0px;
	padding:0px;
	height: 900px;
	background:#fff url(img/bcgwork.jpg) top center fixed no-repeat ;
}

#kontejner {
  position:relative;
  float:center;
	margin:0px auto;
	min-height: 300px;
  width:1184px;
}

#kontejner-big {
  position:relative;
  float:center;
	margin:0px auto;
	min-height: 300px;
  width:1284px;
}

#logoaproc{
  position:relative;
  float:left;
  width:100%;
  margin-bottom:-20px;
}

#logo{
  position:relative;
  float:left;
  margin:45px 0px 0px;
  width: 454px;
	height: 51px;
}


#refff{
  position:relative;
  float:right;
  margin:45px 42px 0px;
  width: 50px;
	height: 30px;
}

#bonuss{
  position:relative;
  float:right;
  margin:45px 0px 0px;
  width: 50px;
	height: 30px;
}

#face{
  position:relative;
  float:right;
  margin:45px 20px 0px 0px;
  width: 30px;
	height: 30px;
}

#ig{
  position:relative;
  float:right;
  margin:45px 0px 0px 0px;
  width: 30px;
	height: 30px;
}

#proc{
  position:relative;
  float:left;
  margin:30px 0px 0px;
  width: 200px;

}

#prihlaseni{
  position:relative;
  float:right;
  margin:0px 0px 25px 0px;
  width: 800px;
	height: 35px;
  text-align:right;
}

#menu-reg{
  position:relative;
  float:right;
  margin:5px 22px 5px 0px;
  width: 800px;
	height: 35px;
  text-align:right;
  font-size:18px;
  text-transform: uppercase;
}

#menu-reg a{
color:#000;
}

.registr{
position:relative;
float:right;
margin:10px 0px 10px 10px;
}

.prihl{
  position:relative;
  height:30px;
  margin-top:-15px;
}

.odeslat{
  position:relative;
  float:right;
  margin:5px 22px 0px 15px;
}

#menupole {
  position:relative;
  float:left;
	margin:0px auto;
	min-height: 300px;
  width:1184px;
}

#textpole {
  position:relative;
  float:left;
	margin:0px auto;
	min-height: 300px;
  width:1184px;
}

.menu-nadpis{
  font-family:Gotham;
  font-weight: bold;
  color:#fff;
  margin:20px;
}

.menu-text{
  font-family:Gotham Narrow;
  font-weight: 200;
  color:#fff;
  margin:0px 20px;
  font-size:17px;
}

.menu-text-b{
  font-family:Gotham Narrow;
  font-weight: 400;
  color:#fff;
  margin:0px 20px;
  font-size:17px;
}

.sipka{
  position: absolute;
  bottom:15px;
  right:15px;
  width:19px;
  height:19px;
  background: url(img/sipka.png);
}

#m-facebook{
  position:relative;
  float:left;
	margin:7px 14px 7px 0px;
  width:280px;
  height:280px;
  border-radius: 0px 25px 0px 25px;
  box-shadow: 3px 3px 10px rgba(0, 0, 0, .5);
  background:#1466bc;
}

#m-facebook:hover, #m-socsite:hover, #m-ppc:hover, #m-seo:hover,  #m-google:hover, #m-web:hover, #m-zviditelneni:hover, #m-specialni:hover, #m-registrace:hover  {
  box-shadow: 0px 0px 20px rgba(0, 0, 0, .8);
  opacity:0.90;
}

#m-socsite{
  position:relative;
  float:left;
	margin:7px 14px 7px 0px;
  width:280px;
  height:280px;
  border-radius: 0px 25px 0px 25px;
  box-shadow: 3px 3px 10px rgba(0, 0, 0, .5);
  background:#95cd16;
}

#m-ppc{
  position:relative;
  float:left;
	margin:7px 14px 7px 0px;
  width:280px;
  height:280px;
  border-radius: 0px 25px 0px 25px;
  box-shadow: 3px 3px 10px rgba(0, 0, 0, .5);
  background:#3f12b5;
}

#m-seo{
  position:relative;
  float:left;
	margin:7px 14px 7px 0px;
  width:280px;
  height:280px;
  border-radius: 0px 25px 0px 25px;
  box-shadow: 3px 3px 10px rgba(0, 0, 0, .5);
  background:#e20070;
}

#m-google{
  position:relative;
  float:left;
	margin:7px 14px 7px 0px;
  width:280px;
  height:280px;
  border-radius: 0px 25px 0px 25px;
  box-shadow: 3px 3px 10px rgba(0, 0, 0, .5);
  background:#df120f;
}

#m-web{
  position:relative;
  float:left;
	margin:7px 14px 7px 0px;
  width:280px;
  height:280px;
  border-radius: 0px 25px 0px 25px;
  box-shadow: 3px 3px 10px rgba(0, 0, 0, .5);
  background:#d85e13;
}

#m-zviditelneni{
  position:relative;
  float:left;
	margin:7px 14px 7px 0px;
  width:280px;
  height:280px;
  border-radius: 0px 25px 0px 25px;
  box-shadow: 3px 3px 10px rgba(0, 0, 0, .5);
  background:#d1b90f;
}

#m-specialni{
  position:relative;
  float:left;
	margin:7px 14px 7px 0px;
  width:280px;
  height:280px;
  border-radius: 0px 25px 0px 25px;
  box-shadow: 3px 3px 10px rgba(0, 0, 0, .5);
  background:#38a248;
}

#m-registrace{
  position:relative;
  float:left;
	margin:7px 14px 7px 0px;
  width:1162px;
  height:50px;
  border-radius: 0px 25px 0px 25px;
  box-shadow: 3px 3px 10px rgba(0, 0, 0, .5);
  background:#00b1ad;
}

#m-registrace h2{
line-height:50px;
text-align:center;
padding:0;
margin:0;
}

#textpole {
  position:relative;
  float:left;
	margin:10px auto;
	min-height: 300px;
  width:1184px;
	background:#ffffff;
  border-radius:0px 25px 0px 25px;
  box-shadow: 3px 3px 30px rgba(0, 0, 0, .5);
  color:#000;
  padding-bottom:25px;
}

#textpole-fb {
  position:relative;
  float:left;
	margin:10px auto;
	min-height: 300px;
  width:1184px;
	background:#ffffff url(img/tablet.jpg) right 40% no-repeat;
  border-radius:0px 25px 0px 25px;
  box-shadow: 3px 3px 30px rgba(0, 0, 0, .5);
  color:#000;
  padding-bottom:25px;
}

#textpole-ppc {
  position:relative;
  float:left;
	margin:10px auto;
	min-height: 300px;
  width:1184px;
	background:#ffffff url(img/ppc.png) right 10% no-repeat;
  border-radius:0px 25px 0px 25px;
  box-shadow: 3px 3px 30px rgba(0, 0, 0, .5);
  color:#000;
  padding-bottom:25px;
}

#textpole-seo{
  position:relative;
  float:left;
	margin:10px auto;
	min-height: 600px;
  width:1184px;
	background:#ffffff url(img/seo.png) right 100% no-repeat;
  border-radius:0px 25px 0px 25px;
  box-shadow: 3px 3px 30px rgba(0, 0, 0, .5);
  color:#000;
  padding-bottom:25px;
}

#textpole-soc{
  position:relative;
  float:left;
	margin:10px auto;
	min-height: 700px;
  width:1184px;
	background:#ffffff url(img/soc2.jpg) right 100% no-repeat;
  border-radius:0px 25px 0px 25px;
  box-shadow: 3px 3px 30px rgba(0, 0, 0, .5);
  color:#000;
  padding-bottom:25px;
}

#textpole-web{
  position:relative;
  float:left;
	margin:10px auto;
	min-height: 700px;
  width:1184px;
	background:#ffffff url(img/soc.jpg) right 100% no-repeat;
  border-radius:0px 25px 0px 25px;
  box-shadow: 3px 3px 30px rgba(0, 0, 0, .5);
  color:#000;
  padding-bottom:25px;
}

#textpole-google{
  position:relative;
  float:left;
	margin:10px auto;
	min-height: 600px;
  width:1184px;
	background:#ffffff url(img/google.jpg) -20% 100% no-repeat;
  border-radius:0px 25px 0px 25px;
  box-shadow: 3px 3px 30px rgba(0, 0, 0, .5);
  color:#000;
  padding-bottom:25px;
}

#textpole-spec{
  position:relative;
  float:left;
	margin:10px auto;
	min-height: 700px;
  width:1184px;
	background:#ffffff url(img/specialni.png) right 100% no-repeat;
  border-radius:0px 25px 0px 25px;
  box-shadow: 3px 3px 30px rgba(0, 0, 0, .5);
  color:#000;
  padding-bottom:25px;
}

#textpole-graf{
  position:relative;
  float:left;
	margin:10px auto;
	min-height: 700px;
  width:1184px;
	background:#ffffff url(img/grafika.png) right 100% no-repeat;
  border-radius:0px 25px 0px 25px;
  box-shadow: 3px 3px 30px rgba(0, 0, 0, .5);
  color:#000;
  padding-bottom:25px;
}


#zpet{
  position:absolute;
  top:10px;
  right:10px;
}

.tablet{
  position:relative;
  float:right;
  width:650px;
  margin: 150px 25px 0px 0px;
}

a.procpop{
    position:relative; 
    z-index:20; 
    color:#000;
    text-decoration:none;
    font-size:12pt;
    font-weight:100;}

a.procpop:hover{z-index:25;}

a.procpop span{display: none}

a.procpop:hover span{ 
    display:block;
    font-size:100%;
    position:absolute;
    top:20px; left:20px; width:540px;
    border-radius:0px 25px 0px 25px;
    background-color:#fff; color:#000;
    box-shadow: 3px 3px 30px rgba(0, 0, 0, .5);
    text-align: justify;
    padding:20px;
    }
    
    .clear{
    clear:both;
    width:100%;
    }
    
.refer{
position:relative;
display:block;
margin:50px auto;
box-shadow: 3px 3px 30px rgba(0, 0, 0, .5);
border-radius:0px 25px 0px 25px;
}    

#HIDDENDIV {
    display: none;
}

#tableX.show tr > *:nth-child(2) {
    display: block;
}

#tableX{
position:relative;
margin:50px auto;
}

.stredX{
position:relative;
float:center;
margin:0px 440px;
width:200px;
padding:5px 10px;
    border-radius:5px;
}

.stredBtn{
position:relative;
float:center;
margin:0px 500px;
width:100px;
padding:5px 10px;
    border-radius:5px;

}

.refiky img{

}


.letak{
position:relative;
margin: 30px 217px;
}

#m-regi{
  position:relative;
  float:left;
	margin:7px 14px 7px 0px;
  width:1162px;
  height:75px;
  border-radius: 0px 25px 0px 25px;
  box-shadow: 3px 3px 10px rgba(0, 0, 0, .5);
  background:#d1b90f;
}

#m-prihl{
  position:relative;
  float:left;
	margin:7px 14px 7px 0px;
  width:1162px;
  height:75px;
  border-radius: 0px 25px 0px 25px;
  box-shadow: 3px 3px 10px rgba(0, 0, 0, .5);
  background:#e20070;
}

#m-bonus{
  position:relative;
  float:left;
	margin:7px 14px 7px 0px;
  width:1162px;
  height:75px;
  border-radius: 0px 25px 0px 25px;
  box-shadow: 3px 3px 10px rgba(0, 0, 0, .5);
  background:#1466bc;
}

#m-regi h2, #m-prihl h2, #m-bonus h2{
line-height:75px;
text-align:center;
padding:0;
margin:0;
}



#modal {
    position: fixed;
    font-family: Arial, Helvetica, sans-serif;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 99999;
    height: 100%;
    width: 100%;
}
.modalconent {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);

    padding: 20px;
}

.bonuspop{
height:570px;
}

.btnpop{
float:right;
margin-top:10px;
}