/*
  Theme Name: agronaytes
  Theme URI: https://www.agronaytes.gr/
  Version: 1.0.0
  Template: Divi
  Author: agronaytes.gr
  Author URI: https://www.agronaytes.gr/
  Description: agronaytes DIVI Child Theme
  Text Domain: agronaytes
  License: GNU General Public License v2 or later
  License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/


/* Jiggle CSS */

.jiggle {
    animation: jiggly 4s ease-in-out infinite;
  }
  
  @keyframes jiggly {
    0% { transform: rotate(0deg);}
    2% { transform: rotate(3deg);}
    4% { transform: rotate(-3deg);}
    6% { transform: rotate(3deg);}
    8% { transform: rotate(0deg);}
	12% { transform: rotate(-12deg);}
    100% { transform: rotate(0deg);}
    
  }

/* Middle Underline */
 .mlineWt::after {
    content:"";
    position:absolute;
    bottom:0;
    left:50%;
    transform:translate(-50%);
    width:0;
    height:3px;
    background-color: #fff;
    transition:width 0.7s ease;
    animation:growU 15s infinite;
  }

.mlineDk::after {
    content:"";
    position:absolute;
    bottom:0;
    left:50%;
    transform:translate(-50%);
    width:0;
    height:3px;
    background-color: #bea50d;
    transition:width 0.7s ease;
    animation:growL 15s infinite;
  }
  
  @keyframes growU{
  0%, 25% {width:0}
  50%, 75% {width:100%}
}
  
  @keyframes growL{
  0%, 25% {width:0}
  50%, 75% {width:100%}
}



/* Rotate Logo */
.et_pb_menu__logo-wrap{
 animation: RotateLogo 3s ease-out;
}

@keyframes RotateLogo {
 from {
  transform: rotateX(360deg);
  opacity: 0;
 }
 to {
  transform: rotateX(0);
  opacity: 1;
 }
}

/* Custom Video Popup */
/* Popup Close Icon Tweak */
.mfp-wrap.mfp-close-btn-in.mfp-auto-cursor.mfp-fade.mfp-ready {
	top: 0px !important;
	position: fixed !important;
}
.mfp-iframe-holder .mfp-content {
    max-width: 70%;
}
.mfp-iframe-scaler button.mfp-close {
    top: -50px ;
}

.mfp-iframe-holder .mfp-close,
.mfp-image-holder .mfp-close,
.mfp-wrap .mfp-close:active {
    top: -50px !important;
}

.video_popup_lightbox .mfp-iframe-holder .mfp-close {
    top: -50px;
}

.video_popup {
    position: relative;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}

.video_popup a:before {
    content: 'play';
    cursor: pointer;
    position: absolute;
    top: calc(50% - 55px);
    left: calc(50% - 54.5px);
    z-index: 20;
    background-color: #fff;
    padding: 55px 27px;
    border-radius: 50%;
    font-size: 20px;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: #0a2a3b;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.video_popup a:after {
    content: 'E';
    cursor: pointer;
    font-family: 'ETmodules';
    position: absolute;
    top: calc(50% - 55px);
    left: calc(50% - 47px);
    z-index: 20;
    background-color: #fff;
    padding: 55px 27px;
    border-radius: 50%;
    font-size: 40px;
    text-transform: uppercase;
    color: #0a2a3b;
    opacity: 0;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.video_popup.no_icon:before,
.video_popup.no_icon:after {
    display: none!important;
}

.video_popup:not(.no_icon):hover {
    -webkit-transform: scale(0.95);
    -ms-transform: scale(0.95);
    transform: scale(0.95);
}

.video_popup:hover a:before {
    opacity: 0;
    padding: 65px 37px;
    left: calc(50% - 64.5px);
    top: calc(50% - 65px);
}

.video_popup:hover a:after {
    opacity: 1;
    padding: 65px 37px;
    left: calc(50% - 64.5px);
    top: calc(50% - 65px);
    font-size: 56.5px;
}

@media all and (max-width: 980px) {
    .video_popup a:before {
        top: calc(50% - 32.5px);
        left: calc(50% - 33px);
        padding: 33px 17px;
        font-size: 10px;
    }
    .video_popup a:after {
        top: calc(50% - 32.5px);
        left: calc(50% - 33px);
        padding: 33px 17px;
        font-size: 32px;
    }
    .video_popup:hover a:before {
        opacity: 0;
        padding: 40px 22px;
        left: calc(50% - 43px);
        top: calc(50% - 42.5px);
    }
    .video_popup:hover a:after {
        opacity: 1;
        padding: 40px 22px;
        left: calc(50% - 43px);
        top: calc(50% - 42.5px);
        font-size: 42px;
    }
}

.spin_icon {
  animation: icospin 6s infinite linear
}

@keyframes icospin {
  0% {transform: rotateY(0)}
  50% {transform: rotateY(180deg)}
  100% {transform: rotateY(0)}
}

.spin_icon:hover {
  animation:none
}