/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Nov 28 2017 | 12:13:37 */
/*  HOVER EFEKT PROJEKTŮ - ANIMACE NADPISŮ / ODHALENÍ CAPTION 6.0.3
________________________________________ */

.hp_box_animation_font .et_pb_column {
  position: relative; overflow: hidden; height: 55vh;
  -webkit-transition: all 0.3s cubic-bezier(.79,.78,.71,1); 
  -ms-transition: all 0.3s cubic-bezier(.79,.78,.71,1);
  -moz-transition: all 0.3s cubic-bezier(.79,.78,.71,1); 
  -o-transition: all 0.3s cubic-bezier(.79,.78,.71,1);
  transition: all 0.3s cubic-bezier(.79,.78,.71,1);}

.hp_box_animation_font .et_pb_column:hover {}
.hp_box_animation_font .et_pb_promo_description {position: absolute !important; bottom: 5%; padding: 10%;}

/* NASTAVENÍ OBRÁZKU - OVERLAY / SCALE EFEKT */
.hp_box_animation_font .et_pb_column .box-foto img {
  display: block; object-fit: cover; object-position: 0 0; width: 85vw; height: 85vh;  
  filter: grayscale(0%); -webkit-filter: grayscale(0%);
  -webkit-transition: all 0.3s cubic-bezier(.79,.78,.71,1); 
  -ms-transition: all 0.3s cubic-bezier(.79,.78,.71,1);
  -moz-transition: all 0.3s cubic-bezier(.79,.78,.71,1); 
  -o-transition: all 0.3s cubic-bezier(.79,.78,.71,1);
  transition: all 0.3s cubic-bezier(.79,.78,.71,1) ;}

.hp_box_animation_font .et_pb_column:hover .box-foto img {transform: scale(1.1);
  -webkit-transition: all 0.3s cubic-bezier( 0.92, 0.49, 0.71, 1);
  -moz-transition: all 0.3s cubic-bezier( 0.92, 0.49, 0.71, 1);
  -o-transition: all 0.3s cubic-bezier( 0.92, 0.49, 0.71, 1);
  -ms-transition: all 0.3s cubic-bezier( 0.92, 0.49, 0.71, 1);
  transition: all 0.3s cubic-bezier( 0.92, 0.49, 0.71, 1);}

/* OVERLAY */
.hp_box_animation_font .et_pb_column .box-foto:after {
  position: absolute; top: 0; left: 0; width: 100%; height: 100%; content: "";
  background: rgba( 0, 0, 0, 0.75 );
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;}

/* HOVER */
.hp_box_animation_font .et_pb_column:hover .box-foto:after {background: rgba(224,43,32,0.85);}


/* TYPOGRAFIE - POZICE */

/* TITLE - ON LOAD */
.hp_box_animation_font .et_pb_column .et_pb_promo_description h2 {
  opacity: 1; text-align: left; color: #fff; letter-spacing: 5px !important;
  -webkit-transform: translateY(0%); transform: translateY(0%);
  transition: 2s -webkit-transform cubic-bezier(.19,1,.22,1);
  transition: 2s transform cubic-bezier(.19,1,.22,1);}

/* TITLE - HOVER */
.hp_box_animation_font .et_pb_column:hover .et_pb_promo_description h2 {
  -webkit-transform: translateY(-10%); transform: translateY(-10%);
  animation: glitch-text-color-ani 3s; animation-iteration-count: 1;}

/* DESCRIPTION - ON LOAD */
.hp_box_animation_font .et_pb_column .et_pb_promo_description span.projekt_description {
  display: block; overflow: hidden; max-height: 0; opacity: 0;  
  font-size: 14px; color: #fff; max-width: 300px !important; line-height: 1.9;
  transform: translateY(10%); transition: transform 500ms ease-in-out, opacity 250ms ease-in-out;}

/* DESCRIPTION - HOVER */
.hp_box_animation_font .et_pb_column:hover .et_pb_promo_description span.projekt_description {
  overflow: hidden; max-height: 100%; opacity: 1;
  transform: translateY(0); transition: transform 500ms ease-in-out, opacity 1s ease-in-out;}

/* KATEGORIE - ON LOAD */
.hp_box_animation_font .et_pb_column .et_pb_promo_description h4 {
  text-align: left; color: #fff; font-size: 11px; text-decoration: none;
  text-transform: uppercase; opacity: 0; letter-spacing: 4px;
  position: relative; overflow: hidden; display: inline-block;
  padding-bottom: 6px !important; padding-top: 3px;
  transform: translateY(0%); -webkit-transform: translateY(0%);
  transition: 2s -webkit-transform cubic-bezier(.19,1,.22,1);
  transition: 2s transform cubic-bezier(.19,1,.22,1);}
     
/* KATEGORIE - HOVER */
.hp_box_animation_font .et_pb_column:hover .et_pb_promo_description h4 {
  -webkit-transform: translateY(60%); transform: translateY(60%); opacity: 1;
  transition: 2s -webkit-transform cubic-bezier(.19,1,.22,1);
  transition: 2s transform cubic-bezier(.19,1,.22,1);}

/* KATEGORIE - LINE - ON LOAD */
.hp_box_animation_font .et_pb_column .et_pb_promo_description h4:after {
  opacity: 0; content: ""; display: block; position: absolute;
  bottom: 0px; left: 0; width: 100%; height: 0; border-bottom: 2px solid;
  -webkit-transform: translateX(0%); transform: translateX(0%);
  -webkit-transition: all 0.8s cubic-bezier(0.58, 0.3, 0.005, 1);
  transition: all 0.8s cubic-bezier(0.58, 0.3, 0.005, 1);}

/* KATEGORIE - LINE - HOVER */
.hp_box_animation_font .et_pb_column:hover .et_pb_promo_description h4:after {
  -webkit-animation: slide-out-slide-in 1s cubic-bezier(.18,.43,.01,.96) 0s 1;
  animation: slide-out-slide-in 1s cubic-bezier(.18,.43,.01,.96) 0s 1;
  -o-animation: slide-out-slide-in 1s cubic-bezier(.18,.43,.01,.96) 0s 1;}


/* PROMO CTA - FULLWIDTH - HIDDEN */
.hp_box_animation_font .et_pb_promo {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.hp_box_animation_font .et_pb_promo_button {opacity: 0; position: absolute; top: 0; left: 0; width: 100%; height: 100%;}


/* RESPONSIVE DESIGN - MOBILE */
@media only screen and (max-width: 960px) {

/* VÝŠKA DLAŽDICE */
.hp_box_animation_font .et_pb_column {height: 50vh;}
  
/* CAPTION HIDDEN */
.hp_box_animation_font .et_pb_column .et_pb_promo_description span.projekt_description,
.hp_box_animation_font .et_pb_column:hover .et_pb_promo_description span.projekt_description {
  display: none;}}


/* AWARDS */

/* SINGLE / FIRST AWARD */
img.box-award {
  position: absolute !important; top: 0 !important; left: 10%;
  display: block; height: 40px; width: 30px; z-index: 99998;
  -webkit-transform: translateY(-50px); transform: translateY(-50px);
  transition: 250ms -webkit-transform cubic-bezier(.85,.32,.65,1);
  transition: 250ms transform cubic-bezier(.85,.32,.65,1);
  -webkit-transition-delay: 0ms; transition-delay: 0ms;}

.hp_box_animation_font .et_pb_column:hover img.box-award {
  -webkit-transform: translateY(0); transform: translateY(0);
  transition: 500ms -webkit-transform cubic-bezier(.29,.62,.87,1);
  transition: 500ms transform cubic-bezier(.29,.62,.87,1);}

/* SECOND AWARD */
img.box-award.box-award-second {left: calc(10% + 45px); -webkit-transition-delay: 0ms; transition-delay: 0ms;}
/* HOVER */
.hp_box_animation_font .et_pb_column:hover img.box-award.box-award-second {-webkit-transition-delay: 150ms; transition-delay: 150ms;}
	
/* THIRD AWARD */
img.box-award.box-award-third {left: calc(10% + 90px); -webkit-transition-delay: 0ms; transition-delay: 0ms;}
/* HOVER */
.hp_box_animation_font .et_pb_column:hover img.box-award.box-award-third {-webkit-transition-delay: 300ms; transition-delay: 300ms;}


/* RESPONSIVE NASTAVENÍ */
/* DESKTOP */
@media only screen and (min-width: 981px) {
.hp_box_animation_font .et_pb_column .et_pb_promo_description h2 {font-size: 2vw; line-height: 3vw; letter-spacing: 0px;}}
/* MOBILE */
@media only screen and (max-width: 960px) {
.hp_box_animation_font .et_pb_column .et_pb_promo_description h2 {font-size: 1.3rem; line-height: 2.038rem; letter-spacing: 1px;}}
/* TABLET VERTICAL */
@media only screen and (min-width: 768px) and (max-width: 980px) {
.hp_box_animation_font .et_pb_column .et_pb_promo_description h2 {font-size: 1.7rem; line-height: 2.438rem; letter-spacing: 1px;}}
/* TABLET HORIZONTAL */
@media only screen and (min-width: 981px) and (max-width: 1100px) {
.hp_box_animation_font .et_pb_column .et_pb_promo_description h2 {font-size: 1.7rem; line-height: 2.438rem; letter-spacing: 1px;}}