@import url(https://fonts.googleapis.com/css?family=Oswald:300,400,700&subset=latin-ext);


/*
Theme Name: IT v kostce
Theme URI: https://webdesignitvkostce.cz
Author: Martin Gross
Author URI: https://webdesign.itvkostce.cz
Description: Šablona vytvořená na míru pro potřeby klienta
Version: 1.0
License: Copyright - Martin Gross
Tags: custom-made
Text Domain: itvkostce
*/

* {
box-sizing: border-box;
margin: 0;
padding: 0;
border: 0;
-webkit-text-size-adjust: none;
-moz-text-size-adjust: none;
-ms-text-size-adjust: none;
-o-text-size-adjust: none;
text-size-adjust: none;
}

body {
text-align: center;
font-size: 16px; line-height: 24px; font-family: 'Oswald', sans-serif; color: #fff;
background-color: #080808;
}

/*-----ZAKLAD-----*/

h1, h2, h3, h4, h5, hr, p {
margin: 0 0 20px;
}

h1 {
margin: 0 0 20px;
color: #fff;
}

@media only screen and (min-width:670px) {

	h1 {
	margin: 0 0 40px;
	}

}

p:last-child, .main ul:last-child {
margin-bottom: 0;	
}

a {
color: #fff;
}

a, .navmenu a:hover, .newsbox a, .newsbox a:hover, .footer a:hover, .button:hover {
text-decoration: none;
}

a:hover {
text-decoration: underline;
}

ul li, ol li {
list-style-position: outside; margin-left: 20px;
}

hr {
border-bottom: 1px solid #000;
}

.cleaner {
clear: both; height: 0;
}

.left {
float: left;
}

.right {
float: right;
}

.wrapper {
width: 100%; text-align: center;
}

.wrap {
width: 100%; max-width: 1020px; margin: auto; padding: 0 15px;
}

@media only screen and (min-width:670px) {

	.wrap {
	padding: 0 30px;
	}

}

img {
display: block; max-width: 100%; height: auto;
}

.video {
position: relative; width: 100%; height: 0; margin-bottom: 20px; padding-bottom: 56.25%; padding-top: 30px; overflow: hidden;
}

.video iframe, .video object, .video embed {
position: absolute; top: 0; left: 0; right: 0; width: 100%; height: 100%;
}

/*-----FONTY-----*/

h1 {
font-size: 35px; line-height: 48px;
}

h2 {
font-size: 24px; line-height: 30px;
}

h3 {
font-size: 22px; line-height: 28px;
}

h4 {
font-size: 20px; line-height: 26px;
}

h5 {
font-size: 18px; line-height: 24px;
}

.button {
font-size: 18px; line-height: 18px;
}

.navmenu a {
font-size: 16px; line-height: 16px;
}

.newstext, .footer, .footer .navmenu a {
font-size: 14px; line-height: 19px;
}

.regular, body, h2, h3, h4, h5, hr, a {
font-weight: 400;
}

.light, .footer a, .footer p {
font-weight: 300;	
}

.bold, h1 {
font-weight: 700;
}

.uppercase, h1, .button {
text-transform: uppercase;
}

/*-----STRUKTURA-----*/

/*-----header-----*/

.header {
position: absolute; top: 0; left: 0;
z-index: 9996;
}

@media only screen and (max-width:670px) {
	.header {
	padding: 15px 15px 10px;
	background-color: #000;
	}
}

@media only screen and (min-width:670px) {
	.header {
	padding: 15px 30px 10px;
	background-color: rgba(0,0,0,0.8);
	}
}

.logged .header {
top: 32px;
}

.logo {
float: left; height: auto;
}


@media only screen and (max-width:350px) {
	
	.logo {
	width: 120px; 
	}
	
}

@media only screen and (min-width:350px) and (max-width:900px) {	
	.logo {
	width: 150px;
	}
}

@media only screen and (min-width:900px) {
		
	.logo {
	width: 242px; margin-top: 8px;
	}

}

.socnet, .navmenu {
float: right;
}

.socnet {
text-align: right;	
}

.socnet img {
display: inline-block; margin-left: 15px; height: 20px; width: auto;
}

.socnet a {
opacity: 1;
}

.socnet a:hover {
opacity: 0.5;
}

@media only screen and (max-width:670px) {
	
	.footer .navmenu {
	display: none;	
	}
	
	.navmenu	{
	position: fixed; width: 100%; bottom: 47px; left: 0; max-height: 3px; overflow: hidden; padding-bottom: 3px; text-align: right;
	background-color: #000;
	}
	
	.navmenu.clicked {
	max-height: 1000px;
	}
	
	.mobfire {
	position: fixed; bottom: 0; right: 0; width: 100%; padding: 18px 15px 16px; text-align: right;
	cursor: pointer;
	background-color: #000;
	color: #fff;
	}
	
	.hamburger {
	float: right; width: 19px; height: 19px; margin-left: 10px; margin-top: 1px;
	}
	
	.hamburger div {
	width: 100%; height: 3px;
	background-color: #fff;
	margin-top: 5px;
	}
	
	.hamburger div:first-child {
	margin-top: 0;
	}
	
	.navmenu ul {
	padding-top: 12px; padding-bottom: 2px;
	}
	
	.navmenu li {
	display: block; margin: 0; padding: 0 15px; list-style: none;	
	}
	
	.navmenu li a {
	display: block; margin-top: 3px; padding: 8px 0 5px;
	border-top: 1px #6b6b6b solid;
	}
	
	.navmenu li:first-of-type a {
	margin: 0 padding: 5px 0;;
	border: 0;
	}
}


@media only screen and (min-width:670px) {
	
	.mobfire {
	display: none;	
	}

	.navmenu {
	clear: right; margin-top: 15px;
	}

	.navmenu li {
	list-style-type: none; display: inline-block; text-align: right; margin-left: 0;
	}

	.navmenu li a {
	display: block; padding: 0 12px;
	border-left: 1px #6b6b6b solid;
	color: #fff;
	}

	.navmenu li a:hover {
	color: #4cb7ca;
	}

	.navmenu li:first-of-type a {
	border: 0;
	}

	.navmenu li:last-of-type a {
	padding-right: 0;
	}
		
}

/*-----content-----*/

.bigpic {
position: relative; width: 100%; min-height: 50px; background-color: #000;
z-index: 9995;
}

@media only screen and (min-width:670px) {
	
	.bigpic {
	min-height: 89px;
	}

}

.bigpic img {
width: 100%;	
}

.vlna {
position: absolute; bottom: 0; left: 0; width: 100%; height: 63px;
background: url('images/vlna.png') repeat-x center center;
background-size: auto 100%;
}

.main {
background-color: #4cb7ca;
}

.content {
padding-top: 30px; padding-bottom: 30px; text-align: left;
color: #000;
}

@media only screen and (min-width:670px) {

	.content {
	padding-top: 60px; padding-bottom: 60px;
	}
	
}

.s-vlnou .content {
padding-top: 50px;
}

.home .content {
text-align: center;
}

.home .content, .news .content {
color: #fff;
}

/*-----news-----*/

@media only screen and (min-width:670px) {

	.newswrap {
	padding-top: 20px;
	}

}

.newsbox {
position: relative; padding-top: 20px;
}

@media only screen and (min-width:670px) {

	.newsbox {
	padding-top: 40px;
	}
	
}

.newsthumb {
float: left; width: 35%; padding-right: 30px;
}

.newsbox:nth-of-type(even) .newsthumb {
float: right; padding-left: 30px;
}

.newsthumb a {
position: relative; display: block; opacity: 1;
}

.newsthumb a:hover {
opacity: 0.5;	
}

.newsthumb-bg {
position: absolute; top: 0; left: 0; width: 100%; height: 100%; right: 100%;
background-color: #000;
-webkit-transform: rotate(7deg);
-moz-transform: rotate(7deg);
-ms-transform: rotate(7deg);
-o-transform: rotate(7deg);
transform: rotate(176deg);
z-index: 9994;
}

.newsthumb img {
position: relative;
z-index: 9995;
}

.newstext {
float: right; width: 65%; height: 100%; padding-bottom: 50px; text-align: left;
color: #000;
}

.newsbox:nth-of-type(even) .newstext {
float: left; text-align: right;	
}

.newstext h2 {
margin-bottom: 20px; padding-bottom: 5px;
border-bottom: 1px #000 solid;
color: #000;
}

.newstext h2:hover {
color: #fff;
}

.newstext .button {
position: absolute; bottom: 0; left: 35%;
}

.newsbox:nth-of-type(even) .button {
left: auto; right: 35%;
}

.newspic img {
margin-bottom: 30px;
}

@media only screen and (max-width:670px) {

	.button.allnews {
	margin-top: 20px;
	}

}

@media only screen and (min-width:670px) {

	.button.allnews {
	margin-top: 40px;
	}
		
	.home .allnews {
	width: 33%; margin-left: 30px;
	}

}

/*-----footer-----*/

@media only screen and (max-width:670px) {

	.footer {
	padding-top: 30px; padding-bottom: 80px;
	background: #000;
	}	

}

@media only screen and (min-width:670px) {

	.footer {
	text-align: center; padding-top: 60px; padding-bottom: 60px;
	}	

}

.footer p, .footer a, .footer .navmenu a {
margin: 0;
color: #b2b2b2;
}

.footer a:hover, .footer .navmenu a:hover {
color: #fff;
}

.footer .navmenu {
float: left; margin: 0;
}

.footer .navmenu a {
border-color: #4c4c4c;
}

.footer .navmenu li:first-of-type a {
padding-left: 0;	
}

.footer .socnet a {
opacity: 0.7;
}

.footer .socnet a:hover {
opacity: 1;
}

.bottomfoot {
margin-top: 30px; padding-top: 30px;
border-top: 1px #4c4c4c solid;
}

@media only screen and (max-width:670px) {
	
	.bottomfoot {
	margin-top: 20px; padding-top: 20px;
	}
	
	.topfoot {
	display: inline-block;	
	}
	
	.foot.left {
	float: none;	
	}

}

/*-----OSTATNI-----*/

.button {
display: inline-block; padding: 10px 20px;
border: 2px #fff solid;
color: #fff;
}

.button:hover {
border: 2px #000 solid;
color: #000;
}

.button.black {
color: #fff;
border: 2px #000 solid;
background-color: #000;
}

.button.black:hover {
background-color: transparent;
color: #000;
}



/*-----efekty gradient radius -----*/

a, .navmenu, .newsbox h2 {
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-ms-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all 0.4s ease;
}

.radius_0, input, select, textarea {
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
-ms-border-radius: 0px;
-o-border-radius: 0px;
border-radius: 0px;
}

/*-----float cleaner-----*/

.float_in:before, .float_in:after {
content:"";
display:table;
}

.float_in {
zoom:1; /* For IE 6/7 (trigger hasLayout) */
}

.float_in:after {
clear:both;
}