body { margin: 0; 
background-color:black;
}

h1{
color: #00BCF3;
font-size:1.3em;
margin:0px;
padding:0px;
}
h2{
font-size:0.9em;
margin:0px;
padding-top:15px;
padding-bottom:15px;
padding-left:5px;
}
h3{
font-size:0.9em;
margin:0px;
padding-bottom:15px;
padding-left:5px;
}

.container{
font-family: 'century gothic';
width: 1000px;
margin: auto;
}
#bod{
width: 100%;
background-color:white;
margin: 0px;
padding: 0px;
outline: 0px none;
float:right;
height: 1px; 
height: 100%; 
}
#top{
width: 100%;
height: 150px;
background-color:black;
margin: 0px;
padding: 0px;
outline: 0px none;
}
#logo{
float:left;
width: 500px;
height: 88px;
background-color:black;
margin-right:100px;
margin-top:40px;
}
#menu{
width: 400px;
height: 150px;
float:left;
}
#menucontent{
margin-left:110px;
margin-top: 50px;
background-color: black;
width: 300px;
height: 60px;
background-color:black;
background: url(./img/logo2.png); 
}
#content{
width: 1000px;
float:right;
background-color:white;
 box-shadow: 10px 10px 25px #888888;
}
.ico{
width: 170px;
height:170px;
float:left;
margin:10px;
 border-radius: 12px 12px 12px 12px;
-webkit-box-shadow: 3px 3px 9px 0px rgba(50, 50, 50, 0.75);
-moz-box-shadow:    3px 3px 9px 0px rgba(50, 50, 50, 0.75);
box-shadow:         3px 3px 9px 0px rgba(50, 50, 50, 0.75);
}
.ico:hover{
background-color:#BCE6F4;
}

/*BOX NA ARTICLE*/
#gg{
margin-top:25px;
margin-left:25px;
width: 500px;
height: 346px;
background: url(./img/gg.png);
float:left;
}
#box{
text-align: justify;
width: 375px;
overflow:hidden;
padding-top:50px;
padding-bottom:15px;
margin-bottom: 15px;
padding-right:70px;
color: 	black;
font-family: 'century gothic';
font-size:1.2em;
float:right;
}
#lane{
background-color: #00BCF3;
width:100%;
height: 10px;
float:left;
}
#lane2{
margin-top:50px;
width:100%;
float:left;
}

#slider{
background-color: white;
margin-bottom:10px;
width: 1000px;
height: 200px;
float:left;
}



/*STOPKA*/

#bot{
width: 100%;
margin: 0px;
background-color:black;
outline: 0px none;
float:right;
height: 1px; 
height: 100%; 
}


#stopka{

width:1000px;
height:100px;
margin: 0px;
padding: 0px;
outline: 0px none;
background-color:black;
float:left;
}

#stopkamenu{
padding-top: 30px;
}
a:hover, a:visited, a:link, a:active
{
    text-decoration: none;
	color: white; 
}
.stopkainfo{
color: white; 
text-decoration: none;
padding-top: 40px;
width: 500px;
float:right;
font-family: 'century gothic';
font-size: 15px;
}
.stopkainfo2{
padding-top: 40px;
width: 250px;
height: 150px;
float:left;
color: black;
font-family: 'century gothic';
font-size: 13px;
}

l {
color:	black ;
text-align: left;
}
ll {
color:	black ;
text-align: left;
}




/*===============END FONTS INCLUDE--------------------*/
/*===============MENU STYLE--------------------*/
#libot{
padding-top:25px;
color: #00688F;
width: 150px;
height: 80px;
float:left;
text-align:center;
font-family: 'impact';
font-size:1.4em;
background-color: #DCDCDC ;
}
#libot2{
padding-top:25px;
color:white;
width: 150px;
height: 80px;
float:left;
text-align:center;
font-family: 'impact';
font-size:1.4em;
background-color: #00688F;
}
.libot
{ color: #00688F;
text-decoration: none;
} 
.li
{ color: white; 
text-decoration: none;
} 
#licurrent{
text-decoration: none;
background-color: #00688F;
color: white;
padding-top:60px;
width: 150px;
height: 90px;
float:left;
text-align:center;
font-family: 'Impact';
font-size:1.4em;
}
#li{
padding-top:60px;
color:white;
width: 150px;
height: 90px;
float:left;
text-align:center;
font-family: 'impact';
font-size:1.4em;
}
#li:hover{
color:white;
background-color: #00688F;
padding-top:60px;
width: 150px;
height: 90px;
float:left;
text-align:center;
font-family: 'impact';
font-size:1.4em;

}
/*===============END MENU STYLE--------------------*/






/*================KONTAKT=======================*/



}
#boxkontakt{
width: 900px;
overflow:hidden;
}
#leftsidemailer{
float:left;
width: 300px;
font-family: 'impact';
color:#01BCF3;
font-size:1.4em;
margin-left:50px;
padding-top:50px;
}
#kontaktform{
width: 600px;
overflow:hidden;
color:#01BCF3;
font-family: 'impact';
padding-bottom:50px;
padding-top:50px;

}
#adresfirmy{

margin-top:30px;
float:left;
color:#01BCF3;
font-family: 'century gothic';
font-size:0.7em;

}






textarea {
  resize:none;
  max-width:100%;
  min-width:100%;
}


input {
  
    
    width:100%;
}

select {
  
    
    width:100%;
}










/* ============== END KONTAKT =========== */


#items{
width: 1000px;
margin-left:25px;
}
#txtHint{
margin-bottom: 20px;
margin-top: 50px;
width: 680px;
float:left;
}
.head{
padding-left: 5px;
width: 220px;
float:left;
border-bottom: 30px solid #47D1FF;
border-right: 15px solid transparent;
line-height: 2em;
margin: 0px;
height: 0px;
}
#selectorsc{
margin-left: 80px;
margin-top: 50px;
width: 240px;
float:left;

}
#selectorshead{

margin-left: 80px;
margin-top: 50px;
width: 240px;
float:left;
}
#selectors{
padding: 10px;
width: 240px;
float:left;

-webkit-box-shadow: 0px 6px 8px 1px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 6px 8px 1px rgba(0,0,0,0.75);
box-shadow: 0px 6px 8px 1px rgba(0,0,0,0.75);
}

}
#selectors2{
float:left;
}
#results{
font-size:0.8em;
width: 240px;
float:left;
}
#nakladc{
margin-left: 30px;
width: 270px;
float:left;
}
#nakladhead{
margin-left: 30px;
width: 270px;
float:left;
}
#naklad{
padding: 10px;
width: 270px;
float:left;

-webkit-box-shadow: 0px 6px 8px 1px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 6px 8px 1px rgba(0,0,0,0.75);
box-shadow: 0px 6px 8px 1px rgba(0,0,0,0.75);
}
#orderc{
margin-left: 30px;
width: 270px;
float:left;
}
#orderhead{
margin-left: 30px;
width: 270px;
float:left;
}
#orderinfo{
margin-bottom: 15px;
padding: 10px;
width: 270px;
float:left;

-webkit-box-shadow: 0px 6px 8px 1px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 6px 8px 1px rgba(0,0,0,0.75);
box-shadow: 0px 6px 8px 1px rgba(0,0,0,0.75);
}
#order{
padding: 10px;
width: 270px;
float:left;

-webkit-box-shadow: 0px 6px 8px 1px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 6px 8px 1px rgba(0,0,0,0.75);
box-shadow: 0px 6px 8px 1px rgba(0,0,0,0.75);
}
.dropdown select { 
	  margin-bottom:10px;
      width: 200px;            /    *Width of select dropdown to give space for arrow image*/
}

/*===============FONTS INCLUDE--------------------*/
@font-face {
font-family: 'base4';
src: local('base4.ttf'), url(fonts/base4.ttf) format("truetype")
}
@font-face {
font-family: 'zekton';
src: local('zekton rg.ttf'), url(fonts/zekton rg.ttf.ttf) format("truetype")
}
@font-face {
font-family: 'pictogramz';
src: local('pictogramz.ttf'), url(fonts/pictogramz.ttf) format("truetype")
}
@font-face {
font-family: 'century gothic';
src: local('GOTHIC.TTF'), url(fonts/GOTHIC.TTF) format("truetype")
}



/*hover*/
.item {
  width: 170px;
  height: 170px;
  transition: all 1s ease;
}
.item img {
  width: 100%;
}
.item:hover .overlay {
  background: #FFF;
  opacity:0.8;
}
.item:hover .button {
  width: 70px;
  height: 70px;
  background: url(http://immedesign.nl/cssdeck/next.png) center center no-repeat #0076ED;
  opacity: .7;
  transform:scale(1);
  animation-delay: inherit;
  animation:scale .5s infinite;   
  cursor: pointer;
}
.overlay {
  width: 150px;
  height: 150px;
  margin: -170px 0px 0 10px;
  background: #000;
  opacity:0;
  transition: all 1s ease;
}
.button {
  width: 123px;
  height: 123px;
  margin: -115px auto 0 auto;
  background: url(http://immedesign.nl/cssdeck/next.png) center center no-repeat;
  opacity: 0;
  border-radius: 50%;
  transition: all .2s ease;
}

@keyframes scale {
  0%   { transform:scale(1); }
  50%   { transform:scale(1.1); }
  100% { transform:scale(1); }
}