@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300&display=swap');

html,
body {
    overflow-x: hidden;
}



* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    word-break: break-word;
}

html {
    scroll-behavior: smooth;

}

body {
    overflow-x: hidden;
    margin: 0;
    padding: 0;
    scroll-behavior: smooth;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Plus Jakarta Sans', sans-serif;
    color: #fff;
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
    margin: 0;
    padding: 0;
}


a {
    color: #fff;
    text-decoration: none;
    display: inline-block;
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-size: 16px;
    font-weight: 600;
    line-height: 17px;
}

h1 {
    font-style: normal;
    font-weight: 700;
    font-size: 54px;
    line-height: 71px;
}

h2 {
    font-style: normal;
    font-weight: 700;
    font-size: 38px;
    line-height: 48px;
}

h3 {
    font-style: normal;
    font-weight: 700;
    font-size: 30px;
    line-height: 38px;
}


h4 {
    font-style: normal;
    font-weight: 700;
    font-size: 26px;
    line-height: 33px;
}

h5 {
    font-style: normal;
    font-weight: 700;
    font-size: 22px;
    line-height: 28px;
    letter-spacing: 0.04em;
}

h6 {
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 31px;
}

p {
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 33px;
}

ul,
ol,
li {
    padding: 0;
    margin: 0;
    list-style: none;
    list-style-type: none;
}

img {
    max-width: 100%;
    display: block;
}

.container {
    width: 100%;
    max-width: 1146px;
    margin: 0 auto;
	padding:0 20px;
}

/******************************************* HEADER CSS START HERE *********************************************************/
.bottom-header {
    background-color: #0088C6;
}

.menus-flex ul {
    display: flex;
    justify-content: space-between;
    position: relative;
    flex-wrap: wrap;
    padding: 10px 0px;
}

.header-logo img {
    width: 100px;
}
.main-flex {
    display: flex;
    justify-content: space-between;
    position: relative;
    flex-wrap: wrap;
    align-items: center;
}

.search-bar input {
    width: 100%;
    max-width: 100%;
    padding: 15px 31px;
    background: #FFFFFF;
    border: 1px solid #C6C6C6;
    border-radius: 4px;
}

.header-logo {
    width: 100%;
    max-width: 12%;
}

.search-bar {
    position: relative;
    width: 100%;
    max-width: 70%;
}

.search-bar input::placeholder {
    font-family: 'Plus Jakarta Sans';
    font-size: 14px;
    font-weight: 400;
    color: rgba(0, 0, 0, 0.3);
}

.flags {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.flag-img {
    margin: 0 10px;
}

.flag-img a {
    color: #000;
	cursor: initial;
}

.top-headder {
    background-color: #ED1C24;
    padding: 10px 0px;
}

.phone a {
    font-size: 12px;
}

.phone i {
    color: #fff;
}
/* 
.search-bar i {
    position: absolute;
    bottom: 15px;
    left: 10px;
    opacity: 0.3;
}
 */
.search-bar img {
    position: absolute;
    bottom: 15px;
    left: 10px;
    opacity: 0.3;
}

.top-flex {
    display: flex;
}

.phone {
    margin-right: 40px;
}

.main-header {
    padding: 10px 0;
}

.menus-flex a {
    transition: all 0.3s linear;
}

.menus-flex a:hover {
    color: #ED1C24;
}
.active-menu{
	color: #ED1C24;
}
/******************************************* HEADER CSS END HERE *********************************************************/


/*********************************** Home banner css start here ****************************************************************/
.home-banner {
    min-height: 368px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    display: flex;
    align-items: center;
    justify-content: center;
	padding-top:20px;
}

.banner-content h1 {
    font-size: 38px;
    color: #ED1C24;
    text-align: center;
    text-transform: uppercase;
}

.banner-content span {
    font-size: 40px;
    color: #fff;
}

.banner-anchor {
    text-align: center;
}

.banner-anchor a {
    border: 1px solid;
    border-radius: 6px;
    padding: 15px 20px;
    margin: 20px 5px 0;
    transition: all ease .3s;
	width: 315px;
}

.banner-anchor a:hover {
    background-color: #0088C6;
    border: 1px solid #0088C6;
}

/*********************************** Home banner css end here ****************************************************************/

/*********************************** Our Parnter css start here ****************************************************************/

.our-parntner-content h3 {
    color: black;
    text-align: center;
    margin-bottom: 30px;
	    line-height: 1.6;
}

section.our-parntner {
    padding: 70px 0;
}

.desktop__partners--slider {
    margin: 80px 0 0 ;
}
/* .our-parnter-image img  {
    width: 100%;
    max-width: 256px;
    object-fit: contain;
	margin:0 auto;
   
} */
.desktop__partners--slider {
    display: flex;
    flex-wrap: wrap;
    gap: 20px 70px;
   
    margin: 0;
}

.desktop__partners--slider .item.item-box {
    width: 100%;
    max-width: calc((100% / 7) - 60px);
	display:flex;
	align-items:center;
	justify-content:center;
}
.desktop__hidden{
  display:none;
}


/*********************************** Our Parnter css end here ****************************************************************/

/****************************************** Home shop categories start here ***************************************************/
ul.tabs {
    margin: 0px;
    padding: 0px;
    list-style: none;
}

ul.tabs li {
    background: none;
    color: #222;
    display: inline-block;
    padding: 10px 15px;
    cursor: pointer;
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-weight: 500;
    font-size: 14px;
    text-transform: uppercase;
}

ul.tabs li.current {
    color: #ED1C24;
    font-weight: 600;
    display: inline-flex !important;
}

.tab-content {
    display: none;
    /* background: #ededed; */
    padding: 15px;
}

.tab-content.current {
    display: inherit;
}

.shop-flex {
    display: flex;
    justify-content: space-between;
    position: relative;
    flex-wrap: wrap;
}

.shop-imgs-content {
    width: 100%;
    max-width: 23%;
    text-align: center;
}

.shop-imgs-content p {
    color: #00A9E5;
}

.shop-img {
    min-height: 200px;
    margin: 10px 0px;
}

.shop-img img {
    margin: 0 auto;
transition: 0.3s all linear;
}

.shop-img img:hover {
    transform: scale(0.95);
}

.load-more {
    background-color: #000;
    color: #fff !important;
    padding: 17px 54px;
    border-radius: 6px;
    font-size: 14px;
    margin: 50px 0;
    display: inline-block;
	width: 315px;
}

.load-more:hover {
    background-color: #ED1C24;
    text-decoration: none;
}

/* .shop-imgs-content {
    display: none;
} */

.see-all {
    text-align: center;
}

ul.tabs {
    padding: 30px 0 50px 0;
    text-align: center;
    width: 100%;
    max-width: 90%;
    margin: 0 auto;
}

.current {
    display: block !important;
}

/****************************************** Home shop categories start here ***************************************************/




/************************************************* GREY IMAGES CSS START HERE ***********************************************/
.grey-flex {
    display: flex;
    position: relative;
    justify-content: space-between;
    width: 100%;
    border-radius: 8px;
    padding: 60px 0;
    max-width: 90%;
    margin: 0 auto;
    flex-wrap: wrap;
    align-items: center;
}

.grey-color {
    background-color: #F8F8F8;
}

/************************************************* GREY IMAGES CSS END HERE ***********************************************/


/*************************************************** DEALER CSS START HERE **************************************************/
.dealer-flex {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    position: relative;
}

.dealer-width {
    width: 100%;
    max-width: 49%;
    position: relative;
}

section.dealer {
    padding: 50px 0;
}

.dealer-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    width: 100%;
}

.dealer-text a {
    border: 1px solid;
    border-radius: 6px;
    padding: 15px 26px;
    margin: 15px 0;
    transition: all ease .3s;
	width: 315px;
}

.dealer-text h4 {
    text-transform: uppercase;
}

/*************************************************** DEALER CSS END HERE **************************************************/


/****************************************************** CONTACT CSS START HERE *********************************************/

.contact-bg-color p {
    width: 100%;
    max-width: 100%;
}

.contact-flex {
    display: flex;
    justify-content: space-between;
    position: relative;
    flex-wrap: wrap;
}

.contact-content {
    width: 100%;
    max-width: 48%;
}


.contact-content h3 {
    color: #000;
    font-weight: 700;
    text-transform: uppercase;
    width: 100%;
    max-width: 85%;
    padding-bottom: 15px;
}

.contact-links-flex {
    margin-top: 40px;
}

.contact-content p {
    color: black;
    width: 100%;
    max-width: 90%;
}

.contact-links-width i {
    color: #ED1C24;
    padding: 11px;
    border-radius: 100%;
    background-color: rgba(237, 28, 36, 0.1);
    transition: all ease .3s;
}

.contact-links-width a {
    color: #000;
    margin-left: 20px;
    width: 100%;
    max-width: 80%;
    line-height: 30px;
    font-family: 'Poppins', sans-serif;
    font-size: 20px;
    font-weight: 300;
    letter-spacing: inherit;
}

.contact-links-width {
    display: flex;
    align-items: baseline;
    margin: 15px 0;
    width: 100%;
    max-width: 100%;
}

.social-icons i {
    color: black;
    transition: all ease .3s;
}

.social-icons-flex {
    display: flex;
    width: 100%;
}

.social-icons {
    margin-right: 26px;
}

.social-icons i {
    color: #ED1C24;
    padding: 11px;
    border-radius: 100%;
    background-color: rgba(237, 28, 36, 0.1);
}

.social-icons i:hover {
    background-color: #0088C6;
    color: #fff;
}

.contact-bg-color {
    background-color: #F8F8F8;
    padding: 40px 30px 20px;
    border-radius: 10px;
}

.inputs {
    margin: 20px 0;
}

.inputs input {
    width: 100%;
    padding: 10px;
    border-radius: 4px;
    border: 1px solid #E9E9E9;
    outline: none;

}

.inputs input::placeholder {
    font-family: 'Plus Jakarta Sans';
    font-size: 14px;
    font-weight: 400;
    color: rgba(0, 0, 0, 0.4);
}

.textarea textarea {
    width: 100%;
    padding: 10px;
    border-radius: 4px;
    border: 1px solid #E9E9E9;
    outline: none;
    font-family: 'Plus Jakarta Sans';
    font-size: 14px;
    font-weight: 400;
    color: rgba(0, 0, 0, 0.4);
    resize: none;
}

.textarea textarea::placeholder {
    color: rgba(0, 0, 0, 0.4);

}

.contact-content button {
    width: 315px;
    background: #ED1C24;
    border-radius: 6px;
    border: none;
    padding: 14px;
    font-family: 'Plus Jakarta Sans';
    font-size: 16px;
    font-weight: 600;
    color: #fff;
    margin-top: 30px;
    transition: all ease .3s;
}

.home-form-sub {
    display: flex;
    justify-content: center;
    align-items: center;
}

.contact-links-width i:hover {
    background-color: #0088C6;
    color: #fff;
}

.contact-content button:hover {
    background-color: #0088C6;

}

.dealer-text a:hover {
    background-color: #0088C6;
    border: 1px solid #0088C6;
}

section.contact {
    padding: 80px 0;
}

/****************************************************** CONTACT CSS START HERE *********************************************/

/**************************************************** FOOTER CSS START HERE ***************************************************/
.footer {
    background-color: rgba(0, 0, 0, 0.8);
    padding: 60px 0;
}

.footer-flex {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    position: relative;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
	padding-bottom: 30px;
}

.footer-flex .footer-width:nth-child(1) {
    width: 100%;
    max-width: 45%;
}

.footer-width h6 {
    color: rgba(255, 255, 255, 0.8);
}

.footer-logo {
    padding-bottom: 35px;
}

.footer-width h5 {
    padding-bottom: 40px;
}

.footer-width ul li a {
    font-size: 14px;
    font-weight: 500;
    padding: 15px 0;
    text-transform: uppercase;
}

.footer-width {
    width: 100%;
    max-width: 22%;
}

.footer-last-line p {
    font-size: 14px;
    color: rgba(255, 255, 255, 0.8);
    padding: 30px 0 0 0;
}

section.five-imgs {
    padding: 30px 0;
}


/*********************************************************************** FIVE IMAGES CSS START HERE *********************************************/
.five-flex {
    display: flex;
    justify-content: space-between;
    position: relative;
}

.five-img {
    width: 100%;
    max-width: 25%;
}

.five-flex .five-img:nth-child(2) {
    width: 100%;
    max-width: 47%;
}

.five-img img {
    padding: 10px 0;
transition: 0.3s all linear;
}

.five-img-main:hover {
    transform: scale(0.99);
}

.five-flex .five-img:nth-child(2) img {
    min-height: 615px;
}

.shop-heading h3 {
    color: #000;
    text-align: center;
    padding-top: 40px;
}

.footer-width ul li a br {
    display: none;
}

.five-img-main {
    position: relative;
	transition: 0.3s all linear;
}

.five-img-main a {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-transform: uppercase;
    font-size: 22px;
    font-weight: 700;
    width: 60%;
    text-align: center;
    line-height: 30px;
}

/*********************************************************************** FIVE IMAGES CSS END HERE *********************************************/





/************************************************************ BOATS CATEGORIES CSS START HERE ***********************************************************/
section.boat-banner {
    padding: 115px;
    text-align: center;
}

.boat-content h1 {
    text-transform: uppercase;
}

section.boats-categories {
    padding: 80px 0;
}

section.boats-categories {
    padding: 80px 0;
}

.categories-content {
    width: 100%;
    max-width: 80%;
    margin: 0 auto;
    text-align: center;
}

.categories-content h3 {
    color: #000;
}

.categories-content p {
    padding: 25px 0 60px 0;
}


.categories-text p {
    color: #00A9E5;
    text-align: center;
    font-size: 14px;
	text-transform: uppercase;
}

.categories-flex {
  display: flex;
    justify-content: flex-start;
    position: relative;
    flex-wrap: wrap;
    width: 100%;
    max-width: 100%;
    gap: 60px;
}

.categories-content-flex {
    width: 100%;
    max-width: 21%;
    text-align: center;
    margin: 20px 0;
	transition: 0.3s all linear;
}
.categories-content-flex:hover {
    transform: scale(0.95);
}
.categories-img img {
    margin: 0 auto;
    width: 100%;
    max-width: 60%;
    object-fit: cover;
}

.categories-img {
    min-height: 230px;
    display: flex;
    justify-content: center;
    align-items: center;
}
/************************************************************ BOATS CATEGORIES CSS END HERE ***********************************************************/

/* *************************************************ABOUT PAGE CSS START HERE ***************************************************************/
.about-paragraphs p {
    color: rgba(0, 0, 0, 0.6);
    font-family: 'Plus Jakarta Sans';
    font-size: 16px;
    padding: 15px 0;
}

.about-paragraphs {
    width: 100%;
    max-width: 100%;
    text-align: center;
}

section.about-content {
    padding: 80px 0;
}
/* *************************************************ABOUT PAGE CSS END HERE ***************************************************************/



.two-divs-flex {
    display: flex;
    justify-content: space-between;
    position: relative;
    flex-wrap: wrap;
    margin-bottom: 35px;
}

.contact-width {
    width: 100%;
    max-width: 49%;
    background-color: #F8F8F8;
    padding: 36px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
	transition: all ease .5s;
}

.contact-width:hover {
 background-color:#0088C6;
}
.contact-width:hover h5 {
	color:#fff;
}
.contact-width:hover a {
	color:#fff;
}
.contact-link img {
    margin: 0 auto;
}

.contact-width h5 {
    color: #000;
    padding: 30px 0 12px 0;
}

.contact-width a {
    color: #000000a8;
    line-height: 30px;
}
.feel-free-flex {
    display: flex;
    justify-content: space-between;
    position: relative;
    flex-wrap: wrap;
    align-items: center;
}

.feel-free-width {
    width: 100%;
    max-width: 47%;
}

.feel-input input {
    width: 100%;
    max-width: 100%;
    padding: 10px;
    margin: 10px 0;
    border: 1px solid #E9E9E9;
    outline: none;
    font-family: 'Plus Jakarta Sans';
}

.feel-input textarea {
    width: 100%;
    max-width: 100%;
    padding: 10px;
    resize: none;
    border: 1px solid #E9E9E9;
    font-family: 'Plus Jakarta Sans';
    border-radius: 4px;
    outline: none;
}

.feel-btn input {
    width: 100%;
    max-width: 100%;
    padding: 15px;
    background-color: #ED1C24 !important;
    border-radius: 6px;
    border: 1px solid #E9E9E9;
    color: #fff;
    font-family: 'Plus Jakarta Sans';
}

.feel-free-width h3 {
    color: #000;
    text-transform: uppercase;
}

.feel-free-width p {
    padding: 10px 0 30px 0;
    color: #000000ab;
}
section.contact-us {
    padding: 80px 0;
}

/********************************************************************************* ABOUT CSS START HERE *********************************************/
.about-content-flex {
    display: flex;
    justify-content: space-between;
    position: relative;
    flex-wrap: wrap;
    align-items: center;
}

.about-main-img {
    width: 100%;
    max-width: 48%;
}

.about-text {
    width: 100%;
    max-width: 47%;
}

.about-flex .about-content-flex:nth-child(2) {
    flex-direction: row-reverse;
}

.about-text p {
    color: #000000a3;
    padding: 10px 0;
}
.about-paragraphs p {
    color: rgba(0, 0, 0, 0.6);
    font-family: 'Plus Jakarta Sans';
    font-size: 16px;
    padding: 15px 0;
}

.about-paragraphs {
    width: 100%;
    max-width: 100%;
    text-align: center;
}

section.about-content {
    padding: 80px 0;
}
.full_width_img {
    height: 105vh;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
.engine__rebuild--services {
    padding: 100px 0;
    background-color: #ECECEC;
}

.engine__rebuild--services__container h3 {
    color: #000000;
    text-align: center;
    margin-bottom: 30px;
	line-height:1.8;
}

.engine__rebuild--services__container > p {
    text-align: center;
    width: 100%;
    margin: 0 auto;
    display: block;
    max-width: 1153.04px;
	    opacity: 0.6;
	font-size: clamp(0.875rem, 0.5905rem + 0.5935vw, 1.125rem);
	line-height:1.8;
}
.engine__rebuild--services__repeater .engine__rebuild--services__content p{
		font-size: clamp(0.875rem, 0.5905rem + 0.5935vw, 1.125rem);
	line-height:1.8;
}
.engine__rebuild--services__container > p:first-of-type {
    margin-bottom: 30px;
}

.engine__rebuild--services__container > p:last-of-type {
    margin-bottom: clamp(1.875rem, -2.3924rem + 8.9021vw, 5.625rem);
}

.engine__rebuild--services__repeater {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

engine_rebuild_services_description .engine__rebuild--services__repeater:nth-child(odd) {
    flex-direction: row;
    flex-direction: row-reverse;
}

.engine__rebuild--services__repeater .engine__rebuild--services__repeater--image {
    width: 100%;
    max-width: 45%;
}

.engine__rebuild--services__repeater .engine__rebuild--services__content {
    width: 100%;
    max-width: 50%;
}

.engine__rebuild--services__repeater .engine__rebuild--services__content p {
    opacity: 0.6;
}
.engine_rebuild_services_description .engine__rebuild--services__repeater:nth-child(even) {
    flex-direction: row-reverse;
    margin-top: clamp(1.875rem, -3.1037rem + 10.3858vw, 6.25rem);
}

.engine__rebuild--services__repeater p {
    margin-bottom: 20px;
}

/* MEDIA TEMPORARY */
@media only screen and (max-width: 1200px){
	.categories-flex {
    justify-content: center !important;
    gap: 0 !important;
}
}