@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;
}


/*********************************
6. Home
*********************************/

.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;
}

/*********************************
7. Meet the CEO
*********************************/

.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;*/
	  background-color: rgba(255, 255, 255, 0.3); /* 50% transparent white */
      border-radius: 1rem;
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
      padding: 1rem;
      flex-shrink: 0;
      width: auto;
      height: 300px;
      display: flex;
    flex-direction: column;
    align-items: center;


    }

/*this is for view profile button*/
    .card-wrapper {
    	display: flex;
    flex-direction: column; /* Stack elements in mobile */
    align-items: center;
    gap: 10px;
    position: relative; /* Allows absolute positioning of the button */
}


.row {
    display: -ms-flexbox;
    display: flex;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: 1px;
    margin-left: 1px;
}

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

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

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

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



.email-btnowner {
    background-color: #ea6c08; /* YoSoftTech Orange */
    color: white;
    padding: 10px 20px;
    border-radius: 20px;
    text-decoration: none;
    font-weight: bold;
    display: inline-block;

    position: absolute;
    bottom: 0; /* Aligns button to the bottom */
    right: -120px; /* Moves button outside the card to the right */
}


   /* .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: 100%;
      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;
    }





/*********************************
7. About
*********************************/

.about
{
	width: 100%;
	padding-top: 50px;
	padding-bottom: 60px;
	background: #FFFFFF;
}
.about_row
{
	margin-top: 2px;
}
.about_col_left
{
	padding-right: 25px;	
}
.about_col_right
{
	padding-left: 25px;
}
.about_col_middle
{
	padding-left: 20px;
	padding-right: 20px;
}
.about_item_image
{
	width: 100%;
	overflow: hidden;
}
.about_item_image img
{
	max-width: 100%;
	-webkit-transition: all 2000ms ease;
	-moz-transition: all 2000ms ease;
	-ms-transition: all 2000ms ease;
	-o-transition: all 2000ms ease;
	transition: all 2000ms ease;
}
.about_item:hover .about_item_image img
{
	-webkit-transform: scale(1.1);
	-moz-transform: scale(1.1);
	-ms-transform: scale(1.1);
	-o-transform: scale(1.1);
	transform: scale(1.1);
}
.about_item_title
{
	margin-top: 5px;
}
.about_item_title a
{
	font-family: 'Roboto Slab', serif;
	font-size: 20px;
	font-weight: 700;
	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;
}
.about_item_title a:hover
{
	color: #14bdee;
}
.about_item_text
{
	margin-top: 1px;
}
.about_item_text
{
	line-height: 2;
}

/*********************************
8. Feature
*********************************/

.feature
{
	width: 100%;
	padding-top: 30px;
	padding-bottom: 50px;
}
.feature_background
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}
.feature_row
{
	margin-top: 72px;
}
.feature_content
{
	padding-right: 54px;
}
.elements_accordions
{
	
}
.accordion_container
{
	background: #FFFFFF;
	border-radius: 6px;
	box-shadow: 0px 1px 10px rgba(0,0,0,0.1);
	padding-left: 2px;
	padding-right: 2px;
	padding-top: 2px;
	padding-bottom: 2px;
}
.accordion_container:not(:last-child)
{
	margin-bottom: 10px;
}
.accordion
{
	width: 100%;
	padding-left: 27px;
	cursor: pointer;
	color: #000000;
	font-size: 14px;
	font-weight: 500;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.accordion div
{
	max-width: 100%;
	overflow: hidden;
	white-space: nowrap;
	font-family: 'Roboto Slab', serif;
	font-size: 20px;
	font-weight: 700;
	color: #384158;
}
.accordion::before
{
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: -1px;
	left: 0;
	height: 100%;
	font-family: 'FontAwesome';
	content: '\f105';
	font-size: 24px;
	color: #384158;
	font-weight: 400;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.accordion.active::before
{
	content: '\f107';
	color: #14bdee;
}
.accordion_panel
{
	padding-right: 8px;
	padding-left: 30px;
	padding-top: 9px;
	max-height: 0px;
	overflow: hidden;
	-webkit-transition: all 500ms ease;
	-moz-transition: all 500ms ease;
	-ms-transition: all 500ms ease;
	-o-transition: all 500ms ease;
	transition: all 500ms ease;
}
.accordion.active + .accordion_panel
{
	margin-bottom: 20px;
}
.accordion_panel p
{
	font-size: 14px;
	font-weight: 400;
	color: #76777a;
	line-height: 2;
}
.feature_video
{
	width: calc(100% + 15px);
	left: -15px;
	height: 363px;
	margin-top: -4px;
}
.feature_video_background
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	border-radius: 6px;
}
.feature_video_button
{
	display: block;
	width: 60px;
	height: 60px;
	z-index: 10;
	outline: none;
}