/*
 Theme Name:   DK Starter
 Theme URI:    https://generatepress.com
 Description:  DK John Digital (GeneratePress child theme)
 Author:       DK John
 Author URI:   https://dkjohn.com
 Template:     generatepress
 Version:      0.1
*/


/* Root values */
:root {
	--px-40: 40px;
	--px-24: 24px;
}


/* Set the main content area to a minimum of 65vh */
#main {
    min-height: 65vh;
  }
  
  
  /* Site Wrapper to set overall site max width */
  .site-wrapper {
    width: 100%;
    max-width: 1920px;
  } 
  
  
  
  /* HELPER CLASSES */
  
  
	
/* __container X padding class */
.con-px {
	padding-left: var(--px-40);
    padding-right: var(--px-40);
}

@media screen and (max-width: 768px) {
    .con-px {
        padding-left: var(--px-24);
        padding-right: var(--px-24);
    }
}


  /* Margin Auto */
  
  .margin-auto{
    margin: auto;
  }


  
/* Slider animation */
/* Classes:  slide-animation, slider-wrapper (for softer)*/
@keyframes slide {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(calc(-100%));
  }
}


.slide-animation {
  animation: 22s slide infinite linear;
}


/* __Slider both side softer */

.slider-wrapper::before, .slider-wrapper::after {
    content: "";
    display: block;
    position: absolute;
    width: 120px;
    height: 100%;
    top: -3px;
    z-index: 99;
    filter: blur(5px);
}

.slider-wrapper::before {
    left: -15px;
    background: linear-gradient(to right, #429afb00,  #3f97fb 10%, #5babf800);
}

.slider-wrapper::after {
    right: -12px;
    background: linear-gradient(to left,  #429afb00,  #3f97fb 1%, #5babf800);
}

@media screen and (max-width: 768px) {
   .slider-wrapper::before, .slider-wrapper::after {
       width: 60px;
   }
}

/* End Slider animation */