/*
	blue: #0f446c
*/
/* FOTNS */
/* import fontu*/
@import url(https://fonts.googleapis.com/css?family=Ubuntu:100,300,700&subset=latin,latin-ext);

/* DEFAULT DEFINITION */
/* reset to default */
* { font-weight: inherit; font-family: inherit; font-style: inherit; color: inherit; cursor: inherit; font-size: 100%; border: 0 none; outline: 0; padding: 0; margin: 0; vertical-align: top;  }
* { transition: background 0.4s, color 0.4s; }
body { background: #fff	; font: 10px 'Ubuntu', "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 100; color: #656565;  }
@media only screen and (max-width: 768px) { body { font-size: 8px; } }

/* DEFAULT HTML TAGS DEFINITION */
h1 { position: absolute; top: 20px; left: 20px; }
h2 { color: #0f446c; font-size: 3em; }
h3 { color: #0f446c; font-size: 2em;  }
h2, h3, strong { font-weight: 700; }
a { color: #0f446c; }
p, ul{ font-size: 1.6em; line-height: 1.4em;}
p { margin-bottom: 0.75em; }

/* BASE SECTIONS DEFINITION */
/*base definition of main middle div*/
div.middle { max-width: 1000px; margin: 0 auto; position: relative;  }

/* header section*/
header { height: 450px; background: url('../img/bg-top.jpg') center bottom no-repeat #267aba; position: relative;  }
@media only screen and (min-width: 1200px) { header { height: 550px;  } }

header.header_inpage { height: 69px;   }
header.header_inpage h1 { top: 20px;  }

section { padding: 40px 10px 70px 10px; }
@media only screen and (max-width: 960px) { section { padding: 20px 10px 30px 10px; } }

footer { background: #c6d2dc; min-height: 200px; padding: 40px 10px 70px 10px; position: relative; }
footer h2 { border-bottom: solid 1px #267aba; margin: 0px 0px 10px 0px; padding: 0px 0px 10px 0px;  }

footer iframe { position: absolute; top: 0px; right: 0px; width: 50%; height: 100%; }

@media only screen and (max-width: 960px) { 
	footer { padding: 20px 10px 30px 10px; } 
	footer iframe { display: none; }
}

/* CUSTOM DEFINITION */
/* claim */
div#claim { color: #fff; text-align: center; max-width: 480px; padding: 0px 10px 0px 10px; margin: 0 auto; }
div#claim_top { font-size: 2.6em; padding: 0px 20px 10px 20px; border-bottom: solid 1px #fff; font-weight: 700; }
div#claim_bottom { font-size: 1.6em; padding: 10px 20px 0px 20px;  }

@media only screen and (min-width: 1200px) { 
	div#claim { text-align: center; max-width: 480px; }
	div#claim_top { font-size: 3em; padding: 0px 20px 20px 20px;  }
	div#claim_bottom { font-size: 1.8em; padding: 20px 20px 0px 20px;  }
}

header.header_inpage div#claim { font-size: 6px;}

/* plg */
div#playground { background: url('../img/bg-playground.jpg') center top no-repeat; position: relative;  }

/* nase prednosti */
section#nase-prednosti {  }

div.nase_prednosti { text-align: center; }
div.nase_prednosti h2 { padding: 0px 0px 0px 0px; }
div.nase_prednosti a { display: inline-block; width: 20%; box-sizing: border-box; padding: 10px; text-decoration: none; cursor: pointer; font-size: 1.6em;  }
div.nase_prednosti span { display: block; }

span.prednost_main_body { background: #f6f6f6; padding: 10px 10px 20px 10px; border-radius: 10px; color: #666; font-weight: 700; }
div.nase_prednosti a:hover span.prednost_main_body { background: #c6d2dc; color: #0f446c; }

span.prednost_img img { max-width: 100%; -webkit-filter: grayscale(100%); filter: grayscale(100%); opacity: 0.5; transition: -webkit-filter 0.3s, filter 0.3s, opacity 0.3s; }
div.nase_prednosti a:hover span.prednost_img img { -webkit-filter: grayscale(0%); filter: grayscale(0%); opacity: 1;  }

@media only screen and (max-width: 768px) {  div.nase_prednosti a { width: 50%;  } }

/* zakladni informace */
section#zakladni-informace { background: #f6f6f6; }
div.zinfo_item { width: 25%; float: left; text-align: center; padding: 10px; background: url('../img/bg-zinfo.png') bottom right no-repeat; box-sizing: border-box; }
div.zinfo_item_fourth { background: none; }
div.zinfo_item p { padding: 10px 0px 20px 0px; min-height: 50px;}
a.zinfo_vice { display: inline-block; font-size: 1.6em; background: #267aba; color: #fff; padding: 10px; border-radius: 5px; max-width: 100px; width: 100%;  }
a.zinfo_vice:hover { color: #0f446c; background: #c6d2dc; }
	
@media only screen and (max-width: 960px) { 
	div.zinfo_item { width: 50%; background: none; padding: 30px 10px 30px 10px;   }
	div.zinfo_cover { background: url('../img/bg-zinfo-mobile.png') center center no-repeat; }
}

@media only screen and (max-width: 768px) { 
	div.zinfo_item h3 { font-size: 14px; }
}

/* content */
@media only screen and (min-width: 960px) { div.greenline { position: absolute; top: 40px; right: 20px; } }
@media only screen and (max-width: 960px) { div.greenline { display: none; } } 

span.greenline_label { font-size: 20px; font-weight: 700; color: Green; display: block; height: 27px; padding: 10px 20px 0px 47px; background: url('../img/bg-green.png') left center no-repeat; }
div.content_main { padding: 0px 10px 0px 10px; color: #000; }

h2.claim_text { text-align: center; margin-bottom: 10px; font-weight: 700; }
p.claim_text { text-align: center; margin-bottom: 10px; }

ul.special { list-style: none; font-size: 1.6em; }
ul.special li { display: block; position: relative; padding: 15px 0px 15px 48px; border-top: solid 1px #ccc; position: relative; }
ul.special li span { 
	display: block; border: solid 1px #666; position: absolute; top: 50%; left: 0px; color: #0f446c; font-size: 16px !important;
	margin-top: -14px; line-height: 1em;
	background: #fff; width: 28px; height: 22px;  text-align: center; padding: 6px 0px 0px 0px; border-radius: 15px; 
}
	
/* main menu */
ul.main_menu {  position: absolute; top: 4px; right: 20px; list-style: none; }

ul.main_menu li, ul.main_menu li a { float: left; color: #fff; }
ul.main_menu li  { padding: 10px; }
ul.main_menu li a { padding: 10px; border: solid 1px #2b80c0; border-radius: 5px; text-decoration: none; }
ul.main_menu li a:hover { border: solid 1px #fff;  }
@media only screen and (max-width: 768px) {  ul.main_menu { display: none; } }
	
/*contact*/
div.contact { width: 50%; }
div.contact_left { float: right; width: 100%; padding: 0px 10px 0px 10px; box-sizing: border-box; }
div.contact_left p { margin-bottom: 10px; color: #0f446c; }

@media only screen and (max-width: 960px) { div.contact { width: 100%; }  }
@media only screen and (min-width: 960px) { div.contact_left { max-width: 500px; }   }

p.text_button { text-align: center; }
p.text_button a { display: inline-block; background: #267aba; color: #fff; padding: 10px 30px 10px 30px; border-radius: 5px;  text-decoration: none;  }
p.text_button a:hover { color: #0f446c; background: #c6d2dc; }

/* DEFAULT PRESETS */
/* Error 404 */
h2#e_404 { }

/*responsive help*/
@media only screen and (max-width: 768px) { .no_mobile { display: none; }  }
@media only screen and (min-width: 768px) { .is_mobile { display: none; }  }

.float_left { float: left; }
.float_right { float: right; }
.align_center { text-align: center; }
.hide { display: none; }

/*clearing element*/
div.clear, div.util, div.cleaner{ display: block; clear: both; font-size: 0px; line-height: 0px;  }

/*webryba element*/
#wr { padding: 20px; text-align: center; }
#wr img { -webkit-filter: grayscale(100%); filter: grayscale(100%); opacity: 0.2; transition: -webkit-filter 0.3s, filter 0.3s, opacity 0.3s; }
#wr a:hover img { -webkit-filter: grayscale(0%); filter: grayscale(0%); opacity: 1;  }
@media only screen and (max-width: 768px) { #wr img { height: 20px; } }