.title_hybrid{
    background-color: rgba(35,182,234, 0.5);padding: 20px; width: fit-content;color: white;
}




.image-container {
	background-image: url('/assets/img/IMG_4779.JPG');
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	position: relative;
	padding: 290px 0px;
	width: 100%;
   }
   
  .overlaay {
	transition: 2s;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	position:absolute;
	content:"";
 
	height:100%;
	width:100%;
	
background: linear-gradient(to right,#2597bf,#A8D5E2 );
 	display: none;
	justify-content: center;
	align-items: center;
	opacity: 0.9;
   }
  
  .textt {
	color: white !important; /* Set text color */
	font-size: 22px; /* Set text size */
	margin: 8%;
	z-index: 2222;
	opacity: 1 !important;
  }
  .image-container:hover h2{
opacity: 0;  }
  .image-container:hover .overlaay {	transition: 2s;

	display: flex;
  }
  
  .video-sectione {
	background: url('/assets/img/strec.jfif') no-repeat fixed center ;
	background-size: cover;
	overflow: hidden;
}
 
 
.video-overlaye {
    padding: 10px;
	background: linear-gradient(to left, rgba(9, 30, 62, .8), rgba(9, 30, 62, .8));
}


  
 
.box{
    width: 100%;
    height: fit-content;
    color: #fff;
    background: linear-gradient(#2597bf, #2597bf, #A8D5E2, #A8D5E2);
    
    font-family: 'Amaranth', sans-serif;
    text-align: center;
    overflow: hidden;
    position: relative;
    transition: all 0.4s ease-in-out;
}
.box img{
    width: 100%;
    height: auto;
    transition: all 0.3s ease-in-out;
}
.box:hover img{ 
   opacity: 0.1;
    filter: grayscale(100%);
}
.box-content{
    width: 100%;
    opacity: 0;
    transform: translateX(-50%) translateY(-50%);
    position: absolute;
    top: 150%;
    left: 50%;
    z-index: 1;
    transition: all 300ms 0ms cubic-bezier(0.6, -0.28, 0.735, 0.045);
}
.box:hover .box-content{ 
    top: 50%;
    opacity: 1; 
    transition: all 500ms 100ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.box .title{
    font-size: 22px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 1px;
    text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
}
.box .post{
    font-size: 14px;
    font-weight: 500;
    font-style: italic;
    text-transform: capitalize;
    letter-spacing: 1px;
    margin: 0 0 12px;
    display: block;
}
.box .icon{
    padding: 0;
    margin: 0;
    list-style: none;
}
.box .icon li{
    margin: 0 3px;
    display: inline-block;
}
.box .icon li a{
    color: #fff;
    font-size: 15px;
    line-height: 31px;
    width: 33px;
    height: 33px;
    border: 1px solid #fff;
    display: block;
    transition: all 0.35s;
}
.box .icon li a:hover{
    color: #054c05;
    background: #fff;
    text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.3);
    border-radius: 50px;
}
@media only screen and (min-width: 900px) {
  .ff {
    margin-top: 12% !important;
  }
}
@media only screen and (max-width:990px){
 	.ff{margin-top: 0%;}
}
@media only screen and (max-width:990px){
    .box{ margin: 0 0 30px; }
	.ff{margin-top: 0% !important;}
}
@media (min-width:0px) and (max-width: 900px) {
	.textt {
 
		font-size: 18px;
 
	   }
}
.image-container:hover .title_hybrid{
   opacity:  0 !important;
}