*{
    margin:0; padding:0; outline:none;
}
body,html{
    height:100%;
  /*    background: url('./../img/bg.png') no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
*/
}
body{
    color:black; 
    text-align:left; 
    font-family: 'Open Sans Condensed', sans-serif;
    font-size:13px; 
    font-weight:300;
}

.width_100 {
    width: 100%;
}

/* headings */
h1{ font-size:30px; color: black;text-align: left;  margin-bottom: 10px;}
h2{ font-size:24px; color: black;text-align: left; margin-bottom: 10px;}
h3{ font-size:16px; color: black;text-align: left; margin-bottom: 10px;}
h4{font-size:22px; font-weight: 500; color: black; margin-top: 2px;}

a.lincik { background:  #82b440; border: 1px solid black; border-radius: 5px; padding: 5px; }

a.lincik:hover { background:  #82b440; border: 1px dotted black; border-radius: 5px;  padding: 5px; }

p {
    font-size: 18px;
    color: black;
    text-align: left;
}

p.patka {
    font-size: 18px;
    color: #656565;
    text-align: left;
    font-weight: 500;
}

p.grid {
    font-size: 20px;
    color: #383838;
    text-align: left;
}
/* links */
a{text-decoration:none; color:white;}
a:hover{text-decoration:underline;}
a.fill-link{
    display: block;
    width: 100%;
    height: 100%;;

}
/* grids */
[class*="grid_"]{float:left; margin:0px 0px 0px 1%; -webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
[class*="grid_"]:first-child{margin-left:0px;}
.grid-no-margin [class*="grid_"]{margin-bottom:0px;}
.grid_1{width:6.5%;}
.grid_2{width:15%;}
.grid_3{width:23.5%;}
.grid_4{width:32%;}
.grid_5{width:40.5%;}
.grid_6{width:49%;}
.grid_7{width:57.5%;}
.grid_8{width:66%;}
.grid_9{width:74.5%;}
.grid_10{width:83%;}
.grid_11{width:91.5%;}
.grid_12{width:100%;}

.clear{clear:both; display:block;}

#main {
position: relative;
height: 100%;
padding: 0px 30px 0px 30px;
}


#logo{ 

    width: 500px; 
    height: 130px;
    position: absolute;
    display: block;
    top: 30px;
	
}

#obsah {
position: absolute;
top: 190px;
}

#ramecek {
    background: url('./../img/ramecek-videa.png') no-repeat; 
    width: 502px; 
    height: 377px;
    position: relative;
    display: block;
    margin-bottom: 30px;
}

#vokno {
border: none;
}

.left {
position: absolute;
width: 500px;


}

.right {
position: absolute;
width: 650px;
left: 530px;
	border-left: 1px solid black;
	padding-left: 30px;

}

#thanks {
position: absolute;
top: 670px;
width: 800px;

}

#thanks h2 {
color: white;
}

.social {
margin: 0px 5px 0px 0px;
}

.formulardiv {
margin: 10px 0px 10px 0px;
}

#main-menu{
    font-size: 17px;
    font-family: 'Roboto Slab', serif;
    position: relative; 
    margin: 0px auto;
    margin-top: 20px;
    width: 970px;
    display: block;

}
#main-menu li{
    position:relative;
    display:inline-block;
    margin: 0px auto;
    margin-left:0px;
    text-align: center;
    text-transform: uppercase;
}

#main-menu li a{
    display:inline-block; 
    color:red;  
    width: 189px;
    height: 59px;
    text-decoration:none;
    padding-top: 18px;
}

#main-menu li.active{
    color:blue;
    background:transparent;
    background-image: url('../img/aktivni.png');
    text-decoration:none;
    width: 192px;
    height: 59px;
}

#main-menu li.active a{
    color:pink;
}

#main-menu li a:hover{
    color:yellow; 
}

#main-menu li.active a:hover{
    color:green;
}

#button{
	margin-top: 0px;
	margin-left: 10px;

    font-size: 13px;
    color: white;

    width: 240px;
    height: 40px;
    
    padding-top: 0px;


    background: url('./../img/send-tl.png') no-repeat;
    border: none;
    
    cursor: pointer;
}


#email {
    background: url(../img/form.png) left no-repeat;

    width: 280px;
    height: 40px;
}


::-webkit-input-placeholder {
   color: black;
}

:-moz-placeholder { /* Firefox 18- */
   color: black;  
}

::-moz-placeholder {  /* Firefox 19+ */
   color: black;  
}

:-ms-input-placeholder {  
   color: black;  
}

/* inputs */
input[type="text"],input[type="password"],input[type="file"],textarea,select{
    
border: 1px dotted black;
    
    background:transparent;  border-radius:0px; font-weight: bold; color:black; margin:0px 0px 0px 0px; padding:12px; line-height:20px; font-size:13px; -webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
input[type="text"].big,input[type="password"].big,input[type="file"].big,select.big{width:33%; margin-right:0px; display: inline-block;}
input[type="text"].medium,input[type="password"].medium,input[type="file"].medium,select.medium{width:200px;}
input[type="text"].small,input[type="password"].small,input[type="file"].small,select.small{width:100px;}
input[type="text"].xsmall,input[type="password"].xsmall,input[type="file"].xsmall,select.xsmall{width:70px;}
input[type="text"].xxsmall,input[type="password"].xxsmall,input[type="file"].xxsmall,select.xxsmall{width:40px;}
textarea{width:100%; height:210px; border: none; padding: 10px 0px 0px 0px;}
textarea.medium{width:75%; height:100px;}
textarea.small{width:50%; height:75px;}
input[type="text"]:hover,input[type="text"]:focus, input[type="password"]:hover,input[type="password"]:focus, input[type="file"]:hover,input[type="file"]:focus, textarea:hover,textarea:focus, select:hover,select:focus{}
input[type="checkbox"]{margin:2px 10px 0px 0px;; padding:0px;}
input[type="radio"]{margin:2px 10px 0px 0px;; padding:0px;}
input:disabled, select:disabled, textarea:disabled, range:disabled {background-color: #cccccc;}

.msg{padding:10px; margin:0px auto; margin: 10px 0px 0px 0px; width: 97%; cursor:pointer; font-size: 14px; border-radius: 5px; text-align: center;}
.msg.information{background:#daf7c9; color:#004e3f; border: 2px dotted #2ecc71;}
.msg.err{background:#fde2e2; color:#886666; border: 2px dotted red;}

.msg.err h2, .msg.information h2{  
    
    font-size: 24px;
    background: none;
    margin-bottom: 0px;
    
    color: #004e3f;

    font-weight: bold;
    text-align: center;
}

input[type="text"].error, textarea.error {
    /* remove the next line when you have trouble in IE6 with labels in list */

    font-style: italic;
    border: 1px dotted red;
    font-size: 14px;

}

label 
{ font-size:14px; color: black;text-align: left; margin-bottom: 0px;
font-style: italic;
margin-right: 10px;

}



#okno_form {

    padding: 10px;
}

.dlkontakt {
    margin-top: 30px;
}

#okno_form dl{
    margin-top: 10px;
    display:block;
    font-size: 13px;
}

#okno_form dl dt{
    font-weight: bold;
    display:inline-block;
    vertical-align:top;
    word-wrap:break-word;
    margin:0px 1% 10px 0px;
    width:30%;
}
#okno_form dl dd{

    display:inline-block;
    vertical-align:top;
    width:60%;
    margin:0px 0px 10px 0px;
}
#okno_form dl dd:last-child{
    margin-bottom:0px;
}

.span {
    position: relative;
    display: block;
    width: 100%;
    opacity: 0.80;
    margin-top: -32px;
    padding: 5px 0px 5px 0px;
    height: 20px;
    text-align: center;
    background-color: #000000;
    border: 1px #404040 solid;
    bottom: 0px;    
    left: 0px;
    font-size: 14px;

    color: #ffffff;
}

.span:hover {
    color: #000000;
    background-color: #faeab2;
}

.span_link {
    text-decoration: none;
    color: #ffffff;

}

.span_link:hover {
    text-decoration: none;
}

.span2 {
    position: relative;
    display: block;
    width: 100%;
    opacity: 0.80;
    margin-top: -32px;
    padding: 5px 0px 5px 0px;
    height: 20px;
    text-align: center;
    background-color: #000000;
    bottom: 0px;    
    left: 0px;
    font-size: 14px;

    color: #ffffff;
}

.span2:hover {
    

}

.span_link2 {
    text-decoration: none;

}

.span_link2:hover {
    text-decoration: none;
}

.span3 {
    position: relative;
    display: block;
    width: 100%;
    opacity: 0.80;
    margin-top: -52px;
    padding: 5px 0px 5px 0px;
    height: 40px;
    text-align: center;
    background-color: #000000;
    bottom: 0px;    
    left: 0px;
    font-size: 14px;

    color: #ffffff;
}

.span3:hover {
    

}

.span_link3 {
    text-decoration: none;

}

.span_link3:hover {
    text-decoration: none;
}

#okno_form .button{
    font-weight: bold;
    color:white;
    background: black;
    font-size: 16px;
    border: 1px solid black;
    padding:8px;
    float: right;
    font-family: 'Dosis', sans-serif;
    border-radius: 2px;
}

#okno_form .button:hover{
    background-color:white;
    color:black;
    text-decoration: none;
    border: 1px solid black;
}

#okno_form .full{width:100%; margin-right:0px; margin-left:0px; padding-left:0px; padding-right:0px;}

#load{
    position:relative;
    z-index:1;
    width:300px;
    height:200px;
    margin-top:-150px;
    margin-left:-100px;
    top:50%;
    left:50%;
    text-align:center;
    background:#daf7c9;
    color:#668866;
    border: 5px dotted #2ecc71;
    cursor:pointer;

    border-radius: 5px;
}

#load img {
    margin: 0px auto;
}

#load h2 {
    font-size: 30px;
    background: none;
    margin: 0px;
    padding: 0px;
    font-weight: bold;
    text-align: center;
}
