/*
Theme Name: atelier-r_template
Theme URI: https://atelier-r.cz
Description: atelier-r_template
Author: atelier-r.cz, bdesigner.cz
Version: 2.0
Tags: atelier-r_template
*/
/* ZAKLAD A HLAVNI TYPOGRAFIE */       
html.home,html.home body {
height: 100%;
}
html.home body {
margin-bottom: 0px;
}
html {
  position: relative;
  min-height: 100%;
}
body {
  /* Margin bottom by footer height */
  margin-bottom: 70px;
}
body {
background: #ffffff;
font-family: 'Ubuntu', sans-serif;
font-display: block;
color: #989898;
font-size: 14px;
font-weight: 400;
line-height: 1.2;
text-align: left;  
} 
/* fade animace po načtení stránky */
body {
    opacity: 1;
    transition: 1s opacity;
}
body.fade-out {
    opacity: 0;
    transition: none;
}
.vetsi {
font-size: 18px;
padding-bottom: 30px;
} 
@media (max-width: 576px) {
.vetsi {
font-size: 14px;
} 
}
.reset{
clear: both;
}
ul,ol{
margin-bottom: 15px;
padding-left: 18px;
}
strong{
font-weight: 700 !important;
}
h1, h2, h3, h4, p, ul li,ol li{
line-height: 1.2;
}
h1 {
  font-size: 38px;
  font-weight: 400;
  color: #000;
  margin: 0px 0px 25px 0px;
  padding:0;
}
h2 {
  font-size: 30px;
  font-weight: 400;
  color: #000;
  margin: 25px 0px 25px 0px;
  padding:0;
}
h3 {
  font-size: 24px;
  font-weight: 400;
  color: #989898;
  margin: 25px 0px 15px 0px;
  padding:0;
}
h4 {
  font-size: 20px;
  font-weight: 400;
  color: #989898;
  margin: 25px 0px 15px 0px;
  padding:0;
}
@media (max-width: 768px) {
h1 {
  font-size: 26px;
  margin: 15px 0px 15px 0px;
}
h2 {
  font-size: 22px;
  margin: 15px 0px 15px 0px;
}
h3 {
  font-size: 20px;
  margin: 15px 0px 5px 0px;
}
h4 {
  font-size: 18px;
  margin: 15px 0px 5px 0px;
}
}
a {
color: #000;  
text-decoration: none;
} 
a:visited {
color: #000;
} 
a:hover {
color: #989898;
text-decoration: underline;
} 
p{
margin-bottom: 15px;
text-align: left;
}  
/* HLAVICKA */
header{
min-height: 70px;
padding-bottom: 0px;
position: absolute;
z-index:99999 !important;
width: 100%;
background: #fff;
} 
header img.logo{
margin-top: 20px;
height: 27px;
width: auto;
float: left; 
display: block;
} 
header img.znacka{
margin-top: 20px;
position: absolute;
right:30px;
} 
@media (max-width: 576px) {
header img.znacka{
right:20px;
}
}
/* KONTEJNERY */
.container-fluid{
max-width: 4480px;
position: relative;
padding-left: 0 !important;
padding-right:0 !important;
margin-left: auto;
margin-right:auto;
} 
.okraj{
padding-left: 30px;
padding-right: 30px;
position: relative;
}
@media (max-width: 576px) {
.okraj{
padding-left: 20px;
padding-right: 20px;
}
}
.skok{
margin-top: 40px;
margin-bottom: 15px;
}
.skok.onsingle{
margin-top: 40px;
margin-bottom: 30px;
}
.skok.atelierr{
margin-top: 0px;
}
/* MENU */
.navbar-toggler {
padding: 0.25rem 0.5rem 0.25rem 0.5rem;
color: #000 !important;
border: 0; 
border-radius: 0;
margin: 0px 0 0 0 !important; 
position: absolute;
right: 40px;
top: -29px;
z-index:99999;
}
.navbar-light .navbar-toggler-icon {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 0, 0, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
.navbar-light .navbar-toggler-icon:hover,.navbar-light .navbar-toggler-icon:focus  {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(152, 152, 152, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
.navbar .navbar-collapse {
border: 0;
-webkit-box-shadow: none;
box-shadow: none; 
}
.navbar  {
margin: 33px 60px 0px 0px !important;
padding: 0px 0 0 0 !important;
border: 0;
-webkit-box-shadow: none;
box-shadow: none; 
background: none !important;
min-height: auto !important; 
float: right; 
}
.navbar.portfolio-menu {
float: left;
margin-left: 30px !important;
margin-right:0;
}
.navbar ul {
margin: 0px 0px 0 0px !important;
padding: 0 !important;  
}  
.navbar ul li {
margin: 0px 0px 0 0px !important;
padding: 0 !important;  
list-style: none ;
}
.navbar a {
color: #989898 !important;
font-weight: 400;
font-size: 16px;
margin: 0px 30px 0px 0px !important;
padding: 0px 0px 0px 0px !important;
line-height: 100% !important;  
text-decoration: none !important;
text-transform: lowercase;
text-align: right;
display: block;  
}
.navbar li:last-child a {
margin: 0px 0px 0px 0px !important;
}
 .navbar li a:hover {
color: #000 !important;
}
.navbar li.current-menu-item a, .navbar li.current-post-ancestor a, .navbar li.current-page-ancestor a, .navbar li.current-category-ancestor a, .navbar li.current-menu-ancestor a {
color: #000 !important;
}
.navbar-collapse {
 margin:0;
 padding:0; 
    }
@media (max-width: 1080px) {
.navbar a  {
 margin: 0px 10px 0px 0px !important;
}
}
/* KOLAPS MENU DO HAMBURGERU */
@media(max-width:991px) {
img.logo{
float: none !important;
}
.navbar.portfolio-menu {
float: none !important;
margin-left: 0px !important;
}
.navbar-collapse ul{
margin: 30px 0px 30px 0px !important;
padding: 0px 0px 0px 0px !important;
clear: both;
width: 100%;
float: left;
}
.navbar.portfolio-menu .navbar-collapse ul {
margin: 30px 0px 0px 0px !important;
}
.navbar-collapse ul li a  {
width: auto !important;
display: block;
text-align: left !important;
border: 0 !important;
float: left !important;
margin: 0px 0 10px 0 !important;
clear: both;  
}
.navbar   {
padding: 0px 0px 0px 0px !important;
margin: 0px 0 0 0 !important;
float: none !important 
}
}
/* PATICKA */
footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  /* Set the fixed height of the footer here */
  height: 70px;
}
footer a {
color: #989898 !important;
}
footer a:hover {
color: #000 !important;
}
footer ul {
margin-top: 30px;
margin-left: 36px;
margin-bottom: 0px;
float: left;
}
footer ul li {
list-style-type: none;
float: left;
padding-right: 30px;
text-transform: lowercase;
}
footer ul li a {
text-decoration: none !important;
}
.social {
font-size: 30px;
margin-top: 20px;
float: left;
}
@media(max-width:576px) {
.social {
font-size: 22px;
margin-top: 20px;
}
footer ul {
margin-top: 24px;
margin-left: 0px;
}
footer ul li {
padding-right: 10px;
}
}
/* CAROUSEL*/
.carousel-fade .carousel-item {
 opacity: 0;
 transition-duration: .5s;
 transition-property: opacity;
}
.carousel-fade  .carousel-item.active,
.carousel-fade  .carousel-item-next.carousel-item-left,
.carousel-fade  .carousel-item-prev.carousel-item-right {
  opacity: 1;
}
.carousel-fade .active.carousel-item-left,
.carousel-fade  .active.carousel-item-right {
 opacity: 0;
}
.carousel-fade  .carousel-item-next,
.carousel-fade .carousel-item-prev,
.carousel-fade .carousel-item.active,
.carousel-fade .active.carousel-item-left,
.carousel-fade  .active.carousel-item-prev {
 transform: translateX(0);
 transform: translate3d(0, 0, 0);
}
#myCarousel {
    max-width: 4480px;
    height: 100%; 
    padding-top: 70px;
}
.skokove{
padding-top: 70px;
}
@media(max-width:576px) {
#myCarousel {
padding-top: 70px;
}
.skokove{
padding-top: 70px;
}
.carousel-item,
.active,
.carousel-inner {
    max-height: 2520px !important;
}
}
.carousel-item,
.active,
.carousel-inner {
    height: 100%;
}
@media(min-width:4480px) {
#myCarousel {
max-height: 2520px !important;
}
.carousel-item,
.active,
.carousel-inner {
    max-height: 2520px !important;
}
}
.carousel-item {
transition: -webkit-transform 0.5s ease;
	transition: transform 0.5s ease;
	transition: transform 0.5s ease, -webkit-transform 0.5s ease;
	-webkit-backface-visibility: visible;
	        backface-visibility: visible;
}
/* Background images are set within the HTML using inline CSS, not here */
.fill {
    width: 100%;
    height: 100%;
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}
.container-fluid.carousel{
max-width: 4480px;
position: relative;
height: 100%;
} 
@media(min-width:4480px) {
.container-fluid.carousel {
height: 2520px !important;
}
.okraj.carousel {
height: 2520px !important;
}
}
@media(max-width:1024px) {
.container-fluid.carousel{
max-width: 4480px;
position: relative;
height: auto;
} 
.okraj.carousel{
height: auto;
}
}
@media(max-width:1024px) {
#myCarousel {
height: 100% !important;
}
}
@media(max-width:1024px) {
.container-fluid.carousel {
height: 100% !important;
}
.okraj.carousel{
height: 100%;
}
}
.carousel-aktualita {
   top: 40px;
   left: 30px;
   position: absolute;
   z-index:999999px;
   width: 50%;
}
.carousel-aktualita.text-vpravo {
   top: 40px;
   left: auto;
   right: 30px;  
}
@media(max-width:576px) {
.carousel-aktualita {
   top: 30px;
   left: 20px;
}
.carousel-aktualita.text-vpravo {
   top: 30px;
   right: 20px;  
}
}
.carousel-aktualita.text-vpravo p{
text-align: right !important;  
}
.carousel-aktualita p {
    z-index:999999px;
    font-size: 36px !important;
    font-weight: 500;
    color: #ffffff;
      line-height: 110%;
  padding: 0px;
}
@media(max-width:991px) {
.carousel-aktualita p {  
font-size: 24px !important; 
}
}
@media(max-width:576px) {
.carousel-aktualita {
   width: auto;
}
.carousel-aktualita p {  
font-size: 18px !important; 
}
}
ol.carousel-indicators {
padding: 0 0 0 0;
margin: 0 0px 10px 0;
}
ol.carousel-indicators li {
background: #fff;
border:0;
opacity: 0.5;
width: 12px;
height: 4px;
margin: 0px 20px 0 0 !important;
}
ol.carousel-indicators li.active {
opacity: 1;
margin: 0px 20px 0 0 !important;
}
/* PORTFOLIO A HOVERDIR */
.portfolio {
	list-style: none;
	position: relative;
	padding: 0;
  margin: 0 0px -6px 0px;
    overflow: hidden !important;  
       width: 100%;
}
.portfolio .colo {
	float: left;
	position: relative;
 padding-right: 3px;
    padding-left: 3px;
    margin-bottom: 6px; 
} 
.zmena{
  margin-right: -6px;
  margin-left: -6px;
}
.obalit{
padding-right: 3px;
padding-left: 3px;
overflow: hidden !important;
}
.portfolio .colo a,
.portfolio .colo a img {
	display: block;
	position: relative;
  width: 100%;     
}    
.portfolio .colo a {
	overflow: hidden;
}
.portfolio .colo a div {
	position: absolute;
	background: rgba(84,84,84,0.8);
	width: 100%;
	height: 99.9%;  
}
.portfolio .colo a div span {
	display: block;
}
.portfolio .colo a div span p {
}    
.portfolio .colo a div span p{
font-size: 22px !important;
text-align: left;
font-weight: 300;
margin-bottom:0;
line-height: 140%;
color: #fff;
width: 100%;
 position: absolute;
bottom: 10%;
    padding-left: 30px;
    padding-right: 30px;  
}
.portfolio .colo a div span p strong {
font-weight: 700 !important;
font-size: 40px;
margin-top: 20px !important;
}
@media(max-width:991px) {
.portfolio .colo a div span p{
font-size: 18px !important;
}
.portfolio .colo a div span p strong {
font-size: 30px;
}
}
/* GALERIE A HOVERDIR*/
.gallery {
	list-style: none;
	position: relative;
	margin: 0px 0 0px 0;
	padding: 0;
  width: 100%;
}
.gallery br {
display: none !important;
}
.gallery .gallery-item {
	float: left;
  position: relative;
padding-right: 3px;
padding-left: 3px;
    margin-top: 6px; 
}
.gallery .gallery-item a,
.gallery .gallery-item a img {
	display: block;
  width: 100%; 
  height: auto; 
  	position: relative;
}  
.gallery .gallery-item a {
	overflow: hidden;
}
.gallery .gallery-item div {
	position: absolute;
	background: rgba(84,84,84,0.8);
	width: 100%;
	height: 99.9%; 
  z-index:999;
}
/* NOVINKY */
.novinky {
    margin-bottom: -6px; 
}
.novinka {
	float: left;
	position: relative;
 padding-right: 3px;
    padding-left: 3px;
    margin-bottom: 6px; 
}
.novinka img {
width: 100%;
}   
 .obsah-novinky {
    background: #eee;
         height: 100%; 
}
 .obsah-novinky-padding {
  padding: 10px 20px 0px 20px;
}
 .obsah-novinky-text {
color: #000; 
  width: 100%;
  padding-top: 56.25%; /* 16:9 Aspect Ratio */
  position: relative; /* If you want text inside of it */
  overflow: hidden;   
}
 .obsah-novinky-text-inner {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}
.text-aktuality-dole {
  position: absolute;
bottom: 5px;
}


 .obsah-novinky-text p {
margin-bottom: 10px; 

max-height: 100px;
overflow: hidden;  
}
 .obsah-novinky-text p a {
color: #989898;
}
 .obsah-novinky-text p a:hover {
color: #000;
}
 .obsah-novinky p.datum {
font-weight: bold;
font-size: 26px; 
color: #000;
margin-bottom:0;
}
 .obsah-novinky h2 {
font-weight: 300;
font-size: 24px; 
color: #000;
margin-top:10px;

max-height: 55px;
overflow: hidden;  
}

@media(max-width: 1660px) {
 .obsah-novinky p.datum {
font-size: 18px; 
}
 .obsah-novinky h2 {
font-size: 18px; 
max-height: 48px;
}

 .obsah-novinky-text p {
font-size: 12px;
}
}

@media(max-width: 1400px) {
 .obsah-novinky p.datum {
font-size: 16px; 
}
 .obsah-novinky h2 {
font-size: 16px; 
margin-top:0px;
max-height: 40px;
}

 .obsah-novinky-text p {
font-size: 11px;
max-height: 90px;
}

 .obsah-novinky-padding {
  padding: 10px 10px 0px 10px;
}
}

@media(max-width: 768px) {
 .obsah-novinky p.datum {
font-size: 14px; 
}
 .obsah-novinky h2 {
font-size: 14px; 
max-height: 33px;
}
}



 @media(max-width:576px) {

 .obsah-novinky-text {
  padding-top: 0;
  overflow: auto !important;
}
 .obsah-novinky-text-inner {
  position: relative;
}
.text-aktuality-dole {
  position: relative
}
 .obsah-novinky-text p {
max-height: auto !important;
  overflow: auto !important;
}
 .obsah-novinky h2 {
max-height: auto !important;
}

 .obsah-novinky p.datum {
margin-top: 10px;
}


}



/* SINGLE - DETAIL PORTFOLIA */
p.datum-detail{
font-size: 45px;
color: #989898;
font-weight: bold;
margin-bottom:25px;
}

.atelier-detail h2{
font-size: 45px;
color: #989898;
font-weight: bold;
margin-bottom:18px;
margin-top:-5px;
}


.tabulka-udaju p{
margin-bottom:6px;
color: rgba(84,84,84,1);
}
@media(max-width: 768px) {
p.datum-detail{
font-size: 26px;
margin-bottom:0px;
}

.atelier-detail h2{
font-size: 26px;
margin-bottom:0px;
}

.tabulka-udaju {
margin-bottom:30px;
}
}
/* o ateliéru */
  iframe {
  margin-top: -50px;
width: 100%;
height: auto;
    border:0;
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
    filter: gray; 
	  -webkit-filter: grayscale(99%); 
	  -webkit-backface-visibility: hidden;     
  }
  
  
.aspect-ratio {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 40%;
}  

.aspect-ratio iframe {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0; top: 0;
}
  
  
.atelier-obr {
padding-left:3px;
padding-right:3px;
  }
  @media(max-width:576px) {
.aspect-ratio {

  padding-bottom: 60%;
}
}
/* IMG, galerie, zarovnani */
blockquote{
padding: 20px 30px 20px 30px;
background: #989898;
} 
blockquote p{
color: #fff;
margin-bottom:0;
}
@media(max-width:1200px) {
blockquote{
padding: 0px 30px 10px 30px;
} 
}
  /* OBRAZKY */
img:not([src]) {
			visibility: hidden;
		}
		/* Fixes Firefox anomaly during image load */
		@-moz-document url-prefix() {
			img:-moz-loading {
				visibility: hidden;
			}
		}
img.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-top:30px;
	margin-bottom: 30px;
	}
img {
	border: 0px;
	}
img.alignright {
	float: right;
		margin: 0px 0px 30px 30px;
	}
img.alignleft {
	padding: 0px;
	margin: 0px 30px 30px 0px;
	display: inline;
	float: left;
	}
.wp-caption.alignright {
	float: right;
		margin: 0px 0px 30px 30px;
	}	
.wp-caption.alignleft {
	padding: 0px;
	margin: 0px 30px 30px 0px;
	display: inline;
	float: left;
	}	
   p.wp-caption-text   {
  display: none
	}	 
table { 
margin-top:30px;
margin-bottom:30px;
width: 100%;
margin-left: 0px;
margin-right: 0px;
border: 0px;
}
td {
background: #F3F3F3;
padding:10px 20px 10px 20px;
border: 1px solid #fff;
font-size: 18px;
color: #989898;
}
tr {
background: #F3F3F3;
}
table tr:nth-child(odd) td{
background: #F3F3F3;
}
table tr:nth-child(even) td{
background: #fff;
}
/* SLIDESHOW */
.fancybox-thumbs>ul>li:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border:1px solid #FF0000 !important;z-index:99991;opacity:0;transition:all .2s cubic-bezier(.25,.46,.45,.94)}
/* NAVIGACE */
.wp-pagenavi {
	clear: both;
	padding-top: 20px;
	padding-bottom: 70px !important;
	padding-left: 0px;
}
.wp-pagenavi a, .wp-pagenavi span {
	text-decoration: none;
	border: 0px solid #fff  !important;
	padding: 8px 12px !important;
	margin: 0px 5px 0px 0px;
	text-align: center;
	float: left;
	color: #989898;
	background: none;
	font-weight: 400;
}
.wp-pagenavi a:hover, .wp-pagenavi span.current {
	border: 0px solid #FF0000 !important;
  	font-weight: 400 !important;
    background: #989898;
    color: #fff;
}