/* body{
    color: #000;
} */

body{
    font-family: Samsung Sans,Helvetica,"sans-serif";
}

.blog-image{
    background-size: cover;
    padding-bottom: 75%;
    background-position: center;
    margin: 1rem 0;
    width: 100%;
    border-radius: 0.42rem;
}

.footer-title{
    border-bottom: .5px solid white;
    padding-bottom: 1rem;
    font-weight: 900;
    width: auto;
    float: left;
}

.blog-detail-card img{
    max-width: 100%;
}

.banner-image{
    width: 100%;
    border-radius: 0.42rem;
}

.youtube-container {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 */
    height: 0;
    border-radius: 0.42rem;
    overflow: hidden;
}

.youtube-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

#servicemap {
    height: 50vh;
    border-radius: 0.42rem;
    overflow: hidden;
}

#projectmap {
    height: 80vh;
    border-radius: 0.42rem;
    overflow: hidden;
}

.groupSwiper{
    margin: 0 -1rem;
}

.group-card{
    margin: 1rem;
    transform: scale(1);
    transition: transform 0.2s ease;
}

.group-card:hover {
    transform: scale(1.1);
    background-color: #001f60 !important;
}

.group-icon{
    width: 45px;
    height: 45px;
    background-color: #000;
    -webkit-transition: background-color 200ms ease-in-out;
    -ms-transition: background-color 200ms ease-in-out;
    transition: background-color 200ms ease-in-out;
    transition: transform 0.2s ease;
    transform: scale(1);
}

.card-service{
    transform: scale(1);
    transition: transform 0.2s ease;
    border: 1px solid rgb(223 225 231) !important;
    box-shadow: none !important;
}

.card-service:hover{
    transform: scale(1.1);
    background-color: #001f60 !important;
    box-shadow: 0px 0px 30px 0px rgb(82 63 105 / 5%) !important;
}

.card-service:hover .group-icon, .group-card:hover .group-icon, .group-icon:hover{
    background-color: #fff;
    transform: scale(1.2);
}

.card-service:hover p, .card-service:hover a, .group-card:hover a{
    color: #fff !important;
}

.group-card .card-title {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    height: 3rem;
    overflow: hidden;
}

#project-map-aside{
    position: absolute;
    z-index: 1000;
    margin-left: 2rem;
    margin-top: 2rem;
}

.youtube-preview{
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 2;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50%;
}

.youtube-preview span{
    text-align: center;
    display: block;
    content: " ";
    background: none;
    background-size: 60px 60px;
    height: 45px;
    width: 45px;
    position: absolute;
    z-index: 4;
    top: 50%;
    left: 50%;
    margin-left: -22.5px;
    margin-top: -22.5px;
    padding: 0;
    padding-top: 3px;
    border: 0;
    cursor: pointer;
    background-color: #f52234;
    border-radius: 45px;
}

[ng\:cloak], [ng-cloak], .ng-cloak {
    display: none !important;
}

.samsung_sharp_sans_k_font{
    font-family: 'Samsung Sharp Sans K';
}

.samsung_sharp_sans_font{
    font-family: 'Samsung Sharp Sans';
}

.samsung_sans_font{
    font-family: 'Samsung Sans';
}

@media only screen and (max-width: 767px) {

    #project-map-aside{
        position: relative;
        margin-left: 0;
    }

}

.header{
    background-color:  #ffffff;
}

.header-fixed .header-menu .menu-nav>.menu-item>.menu-link .menu-text {
    color: #000000;
}

.header-menu .menu-nav>.menu-item:hover:not(.menu-item-here):not(.menu-item-active)>.menu-link, .header-menu .menu-nav>.menu-item.menu-item-hover:not(.menu-item-here):not(.menu-item-active)>.menu-link, .header-menu .menu-nav>.menu-item.menu-item-here>.menu-link, .header-menu .menu-nav>.menu-item.menu-item-active>.menu-link{
    background-color: rgb(9 31 96 / 10%);
}

.header-menu .menu-nav>.menu-item:hover:not(.menu-item-here):not(.menu-item-active)>.menu-link .menu-text, .header-menu .menu-nav>.menu-item.menu-item-hover:not(.menu-item-here):not(.menu-item-active)>.menu-link .menu-text, .header-menu .menu-nav>.menu-item.menu-item-here>.menu-link .menu-text, .header-menu .menu-nav>.menu-item.menu-item-active>.menu-link .menu-text{
    color: #000000;
}

body .topbar .btn.btn-icon:hover{
    background-color: #F3F6F9!important;
}

.section_title{
    position: relative;
    padding-bottom: 1rem;
    margin-top: 2rem;
}

.section_title:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 75px;
    height: 3px;
    border-radius: 4px;
    background-color: #F61E31;
    z-index: 1;
}

.section_title:after {
    content: "";
    position: absolute;
    bottom: 0px;
    left: 0;
    width: 100%;
    border-bottom: 2px solid rgb(223 225 231);
    z-index: 0;
}

.home-blog{
    display: block;
    position: relative;
    border-bottom: 1px solid #ddd;
    /* transform: scale(.99); */
    transition: all .3s ease-in-out;
    border-radius: 5px;
    float:left;
    width: 100%;
}

.featured_blogs{
    border-left: 1px solid #ddd;
}

/* .home-blog:hover {
    transform: scale(1);
} */

.home-blog .blog-title {
    width: 100%;
    float: left;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    /* padding: 0 1rem; */
    height: 3.5rem;
}

.home-blog .samsung_sans_font p {
    width: 100%;
    float: left;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    /* padding: 0 1rem; */
    height: 6rem;
}
#latest_blogs{
    overflow: hidden;
    overflow-y: scroll;
}

#latest_blogs .home-blog:last-child{
    margin: 0!important;
    border: 0;
}

.org-logo{
    width: 100%;
    float: left;
    padding-bottom: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
    opacity: 0.8;
    transition: opacity 0.2s ease;
}

.org-logo:hover{
    opacity: 1;
}

.one-stop-stat-item{
    margin: 2rem 0;
}

.one-stop-stat-item .one-stop-stat-number{
    font-size: 3rem;
    font-weight: 600;
}

.one-stop-stat-item .one-stop-stat-number::after{
    content: "+";
}

.one-stop-stat-title{
    font-size: 2rem;
}


.header-mobile .burger-icon span, .header-mobile .burger-icon span::before, .header-mobile .burger-icon span::after{
    background-color: rgb(8 24 98);
}

.card-one-stop{
    background-size: cover !important;
    background-position: center;
    background-repeat: no-repeat no-repeat;
    background-color: rgb(14,49,102);
    background: linear-gradient(135deg,rgba(14,49,102,1) 0%,rgba(36,98,199,1) 100%);
    -webkit-border-radius: 80px;
    -webkit-border-top-left-radius: 0px;
    -webkit-border-bottom-right-radius: 0px;
    -moz-border-radius: 80px;
    -moz-border-radius-topleft: 0px;
    -moz-border-radius-bottomright: 0px;
    border-radius: 80px;
    border-top-left-radius: 0px;
    border-bottom-right-radius: 0px;
}

.card-one-stop:before {
    content: "";
    background-image: url(../media/investassist/map_pin.png);
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    width: 80px;
    height: 80px;
    top: -40px;
    left: 4rem;
}
.card-one-stop>.card-body{
    padding: 2rem 4rem !important;
}
#kt_subheader h2, .navi .navi-section{
    font-family: 'Samsung Sharp Sans K';
}

#kt_content{
    background-size: auto;
    background-repeat: no-repeat;
    background-position: top;
}

#project_card::before{
    position: absolute;
    height: 2rem;
    vertical-align: middle;
    top: -2rem;
    left: 0;
    color: #fff;
    padding: 0 1rem;
    padding-left: 3rem;
    border-top-left-radius: 0.5rem;
    border-top-right-radius: 0.5rem;
    display: flex;
    align-items: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.project_detail_table tr td{
    border-top: 1px solid #ecf0f1;
}

.project_detail_table tr:first-child td{
    border: 0;
}

.text-invest{
    color: #001f60 !important;
}

.bg-invest{
    background-color: #001f60 !important;
}

.flexer,.progress-indicator{display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex}.no-flexer,.progress-indicator.stacked{display:block}.no-flexer-element{-ms-flex:0;-webkit-flex:0;-moz-flex:0;flex:0}.flexer-element,.progress-indicator>li{-ms-flex:1;-webkit-flex:1;-moz-flex:1;flex:1}.progress-indicator{margin:0 0 1em;padding:0;font-size:80%;text-transform:uppercase}.progress-indicator>li{list-style:none;text-align:center;width:auto;padding:0;margin:0;position:relative;text-overflow:ellipsis;color:#000 !important;display:block}.progress-indicator>li:hover{color:#6f6f6f}.progress-indicator>li.completed,.progress-indicator>li.completed .bubble{color:#65d074}.progress-indicator>li .bubble{border-radius:1000px;width:20px;height:20px;background-color:#bbb;display:block;margin:0 auto .5em;border-bottom:1px solid #888}.progress-indicator>li .bubble:after,.progress-indicator>li .bubble:before{display:block;position:absolute;top:9px;width:100%;height:3px;content:'';background-color:#bbb}.progress-indicator>li.completed .bubble,.progress-indicator>li.completed .bubble:after,.progress-indicator>li.completed .bubble:before{background-color:#65d074;border-color:#247830}.progress-indicator>li .bubble:before{left:0}.progress-indicator>li .bubble:after{right:0}.progress-indicator>li:first-child .bubble:after,.progress-indicator>li:first-child .bubble:before{width:50%;margin-left:50%}.progress-indicator>li:last-child .bubble:after,.progress-indicator>li:last-child .bubble:before{width:50%;margin-right:50%}.progress-indicator>li.active,.progress-indicator>li.active .bubble{color:#001f60}.progress-indicator>li.active .bubble,.progress-indicator>li.active .bubble:after,.progress-indicator>li.active .bubble:before{background-color:#001f60;border-color:#122a3f}.progress-indicator>li a:hover .bubble,.progress-indicator>li a:hover .bubble:after,.progress-indicator>li a:hover .bubble:before{background-color:#5671d0;border-color:#1f306e}.progress-indicator>li a:hover .bubble{color:#5671d0}.progress-indicator>li.danger .bubble,.progress-indicator>li.danger .bubble:after,.progress-indicator>li.danger .bubble:before{background-color:#d3140f;border-color:#440605}.progress-indicator>li.danger .bubble{color:#d3140f}.progress-indicator>li.warning .bubble,.progress-indicator>li.warning .bubble:after,.progress-indicator>li.warning .bubble:before{background-color:#edb10a;border-color:#5a4304}.progress-indicator>li.warning .bubble{color:#edb10a}.progress-indicator>li.info .bubble,.progress-indicator>li.info .bubble:after,.progress-indicator>li.info .bubble:before{background-color:#5b32d6;border-color:#25135d}.progress-indicator>li.info .bubble{color:#5b32d6}.progress-indicator.stacked>li{text-indent:-10px;text-align:center;display:block}.progress-indicator.stacked>li .bubble:after,.progress-indicator.stacked>li .bubble:before{left:50%;margin-left:-1.5px;width:3px;height:100%}.progress-indicator.stacked .stacked-text{position:relative;z-index:10;top:0;margin-left:60%!important;width:45%!important;display:inline-block;text-align:left;line-height:1.2em}.progress-indicator.stacked>li a{border:none}.progress-indicator.stacked.nocenter>li .bubble{margin-left:0;margin-right:0}.progress-indicator.stacked.nocenter>li .bubble:after,.progress-indicator.stacked.nocenter>li .bubble:before{left:10px}.progress-indicator.stacked.nocenter .stacked-text{width:auto!important;display:block;margin-left:40px!important}@media handheld,screen and (max-width:400px){.progress-indicator{font-size:60%}}

#kt_subheader {
    background: url(/images/header.png);
    background-size:cover;
    background-position: center; /* Center the image */
}

    #kt_subheader h2 {
        color:white!important;
    }

.clock {
    width: 350px;
    height: 350px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: url(/images/clock.png);
    background-size: cover;
    /*border: 2px solid #001d5b;*/
    border-radius: 50%;
    /*box-shadow: 0px -8px 8px rgba(255, 255, 255, 0.05), inset 0 -8px 8px rgba(255, 255, 255, 0.05), 0 8px 8px rgba(0, 0, 0, 0.3), inset 0 8px 8px rgba(0, 0, 0, 0.3);*/
}

    .clock:before {
        content: '';
        position: absolute;
        width: 15px;
        height: 15px;
        background: #fff;
        border-radius: 50%;
        z-index: 10000;
    }

    .clock .hour,
    .clock .min,
    .clock .sec {
        position: absolute;
    }

    .clock .hour, .hr {
        width: 160px;
        height: 160px;
    }

    .clock .min, .mn {
        width: 190px;
        height: 190px;
    }

    .clock .sec, .sc {
        width: 230px;
        height: 230px;
    }

.hr, .mn, .sc {
    display: flex;
    justify-content: center;
    position: absolute;
    border-radius: 50%;
}

    .hr:before {
        content: '';
        position: absolute;
        width: 8px;
        height: 80px;
        background: #f24e4e;
        z-index: 10;
        border-radius: 6px 6px 0 0;
    }

    .mn:before {
        content: '';
        position: absolute;
        width: 4px;
        height: 90px;
        background: #fff;
        z-index: 11;
        border-radius: 6px 6px 0 0;
    }

    .sc:before {
        content: '';
        position: absolute;
        width: 2px;
        height: 150px;
        background: #fff;
        z-index: 12;
        border-radius: 6px 6px 0 0;
    }

.wave_dd {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100px;
    background: url(/images/border-img/wave.png);
    background-size: 1000px 100px;
}

    .wave_dd.wave_dd1 {
        animation: animate 30s linear infinite;
        z-index: 10;
        opacity: 1;
        animation-delay: 0s;
        bottom: 0;
    }

    .wave_dd.wave_dd2 {
        animation: animate2 15s linear infinite;
        z-index: 9;
        opacity: 0.5;
        animation-delay: -5s;
        bottom: 10px;
    }

    .wave_dd.wave_dd3 {
        animation: animate 30s linear infinite;
        z-index: 8;
        opacity: 0.2;
        animation-delay: -2s;
        bottom: 15px;
    }

    .wave_dd.wave_dd4 {
        animation: animate2 15s linear infinite;
        z-index: 7;
        opacity: 0.2;
        animation-delay: -2s;
        bottom: 20px;
    }

@keyframes animate {
    0% {
        background-position-x: 0;
    }

    100% {
        background-position-x: 1000px;
    }
}

@keyframes animate2 {
    0% {
        background-position-x: 0;
    }

    100% {
        background-position-x: -1000px;
    }
}

.earth {
    position: absolute;
    top: 10px;
    right: 0;
    width: 500px;
    height: 500px;
    border-radius: 50%;
    background: transparent url(/images/earth.png);
    background-size: cover;
    box-shadow: inset 0px -20px 50px 10px rgba(36, 98, 199, 0.47), 0px 0px 30px 6px rgba(86, 113, 208, 0.36);
    transform-style: preserve-3d;
    transform: rotate(0deg);
    animation: rotate 15s linear infinite;
}

@keyframes rotate {
    0% {
        background-position: 0 0;
    }

    100% {
        background-position: 1530px 0;
    }
}