@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

html
{
	scroll-behavior: smooth;
}
body
{
	margin: 0;
	padding: 0;
	overflow-x: hidden;
	font-family: Poppins;
	background: #F2EDDA 0% 0% no-repeat padding-box!important;
}
header, 
header .navbar
{
	background: none;
	z-index: 9;
}
a:hover
{
	text-decoration: none!important;
	color: #3498FF;
}
button:focus, button:active
{
	outline: none!important
}

header .navbar .navbar-nav .nav-item .nav-link
{
	text-align: left;
	font: normal normal normal 20px/30px Poppins;
	letter-spacing: 0px;
	color: #FFFFFF;
	opacity: 1;
	padding-right: 1rem;
	padding-left: 1rem;
}
header .navbar .navbar-nav .nav-item .nav-link.active,
header .navbar .navbar-nav .nav-item .nav-link:hover
{
	color: #3498FE;
}

#banner
{
	width: 100%;
	float: left;
	height: 100vh;
	background-image: url(../img/banner.png);
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	/*margin-top: -160px;*/
	position: relative;
	animation: gradient 20s ease infinite;
	overflow: hidden;
	transition: 1s;
}
#banner .container
{
	position: relative;
	height: 100%;
}
#banner:hover
{
	/*background-position:bottom ;
	transition: 1s;*/
}
/*@keyframes gradient {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}*/
#banner .banner-text
{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	text-align: left;
	width: 100%;
	padding-left: 15px;
}
#banner .banner-text h1
{
	text-align: left;
	font: normal normal 500 48px/72px Poppins;
	letter-spacing: 0px;
	color: #FFFFFF;
	text-transform: uppercase;
	opacity: 1;
	margin-bottom: 20px;
}
#banner .banner-text a
{
	text-align: center;
	font: normal normal normal 20px/30px Poppins;
	letter-spacing: 0px;
	color: #000000;
	opacity: 1;
	background: #FFFFFF 0% 0% no-repeat padding-box;
	box-shadow: 0px 3px 6px #00000029;
	border-radius: 28px;
	width: 310px;
	display: inline-block;
	padding: 8px;
}
#banner .banner-text a:hover
{
	background: #3498FF 0% 0% no-repeat padding-box;
	color: #fff;
}

.home-2
{
	float: left;
	width: 100%;
}
.home-2 .helping-img
{
	position: absolute;
  top: 5%;
  left: 45%;
  transform: translate(-50%, 0px);
  transition: 1s;
  opacity: 0;
}
.home-2:hover .helping-img
{
	opacity: 1;
	transition: 1s;
	top: 15%;
}
.home-2 .text-block
{
	padding-right: 70px;
}
.home-2 .text-block h2, .text-block  h2
{
	text-align: left;
	font: normal normal 500 34px/40px Poppins;
	letter-spacing: 0px;
	color: #1D1D1D;
	text-transform: uppercase;
	opacity: 1;
	margin: 0;
	float: left;
	width: 100%;
}
.home-2 .text-block p, .text-block p
{
	text-align: left;
	font: normal normal normal 24px/29px Poppins;
	letter-spacing: 0px;
	color: #1D1D1D;
	opacity: 1;
	margin: 40px 0;
	float: left;
	width: 100%;
}
.text-block ul
{
	list-style: none;
	padding-left: 0;
}
.text-block ul li
{
	font: normal normal normal 18px/29px Poppins;
}
.home-2 .text-block h2 span, .text-block  h2 span,
.home-2 .text-block p, .text-block p span
{
	width: 100%;
	float: left;
}

.theme-button
{
	text-align: center;
	font: normal normal normal 20px/30px Poppins;
	letter-spacing: 0px;
	color: #ffffff;
	opacity: 1;
	background: #1D1D1D 0% 0% no-repeat padding-box;
	box-shadow: 0px 3px 6px #00000029;
	border-radius: 28px;
	width: 250px;
	display: inline-block;
	padding: 8px;
}
.theme-button:hover
{
	background: #3498FF 0% 0% no-repeat padding-box;
	color: #fff;	
}
.home-3, .home-4
{
	float: left;
	width: 100%;
	padding-top: 90px;
	overflow-x: hidden;
}
.home-3 .text-block
{
	padding-left: 70px;
	padding-top: 30px;
	padding-bottom: 30px;
	border: 3px solid #3498FF;
	width: 90%;
	margin-left: auto;
	border-right: 0;
}
.home-4 .text-block
{
	padding-left: 70px;
	padding-top: 30px;
	padding-bottom: 30px;
	border: 3px solid #3498FF;
	border-left: 0;
	width: 90%;
}
.home-3 .hover-img, .home-4 .hover-img
{
	height: 100%;
	background-color: #3498FF;
	position: relative;
	padding-left: ;
}
.home-3 .hover-img .main-img
{
	padding-left: 30px;
	padding-bottom: 30px;
	margin-top: -50px;
	width: 100%
}
.home-3 .hover-img .overlay-1
{
	position: absolute;
  bottom: 30px;
  right: -50px;
  transition: 1s;  
  width: 100%;
}
.home-4 .hover-img .overlay-2
{
	    position: absolute;
    bottom: 30px;
    left: 0;
    transition: 1s;
    width: 85.9%;
    z-index: 99;
}
.home-4 .hover-img .main-img
{
	padding-right: 20px;
	padding-bottom: 30px;
	margin-top: -50px;
	width: 100%
}
.with-hover
{
	display: none;
}
.without-hover
{
	display: block;
}
.home-3:hover .with-hover
{
	display: block!important;
}
.home-3:hover .without-hover
{
	display: none!important;
}
.home-3:hover .overlay-1, .home-4:hover .overlay-2
{
	transform: scale(1.2);
	transform-origin: bottom;
	transition: 1s;
}
.home-4:hover .overlay-2
{
	transform: scaleX(1.3) scaleY(1.2);
}
.home-4:hover .text-block
{
	margin-left: 15px;
	border: 3px solid #3498FF;
	transition: 0.5s;
}


.home-5
{
	float: left;
	width: 100%;
	margin-top: 100px;
	padding: 100px 0;	
	background-image: url(../img/home-5.png);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	transition: 1s;
	position: relative;
}
.home-5:before {
    content: '';
    background-color: #06030373;
    position: absolute;
    background-size: cover;
    height: 100%;
    display: block;
    margin: 0px !important;
    width: 100%;
    left: 0;
    right: 0;
    padding: 0 !important;
    top: 0;
}
.home-5:hover
{
	background-position: right;
	transition: 1s;
}
.home-5 .home-contact
{
	margin-top: -50px;
  position: relative;
  overflow: hidden;
}
.home-5 .home-contact .hover-img-icon
{
	display: none;
	width: 85%;
	margin-left: auto;
}

.home-5:hover .hover-img-icon
{
  display: block;
  
}
.home-6
{
	padding: 50px 0;
	/*background: #fff;*/
	float: left;
	width: 100%;
}
.home-6 h1
{
	text-align: center;
	font: normal normal 500 36px/34px Poppins;
	letter-spacing: 0px;
	color: #1D1D1D;
	text-transform: uppercase;
	opacity: 1;
	margin-bottom: 35px;
}
.home-6 .brands
{
	width: 100%;
	float: left;
}
.home-6 .brands .brand-logo	
{
	width: calc(95% / 5);
	float: left;
	margin: 0.5%;
}
.home-6 .brands .brand-logo	 img
{
	width: 100%	;
}
.home-6 .brands .blank-area
{
	width: 10%;
	min-height: 1px;
	float: left;
}
footer
{
	float: left;
	width: 100%;
	padding: 50px 0 20px;
	background: #99CBFF 0% 0% no-repeat padding-box;;
	opacity: 1;
	z-index: 9;
	position: relative;
}
footer ul
{
	list-style: none;
	padding-left: 0;
}
footer .footer-logo-section li
{
	padding-bottom: 10px;
}
footer .footer-logo-section li,
footer .footer-logo-section li a 
{
	font: normal normal normal 9px/15px Poppins;
	letter-spacing: 0.27px;
	color: #000000;
	opacity: 1;
}
footer .footer-logo-section li span
{
	font: normal normal 500 9px/15px Poppins;
}
footer .footer-menu h3
{ 
	text-align: left;
	font: normal normal 500 20px/34px Poppins;
	letter-spacing: 0px;
	color: #000000;
	opacity: 1;
	padding-bottom: 16px;
	margin-bottom: 0;
}
footer .footer-menu li
{
	padding-bottom: 10px;
}
footer .footer-menu li,
footer .footer-menu li a
{
	text-align: left;
	font: normal normal normal 16px/25px Poppins;
	letter-spacing: 0px;
	color: #000000;
	opacity: 1;
}
footer .footer-menu li span
{
	font: normal normal 500 16px/25px Poppins;
	
}


/*about page */
.about-banner
{
	float: left;
	width: 100%;
	padding: 50px 0;
	background-image: url(../img/about/bg1.png);
	background-position: center top 75px;
	background-repeat:no-repeat;
  background-size: cover;
}
.about-banner .title
{
	text-align: center;
	font: normal normal 500 48px/54px Poppins;
	letter-spacing: 0px;
	color: #000000;
	opacity: 1;
	margin-bottom: 40px;
	float: left;
	width: 100%;
}
.about-banner .title span
{
	float: left;
	width: 100%;
}
.about-banner .hover-img
{
	background: #3498FE;
	width: 90%;
}
.about-banner .hover-img img{
	padding-bottom: 30px;
  margin-top: -30px;
  margin-left: 30px;
}
.about-banner .theme-button
{
	position: absolute;
	top: 50%;
	right: -50px;
	transform: translate(0, -50%);
}
.about-2
{
	float: left;
	width: 100%;	
	/*background-image: url(../img/about/bg5.png);*/
	background-position: center;
	background-size:;
	position: relative;
	background-repeat: no-repeat;
	margin-bottom: 70px;
}
.about-2 .container .row
{
	width: 100%;
	float: left;
}
.about-2 .mission-vission
{
	width: 100%;
	float: left;
	/*background-image: url(../img/about/bg3.png);*/
	/*background-color: #fff;*/
	background-size: cover;
	    padding-top: 10px;
    background-repeat: no-repeat;
    background-position: center;
    position: relative;
    margin-top: -170px;

}
.about-2 .mission-vission  .col-lg-6
{
	padding-left: 60px;
}
.about-2 .mission-vission .position-absolute
{
	top: -30px;
	left: 0;
}
.about-2 .mission-vission h1
{
	text-align: left;
	font: normal normal 500 34px/54px Poppins;
	letter-spacing: 0px;
	color: #000000;
	text-transform: uppercase;
	opacity: 1;
}
.about-2 .mission-vission p
{
	text-align: left;
font: normal normal normal 16px/20px Poppins;
letter-spacing: 0px;
color: #000000;
opacity: 1;
}
.about-3
{
	float: left;
	width: 100%;
	background-image: url(../img/about/bg2.png);
    background-position: top right 0;
    background-repeat: no-repeat;
    padding: 100px 0;
    background-size: contain;
}
.about-3 .hover-img
{
	background: #3498FE;
	width: 100%;
	margin-left: auto;
}
.about-3 .hover-img img
{
	padding-right: 0px;
	padding-bottom: 30px;
	margin-left: -30px;
	margin-top: -30px;
}
.about-3 .text-block
{
	border: 3px solid #3498FE;
	padding: 20px 40px;
	border-right: 0;
	margin-top: -50px;
}
.about-3 .text-block p
{
	margin: 15px 0 ;
}
.about-3 .about-contact
{
	background-image: url(../img/about/bg4.png);
	padding: 80px;
	background-color: #fff;
	margin-left: -50px;
  background-repeat: no-repeat;
  background-size: cover;
}
.about-3 .about-contact h1
{
	text-align: left;
	font: normal normal 500 35px/42px Poppins;
	letter-spacing: 0px;
	color: #1D1D1D;
	text-transform: uppercase;
	opacity: 1;
	margin-bottom: 40px;
}


/*contact us */

.contact-details
{
	float: left;
	width: 100%;
	background-image: url(../img/contact/bg1.png);
	background-position: top right;
	padding: 100px 0 50px ;
	background-size: cover;
	background-repeat: no-repeat;
}
.contact-details .details h1
{
	text-align: left;
	font: normal normal medium 48px/72px Poppins;
	letter-spacing: 0px;
	color: #1D1D1D;
	opacity: 1;
	margin-bottom: 30px;
}
.contact-details .details ul
{
	list-style: none;
	padding-left: 0;
}
.contact-details .details ul li
{
	display: flex;
	padding-bottom: 30px;
}
.contact-details .details ul li .icon
{
	width: 50px;
	float: left;
}
.contact-details .details ul li .text
{
	width: calc(100% - 50px);
	float: left;
}
.contact-details .details ul li .text 
{
	text-align: left;
	font: normal normal 500 18px/24px Poppins;
	letter-spacing: 0px;
	color: #1D1D1D;
	opacity: 1;
}
.contact-details .details ul li .text span
{
	text-align: left;
	font: normal normal normal 18px/24px Poppins;
	letter-spacing: 0px;
	color: #1D1D1D;
	opacity: 1;
}
.contact-details .hover-img
{
	background: #3498FE;
}
.contact-details .hover-img img
{
	/*padding-right: 30px;*/
	margin-top: -30px;
	margin-left: -30px;
	width: 100%;
	padding-bottom: 30px;
}
.contact-form
{
	float: left;width: 100%;
	padding: 70px 0 ;
	background-image: url(../img/contact/bg1.jpg);
	background-repeat: no-repeat;
	background-position: center;
  background-size: cover;
}
.contact-form .form form
{
	background: #FFFFFF;
	box-shadow: 0px 3px 50px #00000029;
	border-radius: 10px;
	opacity: 1;
	padding: 40px
}
.contact-form .form form .form-group
{
	margin-bottom: 2rem;
}
.contact-form .form form label
{
	width: 100%;
	float: left;
	text-align: left;
	font: normal normal 500 20px/20px Poppins;
	letter-spacing: 0px;
	color: #1C1C24;
	opacity: 1;
}
.contact-form .form form .form-control
{
	background: #FFFFFF 0% 0% no-repeat padding-box;
	border: 1px solid #1C1C24;
	border-radius: 5px;
	opacity: 1;
	text-align: left;
	font: normal normal normal 20px/31px Poppins;
	letter-spacing: 0px;
	color: #656565;
	opacity: 1;
	padding-left: 15px;
}
.contact-form .form form .form-control::-webkit-input-placeholder,
.contact-form .form form .form-control:-ms-input-placeholder,
.contact-form .form form .form-control::placeholder 
{
	text-align: left;
	font: normal normal normal 20px/31px Poppins;
	letter-spacing: 0px;
	color: #656565;
	opacity: 1;
}
.contact-form .form form input[type="text"]
{

}
.contact-form .form form input[type="submit"]
{
	border: none;
}
.contact-form .form form .have-icon
{
	position: relative;
}
.contact-form .form form .have-icon .arrow-img
{
	position: absolute;
	top: 50%;
    right: 15px;
    transform: translate(0, 10px);
}
.contact-form .form form select
{
	 -webkit-appearance: none;
   -moz-appearance: none;
        appearance: none;
}

/*products page */

.tabbing-menu
{
	width: 100%;
	float: left;
	padding: 30px 0;
}
.tabbing-menu a
{
	font: normal normal normal 20px/30px Poppins;
	letter-spacing: 0px;
	color: #000000;
	opacity: 1;
	padding: 15px;
	display: inline-block;
}
.tabbing-menu a:hover
{
	color: #3498FF;
}

#equipments
{
	float: left;
	width: 100%;
	padding-bottom:  50px;
	background-image: url(../img/product/bg1.png);
	background-position: bottom;
	background-repeat: no-repeat;
}
#equipments .container-fluid
{
	background-image: url(../img/product/flip-bg.png);
	background-position: top -345px left -10px;
	background-repeat: no-repeat;	
	background-size: 105%
}
#products .container-fluid
{
  /*background-image: url(../img/product/flip-bg1.png);*/
  background-position: right -310px top 270px;
  background-repeat: no-repeat;	
}
#equipments .section-title,
#products .section-title
{
	float: left;
	width: 100%;
	padding-bottom: 15px;
	text-align: center;
}
#equipments .section-title h2,
#products .section-title h2
{
	text-align: center;
	font: normal normal 500 34px/40px Poppins;
	letter-spacing: 0px;
	color: #000000;
	opacity: 1;
}
#equipments .section-title p,
#products .section-title p
{
	text-align: center;
	font: normal normal normal 24px/29px Poppins;
	letter-spacing: 0px;
	color: #1D1D1D;
	opacity: 1;
}

#products
{
	float: left;
	width: 100%;
	padding: 50px 0 100px;
	background-image: url(../img/product/bg1.png);
	background-position: left bottom 105px;
	background-repeat: no-repeat;
}
#products .product-details h5
{
	text-align: left;
	font: normal normal normal 24px/29px Poppins;
	letter-spacing: 0px;
	color: #3498FF;
	margin-bottom: 1rem;
	position: relative;
}
#products .product-details h5 span
{
	font: normal normal 500 24px/29px Poppins;
}
#products .product-details h5 img
{
	position: absolute;
	top: -5px;
	right: 15px
}
#products .product-details p
{
	text-align: left;
	font: normal normal normal 15px/20px Poppins;
	letter-spacing: 0px;
	color: #1D1D1D;
	opacity: 1;
	float: left;
	width: 100%;
}
#products .product-details p span
{
	float: left;
	width: 15px;
}
#products .product-details p span.content
{
	float: left;
	width: calc(100% - 15px );
}
#products .product-details p.strong
{
	font-weight: 500;
}
#products .product-img
{
	padding-right: 40px;
}
#products .product-img .carousel-item img
{
	width: 100%;
}
#products .product-img .carousel-indicators
{
	position: relative;
}
#products .product-img .carousel-indicators li
{
	width: 80px;
	height: 80px;
	position: relative;
}
#products .product-img .carousel-indicators li img
{
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
}

/*service page */

.service-banner
{
	float: left;
	width: 100%;
	padding: 35px 0 50px;
	background-image: url(../img/service/bg1.png);
  background-position: left bottom ;
  background-repeat: no-repeat;
  background-size: cover;
}
.service-banner .text-block h1
{
	text-align: left;
	font: normal normal 500 32px/40px Poppins;
	letter-spacing: 0px;
	color: #000000;
	opacity: 1;
}
.service-banner .text-block p
{
	text-align: left;
	font: normal normal normal 23px/29px Poppins;
	letter-spacing: 0px;
	color: #1D1D1D;
	opacity: 1;
	margin: 20px 0;
}
.fixed-sidebar
{
	position: fixed;
	bottom: -100px;
	z-index: 1;
	left: 70px;
	/*background-color: #D6C7AA;*/
	width: 320px;
	padding: 20px 50px ;
}
.fix-bar
{
	position: fixed;
	bottom: 0px;
	z-index: 1;
	left: 70px;
	background-color: #D6C7AA;
	width: 320px;
	padding: 20px 50px  ;
	transition: 1s;
}
.fixed-sidebar ul
{
	list-style-type: none;
	padding-left: 0;
}
.fixed-sidebar ul li a
{
	text-align: left;
	font: normal normal normal 15px/24px Poppins;
	letter-spacing: 0px;
	color: #1D1D1D;
	opacity: 1;
}
.fixed-sidebar ul li a:hover
{
	color:  #3498FF;
}

.all-servicess
{
	float: left;
	width: 100%;
	padding: 50px 0;
}
.all-servicess .container-fluid
{
	padding-left: 116px;
	padding-right:0;
}
.all-servicess .container-fluid .product-slider
{
	margin-bottom: 20px;
}
.all-servicess .container-fluid .product-slider-title
{
	text-align: left;
	font: normal normal 500 24px/29px Poppins;
	letter-spacing: 0px;
	color: #1D1D1D;
	opacity: 1;
}
.all-servicess .container-fluid .product-slider .owl-nav 
{
	position: absolute;
	top: -35px;
	right: 116px;
}
.all-servicess  #Repairs .product-slider .owl-nav,
.all-servicess  #Underwater .product-slider .owl-nav,
.all-servicess  #Hullcoating .product-slider .owl-nav,
.all-servicess  #Transducers .product-slider .owl-nav,
.all-servicess  #Installation .product-slider .owl-nav,
.all-servicess  #Seabed .product-slider .owl-nav
{
	right: inherit;
	left: 0
}



.all-servicess .container-fluid .product-slider .owl-nav .owl-prev
{
	margin-right: 15px;
}
.all-servicess .container-fluid .product-slider .owl-nav .owl-next
{
	margin-left: 15px;
}
#hull, #Propeller, #Repairs, #Removal , #Underwater, #Hullcoating, #Transducers, #Installation, #Seabed
{
	padding: 50px  0;
}
#hull
{
  background-image: url(../img/product/flip-bg2.png);
  background-position: left -50px top;
  background-repeat: no-repeat;
}
#Seabed
{
	background-image: url(../img/service/flip-bg1.png);
    background-position: left bottom 50px;
    background-repeat: no-repeat;
    background-size: contain;
}
#Propeller
{
	background-image: url(../img/service/bg1.png);
	background-position: left bottom ;
	background-repeat: no-repeat;
} 
#Repairs
{
	background-image: url(../img/service/bg4.png);
	background-position: left bottom 105px;
	background-repeat: no-repeat;
}
#Removal 
{
	background-image: url(../img/service/flip-bg1.png);
	background-position: left bottom 105px;
	background-repeat: no-repeat;
}
#Underwater
{
	/*background-image: url(../img/service/bg3.png);
	background-position: left bottom 105px;
	background-repeat: no-repeat;*/
}
#Hullcoating
{
	background-image: url(../img/service/bg1.png);
	background-position: right bottom 22px;
  background-repeat: no-repeat;
  background-size: contain;
}
#Transducers
{
	background-image: url(../img/service/bg1.png);
	background-position: left top -180px;
    background-repeat: no-repeat;
}
#Installation
 {
 	background-image: url(../img/service/bg1.png);
	background-position: left bottom ;
	background-repeat: no-repeat;
 }

.back-to-top
{
	width: 100%;
	text-align: center;
	float: left;	
	padding-top: 50px;
}
.back-to-top a
{
	text-align: center;
	font: normal normal normal 24px/29px Poppins;
	letter-spacing: 0px;
	color: #1D1D1D;
	opacity: 1;
}
.back-to-top a:hover
{
	color: #3498FF;
}
/*.floating-icon
{
	position: fixed;
	right: 50px;
	bottom: 50px;
	z-index: 9;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background-color: #25D366;
	display: flex;
	align-items: center;
	justify-content: center;
}*/
.floating-icon a 
{	
    padding: 10.6px 13px;
    border-radius: 50%;
    position: fixed;
    z-index: 9;
    bottom: 50px;
    right: 15px;    
}
.floating-icon a:hover 
{
	color: #fff;
}
.text-shadow {
	  text-shadow: 2px 2px #1d1d1d;
}
.help-block {
    color: red;
}