/* first carousel */
#slider .slider-img {
	height: 250px;	
}
 
   /* seconde carousel */
    .slider-body{
        position: relative;
    }
     
    .slider-item{
        color: #fff;
        transform: scale(0.8);
        transition: opacity 0.4s, transform 0.4s;
     }
     .slider-img-body{
     	background: #1f232a;
     }
    .slider-img{ 
        object-fit: contain;
        transition: opacity 0.5s ease;  
     }
     #slider2 .slider-img {
	height: 150px;	
}
    .show {
        opacity: 1;
    }
    .slider-info{ 
        background-color: #1f232a;
        text-align: center;
    }
    .owl-item.active.center .slider-item{
        opacity: 1 ;
        transform: scale(1);
    } 
    .slider-title{
        display: flex; 
        align-items: start;
        justify-content: start;
        color: #18ba60;
     }  
    .slider-price{ 
        display: flex;
        float: right;
        align-items: center;
        justify-content: start;
        color: #18ba60;
    }
    .slider-description{
        font-size: 11px;
        padding:5px 5px;
        text-overflow: ellipsis;
   		text-overflow: ellipsis;
		overflow: hidden; 
		height: 54px;
		display: flex;
		text-align: start;
		margin:0px;
     }
    .slider-link-body{
        padding: 5px 0 15px;
    }
    .slider-link{
        position: relative;
        text-decoration: none;
        padding: 5px 15px;
        font-size: 14px;
        font-weight: bold;
        color: #18ba60;
        letter-spacing: 6px;
        background-color:transparent;
        transition: background-color 0.4s;
        transition-delay: 0.5s;
    }
    .slider-link::before{
        top:0px;
        content: "";
        left:0px;
        position: absolute;
        border: 2px solid #18ba60;
        border-right: none;
        height: 100%;
    }
    .slider-link::after{
        top:0px;
        content: "";
        position: absolute;
        right:9px;
        border: 2px solid #18ba60;
        border-left: none;
        height: 100%;
    }
    .slider-link::before,
    .slider-link::after{
        width: 10%;
        transition: 0.4s;
    }
    .slider-link:hover{
    	color: #18ba60;
        background-color: #fff;
        text-decoration: none;
    }
    .slider-link:hover::before,
    .slider-link:hover::after{
        width: 51%;
    }
    .slider-arrows{
        position: absolute;
        width: 100%;
        height: 100%;
    }
    .arrow{
        position: absolute;
        top: 37%;
        cursor: pointer;
        transform: translateY(-50%);
        width: 50px;
        height: 50px;
        border-radius: 10px;
        background-color: #18ba60;
        z-index: 3;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: background-color 0.4s;
    }
    .arrow-left{
        left: 0px;
    }
    .arrow-right{
        right:  0px;
    }
    .arrow-left::before{
        content: "";
        position: absolute;
        transform: translate(0px, -1.5px) rotateZ(40deg);
        transform-origin: left;
        width: 50%;
        height:5px;
        display: block;
        border-radius: 10px;
        background-color: #fff;
        transition: background-color 0.4s ;
    }
    .arrow-left::after{
        content: "";
        position: absolute;
        transform: translate(0px, 1.5px) rotateZ(-40deg);
        transform-origin: left;
        width: 50%;
        height:5px;
        display: block;
        border-radius: 10px;
        background-color: #fff;
        transition: background-color 0.4s ;
    }
    .arrow-right::before{
        content: "";
        position: absolute;
        transform: translate(0px,  1.5px) rotateZ(40deg);
        transform-origin: right;
        width: 50%;
        height:5px;
        display: block;
        border-radius: 10px;
        background-color: #fff;
        transition: background-color 0.4s ;
    }
    .arrow-right::after{
        content: "";
        position: absolute;
        transform: translate(0px, -1.5px) rotateZ(320deg);
        transform-origin: right;
        width: 50%;
        height:5px;
        display: block;
        border-radius: 10px;
        background-color: #fff;
        transition: background-color 0.4s ;
    }
    .arrow:hover{
        background-color: #fff;
    }
    .arrow:hover::before{
        background-color: #18ba60;
    }
    .arrow:hover::after{
        background-color: #18ba60;
    }
    @media (min-width:1650px) {
        .slider-img-body{
            height: auto;
        } 
        .img-box{
        	height:900px
        }
    }
    @media (max-width:750px) {
        .slider-img-body{
            height: auto;
        } 
         
       
    }