
/*-----------------------------------------------------------FONTS--------------------------------------------------------------*/
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Wix+Madefor+Display:wght@400;500;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Wix+Madefor+Text:ital,wght@0,400;0,500;0,600;0,700;0,800;1,400;1,500;1,600;1,700;1,800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,400;1,500;1,700;1,900&display=swap');
@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');
/* ----------------------------------------------------General Page Setup-------------------------------------------------------*/
*{
    box-sizing: border-box;
    
}

/* Removes scroll bounce */
html, 
body {
    /* overscroll-behavior-y: auto contain; */
    scroll-behavior: smooth;
    overflow-x: hidden; 

}

body{
    margin:0;
}

.top-area {
    display: flex;
    align-items: center;
	margin-bottom: 5%;
}

.top-area h1 {
    display: inline;
    margin: 0; /* remove default margin */
}
.group-photo{
	 margin-left: auto;
}

.group-photo img{
    max-width: 550px;
    border-radius: 11px;
}
/* Generic sizing of each section */
.section{
 max-width: 100%;
 display: flex;
 justify-content: center;
 align-items: center;
 margin:0;
}

/* Styling containers that hold content within each section */
.container{
    font-family: 'Poppins', 'san serif';
    text-align: center;
}

#meet-our-team{
        padding: 40px 2px 40px 2px;
}

.team{
    width: 85%;
    font-family: 'Poppins', 'san serif';
}

.team h1{
    width: 100%;
}

.inner-section{
	float: left;
}

.member-picture{
	width: 30%;
}

.member-info{
	width: 70%;
}

.spacer{
    float: left;
    margin: 3% 0;
        width: 100%;
}


.member{
    float: left;
}

.member-name{
    margin: 0;
}

.member{
    float: left;
	margin-bottom: 5%;
}

.member-picture img {
    border: 2px solid #1c234b;
    max-width: 350px;
    max-height: 350px;
    border-radius: 11px;
}

.member:last-child{
	margin-bottom: 0%;
}

.member-title{
    margin-top: 0;
    font-weight: 400;
}
.section .container h1{
    text-transform: uppercase;
}

.section ul li{
    list-style: none;
}

/* Remove decoration */
a{
    text-decoration: none;

}

/* Website background setup*/
.parnters-bar, 
.simon-info1, 
.simon-info2, 
.simon-info3, 
.testimonals, 
.contact 
.about{
    background: #ffff;
}

.about-details, 
.services{
    background: linear-gradient(135deg,#161d46,#08122c);
    color:#ffffff
}

.footer{
    background: #161D46;
}


/*-----------------------------------------------Navigation Bar (desktop)--------------------------------------------*/
.home{
    transition: all ease-in 100ms;
    min-height: 100vh;
}

.home .header{
    /* orientation of contents */
    display: flex;
    flex-direction: column; 
    justify-content: space-between;
    align-items: center; 
    /* sizing of div */
    inline-size: 100%;
    max-block-size: 25%;

    /* place bar to the top */
    position: fixed;
    inset-block-start: 0;
    font-family: 'Montserrat', 'san serif';
    transition: all  ease-in-out 200ms;
    z-index: 9999;

}

.home .header .nav-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.1rem 0.3rem;
    inline-size: 100%;
    max-block-size: 100%; 
    transition: all ease-in-out 200ms;
    z-index: 99;
}

.logo{
    max-inline-size: 100%;
    block-size: 100%;
    padding: 0.01rem 0.5rem;
    overflow:hidden;
}

.home .header .nav-bar .logo img{
    width: 100px;
    aspect-ratio: auto 100 / 90;
    height: 90px;
    object-fit: contain;
    padding: 2px;
}

/* regular Menu */
.menu{
    display: none;
    margin: 0 -1rem;
}

.menu a{
    color:#ffffff;
    font-weight: 700;
    font-size: clamp(0.75rem ,0.5rem + 1.5vw, 1.2rem);
    transition: 0.3s;
    margin: 0 1rem;
    text-transform: uppercase;
}


.menu a:hover{
    color:#161d46;

}

/*------------------------------------------------Mobile menu setup-------------------------------------------- */
.mobile-nav-toggle{
    appearance:none;
    outline:none;
    border: none;
    background: none;
    cursor: pointer;
    /* turns it into a block level element */
    display: block;
    transition: 3s;
    padding: 12px 5px 4px 5px;
}

.mobile-nav-toggle span{
    color: #ffff;
    font-size: 2.2rem;
    padding: 5px;
}

.mobile-menu{
    position: fixed;
    padding-block-start: clamp(5.4rem, 4rem + 1.5vw , 5.6rem);
    padding-block-end: clamp(0.8rem, 0.5rem + 1.5vw , 0.9rem);
    inline-size: 100%;
    min-block-size: 50%;
    z-index:98;
    background: #08122c;

    /* menu transition */
    opacity: 0;
    transform: translateY(-100%);
    transition: 0.3s;

}

/* transition for menu toggle for mobile */
.mobile-menu.is-open{
    display: block;
    opacity: 1;
    transform: translateY(0);
    z-index: 98;
    border-radius: 0 0 5px 5px;
}

.mobile-menu a{
    display: block;
    color: #ffff;
    padding-block: clamp( 0.225rem, 0.175rem + 1.5vw , 1rem);
    padding-inline: clamp( 0.225rem, 0.175rem + 1.5vw ,1rem);
    text-align: center;
    font-size: clamp(0.45rem , 0.7rem + 1.5vw, 1rem);
    text-transform: uppercase;
    transition: 0.3s;
}

.mobile-menu  a:visited{
    background-color: none;
}

.mobile-menu a:hover{
    /* color: #29357c; */
    background-color:#29357c;
}

.mobile-menu a:active{
    background-color:#04071a;
    /* color: #04071a; */
}

/*---------------------------------------------------Home section----------------------------------------------*/

.home{
    /* fits the image to the sreen */
    /* background: linear-gradient(to bottom, #2e2e2e83, #bcbbbb70),  url('/IMAGES/homesection_4.JPG'); */
    background: linear-gradient(to bottom, #4d4d4e81, #b9b9bb6b),  url('/IMAGES/homesection_4.JPG');
    background-size: cover;
    background-attachment: fixed;
    background-repeat:no-repeat;
    background-position: center center;

}


.Home-content{
   display: flex;
   flex-direction: row;
   color: #ffffff;
   width: 85%;
}

.landing-content{
    display: flex;
    flex-direction: column;

}

.Home-content .landing-content .main-heading p{
    font-size: clamp(1.3rem, 1.9rem + 1.5vw, 3.68rem);
    font-weight: 600;
    padding: 20px 0 15px 0;
    text-transform: uppercase;
    margin: 0;
}
.Home-content .landing-content .main-heading .sub-heading{
    font-size: clamp(0.5rem, 0.42rem + 1.5vw, 1rem);
    font-weight: 400;
    padding: 2px 5px 10px 5px;
    text-transform:capitalize;
    margin: 0;
}

/* Call to action buttons- home section */
.call-to-action {
    padding: 18px;
}

.call-to-action a{
    text-decoration: none;
    font-size: clamp(0.47rem, 0.37rem + 1vw, 0.9rem); 
    letter-spacing: 1.2px;
    padding: 10px 15px;
    background-color:#E57663; 
    font-weight: 500;
    color: #ffffff;
    cursor: pointer;
    text-transform: capitalize;
    border-radius: 3px;
} 

.call-to-action a:visited{
    background-color: #E57663;
}

.call-to-action a:focus {
    background-color:none;
}

.call-to-action a:hover{
    background-color: #ffff;
    color: #161d46;
}

.call-to-action a:active{
    background-color:rgb(241, 241, 241);
    color: #161d46;
}


/*-----------------------------------------------------About Section------------------------------------------------------------------*/
.about {
    min-height:65vh;
}

.about-us{
    display: flex;
    flex-direction: column;
    max-width: 85%;
    padding: 15px 2px 30px 2px;
}

.about-us .intro{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 20px;
    
}

.about-us .intro .small-text{
    text-transform: uppercase;
    font-size: clamp(0.6rem, 0.4rem + 1vw, 1.2rem);
    padding: 15px 0 15px 0;
    line-height: 1.5;
}

.about-us .intro h2{
    font-weight: 800;
    margin:0;
    line-height: 1.2;
    font-size: clamp(1.3rem, 1rem + 1.5vw, 2.5rem);
}

.about-us .intro .medium-text{
    width: auto;
    font-size: clamp(0.8rem, 0.6rem + 1.5vw, 1.4rem);
    line-height: 1.3;
    text-align: center;
}

.about-us .benefits{
    display: flex;
    justify-content: space-between;
    text-align: justify;
    padding: 25px;
}

.about-us .benefits .column{
    display: flex;
    flex-direction: column;
    padding: 0 20px 0 20px;
}
.about-us .benefits .column i,
.about-us .benefits .column h3,
.about-us .benefits .column p{
    margin: 5px 0 5px 0;
}

.about-us .benefits .column p{
    font-size: clamp(0.7rem, 0.52rem + 1.5vw, 1.125rem);
    line-height: 1.5;
}

.about-us .benefits .column h3{
    font-weight: 800;
    font-size: clamp(0.8rem, 0.6rem + 1.5vw,1.375rem);
}


.about-us .benefits .column i{
    font-size: clamp(1rem, 0.7rem + 1.5vw, 2.25rem);
}



/* About details */

.about-details{
    min-height: 50vh;
   
}

.details{
    display: flex;
    align-items: center;
    max-width: 85%;
    gap: 25px;
 
}

.details .content-left{
    display: flex;
    align-items:flex-start;
    height: 100%;
    min-width: 50%;
    padding: 30px;
}

.details .content-left .content-left-text{
    display: flex;
    align-items:flex-start;
    font-size: 1.75rem;
    font-size: clamp(1.2rem, 1rem + 1.5vw, 2.05rem);
    line-height: 1.3;
    text-align: left;

}

.details .content-left .content-left-text h3{
    font-weight: 700;
    margin: 0;
}

.details .content-right{
    display: flex;
   align-items: center;
    height: 100%;
    min-width: 50%;
    padding: 25px
}

.details .content-right .content-right-text{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    font-weight: 300;
    line-height: 1.8;
    text-align: left;
}

.details .content-left-text, .details .content-right-text{
    width: 100%;
    height: 80%;
    
}

.details .content-right .content-right-text p{
    margin: 0 0 20px 0;
    font-size: clamp(0.75rem, 0.6rem + 1.5vw, 1.08rem);
    font-weight: 300;

}

/*------------------------------------------------Partner Logo Section-------------------------------------------*/
.parnters-bar{
    min-height: 60vh;

}

.parnters-bar .partners-logo{
    display: flex;
    flex-direction:column;
    min-width: 85%;
    padding: 10px;
}  

.partners-logo  .title-partners{
    display: flex;
    justify-content: center;
    align-items: center;
    max-height: 20%;
    padding: 25px 10px 10px 10px;
}


.partners-logo  .title-partners h1{
    font-weight: 700;
    margin: 5px 0 5px 0;
    font-size: clamp(1.3rem, 1.175rem + 1.5vw ,2.4rem);
    letter-spacing:0.09rem;
    color: #161d46;
}

/* div that contains unordered list */
.partners-wrap{
    display: flex;
    justify-content: center;
    max-height: 80%;
    max-width: 100%;
}

/* Unordered list of logos */
.partners-wrap .partners-logos{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    padding: 10px;
    margin:0;
    max-width: 100%;
    max-height: 100%;
}

.partners-wrap .partners-logos li{
    display: flex;
    align-items: center;
    padding: 2.5%;
    flex-basis: 20%;
    flex-grow: 1;
    overflow: hidden;
    height: 100%;
    border: 1px solid #dcd8d8;
    margin: 0 10px;
    border-radius: 13px;
   
}


/* ADJUST THIS IMAGE */
.partners-wrap .partners-logos img{
    object-fit: cover;
    object-position: bottom;
}


/*----------------------------------------------Simon Info section-----------------------------------------------*/

.simon-info1,
.simon-info2
{
    min-height: 60vh;
}


.simon1, .simon2, .simon3{
    width: 85%;
}

.simon-info1 .simon1{
    position: relative;
    padding: 5px;
}


.simon-info1 .simon1 .simon1-content{
    display: flex;
    flex-direction: column;
    position: relative;
    width:100%;
    height: 100%;
}

.simon-info1 .simon1 .simon1-content .simon-info-title{
    height: 15%;
}

.simon-info1 .simon1 .simon1-content .simon-info-title h1{
    padding: 10px;
    font-weight: 700;
    margin:0;
    font-size: clamp(1.3rem, 1.175rem + 1.5vw ,2.4rem);
    line-height: 1.7;
    text-transform:uppercase;
    letter-spacing:0.09rem;
    color: #161d46;
}



.simon-info1 .simon1 .simon1-content .simon1-body{
    display: flex;
    height: 85%;
}

.simon-info1 .simon1 .simon1-content .simon1-body .simon1-text-content{
   display: flex;
   justify-content: center;
   align-items: center;
   max-width: 50%;
   max-height:100%;
   padding: 10px;
}

.simon-info1 .simon1 .simon1-content .simon1-body .simon1-text-content .simon1-text{
    display: flex;
    flex-direction: column;
    justify-content: start;
    text-align: start;
    padding: 0 20px 0 20px
 }

.simon-info1 .simon1 .simon1-content .simon1-body .simon1-text h2, .member-name{
    width: 100%;
    font-weight: 600;
    font-size: clamp(1rem, 0.9rem + 1.5vw, 1.5rem);
    color: #161d46;
   
}

.simon-info1 .simon1 .simon1-content .simon1-body .simon1-text h2,
.simon-info1 .simon1 .simon1-content .simon1-body .simon1-text p{
    margin: 5px 0 5px 0;
}



.simon-info1 .simon1 .simon1-content .simon1-body .simon1-text p{
    font-size: clamp(0.7rem, 0.525rem + 1.5vw, 1.15rem);
    font-weight: 400;
    line-height: 1.5;
    color: #565555;
 }

.simon-info1 .simon1 .simon1-content .simon1-body .simon1-image{
    width: 50%;
    height: 100%;
    overflow:hidden;
}

/* fits image to div */
.simon-info1 .simon1 .simon1-content .simon1-body .simon1-image img{
    max-width: 100%;
    max-height: 600px;
    object-fit: contain;
    object-position: bottom;
    padding: 10px;
}



/*------------------------------------------------Bluewave Section-----------------------------------------------*/

.BW-info2 .BW2 {
    display: flex;
    flex-direction: column;
}

.BW-info2 .BW2 .BW2-image{
    max-width: 100%;
    height: 60%;
    overflow:hidden;
    padding: 10px 10px 25px 10px;
}

.BW-info2 .BW2 .BW2-image img{
    width: 100%;
    max-height: 500px;
    object-fit: contain;
    object-position: bottom;
    padding: 10px;
}

.BW-info2 .BW2 .BW2-text-content {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 40%;
    width: 100%;
    padding: 15px 0 15px 0;
}

.BW-info2 .BW2 .BW2-text-content .BW2-text{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 85%;
    padding: 0 48px 24px 48px;
}

.BW-info2 .BW2 .BW2-text-content .BW2-text p{
    font-size: clamp(0.7rem, 0.525rem + 1.5vw, 1.15rem);
    font-weight: 400;
    line-height: 1.5;
    text-align: center;
    color: #565555;
 }

.BW-info2 .BW2 .BW2-text h2{
    font-weight: 600;
    margin: 0 0 15px 0;
    font-size: clamp(1rem, 0.9rem + 1.5vw, 1.5rem);
    color: #161d46;
}

.BW-info2 .BW2 .BW2-text p{
    margin: 2px 0 15px 0;
}

/* button more details */
.BW-info2 .BW2 .BW2-text-content .BW2-text a{
    text-decoration: none;
    border-radius: 3px;
    font-size: clamp(0.55rem, 0.4rem + 1.5vw, 1.15rem);
    letter-spacing: 1.2px;
    padding: 15px 15px;
    background-color:#161d46;
    font-weight: 400;
    color: #ffffff;
    cursor: pointer;
    width: 35%;
}


.BW-info2 .BW2 .BW2-text-content .BW2-text a:hover{
    background-color: #437ecb;
}



/*---------------------------------------------------Simon X section----------------------------------------------*/
.simon-info3{
    min-height: 40vh;
}

.simon-info3 .simon3 {
    display: flex;
    flex-direction: row-reverse;
}
.simon-info3 .simon3 .simon3-text-content{
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 50%;
    padding: 10px;
}

.simon-info3 .simon3 .simon3-text-content .simon3-text{
    display: flex;
    flex-direction: column;
    justify-content:start;
    text-align: start;
    padding: 0 20px 0 20px
}

.simon-info3 .simon3 .simon3-text-content .simon3-text h2{
    font-size: clamp(1rem, 0.9rem + 1.5vw, 1.5rem);
    font-weight: 600;
    color: #161d46;
}

.simon-info3 .simon3 .simon3-text-content .simon3-text h2,
.simon-info3 .simon3 .simon3-text-content .simon3-text p{
    margin: 5px 0 5px 0;

}

.simon-info3 .simon3 .simon3-text-content .simon3-text p{
    font-size: clamp(0.7rem, 0.525rem + 1.5vw, 1.15rem);
    font-weight: 400;
    line-height: 1.5;
    color: #565555;
}


.simon-info3 .simon3 .simon3-image{
    width: 50%;
    overflow:hidden;
}

.simon-info3 .simon3 .simon3-image img{
    max-width: 100%;
    max-height: 600px;
    object-fit: contain;
    object-position: bottom;
    padding: 10px;
}


/*------------------------------------------------Clients section-------------------------------------------------------*/
.clients-1{
    min-height: 60vh;
    background: linear-gradient(135deg,#161d46,#08122c);
    color:#ffffff
}


.clients-2, 
.clients-3, 
.clients-4,
.clients-5{
    min-height: 44vh;
    background: linear-gradient(135deg,#161d46,#08122c);
    color:#ffffff
}

.clients-1 .clients-content1{
    display: flex;
    flex-direction: column;
    max-width: 85%;
    padding: 15px 10px 40px 10px;
    gap: 5px;
}


.clients-1 .clients-content1 .container-title{
    display: flex;
    align-items: center;
    justify-content: center;
    width:100%;
    height: 20%;
    padding: 20px 0 30px 0;
    margin: 22px;
}

.clients-1 .clients-content1 .container-title h1{
    text-transform: uppercase;
    margin: 0;
    font-weight: 700;
    font-family: 'Poppins';
    font-size: clamp(1.4rem, 1.2rem + 1.5vw ,2.7rem);
    letter-spacing:0.09rem;
    text-align: center; 

}

.clients-1 .clients-content1 .content-container{
    display: flex;
    max-width: 100%;
    max-height: 80%;
    position: relative;
   
}

.clients-1 .clients-content1 .content-container .boat-image{
    max-width: 50%;
    overflow:hidden;
    padding: 2px;
}


.clients-2 .content-container,
.clients-3 .content-container,
.clients-4 .content-container,
.clients-5 .content-container
{
    display: flex;
    height: 100%;
    max-width: 85%;
    padding: 40px 10px 40px 10px; 
    gap: 4px;
}

.clients-2 .content-container .boat-image,
.clients-3 .content-container .boat-image,
.clients-4 .content-container .boat-image,
.clients-5 .content-container .boat-image{
    max-width:50%;
    height: 100%;
    overflow:hidden;
    justify-content: center;
    padding: 2px;
}


.clients-1 .clients-content1 .content-container .boat-text{
    display: flex;
    flex-direction: column;
    max-width:50%;
    max-height: 65%;
    padding: 10px 15px 10px 15px;
}


.clients-2 .content-container .boat-text,
.clients-3 .content-container .boat-text,
.clients-4 .content-container .boat-text,
.clients-5 .content-container .boat-text{
    display: flex;
    flex-direction: column;
    max-width:50%;
    max-height: 65%;
    padding: 10px 15px 10px 15px;
}


.clients-1 .clients-content1 .content-container .boat-image img,
.clients-2 .content-container .boat-image img,
.clients-3 .content-container .boat-image img,
.clients-4 .content-container .boat-image img,
.clients-5 .content-container .boat-image img{
    width:100%;
    border-radius: 2px;
    object-fit:contain;
    object-position: bottom;
    padding: 4px;
}


.clients-1 .clients-content1 .content-container .boat-text p,
.clients-2 .content-container .boat-text p,
.clients-4 .content-container .boat-text p,
.clients-3 .content-container .boat-text p,
.clients-5 .content-container .boat-text p{
    text-align: justify;
    font-size: clamp(0.4rem, 0.4rem + 1.5vw, 1.05rem);
    font-weight: 200;
    line-height: 2;
    margin:0px;
}

.clients-1 .clients-content1 .content-container .boat-text h2,
.clients-2 .content-container .boat-text h2,
.clients-4 .content-container .boat-text h2,
.clients-3 .content-container .boat-text h2,
.clients-5 .content-container .boat-text h2{
    text-align: start;
    margin:2px 0 10px 0;
    font-weight: 600;
    font-size: clamp(1rem, 0.9rem + 1.5vw, 1.85rem);
}


/*------------------------------------------------Testimonals-----------------------------------------------------*/
.testimonial-content{
    min-height: 60vh;
}


.wrapper {
	background-color: #ffffff;
	position: absolute;
	max-width: 80%;
    max-height: 80%;
	min-height:10rem;
	border-radius: 0.6em;
	-webkit-box-shadow: 0 1.8em 3em rgba(1, 17, 39, 0.15);
	box-shadow: 0 1.8em 3em rgba(1, 17, 39, 0.15);
	display: flex;
    /* border: 8px solid black; */

}

.testimonial-container {
	max-width: 85%;
	min-height: 20%;
	position: relative;
	margin: auto;
	padding: 1.8em 1.2em;
	/* border: 1px solid black; */
}

.wrapper button {
    font-size: clamp(1.2rem, 1rem + 1vw, 2rem);
	color: #161d46;
	height: 2.2em;
	width: 2.2em;
	position: absolute;
	margin: auto;
	top: 0;
	bottom: 0;
	background-color: #ffffff;
	border: none;
	border-radius: 50%;
	box-shadow: 0 0 1em rgba(0, 0, 0, 0.25);
	cursor: pointer;
}

button#next {
	right: -1.1em;
}
button#prev {
	left: -1.1em;
}

.testimonial-container p {
	color: #565555;
	text-align: center;
    font-size: clamp(0.65rem, 0.45rem + 1.5vw ,1.3rem);
	line-height: 1.8em;
    font-family: 'montserrat';
}
.testimonial-container img {
    display: none;;

}

.testimonial-container h3 {
	color: #161d46;
    font-size: clamp(0.5rem, 0.5rem + 1.5vw, 1.5rem);
	text-align: center;
    margin: 10px 0 10px 0;
}
.testimonial-container h6 {
	color: #3b4163;
    font-size: clamp(0.45rem, 0.4rem + 1.5vw, 1.4rem);
	letter-spacing: 0.03em;
	font-weight: 400;
	text-align: center;
    margin: 10px 0 10px 0;
}

/*-------------------------------------------------Contact section-----------------------------------------------*/

.contact{
   min-height: 80vh;
}

.contact-content-sec{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%;
    width: 85%;
}

.maps{
    width: inherit;
    height:300px;
}

.contact .container{
    padding: 8px 0 0 0;
    width: inherit;
}

.contact .container .contact-content{
    display: flex;
    flex-direction: column;
    justify-content: start;
    width: 100%;
    height: 100%;
    padding: 15px 5px 15px 5px;
}
.contact .container .contact-content .content-top{
    display: flex;
    flex-direction: column;
    height: 50%;
    padding: 10px;
    text-align: start;
    min-width: 80%;
}

.contact .container .contact-content .content-top h1{
    line-height: 1.45;
    font-size:clamp(1rem, 0.95rem + 1.5vw ,2.5rem);
    color: #161d46;
}

.contact .container .contact-content .content-top p{
    font-size: clamp(0.7rem ,0.625rem + 1.5vw ,1.65rem);
    color: #565555;

}

.contact .container .contact-content .content-top h1,
.contact .container .contact-content .content-top p{
    margin: 5px 0px 5px 0px;
}


.contact .container .contact-content .content-bottom{
    display: flex;
    height: 50%;
    padding: 5px;
    max-width: 100%;
}

.contact .container .contact-content .content-bottom .content-bot-left{
    display: flex;
    flex-direction: column;
    min-width: 50%;
    padding: 5px;
}

.contact .container .contact-content .content-bottom .content-bot-right{
    min-width:50%;
    padding:5px
}

.contact .container .contact-content .content-bottom .content-bot-left .number,
.contact .container .contact-content .content-bottom .content-bot-left .email{
    display: flex;
    padding:5px;
    width: 70%;
}

.contact .container .contact-content .content-bottom .content-bot-right .address-content{
    display: flex;
    padding:5px;
    width: 100%;
}

.contact .container .contact-content .content-bottom .content-bot-left .number p,
.contact .container .contact-content .content-bottom .content-bot-left .email p{
    font-size:clamp(0.7rem, 0.5rem + 1.5vw, 1.5rem);
    line-height: 1.6;
    margin: 0;
    padding: 5.5px 5.5px 5.5px 7px;
}


.contact .container .contact-content .content-bottom .content-bot-left .number i,
.contact .container .contact-content .content-bottom .content-bot-left .email i
{
    padding: 15px 11px 11px 11px;
}

.contact .container .contact-content .content-bottom .content-bot-right .address-content i{
    padding: 11px;
}

.contact .container .contact-content .content-bottom .content-bot-right .address-content p{
    font-size:clamp(0.75rem, 0.5rem + 1.5vw, 1.5rem);
    text-align: start;
    line-height: 1.6;
    padding: 3px 3px 3px 7px;
    margin: 0;
}



/*------------------------------------------------------Footer--------------------------------------------------*/

.footer{
    flex-direction: column;
    color:#ffffff;
    min-height: 30vh;
    font-size: clamp(0.3rem, 0.3rem + 1.5vw, 1.2rem);
    font-family: 'Montserrat', 'san serif';
    text-align: center;
}


.row{
    text-align: center;
    padding: 10px 15px 15px 15px;
}

.footer-links{
    display: flex;
    padding: 0;
}

.footer-links li a{
    color:white;
    padding: 0 25px 0 25px;
}