/*
Theme Name: Irkutil.cz by Li-on.cz
CSS file for signpost on the beginning
*/

body{
	margin: 0;
	padding: 0.5% 0.5% 0 0.5%;
	font-family: Verdana, Geneva, sans-serif;
	line-height: 1.2;
	background: url(/wp-content/themes/irkutil_cz/img/bg-11-edit.jpg);
	background-repeat: repeat-y;
	background-size: 100% 100%;	

}

img{
	margin: 0;
	padding: 0;
}

/********/
/*HEADER*/
/********/

header{
	/*background: url("/wp-content/themes/irkutil_cz/img/header.png") no-repeat;*/
	text-align: center;
	width: 80%;
	margin: 0 auto;
}


/************/
/*NAVIGATION*/
/************/

nav{
	/*background: url("/wp-content/themes/irkutil_cz/img/signpost.png") no-repeat;*/
	position: relative;
	margin: -8% auto 0 auto ;
	width: 80%;  
	/*text-align: center;*/
}

nav .signpost{
	margin: 0 auto;
	width: 62%;
	z-index: 0;
	text-align: center;
	position: relative;
}

/*left-arrow-1 + before icon*/
nav .arrow-left-1{
	background: url("/wp-content/themes/irkutil_cz/img/arrow-left-drevovyroba.png") no-repeat;
	background-size: 100%;
	position: absolute;
	z-index: 1;
	padding: 0;
	margin: 0;	
	top: 21.5%;
	left: 17%;
	width: 30%;
	height: 11%;
    -ms-transform: rotate(10deg); /* IE 9 */
    -webkit-transform: rotate(10deg); /* Chrome, Safari, Opera */
    transform: rotate(10deg);	
	-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;    
}

nav .arrow-left-1::before{
	content: "";
	background: url("/wp-content/themes/irkutil_cz/img/icon-drevovyroba.png") no-repeat;
	background-size: 100%;
	position: absolute;
	z-index: 1;
	padding: 0;
	margin: 0;
	top: -40%;
	right: 110%;
	width: 80%;
	height: 125%;	
    -ms-transform: rotate(-10deg); /* IE 9 */
    -webkit-transform: rotate(-10deg); /* Chrome, Safari, Opera */
    transform: rotate(-10deg);		
}

nav .arrow-left-1:hover{
	background: url("/wp-content/themes/irkutil_cz/img/arrow-left-drevovyroba-hover.png") no-repeat;
	background-size: 100%;
}

nav .arrow-left-1:hover:before{
	background: url("/wp-content/themes/irkutil_cz/img/icon-drevovyroba-hover.png") no-repeat;
	background-size: 100%;
}
/*END of left-arrow-1 + before icon*/

/*left-arrow-2 + before icon*/
nav .arrow-left-2{
	background: url("/wp-content/themes/irkutil_cz/img/arrow-left-pro_zvirata.png") no-repeat;
	background-size: 100%;
	position: absolute;
	z-index: 1;
	padding: 0;
	margin: 0;	
	top: 35%;
	left: 17%;
	width: 30%;
	height: 11%;
    -ms-transform: rotate(4deg); /* IE 9 */
    -webkit-transform: rotate(4deg); /* Chrome, Safari, Opera */
    transform: rotate(4deg);	
	-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;    
}

nav .arrow-left-2::before{
	content: "";
	background: url("/wp-content/themes/irkutil_cz/img/icon-pro_zvirata.png") no-repeat;
	background-size: 100%;
	position: absolute;
	z-index: 1;
	padding: 0;
	margin: 0;
	top: -30%;
	right: 110%;
	width: 80%;
	height: 160%;	
    -ms-transform: rotate(-4deg); /* IE 9 */
    -webkit-transform: rotate(-4deg); /* Chrome, Safari, Opera */
    transform: rotate(-4deg);			
}

nav .arrow-left-2:hover{
	background: url("/wp-content/themes/irkutil_cz/img/arrow-left-pro_zvirata-hover.png") no-repeat;
	background-size: 100%;
}

nav .arrow-left-2:hover:before{
	background: url("/wp-content/themes/irkutil_cz/img/icon-pro_zvirata-hover.png") no-repeat;
	background-size: 100%;
}
/*END of left-arrow-2 + before icon*/

/*left-arrow-3 + before icon*/
nav .arrow-left-3{
	background: url("/wp-content/themes/irkutil_cz/img/arrow-left-stavebni_prace.png") no-repeat;
	background-size: 100%;
	position: absolute;
	z-index: 1;
	padding: 0;
	margin: 0;	
	top: 49%;
	left: 16%;
	width: 30%;
	height: 11%;
    -ms-transform: rotate(-4deg); /* IE 9 */
    -webkit-transform: rotate(-4deg); /* Chrome, Safari, Opera */
    transform: rotate(-4deg);	
	-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;    
}

nav .arrow-left-3::before{
	content: "";
	background: url("/wp-content/themes/irkutil_cz/img/icon-stavebni_prace.png") no-repeat;
	background-size: 100%;
	position: absolute;
	z-index: 1;
	padding: 0;
	margin: 0;
	top: 0%;
	right: 110%;
	width: 85%;
	height: 120%;	
    -ms-transform: rotate(4deg); /* IE 9 */
    -webkit-transform: rotate(4deg); /* Chrome, Safari, Opera */
    transform: rotate(4deg);			
}

nav .arrow-left-3:hover{
	background: url("/wp-content/themes/irkutil_cz/img/arrow-left-stavebni_prace-hover.png") no-repeat;
	background-size: 100%;
}

nav .arrow-left-3:hover:before{
	background: url("/wp-content/themes/irkutil_cz/img/icon-stavebni_prace-hover.png") no-repeat;
	background-size: 100%;
}
/*END of left-arrow-3 + before icon*/

/*left-arrow-4 + before icon*/
nav .arrow-left-4{
	background: url("/wp-content/themes/irkutil_cz/img/arrow-left-udelam_pomuzu.png") no-repeat;
	background-size: 100%;
	position: absolute;
	z-index: 1;
	padding: 0;
	margin: 0;	
	top: 63%;
	left: 17%;
	width: 30%;
	height: 11%;
    -ms-transform: rotate(-10deg); /* IE 9 */
    -webkit-transform: rotate(-10deg); /* Chrome, Safari, Opera */
    transform: rotate(-10deg);	
	-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;    
}

nav .arrow-left-4::before{
	content: "";
	background: url("/wp-content/themes/irkutil_cz/img/icon-udelam_pomuzu.png") no-repeat;
	background-size: 100%;
	position: absolute;
	z-index: 1;
	padding: 0;
	margin: 0;
	top: -5%;
	right: 110%;
	width: 85%;
	height: 135%;	
    -ms-transform: rotate(10deg); /* IE 9 */
    -webkit-transform: rotate(10deg); /* Chrome, Safari, Opera */
    transform: rotate(10deg);		
}

nav .arrow-left-4:hover{
	background: url("/wp-content/themes/irkutil_cz/img/arrow-left-udelam_pomuzu-hover.png") no-repeat;
	background-size: 100%;
}

nav .arrow-left-4:hover:before{
	background: url("/wp-content/themes/irkutil_cz/img/icon-udelam_pomuzu-hover.png") no-repeat;
	background-size: 100%;
}
/*END of left-arrow-4 + before icon*/

/*right-arrow-1 + before icon*/
nav .arrow-right-1{
	background: url("/wp-content/themes/irkutil_cz/img/arrow-right-kontakt.png") no-repeat;
	background-size: 100%;
	position: absolute;
	z-index: 1;
	padding: 0;
	margin: 0;	
	top: 21.5%;
	right: 18%;
	width: 30%;
	height: 11%;
    -ms-transform: rotate(-10deg); /* IE 9 */
    -webkit-transform: rotate(-10deg); /* Chrome, Safari, Opera */
    transform: rotate(-10deg);	
	-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;    
}

nav .arrow-right-1::before{
	content: "";
	background: url("/wp-content/themes/irkutil_cz/img/icon-kontakt.png") no-repeat;
	background-size: 100%;
	position: absolute;
	z-index: 1;
	padding: 0;
	margin: 0;
	top: -43%;
	left: 110%;
	width: 50%;
	height: 142%;	
    -ms-transform: rotate(10deg); /* IE 9 */
    -webkit-transform: rotate(10deg); /* Chrome, Safari, Opera */
    transform: rotate(10deg);				
}

nav .arrow-right-1:hover{
	background: url("/wp-content/themes/irkutil_cz/img/arrow-right-kontakt-hover.png") no-repeat;
	background-size: 100%;
}

nav .arrow-right-1:hover:before{
	background: url("/wp-content/themes/irkutil_cz/img/icon-kontakt-hover.png") no-repeat;
	background-size: 100%;
}
/*END of right-arrow-1 + before icon*/

/*right-arrow-2 + before icon*/
nav .arrow-right-2{
	background: url("/wp-content/themes/irkutil_cz/img/arrow-right-fotogalerie.png") no-repeat;
	background-size: 100%;
	position: absolute;
	z-index: 1;
	padding: 0;
	margin: 0;	
	top: 35%;
	right: 18%;
	width: 30%;
	height: 11%;
    -ms-transform: rotate(-4deg); /* IE 9 */
    -webkit-transform: rotate(-4deg); /* Chrome, Safari, Opera */
    transform: rotate(-4deg);	
	-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;    
}

nav .arrow-right-2::before{
	content: "";
	background: url("/wp-content/themes/irkutil_cz/img/icon-fotogalerie.png") no-repeat;
	background-size: 100%;
	position: absolute;
	z-index: 1;
	padding: 0;
	margin: 0;
	top: -10%;
	left: 110%;
	width: 65%;
	height: 135%;	
    -ms-transform: rotate(4deg); /* IE 9 */
    -webkit-transform: rotate(4deg); /* Chrome, Safari, Opera */
    transform: rotate(4deg);				
}

nav .arrow-right-2:hover{
	background: url("/wp-content/themes/irkutil_cz/img/arrow-right-fotogalerie-hover.png") no-repeat;
	background-size: 100%;
}

nav .arrow-right-2:hover:before{
	background: url("/wp-content/themes/irkutil_cz/img/icon-fotogalerie-hover.png") no-repeat;
	background-size: 100%;
}
/*END of right-arrow-2 + before icon*/

/*right-arrow-3 + before icon*/
nav .arrow-right-3{
	background: url("/wp-content/themes/irkutil_cz/img/arrow-right-reference.png") no-repeat;
	background-size: 100%;
	position: absolute;
	z-index: 1;
	padding: 0;
	margin: 0;	
	top: 49%;
	right: 18%;
	width: 30%;
	height: 11%;
    -ms-transform: rotate(4deg); /* IE 9 */
    -webkit-transform: rotate(4deg); /* Chrome, Safari, Opera */
    transform: rotate(4deg);	
	-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;    
}

nav .arrow-right-3::before{
	content: "";
	background: url("/wp-content/themes/irkutil_cz/img/icon-reference.png") no-repeat;
	background-size: 100%;
	position: absolute;
	z-index: 1;
	padding: 0;
	margin: 0;
	top: -35%;
	left: 110%;
	width: 60%;
	height: 155%;		
    -ms-transform: rotate(-4deg); /* IE 9 */
    -webkit-transform: rotate(-4deg); /* Chrome, Safari, Opera */
    transform: rotate(-4deg);			
}

nav .arrow-right-3:hover{
	background: url("/wp-content/themes/irkutil_cz/img/arrow-right-reference-hover.png") no-repeat;
	background-size: 100%;
}

nav .arrow-right-3:hover:before{
	background: url("/wp-content/themes/irkutil_cz/img/icon-reference-hover.png") no-repeat;
	background-size: 100%;
}
/*END of right-arrow-3 + before icon*/

/*right-arrow-4 + before icon*/
nav .arrow-right-4{
	background: url("/wp-content/themes/irkutil_cz/img/arrow-right-info.png") no-repeat;
	background-size: 100%;
	position: absolute;
	z-index: 1;
	padding: 0;
	margin: 0;	
	top: 63%;
	right: 19%;
	width: 30%;
	height: 11%;
    -ms-transform: rotate(10deg); /* IE 9 */
    -webkit-transform: rotate(10deg); /* Chrome, Safari, Opera */
    transform: rotate(10deg);	
	-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;    
}

nav .arrow-right-4::before{
	content: "";
	background: url("/wp-content/themes/irkutil_cz/img/icon-info.png") no-repeat;
	background-size: 100%;
	position: absolute;
	z-index: 1;
	padding: 0;
	margin: 0;
	top: -10%;
	left: 110%;
	width: 47%;
	height: 135%;
    -ms-transform: rotate(-10deg); /* IE 9 */
    -webkit-transform: rotate(-10deg); /* Chrome, Safari, Opera */
    transform: rotate(-10deg);					
}

nav .arrow-right-4:hover{
	background: url("/wp-content/themes/irkutil_cz/img/arrow-right-info-hover.png") no-repeat;
	background-size: 100%;
}

nav .arrow-right-4:hover:before{
	background: url("/wp-content/themes/irkutil_cz/img/icon-info-hover.png") no-repeat;
	background-size: 100%;
}
/*END of right-arrow-4 + before icon*/

/********/
/*FOOTER*/
/********/

footer{
	width: 80%;
	margin: -1% auto 0 auto;
	padding: 2.5% 0% 0 0%;
	background: rgb(87,46,5);
	border-top: 1em solid rgb(191,104,76);
	color: rgb(243,214,142);
	position: relative;
	z-index: 4;
	text-align: center;
}

.footer_grass{
	text-align: center;
	width: 82.5%;
	margin: -10% auto 0 auto;
}

footer header{
	width: 100%;
	text-align: center;
	text-transform: uppercase;
	font-weight: bold;
	padding: 2% 0;
	background: rgba(191, 104, 76, 0.3);
	color: rgb(243,214,142);
}

footer section{
	padding: 2%;
}

footer section a{
	display: block;
	text-align: left;
	color: rgb(191,104,76);
}

footer .copyright{
	margin-top: 2.5%;
	border-top: 1px solid rgb(191,104,76); 
	padding: 2%;
	font-size: 80%;
}

footer .copyright a{
	color: rgb(191,104,76);
}

footer a:hover{
	color: rgb(243,214,142);
}

/********/
/*MEDIA */
/********/

@media screen and (max-width: 38.75em) {

	header, nav{
		width: 100%;
	}
	
	.footer_grass{
		width: 100%;
		margin: -13% auto 0 auto;
	}

	footer{
		width: 95%;
	}

	nav .signpost{
		width: 80%;
	}

}