/*
Theme Name: OceanWP Child Theme
Theme URI: https://oceanwp.org/
Description: OceanWP WordPress theme. Sample child theme.
Author: OceanWP
Author URI: https://oceanwp.org/
Template: oceanwp
Version: 1.0
*/

/* Parent stylesheet should be loaded from functions.php not using @import */
::-webkit-scrollbar
{
 width: 8px;
}


/* Track */
::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px grey; 
  border-radius: 0px;
            background-color: #fff;
            border: 1px solid #cacaca;
}
 
/* Handle */
::-webkit-scrollbar-thumb {
  border-radius: 8px;
  background-color: #00adef;
  background-image: linear-gradient(90deg, #2D6A97 0%, #2D6A97 100%);
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #2D6A97; 
}
a:hover, a:focus{
	outline:0!important;
}
p:last-child
{
	margin-bottom:0;
}
.elementor-column-gap-default>.elementor-column>.elementor-element-populated
{
	padding:0 10px;
}
.ekit-wid-con .ekit_sidebar-textwidget
{
	padding-top:15px !important;
}
.home .header-1
{
	position:absolute;
	width:100%;
	z-index:5;
	background:transparent !important;
}
.bdt-prime-slider-skin-general .bdt-prime-slider-desc
{
	margin-top:80px !important;
}
.head_1 .elementor-widget-container
{
	    position: absolute;
    width: 40px;
    height: 40px;
    text-align: center;
    background: #830c2f;
    border-radius: 100%;
    display: inline-block;
    left: -34px;
    top: -39px;
}
.head_1 .elementor-widget-container h2
{
	font-size:18px;
	color:#fff;
	line-height:40px;
}
.circle_1
{
	
    text-align: center;
}
.circle_1 .elementor-widget-container
{
	      width: 185px;
    height: 185px;
    margin: 0% auto;
}
.circle_1 .elementor-widget-container h2
{
	position: absolute;
    text-align: center;
    line-height: 172px;
    width: 185px;
    font-size: 50px;
    color: #830c2f;
}
.circle_1 .elementor-widget-container svg
{
	padding-top:0px;
}
.rotate .e-text-path
{
	    animation: rotation 20s infinite linear;
}
@keyframes rotation
{
	0% {
    -webkit-transform: rotate(0deg);
}
	100% {
    -webkit-transform: rotate(359deg);
}
}
.elementor-section .elementor-container
{
/* 	z-index:2; */
}
.elementor-element-7dfe8d2
{
	    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
}
.elementor-element-7dfe8d2 .elementor-container
{
	 z-index: 1;
}
.elementor-element-7dfe8d2 .elementor-container, .elementor-element-7dfe8d2 .elementor-widget-wrap, .elementor-element-7dfe8d2 .elementor-widget-html
{
	height:100%
}
.elementor-element-7dfe8d2 .line
{
	    width: 1px;
    height: 100%;
    background: #ffffff21;
   
    position: absolute;
}
.elementor-element-7dfe8d2 .line2
{
	margin-left:25%;
}
.elementor-element-7dfe8d2 .line3
{
	margin-left:50%;
}
.elementor-element-7dfe8d2 .line4
{
	margin-left:75%;
}
.elementor-widget-video .elementor-wrapper video
{
border-radius: 15% 15% 0 0;	
}


/* NEW CSS */
.bx-event:hover .icn-servcie1 .elementor-widget-container .elementor-icon {
    color: #fff !important;
    fill: #fff !important;
}


.bx-event:hover .icn-servcie1 .elementor-widget-container .elementor-icon-box-title,
.bx-event:hover .icn-servcie1 .elementor-widget-container .elementor-icon-box-description {
    color: #fff;
}
/* =========================================================
   EVENT CARD
   ========================================================= */

.bx-event {
    position: relative;
    overflow: hidden;
    border-radius: 20px;
}


/* =========================================================
   IMAGE FRAME
   Same concept as:
   .service-block-style3 .inner-block .image
   ========================================================= */

.bx-event .image-frame {
    position: relative;

    width: 100%;

    overflow: hidden;

    border-radius: 20px;

    line-height: 0;
}


/* =========================================================
   BOTH ELEMENTOR IMAGE WIDGETS
   Remove Elementor spacing
   ========================================================= */

.bx-event .image-frame .img-eve1,
.bx-event .image-frame .img-eve2 {
    width: 100%;

    margin: 0 !important;
    padding: 0 !important;

    border-radius: 20px;

    overflow: hidden;

    line-height: 0;
}


/* =========================================================
   IMAGE 1
   ---------------------------------------------------------
   IMAGE 1 IS VISIBLE INITIALLY
   This is the "second image" behavior from reference site.
   ========================================================= */

.bx-event .image-frame .img-eve1 {
    position: relative;

    width: 100%;

    z-index: 2;
}


/* Elementor container */

.bx-event .image-frame .img-eve1 > .elementor-widget-container {
    position: relative;

    width: 100%;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden;

    border-radius: 20px;

    line-height: 0;
}


/* Image 1 */

.bx-event .image-frame .img-eve1 img {
    position: relative;

    display: block;

    width: 100%;
    height: auto;

    min-height: 232px;

    margin: 0 !important;
    padding: 0 !important;

    object-fit: cover;

    border-radius: 20px;

    z-index: 2;

    /*
     * VISIBLE INITIALLY
     */
    transform: translateX(0) scaleX(1);

    opacity: 1;

    filter: blur(0);

    transition: all 500ms ease;
}


/* =========================================================
   IMAGE 2
   ---------------------------------------------------------
   IMAGE 2 IS ABSOLUTE
   Same as reference site's FIRST image.
   ========================================================= */

.bx-event .image-frame .img-eve2 {
    position: absolute;

    left: 0;
    top: 0;
    right: 0;
    bottom: 0;

    width: 100%;
    height: 100%;

    margin: 0 !important;
    padding: 0 !important;

    z-index: 1;

    overflow: hidden;

    border-radius: 20px;
}


/* Elementor container */

.bx-event .image-frame .img-eve2 > .elementor-widget-container {
    position: absolute;

    left: 0;
    top: 0;

    width: 100%;
    height: 100%;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden;

    border-radius: 20px;

    line-height: 0;
}


/* Image 2 */

.bx-event .image-frame .img-eve2 img {
    position: absolute;

    left: 0;
    top: 0;

    width: 100%;
    height: 100%;

    max-width: none;

    display: block;

    margin: 0 !important;
    padding: 0 !important;

    object-fit: cover;
    object-position: center;

    border-radius: 20px;

    z-index: 1;

    /*
     * HIDDEN INITIALLY
     * Same as reference site's first image
     */
    transform: translateX(50%) scaleX(2);

    opacity: 0;

    filter: blur(10px);

    transition: all 500ms ease;
}


/* =========================================================
   HOVER
   ---------------------------------------------------------
   IMAGE 1 DISAPPEARS
   Exactly like reference site's:
   
   img:nth-child(2) {
       transform: translateX(-50%) scaleX(2);
       opacity: 0;
       filter: blur(10px);
   }
   ========================================================= */

.bx-event:hover .image-frame .img-eve1 img {
    transform: translateX(-50%) scaleX(2);

    opacity: 0;

    filter: blur(10px);
}


/* =========================================================
   HOVER
   ---------------------------------------------------------
   IMAGE 2 APPEARS
   Exactly like reference site's:
   
   img:first-child {
       transform: translateX(0) scaleX(1);
       opacity: 1;
       filter: blur(0);
   }
   ========================================================= */

.bx-event:hover .image-frame .img-eve2 img {
    transform: translateX(0) scaleX(1);

    opacity: 1;

    filter: blur(0);
}


/* =========================================================
   HARD CLIPPING
   ---------------------------------------------------------
   The FRAME stays fixed.
   The transformed image gets clipped inside it.
   ========================================================= */

.bx-event .image-frame,
.bx-event .image-frame .img-eve1,
.bx-event .image-frame .img-eve2,
.bx-event .image-frame .elementor-widget-container {
    overflow: hidden;
}


/* =========================================================
   ROUNDED CORNERS
   ========================================================= */

.bx-event .image-frame,
.bx-event .image-frame img,
.bx-event .image-frame .elementor-widget-container {
    border-radius: 20px;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {

    .bx-event .image-frame .img-eve1 img,
    .bx-event .image-frame .img-eve2 img {
        transition: all 500ms ease;
    }

}
.bx-event:hover .btn-01 .qodef-qi-button {
    color: #fff !important;
}
.features-item1 .elementor-widget-wrap {

 
    transition: all .5s ease;
}
.features-item1 .elementor-widget-wrap:hover {
    transform: translateY(-5px);
}
.features-item .elementor-widget-wrap {
    backdrop-filter: blur(5px);
    --webkit-backdrop-filter: blur(5px);
 
  }
.image-anime1 .elementor-widget-container {
    position: relative;
    overflow: hidden;
}
.image-anime1 .elementor-widget-container:after {
    content: "";
    position: absolute;
    width: 200%;
    height: 0%;
    left: 50%;
    top: 50%;
    background-color: rgba(255, 255, 255, .3);
    transform: translate(-50%, -50%) rotate(-45deg);
    z-index: 1;
}
.image-anime1 .elementor-widget-container:hover:after {
    height: 250%;
    transition: all 600ms linear;
    background-color: transparent;
}