@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500&display=swap');

BODY{
    font-family: 'Poppins', sans-serif;
    padding: 0px;
    margin: 0px;
    font-size: 16px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    /* font-family: 'Inter', sans-serif; */
}

li.nav-item a.dropdown-item {
    font-size: 15px;
    padding: 10px 20px !important;
    border-bottom: 1px solid #eaeaea;
}

.footer-logo img{
    width: 50%;
}

.hero-section{
    background: #010032 url(../assets/images/slider/background-05.jpg) !important;
    height: 750px;
    background-size: cover !important;
    display: flex;
    justify-content: center;
    align-items: center;

}

.hero-section .page-title.center {
    width: 50%;
    text-align: center;
    margin: auto;
}


.system-name{
    background: #4611a7;
    padding: 25px;
}

.system-name h2{
    font-size: 25px;
    text-align: center;
margin: 0px;
color: #FFF;

padding: 0px;
}


section#syarikat {
    background: #F3F7FA;
}

.left-text{
    text-align: left !important;
}

.left-text h2{
    text-align: left !important;
}
.section-title h2 {
    color: #4611a7;
    text-align: center;
    font-size: 35px;
    margin-bottom: 45px;
}

.pengenalanBox p {
    margin: 0px;
    font-size: 13px;
    text-align: justify;
    margin-top: 15px;
}

#pengenalan .pengenalanBox {
    background: #F3F7FA;
    border-radius: 20px;
    margin: 0px 5px;
    padding: 50px;
    font-size: 15px;
    height: 100%;
}
.item.data-home .description {

    width: 50%;
    padding: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
}


.image.bg-transfer {
    width: 50%;
}
.image.bg-transfer img {
    object-fit: cover;
    width: 100%;
    height: 250px;

}

#pengenalan .item {
    border: 1px solid #E5E5E4;
    border-radius: 10px;
    padding: 0px;
    display: flex;
    align-items: center;
    margin-top: 25px;
}

#pothole .list-item .title h3 {
    font-size: 20px;
    color: #4611a7;
}

#sistem .event {
    background: #5235FF;
    color: #FFF;
    border-radius: 10px;
    padding: 25px;
    font-size: 15px;
}

#sistem .event h4 a {
    color: #FFF;
    text-decoration: none;
    font-size: 20px;
}

#pothole .list-item {
    padding: 20px;
    font-size: 14px;
    color: #7B7B79;
}
#pothole .list-item p {
    font-size: 14px;
    color: #7B7B79;
}
h3.subtitle{
    text-align: center;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin: 0px;
    padding: 0px;
}
ul.dropdown-menu {
    padding: 0px;
    overflow: hidden;
}

.modal-cta a{

}

.modal-cta a {
    font-size: 13px;
    text-align: center;
}

.yellow-txt{
    color: #FDB400;
}

.blue-txt{
    color: #1a21ff;
}

.text-bold{
    font-family: 'Poppins', sans-serif;
    font-weight: bold;
}
h3.large-heading {
    font-size: 2.5rem;
}

.si-wrap {
    display: flex;
    align-items: center;
}

section.si-section {
    padding-bottom: 0px;
}

.si-wrap {
    display: flex;
    align-items: center;
    padding: 0px 0px;
}

section.si-section .row {
    display: flex;
    align-items: center;
    padding: 0px 200px;
}

section.si-section{
    font-family: 'Poppins', sans-serif;
    font-weight: bold;
}

.si-info{
    width: 50%;
    /* padding-right: 100px; */
}

.si-info p{
    margin: 0px;
    padding: 0px;
}

.si-info h3 {
    font-size: 2rem;
}


section.page-section.plan-section {
    background: #f5f2ff;
    text-align: center;
}


img.code-faster {
    width: 60%;
    margin: auto;
    border-radius: 10px;
}

.compare-content .table-responsive td {
    border: none;
    font-size: 24px;
    padding: 16px 0 22px 43px;
    text-align: center;
    color: #000;
}

section.page-section.compare-us {
    padding-top: 0px;
}

section.page-hero.dark-hero {
    background-color: #010032;
    padding-top: 100px;
}

section.page-hero.dark-hero h3 {
    color: #FFF;
}

section.page-hero.dark-hero p {
    color: #FFF;
}

.faq-section .container {
    padding: 0px 200px;
}

div#accordionFaq .accordion-item {
    border: none;
}

#accordionFaq .accordion-header button {
    margin-bottom: 0;
    font-size: 24px;
    font-weight: 700;
}

.accordion-header {
    padding-bottom: 30px;
    padding-top: 30px;
    border-bottom: 1px solid #434343;
}

div#accordionFaq .accordion-button:not(.collapsed) {
    background: transparent;
    box-shadow: none;
    color: #5800f9;
}

div#accordionFaq .accordion-body{
    padding-top: 25px;

}

.compare-content .table-responsive th {
    font-weight: 700;
    font-size: 24px;
    margin-bottom: 20px;
    text-align: center;
    color: #000;
    padding: 16px 0 22px 43px;
}

.compare-content .table-responsive table tr:nth-child(even){
background: none;
}

.compare-content .table-responsive td.compare-heading {
    font-size: 24px;
    color: #010032 !important;
    font-weight: 600;
    text-align: left;
}


.page-section .plan-price ul li img.list-check {
    width: 15px;
    margin-right: 10px;
}

.dark-section{
    background: #010032 !important;
}
.dark-section .container{
    padding: 0px 100px;
}

.dark-section .page-section-heading-center {
    color: #FFF;
    text-align: center;
    margin-bottom: 60px;
}

.info-right h3 {
    font-size: 20px;
    /* margin-top: 40px; */
    font-family: 'Poppins', sans-serif;
    font-weight: 500;
}

.info-right {
    margin-left: 20px;
    margin-right: 50px;
}

.info-right p{
    font-size: 14px;
}
.page-section-heading-center{
    text-align: center;
}

img.stack-logo {
    width: 100%;
    padding: 0px 50px;
}

.tools-logo{
    padding: 0px 40px;
}

div#testimoni-clients .item h3 {
    color: #5800f9;
    font-size: 16px;
    margin-top: 50px;
}

#testimoni-clients .owl-nav {
    position: absolute;
    top: 0%;
    width: 100%;
    left: 0px;
    display: flex;
    justify-content: space-between;
}
#testimoni-clients{
    position: relative;
    padding: 0px 150px;
}
#testimoni-clients .owl-nav button{
background: #5800f9;
padding: 0px 20px !important;

}

#testimoni-clients .owl-dot.active span{
    background: #5800f9;
}

.client-testimoni {
    padding: 50px 200px;
}

.client-testimoni .owl-dots {
    margin-top: 40px;
}

#testimoni-clients .owl-nav button span{

    color: #FFF;
    font-size: 40px;
}


.icon-left img {
    width: 100%;
}
.icon-left {
    width: 20%;
    margin-right: 20px;
}

.icon-top {
    width: 25%;
    margin-right: 0px;
    margin: 0px auto 25px auto;
}


.icon-top img{
    width: 100%;
}

.icon-top-layout .info-right {
    margin: 0px;
    text-align: center;
}
.short-paragraph{
    width: 50%;
    margin: 0px auto 25px auto ;
}
img.logo-front {

    width: 100%;
}

.card-address-front{
    text-align: center;
    font-size: 15px;
}

.card-address-front h3{
    color: #4611a7;
    font-size: 20px;
}
.office-image{
    height: 250px;
    background-size: cover !important;
    background-position: center center !important;
}

.logos {
    display: flex;
    justify-content: space-between;
    width: 70%;
    margin: auto;
}

.kerja-galeri .description {
    position: absolute;
    left: 0px;
    width: 100%;
    border-radius: 5px !important;
    background: rgb(70,17,167) !important;
    background: linear-gradient(180deg, rgba(70,17,167,0.8730085784313726) 0%, rgba(0,212,255,0.2) 100%) !important;
}

.kerja-galeri .image.bg-transfer{
    border-radius: 5px !important;
    overflow: hidden;
}

.image.bg-transfer img {
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.item.featured a {
    display: flex;
    flex-direction: column-reverse;
    text-decoration: none;
}

.item.featured a .description {
    background: #4611a7;
    height: 100%;
    padding: 30px;
    font-size: 14px;
    -webkit-border-bottom-right-radius: 5px;
    -webkit-border-bottom-left-radius: 5px;
    -moz-border-radius-bottomright: 5px;
    -moz-border-radius-bottomleft: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
}

.item.featured a .description p{
    color: #FFF;
}
.plan-price {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding: 42px 60px;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    border-radius: 8px;
    background-color: #fff;
    box-shadow: 0 2px 8px 0 rgb(0 0 0 / 8%), 0 1px 3px 0 rgb(0 0 0 / 12%);
    flex-direction: column;

    text-align: center;
}
.page-section.plan-section .row {
    align-items: start;
    margin-top: 50px;
    width: 70%;
}

.page-section .plan-price h3 {
    font-size: 25px !important;
    text-align: left;
}

.page-section .plan-price  ul li{
    text-align: left;
    display: flex;
    align-items: flex-start;
}

.plan-price {
    font-size: 15px;
}

.yellow-btn{
    color: #1A353C;
    background: #FDB400;
    text-decoration: none;
    border-radius: 5px;
    font-weight: 600;
    font-size: 16px;
    padding: 1em 1.5em;
    font-family: 'Poppins', sans-serif;
    font-weight: bold;
}

#talents .item {
    background: #1a21ff;
    border-radius: 5px;

    text-align: left;
    color: #FFF;
    position: relative;
    overflow: hidden;
}


div#talents img {
    border-radius: 5px;
}

.kerja-galeri h4 {
    color: #FFF;
    font-size: 20px;
    text-align: center;
}


.item.data-home {
    background: rgb(70,17,167);
    background: linear-gradient(168deg, rgba(70,17,167,1) 0%, rgba(82,53,255,1) 100%);
    color: #FFF;
}.item.data-home a {
    color: #FFF;
    display: flex;
    flex-direction: row-reverse;
    text-decoration: none;
    width: 100%;
}
a.talents-video-overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 5px;
    padding: 20px;
    text-decoration: none;
    color: #FFF;
    background: rgba(26, 33, 255, 0.7);
    transition: all 0.5s ease;
}

a.talents-video-overlay:hover {
    background: rgba(1, 0, 50, 0.7);
}

.talents-video-overlay h3 {
    margin: 0px;
    text-align: center;
    font-family: 'Poppins', sans-serif;
    font-weight: bold;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 18px;
}



.about-home-content p.about-quote {
    color: #2e6edf;
    font-size: 1.5rem;
    margin: 40px 0px;
    font-family: 'Poppins', sans-serif;
    font-weight: 500;
}

.achievements .center-heading h3 {
    margin-bottom: 64px;
    font-size: 2rem;
}

a.blue-btn i {
    margin-left: 10px;
    line-height: 100%;
}

.blue-btn{
    color: #FFF;
    background:   #5800f9;
    text-decoration: none;
    border-radius: 5px;
    font-weight: 600;
    font-size: 16px;
    padding: 1em 1.5em;
    font-family: 'Poppins', sans-serif;
    font-weight: bold;
}

.blue-btn:hover{
    color: #FFF;
}

.white-btn{
    background: #FFF;
    color:   #5800f9;
    text-decoration: none;
    border-radius: 5px;
    font-weight: 600;
    font-size: 16px;
    padding: 1em 1.5em;
    font-family: 'Poppins', sans-serif;
    font-weight: bold;
}

.white-btn:hover{
    background: #FFF;
    color:  #5800f9;
}

.hero-sub-action{
    margin-top: 35px;
}

.hero-sub-action a{
    color: #FFF;
    text-decoration: none;
    border-bottom: 1px dotted #FFF;
}

.easy-access .container{
    padding: 0px 250px;
}

.easy-icon {
    background: #776de6;
    border-radius: 10px;
    display: inline-block;
    padding: 10px;
    margin-bottom: 20px;
}

.easy-icon img {
    width: 35px;
}

.easy-box h3 {
    color: #FFF;
    font-weight: 800;
}

.easy-box p {
    color: #FFF;
}
.easy-box{
    padding: 40px;
}

a.easy-action img {
    width: 25px;
    margin-right: 15px;
}

a.easy-action {
    color: #776de6;
    font-size: 15px;
    font-weight: 800;
    text-decoration: none;
}

.box-3 .easy-icon {
    background: #f3efef;
}

.box-3 a.easy-action {
    color: #FFF !important;
}

.easy-box.box-4 h3 {
    color: #000230;
}

.box-2 a.easy-action {
    color: #FFF;
}

.heading-label {
    background: #1a21ff;
    color: #FFF;
    border-radius: 500px;
    text-align: center;
    display: inline-flex;
    margin: auto;
    padding: 10px 25px 5px 25px;
    font-weight: bold;
    /* vertical-align: middle; */
    justify-content: center;
    align-items: center;
    /* width: auto; */
}

img.preview-screen{
    width: 100%;
    border-radius: 20px;
}

.hire-devs{
    border-top: 1px solid #eaeaea;
    padding: 50px 0px;
}


.job-done .center-heading.big-heading span {
    color: #5800f9;
    display: block;
}

.job-done p {
    margin-bottom: 50px;
    width: 50%;
    margin: 0px auto 50px auto;
}

.section-heading-left h3 {
    color: #FFF;
    font-weight: bold;
    line-height: 60px;
    margin-bottom: 25px;
    font-size: 2.5rem;
    letter-spacing: -.4px;
}

.stats-col .count-heading {
    color: #2e6edf;
    font-size: 50px;
    font-weight: 900;
}
.section-heading-left h3 span {
    display: inline-block;
    color: #5800f9;
}

.count-heading span {
    height: 1px;
    display: inline-block;
    background: #FFF;
    width: 75%;
    margin-left: 25px;
}
.stats-col {
    color: #FFF;
}
.stats-col .count-heading {
    color: #2e6edf;
    font-family: 'Poppins', sans-serif;
    font-weight: bold;
    font-size: 50px;
    font-weight: 900;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.job-done .center-heading.big-heading .heading-fluid span {
    display: inline;
}

span.label-heading{
background: #1a21ff;
    color: #FFF;
    border-radius: 500px;
    text-align: center;
    display: inline-flex;
    margin: auto;
    padding: 10px 25px 5px 25px;
    font-weight: bold;
    font-size: 12px;
    /* vertical-align: middle; */
    justify-content: center;
    align-items: center;
    text-transform: uppercase;
}

.certifcate-home{
    width: 60%;
    border-radius: 10px;
}

.white-bg{
    background: #FFF !important;
}
.stats-col {
    padding: 0px 25px;
}


.stats-col h4 {
    font-size: 25px;
    font-weight: 800;
    margin-bottom: 20px;
    font-family: 'Poppins', sans-serif;
    font-weight: bold;
}

.stats-col p {
    font-size: 20px;
}


.section-heading-left p {
    color: #FFF;
    width: 50%;
    margin-top: 25px;
    font-size: 20px;
}

.learn-coding {
    background: #010032 url(../assets/images/code.png) !important;
    background-repeat: no-repeat !important;
    background-position: right center !important;
    background-size: 50% !important;
}

.learn-coding .section-heading-left h3 {
    font-size: 30px;
    line-height: normal;
}

.learn-coding .stats-col p {
    font-size: 15px;
}

.learn-coding .section-heading-left p {
    font-size: 15px;
}

.learn-coding .stats-col .count-heading {
    font-size: 35px;
}
.preview-wrapper {
    padding: 50px 150px 0px 150px;
}

.learn-coding .stats-col h4 {
    font-size: 20px;
}


h3.normal-line-height {
    line-height: normal !important;
}
.easy-box.box-4 p {
    color: #000230;
}
.box-1{
    background: #000230;
}

.box-2{
    background: #54539a;
}

.box-3{
    background: #776de6;
}


.box-4{
    background: #f3efef;
}

.about-home-content h3 {
    font-family: 'Poppins', sans-serif;
    font-weight: 500;
    color: #212121;
    font-weight: 600;
    line-height: 60px;
    margin-bottom: 25px;
    font-size: 2rem;
    letter-spacing: -.4px;
}

img.hero-pages-image {
    width: 100%;
}

.page-hero .row .col-lg-6 {
    display: flex;
    flex-direction: column;

    align-items: flex-start;
    justify-content: center;
}

.achievements-footer {
    margin-top: 80px;
}

section.featured {
    background: #fafafa;
    text-align: center;
}

.featured .center-heading h3 {
    font-size: 2rem;
}

.about-home-content {

}
.achievements-top i {
    color: #5800fa;
    background: #f5f2ff;
    padding: 10px 13px 0px 13px;
    display: inline-block;
    border-radius: 10px;
    font-size: 25px;
    margin-right: 10px;
}

.achievements-content p {
    margin: 0px;
    font-size: 1.4rem;
    width: 80%;
}

.achievements-content {
    text-align: left;
    width: 75%;
    margin: auto;
}

.achievements-top span {
    top: -5px;
    font-family: 'Poppins', sans-serif;
    font-weight: 500;
    position: relative;
}

.achievements-top {

    margin-bottom: 25px;
}

.achievements-content {
    text-align: left;
}

.darkgreen-icon {
    background: #102D47;
}

.about-list-icon{
    border-radius: 10px;
}

ul.about-list li {
    display: flex;
    justify-content: center;
    margin-bottom: 20px;
    align-items: flex-start;
}

.about-list-icon {
    padding: 20px;
    margin-right: 20px;
}

.about-list-icon img {
    height: 35px;
}

.about-list-icon {
    padding: 20px;
}

.yellow-icon{
    background: #FDB400;
}
.about-home-content p {
    color: #212121;
    font-size: 1rem;
    line-height: 1.5;
    letter-spacing: -.09px;
}
img.about-home {
    width: 100%;
    padding-right: 150px;
}


section.about-us {
    padding-bottom: 100px;
}
ul.about-list {
    margin: 55px 0px;
    padding: 0px;
    list-style: none;
}

.about-home-content ul.about-list p {
    font-size: 1rem;
    line-height: 1.625;
    letter-spacing: -.08px;
}

.about-home-content ul.about-list h3 {
    font-size: 1.3125rem;
    line-height: normal;
    margin-bottom: 0.75rem!important;
}

.left-hero p {
    font-size: 16px;
    font-weight: 300;
    margin-right: 200px;
    margin-bottom: 30px;
    line-height: 1.5;
}

footer{
    background: #4611a7;
    color:#FFF;
    padding: 56px 0 0px;
}

div#featured {
    width: 70%;
    margin: auto;
}

footer .container{
    border-bottom: 1px solid #FFF;
    padding-bottom: 50px;
}

.footer-top{
    padding: 50px;

}

tbody, td, tfoot, th, thead, tr{
    border-width: inherit;
    border-color: #3333;
}
/* .hero-image {
    position: absolute;
    width: 60%;
    top: 100px;
    right: 0px;
} */

.hero-image {
    position: absolute;
    right: 0px;
    width: 55%;
    top: 100px;
}

.purple-text{
    color:#5800f9;
}

div#hero-sub-heading {
    margin-bottom: 25px;
    margin-top: -15px;
    font-size: 25px;
    font-weight: 800;
}


.hero{

    background: #010032;
    height: 900px;
    padding-bottom: 0px;
    color: #FFF;
    background-repeat: no-repeat;
    background-position: bottom right;
    background-size: 50%;


}

.developer-hero{
    background: #010032 url('../assets/images/hero_developer.jpg');
    height: 900px;
    padding-bottom: 0px;
    color: #FFF;
    background-repeat: no-repeat;
    background-position: bottom right;
    background-size: contain;
    display: flex;
    align-items: center;
}


.cv-hero{

    height: 900px;

    display: flex;
    align-items: center;

}
/* .hero{

    background: #010032 url('../assets/images/hero_bg.png');
    height: 900px;
    padding-bottom: 0px;
    color: #FFF;
    background-repeat: no-repeat;
    background-position: bottom right;
    background-size: contain;


} */

.hero .container{


}
.row.cv-features {
    display: flex;
    justify-content: center;
    margin-top: 100px;
}

.resume-image img {
    width: 50%;
    border-radius: 20px;
}

.resume-image{
    margin: 25px 0px;
}

.row.resume-container ul {
    margin: 20px 0px;
    list-style: none;
    padding: 0px;
    font-size: 15px;
}

img.rating {
    width: 30%;
    margin-bottom: 20px;
}

section{
    padding: 4.8rem 0;
}

section.center-section{
    text-align: center;
}

.hero .container,
.hero .row{
    height: 100%;
}

.left-hero {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    align-content: flex-start;
    flex-direction: column;

}

.center-heading.small-heading h3{
    font-size: 28px;
}
.left-hero ul{
    margin: 0px;
    padding: 0px;
    list-style: none;
    margin-bottom: 30px;
}

.col-lg-6.right-hero {
    position: absolute;
    /* transform: translateX(50%) scale(1); */
    /* -webkit-transform: translateX(50%) scale(1); */
    right: 0px;
    top: 150px;
}

.home-content.hero{
    height: auto;
    padding-top: 200px;
}
.home-content .right-hero{
    position: relative;
    right: 0px;
    top: 0px;
    display: flex;
    align-items: flex-end;

}

.home-content .right-hero img{
    width: 100%;
}

.hero-image {

}

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

.section-logo h3 {
    color: #212121;
    font-weight: 600;
    line-height: 60px;
    margin-bottom: 25px;
    font-size: 2rem;
    letter-spacing: -.4px;
}

span.price-small-sub {
    display: block;
    font-size: 15px;
}


.section-logo strong {
    color: #000;
}

.left-hero h3 {
    font-weight: 500;
    font-family: 'Poppins', sans-serif;
    font-weight: 500;
    font-size: 48px;

    margin-bottom: 2.4rem;
}

.section-logo{
    text-align: center;
    margin-top: -100px;
}

.section-logo .container{
    background: #FFF;
    border-radius: 10px;
    padding: 50px 20px 0px 20px;
}

.why{
    text-align: center;
    background-color: #f6f8fb;
}

div#featured img {
    border-radius: 10px;
}
section.page-hero {
    padding-top: 200px;
}


.top-header.header-page {
    background: #010032 !important;
    padding: 10px 20px;
}


.page-section ul li i {
    color: #1a21ff;
    margin-right: 10px;
}

.page-section h4 {
    font-size: 20px;
    margin-top: 40px;
    font-family: 'Poppins', sans-serif;
    font-weight: 500;
}

section.page-section.even-section .row {
    flex-direction: row-reverse;
}


.page-hero h3 {
    font-size: 48px;
    line-height: 1.32;
    font-weight: 500;
    color: #212121;
    font-family: 'Poppins', sans-serif;
    font-weight: 500;
}

.page-hero p {
    color: #212121;
    font-size: 18px;
    margin-top: 1rem;
    /* margin-bottom: 2rem; */
}

.page-section h3 {
    font-size: 2rem;
    font-family: 'Poppins', sans-serif;
    font-weight: 500;
    color: #212121;
}

.page-section ul {

    margin: 20px 0px;
    padding: 0px;
    list-style: none;
}

.page-hero-left {
    padding-right: 100px;
}


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

.page-section .row {
    align-items: center;
    width: 80%;
    margin: auto;
}


.page-section.even-section img.section-image {
    padding-right: 50px;
}


.page-section ul li{
    margin-bottom: 10px;
}
.page-hero h5 {
    font-family: 'Poppins', sans-serif;
    font-weight: 500;
    font-size: 15px;
    margin-bottom: 30px;
}


li.nav-item a {
    padding: 0px 20px !important;
    font-size: 16px;
}

.navbar-nav{
    margin: auto !important;
}

img.about-team {
    width: 100%;
    padding-right: 50px;
}

.watch-video {
    font-size: 14px;
    font-family: 'Poppins', sans-serif;
    font-weight: bold;
}
img.why-image {
    width: 100%;
    margin: auto;
}

.why .row {
    justify-content: center;
}

.top-header{

    top: 0px;
    left: 0px;
    width: 100%;
    padding: 0px;
    transition: all 0.5s ease;
    /* background: #010032; */
    z-index: 100;
}


a.join-now-top {
    background: #4611a7;
    text-decoration: none;
    color: #FFF;
    padding: 1em 1.2em 0.8em 1.2em;
    font-family: 'Poppins', sans-serif;
    font-weight: bold;
    border-radius: 5px;
    display: inline-block;
    font-weight: 500;
    cursor: pointer;
    font-size: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
}

#topMenu{
    justify-content: space-between;
}

.navigation ul li.mobile-menu{
    display: none;
}


section.page-content a {
    color: #800000;
    text-decoration: none;
}

.footer-bottom{

    padding: 25px;
    font-size: 12px;
    font-weight: 500;
    text-align: center;

    font-family: 'Poppins', sans-serif;
    font-weight: 500;

}
.footer-bottom a{
    color: #FFF;
}

.footer-bottom .row {
    display: flex;
    align-items: center;
}

.menu_btn {
    position: relative;
    visibility: visible;
    opacity: 1;
    z-index: 20;
}
.menu_btn a {

    font-size: 14px;
    font-weight: 600;
    display: inline-block;
    text-decoration: none;
    transition: color ease-in-out 0.4s;
    color: #1c2237;
}

.header-top-mega-menu i {
    font-size: 25px;
}
.menu_btn a:hover, .menu_btn a:focus, .menu_btn a:focus-within {
    color: #e2001a;
}
nav {
    display: block;
}
.panel {
    position: absolute;
    top: 0;
    width: 0;
    height: 100%;
    overflow: hidden;
    width: 0%;
}

.mobile-close-navigation{
    display: none;
}
.panel--left {
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: #FFF;
    right: 50%;
    display: flex;
    justify-content: center;
}
.navigation ul li, .navigation ul li a, .navigation ul li a span {
    line-height: normal;
    margin-bottom: 5px;
    text-transform: uppercase;
}
.panel--right {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #1c2237;
    right: 0;
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
}

.navigation .panel--right .menu > li > a {
    color: #FFF;
}

.navigation .panel--right .sub-menu > li > a{
    color: #FFF;
}

.news-image-left {
    width: 80px;
    height: 80px;
    object-fit: fill;
    object-position: center center;
    border-radius: 10px;
    overflow: hidden;
    margin-right: 20px;
}

.navigation .panel--right .line {
    display: block;
    position: absolute;
    left: 0;
    top: 1em;
    width: 28px;
    height: 1px;
    background: rgba(255,255,255);
    opacity: 0;
}
.line {
    display: block;
    position: absolute;
    left: 0;
    top: 1em;
    width: 28px;
    height: 1px;
    background: rgba(130, 130, 130, .6);
    opacity: 0;
}
.navigation ul li, .navigation ul li a, .navigation ul li a span {
    position: relative;
    display: block;
}
.navigation {

}
.navigation h2 {
    width: 0;
    height: 0;
    text-indent: -9999px;
}
.navigation .menu {
    /* display: flex;
    flex: 8;
    flex-direction: column;
    justify-content: center;
    text-align: left;
    transform: translate(-100%, 0); */
}

.navigation .menu {
    width: 100%;
    padding: 45px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    align-content: flex-start;
    min-height: 600px;
}

.navigation .menu ul.sub-menu {
    margin: 0px;
    padding: 0px;

}

.navigation .menu ul.sub-menu a{
    text-decoration: none;
    font-size: 13px;
}
.navigation .menu > li {
    line-height: 30px;
    font-size: 20px;
    font-size: 1.25em;
    font-size: 1.25rem;
    padding: 0.4em 0 0.4em 42px;
    margin: 0.2em 0;
    text-align: left;
    /* float: left; */
    /* clear: both; */
    width: 30%;
}
.navigation .menu > li > a {
    color: #202c5c;
    text-decoration: none;
    overflow: hidden;
    transition: color ease-in-out 0.4s;
    font-weight: 600;
}


.navigation .menu > li > a:hover, .navigation .menu > li > a:focus, .navigation .menu > li > a:focus-within {
    color: #e2001a;
}
.navigation .menu > li > a > span {
    top: 0;
    text-transform: capitalize;
}
.navigation .sub-menu > li {
    display: block;
    float: left;
    clear: both;
    line-height: 30px;
    font-size: 14px;
    font-size: 0.875em;
    font-size: 0.875rem;
    padding: 0;
    margin: 0;
}
.navigation .sub-menu > li > a {
    color: #828282;
    text-transform: none;
    overflow: hidden;
    transition: color ease-in-out 0.4s;
}
.navigation .sub-menu > li > a:hover, .navigation .sub-menu > li > a:focus, .navigation .sub-menu > li > a:focus-within {
    color: #e2001a;
}
.close_btn {
    position: absolute;
    top: 10px;
    right: 10px;
}
.close_btn a {
    font-size: 1em;
    padding: 20px 15px;
    display: inline-block;
    letter-spacing: 3px;
    transition: color ease-in-out 0.4s;
    color: #fff;
}
.close_btn a:hover, .close_btn a:focus, .close_btn a:focus-within {
    color: #e2001a;
}
.data {
    padding: 0 20%;
}
.data__content {

    font-size: 26px;
    font-size: 1.625em;
    font-size: 1.625rem;
    line-height: 38px;
    color: #828282;
    font-style: italic;
    text-align: justify;
    opacity: 0;
    transform: translate(0, 50px);
}
@media (max-width: 680px) {
    .data__content {
        font-size: 16px;
        font-size: 1em;
        font-size: 1rem;
        line-height: 18px;
   }
}
.data__sub {
    color: #fff;
    float: left;
    margin-top: 2%;
    font-size: 11px;
    font-size: 0.6875em;
    font-size: 0.6875rem;
    opacity: 0;
    transform: translate(0, 50px);
}

.header-main-top{
    border-top: 6px solid #9e0025;
    /* border-bottom: 1px solid rgba(255,255,255,0.5); */
    /* background: rgba(130, 130, 130, .6); */
    position: relative;
    top: 0px;
    left: 0px;
    width: 100%;
    z-index: 100;
    background: rgb(41,81,168);
    background: linear-gradient(180deg, rgba(41,81,168,1) 0%, rgba(49,96,200,1) 100%);
    transition: all 0.5s ease;
}

.top-menu-left-wrap {
    display: flex;
    align-items: center;
    justify-content: space-around;
}

.top-menu-right-wrap {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

img.menu-btn {
    width: 15px;
    margin-right: 5px;
}

.header-left{
    border-right: 1px solid rgba(255,255,255,0.5);
    width: 20%;
    height: 125px;

}

.header-right{
    border-left: 1px solid rgba(255,255,255,0.5);

}

img.main-logo {
    width: 100%;
    margin: auto;
}




.header-container-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-content: center;
}

.header-center {
    text-align: center;
}
.header-menu-wrap{
    border-right: 1px solid rgba(255,255,255,0.5);
    padding: 54px 10px;
    width: 35%;
    height: 125px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.header-top-menu a {
    color: #FFF;
    font-size: 12px;
    font-weight: 600;
    padding: 0px !important;
    margin: 0px 7px;
    text-transform: uppercase;

    margin-left: 0px;
/*
    line-height: 5px; */
}

a.view-button {
    color: #FFF;
    text-decoration: none;
    background: #1c2237;
    padding: 5px 10px;
    font-size: 14px;
    border-radius: 5px;
}
section.club-gallery img {
    border-radius: 10px;
    width: 100px;
    margin: 10px;
    height: 100px;
    object-fit: cover;
}
section.featured-image {
    height: 600px;
    background-size: cover !important;
    background-position: center !important;
    display: flex;
    align-items: center;

    justify-content: flex-end;
}

section.page-content-contact {
    display: flex;
    justify-content: space-around;
}

.left-page-module {
    padding: 50px;
    width: 50%;
}

.yellow-bg{
    background: #f2ca4d;
}
.right-page-module {
    padding: 0px;
    width: 50%;
}

.maps-contact iframe {
    width: 100%;
}

.section-heading {
    text-align: right;
    font-size: 40px;
    font-weight: 600;
}


.white-text{
    color: #FFF;

}

.club-gallery{
    margin-top:50px;
}

.club-gallery h3{

}


span.bullet-seperator {
    background: #1a21ff;
    width: 4px;
    height: 4px;
    border-radius: 200px;
    display: inline-block;
    margin: 0px 10px;
}

.blog-meta {
    display: flex;
    align-items: center;
}

section.page-heading {
    padding-bottom: 50px;
}

section.blog-fetured-image img {
    width: 100%;
    border-radius: 10px;
    margin-bottom: 50px;
}
section.blog-fetured-image {
    padding: 0px;
}


section.club-gallery h3 {
    color: #212121;
}
.club-gallery {
    margin-top: 50px;
    border-top: 1px solid #eaeaea;
    padding: 50px 0px 0px 0px;
    border-radius: 0px;
}

section.maps-contact iframe {
    width: 100%;
}


.header-top-menu li:last-child a {
    margin: 0px !important;
    padding: 0px !important;
    border: none !important;
}
.top-menu-right-wrap ul{
    margin: 0px;
    padding: 0px;
    display: flex;
    list-style: none;
}

.top-menu-right-wrap ul li{

    border-left: 1px solid rgba(255,255,255,0.5);

    padding-left: 35px;
    padding-right: 35px;
    height: 125px;
    display: flex;
    align-items: center;
}


.top-menu-right-wrap a{
    color: #FFF;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
}
img.search {
    width: 20px;
}

li.lang-menu a {
    display: flex;
    justify-content: space-between;
}

img.lang-arrow {
    width: 15px;
    margin-left: 10px;
}

section.page-heading h3 {
    font-size: 48px;
    line-height: 1.32;
    font-weight: 500;
    color: #212121;
    font-family: 'Poppins', sans-serif;
    font-weight: 500;
}

section.page-heading p {
    color: #212121;
    font-size: 18px;
    margin-top: 1rem;
}

.header-menu-bottom {

    padding: 15px;
    transition: all 0.5s ease;
    background: #1c2237;
}

.darkHeader .header-menu-bottom {
    /* background: #1c2237;
    border: none; */
}

.header-menu-bottom a {
    color: #FFF;
}

.header-menu-bottom ul li a {
    margin: 0px;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    border-right: 1px solid rgba(255,255,255,0.5);
    padding: 0px 25px !important;
    line-height: 15px;
}

.header-menu-bottom ul li a:hover {
color:#f2ca4d;

}
.header-menu-bottom ul li:last-child a {
border: none;
padding-right: 0px;
margin-right: 0px;

}
.darkHeader .header-menu-bottom ul li a:hover {
    color:#f2ca4d;

    }

    .header-page .header-menu-bottom ul li a:hover {
        color:#f2ca4d;

        }

.navigation.modal-open {
    position: fixed;
    height: 100vh;
    width: 100%;
    left: 0px;
    top: 0px;
    z-index: 100;
}

.header-menu-wrapper ul.navbar-nav.me-auto.mb-2.mb-lg-0 {
    margin: 0px !important;
}
.header-date {
    text-align: right;
    color: #FFF;
    font-size: 14px;
    flex-wrap: nowrap;
    justify-content: flex-end;
    display: flex;
    align-items: center;
    height: 100%;
}
.darkHeader{
    /* background: #800000;
    border-bottom: none;
    border-top: 6px solid #1c2237; */
    position: fixed;
        background: #FFF;
        box-shadow: 0 0 5px 0 rgb(0 0 0 / 16%);
        padding: 10px;
}


.contact-info {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
}

.contact-icon img {
    width: 100%;
}
.contact-icon {
    width: 6%;
    margin-right: 20px;
}

.contact-details h3 {
    font-size: 17px;
    margin-bottom: 0px;
}

.contact-details {
    font-size: 14px;
}

h3.page-module-heading {
    margin-bottom: 40px;
}

.contact-form {
    font-size: 14px;
}
.contact-form label {
    margin-bottom: 10px;
}

.contact-form button.btn.btn-primary {
    background: #800000;
    border: #800000;
    font-size: 15px;
    padding: 10px 30px;
}
.slideshow .owl-nav {
    margin: 0px;
    position: absolute;
    top: 50%;
    right: 0px;
}

.slideshow .owl-carousel .owl-nav button {
    background: #FFF !important;
    padding: 5px 30px !important;
    border-radius: 0px;
    display: block;
    margin: 0px;
}

.slideshow .owl-carousel .owl-nav button span {
    font-size: 50px;
}


.slideshow .owl-theme .owl-nav [class*='owl-']:hover {

    color: #9e0025;
    text-decoration: none;
}

.slideshow .owl-theme .owl-dots {
    position: absolute;
    left: 20px;
    top: 50%;
}

.slideshow .owl-theme .owl-dots button.owl-dot {
    display: block;
}


.slideshow .owl-theme .owl-dots .owl-dot.active span, .slideshow .owl-theme .owl-dots .owl-dot:hover span {
    background: #9e0025
}

.slideshow .video-item{
    width: 100%;
    height: auto;
}

img.img-responsive {
    width: 100%;
    height: auto;
}
.card.search-wrap-results {
    margin: 0px;
    padding: 0px;
}

.card.search-wrap-results .card-header {
    padding: 20px;
}

.card.search-wrap-results .card-body {
    padding: 50px;
}

.card.search-wrap-results ul a {
    color: #1c2237;
    text-decoration: none;
}

img.arrow-right-services {
    width: 20px !important;
}

img.wa-icon {
    width: 40px;
}

.forms-wrap td p {
    font-size: 12px;
    margin: 0px;
    color: #333;
}

.service-item-details-heading {
    display: flex;
    justify-content: space-between;
    flex-direction: row;
}

.service-item {
    display: flex;
    padding: 30px;
    background: #FFF;
    align-items: center;
    box-shadow: 0px 0px 19px 1px rgba(0,0,0,0.22);
-webkit-box-shadow: 0px 0px 19px 1px rgba(0,0,0,0.22);
-moz-box-shadow: 0px 0px 19px 1px rgba(0,0,0,0.22);
width: 400px;
height: 130px;
}

.service-item-details-heading h3 {

    margin: 0px;
    font-size: 16px;
    width: 95%;
    font-weight: 700;
}

.service-item-details p {
    font-size: 14px;
    margin: 10px 0px 0px 0px;
    height: 35px;

}
.news-right .card-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}


.news-right .card-header a.blue-btn.home-action-btn {
    padding: 10px 15px;
    font-size: 12px;
}

section.slideshow {
    position: relative;
}

.social-media-link {
    position: absolute;
    z-index: 10;
color:#FFF;
    bottom: 100px;
    display: flex;
    left: 100px;
}

.social-media-link ul {
    margin: 0px;
    padding: 0px;
    list-style: none;
    margin-left: 20px;
}

.facebook-feed iframe{
    width: 100% !important;
}

.facebook-feed {
    margin-left: 25px;
}

.addition-right img {
    width: 100%;
}

.social-media-link img{
    width: 25px;
}

.service-item-details {
    margin-left: 30px;
    width: 85%;
}

img.service-icon {
    width: 50px !important;
}


.our-services .item {
    padding: 30px;
}

.our-services .item a{
    text-decoration: none;
}
.our-services .item a h3{
color:#202c5c;
}

.our-services .item a p{
color: #64728d;
}

section.our-services {
    margin-top: -80px;

}
section.home-quotes {

    padding-top: 150px;
    padding-bottom: 100px;
    background-color: #fbfaf8;
    background-image: url('../assets/images/quote-bg.jpeg');
    background-repeat: no-repeat;
    background-size: contain;
}

.quote-text {
    width: 50%;
    margin: auto;
    color: #64728d;
    text-align: center;
    font-family: 'Poppins', sans-serif;
    font-weight: 500;
    font-weight: 500;
    font-size: 20px;
}

.program{
    margin-top: 50px;
}

.program-heading {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 50px;
}

.program-wrap-content{
    text-align: center;
}

.program-name a {
    color: #202c5c;
    text-decoration: none;
    font-size: 15px;
    font-weight: 500;
    background: #FFF;
    box-shadow: 0px 0px 19px 1px rgb(0 0 0 / 22%);
    -webkit-box-shadow: 0px 0px 19px 1px rgb(0 0 0 / 22%);
    -moz-box-shadow: 0px 0px 19px 1px rgba(0,0,0,0.22);
    padding: 15px 25px;
    display: inline-block;
    text-transform: uppercase;
}

.program-name {
    padding: 20px 0px;
    margin-top: -45px;
}

#announcement .modal-body {
    padding: 0px;
}

a.blue-btn.home-action-btn {
    text-transform: uppercase;
    background: #202c5c;
    color: #FFF;
    text-decoration: none;
    font-weight: 500;
    padding: 10px 20px;
    border-radius: 5px;
    font-size: 14px;
}

.program-featured-image {
    background-size: cover !important;
    background: #eaeaea;
    height: 250px;
    background-repeat: no-repeat !important;
}

.footer-left-address {
    display: flex;
    justify-content: space-between;
    border-right: 1px solid rgba(255,255,255,0.15);
    padding: 25px 0px;
}

.qr-code {
    width: 30%;
    margin-right: 45px;
}

footer {
    font-size: 14px;
}
.footer-address {

}

.footer-menus h3 {
    font-size: 14px;
    font-family: 'Poppins', sans-serif;
    font-weight: bold;
    text-transform: uppercase;
    width: 70%;
    font-weight: bold;
    margin-bottom: 25px;
}

.footer-menus ul{
    margin: 0px;
    padding: 0px;
    list-style: none;
}
.footer-menus ul li{
    margin-bottom: 10px;
}

.footer-menus ul li a{
    color:#FFF;
    text-decoration: none;
}

.footer-address h3 {
    font-size: 14px;
    font-family: 'Poppins', sans-serif;
    font-weight: bold;
    text-transform: uppercase;
    width: 70%;
    font-weight: bold;
    margin-bottom: 25px;
}
.footer-social h3{
    font-size: 14px;
    font-family: 'Poppins', sans-serif;
    font-weight: bold;
    text-transform: uppercase;
    width: 70%;
    font-weight: bold;
    margin-bottom: 25px;
}

.footer-social ul{
    margin: 0px;
    padding: 0px;
    list-style: none;
    display: flex;
    align-items: flex-start;
}
.footer-social ul li {
    display: inline-block;
    margin: 0px 10px;
}


.footer-social img {
    width: 23px;
}
.footer-social ul li a{
    color: #ccc;
    text-decoration: none;
    font-size: 20px;
}

.footer-address ul {
    margin: 0px;
    padding: 0px;
    list-style: none;
}

.footer-address ul li {
    font-size: 13px;
    margin-bottom: 10px;
    display: flex;
    justify-content: flex-start;
    flex-direction: row;
    align-items: flex-start;
}

.footer-menu{
    padding: 25px 50px;

}

.footer-menu.footer-2{

    border-right: 1px solid rgba(255,255,255,0.15);
}


.footer-menu h3 {
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 25px;
    text-transform: uppercase;
}

.footer-menu ul {
    margin: 0px;
    padding: 0px;
    list-style: none;
}


.footer-menu ul li a{
    font-size: 13px;
    color: #FFF;
    margin-bottom: 10px;
    text-decoration: none;
    line-height: 20px;
    display: block;
}
.footer-menu ul li:last-child a{
    margin: 0px;
}

.waktu-operasi h4{
    font-size: 14px;
    font-weight: bold;
}

.waktu-operasi {
    background: #1c2237;
    padding: 20px;
    border-radius: 10px;
    font-size: 13px;
}

.waktu-operasi ul{
    margin: 0px 0px 15px 0px;
    padding: 0px;
    list-style: none;
}

.waktu-operasi ul li{

}
.footer-right{
    padding: 25px 25px;
}

.footer-right h3 {
    font-size: 14px;
    font-weight: bold;
    text-transform: uppercase;
    margin-bottom: 25px;
}

.program-heading-title h3 {
    color: #202c5c;
    font-size: 40px;
    font-weight: 600;
    letter-spacing: -1px;
}
img.footer-icon {
    width: 20px;
    height: auto !important;
    margin-right: 10px;
}

img.qrcode {
    width: 100%;
}


.news{
    background: #1243a6;  /* fallback for old browsers */
background: -webkit-linear-gradient(to right, #1243a6, #0f868a);  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to right, #1243a6, #0f868a); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
padding: 100px 0px 0px 0px;
    text-align: center;
    height: 550px;

}

.news-heading{
    margin-bottom: 50px;
}
.news-heading h3 {
    color: #102D47;
    font-size: 45px;
    font-weight: 600;

}

.news-heading p{
    font-size: 16px;
    margin: 0px;
    color: #959595;
}

.community .news-heading p {
    width: 50%;
}

.news-item{
    margin: 20px;
    background: #FFF;
    box-shadow: 0px 0px 19px 1px rgba(0,0,0,0.05);
    -webkit-box-shadow: 0px 0px 19px 1px rgba(0,0,0,0.05);
    -moz-box-shadow: 0px 0px 19px 1px rgba(0,0,0,0.05);
    border-radius: 10px;
    padding: 20px;

}

.news-featured-image img {
    border-radius: 10px;
}

.news-featured-image {
    height: 300px;
    border-radius: 10px;
    background: #eaeaea;
    overflow: hidden;
}

img.news-image {
    width: 100%;
}
.news-details {
    display: flex;
    justify-content: space-between;
    padding: 30px 0px;
}

#news-content {
    display: flex;
    justify-content: space-between;

}

h3.news-title {
    margin: 0px;
    font-size: 17px;

}


h3.news-title a{

    color: #102D47;
    text-decoration: none;
    font-weight: 600;

    margin-bottom: 10px;
    display: block;

}

.community-right a {
    background: #F1C40F;
    color: #000;
    text-decoration: none;
    padding: 10px;
    display: block;
    border-radius: 10px;
    font-weight: 600;
    font-size: 14px;
}
.community-left {
    padding-right: 20px;
}

p.community-details {
    font-size: 13px;
    color: #102D47;
    line-height: normal;
}

span.news-date {
    color:#202c5c;
    font-size: 12px;
}
.links{
    padding: 250px 0px 50px 0px;
}

.events-more {
    margin: 20px 0px;
}

#links img {

    margin: auto;
}
.logo-carousel {
    width: 70%;
    margin: auto;
}

.section-addition {
    padding: 100px 0px 0px 0px;
}

.news-featured-image img {
    object-fit: cover;
    height: 100%;
}

.page-content-news{
    padding: 0px 0px;
}

img.pengarah {
    width: 100%;
}

.image-photos {
    height: 300px;

}

.image-photos img {
    width: 100%;
    height: 100%;
    -webkit-border-top-left-radius: 10px;
-webkit-border-top-right-radius: 10px;
-moz-border-radius-topleft: 10px;
-moz-border-radius-topright: 10px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
    object-fit: cover;
}

.info-details h3 {
    font-size: 20px;
    color: #212121 !important;
    line-height: normal;
    font-family: 'Poppins', sans-serif;
    font-weight: 500;
}

.info-details p {
    font-size: 14px;
    color: #444;
}

.info-details {
    background: #FFF;
    -webkit-border-bottom-right-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-moz-border-radius-bottomright: 10px;
-moz-border-radius-bottomleft: 10px;
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px;
    padding: 40px 35px;
}


img.flag-menu {
    width: 20px;
    margin-left: 10px;
}


.overview-heading {
    font-size: 30px;
    color: #102D47;

    font-weight: 600;
    text-align: center;
    width: 40%;
    margin: 30px auto;
    line-height: 35px;
    text-align: center;
}


ul.top-lang li a {
    /* padding-right: 10px; */
  margin-right: 5px;

}

ul.top-language li a:hover {

color: #f2ca4d;


}



.top-lang li.nav-item a {
    color: #FFF !important;
    font-size: 14px;
    padding: 5px 10px;
    margin: 0px;
    border-radius: 5px;
    font-weight: 700;
}

.top-lang li.nav-item a:hover
{

    color: #f2ca4d;
    background: #1c2237;

    }



    .top-language a.nav-link.current-language{

    color: #f2ca4d;
    }

.top-language li.nav-item {
    padding: 0px 15px;
}


ul.top-language li a:last-child {
    /* padding-right: 10px; */
    margin-right: 0px;
}


.top-language a.nav-link {
    display: flex;
    padding: 7px 13px;
    border-radius: 5px;
}

.top-lang a.nav-link.current-language {
    color: #f2ca4d !important;
    background: #1c2237;
}
.page-sidebar {
    padding-right: 50px;
    padding-top: 4.8rem;
    padding-bottom: 4.8rem;
}
.page-sidebar ul {
    margin: 0px;
    padding: 0px;
    list-style: none;
}


.page-sidebar ul li a {
    text-decoration: none;
    margin-bottom: 10px;
    padding: 10px 15px 10px 25px;
    display: block;
    transition: all 0.5s ease;
    font-size: 13px;
    position: relative;
    color: #5C5C5C;
    border-bottom: 1px solid #CCC;
}

.page-sidebar h3 {
    margin-bottom: 25px;
    font-size: 22px;
    font-family: 'Poppins', sans-serif;
    font-weight: 500;
    color:#202c5c;
    border-left: 3px solid #1a21ff;
    padding-left: 20px;
}


.news-date {
    color: #1a21ff;
    font-size: 14px;
    font-weight: 600;
}

div#myTabContent {
    background: #FFF;
    padding: 40px;
    -webkit-border-bottom-right-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-moz-border-radius-bottomright: 10px;
-moz-border-radius-bottomleft: 10px;
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px;
border-top: 2px solid #9e0025;
    margin-top: -1px;
}

.forms-wrap {
    margin-top: 50px;
}


a.download-btn {
    background: #800000;
    color: #FFF !important;
    text-decoration: none;
    padding: 5px 10px;
    border-radius: 3px;
    font-size: 12px;
    font-weight: bold;
    display: block;
    margin-bottom: 10px;
}

a.download-btn i{
    margin-right: 5px;
}


table.table.table-bordered th {
    background: #ff8e62;
    padding: 20px;
    border: none;
}

.table-responsive table {
    /* border-radius: 5px; */
    overflow: hidden;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.table-responsive table td {
    padding: 15px;
}

.text-center{
    text-align: center;
}

.table-responsive table tr:nth-child(even){
    background: #efefef;
}
.forms-wrap .nav-link {
    padding: 14px 20px;

    font-size: 14px;
    text-transform: uppercase;
    background-color: #FFF;
    font-weight: bold;
    color: #202c5c;
    margin: 0px 4px;
    margin-bottom: 0px;
    /* color: #FFF; */
}


.forms-wrap .nav-link.active{
    background: #9e0025;
    color: #FFF;
}


.forms-wrap ul#myTab.nav-tabs {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: stretch;
    justify-content: center;
    align-content: center;
}

.forms-wrap ul#myTab.nav-tabs li a {
    height: 100%;
    text-align: center;
    display: flex;
    line-height: 15px;
    align-items: center;
    border: 1px solid #eaeaea;
    border-bottom: none;
}

.page-sidebar ul li a:before {
    position: absolute;
    content: '';
    width: 5px;
    height: 5px;
    background: #1a21ff;
    border-radius: 5px;
    left: 0px;
    top: 17px;
}

.page-sidebar ul li:last-child a {
    border:none;
    margin-bottom: 0px;
    padding-bottom: 0px;
}

.page-sidebar ul li a:hover {
    color: #1a21ff;
}

a.read-more-btn {
    background: #1a21ff;
    color: #FFF;
    text-decoration: none;
    padding: 10px 15px;
    display: inline-block;
    border-radius: 5px;
    font-size: 13px;
    font-weight: 700;
    margin-top: 15px;
}


.pagination li.page-item.active span.page-link {
    background: #800000;
    color: #FFF !important;
    border: 1px solid #800000;
}

.pagination li.page-item a.page-link {
    color: #800000 !important;
}


.pagination-bottom ul.pagination {
    display: flex;
    justify-content: center;
    align-items: center;
}

.section-addition .col-lg-7 {
    align-items: flex-start;
    padding-right: 100px;
    align-content: flex-start;
}


.additonal-item h3 {
    color: #202c5c;
    font-size: 35px;
    font-weight: 600;
    margin-bottom: 50px;
}

.additonal-item h3 span {
    display: block;
    font-size: 20px;
    font-weight: 400;
}


.additonal-item p {
    color: #64728d;
    font-size: 15px;
    text-align: justify;
}

.small-item {
    color: #64728d;
    margin-top: 20px;
}

img.menu-icon-right {
    width: 20px;
    margin-left: 10px;
}

.career-poster img {
    width: 100%;
}
.content-details-right{
    padding-left: 50px;
}

.header-page .header-menu-bottom {
    border-top: none;
    padding: 25px;
    background: #1c2237;
}

.listing-item {
    border: 1px solid #ddd;
    background: #FFF;
    border-radius: 4px;
    padding: 20px 30px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.listing-item-action img {
    width: 20px;
}

.listing-item-date i {
    font-size: 10px;
}

a.item-listing {
    text-decoration: none;
    color: inherit;
}

.listing-item-title h3 {
    color: #1c2237;
    font-size: 17px;
    margin-bottom: 5px;
}
.listing-item-date {
    color: #333;
    font-size: 13px;
}



.header-center {
    width: 35%;
}

.menu-bottom-wrap li.nav-item a {
    display: flex;
    align-items: center;
    height: 100%;
}

.header-right {
    height: 125px;
    width: 20%;
    display: flex;
    justify-content: space-between;
    padding-left: 0px;
}

.header-top-menu .nav-link:focus, .header-top-menu .nav-link:hover {
    color: #9e0025;
}

.darkHeader .header-top-menu .nav-link:focus, .darkHeader .header-top-menu .nav-link:hover {
    color: #FFFF00 !important;
}

.top-menu-right-left-top {
    border-bottom: 1px solid rgba(255,255,255,0.5);
    height: 50%;
    display: flex;
    text-align: center;
    justify-content: center;
    align-items: center;
    width:100%;
}
img.whatsapp-top {
    width: 15px;
}

.top-lang {
    margin: 0px;
    padding: 0px;
    list-style: none;

}


.top-lang li{

    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}
.top-menu-right-left-bottom {
    height: 50%;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
}

.top-menu-right-left-wrap {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

    justify-content: space-evenly;
}

a.whatsapp-careline {
    color: #FFF;
    text-decoration: none;
    font-size: 14px;
    font-weight: 700;
}

img.close {
    width: 20px;
}

.myWrapper ul{
    margin: 0px;
    padding: 0px;
    list-style: none;
    width: 50%;
}

.news-image-left img{
    width: 100%;
    height: 100%;
}

.myWrapper ul li {
    margin: 0px 20px 20px 20px!important;
    margin-bottom: 20px;
}
.myWrapper ul li a{
    display: flex !important;
    flex-direction: row;
    padding: 0px !important;
    box-shadow: none !important;
    background: transparent !important;
    border-bottom: 1px solid #eaeaea;
    border-radius: 0px !important;
    padding-bottom: 20px !important;
    margin-bottom: 20px !important;
    text-decoration: none;
    font-size: 15px;
    align-items: flex-start;
    align-content: flex-start;
}

.myWrapper ul li:last-child a{
    border-bottom: none;
    margin-bottom: 0px;
    padding-bottom: 0px;

}



.news-image-info {
    padding-right: 25px;
    border-right: 1px solid #eaeaea;
    margin-right: 25px;
    width: 70%;
}

.myWrapper h3{
    color: #202c5c;
    font-size: 16px;
}
.myWrapper p{
    color: #64728d;
    font-size: 13px;
    margin: 0px;
}
.news-date-ticker{
    font-size: 12px;
    margin-top: 30px;
    font-family: 'Poppins', sans-serif;
    font-weight: 500;
    display: flex;
    justify-content: space-between;
    color: #1a21ff;
    align-items: center;
}

.news-date-ticker i {
    font-size: 20px;
}
.news-right h3.block-heading {
    color: #202c5c;
    font-size: 30px;
    font-weight: 600;
    margin-bottom: 50px;
}
.myWrapper {
    /* margin-left: -20px; */
    display: flex;
    align-content: flex-start;
    justify-content: space-between;
}

.main-news {
    width: 50%;
    margin-right: 35px;
}

.top-main-news h3 {

}

.main-news-image{
    margin-bottom: 25px;
    border-radius: 10px;
    overflow: hidden;
}

.main-news-image-icon {
    width: 17px;
    margin-left: 20px;
}
a.main-news-button {
    font-size: 14px;
    color: #9e0025;
    margin-top: 20px;
    display: block;
    text-decoration: none;
}

.main-news-image img {
    width: 100%;
}

ul.top-shortcut-menu img {
    width: 25px;
}

ul.top-shortcut-menu {
    display: flex;
    margin: 0px;
    padding: 0px;
    list-style: none;
    justify-content: center;
}

ul.top-shortcut-menu li{
    margin: 0px 5px;
}

.links-name {
    text-align: center;
    text-decoration: none;
    font-size: 14px;
    color: #202c5c;
    font-weight: 600;
    margin: 0px 15px;
}

img.footer-counter {
    width: 80px;
}
.text-right {
    text-align: right;
}

.links a {

    text-decoration: none;

}

header.header-main-top.header-page {
    /* position: relative;
    background: #800000;

    border-top: 6px solid #1c2237; */
}

section.page-content {

}

.page-wrap{
    padding: 100px 0px 100px 0px;

}
.kreno-overview .container {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    margin-top: -50px;
}
.overview-list ul {
    margin: 0px;
    padding: 0px;
    list-style: none;
    display: flex;
    align-items: center;
    flex-direction: row;
    align-content: center;
    flex-wrap: wrap;
}

.overview-list ul li {
    width: 50%;
    font-size: 14px;
    margin-bottom: 5px;
}
.overview-list ul li img {
    margin-right: 10px;
}

.overview-list {
    width: 35%;
    margin: 0px auto;
    text-align: left;
}
.kreno-overview {
    padding: 100px;
    background-image: url(../assets/images/overview.png);
    background-repeat: no-repeat;
    background-size: auto 120%;
    height: 1000px;
    background-position: center;
}


section.testimoni-clients {
    text-align: center;
    margin-top: -150px;
    padding: 0px 0px 100px 0px;
}
.center-heading h3 {
    color: #212121;


    font-weight: 600;

    line-height: 60px;
    margin-bottom: 25px;
    font-size: 2.5rem;

    letter-spacing: -.4px;
}
.item.testimoni-item img {
    width: 100px;
    margin: auto;
    height: 100%;
    border-radius: 500px;
    overflow: hidden;
}

.item.testimoni-item p {
    color: #959595;
    font-style: italic;
    font-size: 15px;
    margin: 20px 0px 0px;
}

.item.testimoni-item h3 {
    color: #102D47;

    font-weight: 500;
    margin: 20px;
    font-size: 25px;
}

.item.testimoni-item {
    background: #FFF url('../assets/images/testimoni_quotes.png');
    box-shadow: 0px 0px 19px 1px rgb(0 0 0 / 5%);
    -webkit-box-shadow: 0px 0px 19px 1px rgb(0 0 0 / 5%);
    -moz-box-shadow: 0px 0px 19px 1px rgba(0,0,0,0.05);
    border-radius: 10px;
    background-repeat: no-repeat;
    background-position: 10% 50%;
    margin: 20px;
    padding: 50px;
}

section.achievements {
    text-align: center;
    padding-bottom: 100px;
}

.center-heading p {
    color: #2e2e2e;
    margin-top: 0px;
    width: 50%;
    margin-left: auto;
    margin-right: auto;
    font-weight: 400;
}





.why-item{

position: relative;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
padding: 42px 60px;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
border-radius: 8px;
background-color: #fff;
box-shadow: 0 2px 8px 0 rgb(0 0 0 / 8%), 0 1px 3px 0 rgb(0 0 0 / 12%);
flex-direction: column;
margin-top: 35px;
text-align: left;


}
.why-item.center-item{
    text-align: center;
}

.why-item.center-item ul{
    margin: 0px;
    padding: 0px;
    list-style: none;
}

.why-item.center-item ul li{
    background:#f5f2ff;
    border-radius: 8px;
    margin-bottom: 5px;
    padding: 1.2rem 2.5rem;
    color:#5800f9;
    text-align: left;
    font-family: 'Poppins', sans-serif;
    font-weight: 500;
}

.why-item.center-item ul li i{
    margin-right: 10px;
}


a.hire-now {
    color: #FFF;
    background: #1a21ff;
    text-decoration: none;
    border-radius: 5px;
    font-weight: 600;
    font-size: 16px;
    padding: 1em 1.5em;
    font-family: 'Poppins', sans-serif;
    font-weight: bold;
    margin-top: 25px;
    text-align: center;
}


.why-item h3 {
    font-size: 1rem;
    color: #000;
    font-family: 'Poppins', sans-serif;
    font-weight: 500;
    margin: 0rem 0px 1.6rem;
}

.why-item ul {
    margin: 0px;
    padding: 0px 0px 0px 15px;
}

.blog-container-item {
    box-shadow: rgb(11 43 158 / 15%) 0px 6px 20px -6px !important;
    border-radius: 10px;
    position: relative;

}
a.blog-link {
    position: absolute;
    border-radius: 10px;
    height: 100%;
    width: 100%;
    display: block;
    left: 0px;
}

section.breadcrumbs {

    box-shadow: rgb(11 43 158 / 15%) 0px 6px 20px -6px;
    background: #FFF;
    padding: 20px 0px;
    font-size: 14px;
}

section.breadcrumbs ul {
    margin: 0px;
    padding: 0px;
    list-style: none;
    display: flex;
}

section.breadcrumbs ul li{
    margin-right:10px;
    font-family: 'Poppins', sans-serif;
    font-weight: 500;
}

section.breadcrumbs ul li a{
    color: #000;
    font-family: 'Poppins', sans-serif;
    font-weight: 500;
    text-decoration: none;
}

section.breadcrumbs ul>li+li:before {
    padding: 0 5px;
    color: #ccc;
    content: "/\00a0";
}
li.breadcrumbs-current-page {
    color: #777;
}


section.page-content p {
    color: rgb(91, 105, 135);
    font-size: 15px;
    line-height: 28px;
}

section.page-content {
    margin-top: 0px;
    font-size: 15px;
    padding: 0px;
}

.header-top-menu {
    width: 75%;
}


ul.department-main li:first-child a {
    color: #800000;
    font-weight: 700;
}


.sidebar-menu-active{
    color: #800000 !important;
    font-weight: 700;
}

.staff-profile {
    background: #FFF;
    padding-top: 20px;
    border-radius: 10px;
}

.staff-photo img {
    width: 100%;
    object-fit: cover;
    height: 100%;
}

.staff-photo {

    overflow: hidden;
    width: 150px;
    margin: 20px auto;
    height: 150px;
}

.staff-info h3 {
    color: #202c5c;
    font-size: 20px;
    font-weight: 600;
}

.staff-position {
    color: #0084ca;
    font-size: 14px;
    width: 70%;
    margin: auto;
    line-height: 18px;
    margin-bottom: 10px;
}

.staff-gred {
    color: #EDC87C;
    font-weight: 700;
    font-size: 14px;
}

.staff-contact ul {
    margin: 0px;
    padding: 0px;
    list-style: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 14px;
}
.staff-info {
    text-align: center;
    padding: 20px 25px;
    min-height: 150px;
}

.staff-contact {
    border-top: 1px solid #eaeaea;
    padding: 20px;
}

.staff-contact ul li {
    display: flex;
    align-items: center;
    font-size: 13px;
}

.staff-contact ul li i {
    margin-right: 5px;
    height: 15px;
    color: #0084ca;
    font-size: 12px;
}


section.staff-search {
    background: #ff8e62;
    padding: 25px 30px;
    margin: 25px 0px;
    border-radius: 5px;
}

.staff-search-form input {
    width: 100%;
    border: none;
    border-radius: 5px;
    height: 40px;
    padding: 0px 15px;
    font-size: 14px;
    color: #669999;
}

.staff-search-form select {
    width: 100%;
    border: none;
    border-radius: 5px;
    height: 40px;
    padding: 0px 15px;
    font-size: 14px;
}

section.staff-search button {
    background: #800000;
    color: #FFF;
    height: 40px;
    border: none;
    padding: 0px 20px;
    border-radius: 5px;
    font-weight: 600;
    font-size: 13px;
    width: 100%;
}

h3.search-heading i {
    font-size: 16px;
    margin-right: 10px;
}

h3.search-heading {
    color: #FFF;
    font-size: 20px;
    margin-bottom: 20px;
}



.staff-menu-item {
    background: #FFF;
    /* padding-top: 20px; */
    height: 100%;
    border-radius: 10px;
}


a.icon-menu-link{
    text-decoration: none;
    color: #202c5c;
    height: 100%;
}

.staff-menu-name {
    background: rgb(41,81,168);
    text-align: center;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    padding: 20px 10px;
    /* font-size: 14px; */
}


.staff-menu-name h3{
   font-size:16px;
   margin: 0px;
   font-weight: 700;
   padding: 0px;
}

a.icon-menu-link .staff-menu-name h3{

    color: #FFF !important;

}

.staff-menu-icon {
    text-align: center;
    margin: 25px 0px;
}

.staff-menu-icon img {
    width: 30%;
    margin: auto;
    margin-top: 20px;
}

.staff-menu-title h3 {
    margin: 0px;
    padding: 10px 30px 50px 30px;
    text-align: center;
    font-size: 16px;
}

a.icon-menu-link .staff-menu-title h3 {
    color:#1c2237;
}


ul.sidebar-sub-menu li {
    margin-left: 30px;
}

ul.sidebar-sub-menu li a {
    text-decoration: none;
    margin-bottom: 10px !important;
    padding: 10px 15px 10px 25px !important;
    display: block;
    transition: all 0.5s ease;
    font-size: 13px;
    position: relative;
    color: #5C5C5C;
    border-bottom: 1px solid #CCC !important;
}

.feedback-model-wrap{
    position: relative;
}
img.feedback-model {
    width: 90%;
    position: absolute;
    bottom: -100px;
    right: 0px;
}

img.featured-image-photos {
    width: 100%;
    margin: 50px 0px;
}

.photo-gallery {
    position: relative;
    border-radius: 10px;
    overflow: hidden;
}

img.feedback-model {
    width: 100%;
}

.content-slideshow {
    position: relative;
    margin: 0;
    top: 2px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    height: 40rem;
    overflow: hidden;
}

h3#full-gallery-title {
    margin-top: 50px;
}


section.page-heading .container {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-direction: column;
    padding-right: 30%;
}

.photo-gallery .info-details {
    position: absolute;
    top: 0px;
    width: 100%;
    height: 100%;
    border-radius: 0px;
    background: rgba(41, 81, 168, 0.84);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-start;
}


.feedback-form label {
    margin-bottom: 10px;
    width: 100%;
}
.feedback-form textarea#message {
    height: auto;
}

.feedback-form {
    padding-top: 50px;
}
.feedback-form button.btn.btn-primary {
    background: #800000;
    border: #800000;
    font-size: 15px;
    padding: 10px 30px;
}
.feedback-form .form-control {
    appearance: auto;
    height: 60px;
}
.feedback-form .form-control {
    appearance: auto;
}
.photo-gallery .info-details .news-date-ticker {
    color: #FFF;
}

.photo-gallery .info-details h3 {
    color: #FFF !important;
}

.photo-gallery .info-details p {
    color: #FFF;
}

.photo-gallery img {
    filter: grayscale(100%);
}

.si-image {
    flex-wrap: nowrap;
    flex-direction: row;
    justify-content: space-between;
    display: flex;
    width: 50%;
}
.si-image img {

}
section.page-content.list-view .col-lg-4.mb-4 {
    width: 100% !important;
}

section.page-content.list-view .col-lg-4.mb-4 .staff-profile {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px;
}

section.page-content.list-view .col-lg-4.mb-4 .staff-profile .staff-photo {
    margin: 0px;
    width: 120px;
    height: 120px;
}
section.page-content.list-view .col-lg-4.mb-4 .staff-profile .staff-info {
    text-align: left;
    padding: 20px 0px;
    min-height: auto;
    width: 35%;
}

section.page-content.list-view .col-lg-4.mb-4 .staff-profile .staff-info .staff-position {
    width: 100%;
}

section.page-content.list-view .col-lg-4.mb-4 .staff-profile .staff-contact {
    border: none;
    width: 40%;
}


.iso-footer img {
    width: 100%;
    border-radius: 10px;
    border: 10px solid #FFF;
}


.iso-footer {
    width: 100%;
}
.change-layout {
    margin-bottom: 25px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.list-view {
    margin-right: 20px;
    cursor: pointer;
    /* display: flex; */
    /* align-items: center; */
}

.grid-view {
    cursor: pointer;
    /* display: flex; */
    /* align-items: center; */
}
.change-layout i{
    margin-right: 5px;
}
.heading-title{
    margin-bottom: 50px;
}
h3.sitemap-heading {
    font-size: 20px;
    text-transform: uppercase;
}

ul.menu-item a {
    text-decoration: none;
    color: #9e0025;
}

.search-wrapper input {
    height: 60px;
}

.search-wrapper button {
    height: 60px !important;
}

.header-menu-bottom div#navbarSupportedContent ul {

}

.menu-bottom-wrap ul.dropdown-menu {
    background: rgb(41,81,168);
    border-radius: 5px !important;
    min-width: 200px;
    left: 20px;
    top: 30px;
    border: none;
}

.mobile-top-header {
   display: none;
}


.menu-bottom-wrap ul.dropdown-menu li a {
    padding: 10px 20px !important;
}


.header-menu-bottom ul li ul.dropdown-menu a:hover {
    color: #f2ca4d;
    background: transparent !important;
}

.navbar-expand-lg .navbar-nav .nav-link{
    color:#333;
}
.navbar-expand-lg .navbar-nav .nav-link:hover{

color:#4611a7;
}

a.dropdown-item-main {
    color: #FFF;
    position: relative;
}

a.dropdown-item-main:before {
    content: '';
    position: absolute;
    background: #FFF;
    width: 10px;
    height: 1px;
    left: -20px;
    top: 9px;
}


.menu-main-left a.dropdown-item-main {
    color: #828282;
}

.menu-main-left a.dropdown-item-main:before {
    content: '';
    position: absolute;
    background: #828282;
    width: 10px;
    height: 1px;
    left: -20px;
    top: 9px;
}

.helper-float {
    position: fixed;
    top: 200px;
    left: -155px;
    z-index: 100;
    background: #000;
    padding: 20px;
    -webkit-border-top-right-radius: 5px;
    -webkit-border-bottom-right-radius: 5px;
    -moz-border-radius-topright: 5px;
    -moz-border-radius-bottomright: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;

    transition: all 0.5s ease;
}

.helper-float.active {
    left: 0px;

}

.helper-heading {
    color: #FFF;
    font-size: 12px;
    text-align: center;
    margin-bottom: 5px;
}

.color-selection{
    margin-bottom: 20px;
}
.table-responsive table tr:nth-child(odd) {
    background: #FFF;
}

.helper-icon {
    position: absolute;
    right: -45px;
    background: #000;
    cursor: pointer;
    /* padding: 10px; */
    width: 50px;
    height: 50px;
    line-height: 55px;
    -webkit-border-top-right-radius: 5px;
    -webkit-border-bottom-right-radius: 5px;
    -moz-border-radius-topright: 5px;
    -moz-border-radius-bottomright: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    text-align: center;
}
.helper-icon i{
    color: #FFF;
}

.font-resizer {
    display: flex;
    justify-content: center;
    align-items: center;
}
.font-resizer a {
    background: #FFF;
    text-decoration: none;
    width: 25px;
    display: block;
    margin: 0px 3px;
    text-align: center;
    border-radius: 5px;
    padding: 3px;
    color: #000;
    height: 25px;
    line-height: 25px;
}
.color-selection a {
    width: 25px;
    display: inline-block;
    text-align: center;
    height: 25px;
    text-decoration: none;
    color: #FFF;
    border-radius: 5px;
}
.header-wrap-middle {
    padding: 25px 0px;
}
.header-wrap-top {
    background: rgb(41,81,168);
    color: #FFF;
    font-size: 12px;
    padding: 7px 0px;
}

.header-wrap-top .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}


.header-wrap-top{
    background: rgb(41,81,168);

    }

    .menu-bottom-wrap ul li.nav-item:first-child a {
        margin-left: 0px;
        padding-left: 0px !important;
    }

    .header-wrap-middle .container {
        max-width: 100% !important;
        padding: 0px 100px;
    }


    .header-top-support a {
        color: #202c5c;
    }

    .header-top-support {
        text-align: right;
    }

    .header-top-support h3 {
    margin: 0px;
}

.header-top-search {
    width: 20%;
}

.header-top-support {
    text-align: right;
    border-right: 1px solid rgb(41,81,168);
    padding-right: 40px;
    width: 30%;
}

.header-top-search input[type="text"] {
    border: 1px solid rgb(41,81,168);
    width: 100%;
    border-radius: 5px;
    height: 50px;
    background: url(../assets/images/search.png);
    padding: 0px 15px;
    color: rgb(41,81,168);
    background-size: 20px;
    background-position: 90%;
    background-repeat: no-repeat;
}

    .header-wrap-middle .container {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    ul.top-shortcut-menu {
        display: flex;
        margin: 0px;
        padding: 0px;
        list-style: none;
        justify-content: center;
    }

    .top-shortcut-menu a {
        text-align: center;
        color: #FFF;
        text-decoration: none;
        margin: 0px 10px;
    }.top-shortcut-menu a span {
        margin-left: 10px;
    }
    .header-top-logo {
        width: 40%;
    }

a.styleswitch.reset-color {
    width: 100%;
    display: block;
    font-size: 13px;
    font-weight: bold;
    margin-top: 7px;
    padding: 5px !important;
}


#announcement .modal-header {
    position: absolute;
    z-index: 100;
    width: 100%;
    left: 0px;
    border: none;
}

#announcement button.btn-close {
    background-color: #FFF;
    opacity: 1;
    border-radius: 500px;
}

img.abraham-photo {
    width: 40%;
}

#announcement section.page-hero.dark-hero {
    padding: 50px;
}


#announcement .page-hero-left {
    padding: 0px;
}

#announcement .page-hero h3 {
    font-size: 35px;
}

.stats-clear .stats-col {
    color: #212121;
}


.si-image img {
    width: 50%;
    margin: 0px 10px;
}


@media (min-width: 1400px){
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 1410px !important;
    }
}




/* Responsive: Large & Wide Screen
**************************************************/

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

}

/* Responsive: Medium Device
**************************************************/

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

}

/* Responsive: Tablet Potrait & Mobile Landscape
**************************************************/

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

    .video-player {
        width: 100%;
        height: 250px;
    }


    .cv-hero .col-lg-6.page-hero-left {
        padding-right: calc(var(--bs-gutter-x) * .5);
    }


    .cv-hero {
        height: auto;
        display: flex;
        align-items: center;
        padding: 150px 20px 50px 20px !important;
    }

    .resume-image img {
    width: 80%;
    border-radius: 20px;
}
    .si-wrap {

        padding: 0px 50px;
        flex-direction: column;
    }

    section.si-section .row {
        display: flex;
        align-items: center;
        padding: 0px;
        text-align: center;
    }

    .si-info {
       width: 100%;
        padding: 0px 25px 25px 25px;
    }

    .si-image {
        width: 100%;
    }
    .si-image img {
        width: 45%;
        padding: 0px;
        margin: 0 auto !important;
    }

    section.si-section {

        padding-bottom: 0px;
    }
    .hero-sub-action a {

        display: inline-table;
    }

    .hero-cta a {
        width: 100%;
        margin-bottom: 10px !important;
        text-align: center;
        margin-right: 0px !important;
    }

    .hero-cta {
        margin: auto;
    }

    #announcement section.page-hero.dark-hero {
        padding: 50px 25px;
    }

    .hero{


        padding-bottom: 0px;
        color: #FFF;
        background-repeat: no-repeat;
        background-position: bottom right;
        background-size: 100%;
    padding-bottom: 0px;
    padding-top: 200px;


    }


    div#hero-sub-heading {
        text-align: center;
        margin-left: auto;
        margin-right: auto;
    }



    .developer-hero {

        height: 900px;
        padding-bottom: 200px;
        color: #FFF;
        background-repeat: no-repeat;
        background-position: bottom right;
        background-size: 150%;
        display: flex;
        align-items: center;
    }

    .about-home-content {
        text-align: center;
    }

    .stats-col .count-heading {
        display: block;
    }
    .yt-player{
        width: 100%;;
    }

    .certifcate-home {
        width: 100%;
        border-radius: 10px;
    }

    .easy-access .container {
        padding: 0px 40px;
    }

    .preview-wrapper {
        padding: 50px 20px 0px 20px;
    }

    img.preview-screen {
        width: 100%;
        border-radius: 10px;
    }
    .job-done p {
        margin-bottom: 50px;
        width: 90%;
        margin: 0px auto 50px auto;
    }


    .section-heading-left {
    text-align: center;
}

.section-heading-left h3 span {
    display: inline;
    color: #5800f9;
}

.section-heading-left h3 {
    color: #FFF;
    font-weight: bold;
    line-height: 40px;
    margin-bottom: 25px;
    font-size: 30px;
    letter-spacing: -.4px;
}

.section-heading-left p {
    color: #FFF;
    width: 100%;
    margin-top: 25px;
    font-size: 17px;
}

.stats-col {
    padding: 0px 25px !important;
    text-align: center;
    margin-bottom: 50px;
}

.learn-coding .stats-col .count-heading {
    font-size: 35px;
    display: block;
}

img.about-team {
    width: 100%;
    padding-right: 0px;
}


.learn-coding {

    background-repeat: no-repeat !important;
    background-position: bottom center !important;
    background-size: 100% !important;
    padding-bottom: 400px;
}

    section.page-hero.dark-hero p {

        margin-left: auto;
        margin-right: auto;
    }
    section.page-hero.dark-hero {
        width: 100%;
    }

    .dark-section .container {
        padding: 0px 30px;
    }
    img.code-faster {
        width: 100%;

    }


    .faq-section .container {
        padding: 0px 0px;
    }

    .icon-left {
    width: 30%;
    margin-right: auto;
    margin-left: auto;
}
.col-lg-6.d-flex.justify-content-start {
    text-align: center;
    display: flex;
    flex-direction: column;
}

.tech-stacks .row.justify-content-md-center {
    display: block;
    flex-direction: unset;
    text-align: center;
}

.tech-stacks .row.justify-content-md-center .col.col-lg-3 {
    width: 25%;
    display: inline-block;
}
.tech-stacks .row.justify-content-md-center {
    width: 100%;
}

.tech-stacks.d-flex.flex-column.justify-content-evenly {
    margin: 50px 0px;
}

.client-testimoni {
    padding: 0px 0px;
}

#testimoni-clients {
    position: relative;
    padding: 0px 50px;
}

#testimoni-clients .owl-nav{
    display: none;
}


img.stack-logo {
    width: 100%;
    padding: 0px;
}


.info-right {
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 20px;
}

.col-lg-6.d-flex.justify-content-start {
    display: flex;
    flex-direction: column;
}

    .page-section.plan-section .row {

        width: 100%;
    }
    .plan-price {
        font-size: 15px;
        margin-bottom: 50px;
    }

    section.page-heading .container {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        flex-direction: column;
        padding-right: calc(var(--bs-gutter-x) * .5);
        text-align: center;
    }


    section.club-gallery img {
        border-radius: 10px;
        width: 100px;
        margin: 5px;
        height: 100px;
        object-fit: cover;
    }



    .club-gallery {

        text-align: center;
    }
    .blog-container-item {

        width: 100%;
    }
    section.page-heading p {
        color: #212121;
        font-size: 16px;
        margin-top: 1rem;
    }

    .blog-sidebar{
        display: none;
    }

    section.page-heading {
        padding-bottom: 50px;
        padding-top: 0px;
        text-align: center;
    }

    section.club-gallery h3 {
        color: #212121;
        text-align: center;
    }

    section.page-heading h3 {
        font-size: 35px;

        width: 100%;
    }

    .left-hero h3 {
        font-weight: 500;
        font-family: 'Poppins', sans-serif;
    font-weight: 500;
        font-size: 40px;
        margin-bottom: 2.4rem;
        text-align: center;
    }

    .left-hero p {
        font-size: 16px;
        font-weight: 300;
        margin-right: 0px;
        margin-bottom: 30px;
        line-height: 1.5;
        text-align: center;
    }
    .section-logo {
        text-align: center;
        margin: 0px;
        padding: 0px;
    }
    .section-logo .container {
        background: #FFF;
        border-radius: 0px;
        padding: 0px;
    }
    .about-home-content h3 {
        font-family: 'Poppins', sans-serif;
    font-weight: 500;
        color: #212121;
        font-weight: 600;
        line-height: 40px;
        margin-bottom: 25px;
        font-size: 2rem;
        letter-spacing: 0px;
        text-align: center;
        margin-top: 30px;
    }

    section.about-us {
        padding-bottom: 100px;
        text-align: center;
    }
    .center-heading p {
        color: #2e2e2e;
        margin-top: 0px;
        width: 90%;
        margin-left: auto;
        margin-right: auto;
        font-weight: 400;
    }

    .why-item {

        padding: 35px;

    }

    .achievements-content p {

        width: 100%;
        margin-bottom: 50px;
        text-align: center;
    }

    .achievements-top {
        margin-bottom: 25px;
        text-align: center;
    }

    .achievements-footer {
        margin-top: 30px;
        width: 90%;
        margin: 30px auto 0px;
    }
    footer {
        font-size: 14px;
        text-align: center;
    }

    .footer-menus h3 {
        font-size: 14px;
        font-family: 'Poppins', sans-serif;
    font-weight: bold;
        text-transform: uppercase;
        width: 100%;
        font-weight: bold;
        margin-bottom: 25px;
        margin-top: 50px;
    }

    .footer-social {
        text-align: center;
        margin-top: 50px;
    }

    .footer-social h3 {
        font-size: 14px;
        font-family: 'Poppins', sans-serif;
    font-weight: bold;
        text-transform: uppercase;
        width: 100%;
        font-weight: bold;
        margin-bottom: 25px;
    }

    .footer-social ul {
        margin: 0px;
        padding: 0px;
        list-style: none;
        display: flex;
        align-items: flex-start;
        justify-content: center;
    }

    a.join-now-top.hvr-float {
       text-align: center;
    margin: 10px 0px 0px 0px !important;
    display: inline-block;
    width: 48%;
    }

    li.nav-item a {
        padding: 10px 0px !important;
        font-size: 16px;
    }

    .navbar-brand{
        margin: 20px;
    }
    .top-header.header-page {

        padding: 0px;
    }

    .page-hero a.blue-btn.hvr-forward {
        margin: auto;
    }

    .page-hero h3 {
        font-size: 38px;

    }

    .page-hero-left {
        padding-right: 0px;
    }
    .page-hero h5 {
        font-family: 'Poppins', sans-serif;
    font-weight: 500;
        font-size: 15px;
        margin-bottom: 30px;
        margin: auto;
        margin-bottom: 30px;
    }

    section.page-hero {
        padding-top: 200px;
        text-align: center;
        width: 90%;
        margin: auto;
    }


    button.navbar-toggler i {
        color: #FFF;
    }

    div#navbarSupportedContent {
        background: #010032;
        padding: 20px;
    }

    .top-header {

        top: 0px;
        left: 0px;
        width: 100%;
        padding: 0px;
        transition: all 0.5s ease;
        /* background: #010032; */
        z-index: 100;
    }

    .footer-logo {
        text-align: center;
        margin-bottom: 50px;
    }
    .footer-logo img{
        width: 70%;
    }

    .left-hero ul {
        margin: 0px auto;
        padding: 0px;
        list-style: none;
        margin-bottom: 30px;
    }
    .hero a.blue-btn.hvr-forward {
        margin: 0px auto;
    }.navbar-brand img {
        width: 200px;
    }
    .header-wrap-middle .container {
        max-width: 100% !important;
        padding: 0px 20px;
    }

    .top-shortcut-menu a span {
        margin-left: 0px;
        display: none;
    }

    ul.top-shortcut-menu img {
        width: 20px;
    }

    .top-shortcut-menu a {
        text-align: center;
        color: #FFF;
        text-decoration: none;
        margin: 0px 5px;
    }

    .header-wrap-top .container {
        display: block;
        justify-content: space-between;
        align-items: center;
    }

    .header-wrap-top .container {
        padding: 0px;
    }

    .header-wrap-top {
        background: rgb(41,81,168);
        padding: 0px 0px 10px 0px;
    }

    .header-top-date {
        text-align: center;
        padding: 0px 10px 10px;
    }

    .header-top-date {
        text-align: center;
        padding: 10px 10px 10px;
        background: #1c2237;
        margin-bottom: 10px;
    }

    .top-lang li.nav-item a {
        color: #FFF !important;
        font-size: 11px;
        padding: 5px 10px;
        margin: 0px;
        border-radius: 5px;
        font-weight: 700;
    }

    .header-top-shortcut {
        display: inline-block;
    }
    .header-top-language {
        width: 50%;
        display: inline-block;
        margin-left: 10px;
    }
    .header-top-shortcut {
        display: inline-block;
    float: right;
    padding: 5px 0px;
    width: 40%;
    margin-right: 10px;
    }



    .header-wrap-middle .container {
        max-width: 100% !important;
        padding: 0px 0px;
    }
    .header-wrap-middle {
        padding: 25px 0px 0px 0px;
    }
    .header-top-search {
        width: 80%;
        display: inline-block;
        padding: 10px 0px 10px 20px;
    }
    .header-top-search input[type="text"] {
        border: 1px solid rgb(41,81,168);
        width: 100%;
        border-radius: 5px;
        height: 40px;
        background: url(../assets/images/search.png);
        padding: 0px 15px;
        color: rgb(41,81,168);
        background-size: 15px;
        background-position: 95%;
        background-repeat: no-repeat;
        font-size: 13px;
    }
    .header-top-support {
        display: none;
    }
    .header-top-mega-menu {
        display: inline-block;
        width: 10%;
        float: right;
        padding: 10px 0px;
        margin-right: 20px;
        text-align: right;
    }
    .header-top-logo {
        width: 100%;
        padding: 0px 20px;
        margin-bottom: 5px;
        border-bottom: 1px solid #eaeaea;
        padding-bottom: 20px;
    }
    .header-wrap-middle .container {
        display: block;
        align-items: center;
        justify-content: space-between;
        flex-direction: column;
    }

    .mobile-top-header {
        background: #202c5c;
        display:block;
    }

    .header-menu-bottom {
        border-top: none;
        padding: 5px 25px;
        transition: all 0.5s ease;
        background: #1c2237;
        display:none;
    }
    section.breadcrumbs ul {
        margin: 0px auto;
        padding: 0px;
        list-style: none;
        display: flex;
        justify-content: center;
    }


    section.staff-search {
        background: #ff8e62;
        padding: 25px 30px;
        margin: 25px auto;
        border-radius: 5px;
        width: 90%;
        text-align: center;
    }

    section.staff-search button{
        margin-top:20px;
    }


section.breadcrumbs {
    margin-bottom: 50px;
}

    .mobile-top-header ul.top-language {
        margin: 0px;
        padding: 0px;
    }
    .mobile-top-header ul.top-language {
        display: flex;
        align-items: center;
        justify-content: flex-end;
    }
    .mobile-top-header {
        padding: 6px 10px;
        padding-top: 0px;
    }

    .mobile-top-header .top-language a.nav-link{
        color: #FFF;
    font-size: 12px;
    font-weight: 700;
    }

    .myWrapper ul {
        margin: 0px;
        padding: 0px;
        list-style: none;
        width: 100%;
    }

    .footer-address h3 {
    font-size: 14px;
    text-transform: uppercase;
    width: 100%;
    font-weight: bold;
    margin-bottom: 25px;
}

.iso-footer {
    margin: auto;
    width: 50%;
}

.our-services .item a {
    text-decoration: none;
    width: 100%;
}

ul.top-language li.nav-item {
    display: none;
}


    #news-content {
        display: flex;
        justify-content: space-between;
        flex-direction: column;
    }

    #news-content.owl-theme .owl-dots .owl-dot.active span, #news-content.owl-theme .owl-dots .owl-dot:hover span {
        background: #9e0025;
    }

    .section-addition {
        padding: 50px 0px;
    }
    .program-heading {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 50px;
        flex-direction: column;
        text-align: center;
    }

    .quote-text {
        width: 90%;
        margin: auto;
        color: #64728d;
        text-align: center;
        font-weight: 500;
        font-size: 15px;
    }

    .section-addition .col-lg-7 {
        display: flex;
        align-items: center;
        padding: 35px;
        text-align: center;
    }
    .additonal-item p {
        color: #64728d;
        font-size: 15px;
        text-align: center;
    }

    .footer-left-address {
        display: flex;
        justify-content: space-between;
        border-right: none;
        padding: 25px 0px;
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    .qr-code {
        width: 40%;
        margin-right: 0px;
        margin-bottom: 35px;
    }

    .footer-address ul li {
        font-size: 13px;
        margin-bottom: 10px;
        display: flex;
        justify-content: flex-start;
        flex-direction: column;
        align-items: center;
    }
    img.footer-icon {
        width: 20px;
        height: auto !important;
        margin-right: 10px;
        margin: 0px auto 20px auto;
    }
    .footer-menu.footer-2 {
        border-right: none;
        text-align: center;
        padding: 35px 0px;
    }

    .footer-menu {
        padding: 25px 0px;
        text-align: center;
    }
    .footer-right h3 {
        font-size: 14px;
        font-weight: bold;
        margin-bottom: 25px;
        text-align: center;
    }
    .waktu-operasi {
        text-align: center;
    }

    .footer-bottom {
        text-align: center;
    }
    section.our-services {
        margin-top: 0px;
    }

    .header-right {
        width: 17.5%;
        display: flex;
    /* border: navajowhite; */
    justify-content: center;
    align-items: center;
    margin: 0px;
    padding: 0px;
    }

    .header-center {
        width: 65%;
        padding: 25px;
    }
    .header-left {
        width: 17.5%;
    }

    img.main-logo{
        width: 100%;
    }

    .main-news {
        width: 100%;
        margin-right: 0px;
    }

    .myWrapper {
        /* margin-left: -20px; */
        display: flex;
        align-content: flex-start;
        justify-content: space-between;
        flex-direction: column;
    }

    .top-main-news {
        text-align: center;
        margin-bottom: 50px;
        padding: 0px 25px;
    }

    .facebook-feed {
        margin-left: 0px;
        padding: 20px 20px 0px 20px;
    }

    .text-right {

        text-align: center;
    }

    .slideshow .owl-nav {
        margin: 0px;
        position: absolute;
        top: inherit;
        right: 0px;
        /* left: 0px; */
        bottom: 20px;
        margin: auto;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .s-c-link {
        font-size: 13px;
    }
    .social-media-link img {
        width: 15px;
    }

    .header-main-top {
        border-top: 6px solid #202c5c;
        border-bottom: 1px solid rgba(255,255,255,0.5);
        /* background: rgba(130, 130, 130, .6); */
        position: relative;
        top: 0px;
        left: 0px;
        width: 100%;
        z-index: 100;
        transition: all 0.5s ease;
        background: #800000;
    }

    .slideshow .owl-carousel .owl-nav button span {
        font-size: 25px;
    }
    .slideshow .owl-carousel .owl-nav button {
        background: #FFF !important;
        padding: 0px 15px !important;
        border-radius: 0px;
        display: block;
        margin: 0px 2px;
    }

    .social-media-link {
        position: absolute;
        z-index: 10;
        color: #FFF;
        bottom: 20px;
        display: flex;
        left: 20px;
    }

    .header-top-menu {
        display: none;
    }

    .header-menu-wrap {
        border-right: none;
        padding: 30px 0px;
    }
    .top-menu-right-left-wrap {
        display: none;
    }
    .top-menu-right-wrap ul li{
        padding:30px 0px;
        border: none;
    }

    li.lang-menu {
        display: none;
    }

    .header-left span {
        display: none;
    }

    .service-item {
        display: flex;
        padding: 30px;
        background: #FFF;
        align-items: center;
        box-shadow: 0px 0px 19px 1px rgb(0 0 0 / 22%);
        -webkit-box-shadow: 0px 0px 19px 1px rgb(0 0 0 / 22%);
        -moz-box-shadow: 0px 0px 19px 1px rgba(0,0,0,0.22);
        width: 100%;
    }

    .header-main-top .row {
        margin: 0px;
        padding: 0px 0px;
        display: flex !important;
    justify-content: space-between !important;
    }
    img.menu-btn {
        width: 20px;
        margin-right: 0px;
    }

    .panel--left{

    }
    .panel.panel--right {

    }
    .panel.panel--right {
        display: none;
    }


    .menu-expand .panel {
        width: 100% !important;

    }
    .menu-expand .panel.panel--left {
        height: 100vh !important;
        top: 0px ;
        right: 0px !important;
            width: 100% !important;
    }

    .navigation .menu > li {
        line-height: 30px;
        font-size: 20px;
        font-size: 1.25em;
        font-size: 1.25rem;
        padding: 0.4em 0 0.4em 42px;
        margin: 0.2em 0;
        text-align: left;
        /* float: left; */
        /* clear: both; */
        width: 100%;
    }

    .mobile-close-navigation{
        display: block;
    }

    .menu-expand .panel.panel--right {
    height: 50vh !important;
    bottom: 0px;
    top: auto !important;
        width: 100% !important;
    }

    .navigation .menu {
        width: 100%;
        padding: 45px;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-between;
        align-items: flex-start;
        align-content: flex-start;
        height: 100%;
        overflow-y: scroll;
    }

    .panel--left {
        transition: all 0.5s ease;
        width: 0px !important;
        left: 0px;
    }

    .links {
        padding: 250px 0px 50px 0px;
        margin-top: 100px;
    }
    .navigation ul li.mobile-menu{
        display: block;
    }
}



/* Responsive: iPad Version 1 & 2
**************************************************/

/* iPad 1 & 2 in Potrait */

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio: 1) {


}

/* iPad 1 & 2 in Landscape */

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape)and (-webkit-min-device-pixel-ratio: 1)  {


}


/* Responsive: Extra Small Devices, Phones Potrait
**************************************************/

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

}

/* Responsive: Custom, iPhone Retina
**************************************************/

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

}

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

}