@charset "utf-8";
/* CSS Document */

/******************************

[Table of Contents]

1. Fonts
2. Body and some general stuff
3. Header
	3.1 Top Bar
	3.2 Header Content
	3.3 Logo
	3.4 Main Nav
	3.5 Hamburger
4. Menu
5. Section
6. Home
7. About
8. Feature
9. Team
10. Counter
11. Partners
12. Footer



******************************/

/***********
1. Fonts
***********/

@import url('https://fonts.googleapis.com/css?family=Roboto+Slab:400,700|Roboto:300,400,500,700,900');

/*********************************
2. Body and some general stuff
*********************************/

*
{
	margin: 0;
	padding: 0;
	-webkit-font-smoothing: antialiased;
	-webkit-text-shadow: rgba(0,0,0,.01) 0 0 1px;
	text-shadow: rgba(0,0,0,.01) 0 0 1px;
}
body
{
	font-family: 'Roboto', sans-serif;
	font-size: 14px;
	font-weight: 400;
	background: #FFFFFF;
	color: #333;
	box-sizing: border-box;
/*	color: #a5a5a5;*/
}
div
{
	display: block;
	position: relative;
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
ul
{
	list-style: none;
	margin-bottom: 0px;
}
p
{
	font-family: 'Roboto', sans-serif;
	font-size: 14px;
	line-height: 1.85;
	font-weight: 400;
	color: #76777a;
	-webkit-font-smoothing: antialiased;
	-webkit-text-shadow: rgba(0,0,0,.01) 0 0 1px;
	text-shadow: rgba(0,0,0,.01) 0 0 1px;
}
p a
{
	display: inline;
	position: relative;
	color: inherit;
	border-bottom: solid 1px #ffa07f;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
p:last-of-type
{
	margin-bottom: 0;
}
a, a:hover, a:visited, a:active, a:link
{
	text-decoration: none;
	-webkit-font-smoothing: antialiased;
	-webkit-text-shadow: rgba(0,0,0,.01) 0 0 1px;
	text-shadow: rgba(0,0,0,.01) 0 0 1px;
}
p a:active
{
	position: relative;
	color: #FF6347;
}
p a:hover
{
	color: #FFFFFF;
	background: #ffa07f;
}
p a:hover::after
{
	opacity: 0.2;
}
::selection
{
	
}
p::selection
{
	
}
h1{font-size: 48px;}
h2{font-size: 36px;}
h3{font-size: 24px;}
h4{font-size: 18px;}
h5{font-size: 14px;}
h6{font-size: 36px;}


h6
{
	font-family: 'Adamina', serif;
	font-weight: 700;
	-webkit-font-smoothing: antialiased;
	-webkit-text-shadow: rgba(0,0,0,.01) 0 0 1px;
	text-shadow: rgba(0,0,0,.01) 0 0 1px;
	color: #384158;
	margin-bottom: 0;
}


h1, h2, h3, h4, h5
{
	font-family: 'Roboto Slab', serif;
	font-weight: 700;
	-webkit-font-smoothing: antialiased;
	-webkit-text-shadow: rgba(0,0,0,.01) 0 0 1px;
	text-shadow: rgba(0,0,0,.01) 0 0 1px;
	color: #384158;
	margin-bottom: 0;
}
h1::selection, 
h2::selection, 
h3::selection, 
h4::selection, 
h5::selection, 
h6::selection
{
	
}
.form-control
{
	color: #db5246;
}
.section
{
	display: block;
	position: relative;
	box-sizing: border-box;
}
.clear
{
	clear: both;
}
.clearfix::before, .clearfix::after
{
	content: "";
	display: table;
}
.clearfix::after
{
	clear: both;
}
.clearfix
{
	zoom: 1;
}
.float_left
{
	float: left;
}
.float_right
{
	float: right;
}
.trans_200
{
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.trans_300
{
	-webkit-transition: all 300ms ease;
	-moz-transition: all 300ms ease;
	-ms-transition: all 300ms ease;
	-o-transition: all 300ms ease;
	transition: all 300ms ease;
}
.trans_400
{
	-webkit-transition: all 400ms ease;
	-moz-transition: all 400ms ease;
	-ms-transition: all 400ms ease;
	-o-transition: all 400ms ease;
	transition: all 400ms ease;
}
.trans_500
{
	-webkit-transition: all 500ms ease;
	-moz-transition: all 500ms ease;
	-ms-transition: all 500ms ease;
	-o-transition: all 500ms ease;
	transition: all 500ms ease;
}
.fill_height
{
	height: 100%;
}
.super_container
{
	width: 100%;
	overflow: visible;
}
.prlx_parent
{
	overflow: visible;
}
.prlx
{
	height: 130% !important;
}
.parallax-window
{
    min-height: 400px;
    background: transparent;
}
.nopadding
{
	padding: 0px !important;
}





/*********************************
6. bread
*********************************/

.home
{
	width: 100%;
	height: 182px;
	background: #f2f4f5;
	border-bottom: solid 1px #edeff0;
}
.breadcrumbs_container
{
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	padding-bottom: 13px;
	padding-left: 3px;
}
.breadcrumbs ul li
{
	display: inline-block;
	position: relative;
}
.breadcrumbs ul li:not(:last-child)::after
{
	display: inline-block;
	font-family: 'FontAwesome';
	content: '\f105';
	margin-left: 7px;
	margin-right: 4px;
	color: #384158;
}
.breadcrumbs ul li a
{
	font-size: 14px;
	font-weight: 400;
	color: #384158;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.breadcrumbs ul li a:hover
{
	color: #14bdee;
}


/*********************************
Meet Owner
*********************************/

.founder-title {
  white-space: nowrap; /* Prevents breaking by default */
}

.mobile-break {
  display: inline;
}

.bannerowner {
      background-color: #005e79;
      padding: 1rem;
      text-align: center;
      color: #fff;
    }

 .containerowner {
      display: flex;
      justify-content: center;
      padding: 1rem 1rem;
      gap: 2rem;
      flex-wrap: wrap;
      align-items: flex-start;
      width: 100%;
      max-width: 100%;
    }

    .cardowner {
      background-color: #fff;
      border-radius: 1rem;
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
      padding: 1rem;
      flex-shrink: 0;
    }

    .left-cardowner {
      text-align: center;
      min-width: 250px;
      width: auto;
    }

    .left-cardowner img {
      width: 180px;
      height: 180px;
      border-radius: 50%;
      object-fit: cover;
      margin-bottom: 1rem;
      border: 2px solid #ea6c08;
    }

    .left-cardowner h2 {
      margin: 0.5rem 0;
      color: #005e79;
    }

    .left-cardowner p {
      color: #555;
      font-size: 0.95rem;
    }

    .email-btnowner {
      display: inline-block;
      margin-top: 1rem;
      background-color: #ea6c08;
      color: #fff;
      padding: 0.75rem 1.5rem;
      border-radius: 2rem;
      text-decoration: none;
      font-weight: bold;
      transition: background-color 0.3s;
    }

    .email-btnowner:hover {
      background-color: #d45c07;
    }

    .right-cardowner {
      padding: 2rem;
      text-align: left;
      width: 70%;
      flex-shrink: 0;
    }

    .right-cardowner h3 {
      color: #005e79;
      margin-bottom: 1rem;
    }

    .right-cardowner p, .right-cardowner ul {
      color: #555;
      line-height: 1.6;
    }

    .right-cardowner ul {
      padding-left: 1rem;
      margin-top: 1rem;
    }

    .right-cardowner li {
      margin-bottom: 0.75rem;
    }



/*Card Full width*/

 
.full-containerowner {
      display: flex;
      justify-content: center;
      padding: 3rem 1rem;
/*      gap: 2rem;*/
      flex-wrap: wrap;
      align-items: flex-start;
      width: 100%;
      max-width: 100%;
      height: 100%;
    }

    .full-cardowner {
      background-color: #fff;
      border-radius: 1rem;
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
      padding: 0.5rem;
      flex-shrink: 0;
      width: 100%;
      height: auto;
       text-align: left;
    }

    /*.left-cardowner {
      text-align: center;
      min-width: 250px;
      width: auto;
    }*/
     
    .full-cardowner img {
      width: 180px;
      height: 180px;
      border-radius: 50%;
      object-fit: cover;
      margin-bottom: 1rem;
      border: 2px solid #ea6c08;
    }

   /* .left-cardowner h2 {
      margin: 0.5rem 0;
      color: #005e79;
    }

    .left-cardowner p {
      color: #555;
      font-size: 0.95rem;
    }*/

   /* .email-btnowner {
      display: inline-block;
      margin-top: 1rem;
      background-color: #ea6c08;
      color: #fff;
      padding: 0.75rem 1.5rem;
      border-radius: 2rem;
      text-decoration: none;
      font-weight: bold;
      transition: background-color 0.3s;
    }

    .email-btnowner:hover {
      background-color: #d45c07;
    }
*/
   
   /* .right-cardowner h3 {
      color: #005e79;
      margin-bottom: 1rem;
    }
*/
    .full-cardowner p, .full-cardowner ul {
      color: #555;
      line-height: 1.6;
    }

    .full-cardowner ul {
      padding-left: 1rem;
      margin-top: 1rem;
    }

    .full-cardowner li {
      margin-bottom: 0.75rem;
      font-weight: bold;
      color: #ea6c08;
    }


.quote {
            font-style: italic;
            font-weight: bold;
        }


/*small icons for social-site*/


   .social-icons {
    margin-top: 1px;
    text-align: center; /* Ensures alignment */
  }
  .social-icons a {
    margin: 0 8px;
    display: inline-block;
  }
  .social-icons img {
    width: 30px; /* Adjust size as needed */
    height: 30px;
    transition: transform 0.3s ease-in-out;
     border: 1px solid #ea6c08;
  }
  .social-icons img:hover {
    transform: scale(1.2); /* Slight zoom effect on hover */
  }


/*********************************
meet ceo-carouse card
*********************************/

        .carousel-container {
    display: flex;
    overflow-x: auto; /* Enables horizontal scrolling */
    scroll-snap-type: x mandatory;
    gap: 10px;
    padding: 10px;
}

/* Default: Large Screens - Show 5.5 Cards */
.carousel-card, .more-card {
    flex: 0 0 calc(100% / 5.5); /* Ensures 5.5 cards visible */
    scroll-snap-align: start;
    background: #fff;
    border-radius: 10px;
    overflow: visible;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
    padding: 10px;
    text-align: center;
    min-width: 150px; /* Consistent size */
}

/* Ensure More Card is the same size */
.more-card {
    position: relative;
    min-width: 150px;
    height: 200px;
    border: 2px solid #ea6c08;
}

/* Overlay for More Card */
.more-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 18px;
    font-weight: bold;
    text-transform: uppercase;
}


        .carousel {
           display: flex;
				    gap: 10px;
				    overflow-x: auto;
				    scroll-snap-type: x mandatory;
				    scrollbar-width: none;
				    scroll-behavior: smooth;
        }

        .carousel::-webkit-scrollbar {
					    display: none;
					}

      
        .carousel-card img {
            width: 100%;
            height: 100px;
            border-radius: 10px;
            object-fit: fill; 
             background-color: #f0f0f0;
            display: block;
        }


         .carousel-card-title {
            font-size: 16px;
            font-weight: bold;
            margin-top: 5px;
        }

        .carousel-card-subtitle {
            font-size: 14px;
            color: #666;
        }


.more-card {
    position: relative;
    min-width: 150px; /* Ensure same width as other cards */
    height: 200px; /* Ensure same height */
    border: 2px solid #ea6c08;
    border-radius: 8px;
    overflow: visible;
    text-align: center;
    flex: 0 0 auto; /* Prevent shrinking */
}

/* Semi-transparent overlay */
.more-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5); /* 50% transparency */
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 18px;
    font-weight: bold;
    text-transform: uppercase;
    text-decoration: none;
    transition: background 0.3s ease-in-out;
}

/* Ensure consistent card sizing */
.carousel-card, .more-card {
    width: 250px; /* Match other cards */
    height: 200px;
}

/* Hover effect */
.more-card:hover .more-overlay {
    background: rgba(0, 0, 0, 0.7);
}


/* Progress Bar Container */

.progress-container {
  display: flex;
  justify-content: center; /* Center horizontally */
  align-items: center; /* Center vertically (if needed) */
  width: 100%;
}

.progress-bar {
  width: 50%; /* Adjust as per requirement */
  height: 3px; /* Thickness of the bar */
/*  background-color: #ccc;*/
background-color: #ea6c08;
  border-radius: 5px;
  position: relative;
}

.progress-bar-fill {
  height: 100%;
  width: 100%; /* Adjust this dynamically */
  background-color: #ccc; /* Change to your brand color */
  border-radius: 5px;
}


@media (max-width: 768px) {
  #scrollLeft, #scrollRight {
    display: none;
  }
}




