/*======================================
//--//-->   PORTFOLIO
======================================*/



.work-box {
 margin-bottom: 3rem;
 -webkit-backface-visibility: hidden;
 backface-visibility: hidden;
 background-color: #fff;
 cursor: pointer
}

.work-box:hover img {
 -webkit-transform: scale(1.3);
 transform: scale(1.3);
}

.work-img {
 display: block;
 overflow: hidden;
}

.work-img img {
 transition: all 1s;
}

.work-content {
 padding: 2rem 3% 1rem 4%;
}

.work-content .w-more {
 color: #4e4e4e;
 font-size: .8rem;
}

.work-content .w-more .w-ctegory {
 color: #b8a07e;
}

.work-content .w-like {
 font-size: 2.5rem;
 color: #b8a07e;
 float: right;
}

.work-content .w-like a {
 color: #b8a07e;
}

.work-content .w-like .num-like {
 font-size: .7rem;
}

.w-title {
 font-size: 1rem;
}



/*-----------------------------------------------------------------------------------*/
/*  Portfolio
/*-----------------------------------------------------------------------------------*/

#portfolio {
 position: relative;
 padding-bottom: 10px;
}

#portfolio .portfolio-list {
 margin-bottom: 50px;
 text-align: center;
}

#portfolio .portfolio-list .nav {
 display: inline-block;
 margin: 0;
}

#portfolio .portfolio-list .nav li {
 margin: 0 40px 0 0;
 float: left;
 font-size: 14px;
 color: #999999;
 line-height: 16px;
 cursor: pointer;
 font-family: 'Poppins', helvetica;
 letter-spacing: 0.02em;
 text-transform: capitalize;
 text-align: center;
 -moz-transition: all 0.5s ease-in-out 0s;
 -ms-transition: all 0.5s ease-in-out 0s;
 -o-transition: all 0.5s ease-in-out 0s;
 -webkit-transition: all 0.5s ease-in-out 0s;
 transition: all 0.5s ease-in-out 0s;
}

#portfolio .portfolio-list .nav li:hover,
#portfolio .portfolio-list .nav li.filter-active {
 color: #b8a07e;
 -moz-transition: all 0.5s ease-in-out 0s;
 -ms-transition: all 0.5s ease-in-out 0s;
 -o-transition: all 0.5s ease-in-out 0s;
 -webkit-transition: all 0.5s ease-in-out 0s;
 transition: all 0.5s ease-in-out 0s;
}

#portfolio .portfolio-container {
 display: inline-block;
 margin-bottom: 10px;
 width: 100%;
}

.portfolio-thumbnail {
 margin-bottom: 30px;
 overflow: hidden;
 min-height: 260px;
}

.portfolio-thumbnail img {
 max-width: 100%;
}


#portfolio #portfolio-flters {
 padding: 0;
 margin: 5px 0 35px 0;
 list-style: none;
 text-align: center;
}

#portfolio #portfolio-flters li {
 cursor: pointer;
 margin: 15px 15px 15px 0;
 display: inline-block;
 padding: 6px 10px;
 font-size: 16px;
 line-height: 20px;
 /* color: #413e66; */
 margin-bottom: 5px;
 transition: all 0.3s ease-in-out;
}

#portfolio #portfolio-flters li:hover,
#portfolio #portfolio-flters li.filter-active {
 color: rgb(95, 193, 174);
 ;
}


.modal-content {
 background: none;
 border: none;
}

.modal-header {
 border-bottom: none;
 padding: 0, 0;
}

.modal-footer {
 border-top: none;

}

.close {
 font-size: 3rem
}

#fertinho .modal-dialog,
#inbloc .modal-dialog,
#budin .modal-dialog,
#encuadro .modal-dialog,
#bruja .modal-dialog,
.carousel-horizontal .modal-dialog {
 max-width: 70%;
 margin: auto
}

#dell .modal-dialog,
#brujita .modal-dialog {
 max-width: 50%;
 margin: auto
}

#bartour .modal-dialog {
 max-width: 50%
}


.carousel-vertical .modal-dialog {
 max-width: 40%
}

.carousel-vertical2 .modal-dialog {
 max-width: 25%
}

#vecini .modal-dialog {
 max-width: 60%;
 margin: auto
}

#mtv .modal-dialog,
#pacman .modal-dialog,
#coldplay .modal-dialog,
#fender .modal-dialog,
#lactancia .modal-dialog,
#light .modal-dialog,
#oriental .modal-dialog,
#chanchito .modal-dialog,
.video-horizontal .modal-dialog {
 max-width: 80%;
 margin: auto
}


@media screen and (max-width:992px) {

 #bartour .modal-dialog {
  max-width: 80%;
  margin: auto
 }


 .carousel-vertical .modal-dialog {
  max-width: 90%;
  margin: auto
 }

 .carousel-vertical2 .modal-dialog {
  max-width: 90%;
  margin: auto
 }

 #vecini .modal-dialog {
  max-width: 95%;
  margin: auto
 }


 #fertinho .modal-dialog,
 #inbloc .modal-dialog,
 #encuadro .modal-dialog,
 #budin .modal-dialog,
 #dell .modal-dialog,
 #bruja .modal-dialog,
 .carousel-horizontal .modal-dialog {
  max-width: 95%;
  margin: auto
 }

 #mtv .modal-dialog,
 #pacman .modal-dialog,
 #coldplay .modal-dialog,
 #fender .modal-dialog,
 #lactancia .modal-dialog,
 #light .modal-dialog,
 #oriental .modal-dialog,
 #chanchito .modal-dialog,
 .video-horizontal .modal-dialog {
  max-width: 95%;
  margin: auto
 }


}


.play-btn {
 width: 94px;
 height: 94px;
 background: radial-gradient(rgba(255, 255, 255, 0.9) 52%, rgba(255, 255, 255, 0.4) 52%);
 border-radius: 50%;
 display: block;
 position: absolute;
 left: calc(50% - 47px);
 top: calc(50% - 47px);
 overflow: hidden;
}

.play-btn::after {
 content: '';
 position: absolute;
 left: 50%;
 top: 50%;
 transform: translateX(-40%) translateY(-50%);
 width: 0;
 height: 0;
 border-top: 10px solid transparent;
 border-bottom: 10px solid transparent;
 border-left: 15px solid #b8a07e;
 z-index: 100;
 transition: all 400ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.play-btn::before {
 content: '';
 position: absolute;
 width: 120px;
 height: 120px;
 -webkit-animation-delay: 0s;
 animation-delay: 0s;
 -webkit-animation: pulsate-btn 2s;
 animation: pulsate-btn 2s;
 -webkit-animation-direction: forwards;
 animation-direction: forwards;
 -webkit-animation-iteration-count: infinite;
 animation-iteration-count: infinite;
 -webkit-animation-timing-function: steps;
 animation-timing-function: steps;
 opacity: 1;
 border-radius: 50%;
 border: 5px solid rgba(255, 255, 255, 0.7);
 top: -15%;
 left: -15%;
 background: rgba(198, 16, 0, 0);
}

.play-btn:hover::after {
 border-left: 15px solid #b8a07e;
 transform: scale(20);
}

.play-btn:hover::before {
 content: '';
 position: absolute;
 left: 50%;
 top: 50%;
 transform: translateX(-40%) translateY(-50%);
 width: 0;
 height: 0;
 border: none;
 border-top: 10px solid transparent;
 border-bottom: 10px solid transparent;
 border-left: 15px solid #fff;
 z-index: 200;
 -webkit-animation: none;
 animation: none;
 border-radius: 0;
}

@-webkit-keyframes pulsate-btn {
 0% {
  transform: scale(0.6, 0.6);
  opacity: 1;
 }

 100% {
  transform: scale(1, 1);
  opacity: 0;
 }
}

@keyframes pulsate-btn {
 0% {
  transform: scale(0.6, 0.6);
  opacity: 1;
 }

 100% {
  transform: scale(1, 1);
  opacity: 0;
 }
}

.roundedtop {
 border-top-left-radius: .5em;
 border-top-right-radius: .5em;
}

.bordesrounded {
 border-radius: .5em
}

.btn-watch-video ion-icon {
 line-height: 0;
 color: #fff;
 font-size: 36px;
 transition: 0.3s;
 margin-right: 8px;
}

.btn-watch-video:hover ion-icon {
 color: #b8a07e;
}

.box-shadow,
.paralax-mf,
.service-box,
.work-box,
.card-blog {
 box-shadow: 0 13px 8px -10px rgba(0, 0, 0, 0.1);
}

a {
 color: #292929;
 text-decoration: none !important;
 -moz-transition: all 0.5s ease-in-out 0s;
 -ms-transition: all 0.5s ease-in-out 0s;
 -o-transition: all 0.5s ease-in-out 0s;
 -webkit-transition: all 0.5s ease-in-out 0s;
 transition: all 0.5s ease-in-out 0s;
}

.contact {
 display: none;
}

@media screen and (max-width: 450px) {
 .work-content .w-like {
  float: none !important;
 }
}