/* Add your own CSS code here */
.acc-parent-item .acc-item {
    flex: 1 !important;
}
.acc-item {
    flex: 1;
    transition: all 0.8s ease;
}
.acc-item:hover {
    flex: 8 !important;
	transition: 0.8s ease-in-out;
}
.acc-item .straightheader{
	opacity:0;
	transition: 0.5s ease-in-out;
}
.acc-item:hover .straightheader{
	opacity:1;
}
.acc-item:hover .rotateheader{
	opacity:0;
}
.straightheader{
	white-space: nowrap;
}
.rotateheader{
	white-space: nowrap;
}
.main-header{
	white-space: nowrap;
}
.main-intro-para{
	white-space: nowrap;
}

/*For slider with changing background*/
/*For first Column*/
.column-1 .learn-btn-1{
    margin-bottom: -40px;
    transition: all 0.3s ease
}
.column-1:hover .learn-btn-1{
    margin-bottom: 20px;
}
.column-1{
    overflow: hidden;
}
.column-1 .elementor-image-box-description{
    transition: all 0.5s ease;
     opacity: 0;
}
.column-1:hover .elementor-image-box-description{
 opacity: 1;
}
.column-1 .img-box-1{
    overflow: hidden;
    transition: all 0.3s ease;
    max-height: 50px
}
.column-1:hover .img-box-1{
     height: auto;
     max-height: 250px;
}
/*Second Column*/
.column-2 .learn-btn-1{
    margin-bottom: -40px;
    transition: all 0.3s ease
}
.column-2:hover .learn-btn-1{
    margin-bottom: 20px;
}
.column-2{
    overflow: hidden;
}
.column-2 .elementor-image-box-description{
    transition: all 0.5s ease;
     opacity: 0;
}
.column-2:hover .elementor-image-box-description{
 opacity: 1;
}
.column-2 .img-box-1{
    overflow: hidden;
    transition: all 0.3s ease;
    max-height: 50px
}
.column-2:hover .img-box-1{
     height: auto;
     max-height: 250px;
}
/*Third Column*/
.column-3 .learn-btn-1{
    margin-bottom: -40px;
    transition: all 0.3s ease
}
.column-3:hover .learn-btn-1{
    margin-bottom: 20px;
}
.column-3{
    overflow: hidden;
}
.column-3 .elementor-image-box-description{
    transition: all 0.5s ease;
     opacity: 0;
}
.column-3:hover .elementor-image-box-description{
 opacity: 1;
}
.column-3 .img-box-1{
    overflow: hidden;
    transition: all 0.3s ease;
    max-height: 50px
}
.column-3:hover .img-box-1{
     height: auto;
     max-height: 250px;
}

/*Forth Column*/
.column-4 .learn-btn-1{
    margin-bottom: -40px;
    transition: all 0.3s ease
}
.column-4:hover .learn-btn-1{
    margin-bottom: 20px;
}
.column-4{
    overflow: hidden;
}
.column-4 .elementor-image-box-description{
    transition: all 0.5s ease;
     opacity: 0;
}
.column-4:hover .elementor-image-box-description{
 opacity: 1;
}
.column-4 .img-box-1{
    overflow: hidden;
    transition: all 0.3s ease;
    max-height: 50px
}
.column-4:hover .img-box-1{
     height: auto;
     max-height: 250px;
}