
/* KD SLIDER */
/*
Theme Name: CAC Nepal Education Consultancy Pvt. Ltd.		
Theme URI:https://www.cacnepal.com.np/
Description: full responsive website!
Tags:responsive, bootstrap, CAC Nepal CMSMS theme.
Copyright: CAC Nepal Education Consultancy - 2024 : All Rights Reserved.
*/

/* KD SLIDER */


.kd-slider {
	position: relative;
	width: 100%;
	height: 100vh;
	overflow: hidden;
	z-index:0;
}
.kd-slider.ie9 nav div span {
	display: none;
}

.kd-slider ul li {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	visibility: hidden;
	transition: visibility 0s .6s;
}

.kd-slider ul li::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	border-radius: 100%;
	width: 135vh;
	height: 135vh;
	border: solid rgba(0,0,0,0.2);
	border-width: 0;
	transform: translate(-50%, -50%);
	pointer-events: none;
	transition: border-width .4s .6s;
}

.kd-slider .content {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-position: 50% 100%;
	background-size: auto 100%;
	background-repeat: no-repeat;
	/*mix-blend-mode: lighten;
    filter: brightness(110%);*/
	opacity: 0;
	transform: scale(1.2);
	transition: opacity .4s .6s, transform .4s .6s;
}

.kd-slider .content .text {
	position: absolute;
	bottom: 20%;
	left: 10%;
	z-index: 2;
	max-width: 50%;
}

.kd-slider .text h4 {
	font-size: 75px;
	font-weight:900;
	line-height:65px;
    font-family: 'Cinzel', serif;
	color: var(--white);
	-webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}


.kd-slider .text h5{
	font-size: 24px;
	font-weight:400;
	line-height:24px;
	font-family: 'Cinzel', serif;
    margin-bottom: 20px; 
	color: var(--white);
	-webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}



@media (max-width: 1023.99px) {

    .kd-slider .content .text {
	position: absolute;
	bottom: 20%;
	left: 10%;
	z-index: 2;
	max-width: 80%;
}

	
  .kd-slider .text h4 {
	font-size: 50px;
	line-height:45px;
}

.kd-slider .text h5{
	font-size: 20px;
	line-height:20px;
}  	
		
}

@media only screen and (max-width:767px){
    
    .kd-slider .content .text {
	position: absolute;
	bottom: 20%;
	left: 10%;
	z-index: 2;
	max-width: 80%;
}
    
  .kd-slider .text h4 {
	font-size: 40px;
	line-height:50px;
}

.kd-slider .text h5{
	font-size: 20px;
	line-height:20px;
}  
    
}




.kd-slider .text p {
	font-size: 16px;
	font-family: 'Poppins', sans-serif;
	color:#ffffff;
}


.kd-slider .text .becteam-right a{
  font-family: 'Oswald', sans-serif;
  letter-spacing:0.7px;
  text-align:center;
  text-transform:uppercase;
  border-radius:0px;
-ms-border-radius:0px;
 -webkit-border-radius:0px;
 -moz-border-radius:0px;
 -o-border-radius:0px;
  transition: all 1.0s ease, padding 2.8s linear;
	-ms-transition: all 1.0s ease, padding 2.8s linear;
	-webkit-transition: all 1.0s ease, padding 2.8s linear;
	-moz-transition: all 1.0s ease, padding 2.8s linear;
	-o-transition: all 1.0s ease, padding 2.8s linear;
	font-size:14px;
	padding: 10px 20px;
	margin-right:1px;
	margin-bottom:10px;
	float:left;
}

.kd-slider .text .becteam-right a:focus, 
.kd-slider .text .becteam-right a:active,
.kd-slider .text .becteam-right a:hover{
	  color: #ffffff !important; 	
}

/* current slide
---------------------------------*/
.kd-slider li.current_slide {
	visibility: visible;
}
.kd-slider li.current_slide::before {
	border-width: 16rem;
}
.kd-slider li.current_slide .content {
	opacity: 1;
	transform: scale(1);
}
/* nav
---------------------------------*/
.kd-slider nav div {
	position: absolute;
	top: 50%;
	left: 4%;
	width: 40px;
	height: 40px;
	margin-top: -20px;
	list-style: none;
}

.kd-slider nav div:last-of-type {
	left: auto;
	right: 4%;
}
.kd-slider .prev, .next {
	position: relative;
	z-index: 100;
	width: 100%;
	height: 100%;
	display: block;
	border-radius: 100%;
	transition: box-shadow .3s;
}
.kd-slider .prev::before, .prev::after, .next::before, .next::after {
	content: '';
	position: absolute;
	left: 43%;
	background: #ffffff;
	width:3px;
	min-width: 3px;
	border-radius: 10px;
	height: 34%;
}
.kd-slider .prev::before {
	transform: rotate(45deg);
	top: 24%;
}
.kd-slider .prev::after {
	transform: rotate(-45deg);
	bottom: 24%;
}
.kd-slider .next::before, .next::after {
	left: auto;
	right: 43%;
}
.kd-slider .next::before {
	transform: rotate(-45deg);
	top: 24%;
}
.kd-slider .next::after {
	transform: rotate(45deg);
	bottom: 24%;
}
.kd-slider .prev:hover, .next:hover {
	box-shadow: 0 0 0 1rem rgba(0, 0, 0, 0.15);
}
.kd-slider nav > div > span {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 0;
	height: 0;
	border-radius: 100%;
	z-index: 5;
	pointer-events: none;
	will-change: width, height;
	transform: translate(-50%, -50%);
	transition: width .6s, height .6s;
}
