/*
Theme Name: Hello Elementor Child
Theme URI: https://elementor.com/hello-theme/?utm_source=wp-themes&utm_campaign=theme-uri&utm_medium=wp-dash
Template: hello-elementor
Author: Elementor Team
Author URI: https://elementor.com/?utm_source=wp-themes&utm_campaign=author-uri&utm_medium=wp-dash
Description: Hello Elementor is a lightweight and minimalist WordPress theme that was built specifically to work seamlessly with the Elementor site builder plugin. The theme is free, open-source, and designed for users who want a flexible, easy-to-use, and customizable website. The theme, which is optimized for performance, provides a solid foundation for users to build their own unique designs using the Elementor drag-and-drop site builder. Its simplicity and flexibility make it a great choice for both beginners and experienced Web Creators.
Tags: accessibility-ready,flexible-header,custom-colors,custom-menu,custom-logo,featured-images,rtl-language-support,threaded-comments,translation-ready
Version: 3.4.5.1764049513
Updated: 2025-11-25 05:45:13

*/
@import url('https://fonts.cdnfonts.com/css/segoe-ui-4');
body{
	margin:0;
	padding:0;
	box-sizing:border-box;
	font-family: 'Archivo','sans-serif';
	overflow-x:hidden;
}
p{
	margin:0;
}
a {
    color: #000;
    text-decoration: none !important;
}
.btn_green{
	background:#7CBBC0 !important;
	color:#fff !important;
	font-size:15px !important;
	font-weight:500;
	line-height:normal;
	border:1px solid #7CBBC0;
	border-radius:10px !important;
	font-family: 'Archivo','sans-serif';
	transition:all 0.3s ease-in-out;
	padding:15px 20px;
}

.btn_green:hover{
	background: #fff !important;
	color:#7CBBC0 !important;
}
.btn_white.btn_green{
	background:#fff !important;
	color:#339CCC !important;
}
.btn_white.btn_green:hover{
	color:#339CCC !important;
}
.flex_box{
	display:flex;
	gap:20px;
}
.footer_form .flex_box p{
	display:flex;
	position:relative;

}
.footer_form  .wpcf7-spinner{
	position:absolute;
	right:0;
	left:0;
	top:0;
	bottom:0;
	margin:auto;
}

.footer_form .wpcf7-email{
	background:#ffffff3b;
	outline:0;
	border:0;
	border-radius:8px;
	color:#fff !important;
	font-family:'poppins','sans-serif';
	font-size:18px;
	padding:10px 16px;
}
.footer_form .wpcf7-email::placeholder{
	color:#FFF !important;
}
.customers_slider .single-item-wrapper{
	flex-direction:column-reverse;
}
.customers_slider .tss-meta-info.tss-left{
	display:flex;
	align-items:center;
	gap:20px;
}
.customers_slider .item-content-wrapper{
	padding:10px 0 !important;
	background:transparent !important;
}
.customers_slider .item-content-wrapper:after,
.customers_slider .item-content-wrapper:before{
	display:none !important;
}
.customers_slider .swiper-pagination-bullet {
    height: 8px !important;
    width: 8px !important;
	margin:0 !important;
}
.customers_slider .swiper-pagination-bullet-active{
	background:#7CBBC0 !important;
	width:22px !important;
	border-radius:5px !important;
}
.customers_slider .swiper-pagination{
	bottom:-30px !important;
	display:flex;
	justify-content:center;
	gap:5px;
}
.customers_slider .swiper-pagination-bullet{
	background:#000000;
}
.customers_slider .swiper-pagination-bullet:hover{
	background:#7CBBC0;
}
.bullet_style ul{
	padding-left:20px !important;
}
.bullet_style ul li::marker {
    color: #339CCC !important;
    font-size: 25px !important;
}
.hov_box{
	transition:all 0.4s ease-in-out;
}
.hov_box .elementor-widget-image{
	border: 1px solid transparent;
	border-radius:50%;
}
.hov_box:hover .elementor-widget-image{
	border-color:#000000;
}
.hov_box .elementor-widget-divider--view-line{
	opacity:0;
}
.hov_box:hover .elementor-widget-divider--view-line{
	opacity:1;
}
.hov_box {
	text-decoration:none !important;
}
.before_border:before{
	content:'';
	border-top: 2px solid #339CCC;
	width:157px;
	position: absolute;
    left: 0;
    top: 0;
}
.before_border:after {
    content: '';
    border-left: 2px solid #339CCC;
    height: 157px;
    position: absolute;
    left: 0;
    top: 0;
}
.our_collections .slick-slide{
	margin-right:20px;
}

.purereef h1{
	display:flex;
	flex-flow:wrap;
	gap:10px;
}
.purereef h1 .text_animate{
	color: transparent;
	background-color:#000;
	background-image: url(https://purereef.net/wp-content/uploads/2025/11/Group-16.png);
	background-repeat: repeat-x;
	-webkit-background-clip: text;
	animation: animate 10s linear infinite;
}

@keyframes animate{
	0%{
		background-position: left 0px top -60px;
	}
	40%{
		background-position: left 800px top -60px;
	}
	80%{
		background-position: left 1800px top -60px;
	}
	100%{
		background-position: left 2400px top -60px;
	}
}
.sub-menu {
    width: 100% !important;
    top: 38px !important;
    min-width: 260px !important;
}
.sub-menu li a{
	padding-right:15px;	
	font-size:16px !important;
}
.hovIcon_box{
	transition:all 0.8s !important;
}

.hovIcon_box:hover h4,
.hovIcon_box:hover h3,
.hovIcon_box:hover .elementor-widget-text-editor{
	color:#fff !important
}
.faqs_tabs .e-n-tabs-heading{
	height:100%;
	background:#339CCC4D;
	border-radius:20px;
	padding:20px;
	gap:40px;
	flex-direction:column;
}
.faqs_tabs .e-n-tab-title{
	justify-content:space-between;
}
.faqs_tabs button[aria-selected="true"].e-n-tab-title {
	font-weight:600 !important;
}
.faqs_tabs .e-n-accordion-item{
	border-bottom: 1px solid #0000001A
}
.faqs_tabs .e-n-accordion-item:last-child{
	border-bottom:0;
}
.faqs_tabs .e-n-tabs-content{
	margin-top:-100px;
}

body {
	color: #333;
	font: 100% Lato, Arial, Sans Serif;
	height: 100vh;
	margin: 0;
	padding: 0;
	overflow-x: hidden;
}

#background-wrap {
    bottom: 0;
	left: 0;
	position: fixed;
	right: 0;
	top: 0;
	z-index: -1;
}

/* KEYFRAMES */

@-webkit-keyframes animateBubble {
    0% {
        margin-top: 1000px;
    }
    100% {
        margin-top: -100%;
    }
}

@-moz-keyframes animateBubble {
    0% {
        margin-top: 1000px;
    }
    100% {
        margin-top: -100%;
    }
}

@keyframes animateBubble {
    0% {
        margin-top: 1000px;
    }
    100% {
        margin-top: -100%;
    }
}

@-webkit-keyframes sideWays { 
    0% { 
        margin-left:0px;
    }
    100% { 
        margin-left:50px;
    }
}

@-moz-keyframes sideWays { 
    0% { 
        margin-left:0px;
    }
    100% { 
        margin-left:50px;
    }
}

@keyframes sideWays { 
    0% { 
        margin-left:0px;
    }
    100% { 
        margin-left:50px;
    }
}

/* ANIMATIONS */

.x1 {
    -webkit-animation: animateBubble 25s linear infinite, sideWays 2s ease-in-out infinite alternate;
	-moz-animation: animateBubble 25s linear infinite, sideWays 2s ease-in-out infinite alternate;
	animation: animateBubble 25s linear infinite, sideWays 2s ease-in-out infinite alternate;
	
	left: -5%;
	top: 5%;
	
	-webkit-transform: scale(0.6);
	-moz-transform: scale(0.6);
	transform: scale(0.6);
}

.x2 {
    -webkit-animation: animateBubble 20s linear infinite, sideWays 4s ease-in-out infinite alternate;
	-moz-animation: animateBubble 20s linear infinite, sideWays 4s ease-in-out infinite alternate;
	animation: animateBubble 20s linear infinite, sideWays 4s ease-in-out infinite alternate;
	
	left: 5%;
	top: 80%;
	
	-webkit-transform: scale(0.4);
	-moz-transform: scale(0.4);
	transform: scale(0.4);
}

.x3 {
    -webkit-animation: animateBubble 28s linear infinite, sideWays 2s ease-in-out infinite alternate;
	-moz-animation: animateBubble 28s linear infinite, sideWays 2s ease-in-out infinite alternate;
	animation: animateBubble 28s linear infinite, sideWays 2s ease-in-out infinite alternate;
	
	left: 10%;
	top: 40%;
	
	-webkit-transform: scale(0.7);
	-moz-transform: scale(0.7);
	transform: scale(0.7);
}

.x4 {
    -webkit-animation: animateBubble 22s linear infinite, sideWays 3s ease-in-out infinite alternate;
	-moz-animation: animateBubble 22s linear infinite, sideWays 3s ease-in-out infinite alternate;
	animation: animateBubble 22s linear infinite, sideWays 3s ease-in-out infinite alternate;
	
	left: 20%;
	top: 0;
	
	-webkit-transform: scale(0.3);
	-moz-transform: scale(0.3);
	transform: scale(0.3);
}

.x5 {
    -webkit-animation: animateBubble 29s linear infinite, sideWays 4s ease-in-out infinite alternate;
	-moz-animation: animateBubble 29s linear infinite, sideWays 4s ease-in-out infinite alternate;
	animation: animateBubble 29s linear infinite, sideWays 4s ease-in-out infinite alternate;
	
	left: 30%;
	top: 50%;
	
	-webkit-transform: scale(0.5);
	-moz-transform: scale(0.5);
	transform: scale(0.5);
}

.x6 {
    -webkit-animation: animateBubble 21s linear infinite, sideWays 2s ease-in-out infinite alternate;
	-moz-animation: animateBubble 21s linear infinite, sideWays 2s ease-in-out infinite alternate;
	animation: animateBubble 21s linear infinite, sideWays 2s ease-in-out infinite alternate;
	
	left: 50%;
	top: 0;
	
	-webkit-transform: scale(0.8);
	-moz-transform: scale(0.8);
	transform: scale(0.8);
}

.x7 {
    -webkit-animation: animateBubble 20s linear infinite, sideWays 2s ease-in-out infinite alternate;
	-moz-animation: animateBubble 20s linear infinite, sideWays 2s ease-in-out infinite alternate;
	animation: animateBubble 20s linear infinite, sideWays 2s ease-in-out infinite alternate;
	
	left: 65%;
	top: 70%;
	
	-webkit-transform: scale(0.4);
	-moz-transform: scale(0.4);
	transform: scale(0.4);
}

.x8 {
    -webkit-animation: animateBubble 22s linear infinite, sideWays 3s ease-in-out infinite alternate;
	-moz-animation: animateBubble 22s linear infinite, sideWays 3s ease-in-out infinite alternate;
	animation: animateBubble 22s linear infinite, sideWays 3s ease-in-out infinite alternate;
	
	left: 80%;
	top: 10%;
	
	-webkit-transform: scale(0.3);
	-moz-transform: scale(0.3);
	transform: scale(0.3);
}

.x9 {
    -webkit-animation: animateBubble 29s linear infinite, sideWays 4s ease-in-out infinite alternate;
	-moz-animation: animateBubble 29s linear infinite, sideWays 4s ease-in-out infinite alternate;
	animation: animateBubble 29s linear infinite, sideWays 4s ease-in-out infinite alternate;
	
	left: 90%;
	top: 50%;
	
	-webkit-transform: scale(0.6);
	-moz-transform: scale(0.6);
	transform: scale(0.6);
}

.x10 {
    -webkit-animation: animateBubble 26s linear infinite, sideWays 2s ease-in-out infinite alternate;
	-moz-animation: animateBubble 26s linear infinite, sideWays 2s ease-in-out infinite alternate;
	animation: animateBubble 26s linear infinite, sideWays 2s ease-in-out infinite alternate;
	
	left: 80%;
	top: 80%;
	
	-webkit-transform: scale(0.3);
	-moz-transform: scale(0.3);
	transform: scale(0.3);
}

/* OBJECTS */

.bubble {
    -webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	
    -webkit-box-shadow: 0 20px 30px rgba(170, 223, 227, 0.3), inset 0px 10px 30px 5px rgba(170, 223, 227, 0.2);
	-moz-box-shadow: 0 20px 30px rgba(170, 223, 227, 0.3), inset 0px 10px 30px 5px rgba(170, 223, 227, 0.2);
	box-shadow: 0 20px 30px rgba(170, 223, 227, 0.3), inset 0px 10px 30px 5px rgba(170, 223, 227, 0.2);
	
    height: 200px;
	position: absolute;
	width: 200px;
}

.bubble:after {
    background: -moz-radial-gradient(center, ellipse cover,  #fff 0%, rgba(170, 223, 227, 0.1) 70%); /* FF3.6+ */
    background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,#fff), color-stop(70%,rgba(170, 223, 227, 0.1))); /* Chrome,Safari4+ */
    background: -webkit-radial-gradient(center, ellipse cover,  #fff 0%,rgba(170, 223, 227, 0.1) 70%); /* Chrome10+,Safari5.1+ */
    background: -o-radial-gradient(center, ellipse cover,  #fff 0%,rgba(170, 223, 227, 0.1) 70%); /* Opera 12+ */
    background: -ms-radial-gradient(center, ellipse cover,  #fff 0%,rgba(170, 223, 227, 0.1) 70%); /* IE10+ */
    background: radial-gradient(ellipse at center,  #fff) 0%,#fff 70%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#AADFE3E5', endColorstr='#AADFE3E5',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	
    -webkit-box-shadow: inset 0 20px 30px rgba(170, 223, 227, 0.1)
	-moz-box-shadow: inset 0 20px 30px rgba(170, 223, 227, 0.1)
	box-shadow: inset 0 20px 30px rgba(170, 223, 227, 0.1)
	
	content: "";
    height: 180px;
	left: 10px;
	position: absolute;
	width: 180px;
}
.our_collections .e-gallery-image{
	 min-height:420px;
}
.sub-menu{
	background: linear-gradient(90deg, #0D60B5 0%, #5ADAE4 100%);

}
.sub-menu li a{
	padding-right:15px !important;
}
.blur{
	backdrop-filter: blur(10px);
}

@media (max-width: 1440px){
	@keyframes animate{
		0%{
			background-position: left 0px top -80px;
		}
		40%{
			background-position: left 800px top -80px;
		}
		80%{
			background-position: left 1800px top -80px;
		}
		100%{
			background-position: left 2400px top -80px;
		}
	}
}
@media (min-width: 1175px)  and (max-width: 1338px) {
	.purereef h1{
		font-size:110px !important;
	}
}
@media (min-width: 1025px)  and (max-width: 1174px) {
	.purereef h1{
		font-size:100px !important;
	}
	header ul.hfe-nav-menu > li a{
		font-size:17px !important;
	}
	header ul.hfe-nav-menu > li{
		margin-right:12px !important;
	}
	
}

@media (max-width: 1024px){
	.position{
		position:inherit !important;
	}
	.sub-menu {
		top: 0 !important;
		min-width: 100% !important;
	}
	.faqs_tabs .e-n-tabs-content{
		margin-top:0;
	}
	.faqs_tabs .e-n-tabs-heading{
		gap:20px;
	}
	nav.hfe-dropdown{
		background: linear-gradient(90deg, #0D60B5 0%, #5ADAE4 100%);

	}
}
@media only screen and (max-width: 767px) {
	.flex_box{
		flex-flow:wrap;
	}
	.faqs_tabs .e-n-tabs-heading{
		background:#7CBBC04D !important;
		border-radius:20px;
		padding:15px;
	}
	.h_svg svg{
		height: auto !important;
        width: auto !important;
	}
	.bullet_style strong{
		font-size:18px !important;
	}
}
@media only screen and (max-width: 500px) {
	.our_collections .slick-slide{
		margin-right:0;
	}
}