/* 
Theme Name: Playa Projects - Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 1.0.1
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featumain-images, rtl-language-support, threaded-comments, translation-ready
*/

/*
    Add your custom styles here
*/


@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100..700;1,100..700&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');


:root {
    --animated: all .3s ease-in-out;
    --mainColor: ;
    --altColor: #F1FC00;
    --darkColor: ;
    --whiteColor: ;
    --darkGray: #1d1d1d ;
    --lightGray: #A2A2A2 ;
    --mainFont: 'Josefin Sans', sans-seriff;
    --textFont: 'Poppins', sans-seriff;
}

.mainColor{ color:var(--mainColor); }
.altColor{ color:var(--altColor); }
.darkColor{ color:var(--darkColor); }
.whiteColor{ color:var(--whiteColor); }
.darkGray{ color:var(--darkGray); }
.lightGray{ color:var(--lightGray); }
.mainFont{ font-family:var(--mainFont); }
.textFont{ font-family:var(--textFont); }

.spanB {color:#00EEFF;}
.spanY{color: var(--altColor);}

body {font-family: var(--textFont);}
a {color: var(--mainColor);}
.noSpace, .noSpace p {padding: 0px; margin: 0px;}

.sidenav {
    height: auto;
    width: 0;
    position: fixed;
    z-index: 9999;
    top: 0;
    left: 0;
    background-color:#0c0c0c;
    overflow-x: hidden;
    transition: 0.5s;
    padding-top: 10px;
}



.carousel-control-prev,
.carousel-control-next {border: none;height: 65px;margin: auto;border-radius: 100px;width: 65px; transition: var(--animated); background: black; outline:none; }
.carousel-control-prev{padding: 10px 15px 5px 10px; left: -8px;transform: scale(.65);}
.carousel-control-next{padding: 10px 10px 5px 15px; right: -8px;transform: scale(.65);}
.carousel-control-prev:hover,.carousel-control-prev:active,.carousel-control-prev:focus,
.carousel-control-next:hover,.carousel-control-next:active,.carousel-control-next:focus {background: white; color: black;}
.carousel-control-prev-icon, .carousel-control-next-icon {transition: var(--animated);}
.carousel-control-prev:hover .carousel-control-prev-icon,.carousel-control-prev:active .carousel-control-prev-icon, .carousel-control-prev:focus .carousel-control-prev-icon,.carousel-control-next:hover .carousel-control-next-icon,.carousel-control-next:active .carousel-control-next-icon,.carousel-control-next:focus .carousel-control-next-icon{filter: brightness(0);}


.carousel-caption {position: absolute;bottom: 5%;left: 50%;color: #fff;text-align: center;transform: translateX(-50%);width: 100%;     background: #00000080;padding: 75px 0px;}

.captionsubTitle{font-size: 24px; font-weight: 500;}
.captionTitle{font-family: var(--mainFont);font-size: 70px;font-weight: 700;line-height: 75px;letter-spacing: -1px;}
.captionOne .accentColor {color: #00EEFF;}
.captionButton {display: inline-block; margin-top: 30px;}
.captionButton a {font-size: 18px;font-weight: 700;color: var(--darkGray);background: #00EEFF;border-radius: 100px;
    transition: var(--animated);padding: 10px 35px;}
.captionButton a:hover {color: white; padding: 10px 50px;}

.captionTwo .accentColor {color: #FF8800;}

.captionTwo .captionButton a {background: #FF8800;}
.captionTwo .captionButton a:hover {color: white; padding: 10px 50px;}




.header {z-index: 2;top: 0%; background: #1a1a1a; position: fixed; transition: var(--animated);}
.elementor-page-72 .header {background: transparent;}
.headerScroll { background: white;transition: var(--animated);filter: drop-shadow(0px 3px 3px rgb(0, 0, 0, .2));}

.logo { width: 250px;filter: invert(93%) sepia(7%) saturate(0%) hue-rotate(91deg) brightness(106%) contrast(108%); transition: var(--animated);}
.headerScroll .logo {width: 150px; filter: none;}


.footer {background: var(--darkGray); color: white;}


#menu-principal li {margin-right: 50px;}

#menu-principal li a {font-size: 16px; font-weight: 600; color: var(--lightGray); letter-spacing: 1px; position: relative;text-decoration: none;  transition: var(--animated);}

.header #menu-principal li a:before {content: ''; width: 100%; height: 2px;position: absolute; bottom: -5px; left:0; transform: scaleX(0); transform-origin:left; transition:var(--animated); }
.header #menu-principal li a:before {background: white;}
.headerScroll #menu-principal li a:before {background: var(--darkGray);}
#menu-principal li a:hover:before { transform: scaleX(1.0);} 

.header #menu-principal li.current-menu-item a {color: white}
.headerScroll #menu-principal li.current-menu-item a {color: var(--darkGray);}
#menu-principal li.current-menu-item a:before {background:#DAE228; transform:scaleX(1); }

.header #menu-principal li a:hover {color: white;}
.headerScroll #menu-principal li a:hover {color: var(--darkGray);}

.topSocials a {font-size: 18px;padding: 10px;border-radius: 100px;transition: var(--animated);text-decoration: none;margin: 0px 5px;background: #000000bf;}
.header .topSocials a {color: var(--lightGray);}
.header .topSocials a:hover {background: white; color: var(--darkGray);}

.headerScroll .topSocials a { color: white;}
.headerScroll .topSocials a:hover {background: var(--darkGray); color:#DAE228; }

.titleLine span {border-radius: 100px;}
.normalText strong {font-weight: 600; color: var(--darkGray);}

/* Filtros  */

.genero-filter-btn {border: none; color: #8A8A8A; font-weight: 500;transition: var(--animated);}
.genero-filter-btn:hover, .genero-filter-btn:active, .genero-filter-btn:focus {transform: scale(1.1); background: none; color: black;}
.genero-filter-btn.active {color: var(--darkGray); font-weight: 600;}

/*Catálogo Artistas*/

.artistCard .cardInner {background: transparent; padding: 0px; border-radius: 0px; transition: var(--animated); border: 1px solid #0F0F0F; }
.artistCard .cardInner:hover {background: #0F0F0F; border-radius: 20px;}

.cardTitlecont {min-height: 60px;}
.cardTitleart {font-family: var(--mainFont); color: white;  font-size: 26px; font-weight: 600; letter-spacing: -1px; line-height: 28px;}
.cardGenero {color: #4c4e0c; font-size: 16px; }
.cardGenero i {font-size: 12px;}

.artistCard .featured-image img { }
.artistCard .featured-image {filter: grayscale(100%); transition: var(--animated);}
.artistCard:hover .featured-image {filter: grayscale(0%);}

.artistCard .cardButton {padding: 5px 15px; border-radius: 5px;color: #7c7c7c; border: 1px solid #7c7c7c; transition: var(--animated);}
.artistCard:hover .cardButton {color: var(--altColor);border: 1px solid var(--altColor);}
.artistCard .cardButton:hover {border-radius: 25px; background: var(--altColor); color: #1a1a1a;}


/* Testimonials */
.testCarousel {margin-top: -165px;}
#testimonial-carousel {z-index: 2;}
#testimonial-carousel .card {background:#DAE228; border: none; border-radius: 0px;}
#testimonial-carousel #divTestimg {background-size: contain;background-repeat: no-repeat; width: auto; height:100%;}
.starNoselected {color: #ffffff17;}
#testimonial-carousel .card-title {color: #1D1D1D; font-size: 24px;}
#testimonial-carousel .card-text-city {color: #1D1D1D; font-weight: 200; font-size: 20px;}
#testimonial-carousel p.card-text {color: #1D1D1D;font-weight: 200;font-size: 20px;}
#testimonial-carousel .carousel-control-prev, #testimonial-carousel  {
  background: transparent; color: #1D1D1D; background: none;}

  i.fas.fa-star {
    color: #1D1D1D;
}
.carousel-control-next {background: transparent; color: #DAE228; background: none;}


.contratacionesCard {border: 2px solid #2e2e2e; border-radius: 10px; background: transparent; transition: var(--animated);}
.contratacionesCard:hover {background: #0e0e0e; border-radius: 30px; border: 2px solid #0e0e0e;}
.botonContrataciones {background: transparent; padding: 7px 15px;display: block;width: fit-content;border: 1px solid var(--altColor);color: var(--altColor);border-radius: 5px;transition: var(--animated);}
.botonContrataciones:hover {background:#F1FC00; border-radius:50px; color: #1a1a1a; letter-spacing:1px; }
.cardDesc {min-height: 150px;}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {

}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {

}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {

}

/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
    .artistaGallery .masonry {columns: 3;}
 
}

/* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) { 


}

/* No Bootstrap Class (larger desktops, 1900px and up) */
@media (min-width: 1900px) { 

}