/*-----------------------------------------------------------------------------------
    
    Template Name: Arthvedh
    Template URI: https://devitems.com/html/Arthvedh-preview/
    Description: This is html5 template
    Author: HasTech
    Author URI: https://devitems.com/
    Version: 1.0
    
-----------------------------------------------------------------------------------
    
    CSS INDEX
    ===================
	
    1.  About Area
    2.  Information Area
    3.  Services Area
    4.  Advertise Area
    5.  Feature Area
    6.  Project Area
    7.  Asked Area
    8.  Fun Factor Area
    9.  Team Area
    10.  Testimonial Area
    11.  Blog Area
    12.  Client Area
    13.  Homepage Two
    14.  Homepage Three
    15.  Homepage Four
    16.  Project Page
    17.  Project Details Page
    18.  About Page
    19.  Services Page
    20.  Blog Page
    21.  Blog Details Page
    22.  Contact Page

-----------------------------------------------------------------------------------*/


/*----------------------------------------*/


/*  1.  About Area
/*----------------------------------------*/

.about-area,
.about-two-area {
    padding: 120px 0 325px;
    position: relative
}

.question-ask-area {
    bottom: 50px;
    position: fixed;
    right: 50px;
    z-index: 2;
}

.question-ask-area .toggle {
    display: block;
    z-index: 2;
    background-color: transparent;
    border: none;
    padding: 0;
    cursor: pointer
}

.question-popoup {
    background: #ffffff none repeat scroll 0 0;
    bottom: 100%;
    box-shadow: 0 0 5px rgba(3, 3, 3, 0.4);
    height: 168px;
    margin-bottom: 30px;
    padding: 25px 28px 0 32px;
    position: absolute;
    right: 0;
    width: 354px;
    z-index: 2;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    opacity: 0;
    visibility: hidden;
    z-index: -9;
}

.question-popoup::before {
    background-color: #fff;
    box-shadow: 3px 3px 3px rgba(3, 3, 3, 0.2);
    content: "";
    height: 20px;
    margin-top: -10px;
    position: absolute;
    right: 25px;
    top: 100%;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    width: 20px;
}

.question-popoup.active {
    margin-bottom: 15px;
    opacity: 1;
    visibility: visible;
    z-index: 999999;
}

.question-popoup h6 {
    color: #006b63;
    font-size: 16px;
    margin-bottom: 8px;
}

.question-popoup>p {
    color: #303030;
    font-size: 12px;
    line-height: 20px;
    margin-bottom: 12px;
}

.q-text>span {
    display: block;
    font-family: "montserratlight";
    font-size: 12px;
    padding-top: 3px;
}

.q-image img {
    border: 3px solid #efefef;
    border-radius: 50%;
}

.q-image {
    display: inline-block;
    margin-right: 8px;
}

.q-text {
    display: inline-block;
    position: relative;
    top: 4px;
}

.q-btn {
    display: inline-block;
    float: right;
    padding-top: 9px;
}

.q-btn.default-button {}

.q-btn .default-button {
    border-color: #bbbbbb;
    color: #303030;
    font-size: 12px;
    padding: 5px 17px;
}

.q-btn .default-button:hover {
    border-color: #002e5b;
    color: #ffffff;
}

.about-text>h3,
.information-text>h3,
.feature-text>h3 {
    font-size: 20px;
    line-height: 14px;
    margin-bottom: 9px;
}

.about-text>h3>span,
.information-text>h3>span,
.feature-text>h3>span {
    color: #fe5f03ec;
}

.about-text h2,
.information-text h2,
.feature-text h2 {
    font-size: 30px;
    margin-bottom: 25px;
}

.about-text {
    padding-right: 35px;
}

.about-text>p:nth-child(3),
.information-text>p:nth-child(3) {
    margin-bottom: 19px;
}

.single-content .single-title {
    color: #006b63;
    margin-bottom: 8px;
}

.about-text-right {
    padding-top: 80px;
}

.about-text-right .single-content {
    margin-bottom: 27px;
}


/*----------------------------------------*/


/*  2.  Information Area
/*----------------------------------------*/

.information-area,
.information-two-area,
.information-three-area,
.information-four-area {
    padding: 132px 0;
}

.information-chart,
.information-text {
    float: left;
    width: 50%;
}

.information-text .default-button {
    font-size: 12px;
    margin-top: 19px;
}

.information-chart {
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 48px;
}

.information-text {
    padding-left: 15px;
}

.information-chart img {
    padding: 0 20px;
    width: 100%;
}

.canvasjs-chart-credit {
    display: none;
}


/*----------------------------------------*/


/*  3.  Services Area
/*----------------------------------------*/

.service-text>h4 {
    color: #fe5f03ec;
    line-height: 1;
    margin-bottom: 12px;
}

.service-image {
    border: 1px solid #cccccc;
    border-radius: 50%;
    display: inline-block;
    float: left;
    height: 47px;
    position: relative;
    text-align: center;
    width: 47px;
}

.service-image>img {
    bottom: 0;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    text-align: center;
    top: 0;
}

.single-item:hover img {
    -webkit-animation: 500ms ease-in-out 0s normal none 1 running bounceIn;
    animation: 500ms ease-in-out 0s normal none 1 running bounceIn;
}

.service-text {
    overflow: hidden;
    padding-left: 18px;
    padding-right: 12px;
}

.service-area .row:nth-child(2) .col-md-4 {
    padding-left: 15px;
    padding-right: 15px;
}

.service-area .row:nth-child(2) {
    margin-left: -15px;
    margin-right: -15px;
}

.service-area .row .col-lg-4:nth-child(1) .single-item,
.service-area .row .col-lg-4:nth-child(2) .single-item,
.service-area .row .col-lg-4:nth-child(3) .single-item {
    margin-bottom: 47px;
}


/*----------------------------------------*/


/*  4.  Advertise Area
/*----------------------------------------*/

.advertise-area {
    padding: 60px 0;
}

.advertise-text>h2 {
    line-height: 27px;
    margin-bottom: 12px;
}

.advertise-text>p {
    font-family: "montserratlight";
    padding: 0 38px;
}

.advertise-text a {
    margin-top: 16px;
    padding: 7px 23px;
}


/*----------------------------------------*/


/*  5.  Feature Area
/*----------------------------------------*/

.feature-left-column {
    float: left;
    width: 46.5%;
}

.feature-left-column img {
    width: 100%;
}

.feature-right-column {
    float: left;
    width: 53.5%;
}

.feature-text {
    padding-bottom: 20px;
}

.feature-right-column {
    padding: 35px 25px 0;
}

.feature-right-column .service-text {
    padding-right: 0;
}

.custom-row {
    margin-left: -15px;
    margin-right: -15px;
    justify-content: center;
}

.feature-right-column .coustom-col-5:nth-child(1) .single-item,
.feature-right-column .coustom-col-5:nth-child(2) .single-item {
    margin-bottom: 10px;
}

.feature-right-column .coustom-col-5 {
    padding-left: 15px;
    padding-right: 15px;
}


/*----------------------------------------*/


/*  6.  Project Area
/*----------------------------------------*/

.projects-area .custom-row,
.projects-section .custom-row,
.projects-two-area .custom-row {
    margin-left: -4px;
    margin-right: -4px;
}

.projects-area .custom-row .col-lg-4,
.projects-section .custom-row .col-lg-4,
.projects-two-area .custom-row .col-lg-4 {
    padding-left: 4px;
    padding-right: 4px;
}

.projects-area .custom-row .col-lg-4,
.projects-two-area .custom-row .col-lg-4 {
    margin-bottom: 8px !important;
}

.projects-area .custom-row .col-lg-4:nth-child(4),
.projects-area .custom-row .col-lg-4:nth-child(5),
.projects-area .custom-row .col-lg-4:nth-child(6),
.projects-two-area .custom-row .col-lg-4:nth-child(4),
.projects-two-area .custom-row .col-lg-4:nth-child(5),
.projects-two-area .custom-row .col-lg-4:nth-child(6) {
    margin-bottom: 0
}

.project-image>img {
    width: 100%;
}

.project-image,
.service-item-image {
    position: relative
}

.project-image:before,
.service-item-image:before {
    background: rgba(0, 46, 91, 0.8) none repeat scroll 0 0;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    -webkit-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s
}

.grid-item:hover .project-image:before,
.single-item:hover .service-item-image:before {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"
}

.project-style {
    position: relative
}

.project-hover {
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
}

.project-icon {
    display: inline-block;
    height: 21px;
    left: 0;
    line-height: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 50%;
    width: 21px;
    margin-top: -40.5px;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    -webkit-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s
}

.grid-item:hover .project-icon {
    margin-top: -10.5px;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"
}

img {
    line-height: 0;
}

.project-text>h4,
.project-text>p {
    color: #ffffff;
}

.project-text {
    bottom: -5px;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    padding-left: 27px;
    position: absolute;
    -webkit-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
    width: 80%;
}

.grid-item:hover .project-text {
    bottom: 15px;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"
}

.project-text>p {
    line-height: 22px;
}

.project-text>h4 {
    margin-bottom: 10px;
}

.project-text>h4:hover a {
    color: #bcbcbc;
}


/*----------------------------------------*/


/*  7.  Asked Area
/*----------------------------------------*/

.sub_title>h3 {
    font-size: 28px;
    line-height: 23px;
    margin-bottom: 19px;
}

.form-box input,
.form-box textarea {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 1px solid #e1e1e1;
    color: #606060;
    font-size: 13px;
    height: 38px;
    padding: 0 14px;
}

.contact-custom-row {
    margin-left: -21px;
    margin-right: -21px;
}

.contact-custom-row .col-md-6 {
    padding-left: 21px;
    padding-right: 21px;
}

.form-box {
    margin-bottom: 21px;
}

.sub_title {
    margin-bottom: 37px;
}

.form-box>textarea {
    height: 152px;
    padding: 9px 14px;
}

.submit-btn {
    background: #002e5b none repeat scroll 0 0;
    border: 1px solid #002e5b;
    color: #ffffff;
    font-size: 14px;
    margin-top: 28px;
    padding: 7px 18px;
    -webkit-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}

.submit-btn:hover {
    background: #ffffff none repeat scroll 0 0;
    color: #002e5b;
}

.default-panel {
    padding-left: 60px;
}

.asked-area .accordion {
    margin: 0;
    padding-bottom: 29px;
    padding-right: 113px;
}

.card {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 0 none;
    box-shadow: none;
}

.card>.card-header {
    background: inherit;
    border-color: inherit;
    margin: 0;
    padding: 0;
    border-bottom: none;
}

.asked-area .card h4 {
    font-family: "Poppins", sans-serif;
    font-size: 14px;
    margin-bottom: 0;
}

.asked-area .card-title a.collapsed {
    color: #303030;
}

.default-panel .sub_title {
    margin-bottom: 30px;
}

.asked-area .card-title>a {
    background: inherit;
    border-bottom: 0 none;
    color: #006b63;
    display: block;
    padding: 10px 0 10px 37px;
    position: relative;
    text-decoration: none;
    width: 100%;
    -webkit-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s
}

.asked-area .card-title a span:before {
    border: 1px solid #ebebeb;
    color: #606060;
    content: "";
    cursor: pointer;
    font-family: "montserratregular";
    font-size: 24px;
    height: 23px;
    left: 0;
    line-height: 21px;
    margin: auto;
    position: absolute;
    text-align: center;
    top: 8px;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    width: 23px;
    z-index: 67;
}

.asked-area .card-title a span:before {
    content: "-";
    color: #fff
}

.card-default>.card-header+.collapse>.card-body {
    border: 0
}

.asked-area .card-title a.collapsed span:before {
    background: transparent;
    content: "+";
    color: #606060
}

.asked-area .card-title a span:before {
    background: #002E5B;
}

.card-body>p {
    color: #303030;
    margin: 0
}

.card-body {
    padding: 5px 25px 5px 37px;
}

.accordion .card+.card {
    margin-top: 21px;
}


/*----------------------------------------*/


/*  8.  Fun Factor Area
/*----------------------------------------*/

.text-icon>h2 {
    color: #ffffff;
    display: inline-block;
    font-family: "montserratregular";
    font-size: 32px;
    font-weight: 400;
    line-height: 28px;
    position: relative;
    top: 8px;
}

.single-fun-factor h4 {
    color: #fcfcfc;
    font-family: "Poppins", sans-serif;
    font-size: 16px;
    padding-top: 12px;
}

.text-icon img {
    display: inline-block;
}

.text-dark .text-icon>h2,
.single-fun-factor.text-dark h4 {
    color: #1f223e;
}

.fun-factor h2 {
    font-size: 28px
}

.fun-factor-area .single-fun-factor {
    position: relative;
    text-align: center;
    z-index: 1;
}

.fun-custom-row {
    margin-left: -15px;
    margin-right: -15px;
}

.fun-custom-column {
    float: left;
    padding-left: 15px;
    padding-right: 15px;
    width: 20%;
}

.text-icon>h2 {
    color: #ffffff;
    display: inline-block;
    font-family: "montserratregular";
    font-weight: 400;
    line-height: 28px;
    position: relative;
    top: 8px;
}

.single-fun-factor h4 {
    color: #fcfcfc;
    font-family: "montserratregular";
    font-size: 15px;
    font-weight: 400;
}

.text-icon img {
    display: inline-block;
}

.text-dark .text-icon>h2,
.single-fun-factor.text-dark h4 {
    color: #1f223e;
}

.fun-factor h2 {
    font-size: 28px
}

.fun-factor-area .single-fun-factor {
    text-align: center;
}


/*----------------------------------------*/


/*  9.  Team Area
/*----------------------------------------*/

.single-team-member {
    overflow: hidden;
    padding-bottom: 73px;
    position: relative;
}

.member-text>h3 {
    color: #ffffff;
    font-family: "montserratlight";
    font-size: 18px;
    font-weight: 300;
    margin-bottom: 4px;
}

.member-text>h3:hover a {
    color: #006B63;
}

.member-text>span {
    color: #b6b6b6;
}

.member-image {
    position: relative;
    text-align: center
}

.link-effect {
    bottom: -70px;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    -webkit-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
    width: 186px;
    z-index: 1;
}

.single-team-member:hover .link-effect {
    bottom: 0
}

.link-effect li {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 1px solid #878787;
    bottom: 0;
    float: left;
    height: 31px;
    margin: 0 9px;
    text-align: center;
    -webkit-transition: all 0.3s ease-in 0s;
    transition: all 0.3s ease-in 0s;
    width: 33px;
}

.link-effect ul li:nth-child(1) {
    margin-left: 0;
}

.link-effect ul li:nth-child(4) {
    margin-right: 0;
}

.link-effect li:hover {
    background: #006b63 none repeat scroll 0 0;
    border: 1px solid #006b63;
}

.link-effect li a {
    display: block;
    height: 100%;
    padding: 2px 0;
    -webkit-transition: all 0.2s ease-in 0s;
    transition: all 0.2s ease-in 0s;
}

.link-effect li a img {
    -webkit-transition: all 0.2s ease-in 0s;
    transition: all 0.2s ease-in 0s
}

.member-image img {
    width: 100%;
}

.link-effect ul li .s-img,
.link-effect ul li:hover .p-img {
    display: none;
}

.link-effect ul li:hover .s-img {
    display: block;
}

.member-text {
    background: #002e5b none repeat scroll 0 0;
    bottom: 0;
    padding: 13px 0;
    position: absolute;
    text-align: center;
    -webkit-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    width: 100%;
    z-index: 1;
}

.single-team-member:hover .member-text {
    padding-bottom: 180px;
    padding-top: 37px;
}

.member-text>p {
    bottom: -75px;
    color: #b6b6b6;
    position: absolute;
    -webkit-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
    visibility: hidden;
    z-index: -99;
}

.single-team-member:hover .member-text>p {
    bottom: 80px;
    visibility: visible;
    z-index: 1;
}

.single-team-member:hover .link-effect {
    visibility: visible;
    z-index: 1;
    bottom: 42px;
}


/*----------------------------------------*/


/*  10.  Testimonial Area
/*----------------------------------------*/

.owl-item .testi-img img {
    border: 3px solid #ebebeb;
    border-radius: 50%;
    width: auto;
    margin: auto
}

.testi-img {
    padding-bottom: 23px;
}

.testi-text h5 {
    padding-top: 9px;
}

.testi-text>span {
    display: block;
    font-size: 12px;
    padding-top: 4px;
}

.testi-text>p {
    padding: 0 44px;
}

.owl-controls .owl-page span {
    background: #ff0000 none repeat scroll 0 0;
    height: 20px;
    position: absolute;
    top: 0;
    width: 20px;
}

.owl-dots {
    line-height: 5px;
    margin-top: 25px;
}

.owl-dot {
    background: #006B63 none repeat scroll 0 0;
    display: inline-block;
    height: 3px;
    margin: 0 10px;
    width: 20px;
}

.owl-dot.active {
    background: #FDE428 none repeat scroll 0 0;
}


/*----------------------------------------*/


/*  11.  Blog Area
/*----------------------------------------*/

.blog-image {
    position: relative;
    text-align: center;
}

.blog-image>img {
    max-width: 100%;
}

.blog-image>span {
    background: #002e5b none repeat scroll 0 0;
    border-radius: 2px;
    bottom: -18px;
    color: #cbcbcb;
    display: inline-block;
    font-family: "montserratregular";
    left: 0;
    margin: auto;
    padding: 7px 22px;
    position: relative;
    right: 0;
    top: -18px;
    width: auto;
    z-index: 2;
}

.blog-image a {
    position: relative;
    display: block
}

.blog-image a:after {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    box-shadow: 0 0 0 20px rgba(255, 255, 255, 0.3) inset;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    position: absolute;
    top: 0;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    width: 100%;
}

.single-blog:hover .blog-image a:after {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

.blog-text>h4 {
    color: #006b63;
    margin-bottom: 8px;
}

.blog-text>a {
    color: #006b63;
    font-family: "montserratregular";
}

.blog-text>h4:hover a,
.blog-text>a:hover {
    color: #002e5b
}

.blog-text {
    padding-top: 10px;
}

.blog-text>p {
    margin-bottom: 8px;
}


/*----------------------------------------*/
/*----------------------------------------*/
/*  12.  Client Area
/*----------------------------------------*/
.single-client a {
    display: inline-table;
    height: 110px;
    -webkit-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
    width: 210px;
}
.single-client:hover a {}
.single-client span {
    display: table-cell;
    -webkit-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
    vertical-align: middle;
}

.single-client:hover span.s-images {display: table-cell;}

.single-client {
  border: 1px solid #dddddd;
  text-align: center;
}
.owl-carousel .single-client img {
    margin: auto;
    width: auto;
}
.client-area {
    padding: 50px 0;
    /* background-color: #f9f9f9; */
}

.client-carousel .single-client {
  text-align: center; /* Centers the logos */
  padding: 10px; /* Adjusts the spacing around the logo */
}

.client-carousel .single-client img {
  width: 150px; /* Set a fixed width */
  height: 100px; /* Set a fixed height */
  object-fit: contain; /* Ensures the entire image fits inside the container */
  max-width: 100%; /* Ensures the image is responsive */
  max-height: 100%; /* Ensures the image is responsive */
}



/*  13.  Homepage Two
/*----------------------------------------*/

.about-two-area .about-text>h3 span,
.about-two-area .single-content .single-title,
.information-two-area .information-text>h3>span,
.service-style-two .service-text>h4,
.features-style-2 .feature-text>h3>span {
    color: #002e5b;
}

.information-two-area a {
    border-color: #006B63;
    color: #006b63;
}

.information-two-area a:hover {
    background: #006B63;
    color: #fff;
}

.advertise-style-2 .default-button {
    color: #006b63;
}

.advertise-style-2 .default-button:hover {
    background: #006b63 none repeat scroll 0 0;
    color: #ffffff;
}

.features-style-2 .service-text>h4 {
    color: #002e5b
}

.projects-two-area .project-image:before {
    background: rgba(0, 107, 99, 0.8) none repeat scroll 0 0;
}

.projects-two-area .project-text>h4:hover a {
    color: #002e5b;
}

.asked-style-2 .panel-title>a {
    color: #002e5b;
}

.asked-style-2 .panel-title a span:before {
    background: #006B63;
}

.asked-style-2 .submit-btn {
    background: #006b63 none repeat scroll 0 0;
    border-color: #006b63;
}

.asked-style-2 .submit-btn:hover {
    background: #ffffff none repeat scroll 0 0;
    color: #006b63;
}

.team-style-2 .member-text {
    background: #006b63 none repeat scroll 0 0;
}

.team-style-2 .member-text>h3:hover a {
    color: #002E5B;
}

.team-style-2 .link-effect li:hover {
    background: #002e5b none repeat scroll 0 0;
    border-color: #002e5b;
}

.team-style-2 .link-effect li {
    border-color: #707070;
}

.testmonial-carousel-two .owl-dot {
    background: #002e5b none repeat scroll 0 0;
}

.testmonial-carousel-two .owl-dot.active {
    background: #fde428 none repeat scroll 0 0;
}

.blog-two-area .blog-image>span {
    background: #006b63 none repeat scroll 0 0;
    color: #b2b2b2;
}

.blog-two-area .blog-text>h4,
.blog-two-area .blog-text>a {
    color: #002e5b;
}

.blog-two-area .blog-text>h4:hover a,
.blog-two-area .blog-text>a:hover {
    color: #006b63
}


/*----------------------------------------*/


/*  14.  Homepage Three
/*----------------------------------------*/

    
        .about-three-area {
            padding: 100px 0;
            position: relative;
            background: #f8f9fc;
        }

        .about-image-container {
            text-align: center;
            margin-bottom: 25px;
            animation: fadeInLeft 1s ease-in-out;
            height: 100%;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .about-image {
            width: 100%;
            max-width: 100%;
            height: auto;
            border-radius: 20px;
            box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
            transition: transform 0.4s ease, box-shadow 0.4s ease;
            object-fit: cover;
            min-height: 400px;
        }

        .about-image:hover {
            transform: scale(1.03);
            box-shadow: 0 12px 30px rgba(0, 0, 0, 0.25);
        }

        .about-text {
            animation: fadeInRight 1s ease-in-out;
            padding-left: 30px;
            height: 100%;
            display: flex;
            flex-direction: column;
            justify-content: center;
        }

        .about-text h2 {
            color: #1a3a6d;
            font-size: 32px;
            font-weight: 700;
            margin-bottom: 15px;
        }

        .about-text h3 span {
            color: #e63946;
            font-style: italic;
            font-size: 20px;
            display: inline-block;
            margin-bottom: 15px;
        }

        .about-text p {
            font-size: 16px;
            line-height: 1.7;
            color: #444;
            margin-bottom: 15px;
        }

        

        .about-text strong {
            display: block;
            font-size: 16px;
            color: #1a3a6d;
            margin-top: 10px;
        }

        .about-video-link {
            margin-top: auto;
        }

        .about-video-link-btn {
            font-weight: 600;
            text-decoration: underline;
            transition: color 0.3s ease;
        }

        .about-video-link-btn:hover {
            color: #c1121f;
        }

        /* Animations */
        @keyframes fadeInLeft {
            0% {
                opacity: 0;
                transform: translateX(-50px);
            }
            100% {
                opacity: 1;
                transform: translateX(0);
            }
        }

        @keyframes fadeInRight {
            0% {
                opacity: 0;
                transform: translateX(50px);
            }
            100% {
                opacity: 1;
                transform: translateX(0);
            }
        }

        /* Responsive Styling */
        @media (max-width: 992px) {
            .about-text {
                padding-left: 0;
                padding-top: 30px;
            }
            
            .about-image {
                min-height: 350px;
            }
        }

        @media (max-width: 768px) {
            .about-three-area {
                padding: 60px 15px;
            }
            
            .about-text h2 {
                font-size: 26px;
            }
            
            .about-text p {
                font-size: 15px;
            }
            
            .about-image {
                min-height: 300px;
            }
        }

        @media (max-width: 576px) {
            .about-image {
                min-height: 250px;
            }
        }
/*----------------------------------------*/


/*  15.  Homepage Four
/*----------------------------------------*/

/* .service-area {
    position: relative
}

.about-four-area {
    padding: 120px 0 110px;
    position: relative;
}

.about-four-area .about-text-container {
    padding-top: 25px;
}

.about-four-area .about-text>p:nth-child(4) {
    margin-bottom: 16px;
}

.about-four-area .about-text>h4 {
    color: #006b63;
    line-height: 27px;
    margin-bottom: 14px;
} */

.services-section {
    padding: 80px 0;
    background: linear-gradient(135deg, #f8f9ff 0%, #f0f4ff 100%);
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 15px;
}

.section-header {
    text-align: center;
    margin-bottom: 60px;
}

.section-header h2 {
    font-size: 2.5rem;
    color: #2c3e50;
    margin-bottom: 15px;
    position: relative;
    display: inline-block;
}

.section-header h2::after {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    width: 80px;
    height: 4px;
    background: linear-gradient(90deg, #3498db, #2ecc71);
    border-radius: 2px;
}

.section-header p {
    color: #7f8c8d;
    font-size: 1.1rem;
    max-width: 600px;
    margin: 20px auto 0;
}

.services-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: 30px;
}

.service-card {
    background: white;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.service-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.12);
}

.service-icon {
    position: relative;
    height: 200px;
    overflow: hidden;
}

.service-icon img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.5s ease;
}

.service-card:hover .service-icon img {
    transform: scale(1.05);
}

.icon-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to bottom, rgba(52, 152, 219, 0.2), rgba(46, 204, 113, 0.4));
    opacity: 0;
    transition: all 0.3s ease;
}

.service-card:hover .icon-overlay {
    opacity: 1;
}

.service-content {
    padding: 25px;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

.service-content h3 {
    margin: 0 0 15px;
    font-size: 1.4rem;
}

.service-content h3 a {
    color: #2c3e50;
    text-decoration: none;
    transition: color 0.3s ease;
}

.service-content h3 a:hover {
    color: #3498db;
}

.service-content p {
    color: #7f8c8d;
    line-height: 1.6;
    margin-bottom: 20px;
    flex-grow: 1;
}

.service-btn {
    display: inline-flex;
    align-items: center;
    color: #3498db;
    text-decoration: none;
    font-weight: 600;
    transition: all 0.3s ease;
    margin-top: auto;
}

.service-btn span {
    margin-left: 5px;
    transition: transform 0.3s ease;
}

.service-btn:hover {
    color: #2ecc71;
}

.service-btn:hover span {
    transform: translateX(5px);
}

@media (max-width: 768px) {
    .services-grid {
        grid-template-columns: 1fr;
    }
    
    .section-header h2 {
        font-size: 2rem;
    }
}


/*----------------------------------------*/


/*  16.  Project Page
/*----------------------------------------*/

.projects-section .project-text {
    width: 75%;
}

.default-button.more {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 0 none;
    color: #006b63;
    margin-top: 60px;
    padding: 0 5px;
}

.default-button.more i {
    font-size: 16px;
    padding-left: 6px;
}

.default-button.more:hover {
    color: #002e5b;
}

.fix.col-10.text-center {
    line-height: 14px;
}

.projects-section-two .grid-item,
.projects-section-three .grid-item {
    padding-left: 8px;
    padding-right: 8px;
}

.projects-section-two .row,
.projects-section-three .row,
.projects-gallery .row {
    margin-left: -8px;
    margin-right: -8px;
}

.projects-section-two .grid-item .project-text {
    width: 75%;
}

.projects-section-two .grid-item,
.projects-section-three .grid-item {
    margin-bottom: 16px
}

.projects-section-three .grid-item:nth-child(10),
.projects-section-three .grid-item:nth-child(11),
.projects-section-three .grid-item:nth-child(12) {
    margin-bottom: 0
}

.projects-section-three .grid-item .project-text {
    width: 66%;
}

.projects-section-three .container-fluid {
    padding-left: 16px;
    padding-right: 16px;
}

.grid-item.no-gutter {
    margin: 0;
    padding: 0;
}

.projects-section-four .grid-item .project-text {
    width: 85%;
}


/*----------------------------------------*/


/*  17.  Project Details Page
/*----------------------------------------*/

.project-details-left {
    color: #ffffff;
    float: left;
    position: relative;
    width: 67.6%;
    z-index: 9;
}

.project-details-left>img {
    max-width: 100%;
}

.project-details-right {
    background: #f5f7f9 none repeat scroll 0 0;
    box-shadow: -3px 0 7px rgba(3, 3, 3, 0.44);
    float: right;
    margin-left: -241px;
    margin-top: 19px;
    overflow: hidden;
    position: relative;
    width: 35.5%;
    z-index: 9;
}

.projects-gallery .col-md-4 {
    padding-left: 8px;
    padding-right: 8px;
}

.project-right-text {
    color: #303030;
    font-family: "montserratlight";
    font-size: 16px;
    padding: 57px 0 35px;
    text-align: center;
}

.project-right-text>h2 {
    color: #006b63;
    display: inline-block;
    margin-bottom: 36px;
    position: relative;
}

.project-right-text>h2:after {
    background: #006b63 none repeat scroll 0 0;
    border-bottom: 1px solid #ccd9da;
    border-top: 1px solid #ccd9da;
    bottom: -1px;
    content: "";
    height: 3px;
    left: 0;
    position: absolute;
    right: 0;
    width: 100%;
    z-index: -1;
}

.project-right-text>span>span {
    font-family: "montserratregular";
}

.project-right-text>span {
    margin-bottom: 20px;
}

.project-right-text>span a {
    color: #303030;
}

.project-right-text>span a:hover {
    color: #006b63;
}

.project-details-content>h2,
.project-text-details h2 {
    color: #006b63;
    font-size: 28px;
    margin-bottom: 20px;
}

.project-details-content {
    padding: 46px 0 75px;
}

.project-details-content>p:nth-child(2) {
    margin-bottom: 20px;
}

.project-details-image {
    margin-left: -60px;
}

.project-details-area .row:nth-child(3) .col-md-7 {
    padding-left: 0;
}

.project-text-details {
    padding-top: 22px;
}

.project-text-details>p {
    margin-bottom: 28px;
}

.content-text>p {
    margin-bottom: 24px;
    padding-left: 20px;
    position: relative;
}

.content-text>p:before {
    content: "";
    font-family: FontAwesome;
    left: 0;
    position: absolute;
    top: -3px;
}

.projects-gallery .grid-item {
    margin-bottom: 0;
}


/*----------------------------------------*/


/*  18.  About Page
/*----------------------------------------*/

/* .about-banner-area {
    padding-bottom: 364px;
    padding-top: 410px;
} */

.nav-tabs>li>a {
    background: #dbdce0 none repeat scroll 0 0;
    border: 1px solid #c4c6c8;
    border-radius: 0;
    color: #606060;
    font-family: "montserratregular";
    font-size: 16px;
    margin-right: 50px;
    padding: 10px 15px;
}

.nav-tabs>li>a:hover,
.nav-tabs>li>a.active,
.nav-tabs>li>a.active:focus,
.nav-tabs>li>a.active:hover {
    background: #006963 none repeat scroll 0 0;
    border-color: #006963;
    color: #ffffff;
}

.tab-pane>p:nth-child(1) {
    margin-bottom: 13px;
}

.tab-content {
    margin-top: 25px;
}

.about-banner-text {
    padding-right: 105px;
}

.nav-tabs {
    border-bottom: none;
}


/*----------------------------------------*/


/*  19.  Services Page
/*----------------------------------------*/

.service-banner-left {
    display: inline-block;
    float: left;
}

.service-banner-right .information-text {
    padding-left: 40px;
    width: 100%;
}

.service-banner-right {
    overflow: hidden;
    padding-top: 95px;
}

.service-banner-right .information-text>p:nth-child(3) {
    margin-bottom: 28px;
}

.bg-rotate,
.bg-rotate-2,
.bg-rotate-3 {
    overflow: hidden;
    position: relative;
}

.bg-rotate:before,
.bg-rotate-2:before,
.bg-rotate-3:before {
    background: #f5f7f9 none repeat scroll 0 0;
    content: "";
    height: 55%;
    left: 0;
    position: absolute;
    top: -267px;
    -webkit-transform: skewY(-21.5deg);
    transform: skewY(-21.5deg);
    width: 100%;
    z-index: -1;
}

.service-banner-right .information-text {
    padding-left: 30px;
}

.service-main-area-2 .service-banner-right .information-text {
    padding-left: 37px;
}

.service-main-area-2 .service-banner-right {
    padding-top: 75px;
}

.service-item-image:before {
    background: rgba(0, 46, 91, 0.85) none repeat scroll 0 0;
}

.service-item-image img {
    width: 100%;
}

.single-item:hover .service-item-image img {
    -webkit-animation: 0s ease 0s normal none 1 running none;
    animation: 0s ease 0s normal none 1 running none;
}

.service-item-image .default-button {
    background: #ffffff none repeat scroll 0 0;
    border-color: #ffffff;
    bottom: 0;
    display: block;
    height: 35px;
    left: 0;
    margin: auto;
    padding: 7px 15px;
    position: absolute;
    right: 0;
    top: -26%;
    width: 130px;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    -webkit-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s
}

.service-item-image {
    text-align: center;
}

.single-item:hover .service-item-image .default-button {
    top: 0;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"
}

.service-item-image .default-button:hover {
    background: rgba(255, 255, 255, 0.4) none repeat scroll 0 0;
    color: #002e5b;
}

.service-main-area-2 .service-text {
    padding-left: 0;
    padding-top: 28px;
}

.service-main-area-2 .service-area .col-md-4 {
    padding-left: 15px;
    padding-right: 15px;
}

.service-main-area-2 .service-area .row:nth-child(2) {
    margin-left: -15px;
    margin-right: -15px;
}

.service-main-area-2 .service-area .row .col-md-4:nth-child(1) .single-item,
.service-main-area-2 .service-area .row .col-md-4:nth-child(2) .single-item,
.service-main-area-2 .service-area .row .col-md-4:nth-child(3) .single-item {
    margin-bottom: 39px;
}

.bg-rotate-2:before {
    height: 38%;
}

.bg-rotate-3:before {
    height: 66%;
    -webkit-transform: skewY(-16.5deg);
    transform: skewY(-16.5deg);
}

.service-main-area-2 .information-area .information-chart {
    padding: 0;
    width: 100%;
}

.service-main-area-2 .information-area .information-text {
    padding: 0 25px 0 60px;
    width: 100%;
}

.service-main-area-2 .information-area .information-chart>img {
    padding: 0;
}

.service-main-area-2 .information-area .information-chart {
    padding: 0 40px 0 0;
    width: 100%;
}

.service-main-area-2 .information-area .information-text {
    padding: 0;
    width: 100%;
}

.service-main-area-2 .information-area .information-chart>img {
    padding: 0;
}

.service-main-area-2 .information-area {
    padding: 63px 0 0;
}

.service-main-area-2 .service-banner-left {
    width: 20%;
}

.service-main-area-2 .service-banner-left>img {
    margin-left: -76px;
}

.information-area .column:nth-child(1) {
    float: left;
    width: 48%;
}

.information-area .column:nth-child(2) {
    float: left;
    width: 52%;
}

.service-main-area-2.bg-rotate-3 .service-banner-right {
    overflow: inherit;
    width: 80%;
}

.service-main-area-2.bg-rotate-3 .service-banner-right .information-text {
    padding-left: 0;
    padding-right: 0;
    padding-top: 40px;
    width: 52%;
}

.service-main-area-2.bg-rotate-3 .service-banner-right {
    padding-top: 0;
}

.service-banner-right-image {
    float: right;
    margin-right: -120px;
    width: 35%;
}

.research-image {
    float: right;
}

.research-image>img {
    padding-left: 15px;
    width: 100%;
}

.reasearch-area .information-text {
    padding-left: 0;
    padding-right: 60px;
    width: 100%;
}

.reasearch-area .information-text:nth-child(1) {
    margin-bottom: 32px;
}


/*----------------------------------------*/


/*  20.  Blog Page
/*----------------------------------------*/

.blog-section .single-blog {
    margin-bottom: 51px;
}

.blog-section .col-xl-3:nth-child(13) .single-blog,
.blog-section .col-xl-3:nth-child(14) .single-blog,
.blog-section .col-xl-3:nth-child(15) .single-blog,
.blog-section .col-xl-3:nth-child(16) .single-blog {
    margin-bottom: 0;
}

.sidebar-widget-title>h5 {
    border-bottom: 1px solid #cccccc;
    font-size: 18px;
    padding-bottom: 13px;
}

.sidebar-widget-title {
    margin-bottom: 27px;
}

.single-post-widget .post-img {
    float: left;
    width: 76px;
}

.single-post-widget .post-texts {
    overflow: hidden;
    padding-left: 12px;
}

.post-img>a {
    display: inline-block;
    position: relative;
}

.post-img img {
    width: 100%;
}

.post-texts>h5 {
    font-size: 16px;
    margin-bottom: 6px;
}

.post-info {
    font-family: "montserratlight";
    font-size: 12px;
    margin-bottom: 5px;
}

.post-texts h5:hover a {
    color: #002e5b;
}

.single-post-widget {
    border-bottom: 1px solid #cccccc;
    margin-bottom: 30px;
}

.post-texts>p {
    margin-bottom: 8px;
}

.single-post-widget:last-child {
    margin-bottom: 0;
}

.single-sidebar-widget {
    margin-bottom: 50px;
}

.categories>li {
    border-bottom: 1px solid #cccccc;
    display: block;
    line-height: 15px;
    margin-bottom: 19px;
    padding-bottom: 8px;
}

.categories>li:last-child {
    margin: 0;
}

.sidebar-contact-info {
    background: #002e5b none repeat scroll 0 0;
    padding: 29px 17px 21px;
    text-align: center;
}

.sidebar-contact-info>p {
    color: #dddddd;
    font-size: 12px;
    margin-bottom: 13px;
}

.sidebar-contact-info>h4 {
    color: #ffffff;
    font-size: 16px;
    margin-bottom: 8px;
}

.sidebar-contact-info .default-button {
    background: #033769 none repeat scroll 0 0;
    border-radius: 2px;
    box-shadow: 0 0 18px rgba(3, 3, 3, 0.38);
    color: #989898;
    font-size: 12px;
    padding: 5px 19px;
}

.sidebar-contact-info .default-button:hover {
    background: #ffffff none repeat scroll 0 0;
    color: #002e5b;
}

.post-img>a:before {
    background: rgba(0, 46, 91, 0.75) none repeat scroll 0 0;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    position: absolute;
    top: 0;
    -webkit-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    width: 100%;
}

.single-post-widget:hover .post-img>a:before {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

.month-select {
    background: rgba(0, 0, 0, 0) url("img/icons/arrow.png") no-repeat scroll right 0;
    border: 1px solid #ccc;
    height: 43px;
    line-height: 43px;
    width: 100%;
}

.month-select select {
    -moz-appearance: none;
    background: rgba(0, 0, 0, 0) none no-repeat scroll 0 0;
    border: 0 none;
    color: #606060;
    cursor: pointer;
    height: 100%;
    padding: 0 10px;
    -webkit-transition-duration: 0.4s;
    transition-duration: 0.4s;
    -webkit-transition-property: height;
    transition-property: height;
}

.month-select option {
    border: 0 solid #cccccc;
    padding-left: 10px;
}

.twt-text p>a {
    color: #006b63;
    font-family: "montserratregular";
}

.twt-text p>a:hover {
    color: #002e5b;
}

.twt-text {
    border-bottom: 1px solid #cccccc;
    margin-bottom: 21px;
    padding-bottom: 12px;
}

.twt-text>p {
    margin-bottom: 8px;
}

.twt-text:last-child {
    margin-bottom: 0;
}

.single-sidebar-widget .tags>li>a {
    border: 1px solid #cccccc;
    color: #303030;
    display: inline-block;
    line-height: 27px;
    padding: 0 10px;
}

.single-sidebar-widget .tags>li a:hover {
    background: #002e5b none repeat scroll 0 0;
    border-color: #002e5b;
    color: #ffffff;
}

.single-sidebar-widget .tags>li {
    display: inline-block;
    margin-bottom: 12px;
    margin-right: 4px;
}

.single-sidebar-widget .tags {
    border-bottom: 1px solid #cccccc;
    padding-bottom: 14px;
}

.categories a:hover {
    color: #002e5b;
}

.blog-section.sidebar .col-xl-4.col-lg-6:nth-child(10) .single-blog,
.blog-section.sidebar .col-xl-4.col-lg-6:nth-child(11) .single-blog,
.blog-section.sidebar .col-xl-4.col-lg-6:nth-child(12) .single-blog {
    margin-bottom: 0;
}

.blog-image>a {
    display: block;
}

.blog-image>a img {
    width: 100%;
}

.single-sidebar-widget:last-child {
    margin: 0;
}


/*----------------------------------------*/


/*  21.  Blog Details Page
/*----------------------------------------*/

.blog-details-text>h2 {
    font-size: 28px;
    margin-bottom: 18px;
}

.blog-details-text {
    padding-right: 24px;
    padding-top: 13px;
}

.blog-details-text>p {
    margin-bottom: 23px;
}

.blog-details-text>p.marked {
    background: #f6f7f9 none repeat scroll 0 0;
    font-size: 16px;
    font-style: italic;
    line-height: 28px;
    margin: 33px 0 35px;
    padding: 25px 38px 49px 44px;
    position: relative;
}

.blog-details-text>p.marked:after {
    background: #002e5b none repeat scroll 0 0;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 7px;
}

.like-share>span {
    color: #666666;
    display: inline-block;
    font-size: 13px;
}

.like-share>span i {
    padding-right: 7px;
}

.like-share>span:first-child {
    margin-right: 62px;
}

.like-share {
    padding-top: 7px;
}

.comments {
    padding: 49px 0 77px;
}

.comment-text {
    padding-left: 22px;
    padding-right: 65px;
}

.comments .details-title {
    margin-bottom: 46px;
}

.author-image {
    border: 1px solid #ebebeb;
    display: inline-block;
    float: left;
}

.author-info h5 {
    font-size: 14px;
    line-height: 12px;
    margin-bottom: 8px;
}

.author-info span {
    font-family: "montserratlight";
    font-size: 12px;
    margin-bottom: 11px;
}

.comment-text>p {
    color: #565656;
    margin-bottom: 8px;
}

.comment-form input,
.comment-form textarea {
    background: #ffffff none repeat scroll 0 0;
    border: 1px solid #ebebeb;
    color: #606060;
    font-size: 12px;
    height: 34px;
    margin-bottom: 30px;
    padding: 0 15px;
}

.comment-form input::-moz-placeholder,
.comment-form textarea::-moz-placeholder,
.contact-form-left input::-moz-placeholder,
.contact-form-left textarea::-moz-placeholder {
    /* Firefox 19+ */
    color: #606060;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

.comment-form textarea,
.single-post-area textarea {
    height: 200px;
    padding: 12px 15px;
    resize: none;
    margin-bottom: 33px
}

.reply {
    color: #303030;
    font-family: "montserratregular";
    font-size: 13px;
}

.single-comment {
    margin-bottom: 40px;
}

.reply-comment {
    padding-left: 53px
}

.reply-comment .comment-text {
    padding-right: 20px;
}

.author-info>h5:hover a {
    color: #002e5b;
}

.new-comment-post {
    padding-right: 60px;
}

.new-comment-post .details-title {
    margin-bottom: 44px;
}

.comment-form .default-button {
    background: #002e5b none repeat scroll 0 0;
    color: #ffffff;
    padding: 9px 22px;
}

.comment-form .default-button:hover {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    color: #002e5b;
}


/*----------------------------------------*/


/*  22.  Contact Page
/*----------------------------------------*/

.contact-form-area input,
.contact-form-area textarea {
    background: #fbfbfb none repeat scroll 0 0;
    border: 1px solid #dbdbdb;
    color: #606060;
    height: 36px;
    padding: 0 12px;
    margin-bottom: 22px;
}

.contact-form-area textarea {
    height: 132px;
    padding: 10px 12px;
    resize: none;
}

.contact-form-area button.button {
    padding: 0 32px;
}

.contact-information {
    background: #ffffff none repeat scroll 0 0;
    margin: auto;
    overflow: hidden;
    padding: 72px 0 76px 0;
    position: relative;
    z-index: 1;
}

.address-area .contact-information {
    margin-top: 0;
}

.single-contact-info {
    float: left;
    width: 33.333%;
}

.single-contact-info .contents {
    position: relative;
}

.single-contact-info img {
    left: 0;
    position: absolute;
    top: 5px;
}

.contents .info-text {
    font-family: "montserratlight";
    /* padding-left: 40px; */
}

.contents .info-text span:first-child {
    margin-bottom: 2px;
}

.single-contact-info:last-child .contents {
    float: right;
}

.single-contact-info:nth-child(2) .contents {
    margin: 0 80px;
}

.contact-form-left {
    float: left;
    padding-right: 38px;
    width: 72%;
}

.contact-form-right {
    float: left;
    width: 26%;
    padding-top: 62px;
}

.contact-form-left .details-title {
    margin-bottom: 42px;
}

.contact-form-left .default-button.submit-btn {
    border-radius: 0;
    margin-top: 18px;
    padding: 9px 32px;
}

.contact-form-right .sidebar-contact-info {
    background: rgba(0, 46, 91, 0.85) none repeat scroll 0 0;
    padding: 70px 34px 74px;
}

.contact-form-right .sidebar-contact-info>h4 {
    font-size: 18px;
    margin-bottom: 14px;
}

.contact-form-right .sidebar-contact-info .default-button {
    border: 0
}






/* Keyframes for breathing animation */
@keyframes breathe {
    0%,
    100% {
      transform: scale(1);
    }
    50% {
      transform: scale(1.1); /* Increase the size slightly at the midpoint */
    }
  }
  
  /* Phone Call Icon Styles */
  .float-enquiry {
    position: fixed;
    bottom: 50px; /* Adjust based on your layout */
    left: 10px; /* Position it on the left */
    z-index: 9999;
    width: 60px; /* Size of the icon */
    height: 60px; /* Size of the icon */
    border-radius: 50%; /* Round icon */
    background-color: #0ea01a; /* Background color for visibility */
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
    animation: breathe 2s ease-in-out infinite; /* Apply the breathing animation */
  }
  
  /* WhatsApp Button Styles */
  .whatsapp-button {
    position: fixed;
    bottom: 50px;
    right: 10px;
    z-index: 9999;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background-color: #0ea01a; /* Background color for visibility */
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
    animation: breathe 2s ease-in-out infinite; /* Apply the breathing animation */
  }
  
  .whatsapp-button i {
    color: #fff; /* Icon color */
  }
  
  .contact-icons {
    font-size: 12px; /* Adjust icon size for mobile */
  }
  .icon-png {
    height: 30px;
    width: auto;
    align-items: center;
    margin-top: 2px;
  }
  /* Popout Chat UI */
  .chat-popout {
    position: fixed;
    bottom: 120px; /* Adjusts above WhatsApp button */
    right: 10px;
    z-index: 9998;
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
    width: 150px;
    padding: 10px;
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: Arial, sans-serif;
    font-size: 14px;
    animation: popout 1.5s ease-in-out infinite;
  }
  
  .chat-popout::before {
    content: '';
    position: absolute;
    bottom: -8px;
    right: 10px;
    border-width: 8px;
    border-style: solid;
    border-color: #fff transparent transparent transparent;
  }
  
  .chat-popout i {
    color: #0ea01a;
    font-size: 18px;
  }
  
  /* Media query for mobile devices */
  @media (max-width: 600px) {
    .float-enquiry {
      position: fixed;
      bottom: 20px; /* Adjust position for mobile if necessary */
      left: 10px; /* Adjust position for mobile if necessary */
      width: 50px; /* Adjust size for mobile */
      height: 50px; /* Adjust size for mobile */
    }
    .whatsapp-button {
      position: fixed;
      bottom: 20px; /* Adjust position for mobile if necessary */
      right: 10px; /* Adjust position for mobile if necessary */
      width: 50px; /* Adjust size for mobile */
      height: 50px; /* Adjust size for mobile */
    }
    .contact-icons {
      font-size: 12px; /* Adjust icon size for mobile */
    }
    .icon-png {
      height: 30px;
      width: auto;
      align-items: center;
      margin-top: 2px;
    }
  
  }
  





/* Modal Background Styling */
.modal-backdrop {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
      background-color: transparent;
    z-index: 1040;
  }
  
  /* Modal Styles */
  #quoteModal {
    position: fixed;
    z-index: 1050;
    top: 55%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #e4c206;
    max-width: 800px; /* Desktop max width */
    width: 100%; /* Default to full width */
    padding: 20px;
    border-radius: 5px;
    box-sizing: border-box; /* Ensure padding doesn't affect width */
    overflow-y: auto; /* Allow scrolling */
    max-height: 90%; /* Set max height for the modal */
  }
  
  /* Show modal when active */
  .modal-active {
    display: block;
  }
  
  /* Mobile/Tablet Styles */
  @media only screen and (max-width: 768px) {
    /* Modal Background Styling */
    .modal-backdrop {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%; /* Ensure the background covers the full screen */
      background-color: transparent;
      z-index: 1040;
    }
  
    /* Modal Styles */
    #quoteModal {
      max-width: 95%; /* Ensure it fits properly on mobile */
      width: 95%; /* Adjust the width for mobile view */
      padding: 15px; /* Reduce padding for mobile */
      top: 50%; /* Center the modal vertically */
      left: 50%; /* Center the modal horizontally */
      transform: translate(-50%, -50%); /* Center the modal */
      font-size: 14px; /* Adjust font size for mobile */
      box-sizing: border-box; /* Ensure padding doesn't affect the width */
      overflow-y: auto; /* Allow scrolling if content exceeds viewport */
      max-height: 80%; /* Limit max height for mobile devices */
    }
  }
  
  /* Extra small devices */
  @media only screen and (max-width: 480px) {
    #quoteModal {
      padding: 10px; /* Further reduce padding for very small screens */
      font-size: 12px; /* Reduce font size for better readability */
    }
  }
  
  #feedback1 {
    height: 30px; /* Keeps height suitable for visibility */
    width: 150px; /* Adjusts width to fit content */
    position: fixed;
    right: -60px; /* Stays outside the main view */
    top: 50%; /* Vertically centered */
    z-index: 1000;
    transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    background-color: #02175a; /* Background for visibility */
    color: #F9C113; /* Text color */
    text-align: center; /* Center text horizontally */
 
    font-family: Arial, sans-serif;
    font-size: 15px;
    box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.3); /* Adds shadow for depth */
    border-radius: 5px 5px 0 0; /* Rounded top corners */
    cursor: pointer;
  }
  
  #feedback1 a {
  color: #F9C113;
    text-decoration: none; /* Removes underline from link */
    text-align: center;
    
  }
  
  /* Adjustments for smartphones and tablets */
  @media (max-width: 768px) {
    #feedback1 {
        position: fixed;
      height: 46px; /* Slightly reduced height */
      width: 120px; /* Adjust width for smaller screens */
      font-size: 14px; /* Reduce font size for readability */
      line-height: 30px; /* Adjust line height */
      right: -50px; /* Adjust right offset for smaller screens */
    }
  }
  
  @media (max-width: 480px) {
    #feedback1 {
        position: fixed;
      height: 30px; /* Further reduced height for smartphones */
      width: auto; /* Narrower button for smaller devices */
      font-size: 13px; /* Smaller font for compact design */
      line-height: 0px; /* Adjust line height */
      right: -45px; /* Better fit for narrower screens */
    }
  }

  
  
  .progress-bar {
    width: 0;
    transition: width 2s ease-in-out; /* Smooth transition for width change */
}

.calculator-area {

    border-radius: 8px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

.mutual-fund-calculator-form {
    background-color: #ffffff;
    padding: 30px;
    border-radius: 8px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

.form-label {
    font-size: 16px;
    font-weight: 600;
    color: #495057;
}

.form-control {
    border-radius: 5px;
    border: 1px solid #ced4da;
    padding: 10px;
    font-size: 16px;
}

.form-control:focus {
    border-color: #007bff;
    box-shadow: 0 0 5px rgba(0, 123, 255, 0.25);
}

button {
    font-size: 18px;
    font-weight: bold;
    background-color: #007bff;
    border: none;
    padding: 12px;
    color: #fff;
    transition: all 0.3s ease;
}

button:hover {
    background-color: #0056b3;
}

#result {
    padding: 20px;
    background-color: #f1f1f1;
    border-radius: 8px;
    border: 1px solid #dcdcdc;
}

#result strong {
    color: #28a745;
    font-size: 24px;
}

.mt-4 {
    margin-top: 1.5rem !important;
}
.calculator-area {

    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

.form-group label {
    font-weight: 500;
}

.btn-primary {
    background-color: #007bff;
    border: none;
    font-size: 16px;
}

.btn-primary:hover {
    background-color: #0056b3;
}

.results .alert {
    font-size: 16px;
    margin: 5px 0;
}

@media (max-width: 768px) {
    .calculator-area {
        padding: 20px;
    }
}



  .text-arthvedhTwo{
    color: rgba(128, 0, 0, 0.74);
  }

   /* Responsive logo styles */
   .client-img img {
    width: auto; /* Default width for smaller devices */

    object-fit: contain; /* Maintain aspect ratio */
    display: block;
    margin: auto; /* Center the image horizontally */
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
    .client-img img {
        width: auto; /* Adjust width for medium screens */
        height: 100px; /* Adjust height for medium screens */
    }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
    .client-img img {
        width: auto; /* Larger width for desktops */
        height: 200px; /* Larger height for desktops */
    }
}



 /* Custom CSS for the b tag */
 .text-arthvedh b {
    font-weight: bold;
    font-size: 1.5em; /* Adjust size if needed */
}


/* General styles for video containers */
.video-container {
    position: relative;
    width: 100%; /* Ensure the video takes up the full width of its container */
    padding-bottom: 56.25%; /* Maintain 16:9 aspect ratio (height / width = 9/16 = 56.25%) */
    overflow: hidden;
    border-radius: 12px; /* Optional: Add rounded corners */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Optional: Add shadow for aesthetics */
}

.video-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%; /* Make the iframe scale to the container's width */
    height: 100%; /* Maintain aspect ratio */
    border: none; /* Remove the iframe border */
}

/* Additional column spacing */
.column-padding {
    margin-bottom: 20px; /* Space between videos */
}

/* Responsive adjustments for different screen sizes */
@media (max-width: 768px) { /* For tablets */
    .column-padding {
        width: 50%; /* Two videos per row on tablets */
    }
}

@media (max-width: 576px) { /* For mobile phones */
    .column-padding {
        width: 100%; /* One video per row on smaller screens */
    }
}

  /* General styles for images */
.client-items img {
    width: 100%; /* Make the image responsive to its container */
    height: auto; /* Maintain aspect ratio */
    object-fit: contain; /* Ensure the image fits within its container without being cropped */
}

/* Additional spacing and alignment */
.client-items .col-md-3 {
    margin-bottom: 15px; /* Space between the images */
}

/* Responsive adjustments for different screen sizes */
@media (max-width: 768px) { /* For tablets */
    .client-items .col-md-3 {
        width: 50%; /* Two images per row on tablets */
    }
}

@media (max-width: 576px) { /* For mobile phones */
    .client-items .col-md-3 {
        width: 100%; /* One image per row on smaller screens */
    }
}

.alert-orange {
    background-color: orange;
    color: white;
}