/*
Theme Name: the7dtchild
Author: Dream-Theme
Author URI: http://dream-theme.com/
Description: The7 is perfectly scalable, performance and SEO optimized, responsive, retina ready multipurpose WordPress theme. It will fit every site – big or small. From huge corporate portals to studio or personal sites – The7 will become a great foundation for your next project!
Version: 1.0.0
License: This WordPress theme is comprised of two parts: (1) The PHP code and integrated HTML are licensed under the GPL license as is WordPress itself.  You will find a copy of the license text in the same directory as this text file. Or you can read it here: http://wordpress.org/about/gpl/ (2) All other parts of the theme including, but not limited to the CSS code, images, and design are licensed according to the license purchased. Read about licensing details here: http://themeforest.net/licenses/regular_extended
Template: dt-the7
*/
#main {
    padding: 0;
}

.whats svg .cls-1 {
    fill: #4cae50 !important;
}

.whats svg .cls-2 {
    fill: #f8f9f8 !important;
}

/**  Sections **/

#inicio {
    background-color: #2ab1dc;
    color: white;
}

#inicio .elementor-headline-plain-text,
#inicio p {
    color: white;
}

#inicio .elementor-headline-dynamic-wrapper svg {
    display: none;
}

#inicio .elementor-headline-dynamic-wrapper .elementor-headline-dynamic-text {
    font-size: 5rem;
    text-shadow: -3px 0px 0 #fcd21d;
}

#porqueprepalomas,
#porqueprepalomas h2,
#porqueprepalomas h3,
#porqueprepalomas h3:hover {
    color: white;
}

#porqueprepalomas h3 {
    border-bottom: 1px solid #2ab1dc;
}

.highlight-title {
    color: #fcd21d;
}

/* Admisiones */

#searchbar .elementor-headline{
    font-size: 35px;
}

#searchbar-btn .elementor-widget-container {
    align-content: center;
}

.admision-year {
    display: block;
    margin-top: -20px;
    color: #2ab1dc;
    -webkit-text-stroke-width: 0;
    text-shadow: none;
}

/** General Custom Styles **/

/* Photo scroller */

/* Accordion widget */
.elementor-accordion-icon {
    margin-left: auto !important;
    border-radius: 100%;
    border: 1px solid white;
    padding: 4px;
    padding-bottom: 3px;
}

.elementor-active .elementor-accordion-icon {
    border: 1px solid #fcd21d;

}

.elementor-accordion-item .elementor-tab-content p {
    text-align: justify;
}

/* Convenios */
#convenios-slider div.dt-owl-item-inner,
#convenios-slider div.dt-owl-item-wrap,
#convenios-slider div.dt-owl-item,
#convenios-slider div.dt-owl-item-inner .dt-owl-item-icon {
    overflow: visible;
}

#convenios-slider .owl-stage{
    padding-top: 50px;
}

#convenios-slider div.dt-owl-item-inner .dt-owl-item-icon svg {
    height: var(--icon-font-size);
    max-width: var(--icon-width);
    width: auto;
}

#convenios-slider div.dt-owl-item-inner:hover .dt-owl-item-icon svg {
    fill: #fcd21d;
    height: 130px;
    max-width: 170px;
    transform-origin: 50%;
}
#convenios-slider .cls-2{
    transition: all .3s ease;;
}

.elementor-headline {
    font-size: 35px;
}

#convenios-slider div.dt-owl-item-inner:hover .cls-2 {
    fill: #fcd21d;
}

/* Gallery owl slider*/
.elementor-element:hover .elementor-widget-container {
    box-shadow: none !important;
}

/* .elementor-element .owl-carousel .owl-nav .owl-prev {
    left: -50px !important;
}

.elementor-element .owl-carousel .owl-nav .owl-next {
    left: initial !important;
    right: -100px;
} */

/* Social Icons */

/* .elementor-social-icons-wrapper .elementor-grid-item{
} */

.elementor-shape-rounded .elementor-icon.elementor-social-icon {
    box-shadow: 5px 5px 10px #00000060;
    border-radius: 20%;
    width: calc(var(--icon-size, 25px) + 4 * var(--icon-padding, .5em));
}


/* Elementor widgets  */
.yellow-button {
    font-size: 23pt;
    color: #00325b;
}

/* Simple posts */

.the7-simple-widget-posts .post-content-wrapper {
    background-color: #fff;
    height: 100%;
}

.the7-simple-widget-posts .post-entry-content {
    padding: 20px;
    padding-top: 0;
}

.the7-simple-widget-posts div.entry-meta {
    margin-top: 0;
}

.the7-simple-widget-posts p.short-description {
    margin-top: 0;
}

.the7-simple-widget-posts .dt-css-grid {
    align-items: stretch;
}

/* Testimonial Carousel */
.elementor-widget-the7_testimonials_carousel, .testimonials-carousel.owl-carousel {
    height: 100%;
}
.testimonials-carousel.owl-carousel .owl-stage-outer {
    overflow: visible;
}

.testimonials-carousel.owl-carousel .owl-stage {
    transform: none !important;
}

.testimonials-carousel.owl-carousel .dt-owl-item-wrap {
    padding: 5% 7%;
    background-color: #fff;
    box-shadow: 5px 5px 6px 2px rgba(0, 0, 0, .3);
}

.testimonials-carousel.owl-carousel .dt-owl-item {
    position: absolute;
    left: 0 !important;
    transition: transform 1s ease;
}

.testimonials-carousel.owl-carousel .dt-owl-item:not(.cloned):not(.active):nth-child(even) {
    transform: rotate(7deg);
}

.testimonials-carousel.owl-carousel .dt-owl-item:not(.cloned):not(.active):nth-child(odd) {
    transform: rotate(-5deg);
}

.testimonials-carousel.owl-carousel .dt-owl-item.cloned {
    display: none;
}

.testimonials-carousel.owl-carousel .dt-owl-item.owl-animated-out {
    z-index: 90;
    transform: rotate(-2deg);
}

.testimonials-carousel.owl-carousel .dt-owl-item.active:not(.owl-animated-in) {
    z-index: 90;
    transform: rotate(-2deg);
}

.owl-carousel .photoSlide {
    animation-name: photoSlide;
}

@keyframes photoSlide {
    0% {
        z-index: 0;
        transform: translate3d(0,0,0) rotate(7deg);
    }
    50% {
        z-index: 90;
        transform: translate3d(80%,-100%,0) rotate(10deg);
    }
    100% {
        z-index: 90;
        transform: translate3d(0,0,0) rotate(-2deg);
    }
}

.owl-carousel .photoOut {
    animation-name: photoOut;
}

@keyframes photoOut {
    from{
        z-index: 90;
    }
    50% {
        z-index: 90;
    }
    to{
        z-index: 0;
    }
}

.testimonials-carousel.owl-carousel .dt-owl-item-inner div.dt-owl-item-image {
    width: 100%;
    margin-bottom: 20px;
}

/* Removing bottom buttoms from photo slider */
.btn-cntr {
    display: none !important;
}

/* Fix svg files class conflict*/
.cls-1 {
    fill: inherit !important;
    stroke: inherit !important;
}

/* Animations */
@keyframes waveRightIn {
    from {
        transform: translate3d(-350%, -10px, 0) rotate(var(--e-con-transform-rotateZ, 0));
        visibility: visible;
        background-position: 250% 0%;
        opacity: 0;
    }

    to {
        transform: translate3d(0, 0, 0) rotate(var(--e-con-transform-rotateZ, 0));
        background-position: 0% 0%;
        opacity: 1;
    }
}

.waveRightIn {
    animation-name: waveRightIn;
}

.waveRightIn.animated, .waveRightIn.animated.animated-slow {
    animation-duration: 3s;
}


@keyframes waveRightOut {
    from {
        transform: translate3d(0%, 0, 0) rotate(var(--e-con-transform-rotateZ, 0));
        visibility: visible;
        background-position: 250% 0%;
        opacity: 1;
    }

    to {
        transform: translate3d(350%, 0, 0) rotate(var(--e-con-transform-rotateZ, 0));
        background-position: 0% 0%;
        opacity: 0;
    }
}

.waveRightOut {
    animation-name: waveRightOut;
}

@keyframes waveLeftIn {
    from {
        transform: translate3d(350%, 10px, 0) rotate(var(--e-con-transform-rotateZ, 0));
        visibility: visible;
        background-position: -250% 0%;
        opacity: 0;
    }

    to {
        transform: translate3d(0, 0, 0) rotate(var(--e-con-transform-rotateZ, 0));
        background-position: 0% 0%;
        opacity: 1;
    }
}

.waveLeftIn {
    animation-name: waveLeftIn;
}

.waveLeftIn.animated, .waveLeftIn.animated.animated-slow {
    animation-duration: 3s;
}

@keyframes waveLefOut {
    from {
        transform: translate3d(0%, 0, 0) rotate(var(--e-con-transform-rotateZ, 0));
        visibility: visible;
        background-position: -250% 0%;
        opacity: 0;
    }

    to {
        transform: translate3d(350%, 0, 0) rotate(var(--e-con-transform-rotateZ, 0));
        background-position: 0% 0%;
        opacity: 1;
    }
}

.waveLefOut {
    animation-name: waveLefOut;
}

@keyframes fadeInUp2 {
    from {
        opacity: 0;
        transform: translate3d(0, 80px, 0);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

.animated.fadeInUp {
    animation-name: fadeInUp2 !important;
    -webkit-animation-fill-mode: none;
    animation-fill-mode: none;
}

@keyframes fadeInLeft2 {
    from {
        opacity: 0;
        transform: translate3d(-80px, 0, 0);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

.fadeInLeft {
    animation-name: fadeInLeft2 !important;
}

@keyframes fadeInRight2 {
    from {
        opacity: 0;
        transform: translate3d(-80px, 0, 0);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

.fadeInRight {
    animation-name: fadeInRight2 !important;
}

@keyframes bouncingStar {
    from {
        transform: scale(.95);
    }

    50% {
        transform: scale(1.3);
    }

    to {
        transform: scale(.95);
    }
}


.jumping-loop {
    animation-name: bouncingStar;
    animation-duration: 1.2s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
}

@keyframes bouncingStarLight {
    from {
        transform: scale(.97);
    }

    50% {
        transform: scale(1.2);
    }

    to {
        transform: scale(.97);
    }
}


.jumping-loop-light {
    animation-name: bouncingStarLight;
    animation-duration: 1.2s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
}



@keyframes peaceNLove {
    from {
        transform: rotate(-10deg);
    }

    50% {
        transform: rotate(5deg);
    }

    to {
        transform: rotate(-10deg);
    }
}

.peace-n-love {
    transform-origin: 50% 8 0%;
    animation-name: peaceNLove;
    animation-duration: 1.2s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
}


/* Feel free to change duration  */
.animated {
    -webkit-animation-duration: 10000 ms;
    animation-duration: 10000 ms;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

/* .owl-animated-out - only for current item */
/* This is very important class. Use z-index if you want move Out item above In item */
.owl-animated-out {
    z-index: 1
}

/* .owl-animated-in - only for upcoming item
  /* This is very important class. Use z-index if you want move In item above Out item */
.owl-animated-in {
    z-index: 0
}

/* .fadeOut is style taken from Animation.css and this is how it looks in owl.carousel.css:  */
.fadeOut {
    -webkit-animation-name: fadeOut;
    animation-name: fadeOut;
}

#menu-lateral .elementor-icon.active-item svg{
    fill: var( --e-global-color-accent );
    color: var( --e-global-color-accent );
}

@-webkit-keyframes fadeOut {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@keyframes fadeOut {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

/* Media queries */


/* Medium screen */
@media (max-width: 1024px) {
    .dt-nav-menu-horizontal > li > a .menu-item-text {
        font-size: .65rem !important;
    }
    #searchbar .elementor-headline {
        font-size: 1.63rem;
    }
}

/* Small screen */
@media (max-width: 767px) {
    #inicio .elementor-headline-dynamic-wrapper .elementor-headline-dynamic-text {
        font-size: 4.7rem;
    }
}

/* XSmall screen */
@media (max-width: 576px) {
    #inicio .elementor-headline {
        line-height: 2.2rem;
    }

    #inicio .elementor-headline .elementor-headline-plain-text {
        font-size: 1.9rem;
    }

    #inicio .elementor-headline-dynamic-wrapper .elementor-headline-dynamic-text {
        font-size: 2.8rem;
    }

    #searchbar .elementor-headline {
        font-size: .95rem;
    }
}