.cf:before, .cf:after {content: " "; display: table;}
.cf:after {clear: both;}
.cf {*zoom: 1;}

*, *:before, *:after {-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
*{margin: 0;padding: 0;}

body{
	font-family: 'Open Sans', "Helvetica Neue", Arial, Helvetica, sans-serif; 
	background: url('../img/bg.png') repeat;}

.floor .text {position: absolute;top: 50%;left: 50%;-moz-transform: translateX(-50%) translateY(-50%);-webkit-transform: translateX(-50%) translateY(-50%);transform: translateX(-50%) translateY(-50%);}
			
		
/* NAVIGATION */
		.links-to-floor{
			position: absolute;
			top: 0;
			right: 17px; 
			list-style: none; 
			width:500px; 
			height: 65px; 
			padding-top:17px; 
			padding-left: 20px; 
			background-color:#111;
			background-color: rgba(17,17,17,0.9);
}
		
		
/*

.f1{}
		.f2{left: 98px;}
		.f3{left: 176px;}
		.f4{left: 254px;}
		.f5{left: 332px;}
		.f6{left: 410px;}

		 li a{text-align: center; position:absolute; display: block; width: 75px; height: 29px;  -webkit-transition: all 0.7s ease; -moz-transition: all 0.7s ease; transition: all 0.7s ease;			
			-webkit-border-radius: 0px;-moz-border-radius: 0px;border-radius: 0px;
			color: #EBEBBC;
			font-size: 12px;
			font-weight: 700;
			padding-top: 7px;
			text-transform: uppercase;}
		
		.links-to-floor li a:hover {cursor:pointer; color: #111; background:#82B3AE;}
		.selected a{color: #111; background:#BCE3C5;}
		.selected a:hover{color: #111; background:#82B3AE;} */

/* 3
li a{
	position: relative;
	float: left;
	display: inline-block;
	margin: 0px 10px;
	outline: none;
	color: #EBEBBC;
	text-decoration: none;
	text-transform: uppercase;
	text-shadow: 0 0 1px rgba(255,255,255,0.3);
	font-size: 14px;
	font-weight: 400;
	padding: 5px 0;
	cursor: pointer;
	
}
 li a:after{
	position: absolute;
	top: 100%;
	left: 0;
	width: 100%;
	height: 3px;
	background: #EBEBBC;
	content: '';
	opacity: 0;
	-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
	-moz-transition: opacity 0.3s, -moz-transform 0.3s;
	transition: opacity 0.3s, transform 0.3s;
	-webkit-transform: translateY(10px);
	-moz-transform: translateY(10px);
	transform: translateY(10px);
 }

li a:hover::after, li a:focus::after {
	opacity: 1;
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	transform: translateY(0px);
}

.selected a:after {
	opacity: 1;
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	transform: translateY(0px);
}

*/





/*  21

li a{
	position: relative;
	float: left;
	display: inline-block;
	margin: 0px 10px;
	outline: none;
	color: #EBEBBC;
	text-decoration: none;
	text-transform: uppercase;
	text-shadow: 0 0 1px rgba(255,255,255,0.3);
	font-size: 14px;
	font-weight: 400;
	
	cursor: pointer;
	padding: 10px;
	color: #237546;
	font-weight: 700;
	text-shadow: none;
	-webkit-transition: color 0.3s;
	-moz-transition: color 0.3s;
	transition: color 0.3s;
	
}
 li a::after, li a::before{
	position: absolute;
	left: 0;
	width: 100%;
	height: 2px;
	background: #fff;
	content: '';
	opacity: 0;
	-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
	-moz-transition: opacity 0.3s, -moz-transform 0.3s;
	transition: opacity 0.3s, transform 0.3s;
	-webkit-transform: translateY(-10px);
	-moz-transform: translateY(-10px);
	transform: translateY(-10px);
 }

li a::before {
	top: 0;
	-webkit-transform: translateY(-10px);
	-moz-transform: translateY(-10px);
	transform: translateY(-10px);
}

li a::after{
	bottom: 0;
	-webkit-transform: translateY(10px);
	-moz-transform: translateY(10px);
	transform: translateY(10px);
}

li a:hover, li a:focus {
	color: #fff;
}
li a:hover::before, li a:focus::before, li a:hover::after, li a:focus::after {
	opacity: 1;
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	transform: translateY(0px);
}

.selected a{color: #fff;}
.selected a:after, .selected a:before {
opacity: 1;
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	transform: translateY(0px);
}

*/


li a{
	position: relative;
	float: left;
	display: inline-block;
	margin: 3px 8px;
	outline: none;
	text-decoration: none;
	text-transform: uppercase;
	cursor: pointer;
	font-size: 14px;
	font-weight: 700;
	color: #82B3AE;
	text-shadow: 0 0 1px rgba(130,179,174,0.3);
}

li a::before {
	color: #acfff6;
	content: attr(data-hover);
	position: absolute;
	opacity: 0;
	text-shadow: 0 0 1px rgba(172,255,246,0.3);
	-webkit-transform: scale(1.1) translateX(10px) translateY(-10px) rotate(4deg);
	-moz-transform: scale(1.1) translateX(10px) translateY(-10px) rotate(4deg);
	transform: scale(1.1) translateX(10px) translateY(-10px) rotate(4deg);
	-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
	-moz-transition: -moz-transform 0.3s, opacity 0.3s;
	transition: transform 0.3s, opacity 0.3s;
	pointer-events: none;
}

li a:hover::before, li a:focus::before {
	-webkit-transform: scale(1) translateX(0px) translateY(0px) rotate(0deg);
	-moz-transform: scale(1) translateX(0px) translateY(0px) rotate(0deg);
	transform: scale(1) translateX(0px) translateY(0px) rotate(0deg);
	opacity: 1;
}

.selected a::before, .selected a::after {
	-webkit-transform: scale(1) translateX(0px) translateY(0px) rotate(0deg);
	-moz-transform: scale(1) translateX(0px) translateY(0px) rotate(0deg);
	transform: scale(1) translateX(0px) translateY(0px) rotate(0deg);
	opacity: 1;
}





h1 {
	font-weight: 300;
	font-size: 48px;
	color: #111;
	background-color: #82B3AE;
	line-height: 1;
	margin: 0 0 0 10%;
	padding: 70px 0 8px 15px;
}

h2 {
	color: #82B3AE;
	font-size: 28px;
	font-weight: 800;
	padding: 30px 0 0 48px;
}

/* HOME */

.floor-1{
	background-image: url('../img/placeholder-uvod.jpg'); 
	background-position: right bottom;
	background-repeat:no-repeat;
	background-size: contain;}

.uvodna-stran {position: relative;}
.sig {position: absolute; width: 298px; height:176px; top: 100px; left: 12%;  background: url(../img/sig-large.png) no-repeat;}
.uvodna-stran h1 {
	/*background: url(../img/sig-small.png) no-repeat 110px 130px; */
	background-color: #111; 
	background-color: rgba(17,17,17,0.8); 
	color: #82B3AE; letter-spacing: 1px; font-size: 45px;
	margin: 0 0 0 5%;
	padding: 70px 25px 30px 25px;
	display: inline-block;
	border-bottom: 2px solid #3b5250;
}

.heavy{font-weight: 800; letter-spacing: 0;}

/* PREDSTAVITEV */
.floor-2{color: #99b5b2; 
	background-image: url('../img/placeholder-portret1.jpg'); 
	background-position: right bottom;
	background-repeat:no-repeat;
	background-size: contain;
	font-size: 15px;}

.floor-2 h1 {
max-width: 450px;}

.floor-2 p {padding: 10px 30px 35px 50px; line-height: 1.6;}

.predstavitev, .presentation {
	max-width: 670px;
	background-color:#111111;
	background-color: rgba(17,17,17,0.9);
	margin: 0 10% 0 10%;	
}

.presentation { margin: 10px 10% 60px 10%;}


/* RAZSTAVE */
.floor-3{color: #99b5b2; 
	background-image: url('../img/placeholder-damask.jpg'); 
	background-position: right bottom;
	background-repeat: no-repeat;
	background-size: contain;
	font-size: 15px;}

.kraj{font-style: italic; font-weight: 300; font-size: 15px;}
.letnica {font-weight: 400; font-size: 14px; color: #8fe7de; padding-right: 7px;}

.floor-3 h1 {
max-width: 370px;
}

.floor-3 h2 {
padding-left: 35px;
}

.floor-3 ul{list-style: none; padding: 10px 0 25px 37px;}
.floor-3 ul li {line-height: 1.8;}

.samostojne, .skupinske  {	
	max-width: 500px;
	background-color:#111;
	background-color: rgba(17,17,17,0.9);
	margin: 0 10% 0 10%;
}

.skupinske {margin: 10px 10% 60px 10%;}

/* RECENZIJE */

.floor-4{color: #666666; 
	background-image: url("../img/placeholder-galerija.jpg"); 
	background-position: right bottom;
	background-repeat: no-repeat;
	background-size: contain;
	font-size: 15px;
}

.floor-4 h1 {
width: 500px;
}


.rec-container{ 
	max-width: 750px;
	margin:0 10% 10px 10%;
	background-color:#111;
	background-color: rgba(17,17,17,0.9);
}

.last-rec-container{ margin-bottom: 80px;}

.naslovi{
	max-width: 750px;
}

h3.trigger, h3.vidlink {
	color: #82B3AE;
	cursor: pointer;
	font-size: 28px;
	font-weight: 800;
	line-height: 1.2;
	padding-bottom: 5px;
	margin: 28px 25px 0 30px;
	display: inline-block;
}

h3.trigger:hover {color:#8fe7de;
}

h3.trigger:active { color:#EBEBBC;
}

.solo p {
padding-bottom: 30px;
}

.ime-avtorja{
	text-transform: uppercase;
	font-size: 12px;
	padding: 0px 0 0 30px;
	line-height: 1.6;
	letter-spacing: 1px;
	color: #888;
}

.prevod h3{
	font-size: 15px;
	font-weight: 700;
	margin: 15px 30px 0 30px;
}

.prevod p {
	font-size: 10px;
	margin-top: -3px;
	padding-top: 0px;
}

.last-prevod{padding-bottom: 30px;}

div.toggle{display: none;}

.recenzija p{
  position: relative;
  padding: 0px 60px 15px 60px;
  margin: 0 0 0 0;
  color: #99b5b2;
  font-size: 15px;
  line-height: 1.7;
}
 .drop{float: left; color: #EBEBBC; font-size: 85px; line-height: 60px; padding-top: 6px; padding-right: 3px; margin-left: -7px;font-weight: 400;}

sup {
   vertical-align: baseline;
   position: relative;
   top: -0.4em;
}

p.footnote1, p.footnote2 {font-size: 12px;}
p.footnote1 {padding-top: 15px;}

p.signature {font-style: italic; padding-top: 10px;}

a.trigger {
	text-decoration: none;
	text-transform: uppercase;
	color: #EBEBBC;
	cursor: pointer;
	margin: 60px 0 60px 60px;
	display: inline-block;
	border-bottom: 1px dotted #EBEBBC;	
	-webkit-transition: all 500ms ease-in-out;
   -moz-transition: all  500ms ease-in-out;
    -ms-transition: all 500ms ease-in-out;
     -o-transition: all 500ms ease-in-out;
        transition: all 500ms ease-in-out;
}

a.trigger:hover {
	color: #BCE3C5;
	border-bottom: 1px dotted #BCE3C5;	
}

.vidlink a, .vidlink a:link, .vidlink a:visited {text-decoration: none; color:#82B3AE }
.vidlink a:hover {color:#8fe7de;}
h3.vidlink1 {margin-top: 0px}

/* GALERIJA */
.floor-5{color: #666666; 
	background-image: url("../img/placeholder-vrt.jpg"); 
	background-position: right bottom;
	background-repeat: no-repeat;
	background-size: contain;
}

.floor-5 h1 {max-width: 400px;}

.gwrap{
	max-width: 675px; 
	margin: 0 10% 70px 10%; 
	background-color:#111;
	background-color: rgba(17,17,17,0.9);
	padding: 25px 25px 20px 25px;
	}

.gwrap div {margin:0 8px 4px 0; display: inline-block; overflow: hidden; line-height: 1;}

.ganchor {position: relative; text-decoration: none; margin: 0; padding: 0; line-height: 1; text-align: left; border:none;}

.ganchor h4{
	position: absolute; bottom:15px;left: 0;
	width: 300px;
	height:40px;
	background-color: #111; 
	background-color: rgba(17,17,17,0.9); 
	color: #82B3AE; 
	font-weight: 800; 
	font-size: 19px;
	padding:12px 21px 0 21px;
	text-align: right;
 }

.ganchor img{
	transform: scaleY(1) rotate(0deg);
	-webkit-transition:  all 1s;
	-moz-transition:  all 1s;
	-ms-transition:  all 1s;
	-o-transition:  all 1s;
	transition: all 1s;
    border:none;
 }

.ganchor:hover img{
	transform: scale(1.5) rotate(8deg);
	-webkit-transition: all 10s linear; 
	-moz-transition: all 10s linear; 
    -ms-transition: all 10s linear; 
    -o-transition: all 10s linear; 
	transition: all 10s linear; 
	opacity: 0.5;
 }

.ganchor:hover h4{
	color:#435d5a;
	-webkit-transition:  all 0.7s;
	-moz-transition:  all 0.7s;
	-ms-transition:  all 0.7s;
	-o-transition:  all 0.7s;
	transition: all 0.7s;
 }

/* KONTAKT */
.floor-6{color: #666666; 
	background-image: url("../img/placeholder3.png"); 
	background-position: right bottom;
	background-repeat: no-repeat;
	background-size: contain;
	font-size: 15px;}


.floor-6 h1 {
width: 400px;
}


.container:after { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }

#form-wrapper {
	max-width: 545px;
	margin: 80px 0 0 10%;
	padding: 0;}

#form {
	margin: 0 auto;
	padding: 20px 0 0 0;
	background: none;
	float: none;
	max-width: 545px;
	text-align: left;}

#form div {
	float: left;
	width: 250px;
	position: relative;
	margin: 0;
	padding: 0;}

#form div label {
	width: 225px;
	display: block;
	font-size: 10px;
	line-height: 11px;
	margin: 0 0 4px 0;}

#form input {
	font-family: 'Open Sans', Helvetica, Arial, sans-serif;
	font-size: 14px;
	font-weight: 300;
	color: #999;
	width: 225px;
	margin: 0 0 10px 0;
	padding: 8px 8px 8px 8px;
	background-color: #111;	
	border: 1px solid #293937;
	transition: all 0.8s ease;
	-webkit-transition: all 0.8s ease;
	-moz-transition: all 0.8s ease;
	-ms-transition: all 0.8s ease;
	-o-transition: all 0.8s ease;}

	#form button {
	font-family: 'Open Sans', Helvetica, Arial, sans-serif;
	font-size: 14px;
	font-weight: 300;
	color: #999;
	width: 225px;
	margin: 0 0 10px 0;
	padding: 8px 8px 8px 8px;
	background-color: #111;	
	border: 1px solid #293937;
	transition: all 0.8s ease;
	-webkit-transition: all 0.8s ease;
	-moz-transition: all 0.8s ease;
	-ms-transition: all 0.8s ease;
	-o-transition: all 0.8s ease;}

#form textarea {
	font-family: 'Open Sans', Helvetica, Arial, sans-serif;
	font-size: 14px;
	font-weight: 300;
	color: #999;
	width: 280px;
	height: 138px;
	margin: 0 0 10px 0;
	padding: 10px 10px 10px 10px;
	background-color: #111;
	border: 1px solid #293937;
	overflow: auto;
	resize: none;
	transition: all 0.8s ease;
	-webkit-transition: all 0.8s ease;
	-moz-transition: all 0.8s ease;
	-ms-transition: all 0.8s ease;
	-o-transition: all 0.8s ease;}

#form input:focus, #form textarea:focus {
	color: #fff;
	background-color: #82B3AE;
	outline:none; 
}

#form .submit {	
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	position: relative;
	width: 90px;
	height: 33px;
	line-height: 26px;
	float: right;
	margin-top: 5px;
	margin-right: -30px;
	padding: 0 10px;
	color: #82B3AE;
	background-color: #111;
	border: 1px solid #293937;
	cursor: pointer;
	transition: all 0.8s ease;
	-webkit-transition: all 0.8s ease;
	-moz-transition: all 0.8s ease;
	-ms-transition: all 0.8s ease;
	-o-transition: all 0.8s ease;}

#form .submit:hover, #form .submit:focus {
	background-color: #82B3AE;
	color: #111;}


::-webkit-input-placeholder {color: #82B3AE;}
input:focus::-webkit-input-placeholder {color: #eee;}
textarea:focus::-webkit-input-placeholder {color: #eee;}
:-moz-placeholder {color: #82B3AE; opacity: 1}
input:focus:-moz-placeholder {color: #eee; opacity: 1}
textarea:focus:-moz-placeholder {color: #eee; opacity: 1}
::-moz-placeholder {color: #82B3AE; opacity: 1}
input:focus::-moz-placeholder {color: #eee; opacity: 1}
textarea:focus::-moz-placeholder {color: #eee; opacity: 1}
:-ms-input-placeholder {color: #82B3AE;}
input:focus:-ms-input-placeholder {color: #eee;}
textarea:focus:-ms-input-placeholder {color: #eee;}


/* AVTORJI */

a.avtorji {
	position: fixed;
	display: inline-block;
	bottom: 0;
	right: 17px;
	padding: 3px 8px;
	font-size: 10px;
	font-weight: 700;
	text-decoration: none;
	color: #82B3AE;
	background-color:#111;
	background-color: rgba(17,17,17,0.8);
	outline: 0;
	transition: all 0.8s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}


a.avtorji:hover{
	color: #acfff6;
	padding-bottom: 10px;
}

/* Media Queries */

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

}

/* Smaller Laptops */
@media only screen and (min-width: 960px) and (max-width: 1280px) {

}

/* Smaller than standard 960 (devices and browsers) */
   @media only screen and (max-width: 959px) {

   }


/* Tablet Portrait size to standard 960 (devices and browsers) */
   @media only screen and (min-width: 768px) and (max-width: 959px) {
   
   }


/* All Mobile Sizes (devices and browser) */
   @media only screen and (max-width: 767px) {
    .container { width: 300px; }
   }


/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
   @media only screen and (min-width: 480px) and (max-width: 767px) {
  
/* contact form */
#form-wrapper {width: 340px;}
#form {width: 340px;}
#form div {width: 340px;}
#form div label {width: 325px;}
#form input {width: 325px;}
#form .subject {width: 335px;}
#form textarea {width: 325px;}
#form .submit {margin-right: 15px;}
#form .success {width: 340px;}
#form .error {right: 5px;}

   }


/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
   @media only screen and (max-width: 479px) {
   
/* contact form */
#form-wrapper {width: 240px;}
#form {width: 240px;}
#form div {width: 240px;}
#form div label {width: 225px;}
#form input {width: 225px;}
#form .subject {width: 235px;}
#form textarea {width: 225px;}
#form .submit {margin-right: 15px;}
#form .success {width: 240px;}
#form .error {right: 5px;}
}


/*only for webkit  browsers*/
@media screen and (-webkit-min-device-pixel-ratio:0) {
 

   }