/*
Theme Name:  PivotFintech
Theme URI: http://themexriver.com/abcd/
Author: PivotFintech
Description: PivotFintech Theme
Version: 2.0
*/

/************Onboarding************/
.modal-body h1 {
    margin-top: 20px;
    font-size: x-large;
}

.mainscreen {
    padding: 30px 0;
}

.btn-mobile {
    display: none;
}

label.indented-checkbox-text {
    margin-left: 2em;
    display: block;
    position: relative;
    margin-top: -2.45em;
    line-height: 1.5em;
    font-weight: 400;
}

a.text-bold {
    text-decoration: underline;
    font-size: 14px;
}

.btn-dark {
    font-size: 16px !important;
}

.privacy {
    border: none;
}

a.text-orange {
    font-size: 14px;
}

#content .btn-orange, #content .btn-orange2 {
    margin-right: 0;
    margin-bottom: 60px;
}

#divPrivacyPolicy .modal-header, #divAccountOpeningAgreement .modal-header {
    padding: 30px 30px 0;
}

#divPrivacyPolicy .modal-header .close, #divAccountOpeningAgreement .modal-header .close {
    position: absolute;
    top: 20px;
    right: 30px;
    font-size: xx-large;
}

#divPrivacyPolicy .modal-header h1, #divAccountOpeningAgreement .modal-header h1 {
    font-size: 24px;
    color: #f27e2b;
    margin-top: 0;
}

#divPrivacyPolicy .modal-dialog, #divAccountOpeningAgreement .modal-dialog {
    width: 70%;
}

#divPrivacyPolicy .modal-content, #divAccountOpeningAgreement .modal-content {
    border: 2px solid #f27e2b;
}

#divPrivacyPolicy .modal-body, #divAccountOpeningAgreement .modal-body {
    text-align: left;
    margin-bottom: 30px;
}

#divPrivacyPolicy .modal-body h1, #divAccountOpeningAgreement .modal-body h1 {
    margin-top: 0px;
}

#divPrivacyPolicy .modal-body p, #divAccountOpeningAgreement .modal-body p {
    line-height: 1.15;
    font-size: 14px;
    margin-bottom: 15px;
    margin-top: 0;
}

/*.isi-privacypolicy ol, .isi-accountopeningagreement ol {
    margin-left: -20px;
}*/

.isi-privacypolicy, .isi-accountopeningagreement {
    overflow-x: hidden;
    overflow-y: scroll;
    height: 400px;
    padding-right: 15px;
}

.isi-privacypolicy ol .row .col-md-3 div {
    background: #e9e9e9;
    padding: 15px;
    color: #023047;
    border: 1px solid #d4d4d4;
}

.isi-privacypolicy ol .row .col-md-3 div p:last-child {
    margin-bottom: 0;
}

#divPrivacyPolicy ol > li:first-child,
#divAccountOpeningAgreement ol > li:first-child {
    counter-reset: item;
}

#divPrivacyPolicy ol > li,
#divAccountOpeningAgreement ol > li {
    counter-increment: item;
    position: relative;
    margin-bottom: 15px;
}

#divPrivacyPolicy ol > li::before,
#divAccountOpeningAgreement ol > li::before {
    content: counters(item, ".") ". ";
    position: absolute;
    margin-right: 100%;
    right: 5px;
}

#divAccountOpeningAgreement ol ol > li:first-child, #divPrivacyPolicy ol ol > li:first-child {
    counter-reset: subitem;
}

#divAccountOpeningAgreement ol ol > li, #divPrivacyPolicy ol ol > li {
    counter-increment: subitem;
    position: relative;
    margin-bottom: 15px;
}

/* Counter display for nested list items inside the div */
#divAccountOpeningAgreement ol ol > li::before,
#divPrivacyPolicy ol ol > li::before {
    content: counters(item, ".") "." counters(subitem, ".") ". ";
    position: absolute;
    margin-right: 100%;
    right: 5px;
}

/*#divPrivacyPolicy .a li:before, #divAccountOpeningAgreement .a li:before {
    content: "(" counter(item, lower-alpha)") ";
}*/
#divAccountOpeningAgreement ol ol ol > li,
#divPrivacyPolicy ol ol ol > li {
    counter-increment: subsubitem;
    position: relative;
    margin-bottom: 15px;
}

/* Alphabetic counter display for third level nested list items */
#divAccountOpeningAgreement ol ol ol > li::before,
#divPrivacyPolicy ol ol ol > li::before {
    content: "(" counter(subsubitem, lower-alpha) ") ";
    position: absolute;
    margin-right: 100%;
    right: 5px;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
}

input[type=number] {
    height: 45px;
    width: 45px;
    font-size: 25px;
    text-align: center;
    border: 1px solid #000000;
    display: inline-flex;
}

.privacy {
    height: 400px !important;
}

.form-linkButton {
    display: flex;
    align-items: center;
    justify-content: center;
}

.myinfocircle {
    position: absolute;
    top: 90px;
}

.myinfocircle:hover {
    cursor: pointer;
}

.fa-chevron-circle-right {
    font-size: 36px;
    position: absolute;
    transform: translate(500%,-165%);
}

.myButton:hover {
    background-color: #3dbfa5;
}

.myButton:active {
    position: relative;
    top: 1px;
}

.myButton {
    box-shadow: 2px 3px 10px 1px #3dbfa5;
    background-color: #0096A9;
    border-radius: 9px;
    display: inline-block;
    cursor: pointer;
    color: #ffffff;
    font-size: 40px;
    padding: 35px;
    text-shadow: -1px 0px 0px #1ab89e;
    width: 50%;
}

.myButtonorg {
    box-shadow: 2px 3px 10px 1px #ED7536;
    background-color: #ED7536;
    border-radius: 9px;
    display: inline-block;
    cursor: pointer;
    color: #ffffff;
    font-size: 40px;
    padding: 35px;
    text-shadow: -1px 0px 0px #ED7536;
    width: 50%;
}

.myButtonorg:hover {
    background-color: #f57e2a;
}

.myButtonorg:active {
    position: relative;
    top: 1px;
}

.content2 {
    border-bottom: 0;
    padding: 0% 15%;
}

.center-tombol {
    display: flex;
    align-content: center;
    justify-content: center;
    text-align: center;
}

.radio-orange {
    text-align: center;
    background: #e77721;
    padding: 10px;
    color: #fff;
    border-radius: 5px;
}

#msform textarea {
    padding: 8px 8px 8px 8px !important
}

.form-pr {
    display: none;
}

.webuploader-pick {
    background: none !important;
}

input#txtNumber {
    width: 80% !important;
}

#divPrivacyPolicy .modal-dialog {
    width: 90%;
    border: 2px solid #f57e2a;
    border-radius: 10px;
    text-align: justify;
}

#divPrivacyPolicy .modal-body, #divPrivacyPolicy .modal-content {
    border-radius: 10px;
}

#divPrivacyPolicy h1 {
    margin-top: 30px;
    color: #f57e2a;
    font-size: 28px;
    margin-left: 0px;
}

.btn-dark2:hover, .btn-dark2:focus {
    background-color: #023047 !important;
    border-color: #023047 !important;
    color: #fff !important;
}

.btn-darkNoHover:hover {
    background-color: #023047 !important;
    border-color: #023047 !important;
    color: #fff !important;
    cursor: pointer;
}

#divPrivacyPolicy .modal-body {
    margin-top: -20px;
}

#divPrivacyPolicy .modal-header {
    padding-right: 30px;
}

    #divPrivacyPolicy .modal-header .close {
        margin-top: -80px;
    }

    #divPrivacyPolicy .modal-header button span {
        font-size: 50px;
    }

.content-privacy {
    text-align: left;
    overflow-y: scroll;
    overflow-x: hidden;
    height: 60vh;
    margin-bottom: 30px;
}

    .content-privacy p {
        font-size: 14px;
        line-height: 1.42857143;
    }

    .content-privacy ol, .content-privacy ol li {
        list-style: decimal;
    }

    .content-privacy .col-md-9 ol {
        margin-left: -15px;
    }

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type=number] {
    height: 45px;
    width: 45px;
    font-size: 25px;
    text-align: center;
    border: 1px solid #000000;
    display: inline-flex;
}

#passwordCriteria {
    font-size: smaller;
    margin-top: 10px;
}

#msform .day, #msform .month, #msform .year {
    width: 25%;
    margin-right: 10px;
}

.ms {
    display: flex;
    justify-content: center;
    width: 50%;
    font-weight: bold;
    font-size: 20px;
}

.ms2 {
    display: flex;
    justify-content: center;
    width: 55%;
    font-weight: bold;
    font-size: 20px;
}

#mgUp1, #mgUp2, #mgUp6, #mgUp8 {
    margin-right: 0 !important;
}

.webuploader-pick {
    background: none !important;
}

.table {
    max-width: 96%;
}

.modal-footer {
    justify-content: center;
}

input[name=optradio] {
    margin-right: 10px;
}

.marginbot10 {
    margin-bottom: 10px !important;
}

.loader-perm {
    border: 16px solid #f3f3f3; /* Light grey */
    border-top: 16px solid #f57e2a; /* Blue */
    border-radius: 50%;
    width: 50px;
    height: 50px;
    -webkit-animation: spin 2s linear infinite; /* Safari */
    animation: spin 2s linear infinite;
}
/* Safari */
@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/***************End Onboarding*****************/

input[type=number] {
    -moz-appearance: textfield;
}

.btn, header .navbar a {
    line-height: 1.5;
}

.text-red {
    color: #e73324 !important;
}

.tombolprev, .tombolnext {
    letter-spacing: 0px !important;
}

.modal-content h3 {
    /*font-size: 1.75em;*/
    font-size: large;
    font-weight: 700;
}

.centerimage {
    position: absolute;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    width: 100px;
    border: 5px solid #fff;
    border-radius: 50%;
    top: 30px;
}

.box-orange1 {
    width: 80%;
    background-color: #ffffff;
    border: 2px solid #ED7536;
    cursor: pointer;
    border-radius: 25px;
    padding: 15px 30px;
    margin: 0 auto 15px;
    font-family: Arial, Helvetica, sans-serif;
}

.box-orange1 h3 {
    color: #ED7536;
    font-size: x-large;
    font-weight: bold;
    margin-top: 0 !important;
}

.box-orange1 p {
    color: #000000;
    margin-bottom: 0 !important;
}

.box-blue1 {
    width: 80%;
    background-color: #ffffff;
    border: 2px solid #0096A9;
    cursor: pointer;
    border-radius: 25px;
    padding: 15px 30px;
    margin: 0 auto 15px;
    font-family: Arial, Helvetica, sans-serif;
}

.box-blue1 h3 {
    color: #0096A9;
    margin-bottom: 0 !important;
    font-size: x-large;
    font-weight: bold;
    margin-top: 0 !important;
}

.box-blue {
    width: 100%;
    background-color: #ffffff;
    border: 2px solid #0096A9;
    cursor: pointer;
    border-radius: 25px;
    padding: 15px 30px;
    margin: 0 auto 15px;
}

.box-blue h3 {
    color: #0096A9;
    margin-bottom: 0 !important;
    font-size: x-large;
    font-weight: bold;
    margin-top: 0 !important;
}

.box-blue p {
    color: #000000;
    margin-bottom: 0 !important;
}

.round-btn-center-blue {
    border: 1px solid #0096A9;
    background-color: #0096A9;
    border-radius: 5px;
    color: #FFF;
    padding: 5px;
    display: inline-block;
    width: 19%;
    /*max-width: 200px;*/
    float: left;
    margin: 2px;
    text-transform: uppercase;
    /*letter-spacing: 2px;*/
    cursor: pointer;
    font-size: small;
    justify-content: center;
    align-items: center;
}

.round-btn-center-blue:hover {
    background-color: #fff;
    color: #0096A9;
}

.fa-caret-blue-right, .fa-caret-blue-left {
    /* padding-left: 20px; */
    background-color: #129da6;
    color: white;
    width: 3%;
    text-align: center;
    border-radius: 5px;
    margin-left: 15px;
}

.fa-caret-orange-right, .fa-caret-orange-left {
    /* padding-left: 20px; */
    background-color: #ED7D31;
    color: white;
    width: 3%;
    text-align: center;
    border-radius: 5px;
    margin-left: 15px;
}

.fa-caret-blue-right:hover, .fa-caret-blue-left:hover {
    background-color: white;
    color: #129da6;
}

.fa-caret-orange-right:hover, .fa-caret-orange-left:hover {
    background-color: white;
    color: #ED7D31;
}

.padding50 {
    padding: 50px;
}

.backgroundbody {
    width: 90% !important;
    background-color: transparent !important;
    display: inline-flex !important;
    justify-content: center;
}
/*progressbarnew*/
#progressbarnew {
    margin-bottom: 0;
    overflow: hidden;
    counter-reset: step;
    padding: 0px 0px 10px 0;
    width: 90%;
    display: inline-flex;
    justify-content: center;
}

#progressbarnew li {
    list-style-type: none;
    color: #d9d9d9;
    font-size: small;
    line-height: 1.15;
    font-weight: bold;
    width: 20%;
    float: left;
    position: relative;
    text-align: center;
}

#progressbarnew li.active {
    color: #0096A9;
}

#progressbarnew li:before {
    /*content: counter(step);*/
    content: "";
    counter-increment: step;
    width: 50px;
    height: 50px;
    border-radius: 25px;
    /*border: 3px solid #d9d9d9;*/
    line-height: 50px;
    display: block;
    font-size: 16px;
    color: #d9d9d9;
    background: #f6f6f6;
    margin: 0 auto 15px auto;
    text-align: center;
}

#progressbarnew li:first-child:before {
    background: url("/images/step1-opac.png") no-repeat;
    background-size: cover;
    background-color: #f6f6f6;
}

#progressbarnew li:first-child.active:before {
    background: url("/images/step1.png") no-repeat;
    background-size: cover;
    background-color: #f6f6f6;
}


/*        #progressbarnew li:nth-child(3):before {
    background: url("/images/step3-opac.png") no-repeat;
    background-size: cover;
    background-color: #f6f6f6;
}

#progressbarnew li:nth-child(3).active:before {
    background: url("/images/step3.png") no-repeat;
    background-size: cover;
    background-color: #f6f6f6;
}

#progressbarnew li:nth-child(4):before {
    background: url("/images/step4-opac.png") no-repeat;
    background-size: cover;
    background-color: #f6f6f6;
}

#progressbarnew li:nth-child(4).active:before {
    background: url("/images/step4.png") no-repeat;
    background-size: cover;
    background-color: #f6f6f6;
}
*/
#progressbarnew li:last-child:before {
    background: url("/images/step1-opac.png") no-repeat;
    background-size: cover;
    background-color: #f6f6f6;
}

#progressbarnew li:last-child.active:before {
    background: url("/images/step1.png") no-repeat;
    background-size: cover;
    background-color: #f6f6f6;
}

#progressbarnew li:nth-child(2):before {
    background: url("/images/step2-opac.png") no-repeat;
    background-size: cover;
    background-color: #f6f6f6;
}

#progressbarnew li:nth-child(2).active:before {
    background: url("/images/step2.png") no-repeat;
    background-size: cover;
    background-color: #f6f6f6;
}
/*progressbar connectors*/
#progressbarnew li:after {
    content: '';
    width: 100%;
    height: 2px;
    background: #d9d9d9;
    position: absolute;
    left: -50%;
    top: 25px;
    z-index: -1; /*put it behind the numbers*/
}

#progressbarnew li:first-child:after {
    /*connector not needed before the first step*/
    content: none;
}
/*marking active/completed steps green*/
/*The number of the step and the connector before it = green*/
#progressbarnew li.active:before {
    border: 0px solid #0096A9;
    color: #0096A9;
}

#progressbarnew li.active:after {
    border: 1px solid #0096A9;
}
/*form styles*/
.text-yellow {
    color: #ffd253;
}

.text-orange {
    color: #ed7d31;
}

.bg-oranges {
    margin: 0 30px;
    background-color: #ed7d31;
    padding: 5px 15px;
    color: #fff;
    margin-bottom: 10px;
}

.welcome {
    display: block;
    float: left;
    margin-top: 35px;
    margin-left: -100px;
}

.friendcircle {
    border-radius: 50%;
    /* remove if you don't care about IE8 */
    width: 15px;
    height: 15px;
    line-height: 8px;
    background: #eb7d3c;
    border: 1px solid #eb7d3c;
    color: #fff;
    text-align: center;
    font-size: 10px;
    position: absolute;
    padding: 2px 4px;
    margin-left: 5px;
}

.icircle {
    border-radius: 50%;
    /* remove if you don't care about IE8 */
    width: 15px;
    height: 15px;
    line-height: 8px;
    border: 1px solid #575757;
    text-align: center;
    font-size: 10px;
    position: absolute;
    padding: 2px 4px;
    margin-left: 5px;
}

.advisor h1 {
    font-size: xx-large !important;
    padding-bottom: 30px;
}

.advisor .col-md-6 {
    border: 1px solid #ccc;
    width: 45%;
    margin: 0 2% 0 3%;
}

.advisor h2 {
    color: #f57e2a;
    font-size: xx-large;
    padding-top: 2em;
    margin-bottom: 1em;
}

.advisor .btn2 {
    float: none;
    margin-right: 0;
}

.advisormenu {
    margin-top: 15px;
}

.advisormenu li {
    background: #e87721;
    border: 1px solid #fff;
    padding: 5px 10px;
    cursor: pointer;
}

.advisormenu li.active, .advisormenu li:hover {
    background: none;
    border: 1px solid #e87721;
}

.advisormenu li a {
    color: #fff;
    font-size: small;
}

.advisormenu li.active a, .advisormenu li:hover a {
    color: #e87721;
}

.advisorheading {
    color: #e87721;
    border: 1px solid #ccc;
    padding: 5px 10px;
}

.advisorcontent {
    border: 1px solid #ccc;
    padding: 10px;
}

.advisorcontent table span.bg-orange {
    background: #f57e2a;
    padding: 2px 4px !important;
    color: #fff;
}

.list-page {
    width: 100%;
    text-align: center;
    padding: 10px 0;
}

.list-page li {
    display: inline-block;
}

.list-page li a {
    color: #000;
}

.list-page li a.active, .list-page li a:hover {
    color: #f57e2a;
}

.table-responsive {
    border: 0px;
}

.table-responsive .table-game {
    margin-top: 30px !important;
}

.table-responsive .table-game2 {
    margin-top: 10px !important;
}

.table-game tbody > tr > td, .table-game2 tbody > tr > td {
    border-top: none !important;
}

.table-scroll {
    overflow-y: scroll;
    height: 8em;
}

.table-scroll table, .table-responsive table {
    margin-top: 0 !important;
}

.loader {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: url(../images/loading.gif) center no-repeat #fff;
}

.privacy {
    width: 94%;
    text-align: left;
    padding: 0 15px;
    border: 1px solid #d3d3d3;
    font-size: large;
    overflow-y: scroll;
}

#content2 .privacy {
    margin-left: 15px;
    font-size: medium;
    height: 320px;
    margin-top: 15px;
    width: 96%;
}

.content2 {
    /*border-bottom: 1px solid #d3d3d3;*/
    width: 98%;
}

.content2 h2 {
    margin: 15px;
    font-weight: bold;
}

.content2 .info {
    margin: 5px;
}

.content2 .info h2 {
    margin: 15px 0 10px 0;
}

.content2 .radiocontent {
    margin: 15px;
    padding-top: 3em;
}

.img-desktop, .img-desktop-kiri {
    width: 100%;
    object-fit: cover;
}

.isi {
    padding: 5px 30px;
}

.isi2 {
    padding: 30px;
}

.content h2, .content p {
    margin-bottom: 15px;
}

.investment img {
    padding: 10px 0;
}

.investment .col-xs-6 {
    margin-bottom: 30px;
}

.isi3 {
    padding: 15px 0;
}

.isi3 .row {
    padding: 0 !important;
}

.isi3 .col-md-9 {
    padding-right: 0;
    padding-top: 15px;
    margin-left: -15px;
    padding-left: 15px;
}

.isi3 .col-md-4 {
    padding: 0 10px !important;
}

.isi3 .col-md-3 {
    padding-right: 20px;
    margin-left: 15px;
}

.isi4 {
    padding: 15px 0;
}

p.padding {
    padding: 0 15px;
}

.isi4 .tombol {
    margin-right: 0;
}

.isi4 .tombol1 {
    margin-right: 30px;
    margin-top: 10vh;
    float: right;
}

.isi4 .tombol2 {
    margin-right: 30px;
    margin-top: 40vh;
    float: right;
}

a.transfer {
    color: #000;
}

.borderabu {
    border: 1px solid #c6c6c6;
    border-radius: 5px;
    padding-bottom: 15px;
}

.orangeborderleft {
    border-left: 2px solid #f57e2a;
}

.grayborderleft {
    border-left: 1px solid #d3d3d3;
}

.grayborderright {
    border-right: 1px solid #d3d3d3;
}

.graybordertop {
    border-top: 1px solid #d3d3d3;
}

.grayborderbottom {
    border-bottom: 1px solid #d3d3d3;
}

.borderbottomdash {
    border-bottom: 1px dashed #d3d3d3;
}

h4.text-orange {
    color: #f57e2a;
    margin-top: 0;
    font-weight: bold;
}

/*.mygoals h1, .text-orange {
    color: #e77721;
}*/

.mygoals .tombolnext {
    margin-bottom: 0;
}

.mygoals .tombol {
    margin-right: 0;
    margin-top: 0;
    margin-bottom: 10px;
}

#pledgetransfer input, #reports input, #reports1 input, #reports2 input, #projecthistory input {
    margin-top: 15px;
    border-radius: 0;
    padding: 5px 15px;
}

#pledgetransfer .tombol {
    margin: 20px 0;
}

.text-abu {
    color: #585856;
}

.text-blue {
    color: #139da7;
}

.text-black {
    color: #000 !important;
}

.text-white {
    color: #fff;
}

.img-round ul {
    display: inline-flex;
    width: 100%;
    margin: 5% 0;
}

    .img-round ul li {
        width: 20%;
        float: left;
        text-align: center;
    }

        .img-round ul li a {
            color: #575757;
        }

            .img-round ul li a:hover {
                color: #e77721;
            }

img.risk0, img.risk1, img.risk2, img.risk3, img.risk4, img.risk5 {
    background: #fafafa;
    border-radius: 50%;
}

    img.risk0:hover, li#risk a:hover img {
        background: rgb(150, 150, 150);
    }

    img.risk1:hover, li#risk1 a:hover img {
        background: #129da6;
    }

    img.risk2:hover, li#risk2 a:hover img {
        background: #23ad8f;
    }

    img.risk3:hover, li#risk3 a:hover img {
        background: #ffd14e;
    }

    img.risk4:hover, li#risk4 a:hover img {
        background: #f47e29;
    }

    img.risk5:hover, li#risk5 a:hover img {
        background: #e15c35;
    }

li#risk1 a:hover, .riskyellow, li#risk1 a.current {
    color: #129da6 !important;
}

li#risk2 a:hover, .riskgreen, li#risk2 a.current {
    color: #23ad8f !important;
}

li#risk3 a:hover, .riskblue, li#risk3 a.current {
    color: #ffd14e !important;
}

li#risk4 a:hover, .riskorange, li#risk4 a.current {
    color: #f47e29 !important;
}

li#risk5 a:hover, .riskred, li#risk5 a.current {
    color: #e15c35 !important;
}

li#risk1 a:hover .icircle {
    border: 1px solid #129da6 !important;
}

li#risk2 a:hover .icircle {
    border: 1px solid #23ad8f !important;
}

li#risk3 a:hover .icircle {
    border: 1px solid #ffd14e !important;
}

li#risk4 a:hover .icircle {
    border: 1px solid #f47e29 !important;
}

li#risk5 a:hover .icircle {
    border: 1px solid #e15c35 !important;
}

.table-rounded {
    border: 1px solid #bdbdbd;
    width: 100%;
    font-size: large;
}

    .table-rounded td {
        border-bottom: 1px solid #e97721;
        padding: 10px;
    }

        .table-rounded td.noborderright {
            border-right-style: none;
        }

        .table-rounded td.noborderbottom {
            border-bottom-style: none;
        }

        .table-rounded td.borderright {
            border-right: 1px solid #e97721;
        }

.table-padding {
    width: 100%;
}

.table-row-left {
    width: 50%;
    padding-left: 25%;
}

.table-row-right {
    width: 50%;
    padding-right: 25%;
}

.table-padding td {
    padding: 5px;
}

.text-xlarge {
    font-size: x-large;
}

.text-xxlarge {
    font-size: xx-large;
}

.text-large {
    font-size: large;
}

.text-big {
    font-size: 1.5em;
}

.text-medium {
    font-size: medium;
}

.text-small {
    font-size: small;
}

.text-xsmall {
    font-size: xx-small;
}

.box-red {
    background: #e93f3f;
    padding: 10px 30px;
    margin-top: 40px;
}

    .box-red p {
        color: #fff;
        text-align: center;
    }

#msform {
    text-align: center;
    position: relative;
}

    #msform fieldset {
        background: white;
        border: 0 none;
        border-radius: 0px;
        /*box-shadow: 0 2px 10px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);*/
        /*box-shadow: 0 0 15px 1px rgba(0, 0, 0, 0.4);
    /*padding: 20px 30px;*/
        box-sizing: border-box;
        /*stacking fieldsets above each other*/
        position: relative;
    }

        /*Hide all except first fieldset*/
        #msform fieldset:not(:first-of-type) {
            display: none;
        }

    /*inputs*/
    #msform input, #msform textarea, #msform select {
        padding: 0px;
        border: 1px solid #ccc;
        border-radius: 5px;
        width: 100%;
        box-sizing: border-box;
        color: #2C3E50;
        font-size: 13px;
        height: 25px;
    }

        #msform input[type=text], #msform input[type=date], #msform input[type=password] {
            padding: 5px;
            margin-bottom: 0;
            width: 100%;
        }

        #msform input[type=radio] {
            margin-left: -30px;
            position: absolute;
            width: auto;
            margin-top: -8px;
        }

        #msform input[type=checkbox] {
            width: auto !important;
        }

        #msform input:focus, #msform textarea:focus {
            -moz-box-shadow: none !important;
            -webkit-box-shadow: none !important;
            box-shadow: none !important;
            border: 1px solid #ee0979;
            outline-width: 0;
            transition: All 0.5s ease-in;
            -webkit-transition: All 0.5s ease-in;
            -moz-transition: All 0.5s ease-in;
            -o-transition: All 0.5s ease-in;
        }

/*buttons*/
.tombolcenter {
    margin: 18px 0;
}

.tombolorange {
    background: #e77721;
    color: #fff;
    border-radius: 5px;
    border: 1px solid #e77721;
    border: 0 none;
    cursor: pointer;
    width: auto;
    padding: 10px;
    float: none;
}

    .tombolorange:hover {
        background: #fff;
        color: #e77721;
        border: 1px solid #e77721;
    }

#msform .action-button {
    width: 100px;
    background: #e77721;
    font-weight: bold;
    color: white;
    border: 0 none;
    border-radius: 5px;
    cursor: pointer;
    padding: 10px 5px;
    margin: 10px 5px;
    font-size: 13px;
}

    #msform .action-button:hover, #msform .action-button:focus {
        box-shadow: 0 0 0 2px white, 0 0 0 3px #ee0979;
    }

#msform .action-button-previous {
    width: 100px;
    background: none;
    border: 2px solid #e77721;
    font-weight: bold;
    color: #e77721;
    border-radius: 5px;
    cursor: pointer;
    padding: 10px 5px;
    margin: 10px 5px;
    font-size: 13px;
}

    #msform .action-button-previous:hover, #msform .action-button-previous:focus {
        box-shadow: 0 0 0 2px white, 0 0 0 3px #C5C5F1;
    }

.tombolnext, .tombolprev, .tombolprev2, .btn-blue, .btn-orange, .btn-orange2, .btn-green, .btn-red, .btn-redlight, .btn-gray {
    font-family: "Poppins Semibold";
}

.tombolnext {
    padding: 5px 20px;
    border-radius: 8px; /*float:right;*/
    width: auto;
    color: #fff;
    background: #023047;
    border: 1px solid #023047;
}

    .tombolnext:hover {
        color: #023047;
        background: none;
        border: 1px solid #023047;
    }

.tombolprev {
    padding: 5px 20px;
    margin-right: 8px;
    border-radius: 5px;
    float: right;
    width: auto;
    color: #fff;
    background: #575756;
    border: 1px solid #575756;
}

    .tombolprev:hover {
        color: #575756;
        background: none;
        border: 1px solid #575756;
    }

.tombolprev2 {
    padding: 5px 20px;
    margin-right: 8px;
    border-radius: 5px;
    float: right;
    width: auto;
    color: #023047;
    background: #fff;
    border: 1px solid #023047;
}

    .tombolprev2:hover {
        color: #fff;
        background: #023047;
        border: 1px solid #023047;
    }

/*headings*/
.fs-title {
    font-size: 18px;
    text-transform: uppercase;
    color: #2C3E50;
    margin-bottom: 10px;
    letter-spacing: 2px;
    font-weight: bold;
}

.fs-subtitle {
    font-weight: normal;
    font-size: 13px;
    color: #666;
    margin-bottom: 20px;
}

/*progressbar*/
#progressbar {
    overflow: hidden;
    /*CSS counters to number the steps*/
    counter-reset: step;
    margin: 0 15% 10px 15%;
    text-align: center;
}

    #progressbar.progressbar2 {
        margin: 0 10% 10px 10%;
    }

    #progressbar li {
        list-style-type: none;
        font-size: 10px;
        /*width: 33.33%;*/
        width: 25%;
        float: left;
        position: relative;
    }

ul#progressbar.progressbar li {
    width: 33.33% !important;
    float: left;
}

ul#progressbar.progressbar2 li {
    width: 50% !important;
    float: left;
}

#progressbar li:before {
    content: counter(step);
    counter-increment: step;
    width: 30px;
    height: 30px;
    line-height: 24px;
    display: block;
    font-size: 14px;
    color: #d3d3d3;
    border-radius: 25px;
    border: 3px solid #d3d3d3;
    margin: 0 auto 10px auto;
}

/*progressbar connectors*/
#progressbar li:after {
    content: '';
    width: 88%;
    height: 4px;
    background: #d3d3d3;
    position: absolute;
    left: -44%;
    top: 12px;
    z-index: -1; /*put it behind the numbers*/
}

#progressbar.progressbar2 li:after {
    width: 94%;
    left: -47%;
}

#progressbar li:first-child:after {
    /*connector not needed before the first step*/
    content: none;
}

/*marking active/completed steps green*/
/*The number of the step and the connector before it = green*/
#progressbar li.active:before, #progressbar li.active:after {
    border: 3px solid #139da7;
    color: #139da7;
}

/* Not relevant to this form */
.dme_link {
    margin-top: 30px;
    text-align: center;
}

    .dme_link a {
        background: #FFF;
        font-weight: bold;
        color: #ee0979;
        border: 0 none;
        border-radius: 25px;
        cursor: pointer;
        padding: 5px 25px;
        font-size: 12px;
    }

        .dme_link a:hover, .dme_link a:focus {
            background: #C5C5F1;
            text-decoration: none;
        }

.start {
}

    .start span {
        font-size: large;
        padding-right: 10px;
        padding-bottom: 30px;
    }

    .start select {
        margin-bottom: 30px;
    }

#msform fieldset {
    width: 100%;
    /*margin-bottom: 5px;*/
}

    #msform fieldset .col-md-8 {
        /*padding: 30px;*/
    }

#container {
    padding-bottom: 15px;
}

    #container h1 {
        font-size: x-large;
        margin-bottom: 30px;
    }

    #container .box-white .col-md-4, #container .box-white .col-md-8 {
        padding: 0;
    }

    #container .col-md-4 {
        padding-bottom: 15px;
    }

    #container img {
        width: 100%;
        object-fit: cover;
    }

#news-modal {
    text-align: center;
    padding: 50px 10px;
    background: #fff;
    border: solid 3px #ed7d31;
    border-radius: 10px;
}

    #news-modal h3 a {
        font-size: 30px;
    }

    #news-modal p span {
        color: #ed7d31;
    }

#news-modal-box {
    padding-left: 30px;
    padding-right: 30px;
}

.navbar-nav {
    float: left !important
}

.box-details {
    border-bottom: 1px solid #c6c6c6;
    padding: 15px 20px;
}

    .box-details h2 {
        font-size: xx-large;
    }

    .box-details p {
        margin-bottom: 0;
    }

.box-arrow {
    padding: 10px 20px;
}

.bigbox-details {
    border-bottom: 1px solid #c6c6c6;
    padding: 15px;
}

    .bigbox-details span.text-orange {
        font-weight: bold;
    }

.bigbox-content {
    border: 1px solid #c6c6c6;
    margin: 15px;
}

.bigbox-top {
    border-bottom: 1px solid #c6c6c6;
    padding: 15px;
}

.bigbox-bottom {
    padding: 5px 15px;
}

#container .col-md-12 .box-white {
    padding-bottom: 15px;
}

.float-right {
    float: right;
}

.round-btn-right {
    border: 1px solid #e77721;
    border-radius: 5px;
    float: right;
    color: #e77721;
    padding: 5px;
    margin-top: -5px;
}

.bar {
    margin: 10px 0;
}

.bar-gray {
    background: #c6c6c6;
}

.bar-orange {
    background: #e77721;
    width: 50%;
    height: 15px;
}

.text-abu-right {
    color: #818181;
    float: right;
}

.text-blue {
    color: #129da6;
}

.text-gray {
    color: #28474d;
}

.text-green {
    color: #25ac8e;
}

.text-bold {
    font-family: 'Poppins Bold' !important
}

#content .container, #container .box-white {
    box-shadow: 0 2px 10px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);
    background: #fff;
}

#content, #content .container {
    height: auto !important;
    zoom: 1 !important;
    overflow: hidden !important;
    min-height: unset !important;
}

.isi2 {
    height: auto !important;
    zoom: 1 !important;
    overflow: hidden !important;
}

#content .row div.gambar img {
    float: left;
    width: 60px;
    margin-right: 15px;
}

#content .row .col-md-8 .row {
    padding-top: 30px;
    padding-left: 30px;
    margin-right: 0;
}

#content .row .col-md-8.maid .row {
    padding-left: 0;
    padding-top: 0;
    padding-right: 30px;
}

#content .maid hr {
    border-top: 1px solid #d3d3d3;
    margin-bottom: 10px;
}

#content hr.abu {
    border-top: 1px solid #d3d3d3;
}

#content hr.abu2 {
    border-top: 1px solid #d3d3d3;
    margin-bottom: 0;
}

.textboxgaris {
    border: none;
    border-bottom: 1px solid #000;
    width: 20%;
}

.maid2 {
    padding-left: 30px;
    background: #fff;
}

    .maid2 .col-md-8 {
        background: #fff;
    }

.maid .row {
    padding-top: 5px !important;
    padding-left: 30px !important;
}

.maid p, .maid h4 {
    padding-left: 30px;
}

.maid .privacy {
    margin-left: 30px;
}

    .maid .privacy p {
        padding-left: 0;
    }

.maid h2 {
    color: #f57e2a;
    padding-top: 15px;
    padding-bottom: 10px;
    padding-left: 30px;
    font-weight: bold;
}

.maid table, .maid2 table {
    margin: 0 auto;
    margin-top: 30px;
}

.maid3 table {
    margin: 0 auto;
}

.maid table.tabel, .maid2 table.tabel {
    margin: inherit;
    margin-top: 0;
}

.black {
    color: #000;
}

.maid, .game {
    border-bottom: 1px solid #d3d3d3;
}

.tombol, .tombol2 {
    width: 100%;
    padding-right: 15px;
    float: right;
}

.tomboldonate {
    width: 100%;
    padding-right: 15px;
}

    .tomboldonate .btn2 {
        margin-right: 0;
    }

.btn-login {
    background: #e77721;
    border: 1px solid #e77721;
    color: #fff;
    padding: 2px 5px;
    border-radius: 5px;
    font-size: small;
}

    .btn-login:hover {
        background: #fff;
        color: #e77721;
        border: 1px solid #e77721;
    }

.btnyes {
    background: #e77721;
    border: 1px solid #e77721;
    color: #fff;
    padding: 5px;
}

    .btnyes:hover {
        background: none;
        border: 1px solid #e77721;
        background: none;
        color: #e77721;
    }

.btnno {
    border: 1px solid #000;
    padding: 5px;
    color: #000;
}

    .btnno:hover {
        background: #000;
        color: #fff;
    }

.tombol.btn-center {
    text-align: center;
    float: none;
}

.btn-center .btn1, .btn-center .btn2 {
    display: inline-block !important;
    width: auto !important;
    float: none;
}

.btn1 {
    background: #139da7;
    color: #fff;
    border: 1px solid #139da7;
    padding: 5px 20px;
    border-radius: 5px;
    font-size: small;
}

    .btn1:hover {
        background: #fff;
        color: #139da7;
        border: 1px solid #139da7;
    }

.btn2 {
    background: #e77721;
    border: 1px solid #e77721;
    color: #fff;
    padding: 5px 20px;
    border-radius: 5px;
    font-size: small;
}

    .btn2:hover {
        background: #fff;
        color: #e77721;
        border: 1px solid #e77721;
    }

.btn3 {
    background: #28474c;
    color: #fff;
    border: 1px solid #28474c;
    padding: 5px 20px;
    border-radius: 5px;
    font-size: small;
}

    .btn3:hover {
        background: #fff;
        color: #28474c;
        border: 1px solid #28474c;
    }

.btn4 {
    background: #575756;
    color: #fff;
    border: 1px solid #575756;
    padding: 5px 20px;
    border-radius: 5px;
    font-size: small;
}

    .btn4:hover {
        background: #fff;
        color: #575756;
        border: 1px solid #575756;
    }

.btn1, .btn2, .btn3, .btn4 {
    float: right;
    font-size: 15px;
}

.btn1, .btn2, .btn3 {
    margin-right: 5px;
}

span.bg-orange {
    padding: 5px 20px;
    color: #fff;
    font-size: small;
}

span.bg-yellow {
    padding: 5px 20px;
    margin-left: 5px;
    font-size: small;
    background: #fdd774;
    color: #000;
}

.maid.education .row {
    padding-left: 15px !important;
}

.maid.education table td {
    padding: 8px !important;
}

.maid.education table {
    margin-top: 0px !important;
}

.maid table td {
    padding: 15px;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
    border-left: 5px solid #fff;
    border-right: 5px solid #fff;
}

.maid2 table td {
    padding: 5px;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
    border-left: 5px solid #fff;
    border-right: 5px solid #fff;
}

.maid3 table td {
    padding: 3px 10px;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
    border-left: 5px solid #fff;
    border-right: 5px solid #fff;
}

.table-goals td {
    padding: 5px !important;
}

.td-yellow {
    background: #fdd774;
    color: #000;
}

.td-orange {
    background: #e77721;
    color: #fff;
    text-align: center;
}

.td-abu {
    background: #969696;
    color: #fff;
    text-align: center;
}

.maid2 .td-orange a, .maid3 .td-orange a {
    border: 1px solid #e77721;
    background: #fff;
    color: #e77721;
    padding: 2px 10px;
}

.td-orange a {
    border: 1px solid #e77721;
    background: #fff;
    color: #e77721;
    padding: 5px 10px;
}

    .td-orange a:hover {
        color: #000;
        background: #fff;
    }

.maid2 .td-abu a, .maid3 .td-abu a {
    border: 1px solid #fff;
    color: #fff;
    padding: 2px 10px;
}

.td-abu a {
    border: 1px solid #fff;
    color: #fff;
    padding: 5px 10px;
}

    .td-abu a:hover {
        color: #000;
    }

.tooltip {
    display: none !important;
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted black;
}

    .tooltip .tooltiptext {
        visibility: hidden;
        width: 120px;
        background-color: black;
        color: #fff;
        text-align: center;
        border-radius: 6px;
        padding: 5px 0;
        /* Position the tooltip */
        position: absolute;
        z-index: 1;
    }

    .tooltip:hover .tooltiptext {
        visibility: visible;
    }

.mob ol {
    padding-left: 15px;
}

#content hr {
    border-top: 1px solid #e77721;
    margin-top: 10px;
    margin-bottom: 10px;
}

#content h1 {
    font-size: x-large;
    margin-bottom: 15px;
}

#content .btn {
    margin-right: 30px;
    margin-top: 30px;
}

.chat {
    background: #fc8028;
    bottom: 0;
    padding: 0 15px;
    color: #fff;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    z-index: 999;
    float: right;
    position: fixed;
}

.box-orange {
    border: 1px solid #f57e2a;
    padding: 10px;
    min-height: 100px;
    border-radius: 20px;
}

.borderboxorange {
    border: 1px solid #f57e2a;
    margin-left: 15px;
    margin-top: 20px;
    padding: 10px;
}

.borderorange {
    border: 2px solid #f57e2a;
    width: 95%;
}

    .borderorange h2 {
        padding: 10px 0;
        font-size: large;
        text-align: center;
    }

    .borderorange div {
        width: 100%;
        text-align: center;
    }

.faqs ul {
    padding: 0 15px 15px 30px;
}

    .faqs ul li {
        list-style: disc;
        color: #f57e2a;
    }

.col.col-md-8.faqs .row {
    padding-top: 12px !important;
    padding-left: 15px;
    margin-right: 0;
}

.btn-orange {
    background: #f57e2a;
    color: #fff;
    border: 2px solid #f57e2a;
    border-radius: 8px;
    padding: 5px 30px;
    /*margin: 0 auto;*/
    font-size: medium;
}

    .btn-orange:hover {
        background: #fff;
        color: #f57e2a;
        border: 2px solid #f57e2a;
    }

.btn-orange2 {
    background: white;
    color: black;
    border: 2px solid #f57e2a;
    border-radius: 8px;
    padding: 5px 30px;
    /*margin: 0 auto;*/
    font-size: medium;
}

    .btn-orange2:hover {
        background: #f57e2a;
        color: #fff;
        border: 2px solid #f57e2a;
    }

.btn-gray {
    background: #575756;
    color: #fff;
    border: 2px solid #575756;
    border-radius: 8px;
    padding: 5px 30px;
    margin: 0 auto;
    font-size: medium;
}

    .btn-gray:hover {
        background: #fff;
        color: #575756;
        border: 2px solid #575756;
    }

.btn-blue {
    background: #139da7;
    color: #fff;
    border: 2px solid #139da7;
    border-radius: 8px;
    padding: 5px 30px;
    margin: 0 auto;
    font-size: medium;
}

    .btn-blue:hover {
        background: #fff;
        color: #139da7;
        border: 2px solid #139da7;
    }

.webuploader-pick .btn {
    margin-top: 0px !important;
}

.webuploader-pick .btn-orange {
    margin-bottom: 0px !important;
}

.btn-green {
    background: #01b077;
    border: 2px solid #01b077;
    color: #fff;
    text-transform: uppercase;
    border-radius: 8px;
    padding: 5px 30px;
    font-size: medium;
}

    .btn-green:hover {
        background-color: transparent;
        color: #01b077;
        border: 2px solid #01b077;
    }

.btn-red {
    background: #e73324;
    border: 2px solid #e73324;
    color: #fff;
    text-transform: uppercase;
    border-radius: 8px;
    padding: 5px 30px;
    font-size: medium;
}

    .btn-red:hover {
        background-color: transparent;
        color: #e73324;
        border: 2px solid #e73324;
    }

.btn-redlight {
    background-color: transparent;
    border: 2px solid #e73324;
    color: #e73324;
    text-transform: uppercase;
    border-radius: 8px;
    padding: 5px 30px;
    font-size: medium;
}

    .btn-redlight:hover {
        background-color: #e73324;
        color: #fff !important;
        border: 2px solid #e73324;
    }

/*--------------------------------------------------------------
#0.1	Theme Reset Style
--------------------------------------------------------------*/
@font-face {
    font-family: 'Oduda-Bold';
    src: url('../fonts/Oduda-Bold.eot');
    src: url('../fonts/Oduda-Bold.eot?#iefix') format('embedded-opentype'), url('../fonts/Oduda-Bold.woff2') format('woff'), url('../fonts/Oduda-Bold.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Oduda-Regular';
    src: url('../fonts/Oduda-Regular.eot');
    src: url('../fonts/Oduda-Regular.eot?#iefix') format('embedded-opentype'), url('../fonts/Oduda-Regular.woff') format('woff'), url('../fonts/Oduda-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Oduda-Light';
    src: url('../fonts/Oduda-Light.eot');
    src: url('../fonts/Oduda-Light.eot?#iefix') format('embedded-opentype'), url('../fonts/Oduda-Light.woff') format('woff'), url('../fonts/Oduda-Light.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Oduda-SemiBold';
    src: url('../fonts/Oduda-SemiBold.eot');
    src: url('../fonts/Oduda-SemiBold.eot?#iefix') format('embedded-opentype'), url('../fonts/Oduda-SemiBold.woff') format('woff'), url('../fonts/Oduda-SemiBold.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Seville-Regular';
    src: url('../fonts/Seville-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: cilcularmedium;
    src: url(../fonts/cilcular/CircularStd-Medium.woff);
}

@font-face {
    font-family: cilcularbold;
    src: url(../fonts/cilcular/CircularStd-Bold.woff);
}

@font-face {
    font-family: cilcularitalic;
    src: url(../fonts/cilcular/CircularStd-MediumItalic.woff);
}

@font-face {
    font-family: cilcularblack;
    src: url(../fonts/cilcular/CircularStd-Black.woff);
}

@font-face {
    font-family: cilcularbook;
    src: url(../fonts/cilcular/CircularStd-Book.woff);
}

@font-face {
    font-family: "All Round Gothic W01 Bold";
    src: url("../fonts/8df141f447c5686cf9dbae8dabb1e71a.eot"); /* IE9*/
    src: url("../fonts/8df141f447c5686cf9dbae8dabb1e71a.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
    url("../fonts/8df141f447c5686cf9dbae8dabb1e71a.woff2") format("woff2"), /* chrome、firefox */
    url("../fonts/8df141f447c5686cf9dbae8dabb1e71a.woff") format("woff"), /* chrome、firefox */
    url("../fonts/8df141f447c5686cf9dbae8dabb1e71a.ttf") format("truetype"), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
    url("../fonts/8df141f447c5686cf9dbae8dabb1e71a.svg#All Round Gothic W01 Bold") format("svg"); /* iOS 4.1- */
}

@font-face {
    font-family: "Poppins";
    src: url("../fonts/2f86dc938a55788d3416b876b43a116a.eot"); /* IE9*/
    src: url("../fonts/2f86dc938a55788d3416b876b43a116a.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
    url("../fonts/2f86dc938a55788d3416b876b43a116a.woff2") format("woff2"), /* chrome、firefox */
    url("../fonts/2f86dc938a55788d3416b876b43a116a.woff") format("woff"), /* chrome、firefox */
    url("../fonts/2f86dc938a55788d3416b876b43a116a.ttf") format("truetype"), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
    url("../fonts/2f86dc938a55788d3416b876b43a116a.svg#Poppins") format("svg"); /* iOS 4.1- */
}

@font-face {
    font-family: "Poppins Bold";
    src: url("../fonts/07ecc0aa9ce268962dea7356eeff50a6.eot"); /* IE9*/
    src: url("../fonts/07ecc0aa9ce268962dea7356eeff50a6.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
    url("../fonts/07ecc0aa9ce268962dea7356eeff50a6.woff2") format("woff2"), /* chrome、firefox */
    url("../fonts/07ecc0aa9ce268962dea7356eeff50a6.woff") format("woff"), /* chrome、firefox */
    url("../fonts/07ecc0aa9ce268962dea7356eeff50a6.ttf") format("truetype"), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
    url("../fonts/07ecc0aa9ce268962dea7356eeff50a6.svg#Poppins Bold") format("svg"); /* iOS 4.1- */
}

@font-face {
    font-family: "Poppins Semibold";
    src: url("../fonts/poppins-semibold.eot"); /* IE9*/
    src: url("../fonts/poppins-semibold.eot") format("embedded-opentype"), /* IE6-IE8 */
    url("../fonts/poppins-semibold.woff2") format("woff2"), /* chrome、firefox */
    url("../fonts/poppins-semibold.woff") format("woff"), /* chrome、firefox */
    url("../fonts/poppins-semibold.ttf") format("truetype"), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
    url("../fonts/poppins-semibold.svg#Poppins Semibold") format("svg"); /* iOS 4.1- */
}

body {
    /*font-family: 'Oduda-Regular';
	font-family: 'Roboto', sans-serif;*/
    font-family: 'Poppins';
    font-size: 14px;
    overflow-x: hidden;
    color: #575757;
}

.img-fluid {
    max-width: 100%;
    height: auto;
}

.navbar .btn-dark2, .navbar .btn-dark, .navbar .btn-light, .navbar .btn-light2 {
    font-size: 16px !important;
    margin-top: -1px;
}

.btn-dark2, .btn-disabled-dark2, .btn-dark, .btn-light, .btn-light2 {
    font-size: 16px !important;
    padding: 6px 15.5px;
}



.btn-dark {
    background-color: #023047;
    border-color: #023047;
    color: #fff;
    text-transform: uppercase;
    border-radius: 8px;
}

.btn-dark2, .btn-disabled-dark2 {
    background-color: #023047;
    border-color: #023047;
    color: #fff;
    border-radius: 8px;
}

.btn-dark:hover, .btn-dark:focus {
    background-color: transparent;
    color: #023047;
}

.btn-dark2:hover, .btn-dark2:focus {
    background-color: transparent;
    color: #023047;
}

/*.btn-dark:focus {
    color: #fff;
}*/

.btn-light {
    background-color: transparent;
    border-color: #023047;
    color: #023047;
    text-transform: uppercase;
    border-radius: 8px;
}

.btn-light2 {
    background-color: transparent;
    border-color: #023047;
    color: #023047;
    text-transform: uppercase;
    border-radius: 8px;
}

    .btn-light:hover, .btn-light:focus, .btn-light2:hover, .btn-light2:focus {
        background-color: #023047;
        color: #fff !important;
    }

/*.btn-light:focus {
    color: #023047;
}*/

.text-oduda {
    font-family: 'Oduda-Regular', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
}

.text-seville {
    font-family: 'Seville-Regular', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
}

h1 {
    font-family: 'Poppins Semibold';
}

h2 {
    /*font-size: 36px;
	font-weight: lighter;
	color: #333333;
	margin: 0;
	text-transform: capitalize;*/
    font-size: 20px;
    font-weight: 300;
    color: #575756;
    margin: 0;
    text-transform: none;
}

h3 {
    font-size: 15px;
    color: #333333;
}

a {
    font-size: 14px;
    text-transform: none;
    color: #023047;
}

    a:hover,
    a:focus {
        text-decoration: none !important;
    }

p {
    color: #575756;
    line-height: 1.5;
}

ul {
    list-style-type: none;
    padding-left: 0;
    margin: 0;
}

input:focus {
    outline: none !important;
    box-shadow: none !important;
}



/*--------------------------------------------------------------
#0.2	Global Elements 
--------------------------------------------------------------*/
header .header-title {
    position: relative;
    text-align: center;
    color: #fff;
}

    header .header-title img {
        width: 100%;
    }
    /*section#whatyouget {
    padding-top: 100px;
}
*/
    header .header-title .center {
        position: absolute;
        left: 0%;
        top: 50%;
        z-index: 5;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
    }

    header .header-title h1 {
        font-family: 'Roboto', sans-serif;
        font-size: 70px;
        font-weight: normal;
        text-transform: uppercase;
    }

    header .header-title p {
        font-size: 25px;
        font-weight: lighter;
        color: #fff;
    }

header .navbar .navbar-nav > li.active a {
    color: #e80000;
}

header .navbar .dropdown-menu .active a {
    background: #1f252f !important;
    color: #4285f4;
}

header .navbar .dropdown-menu li:hover a {
    background-color: #fff !important;
}

/*.section-padding {
	padding: 100px 0;
	overflow: hidden;
}*/
.section-padding {
    padding: 100px 0;
    overflow: hidden;
}

.section-heading {
    text-align: center;
    /*padding-bottom: 100px;*/
    padding-bottom: 40px;
    overflow: hidden;
}

    .section-heading h2 {
        padding-bottom: 10px;
        position: relative;
        font-size: 26px;
        font-family: 'Poppins Semibold';
    }

    .section-heading p {
        font-size: 14px;
        font-weight: 300;
        color: #757575;
        margin-bottom: 0;
        /*padding-bottom: 30px;*/
        padding-bottom: 0px;
    }

    .section-heading .btn {
        /*margin-top: 60px;*/
        margin-bottom: 15px;
    }

.section-padding p {
    color: #575756;
    font-family: 'Oduda-Light';
    font-size: 17px;
    padding-bottom: 15px;
}

.btn-white {
    color: #e9771f;
    background-color: #ffffff;
    border: 1px solid #e9771f;
}

.overlay {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
}

.theme-highlights {
    font-weight: bold;
    color: #fff;
}

/*video*/
.video {
    width: 100%;
    position: relative;
    text-align: center;
    overflow: hidden;
}

    .video .overlay {
        background: -webkit-linear-gradient(top, rgba(0,0,0, 0.2), rgba(0,0,0, 0.7));
        background: -moz-linear-gradient(top, rgba(0,0,0, 0.2), rgba(0,0,0, 0.7));
        background: -o-linear-gradient(top, rgba(0,0,0, 0.2), rgba(0,0,0, 0.7));
        background: -ms-linear-gradient(top, rgba(0,0,0, 0.2), rgba(0,0,0, 0.7));
        background: linear-gradient(top, rgba(0,0,0, 0.2), rgba(0,0,0, 0.7));
    }

    .video .row,
    .video .col {
        height: 100%;
    }


    .video a {
        /*background: -webkit-linear-gradient(top, rgb(217, 83, 79), rgb(125, 56, 54));
	background: -moz-linear-gradient(top, rgba(144,38,141, 0.6), rgba(66,133,244, 0.6));
	background: -o-linear-gradient(top, rgba(144,38,141, 0.6), rgba(66,133,244, 0.6));
	background: -ms-linear-gradient(top, rgba(144,38,141, 0.6), rgba(66,133,244, 0.6));
	background: linear-gradient(top, rgba(144,38,141, 0.6), rgba(66,133,244, 0.6)); */
        display: inline-block;
        width: 50px;
        height: 50px;
        line-height: 50px;
        color: #fff;
        font-size: 24px;
        border-radius: 50%;
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        z-index: 5;
    }


/*nivo plugin customize*/
.nivo-lightbox-overlay {
    background-color: rgba(0,0,0, 0.9);
}

    .nivo-lightbox-overlay .nivo-lightbox-nav {
        display: none;
    }

    .nivo-lightbox-overlay .nivo-lightbox-close {
        background: url(../images/close.png) no-repeat;
        display: block;
        width: 45px;
        height: 45px;
        text-indent: -9999px;
        padding: 5px;
        opacity: 1;
    }

.parallax-window {
    min-height: 400px;
    background: transparent;
}

a.back-to-top {
    display: none;
    width: 60px;
    height: 60px;
    text-align: center;
    position: fixed;
    z-index: 999;
    right: 20px;
    bottom: 20px;
    background-color: rgba(0, 0, 0, 0.8);
    background-position: center 43%;
    line-height: 65px;
    color: #fff;
}




/*--------------------------------------------------------------
#1.1	header
--------------------------------------------------------------*/
header {
    overflow: hidden;
}


    /*nvigation*/
    header .navbar {
        background-color: #ffffff;
        border: 0;
        border-radius: 0;
        margin-bottom: 0;
        -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.11);
        -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.11);
        box-shadow: 0 1px 3px rgba(0,0,0,0.11);
    }

    header .navbar-brand {
        padding-left: 0;
        margin-right: 0px;
        margin-top: 0px;
        padding-right: 0;
    }

    header .navbar-header a.navbar-brand {
        line-height: 70px;
        margin-top: 0;
    }

    header .navbar .navbar-collapse ul li.dropdown ul.dropdown-menu li a {
        float: none;
        margin-top: 0;
        /*padding-bottom: 0;*/
        padding: 7.5px 15px;
        font-family: 'Poppins';
    }

    header .navbar .navbar-collapse ul li.dropdown ul.dropdown-menu li:last-child a {
        /*padding-bottom: 1em;*/
    }

    header .navbar a {
        font-family: 'Poppins Semibold';
        font-size: 16px;
        color: #333333;
        font-weight: 400;
        text-transform: none;
        /*padding-top: 0;
        padding-bottom: 15px;*/
        padding: 1em;
        /*line-height: 70px;*/
        float: left;
        /*margin-top: 35px;*/
        text-align: left;
    }

        header .navbar a:hover {
            background: none;
            color: #e87721;
        }

    header .navbar ul li a:focus {
        background: none !important;
    }

    header .navbar form {
        margin: 28px 0 0;
        padding-right: 0;
    }


    /*drop down menu setting*/
    header .dropdown-toggle {
        background: none !important;
    }

    header .dropdown-menu {
        /*	width: 180px;*/
        /*padding-top: 0;
        padding-bottom: 0;*/
        margin: 0;
        padding: 0;
        border: 0;
        /*border: none;*/
        /*border-top: 3px solid #eb7d3d;*/
    }

.btn-danger:hover {
    color: #eb7d3d;
    background-color: rgba(255, 255, 255, 0);
    border-color: #eb7d3d;
    border: 2px solid;
}

.dropbtn {
    font-family: 'Poppins Semibold';
    background-color: white;
    color: #333333;
    font-weight: 400;
    padding: 17px 17px 8px 16px;
    font-size: 16px;
    border: none;
    cursor: pointer;
}

.dropdown-content .dropdown .dropbtn {
    font-family: 'Poppins';
    text-align: left;
    background-color: #f4f4f4;
    color: #333333;
    padding: 12px 16px;
    width: 100%; /* Ensure full width for nested dropbtn */
    min-width: 240px;
}

    .dropdown-content .dropdown .dropbtn:hover, .dropdown-content .dropdown .dropdown-content .dropdown .dropbtn:hover {
        color: #e87721;
    }

.dropdown-content .dropdown .dropdown-content .dropdown .dropbtn {
    background-color: #e4e4e4;
    color: #333333;
    padding: 12px 16px;
    width: 100%; /* Ensure full width for nested dropbtn */
    min-width: 250px;
}

.dropdown {
    position: relative;
    display: inline-block;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f4f4f4;
    min-width: 240px;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    z-index: 1;
    transition: opacity 0.5s ease-in-out;
    width: 100%;
}

    /* Links inside dropdown */
    .dropdown-content a {
        color: black;
        padding: 12px 16px;
        text-decoration: none;
        display: block;
        font-family: 'Poppins' !important;
    }

        /* Hover effects for links */
        .dropdown-content a:hover {
            background-color: white;
            color: #e77721;
        }

/* Show the top-level dropdown on hover */
.dropdown:hover > .dropdown-content {
    display: block;
}

/* Styling for nested dropdowns */
.dropdown-content .dropdown {
    position: relative;
}

/* Hide all nested dropdowns by default */
.dropdown-content .dropdown-content {
    top: 0;
    left: 100%; /* Align nested dropdowns to the right of parent */
    min-width: 250px;
    display: none; /* Ensure hidden until hovered */
    background-color: #e4e4e4;
}

    .dropdown-content .dropdown-content .dropdown-content {
        top: 0;
        left: 100%; /* Align nested dropdowns to the right of parent */
        min-width: 250px;
        display: none; /* Ensure hidden until hovered */
        background-color: #c4c4c4;
    }

/* Show the nested dropdown when its parent is hovered */
.dropdown-content .dropdown:hover > .dropdown-content {
    display: block;
}
/* Ensuring each dropdown opens in a row-by-row fashion */
.dropdown-content a {
    display: block;
    width: 100%;
}
/* Nested dropdown button */
.dropdown-content .dropdown-content a {
    white-space: nowrap;
    width: 100%;
}
/* Handle the dropdown caret for nested levels */
.dropbtn i {
    margin-left: 0px;
    font-size: 16px;
}


header .dropdown-menu li {
    /*border-bottom: 1px solid #dbdbdc;*/
}

    header .dropdown-menu li:last-child {
        border-bottom: 0;
    }

header .dropdown-menu a {
    /*	background-color: #ffffff;*/
    line-height: 1.5;
    text-align: left;
}

    header .dropdown-menu a:hover {
        background-color: #fff;
    }
/*navigation search*/
header .navbar-form input {
    background-color: #2f343c;
    border: 1px solid #42464c;
    color: #fff;
}

    header .navbar-form input:focus {
        box-shadow: none !important;
    }

header .navbar-form span {
    display: inline-block;
    position: relative;
}

    header .navbar-form span input {
        background: none;
        display: inline-block;
        padding: 2px 12px;
        border: 0;
        position: relative;
        z-index: 2;
    }

        header .navbar-form span input:hover,
        header .navbar-form span input:active,
        header .navbar-form span input:focus {
            background: none !important;
            border: 0 !important;
            outline: 0 !important;
        }

header .navbar-form i {
    font-size: 16px;
    color: #fff;
    position: absolute;
    right: 3px;
    top: 3px;
    z-index: 1;
}
/*home-slider*/
.home-slider {
    position: relative;
    overflow: hidden;
    margin-top: 70px;
}

header .overlay {
    background: -webkit-linear-gradient(top, rgba(144, 38, 141, 0), rgba(66, 133, 244, 0));
    background: -moz-linear-gradient(top, rgba(144,38,141, 0.6), rgba(66,133,244, 0.6));
    background: -o-linear-gradient(top, rgba(144,38,141, 0.6), rgba(66,133,244, 0.6));
    background: -ms-linear-gradient(top, rgba(144,38,141, 0.6), rgba(66,133,244, 0.6));
    background: linear-gradient(top, rgba(144,38,141, 0.6), rgba(66,133,244, 0.6));
    width: 100%;
    height: 200%;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 1;
}

.home-slider .container h1 {
    /*font-size: 72px;*/
    font-size: 36px;
}

    .home-slider .container h1 span {
        display: block;
    }

.home-slider .container p {
    color: #fff;
    font-size: 36px;
    font-weight: lighter;
    margin: 20px 0 30px;
}

    .home-slider .container p + a {
        display: inline-block;
        margin-right: 20px;
    }

.home-slider .container a {
    /*background-color: rgba(0,0,0, 0.5);*/
    background-color: #eb7d3c;
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    /*text-transform: uppercase;*/
    line-height: 50px;
    padding: 0 40px;
    /*border: 1px solid #1b345e;*/
    border: 1px solid #eb7d3c;
    -webkit-transition: 0.3s;
    transition: 0.3s;
}

    .home-slider .container a:hover {
        background-color: transparent;
        border-color: #fff;
    }

/*slider pagination*/
.home-slider .owl-controls {
    position: absolute;
    right: 47%;
    bottom: 30px;
}

.home-slider .owl-pagination .owl-page span {
    background-color: #abb5ec;
}

.home-slider .owl-pagination .active span {
    width: 14px;
    height: 14px;
    background: #eb7d3c !important;
}





/*--------------------------------------------------------------
#1.2	offer
--------------------------------------------------------------*/
.offer {
    overflow: hidden;
    text-align: center;
}

    /*offer icons*/
    .offer .col span {
        display: inline-block;
        width: 110px;
        height: 110px;
        /*border: 1px solid #963195;
	border-top-color: #963195;
	border-right-color: #4285f4;
	border-bottom-color: #4285f4;
	border-left-color: #963195;
	border-radius: 50%;*/
        color: #fff;
        position: relative;
    }

        .offer .col span:before {
            content: "";
            /*background: -webkit-linear-gradient(top, #8a3099, #5074e2);
	background: -moz-linear-gradient(top, #8a3099, #5074e2);
	background: -o-linear-gradient(top, #8a3099, #5074e2);
	background: -ms-linear-gradient(top, #8a3099, #5074e2);
	background: linear-gradient(top, #8a3099, #5074e2);*/
            width: 100%;
            height: 100%;
            display: block;
            border-radius: 50%;
            border: 0;
            position: absolute;
            top: 0;
            -webkit-transform: scale(0,0);
            transform: scale(0,0);
            -webkit-transition: all 0.2s ease-in-out;
            transition: all 0.2s ease-in-out;
        }

        .offer .col span i {
            background-color: #1f252f;
            display: inline-block;
            width: 90px;
            height: 90px;
            line-height: 90px;
            font-size: 40px;
            margin-top: 10px;
            border-radius: 50%;
            position: relative;
            z-index: 5;
        }


    /*offer rest content*/
    .offer h3 {
        font-weight: 400;
        margin: 9px 0 60px;
    }

    /*hover effect*/
    .offer .col:hover span {
        border: none;
    }

        .offer .col:hover span:before {
            -webkit-transform: scale(1,1);
            transform: scale(1,1);
        }

        .offer .col:hover span i {
            background-color: transparent;
        }

    .offer .col:hover h3 {
        color: #000;
    }



/*--------------------------------------------------------------
#1.3	intro
--------------------------------------------------------------*/
.intro {
    position: relative;
    overflow: hidden;
}

    .intro .overlay {
        background-color: rgba(31,37,47, 0.7);
        z-index: 2;
    }

    .intro .container {
        position: relative;
        z-index: 5;
    }

        .intro .container h2 {
            color: #fff;
            text-align: center;
            margin-bottom: 60px;
        }

            .intro .container h2:after {
                background: #fff;
            }

        .intro .container p {
            font-size: 18px;
            font-weight: lighter;
            color: #fff;
        }

    .intro .col {
        padding-top: 120px;
    }

    .intro .middle {
        text-align: center;
        padding-top: 0;
    }

        .intro .middle div {
            border-radius: 50%;
            padding: 15px;
            margin-bottom: 60px;
            border: 2px solid;
            border-top-color: #963195;
            border-right-color: #4285f4;
            border-bottom-color: #4285f4;
            border-left-color: #963195;
            -webkit-transition: all 0.5s;
            transition: all 0.5s;
        }

.rotating-border {
    border-top-color: #4285f4 !important;
    border-right-color: #963195 !important;
    border-bottom-color: #963195 !important;
    border-left-color: #4285f4 !important;
}

.intro .middle img {
    display: block;
    background-color: #eaf5ff;
    margin: 0 auto;
}

.intro .middle a {
    background: -webkit-linear-gradient(top, #8a3099, #5074e2);
    background: -moz-linear-gradient(top, #8a3099, #5074e2);
    background: -o-linear-gradient(top, #8a3099, #5074e2);
    background: -ms-linear-gradient(top, #8a3099, #5074e2);
    background: linear-gradient(top, #8a3099, #5074e2);
    display: inline-block;
    color: #fff;
    font-weight: bold;
    line-height: 55px;
    padding: 0 75px;
    border: 0;
}

    .intro .middle a i {
        display: inline-block;
        padding-right: 10px;
    }

    .intro .middle a:hover {
        background: -webkit-linear-gradient(top, #5074e2, #8a3099);
        background: -moz-linear-gradient(top, #5074e2, #8a3099);
        background: -o-linear-gradient(top, #5074e2, #8a3099);
        background: -ms-linear-gradient(top, #5074e2, #8a3099);
        background: linear-gradient(top, #5074e2, #8a3099);
    }



/*--------------------------------------------------------------
#1.4	our-portfolio
--------------------------------------------------------------*/
.our-portfolio {
    padding-bottom: 0;
    overflow: hidden;
}

    .our-portfolio .col,
    #portfolio #shuffle-wrapper .col {
        padding: 0;
        overflow: hidden;
    }

        .our-portfolio .col > div,
        #portfolio #shuffle-wrapper .col > div,
        #portfolio-details .portfolio-details-portfolio .col > div {
            position: relative;
        }

    .our-portfolio .title,
    #portfolio #shuffle-wrapper .title,
    #portfolio-details .portfolio-details-portfolio .title {
        background: -webkit-linear-gradient(top, rgba(144,38,141, 0.8), rgba(66,133,244, 0.8));
        background: -moz-linear-gradient(top, rgba(144,38,141, 0.8), rgba(66,133,244, 0.8));
        background: -o-linear-gradient(top, rgba(144,38,141, 0.8), rgba(66,133,244, 0.8));
        background: -ms-linear-gradient(top, rgba(144,38,141, 0.8), rgba(66,133,244, 0.8));
        background: linear-gradient(top, rgba(144,38,141, 0.8), rgba(66,133,244, 0.8));
        width: 100%;
        height: 100%;
        position: absolute;
        left: -100%;
        top: 0;
        text-align: center;
        -webkit-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
    }

        .our-portfolio .title div,
        #portfolio #shuffle-wrapper .title div,
        #portfolio-details .portfolio-details-portfolio .title div {
            width: 100%;
            position: absolute;
            left: 50%;
            top: 50%;
            -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
        }

    .our-portfolio .col h3,
    .our-portfolio .col p,
    #portfolio #shuffle-wrapper .col h3,
    #portfolio #shuffle-wrapper .col p,
    #portfolio-details .portfolio-details-portfolio .col h3,
    #portfolio-details .portfolio-details-portfolio .col p {
        color: #fff;
        text-transform: capitalize;
    }

    .our-portfolio h3 {
        font-weight: lighter;
        line-height: 30px;
        letter-spacing: 2px;
    }

    /*hover effect*/
    .our-portfolio .col > div a:hover .title,
    #portfolio #shuffle-wrapper .col > div a:hover .title,
    #portfolio-details .portfolio-details-portfolio .col > div a:hover .title {
        left: 0;
    }



/*--------------------------------------------------------------
#1.5	become-a-part
--------------------------------------------------------------*/
.become-a-part {
    background: -webkit-linear-gradient(left, #202123 50%, #4285f4 50.1%);
    background: -moz-linear-gradient(left, #202123 50%, #4285f4 50.1%);
    background: -o-linear-gradient(left, #202123 50%, #4285f4 50.1%);
    background: -ms-linear-gradient(left, #202123 50%, #4285f4 50.1%);
    background: linear-gradient(left, #202123 50%, #4285f4 50.1%);
    overflow: hidden;
}

    .become-a-part p {
        font-size: 25px;
        font-weight: lighter;
        color: #fff;
    }

    .become-a-part .col a {
        background-color: transparent;
        display: inline-block;
        color: #fff;
        font-weight: bold;
        line-height: 50px;
        padding: 0 75px;
        margin-left: 30px;
    }

    .become-a-part .col {
        padding: 80px 0;
    }

    .become-a-part .left {
        background-color: #202123;
    }

    .become-a-part .right {
        background-color: #4285f4;
        padding: 74px 0;
    }

    .become-a-part .col a:hover {
        background-color: #e6e6e6;
        border-color: #adadad;
        color: #333;
    }



/*--------------------------------------------------------------
#1.6	features
--------------------------------------------------------------*/
.features {
    overflow: hidden;
}

    .features .col div {
        padding-left: 70px;
        padding-bottom: 70px;
        position: relative;
    }

        .features .col div:last-child {
            padding-bottom: 0;
        }

        .features .col div span {
            background-repeat: no-repeat;
            display: inline-block;
            position: absolute;
            left: 0;
            top: 0;
        }

        .features .col div h3 {
            font-weight: 600;
            margin-top: 0;
        }

        .features .col div p {
            margin-bottom: 0;
        }


    /*icon images*/
    .features .col .icon {
        background-image: url(../images/home/features/icon.png);
        width: 44px;
        height: 46px;
    }

    .features .col .support {
        background-image: url(../images/home/features/support.png);
        width: 53px;
        height: 47px;
    }

    .features .col .responsive {
        background-image: url(../images/home/features/responsive.png);
        width: 51px;
        height: 35px;
    }

    .features .col .retina {
        background-image: url(../images/home/features/retina.png);
        width: 34px;
        height: 46px;
    }

    .features .col .multi-purpose {
        background-image: url(../images/home/features/multi-purpose.png);
        width: 40px;
        height: 49px;
    }

    .features .col .plan {
        background-image: url(../images/home/features/plan.png);
        width: 49px;
        height: 46px;
    }



/*--------------------------------------------------------------
#1.7	intro-2
--------------------------------------------------------------*/
.intro-2 {
    padding-bottom: 20px;
    position: relative;
    overflow: hidden;
}

    .intro-2 .overlay {
        background-color: rgba(66,133,244, 0.8);
        z-index: 2;
    }

    .intro-2 .container {
        position: relative;
        z-index: 3;
    }

        .intro-2 .container .iphone {
            width: 200%;
            position: absolute;
            left: 15%;
            top: -20px;
        }

    .intro-2 h2,
    .intro-2 p {
        color: #fff;
    }

    .intro-2 h2 {
        margin-bottom: 50px;
    }

        .intro-2 h2:after {
            background: #fff;
            left: 65px;
        }

    .intro-2 .container .col:first-child p {
        font-size: 18px;
        font-weight: lighter;
    }

    .intro-2 .container .col:last-child {
        padding-top: 500px;
        padding-left: 100px;
    }



/*--------------------------------------------------------------
#1.8	number
--------------------------------------------------------------*/
.number {
    background-color: #1f252f;
    text-align: center;
    overflow: hidden;
}

    .number .col {
        padding: 60px 0 80px;
        border-right: 1px dashed #363b44;
    }

        .number .col i {
            display: block;
            color: #fff;
            font-size: 30px;
            padding: 0 3px;
            position: absolute;
            top: 40px;
            left: 50%;
            -webkit-transform: translate(-50%);
            transform: translate(-50%);
        }

        .number .col span {
            display: inline-block;
            font-size: 60px;
            color: #9ce08d;
            border: 1px solid #888c91;
            border-radius: 20px;
            padding: 0 15px;
            margin-top: 35px;
        }

        .number .col p {
            color: #fff;
            font-weight: lighter;
            margin-top: 20px;
            word-wrap: break-word;
        }

    .number .support {
        border-top: 3px solid #86d375;
    }

    .number .purchases {
        border-top: 3px solid #1fc6d5;
    }

        .number .purchases span {
            color: #1fc6d5;
        }

    .number .cafe {
        border-top: 3px solid #f47272;
    }

        .number .cafe span {
            color: #f47272;
        }

    .number .facebook-like {
        border-top: 3px solid #aae980;
    }

    .number .tweet {
        border-top: 3px solid #9f7bfb;
    }

        .number .tweet span {
            color: #9f7bfb;
        }

    .number .comments {
        border-top: 3px solid #fbb439;
    }

        .number .comments span {
            color: #fbb439;
        }

.boxorange {
    background: url(../images/info1.png) no-repeat;
    top: 30px;
    position: absolute;
}

    .boxorange p {
        color: #fff;
        padding: 8px;
        background: #f57e2a;
        margin-left: 63px;
        width: 88%;
    }

.bg-orange {
    background: #f57e2a;
}

.bg-red {
    background: #e15b35;
}

.bg-blue {
    background: #139da7;
}

.bg-gray {
    background: #f7f7f7;
}

.bg-biru {
    background: #00b7ee;
}

.upload {
    padding: 1em;
}

    .upload p {
        margin-bottom: 1em;
    }

    .upload .col-md-6 {
        padding: 1em;
    }

        .upload .col-md-6 img {
            width: 80%;
            margin: 0 auto;
        }

    .upload .bgorange {
        background: #f57e2a;
        color: #fff;
        font-weight: bold;
    }

.tabel-blue {
    border: 2px solid #139da7;
    color: #139da7;
}

.tabel-orange {
    border: 2px solid #f57e2a;
    color: #f57e2a;
}

    .tabel-blue .text, .tabel-orange .text {
        padding: 15px;
    }

    .tabel-blue .bg-blue, .tabel-orange .bg-orange {
        color: #fff;
        padding: 15px;
    }
/*--------------------------------------------------------------
#1.9	testimonials
--------------------------------------------------------------*/
.testimonials {
    background: url(../images/home/testimonial-bg.jpg) no-repeat;
    background-size: cover;
    position: relative;
    padding: 150px 15%;
    color: #fff;
    text-align: center;
    overflow: hidden;
}

    .testimonials .comment {
        font-size: 26px;
        color: #fff;
        font-weight: lighter;
        line-height: 50px;
        margin-bottom: 100px;
    }

    .testimonials .organization-person a {
        display: inline-block;
        color: #fff;
    }

    .testimonials .organization-person small {
        display: block;
        margin-bottom: 15px;
    }



/*--------------------------------------------------------------
#1.10	services
--------------------------------------------------------------*/
.services {
    overflow: hidden;
}

    /*service-pack*/
    .services .service-pack {
        text-align: center;
        padding-right: 0;
    }

        .services .service-pack .col {
            padding: 0;
            border-right: 1px solid #f1f0f0;
        }

            .services .service-pack .col div {
                min-height: 391px;
                padding: 75px 15px;
                border-bottom: 1px solid #f1f0f0;
                -webkit-transition: all 0.3s ease-in-out;
                transition: all 0.3s ease-in-out;
            }

                .services .service-pack .col div span {
                    background-repeat: no-repeat;
                    width: 75px;
                    height: 71px;
                    display: block;
                    margin: 0 auto;
                }

    .services .web-design span {
        background: url(../images/home/services-icon/web-design.png);
    }

    .services .html span {
        background: url(../images/home/services-icon/html.png);
    }

    .services .ecommerce span {
        background: url(../images/home/services-icon/ecommerce.png);
    }

    .services .graphic span {
        background: url(../images/home/services-icon/graphic.png);
    }

    .services .article span {
        background: url(../images/home/services-icon/article.png);
    }

    .services .support span {
        background: url(../images/home/services-icon/support.png);
    }

    .services .service-pack h3 {
        margin-top: 50px;
    }

    .services .service-pack a {
        font-size: 12px;
        font-weight: bold;
        color: #4285f4;
        position: relative;
    }

        .services .service-pack a:before {
            content: ">";
            display: inline-block;
            position: absolute;
            left: -15px;
            top: 0px;
        }

    /*hover effect*/
    .services .service-pack .col div:hover {
        box-shadow: 0 0 3px 2px #d5d5d5;
    }

    /*what-we-do*/
    .services .what-we-do {
        background-color: #1f252f;
        padding: 60px 30px 80px 60px;
        color: #fff;
    }

        .services .what-we-do h3 {
            font-size: 30px;
            font-weight: lighter;
            color: #fff;
            margin-top: 0;
            margin: 0 0 40px;
            position: relative;
        }

            .services .what-we-do h3:after {
                content: "";
                background: -webkit-linear-gradient(top, #8a3099, #5074e2);
                background: -moz-linear-gradient(top, #8a3099, #5074e2);
                background: -o-linear-gradient(top, #8a3099, #5074e2);
                background: -ms-linear-gradient(top, #8a3099, #5074e2);
                background: linear-gradient(top, #8a3099, #5074e2);
                display: inline-block;
                width: 100px;
                height: 1px;
                position: absolute;
                left: 0%;
                top: 50px;
            }

        .services .what-we-do p {
            color: #fff;
            margin-bottom: 25px;
        }

        .services .what-we-do h3 + p {
            font-size: 18px;
            font-weight: lighter;
            line-height: 36px;
            color: #fff;
        }

        .services .what-we-do ul li {
            font-weight: lighter;
            margin-bottom: 17px;
            position: relative;
            left: 15px;
        }

            .services .what-we-do ul li:before {
                content: ">";
                display: inline-block;
                position: absolute;
                top: 0;
                left: -15px;
            }

        .services .what-we-do a {
            background: -webkit-linear-gradient(top, #8a3099, #5074e2);
            background: -moz-linear-gradient(top, #8a3099, #5074e2);
            background: -o-linear-gradient(top, #8a3099, #5074e2);
            background: -ms-linear-gradient(top, #8a3099, #5074e2);
            background: linear-gradient(top, #8a3099, #5074e2);
            display: inline-block;
            color: #fff;
            font-weight: bold;
            line-height: 45px;
            margin-top: 20px;
            padding: 0 45px;
            border: 0;
        }

            .services .what-we-do a i {
                display: inline-block;
                padding-right: 10px;
            }

            /*hover effect*/
            .services .what-we-do a:hover {
                background: -webkit-linear-gradient(top, #5074e2, #8a3099);
                background: -moz-linear-gradient(top, #5074e2, #8a3099);
                background: -o-linear-gradient(top, #5074e2, #8a3099);
                background: -ms-linear-gradient(top, #5074e2, #8a3099);
                background: linear-gradient(top, #5074e2, #8a3099);
            }



/*--------------------------------------------------------------
#1.11	partners
--------------------------------------------------------------*/
.partners {
    background: #eeecf2 url(../images/home/partners/partners-bg.png) no-repeat center bottom;
    margin-top: -5px;
    padding-bottom: 800px;
    position: relative;
    overflow: hidden;
    z-index: 5;
}

    .partners .section-heading p {
        color: #716E6E !important;
    }

    .partners .col {
        padding: 0;
        text-align: center;
    }

        .partners .col div {
            height: 85px;
            border-right: 1px solid #d6d4d9;
            border-bottom: 1px dashed #d6d4d9;
            position: relative;
        }

            .partners .col div:last-child {
                border-bottom: 0;
            }

            .partners .col div a {
                display: block;
                width: 100%;
                height: 100%;
            }

        .partners .col a img {
            display: block;
            position: absolute;
            left: 50%;
            top: 50%;
            -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
        }

        .partners .col div:first-child:after {
            content: "";
            background-color: #1f252f;
            width: 15px;
            height: 15px;
            border-radius: 50%;
            position: absolute;
            bottom: -8px;
            right: -8px;
            z-index: 5;
        }

    .partners .last-col div:after {
        display: none;
    }

    .partners .last-col div {
        border-right: none;
    }

    .partners .light div:after {
        background: -webkit-linear-gradient(top, #8a3099, #5074e2);
        background: -moz-linear-gradient(top, #8a3099, #5074e2);
        background: -o-linear-gradient(top, #8a3099, #5074e2);
        background: -ms-linear-gradient(top, #8a3099, #5074e2);
        background: linear-gradient(top, #8a3099, #5074e2);
    }



/*--------------------------------------------------------------
#1.12	pricing
--------------------------------------------------------------*/
.pricing {
    background: url(../images/home/pricing-bg.jpg) no-repeat center top;
    background-size: 100%;
    overflow: hidden;
}

    .pricing .section-heading h2 {
        color: #fff;
    }

    .pricing .section-heading p {
        color: #C5C5C5 !important;
    }

    .pricing .row:last-child .container .col:first-child {
        border-left: 1px solid #eaeaea;
    }

    .pricing .row:nth-child(2) .col {
        background-color: #fff;
        text-align: center;
        border-right: 1px solid #eaeaea;
        border-bottom: 1px solid #eaeaea;
        padding: 0;
    }


    /*pricing-title*/
    .pricing .pricing-title {
        padding: 20px 0;
        border-bottom: 1px solid #eaeaea;
    }

        .pricing .pricing-title h3 {
            font-size: 30px;
            font-weight: lighter;
            padding-bottom: 20px;
            margin: 0;
        }

        .pricing .pricing-title p {
            font-size: 20px;
            font-weight: lighter;
            margin-top: 0;
        }

            .pricing .pricing-title p span {
                font-weight: 600;
                color: #4285f4
            }

    /*pricing-details*/
    .pricing .pricing-details {
        padding: 20px 48px;
    }

        .pricing .pricing-details span {
            display: block;
            font-size: 16px;
            font-weight: 600;
            color: #333;
            margin-bottom: 10px;
        }

        .pricing .pricing-details p {
            margin: 0;
        }

        .pricing .pricing-details ul li {
            border-bottom: 1px solid #eaeaea;
            padding: 20px 0;
        }

            .pricing .pricing-details ul li:first-child {
                padding-top: 0;
            }

        .pricing .pricing-details a {
            display: inline-block;
            font-weight: bold;
            margin-top: 20px;
            line-height: 52px;
            padding: 0 42px;
        }

    /*hover effect*/
    .pricing .col:hover .pricing-details {
        box-shadow: 2px 2px 5px #d2d2d2;
        position: relative;
        z-index: 5;
        border-color: transparent;
    }

        .pricing .col:hover .pricing-title,
        .pricing .col:hover .pricing-details a {
            background: -webkit-linear-gradient(top, #8a3099, #5074e2);
            background: -moz-linear-gradient(top, #8a3099, #5074e2);
            background: -o-linear-gradient(top, #8a3099, #5074e2);
            background: -ms-linear-gradient(top, #8a3099, #5074e2);
            background: linear-gradient(top, #8a3099, #5074e2);
        }

    .pricing .row:last-child .container .col:first-child:hover {
        border-left: none;
    }

    .pricing .row:nth-child(2) .col:hover {
        border-right: none;
    }

    .pricing .row:nth-child(2) .col:hover {
        border-right: none;
    }

    .pricing .col:hover .pricing-title h3,
    .pricing .col:hover .pricing-title p,
    .pricing .col:hover .pricing-details a,
    .pricing .col:hover .pricing-title span {
        color: #fff;
    }



/*--------------------------------------------------------------
#1.13	home-video-section
--------------------------------------------------------------*/
#home-video-section {
    background: url(../images/home/video-bg.jpg) no-repeat 0 0;
    background-size: cover;
    text-align: center;
    color: #fff;
    height: 600px;
    overflow: hidden;
}

    #home-video-section .col {
        position: relative;
        top: 60%;
    }

    #home-video-section .name {
        display: block !important;
        text-transform: uppercase;
        font-weight: bold;
        margin-top: 50px;
    }

    #home-video-section h2 {
        font-size: 36px;
        color: #fff;
        line-height: 50px;
        padding: 0 15px;
    }

        #home-video-section h2:after {
            display: none;
        }

    #home-video-section .name {
        position: relative;
        z-index: 5;
    }

    #home-video-section a {
        position: absolute;
        top: -10%;
    }




/*--------------------------------------------------------------
#1.14	become-a-part-common
--------------------------------------------------------------*/
.become-a-part-common {
    background-color: #4285f4;
    padding: 70px 0;
    overflow: hidden;
}

    .become-a-part-common p {
        font-size: 28px;
        font-weight: lighter;
        color: #fff;
    }

    .become-a-part-common a {
        background-color: transparent;
        color: #fff;
        font-weight: 600;
        line-height: 54px;
        padding: 0 75px;
    }



/*--------------------------------------------------------------
#1.15	why-choose-us
--------------------------------------------------------------*/
.why-choose-us {
    overflow: hidden;
}

    .why-choose-us .section-heading {
        text-align: left;
    }

        .why-choose-us .section-heading h2:after {
            left: 50px;
        }

    .why-choose-us .col div {
        margin-bottom: 40px;
    }

    .why-choose-us .col h3 {
        position: relative;
        left: 40px;
    }

    .why-choose-us h3 span {
        width: 30px;
        height: 32px;
        display: inline-block;
        position: absolute;
        left: -40px;
    }

    .why-choose-us .easy-customize span {
        background: url(../images/home/choose-us/customize.png) no-repeat;
    }

    .why-choose-us .shopping span {
        background: url(../images/home/choose-us/cart.png) no-repeat;
    }

    .why-choose-us .vector span {
        background: url(../images/home/choose-us/vector.png) no-repeat;
    }

    .why-choose-us .learn-more {
        font-size: 18px;
        font-weight: 600;
        color: #4285f4;
    }


    /*circle area*/
    .why-choose-us .circle {
        text-align: center;
        margin-top: 70px;
        position: relative;
    }

    .why-choose-us .big-dotted-border:hover,
    .why-choose-us .big-dotted-border:hover ul li i {
        -webkit-animation-play-state: paused;
        -moz-animation-play-state: paused;
        -o-animation-play-state: paused;
        -ms-animation-play-state: paused;
        animation-play-state: paused;
    }

    .why-choose-us .big-dotted-border {
        width: 400px;
        height: 400px;
        margin: 0 auto;
        border: 2px dashed #8b8b8b;
        border-radius: 50%;
        position: relative;
        -webkit-animation: move-circle 15s linear infinite;
        -moz-animation: move-circle 15s linear infinite;
        -o-animation: move-circle 15s linear infinite;
        -ms-animation: move-circle 15s linear infinite;
        animation: move-circle 15s linear infinite;
    }

    .why-choose-us .middle-dotted-border {
        width: 320px;
        height: 320px;
        margin: 40px auto;
        border: 1px dashed #919191;
        border-radius: 50%;
    }

    .why-choose-us .small-dotted-border {
        width: 230px;
        height: 230px;
        margin: 45px auto;
        border: 1px dashed #919191;
        border-radius: 50%;
        -webkit-animation: move-anticlock 10s linear infinite;
        -moz-animation: move-anticlock 10s linear infinite;
        -o-animation: move-anticlock 10s linear infinite;
        -ms-animation: move-anticlock 10s linear infinite;
        animation: move-anticlock 10s linear infinite;
    }

    .why-choose-us .theme-logo {
        position: absolute;
        left: 50%;
        top: 50%;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }


    /*icons*/
    .why-choose-us .circle ul li {
        display: inline-block;
        position: absolute;
    }

        .why-choose-us .circle ul li a {
            background-color: #fff;
            display: inline-block;
            padding: 10px;
            border: 1px solid #8b8b8b;
            border-radius: 50%;
        }

        .why-choose-us .circle ul li i {
            background: -webkit-linear-gradient(left, #6061ce, #8645aa);
            background: -moz-linear-gradient(left, #6061ce, #8645aa);
            background: -o-linear-gradient(left, #6061ce, #8645aa);
            background: -ms-linear-gradient(left, #6061ce, #8645aa);
            background: linear-gradient(left, #6061ce, #8645aa);
            width: 60px;
            height: 60px;
            line-height: 60px;
            font-size: 22px;
            color: #fff;
            border-radius: 50%;
            -webkit-animation: move-circle-icon 15s linear infinite;
            -moz-animation: move-circle-icon 15s linear infinite;
            -o-animation: move-circle-icon 15s linear infinite;
            -ms-animation: move-circle-icon 15s linear infinite;
            animation: move-circle-icon 15s linear infinite;
        }

        .why-choose-us .circle ul li:first-child {
            left: -38px;
            top: 149px;
        }

        .why-choose-us .circle ul li:nth-child(2) {
            left: 160px;
            top: -45px;
        }

        .why-choose-us .circle ul li:nth-child(3) {
            right: -40px;
            top: 149px;
        }

        .why-choose-us .circle ul li:last-child {
            left: 160px;
            bottom: -45px;
        }

        .why-choose-us .circle ul li a:hover i {
            background: #4285f4;
        }

@-webkit-keyframes move-circle {
    form {
        -webkit-transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes move-circle {
    form {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

@-webkit-keyframes move-circle-icon {
    form {
        -webkit-transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(-360deg);
    }
}

@keyframes move-circle-icon {
    form {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(-360deg);
    }
}

@-webkit-keyframes move-anticlock {
    form {
        -webkit-transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(-360deg);
    }
}

@keyframes move-anticlock {
    form {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(-360deg);
    }
}





/*--------------------------------------------------------------
#1.16	tweets
--------------------------------------------------------------*/
.tweets {
    background: url(../images/home/tweets.jpg) no-repeat;
    width: 100%;
    height: 800px;
    background-size: cover;
    text-align: center;
    color: #fff;
    position: relative;
    overflow: hidden;
}

    .tweets .overlay {
        background: -webkit-linear-gradient(top, rgba(143,39,143, 0.7), rgba(66,133,244, 0.7));
        background: -moz-linear-gradient(top, rgba(143,39,143, 0.7), rgba(66,133,244, 0.7));
        background: -o-linear-gradient(top, rgba(143,39,143, 0.7), rgba(66,133,244, 0.7));
        background: -ms-linear-gradient(top, rgba(143,39,143, 0.7), rgba(66,133,244, 0.7));
        background: linear-gradient(top, rgba(143,39,143, 0.7), rgba(66,133,244, 0.7));
        z-index: 1;
    }

    .tweets .container {
        position: absolute;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        z-index: 5;
    }

    .tweets i {
        font-size: 72px;
        color: #fff;
    }

    .tweets .col p {
        font-size: 30px;
        font-weight: lighter;
        line-height: 50px;
        color: #fff;
        padding: 0 10%;
        margin: 70px 0 100px;
    }

    .tweets .tweet-preson span {
        display: block;
    }

        .tweets .tweet-preson span:first-child {
            font-size: 14px;
            font-weight: 600;
            text-transform: uppercase;
            padding-bottom: 10px;
        }

        .tweets .tweet-preson span:last-child {
            font-weight: lighter;
        }

    .tweets .owl-controls {
        margin-top: 20px;
    }

    .tweets .owl-pagination .owl-page span {
        background-color: #a1b9c8;
        opacity: 1;
    }

    .tweets .owl-pagination .active span {
        background-color: #fff;
    }



/*--------------------------------------------------------------
#1.17	our-blog 
--------------------------------------------------------------*/
.our-blog {
    overflow: hidden;
    position: relative;
}

    .our-blog .col > div {
        position: relative;
        margin-bottom: 30px;
        overflow: hidden;
    }

    .our-blog .col .overlay {
        background-color: rgba(38,44,57, 0.7);
    }

    .our-blog .col .content {
        width: 100%;
        height: auto;
        padding: 0 25px;
        position: absolute;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
    }

    .our-blog .col a {
        color: #fff;
    }

    .our-blog .col h3 a {
        font-size: 20px;
        line-height: 32px;
        text-transform: none;
    }

    .our-blog .content div a {
        display: inline-block;
        text-transform: capitalize;
    }

        .our-blog .content div a:last-child {
            margin-left: 30px;
            position: relative;
        }

            .our-blog .content div a:last-child:before {
                content: "/";
                position: absolute;
                left: -15px;
                top: 0;
            }

    .our-blog .latest-article {
        font-size: 18px;
        font-weight: 600;
        text-align: center;
        display: inline-block;
        position: absolute;
        bottom: 40px;
        left: 50%;
        -webkit-transform: translate(-50%);
        transform: translate(-50%);
    }

    /*hover effect*/
    .our-blog .col > div:hover .overlay {
        background: -webkit-linear-gradient(top, rgba(144,38,141, 0.8), rgba(66,133,244, 0.8));
        background: -moz-linear-gradient(top, rgba(144,38,141, 0.8), rgba(66,133,244, 0.8));
        background: -o-linear-gradient(top, rgba(144,38,141, 0.8), rgba(66,133,244, 0.8));
        background: -ms-linear-gradient(top, rgba(144,38,141, 0.8), rgba(66,133,244, 0.8));
        background: linear-gradient(top, rgba(144,38,141, 0.8), rgba(66,133,244, 0.8));
    }



/*--------------------------------------------------------------
#1.18	contact
--------------------------------------------------------------*/
.contact {
    text-align: center;
    position: relative;
    overflow: hidden;
}

.contact .section-heading p {
    color: #C5C5C5 !important;
}

.contact .row:first-child {
    position: relative;
    z-index: 2;
}

.contact .section-heading h2 {
    color: #fff;
}

.contact .overlay {
    background-color: rgba(20,23,29, .9);
}

.contact .container {
    position: relative;
    z-index: 2;
}

.contact .form-group {
    margin-bottom: 35px;
}

.contact .container form input,
.contact .container form select {
    background-color: transparent;
    width: 80%;
    height: 50px;
    display: inline-block;
    border: 1px solid #707275;
}

.contact .container form input {
    color: #fff;
}

.contact .container form select {
    color: #999999;
}

.contact .container form input[type="submit"] {
    background: -webkit-linear-gradient(top, #8a3099, #5074e2);
    background: -moz-linear-gradient(top, #8a3099, #5074e2);
    background: -o-linear-gradient(top, #8a3099, #5074e2);
    background: -ms-linear-gradient(top, #8a3099, #5074e2);
    background: linear-gradient(top, #8a3099, #5074e2);
    color: #fff;
    border: none;
}

.contact .submit {
    position: relative;
}

    .contact .submit i {
        position: absolute;
        color: #fff;
        left: 35%;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
    }

.contact .container form input[type="submit"]:hover {
    background: -webkit-linear-gradient(top, #5074e2, #8a3099);
    background: -moz-linear-gradient(top, #5074e2, #8a3099);
    background: -o-linear-gradient(top, #5074e2, #8a3099);
    background: -ms-linear-gradient(top, #5074e2, #8a3099);
    background: linear-gradient(top, #5074e2, #8a3099);
}

/*--------------------------------------------------------------
#1.19	footer
--------------------------------------------------------------*/
footer {
    overflow: hidden;
    background-image: linear-gradient(to right, #fc8500 50%, #575757 50%);
}

footer .row {
    padding: 0 !important;
    display: flex;
}

footer ul {
    margin: 0;
    padding: 0;
}

footer ul li {
    list-style: none;
    line-height: 1.75;
    font-size: 18px;
}

footer ul li a {
    color: #fff;
    color: #fff;
}

footer ul li a:hover {
    text-decoration: none;
    color: #fb8500;
}

footer h3 {
    color: #fff;
    font-family: 'Oduda-Bold';
}

footer p {
    color: #999999;
    margin-top: 0;
    margin-bottom: 16px;
}

/*first row*/
footer .row:first-child {
    padding: 5px 0;
}

footer .theme-logo {
    text-align: center;
    margin-top: 0px;
}

footer .theme-logo img {
    display: inline-block;
    /*margin: 0 auto;*/
    width: 90%;
}

footer a {
    color: #cecece;
    font-weight: 300;
}
/*copyright info*/
footer .copyright {
    background-color: #242427;
    padding: 16px 0;
    border-top: 1px solid #8a8a8a;
}

footer .copyright p {
    margin: 0;
}

footer .copyright ul {
    float: right;
}

footer .copyright ul li {
    display: inline-block;
    margin-left: 15px;
}

footer .copyright ul li:first-child {
    margin-left: 0;
}

footer .copyright ul li a {
    font-size: 16px;
    color: #999999;
}

footer .copyright ul li a:hover {
    color: #fff;
}

.bg-facebook {
    background-color: #4263b2
}

.bg-twitter {
    background-color: #4c9cd9;
}

.bg-linkedin {
    background-color: #015a86;
}

.bg-youtube {
    background-color: #e22112;
}

.bg-instagram {
    background-color: #6a453b;
}

ul.social-buttons li a:active, ul.social-buttons li a:focus, ul.social-buttons li a:hover {
    background-color: #212529;
}

.bg-white {
    background-color: #fff;
}

/*=========================================================
2.	about-us
=========================================================*/

/*--------------------------------------------------------------
#2.2	about-section-video
--------------------------------------------------------------*/
#about-section-video {
    background: url(../images/about-us/video-bg.jpg) no-repeat;
    background-size: cover;
    height: 800px;
}



/*--------------------------------------------------------------
#2.3	testimonials
--------------------------------------------------------------*/
#about-us .testimonials {
    background: url(../images/about-us/testimonial-bg.jpg) no-repeat;
}

    #about-us .testimonials .overlay {
        background: -webkit-linear-gradient(top, rgba(144,38,141, 0.6), rgba(66,133,244, 0.6));
        background: -moz-linear-gradient(top, rgba(144,38,141, 0.6), rgba(66,133,244, 0.6));
        background: -o-linear-gradient(top, rgba(144,38,141, 0.6), rgba(66,133,244, 0.6));
        background: -ms-linear-gradient(top, rgba(144,38,141, 0.6), rgba(66,133,244, 0.6));
        background: linear-gradient(top, rgba(144,38,141, 0.6), rgba(66,133,244, 0.6));
    }

    #about-us .testimonials .owl-page span {
        background-color: #fff;
    }


/*--------------------------------------------------------------
#2.4	partners
--------------------------------------------------------------*/
#about-us .partners {
    background-image: none;
    padding-bottom: 100px;
}



/*=========================================================
3.	services
=========================================================*/

/*--------------------------------------------------------------
#3.1	wp
--------------------------------------------------------------*/
#services .wp {
    background-color: #f6f7f8;
    position: relative;
    overflow: hidden;
    padding: 200px 0;
}

    #services .wp h2 {
        margin: 0 0 60px;
        display: inline-block;
    }

        #services .wp h2:after {
            position: static;
            position: absolute;
            left: 100%;
            -webkit-transform: translate(-120%);
            transform: translate(-120%);
        }

    #services .wp .row .col:first-child {
        text-align: right;
    }

        #services .wp .row .col:first-child a {
            background: -webkit-linear-gradient(top, #8a3099, #5074e2);
            background: -moz-linear-gradient(top, #8a3099, #5074e2);
            background: -o-linear-gradient(top, #8a3099, #5074e2);
            background: -ms-linear-gradient(top, #8a3099, #5074e2);
            background: linear-gradient(top, #8a3099, #5074e2);
            color: #fff;
            padding: 17px 70px;
            margin-top: 15px;
            font-weight: 600;
        }

            #services .wp .row .col:first-child a i {
                display: inline-block;
                font-size: 18px;
                padding-right: 10px;
            }

    #services .wp .iphone {
        position: absolute;
        right: 0;
        bottom: 0;
    }

    /*hover effect*/
    #services .wp .row .col:first-child a:hover {
        background: -webkit-linear-gradient(top, #5074e2, #8a3099);
        background: -moz-linear-gradient(top, #5074e2, #8a3099);
        background: -o-linear-gradient(top, #5074e2, #8a3099);
        background: -ms-linear-gradient(top, #5074e2, #8a3099);
        background: linear-gradient(top, #5074e2, #8a3099);
    }



/*--------------------------------------------------------------
#3.2	web
--------------------------------------------------------------*/
#services .web {
    overflow: hidden;
}

    #services .web .row .col:first-child {
        padding-top: 50px;
    }

    #services .web h2 {
        display: inline-block;
        margin-bottom: 60px;
    }

        #services .web h2:after {
            left: 65px;
        }

    #services .web ul {
        margin-top: 20px;
    }

    #services .web li {
        margin-bottom: 20px;
        padding-left: 20px;
        position: relative;
    }

    #services .web ul li:last-child {
        margin-bottom: 0;
    }

    #services .web li:before {
        content: ">";
        position: absolute;
        left: 0;
    }



/*--------------------------------------------------------------
#3.3	best-services
--------------------------------------------------------------*/
#services .best-services {
    position: relative;
    text-align: center;
    overflow: hidden;
}

    #services .best-services .container .col {
        padding: 0;
    }

        #services .best-services .container .col div {
            min-height: 398px;
            border-top: 1px solid #f1f0f0;
            border-left: 1px solid #f1f0f0;
            padding: 75px 70px;
        }

            #services .best-services .container .col div:last-child {
                border-bottom: 1px solid #f1f0f0;
            }

    #services .best-services .container .row .col:last-child div {
        border-right: 1px solid #f1f0f0;
    }

    #services .best-services h3 {
        margin-top: 50px;
    }

    #services .best-services .container p {
        margin-bottom: 15px;
    }

    #services .best-services .container a {
        position: relative;
    }

        #services .best-services .container a:before {
            content: ">";
            position: absolute;
            left: -15px;
        }

    /*hover effect*/
    #services .best-services .container .col div:hover {
        box-shadow: 0 0 0 2px #f1f1f1;
    }



/*=========================================================
4.	portfolio
=========================================================*/

/*--------------------------------------------------------------
#4.1	projects
--------------------------------------------------------------*/
#portfolio .projects {
    overflow: hidden;
    margin-top: -82px;
}

    #portfolio .projects > .row {
        position: relative;
        left: 50% !important;
        -webkit-transform: translate(-50%);
        transform: translate(-50%);
    }

#portfolio #shuffle-wrapper .col {
    width: 25% !important;
}

#portfolio #shuffle-wrapper img {
    width: 100%;
}

#portfolio .projects ul {
    background-color: rgba(0,0,0, 0.5);
    text-align: center;
    border-top: 1px solid #3d4e70;
    border-bottom: 1px solid #3d4e70;
    position: relative;
    z-index: 5;
}

    #portfolio .projects ul li {
        display: inline-block;
    }

        #portfolio .projects ul li a {
            display: block;
            color: #fff;
            text-transform: none;
            padding: 30px 20px;
            position: relative;
        }

            /*hover effect*/
            #portfolio .projects ul li a:hover,
            #portfolio .projects ul li a.active {
                background-color: rgba(0,0,0, 0.6) !important;
            }



/*=========================================================
5.	portfolio-details
=========================================================*/

/*--------------------------------------------------------------
#5.1	portfolio-details-portfolio
--------------------------------------------------------------*/
#portfolio-details .portfolio-details-portfolio {
    padding: 0 0 90px;
}

    #portfolio-details .portfolio-details-portfolio .col {
        margin-bottom: 30px;
    }

        #portfolio-details .portfolio-details-portfolio .col > div {
            overflow: hidden;
        }

        #portfolio-details .portfolio-details-portfolio .col img {
            width: 100%;
        }

    #portfolio-details .portfolio-details-portfolio .description h3 {
        color: #333333;
    }

    #portfolio-details .portfolio-details-portfolio .description p {
        color: #575757;
    }

    #portfolio-details .portfolio-details-portfolio ul {
        margin-top: 60px;
    }

        #portfolio-details .portfolio-details-portfolio ul li {
            display: inline-block;
            margin-bottom: 10px;
        }

            #portfolio-details .portfolio-details-portfolio ul li a {
                background-color: #2164b6;
                display: block;
                width: 130px;
                height: 40px;
                font-size: 16px;
                line-height: 40px;
                color: #fff;
                border-radius: 2px;
                text-align: center;
                opacity: 0.9;
            }

            #portfolio-details .portfolio-details-portfolio ul li:nth-child(2) a {
                background-color: #2a8fdd;
            }

            #portfolio-details .portfolio-details-portfolio ul li:nth-child(3) a {
                background-color: #43d0fe;
            }

            #portfolio-details .portfolio-details-portfolio ul li:nth-child(4) a {
                background-color: #df5643;
            }

            #portfolio-details .portfolio-details-portfolio ul li:nth-child(5) a {
                background-color: #484540;
            }

            #portfolio-details .portfolio-details-portfolio ul li:nth-child(6) a {
                background-color: #ee4c66;
            }

            #portfolio-details .portfolio-details-portfolio ul li:nth-child(7) a {
                background-color: #3b9dc2;
            }

            #portfolio-details .portfolio-details-portfolio ul li:nth-child(8) a {
                background-color: #547885;
            }

            /*hover effect*/
            #portfolio-details .portfolio-details-portfolio ul li a:hover {
                opacity: 1;
            }



/*--------------------------------------------------------------
#5.2	tweets
--------------------------------------------------------------*/
#portfolio-details .tweets {
    background-image: url(../images/portfolio-details/tweets-bg.jpg);
    width: 100%;
}



/*--------------------------------------------------------------
#5.3	may-also-like
--------------------------------------------------------------*/
#portfolio-details .may-also-like {
    overflow: hidden;
    position: relative;
    padding-bottom: 0;
}

    #portfolio-details .may-also-like .owl-prev,
    #portfolio-details .may-also-like .owl-next {
        background-color: rgba(0,0,0, 0.4);
        width: 55px;
        height: 55px;
        line-height: 55px;
        font-size: 18px;
        border-radius: 0 4px 4px 0;
        opacity: 1;
        position: absolute;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
    }

    #portfolio-details .may-also-like .owl-prev {
        left: 0;
    }

    #portfolio-details .may-also-like .owl-next {
        right: 0;
    }



/*--------------------------------------------------------------
#5.4	work-together
--------------------------------------------------------------*/
#portfolio-details .work-together {
    padding: 230px 0 130px;
    margin-top: -10px;
    position: relative;
    overflow: hidden;
}

    #portfolio-details .work-together .overlay {
        background-color: rgba(0,0,0, 0.7);
    }

    #portfolio-details .work-together h2,
    #portfolio-details .work-together p {
        color: #fff !important;
    }

    #portfolio-details .work-together a {
        background: -webkit-linear-gradient(top, #8a3099, #5074e2);
        background: -moz-linear-gradient(top, #8a3099, #5074e2);
        background: -o-linear-gradient(top, #8a3099, #5074e2);
        background: -ms-linear-gradient(top, #8a3099, #5074e2);
        background: linear-gradient(top, #8a3099, #5074e2);
        display: inline-block;
        color: #fff;
        font-weight: 600;
        line-height: 55px;
        padding: 0 55px;
        margin-top: 30px;
        border: 0;
    }

        #portfolio-details .work-together a:hover {
            background: -webkit-linear-gradient(top, #5074e2, #8a3099);
            background: -moz-linear-gradient(top, #5074e2, #8a3099);
            background: -o-linear-gradient(top, #5074e2, #8a3099);
            background: -ms-linear-gradient(top, #5074e2, #8a3099);
            background: linear-gradient(top, #5074e2, #8a3099);
        }



/*=========================================================
6.	contact page
=========================================================*/

/*--------------------------------------------------------------
#6.1	contact
--------------------------------------------------------------*/
#contact-page .contact {
    background-image: none;
}

    #contact-page .contact h2 {
        color: #333;
    }

    #contact-page .contact .form-group {
        margin-bottom: 20px;
    }


    #contact-page .contact .container form input,
    #contact-page .contact .container form select,
    #contact-page .contact .container form textarea {
        background-color: transparent;
        width: 60%;
        color: #333;
        border: 1px solid #e8e8e8;
    }

    #contact-page .contact .container form textarea {
        padding: 15px;
        height: 200px;
    }

    #contact-page .contact form input[type="submit"] {
        color: #fff;
        text-transform: uppercase;
        border: none;
    }

#contact-page .submit i {
    left: 42%;
}



/*=========================================================
7.	blog
=========================================================*/

/*--------------------------------------------------------------
#7.1	blog-main-content
--------------------------------------------------------------*/
#blog .blog-main-content {
    background: -webkit-linear-gradient(left, #f7f7f7 50%, #1f252f 50.1%);
    background: -moz-linear-gradient(left, #f7f7f7 50%, #1f252f 50.1%);
    background: -o-linear-gradient(left, #f7f7f7 50%, #1f252f 50.1%);
    background: -ms-linear-gradient(left, #f7f7f7 50%, #1f252f 50.1%);
    background: linear-gradient(left, #f7f7f7 50%, #1f252f 50.1%);
}



/*--------------------------------------------------------------
#7.2	slidebar
--------------------------------------------------------------*/
/*sidebar*/
#blog input:focus,
#blog-details:focus {
    border-color: #e8e8e8 !important;
}

#blog .blog-main-content .sidebar,
#blog-details .blog-main-content .sidebar {
    background-color: #f7f7f7;
    padding: 30px 40px 0 15px;
}

    #blog .blog-main-content .sidebar .slidebar-item {
        margin-bottom: 70px;
    }

        #blog .blog-main-content .sidebar .slidebar-item:last-child,
        #blog-details .blog-main-content .sidebar .slidebar-item:last-child {
            margin-bottom: 0;
        }

    #blog .blog-main-content .sidebar h3,
    #blog-details .blog-main-content .sidebar h3 {
        margin-top: 0;
        font-size: 15px;
        font-weight: bold;
        text-transform: uppercase;
        margin-bottom: 30px;
    }

    /*search*/
    #blog .blog-main-content .sidebar .search,
    #blog-details .blog-main-content .sidebar .search {
        position: relative;
    }

        #blog .blog-main-content .sidebar .search span,
        #blog-details .blog-main-content .sidebar .search span {
            display: inline-block;
            height: 100%;
            position: absolute;
            left: 30px;
            top: 0;
        }

        #blog .blog-main-content .sidebar .search input[type="submit"],
        #blog-details .blog-main-content .sidebar .search input[type="submit"] {
            background-color: transparent;
            display: inline-block;
            height: 100%;
            border: none;
        }

        #blog .blog-main-content .sidebar .search i,
        #blog-details .blog-main-content .sidebar .search i {
            position: absolute;
            top: 50%;
            left: 50%;
            -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
        }

        #blog .blog-main-content .sidebar .search input[type="text"],
        #blog-details .blog-main-content .sidebar .search input[type="text"] {
            height: 50px;
            padding: 0 10px 0 60px;
            border-radius: 0;
        }

/*popular-post-widget*/
#blog .popular-post-widget h4,
#blog-details .popular-post-widget h4 {
    font-size: 14px;
    font-weight: 600;
    margin-top: 0;
    line-height: 22px;
}

    #blog .popular-post-widget h4 a,
    #blog-details .popular-post-widget h4 a {
        text-transform: none;
        color: #333333;
    }

#blog .popular-post-widget .post,
#blog-details .popular-post-widget .post {
    margin-bottom: 20px;
    margin-left: 0;
    margin-right: 0;
}

    #blog .popular-post-widget .post .col:first-child,
    #blog-details .popular-post-widget .post .col:first-child {
        padding: 0;
    }

    #blog .popular-post-widget .post a,
    #blog-details .popular-post-widget .post a {
        display: block;
        position: relative;
    }

    #blog .popular-post-widget .post img,
    #blog-details .popular-post-widget .post img {
        width: 100%;
    }

    #blog .popular-post-widget .post .col:first-child a:before,
    #blog-details .popular-post-widget .post .col:first-child a:before {
        background: -webkit-linear-gradient(top, rgba(144,38,141, 0.6), rgba(66,133,244, 0.6));
        background: -moz-linear-gradient(top, rgba(144,38,141, 0.6), rgba(66,133,244, 0.6));
        background: -o-linear-gradient(top, rgba(144,38,141, 0.6), rgba(66,133,244, 0.6));
        background: -ms-linear-gradient(top, rgba(144,38,141, 0.6), rgba(66,133,244, 0.6));
        background: linear-gradient(top, rgba(144,38,141, 0.6), rgba(66,133,244, 0.6));
        content: "";
        display: block;
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 5;
        display: none;
    }

    /*hover effect*/
    #blog .popular-post-widget .post .col:first-child a:hover:before,
    #blog-details .popular-post-widget .post .col:first-child a:hover:before {
        display: block;
    }

#blog .popular-post-widget h4 a:hover,
#blog-details .popular-post-widget h4 a:hover {
    color: #4285f4 !important;
}

/*tags-widget*/
#blog .tags-widget .col,
#blog-details .tags-widget .col {
    padding-left: 15px;
}

#blog .tags-widget ul li,
#blog-details .tags-widget ul li {
    display: inline-block;
    margin-right: 10px;
    margin-bottom: 10px;
}

    #blog .tags-widget ul li a,
    #blog-details .tags-widget ul li a {
        color: #999999;
        border-radius: 0;
        padding: 10px 20px;
        text-transform: none;
    }

        #blog .tags-widget ul li a:hover,
        #blog-details .tags-widget ul li a:hover {
            background-color: #fff !important;
            color: #333333;
        }

/*newsletter*/
#blog .sidebar .newsletter input,
#blog-details .sidebar .newsletter input {
    width: 100%;
    height: 50px;
    display: block;
    outline: none;
    box-shadow: none;
    border: 1px solid #e8e8e8;
    border-radius: 0;
    padding: 0 20px;
}

    #blog .sidebar .newsletter input[type="submit"],
    #blog-details .sidebar .newsletter input[type="submit"] {
        background: -webkit-linear-gradient(top, #8a3099, #5074e2);
        background: -moz-linear-gradient(top, #8a3099, #5074e2);
        background: -o-linear-gradient(top, #8a3099, #5074e2);
        background: -ms-linear-gradient(top, #8a3099, #5074e2);
        background: linear-gradient(top, #8a3099, #5074e2);
        color: #fff;
        font-weight: 600;
        border: 0;
        padding: 17px 20px;
        text-transform: uppercase;
    }

        #blog .sidebar .newsletter input[type="submit"]:hover,
        #blog-details .sidebar .newsletter input[type="submit"]:hover {
            background: -webkit-linear-gradient(top, #5074e2, #8a3099);
            background: -moz-linear-gradient(top, #5074e2, #8a3099);
            background: -o-linear-gradient(top, #5074e2, #8a3099);
            background: -ms-linear-gradient(top, #5074e2, #8a3099);
            background: linear-gradient(top, #5074e2, #8a3099);
        }

#blog .sidebar .newsletter p,
#blog-details .sidebar .newsletter p {
    text-align: center;
}

/*featured-projects*/
#blog .sidebar .featured-projects .col,
#blog-details .sidebar .featured-projects .col {
    padding: 10px;
}

    #blog .sidebar .featured-projects .col a,
    #blog-details .sidebar .featured-projects .col a {
        display: block;
    }

    #blog .sidebar .featured-projects .col img,
    #blog-details .sidebar .featured-projects .col img {
        width: 100%;
        display: block;
    }

/*category-widget*/
#blog .category-widget ul li,
#blog .archive-widget ul li {
    border-bottom: 1px solid #ebebeb;
}

    #blog .category-widget ul li a,
    #blog .archive-widget ul li a {
        display: block;
        color: #333333;
        text-transform: none;
        padding: 18px 0;
    }

#blog .category-widget .row,
#blog .archive-widget .row {
    padding-left: 15px;
}

#blog .category-widget ul li a:hover,
#blog .archive-widget ul li a:hover {
    color: #000;
    font-weight: 600;
}



/*--------------------------------------------------------------
#7.3	blog-postes
--------------------------------------------------------------*/
/*blog-postes */
#blog .blog-postes {
    padding: 100px 0 100px 95px;
}

    #blog .blog-postes .post {
        padding-bottom: 60px;
        border-bottom: 1px solid #ebebeb;
        margin-bottom: 55px;
    }

        #blog .blog-postes .post:last-child {
            border: none;
            margin-bottom: 0;
        }


    /*info*/
    #blog .blog-postes .info,
    #blog-details .info {
        overflow: hidden;
        margin-bottom: 30px;
    }

        #blog .blog-postes .info .name-title,
        #blog-details .info .name-title {
            float: left;
        }

            #blog .blog-postes .info .name-title .name,
            #blog-details .info .name-title .name {
                font-size: 16px;
                font-weight: 600;
            }

            #blog .blog-postes .info .name-title div,
            #blog-details .info .name-title div {
                float: right;
                color: #fff;
                padding-left: 15px;
            }

                #blog .blog-postes .info .name-title div span,
                #blog-details .info .name-title div span {
                    display: block;
                }

            #blog .blog-postes .info .name-title .time,
            #blog-details .info .name-title .time {
                color: #999999;
                margin-top: 5px;
            }

            #blog .blog-postes .info .name-title p,
            #blog-details .info .name-title p {
                margin-bottom: 0;
            }

        #blog .blog-postes .info .tag,
        #blog-details .info .replay-button {
            float: right;
        }

            #blog .blog-postes .info .tag a,
            #blog-details .info .tag a {
                background-color: #f6f7f8;
                color: #999999;
                text-transform: none;
                border-radius: 0;
            }



    /*description*/
    #blog .blog-postes .description > div {
        position: relative;
    }

        #blog .blog-postes .description > div a {
            background-color: rgba(0,0,0, 0.4);
            display: inline-block;
            color: #fff;
            font-size: 18px;
            width: 70px;
            height: 70px;
            border-radius: 50%;
            position: absolute;
            left: 50%;
            top: 50%;
            -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
        }

            #blog .blog-postes .description > div a i {
                position: absolute;
                left: 50%;
                top: 50%;
                -webkit-transform: translate(-50%, -50%);
                transform: translate(-50%, -50%);
            }

    #blog .blog-postes .description .overlay {
        background: -webkit-linear-gradient(top, rgba(144,38,141, 0.6), rgba(66,133,244, 0.6));
        background: -moz-linear-gradient(top, rgba(144,38,141, 0.6), rgba(66,133,244, 0.6));
        background: -o-linear-gradient(top, rgba(144,38,141, 0.6), rgba(66,133,244, 0.6));
        background: -ms-linear-gradient(top, rgba(144,38,141, 0.6), rgba(66,133,244, 0.6));
        background: linear-gradient(top, rgba(144,38,141, 0.6), rgba(66,133,244, 0.6));
    }

    #blog .blog-postes .description h3 {
        font-size: 30px;
        color: #fff;
        font-weight: lighter;
        line-height: 50px;
        margin: 40px 0 15px;
    }

    #blog .blog-postes .description p {
        color: #999;
        margin-bottom: 35px;
    }

    #blog .blog-postes .description ul li {
        display: inline-block;
        padding-right: 10px;
    }

        #blog .blog-postes .description ul li:after {
            content: "|";
            color: #999999;
        }

        #blog .blog-postes .description ul li:last-child:after {
            content: "";
        }

        #blog .blog-postes .description ul li a {
            text-transform: none;
            color: #999999;
            padding-right: 10px;
        }

            #blog .blog-postes .description ul li a:hover {
                color: #4285f4;
            }

    #blog .blog-postes blockquote {
        background-color: #4285f4;
        border-left: 0;
        padding: 80px 60px;
        color: #fff;
        font-weight: lighter;
        font-size: 30px;
        line-height: 50px;
        font-style: italic;
    }

#blog .blog-main-content .blog-postes {
    background-color: #1f252f;
}


/*post-pagination*/
#blog .pagination {
    margin-bottom: 0;
}

    #blog .pagination a {
        color: #999999;
        border-radius: 3px;
    }

    #blog .pagination .active a {
        color: #fff;
        font-weight: 600;
    }

    #blog .pagination li {
        display: inline-block;
        margin-right: 10px;
    }

        #blog .pagination li:last-child {
            margin-right: 0;
        }



/*=========================================================
8.	blog-details
=========================================================*/

/*--------------------------------------------------------------
#8.1	blog-header
--------------------------------------------------------------*/
#blog-details .blog-header-slider .slider > div {
    position: relative;
}

#blog-details .blog-header-slider .overlay + img {
    width: 100%;
}

#blog-details .blog-header-slider .container {
    width: 100%;
    text-align: center;
    color: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 10;
}

    #blog-details .blog-header-slider .container h2 {
        font-size: 56px;
        color: #fff;
        line-height: 90px;
    }

    #blog-details .blog-header-slider .container img {
        display: block;
        margin: 60px auto 30px;
    }

    #blog-details .blog-header-slider .container span {
        display: block;
    }

    #blog-details .blog-header-slider .container .name {
        font-size: 20px;
        font-weight: 600;
        margin-bottom: 10px;
    }

#blog-details .blog-header-slider .slider .owl-controls {
    position: absolute;
    z-index: 12;
    bottom: 7%;
    right: 15%;
}

    #blog-details .blog-header-slider .slider .owl-controls span {
        background-color: #fff;
    }

#blog-details .blog-main-content {
    background: -webkit-linear-gradient(left, #fff 70%, #1f252f 70.1%);
    background: -moz-linear-gradient(left, #fff 70%, #1f252f 70.1%);
    background: -ms-linear-gradient(left, #fff 70%, #1f252f 70.1%);
    background: -o-linear-gradient(left, #fff 70%, #1f252f 70.1%);
    background: linear-gradient(left, #fff 70%, #1f252f 70.1%);
}



    /*--------------------------------------------------------------
#8.2	sidebar
--------------------------------------------------------------*/
    #blog-details .blog-main-content .sidebar {
        background-color: #1f252f;
    }

#blog-details .sidebar .slidebar-item {
    margin-bottom: 70px;
}

#blog-details .blog-main-content .sidebar h3,
#blog-details .blog-main-content .sidebar h4 a {
    color: #fff;
}

#blog-details .blog-main-content .sidebar p {
    color: #bababa;
}

#blog-details .blog-main-content .sidebar .newsletter .row {
    padding-left: 15px;
}

#blog-details .blog-main-content .sidebar .featured-projects .row {
    padding-left: 10px;
}

/*recommend*/
#blog-details .recommend .col > div {
    position: relative;
}

#blog-details .recommend h4 {
    font-size: 14px;
    color: #fff;
    margin: 30px 0 10px;
}

#blog-details .recommend .col > div img {
    width: 100%;
    display: block;
}

#blog-details .recommend .overlay {
    background: -webkit-linear-gradient(top, rgba(144,38,141, 0.6), rgba(66,133,244, 0.6));
    background: -moz-linear-gradient(top, rgba(144,38,141, 0.6), rgba(66,133,244, 0.6));
    background: -o-linear-gradient(top, rgba(144,38,141, 0.6), rgba(66,133,244, 0.6));
    background: -ms-linear-gradient(top, rgba(144,38,141, 0.6), rgba(66,133,244, 0.6));
    background: linear-gradient(top, rgba(144,38,141, 0.6), rgba(66,133,244, 0.6));
}



/*--------------------------------------------------------------
#8.3	blog-postes
--------------------------------------------------------------*/
#blog-details .blog-postes {
    padding-top: 100px;
    padding-right: 50px;
}

    #blog-details .blog-postes .post h3 {
        font-size: 24px;
        margin-top: 50px;
    }

    #blog-details .blog-postes .post p {
        margin-bottom: 35px;
    }

    #blog-details .blog-postes .image {
        position: relative;
    }

        #blog-details .blog-postes .image .overlay {
            background: -webkit-linear-gradient(top, rgba(144,38,141, 0.6), rgba(66,133,244, 0.6));
            background: -moz-linear-gradient(top, rgba(144,38,141, 0.6), rgba(66,133,244, 0.6));
            background: -o-linear-gradient(top, rgba(144,38,141, 0.6), rgba(66,133,244, 0.6));
            background: -ms-linear-gradient(top, rgba(144,38,141, 0.6), rgba(66,133,244, 0.6));
            background: linear-gradient(top, rgba(144,38,141, 0.6), rgba(66,133,244, 0.6));
        }

    #blog-details .blog-postes blockquote {
        background-color: #f7f7f7;
        color: #999999;
        font-size: 24px;
        font-weight: lighter;
        font-style: italic;
        border-left: 0;
        padding: 45px;
    }

/*comments*/

#blog-details .info .name-title div {
    color: #333;
}

#blog-details .comments h3,
#blog-details .leave-comment h3 {
    font-size: 13px;
    color: #333;
    text-transform: uppercase;
    font-weight: bold;
    margin-bottom: 75px;
}

#blog-details .main-comment {
    border-bottom: 1px solid #ebebeb;
    padding-bottom: 40px;
    margin-top: 40px;
}

#blog-details .sub-comment {
    border-bottom: 1px solid #ebebeb;
    padding: 40px 0 40px;
    margin-left: 70px;
}

#blog-details .info .replay-button a {
    border-radius: 0;
}

    #blog-details .info .replay-button a:hover,
    #blog-details .leave-comment form .submit input:hover {
        background: -webkit-linear-gradient(top, #8a3099, #5074e2);
        background: -moz-linear-gradient(top, #8a3099, #5074e2);
        background: -o-linear-gradient(top, #8a3099, #5074e2);
        background: -ms-linear-gradient(top, #8a3099, #5074e2);
        background: linear-gradient(top, #8a3099, #5074e2);
        color: #fff;
    }

/*comment form*/
#blog-details .leave-comment {
    padding-bottom: 100px;
}

    #blog-details .leave-comment h3 {
        padding-top: 30px;
    }

    #blog-details .leave-comment form .col {
        padding-left: 0;
    }

        #blog-details .leave-comment form .col:nth-child(2) {
            padding-right: 0;
        }

    #blog-details .leave-comment form input,
    #blog-details .leave-comment form textarea {
        border: 1px solid #e8e8e8;
        border-radius: 0;
        height: 45px;
        box-shadow: none;
    }

    #blog-details .leave-comment form textarea {
        width: 100%;
        height: 200px;
        padding: 15px;
    }

    #blog-details .leave-comment form p {
        font-style: italic;
        color: #bababa;
    }

    #blog-details .leave-comment form .submit {
        padding-right: 0;
    }

        #blog-details .leave-comment form .submit input {
            padding: 0 82px;
            float: right;
            text-transform: uppercase;
            font-weight: bold;
        }

    #blog-details .leave-comment form input:focus,
    #blog-details .leave-comment form textarea:focus {
        outline: none;
        box-shadow: none;
    }



/*=========================================================
9.	404
=========================================================*/

/*--------------------------------------------------------------
#9.2	content-404
--------------------------------------------------------------*/
#error-404 header {
    overflow: visible;
}



/*--------------------------------------------------------------
#9.2	content-404
--------------------------------------------------------------*/
#error-404 .content-404 {
    text-align: center;
    padding-top: 100px;
}

    #error-404 .content-404 h1 {
        color: #912790;
        background: -webkit-linear-gradient(#912790, #4384f3);
        background: -o-linear-gradient(#912790, #4384f3);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        font-size: 200px;
        position: relative;
    }

    #error-404 .content-404 .col div {
        background-color: #e7ebed;
        padding: 100px 0 0;
        margin-top: -95px;
    }

    #error-404 .content-404 p {
        font-size: 63px;
        font-weight: 600;
        color: #333;
        text-transform: uppercase;
        margin-bottom: 70px;
    }

    #error-404 .content-404 a {
        background: -webkit-linear-gradient(top, #8a3099, #5074e2);
        background: -moz-linear-gradient(top, #8a3099, #5074e2);
        background: -o-linear-gradient(top, #8a3099, #5074e2);
        background: -ms-linear-gradient(top, #8a3099, #5074e2);
        background: linear-gradient(top, #8a3099, #5074e2);
        display: inline-block;
        font-weight: 600;
        color: #fff;
        padding: 25px 70px;
    }

/*sidemenu*/
.nav-side-menu {
    overflow: auto;
    font-family: verdana;
    font-size: 12px;
    font-weight: 200;
    background-color: #2e353d;
    position: fixed;
    top: 0px;
    width: 300px;
    height: 100%;
    color: #e1ffff;
}

    .nav-side-menu .brand {
        background-color: #23282e;
        line-height: 50px;
        display: block;
        text-align: center;
        font-size: 14px;
    }

    .nav-side-menu .toggle-btn {
        display: none;
    }

    .nav-side-menu ul,
    .nav-side-menu li {
        list-style: none;
        padding: 0px;
        margin: 0px;
        line-height: 35px;
        cursor: pointer;
        /*    
    .collapsed{
       .arrow:before{
                 font-family: FontAwesome;
                 content: "\f053";
                 display: inline-block;
                 padding-left:10px;
                 padding-right: 10px;
                 vertical-align: middle;
                 float:right;
            }
     }
*/
    }

        .nav-side-menu ul :not(collapsed) .arrow:before,
        .nav-side-menu li :not(collapsed) .arrow:before {
            font-family: FontAwesome;
            content: "\f078";
            display: inline-block;
            padding-left: 10px;
            padding-right: 10px;
            vertical-align: middle;
            float: right;
        }

        .nav-side-menu ul .active,
        .nav-side-menu li .active {
            border-left: 3px solid #d19b3d;
            background-color: #4f5b69;
        }

        .nav-side-menu ul .sub-menu li.active,
        .nav-side-menu li .sub-menu li.active {
            color: #d19b3d;
        }

            .nav-side-menu ul .sub-menu li.active a,
            .nav-side-menu li .sub-menu li.active a {
                color: #d19b3d;
            }

        .nav-side-menu ul .sub-menu li,
        .nav-side-menu li .sub-menu li {
            background-color: #181c20;
            border: none;
            line-height: 28px;
            border-bottom: 1px solid #23282e;
            margin-left: 0px;
        }

            .nav-side-menu ul .sub-menu li:hover,
            .nav-side-menu li .sub-menu li:hover {
                background-color: #020203;
            }

            .nav-side-menu ul .sub-menu li:before,
            .nav-side-menu li .sub-menu li:before {
                font-family: FontAwesome;
                content: "\f105";
                display: inline-block;
                padding-left: 10px;
                padding-right: 10px;
                vertical-align: middle;
            }

    .nav-side-menu li {
        padding-left: 0px;
        border-left: 3px solid #2e353d;
        border-bottom: 1px solid #23282e;
    }

        .nav-side-menu li a {
            text-decoration: none;
            color: #e1ffff;
        }

            .nav-side-menu li a i {
                padding-left: 10px;
                width: 20px;
                padding-right: 20px;
            }

        .nav-side-menu li:hover {
            border-left: 3px solid #d19b3d;
            background-color: #4f5b69;
            -webkit-transition: all 1s ease;
            -moz-transition: all 1s ease;
            -o-transition: all 1s ease;
            -ms-transition: all 1s ease;
            transition: all 1s ease;
        }

.img-mobile, .hr-mobile {
    display: none;
}

.img-desktop, .img-desktop-kiri {
    display: block;
}

.input-group {
    width: 100%;
}

.paddingtop20 {
    padding-top: 20px;
}

.paddingtop30 {
    padding-top: 30px;
}

.paddingtop50 {
    padding-top: 50px;
}

.paddingtop100 {
    padding-top: 100px;
}

.paddingtop80 {
    padding-top: 80px;
}

.paddingtop80 p, .paddingtop50 p {
    margin-top: 0;
}

.paddingtop80 h1, .paddingtop50 h1 {
    padding-left: 30px;
}

.margin100 {
    margin-top: 240px !important;
}

.margin70 {
    margin-top: 70px !important;
}

.margin60 {
    margin-top: 60px;
}

.margin10 {
    margin-top: 10px;
}

.margin20 {
    margin-top: 20px;
}

.margin30 {
    margin-top: 30px;
}

.margin50 {
    margin: 50px 0;
}

.abupadding250 {
    margin-top: 250px !important;
    margin-bottom: 10px !important;
}

.abupadding150 {
    margin-top: 150px !important;
    margin-bottom: 10px !important;
}

.abupadding140 {
    margin-top: 140px !important;
    margin-bottom: 10px !important;
}

.abupadding100 {
    margin-top: 100px !important;
    margin-bottom: 15px !important;
}

.abupadding85 {
    margin-top: 85px !important;
    margin-bottom: 10px !important;
}

.abupadding75 {
    margin-top: 75px !important;
    margin-bottom: 10px !important;
}

.abupadding70 {
    margin-top: 70px !important;
    margin-bottom: 10px !important;
}

.abupadding65 {
    margin-top: 65px !important;
    margin-bottom: 10px !important;
}

.abupadding50 {
    margin-top: 50px !important;
    margin-bottom: 10px !important;
}

.abupadding25 {
    margin-top: 25px !important;
    margin-bottom: 10px !important;
}

.abupadding30 {
    margin-top: 30px !important;
    margin-bottom: 10px !important;
}

.abupadding35 {
    margin-top: 35px !important;
    margin-bottom: 10px !important;
}

.abupadding5 {
    margin-top: 5px !important;
    margin-bottom: 10px !important;
}

.privacy {
    height: 350px;
}

#content2 .privacy {
    height: 320px;
}

.cek {
    float: left;
    margin-top: 10px;
    margin-left: 30px;
}

.center-btn {
    width: 100%;
    margin: 0 auto;
    margin-bottom: 30px;
    text-align: center;
}

.maid .form-control { /*color:#f57e2a;font-size:1.5em;*/
}

.tomboladvisor .tombolnext {
    float: none;
}

.tombol.tomboladvisor {
    padding-right: 0;
}

#progressbarnew li {
    font-size: smaller;
}
/*endsidemenu*/

/*irpansetiana*/
#owl-demodua .item {
    padding: 0 48px 48px;
}

.a-gede h3 {
    font-size: 18px;
    color: #eb7d3d;
}

.sidr {
    display: block;
    position: fixed;
    top: 65px;
    height: 100%;
    z-index: 999999;
    width: 260px;
    overflow-x: hidden;
    overflow-y: auto;
    font-family: 'Oduda-Regular';
    font-size: 15px;
    background: #fff;
    color: #424242;
    box-shadow: none;
}
/*.sidr ul li a, .sidr ul li span {
    padding: 0 15px;
    display: block;
    text-decoration: none;
    color: #151515;
    text-align: right;
    font-size: 14px;
}
.sidr ul li {
    display: block;
    margin: 0;
    line-height: 48px;
    border-top: 1px solid #eb7d3d;
    border-bottom: 1px solid #eb7d3d;
}
.sidr ul li:hover>a, .sidr ul li:hover>span, .sidr ul li.active>a, .sidr ul li.active>span, .sidr ul li.sidr-class-active>a, .sidr ul li.sidr-class-active>span {
    box-shadow: none;
}
.sidr ul {
    display: block;
    margin: 0 0 15px;
    padding: 0;
    border-top: 1px solid #eb7d3d;
    border-bottom: 1px solid #eb7d3d;
}*/
ul.sub-menu {
    display: none;
}

a:focus, a:hover {
    color: #eb7d3d;
    text-decoration: underline;
}

.sec-1 li {
    padding-bottom: 10px;
}

.panel-body {
    padding: 10px;
}

#overview .panel-body {
    padding-left: 33px;
}

.btn-danger.active, .btn-danger:active, .open > .dropdown-toggle.btn-danger {
    color: #eb7d3d;
    background-color: rgba(201, 48, 44, 0);
    border-color: #eb7d3d;
    border: 2px solid #eb7d3d;
    box-shadow: none;
}

    .btn-danger.active.focus, .btn-danger.active:focus, .btn-danger.active:hover, .btn-danger:active.focus, .btn-danger:active:focus, .btn-danger:active:hover, .open > .dropdown-toggle.btn-danger.focus, .open > .dropdown-toggle.btn-danger:focus, .open > .dropdown-toggle.btn-danger:hover {
        color: #eb7d3d;
        background-color: rgba(172, 41, 37, 0);
        border-color: #eb7d3d;
        border: 2px solid;
    }

.btn-danger.focus, .btn-danger:focus {
    color: #eb7d3d;
    background-color: rgba(235, 125, 61, 0);
    border-color: #eb7d3d;
}

#ourteam .col-sm-4 {
    cursor: pointer;
    text-align: center;
    padding-bottom: 90px;
}

.font-white p, .font-white h2 {
    color: #fff;
}

.font-black p, .font-black h2, .font-black h3 {
    color: #2d2d2d !important;
}

.pone {
    padding-bottom: 100px;
}

#home-slide .owl-nav.disabled + .owl-dots {
    position: relative;
    z-index: 999;
    top: -49px;
    margin-top: 0;
}

.owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {
    background: #eb7d3d;
}

.owl-theme .owl-dots .owl-dot span {
    display: block;
    width: 12px;
    height: 12px;
    margin: 5px 7px;
    filter: Alpha(Opacity=50);
    opacity: 1;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    background: #ffffff;
    border: 2px solid #eb7d3d;
}

#overview .more-less {
    float: left;
    color: #212121;
    padding-right: 10px;
    width: 35px;
    height: 36px;
}

#overview .panel {
    background-color: #e4e4e4;
}

#overview a {
    text-align: left;
    font-size: 14px;
    font-family: 'Oduda-Regular';
    background: #e4e4e4;
    padding: 10px 0;
    color: #000000;
}

#overview p {
    color: #000000;
    font-family: 'Oduda-Regular';
    font-size: 14px;
}

#overview .panel-title {
    background: #e4e4e4;
    font-size: 14px;
}

input, select, textarea {
    min-height: 37px;
}

button, input, select, textarea {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    height: auto;
    background: #fff;
    border: 1px solid #d2d2d2;
    /*-webkit-appearance: none;
    -webkit-border-radius: 5px;
	padding: 0 20px;*/
    padding: 5px;
    color: #929292;
}

.form-group select {
    width: 95%;
}

.btn-hejo:hover {
    color: #006069;
    background: rgba(255, 255, 255, 0);
    border: 2px solid #006069;
}

.box-home p {
    color: #fff;
    text-align: left;
}

.panel-group .panel {
    border-radius: 0;
    box-shadow: none;
}

.panel-default > .panel-heading {
    padding: 0;
    border-radius: 0;
    color: #212121;
    background-color: transparent;
}

.panel-title {
    font-size: 14px;
}

    .panel-title > a {
        display: block;
        padding: 5px 0 10px;
        text-align: left;
        text-decoration: none;
        font-size: 12px;
    }

.more-less {
    float: left;
    color: #212121;
    padding-right: 10px;
}

.panel-default > .panel-heading + .panel-collapse > .panel-body {
    border-top-color: #EEEEEE;
    overflow-y: scroll;
    height: 6em;
}

.modal-team h3, .modal-team p {
    color: #e87722;
}

section#whatyouget {
    background: #fff;
}

.faq a {
    text-align: left;
    font-size: 14px;
    font-family: 'Oduda-Bold';
    background: #fff;
    padding: 10px 0;
}

.menu-right a {
    font-size: 14px;
    color: #6d6d6d;
}

ul.menu-right {
    padding-top: 10px;
    padding-left: 10px;
}

.faq h2 {
    border-bottom: 1px solid #d6d6d6;
    padding-bottom: 10px;
}

*, *:before, *:after {
    box-sizing: border-box;
}

$bg-color: #d9d8c6; $primary-color: #5b5a5c; $secondary-color: darken($primary-color, 15%); body {
    background: $bg-color;
}

li {
    list-style: none;
}

.suga-container {
    background: $primary-color;
    padding: .2em;
    max-width: 570px;
    margin: 5em auto;
    box-shadow: 3px 3px 0px $secondary-color;
    border: 2px solid $secondary-color;
    border-radius: 5px;
}

.suga-slider-wrap {
    overflow: hidden;
    margin: 1em;
}

.suga-slider-group {
    &:before, &:after

{
    content: " ";
    display: table;
}

&:after {
    clear: both;
}

}

.suga-slide {
    float: left;
    position: relative;
    margin-left: 0;
    padding-right: 8px;
}
/*logo end*/
.page-opat .section-heading h1 {
    color: #fff;
    margin-top: 0;
    margin-bottom: 30px;
    font-weight: 300;
}

.page-abu .section-heading h1 {
    margin-top: 0;
    margin-bottom: 30px;
    font-weight: 300;
}

.page-abu {
    background: linear-gradient(to bottom, #f7f7f7 0%,#f7f7f7 50%,#f7f7f7 74%,#f7f7f7 74%,#f7f7f7 100%);
    margin-top: -5px;
    /* padding-bottom: 100px;*/
    position: relative;
    overflow: hidden;
    z-index: 5;
}

.btn-danger {
    color: #fff;
    /*background-color: #eb7d3c;
    border-color: #eb7d3c;*/
    border: 2px solid;
    border-radius: 8px;
}

.btn-darkblue {
    background: #337ab7;
    border: 2px solid #337ab7;
    color: #fff;
    border: 2px solid;
    border-radius: 8px;
}

.theme-logo ul {
    padding-left: 36px;
    text-align: left;
}

.navbar-brand > img {
    display: block;
    width: auto;
}

.buttona.navbar-right {
    /*padding-top: 20px;
	display: none;*/
}

    .buttona.navbar-right li {
        display: inline-block;
        /*padding-left: 12px;*/
        margin: 0.5em;
    }

.btn-default {
    color: #fff;
    background-color: #129ca6;
    border-color: #129ca6;
    border: 2px solid;
    border-radius: 8px;
}

#butLogin {
    margin: 0;
}

#butLogin .btn-default, #butGetStarted .btn-danger {
    font-size: 18px;
    font-weight: 500;
}

.page-dua {
    background: linear-gradient(to bottom, #f7f7f7 0%,#f7f7f7 50%,#f7f7f7 74%,#52a0f1 74%,#52a0f1 100%);
    margin-top: -5px;
    padding-bottom: 100px;
    position: relative;
    overflow: hidden;
    z-index: 5;
}

.page-tilu {
    background: #52a0f1;
    margin-top: -5px;
    padding-bottom: 20px;
    position: relative;
    overflow: hidden;
    z-index: 5;
    padding-top: 20px;
}

    .page-tilu h2, .page-tilu p, .page-tilu h3 {
        color: #fff;
    }

.page-opat h2, .page-opat p, .page-opat h3 {
    color: #fff;
}

.page-opat h2 {
    padding-bottom: 30px;
}

.page-opat {
    position: relative;
    overflow: hidden;
    padding-top: 140px;
}

.koneng {
    color: #ffeb00;
}

#professionaldua {
    background: url(../images/aboutus/professional.jpg);
    background-attachment: fixed;
    min-height: 400px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}

.btn-hejo {
    color: #fff;
    background-color: #006069;
    border-color: #006069;
}

#professional {
    background: url(../images/home/pro.jpg);
    background-attachment: fixed;
    /* padding-top: 181px;*/
    /*   min-height: 400px;*/
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}

.boxa {
    margin-bottom: 21px;
}

.modal-team img {
    margin: 0 auto;
    width: 30%;
}

.modal-footer {
    padding: 15px;
    text-align: center;
    border-top: 0px solid #e5e5e5;
    margin-left: 30px;
    margin-right: 30px;
    margin-bottom: 10px;
}

.tgl {
    padding: 0;
    margin: 0;
    border-right: 2px solid #eb7d3d;
}

.modal-header {
    border-bottom: 0px solid #e5e5e5 !important;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
}

.modal-header.blue {
    padding: 30px;
    border-bottom: 0px solid #e5e5e5;
    background: #139da7;
}

.modal-header.orange {
    padding: 40px;
    border-bottom: 0px solid #ff7c00;
    background: #ff7c00;
}

.modal-header.red {
    padding: 40px;
    border-bottom: 0px solid #e73324;
    background: #e73324;
}

.modal-header.green {
    padding: 40px;
    border-bottom: 0px solid #01b077;
    background: #01b077;
}

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

.modal-body h1 {
    margin-top: 50px;
    font-size: large;
}

.modal-body h1.blue {
    color: #139da7;
}

.modal-body h1.orange {
    color: #f27e2b;
}

.modal-body p {
    font-size: medium;
}

.modal-body button.close {
    background: #e77721;
    color: #fff;
}

.centerimage {
    left: 0%;
    top: 5%;
    position: absolute;
}

.tanggal-ber a {
    text-decoration: none;
}

section a {
    font-size: 17px;
}

.boxa h3 {
    margin: 0;
    font-size: 17px;
    font-family: 'Oduda-Bold';
}

.tanggal-ber b {
    font-size: 27px;
}

.gambarna {
    overflow: hidden;
}

    .gambarna img {
        height: 150px;
    }

#whyhelp {
    background: url(../images/your-needs/wehelpyou.jpg);
    background-attachment: fixed;
    min-height: 400px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}

#risk {
    background: url(../images/your-needs/wemanageyourrisks.jpg);
    background-attachment: fixed;
    min-height: 400px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}

p.nopadding {
    padding-bottom: 0;
    margin-bottom: 5px;
}

#whyhelp .section-heading p {
    padding-bottom: 10px;
}

#whyhelp .section-heading h1 {
    margin-top: 20px;
}

#risk .section-heading p {
    padding-bottom: 10px;
}

#risk .section-heading h1 {
    margin-top: 20px;
}

#human .section-heading h1 {
    margin-top: 20px;
}

#human .section-heading p {
    padding-bottom: 20px;
}

#advice .section-heading h1 {
    margin-top: 20px;
}

#advice .section-heading p {
    padding-bottom: 10px;
}

.ane {
    overflow: hidden;
    text-align: left;
}

#ourteam .col-sm-4 {
    cursor: pointer;
    text-align: center;
}

.a-gede a {
    font-size: 18px;
}

.a-gede .col span {
    display: inline-block;
    width: 200px;
    height: 200px;
    color: #fff;
    position: relative;
}

#pivot-images-section {
    background: url(../images/wealth/banner1.jpg) no-repeat 0 0;
    background-size: cover;
    text-align: center;
    color: #fff;
    height: 382px;
    overflow: hidden;
    margin-top: 40px;
}

#pivot-images-section h2 {
    font-size: 28px;
    color: #fff;
    line-height: 36px;
    padding: 0 15px;
    font-weight: 400;
    z-index: 6;
    position: relative;
    margin-top: 130px;
}

.ane .section-heading {
    text-align: left;
    /*padding-left: 65px;*/
    padding-top: 50px;
    text-align: center;
}

#ourteam .section-heading h2 {
    text-align: center;
}

.dua-col .section-heading {
    text-align: left;
    /*padding-left: 60px;*/
}

.btn-abu {
    color: #fff;
    background-color: #868686;
    border-color: #868686;
}

.button-c {
    z-index: 2;
    position: relative;
    margin-top: 30px;
}

.page-lima {
    background: #f7f7f7;
    margin-top: -5px;
    padding-bottom: 100px;
    position: relative;
    overflow: hidden;
    z-index: 5;
}

.page-enam {
    background: #ffffff;
    margin-top: -5px;
    padding-bottom: 100px;
    position: relative;
    overflow: hidden;
    z-index: 5;
}

.theme-logo ul li {
    display: inline-block;
}

footer .theme-logo {
    text-align: justify;
    margin-top: 0px;
}

.theme-logo ul li a i {
    width: 30px;
    height: 30px;
    display: inline-block !important;
    background-color: #fff;
    border-radius: 50%;
    line-height: 30px;
    text-align: center;
    color: #444444;
    font-size: 14px;
    margin: 5px 0;
}

.don img {
    height: 33px;
}

#pivot03-video-section {
    background: url(../images/wealth/banner1.jpg) no-repeat 0 0;
    background-size: cover;
    text-align: center;
    color: #fff;
    /*height: 600px;*/
    overflow: hidden;
    /*margin-top: 67px;*/
}

.progressna {
    background: #ffffff;
    background-size: cover;
    position: relative;
    padding: 150px 15%;
    color: #2d2d2d;
    text-align: center;
    overflow: hidden;
}

.progressna .comment {
    font-size: 26px;
    color: #2d2d2d;
    font-weight: lighter;
    line-height: 50px;
    margin-bottom: 100px;
}

.progressna .organization-person a {
    display: inline-block;
    color: #2d2d2d;
}

.progressna .organization-person small {
    display: block;
    margin-bottom: 15px;
}

#pivot03-video-section h2 {
    /*font-size: 22px;
    color: #fff;
    line-height: 0px;
    padding: 0 15px;
    font-weight: 400;*/
    font-size: 28px;
    color: #fff;
    line-height: 36px;
    padding: 0 15px;
    font-weight: 400;
    z-index: 6;
    position: relative;
}

#pivot03-video-section .col {
    position: relative;
    top: 30%;
}

#pivot03-video-section .name {
    position: relative;
    z-index: 5;
}

#pivot03-video-section a {
    position: absolute;
    /*top: 22%;*/
    top: 29%;
}

#pivot03-video-section .name {
    display: block !important;
    text-transform: none;
    font-weight: 100;
    margin-top: 30px;
}

p {
    margin: 10px 0 10px;
}

.progressna .owl-theme .owl-controls .owl-buttons .owl-next {
    right: -45px;
    top: 55px;
}

.progressna .owl-theme .owl-controls .owl-buttons .owl-prev {
    left: -45px;
    top: 55px;
}

.progressna .owl-theme .owl-controls .owl-buttons div {
    position: absolute;
    color: #000;
    font-size: 69px;
    background: transparent;
    padding: 0;
    margin: 0;
}

.progressna .owl-theme .owl-controls.clickable .owl-buttons div:hover {
    filter: Alpha(Opacity=100);
    opacity: 1;
    text-decoration: none;
    color: #d9534f;
}

.progressna .owl-theme .owl-controls .owl-page span {
    display: block;
    width: 12px;
    height: 12px;
    margin: 5px 7px;
    filter: Alpha(Opacity=50);
    opacity: 1;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    background: #869791;
    position: relative;
    margin-left: 60px;
    margin-right: 60px;
    z-index: 1;
    color: #869791;
}

.owl-theme .owl-controls .owl-page span {
    display: block;
    width: 12px;
    height: 12px;
    margin: 5px 7px;
    filter: Alpha(Opacity=50);
    opacity: 1;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    background: #ffffff;
    border: 2px solid #eb7d3d;
}

.owlaja .owl-theme .owl-controls .owl-page span {
    background: #cecece;
    border: 2px solid #cecece;
}

.owlaja .owl-theme .owl-controls .owl-page.active span {
    background: #5f5f5f;
    border: 2px solid #5f5f5f;
}

.owlaja .owl-theme .owl-controls {
    padding-top: 30px;
}

.progressna .owl-theme .owl-controls .owl-page:nth-child(2) span::after {
    content: "\f042";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    position: absolute;
    bottom: 40px;
    font-size: 24px;
    left: -5px;
    /*color: #000;
    font-size: 18px;
    padding-right: 0.5em;
    position: absolute;
    top: 10px;
    left: 0;*/
}

.progressna .owl-theme .owl-controls .owl-page:nth-child(1) span::after {
    content: "\f155";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    position: absolute;
    bottom: 40px;
    font-size: 24px;
    left: -5px;
    /*color: #000;
    font-size: 18px;
    padding-right: 0.5em;
    position: absolute;
    top: 10px;
    left: 0;*/
}

.progressna .owl-theme .owl-controls .owl-page:nth-child(3) span::after {
    content: "\f155";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    position: absolute;
    bottom: 40px;
    font-size: 24px;
    left: -5px;
    /*color: #000;
    font-size: 18px;
    padding-right: 0.5em;
    position: absolute;
    top: 10px;
    left: 0;*/
}

.progressna .owl-theme .owl-controls .owl-page:nth-child(4) span::after {
    content: "\f133";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    position: absolute;
    bottom: 40px;
    font-size: 24px;
    left: -5px;
    /*color: #000;
    font-size: 18px;
    padding-right: 0.5em;
    position: absolute;
    top: 10px;
    left: 0;*/
}

.progressna .owl-theme .owl-controls .owl-page:nth-child(5) span::after {
    content: "\f1c0";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    position: absolute;
    bottom: 40px;
    font-size: 24px;
    left: -5px;
    /*color: #000;
    font-size: 18px;
    padding-right: 0.5em;
    position: absolute;
    top: 10px;
    left: 0;*/
}

.progressna .owl-theme .owl-controls .owl-page:nth-child(6) span::after {
    content: "\f197";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    position: absolute;
    bottom: 40px;
    font-size: 24px;
    left: -5px;
    /*color: #000;
    font-size: 18px;
    padding-right: 0.5em;
    position: absolute;
    top: 10px;
    left: 0;*/
}

#owl-demo .owl-controls.clickable .owl-page:hover span {
    filter: Alpha(Opacity=100);
    opacity: 1;
    background: #636365;
    color: #636365;
}

.progressna .owl-theme .owl-controls .owl-page.active span {
    background-color: #d9534f;
    color: #d9534f;
}

.progressna .owl-theme .owl-controls .owl-page.active span, .owl-theme .owl-controls.clickable .owl-page:hover span {
    filter: Alpha(Opacity=100);
    opacity: 1;
    background: #eb7d3d;
    color: #eb7d3d;
}

.progressna .owl-pagination::before {
    content: "";
    border-top: 2px solid #969696;
    width: 74%;
    position: absolute;
    left: 117px;
    bottom: 15px;
    z-index: 1;
}

.progressna .owl-theme .owl-controls {
    margin-top: 90px;
    text-align: center;
}

.progressna .section-heading {
    text-align: center;
    padding-bottom: 60px;
    overflow: hidden;
}

.wal-abu {
    background: #f7f7f7;
    background-size: cover;
    position: relative;
    padding: 90px 0;
    color: #2d2d2d;
    text-align: center;
    overflow: hidden;
}

.wal-putih {
    background: #ffffff;
    background-size: cover;
    position: relative;
    padding: 90px 0;
    color: #2d2d2d;
    text-align: center;
    overflow: hidden;
}

.clearfix {
    clear: both;
}

.col-garis {
    border-bottom: 1px solid #d2cbcb;
    padding-bottom: 20px;
}

.isi-kanan i {
    float: left;
    width: 30px;
    color: #d9534f;
    margin-top: 14px;
}

.isi-kanan p {
    float: left;
    width: 93%;
}

.col-garis:last-child {
    border-bottom: none;
}

#faq {
    background: #f7f7f7;
}

    #faq h3 {
        margin-bottom: 30px;
    }

    #faq p {
        margin-bottom: 0 !important;
    }

    #faq ul {
        margin-bottom: 30px;
    }

        #faq ul li {
            list-style-type: disc;
            margin-left: 1.2em;
        }

.page-tilu .section-heading h3 {
    font-size: 21px;
    font-weight: 200;
}

.nukiri {
    position: relative;
    /*top: 180px;*/
    top: 89px;
}

.nukanan {
    position: relative;
    /*top: 120px;*/
    top: 24px;
}

.colomnatea {
    /*margin-bottom: 70px;*/
    margin-bottom: 0px;
}

    .colomnatea h2 {
        font-size: 16px;
    }

    .colomnatea p {
        font-size: 13px;
        line-height: normal;
        padding-bottom: 0;
        margin-top: 5px;
    }

    .colomnatea .btn {
        font-size: 12px;
    }

    .colomnatea.nu-genep {
        left: -176px;
        position: relative;
        margin-bottom: 25px;
    }

    .colomnatea.nu-tilu {
        position: relative;
        left: -112px;
        margin-bottom: 27px;
        padding-top: 39px;
    }

    .colomnatea.nu-dua {
        position: relative;
        right: -91px;
        text-align: right;
        margin-bottom: 64px;
        padding-top: 14px;
    }

    .colomnatea.nu-lima {
        text-align: right;
        position: relative;
        left: 151px;
        padding-top: 5px;
        z-index: 999;
    }

    .colomnatea.nu-hiji {
        position: relative;
        right: -30px;
        margin-bottom: 15px;
        text-align: right;
    }

    .colomnatea.nu-opat {
        position: relative;
        left: -65px;
        top: -8px;
    }

.partners .col div {
    height: 85px;
    border-right: 1px solid #d6d4d9;
    border-bottom: 1px dashed #d6d4d9;
    position: relative;
}

.tambahan {
    padding-top: 40px;
}

    .tambahan p {
        line-height: 12px;
    }

#pivot03-video-section button {
    margin-top: 30px;
    position: relative;
    z-index: 6;
}

ul.nav.tab-menu.nav-pills.nav-stacked.pr15 {
    display: flex;
}

ul.nav.tab-menu.nav-pills.nav-stacked.pr16 {
    display: flex;
}

.tabna .nav-pills > li > a {
    border-radius: 1px;
}

.tabna .nav > li > a {
    position: relative;
    display: block;
    padding: 4px 15px;
    min-width: 87px;
    min-height: 25px;
}

.tabhiji .nav-pills > li.active > a, .tabhiji .nav-pills > li.active > a:focus, .tabhiji .nav-pills > li.active > a:hover {
    color: #fff;
    background-color: #52a0f1 !important;
}

.tabdua .nav-pills > li.active > a, .tabdua .nav-pills > li.active > a:focus, .tabdua .nav-pills > li.active > a:hover {
    color: #fff;
    background-color: #ff7d7d !important;
}

.berem {
    color: #ff7d7d;
}

.tabna .nav > li:nth-child(1) a {
    background-color: #e5e5e5;
    color: #fff;
}

.tabna .nav > li:nth-child(2) a {
    background-color: #c4c4c4;
    color: #fff;
}

.aya-garis {
    border-bottom: 1px solid #d6d6d6;
    margin-bottom: 50px;
}

.tabna .nav > li:nth-child(3) a {
    background-color: #9e9e9e;
    color: #fff;
}

.tabna .nav > li:nth-child(4) a {
    background-color: #7f7f7f;
    color: #fff;
}

.tabna .nav > li:nth-child(5) a {
    background-color: #606060;
    color: #fff;
}

.tabna .nav > li:nth-child(6) a {
    background-color: #424242;
    color: #fff;
}

.nav-stacked > li + li {
    margin-top: 0px;
    margin-left: 0;
}

.pr15 li.active::before {
    content: "";
}

.well {
    min-height: 20px;
    padding: 0px;
    margin-bottom: 20px;
    background-color: rgba(245, 245, 245, 0);
    border: none;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
    box-shadow: none;
}

.biru {
    color: #52a0f1;
}

.list-port i {
    color: #fff;
    font-size: 25px;
}

.list-port {
    color: #fff;
    padding: 0;
}

    .list-port h4 {
        font-size: 14px;
        margin: 0;
    }

section table {
    margin-top: 20px;
}

table.performance {
    margin-bottom: 15px;
    margin-top: 15px;
    border: 1px solid orange;
}

    table.performance td {
        padding: 0.25em 1em;
    }

    table.performance .color {
        background: #ffee72;
    }

.ai-ml {
    background: url(../images/ai-ml-2.jpg) no-repeat center top;
    background-size: cover;
    overflow: hidden;
}

    .ai-ml h2, .ai-ml p {
        color: #fff;
        line-height: 1.5;
    }

    .ai-ml p {
        margin-top: 1em;
    }

.tab-content {
    padding: 15px;
}

.nav-tabs {
    border-bottom: 1px solid #d3d3d3;
    padding: 0 15px;
}

    .nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover, .nav-tabs > li > a:hover {
        color: #ed751e;
        text-align: left;
        border: 0px;
        padding: 0 15px 15px 0;
    }

    .nav-tabs > li > a {
        color: #575756;
        text-align: center;
        padding: 0 15px 15px 0;
        border: 0;
        font-size: 14px;
    }

    .nav-tabs > li {
        margin-bottom: 0;
    }

.wal-bodas {
    background: #ffffff;
}

.border {
    height: 30px;
    border-left: 2px solid #ed751e;
    display: inline-block;
    margin-bottom: -5px;
    margin-left: 50%;
}

.port-opat {
    text-align: left;
}

    .port-opat .col div {
        margin-bottom: 70px;
    }

.pivot03-hiji .col span {
    display: inline-block;
    width: 110px;
    height: 110px;
    color: #fff;
    position: relative;
}

.education2 {
    background: #52a0f1;
}

    .education2 h2, .education2 p {
        color: #fff;
    }

    .education2 img {
        max-width: 100%;
    }

@import "bourbon";

body {
    background: #f7f7f7 !important;
}

.wrapper {
    margin-top: 80px;
    margin-bottom: 80px;
}

.signup-form {
    max-width: 450px;
    /* background-color: #fff;
  border: 1px solid rgba(0,0,0,0.1);  
  margin: 0 auto;*/
}

.kotak-form {
    /*  min-width: 450px;*/
    background-color: #fff;
    border: 1px solid rgba(0,0,0,0.1);
    /* margin: 0 auto;*/
    padding: 0px;
}

    .kotak-form h2 {
        background: #eb7d3c;
        text-align: center;
        padding: 15PX;
        font-weight: 400;
        text-transform: uppercase;
        color: #fff;
    }

.form-signin {
    padding: 15px 35px 45px;
}
/*.signup-form h2 {
    background: #eb7d3c;
    text-align: center;
    padding: 15PX;
    font-weight: 400;
    text-transform: uppercase;
    color: #fff;
    }*/
.form-signin-heading,
.checkbox {
    margin-bottom: 30px;
}

.checkbox {
    font-weight: normal;
}

.form-control {
    position: relative;
    font-size: 16px;
    height: auto;
    padding: 10px;
    @include box-sizing(border-box);
}

&:focus {
    z-index: 2;
}


input[type="text"] {
    margin-bottom: 10px;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

input[type="password"] {
    /*margin-bottom: 20px;*/
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.logo-signup a img {
    max-width: 150px;
    margin-bottom: 50px;
}

.form-control {
    display: block;
    width: 100%;
    height: 25px;
    padding: 0px 12px;
    font-size: 16px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 1px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}

.form-signin .checkbox {
    margin-left: 30px;
    font-size: 11px;
    margin-bottom: 13px;
}

.signup-form .btn-danger {
    margin: 0 auto;
    text-align: center;
    display: block;
    margin-top: 34px;
    text-transform: uppercase;
    padding-left: 30px;
    padding-right: 30px;
}

.signup-form p, a {
    font-size: 11px;
    text-align: center;
}
/*signup*/
.signup-head .navbar-nav {
    float: right;
}

.personal {
    margin-top: 100px;
}

.isi-kotak {
    padding: 15px 35px 45px;
}

.kotak-form .section-heading h2 {
    background: none;
    color: #000;
    font-weight: 300;
    padding: 0;
    text-transform: none;
    /*margin-top: 50px;*/
    margin-top: 0px;
}

.text-kotak p {
    font-size: 11px;
    margin: 0;
}

.selectyour {
    /*margin-top: 50px;*/
}

.checkbox label:after,
.radio label:after {
    content: '';
    display: table;
    clear: both;
}

.checkbox .cr,
.radio .cr {
    position: relative;
    display: inline-block;
    border: 3px solid #a9a9a9;
    border-radius: .25em;
    width: 2.3em;
    height: 2.3em;
    float: left;
    margin-right: .5em;
}

.radio .cr {
    border-radius: 50%;
}

    .checkbox .cr .cr-icon,
    .radio .cr .cr-icon {
        position: absolute;
        font-size: .8em;
        line-height: 0;
        top: 50%;
        left: 20%;
    }

    .radio .cr .cr-icon {
        margin-left: 0.04em;
    }

.checkbox label input[type="checkbox"],
.radio label input[type="radio"] {
    display: none;
}

    .checkbox label input[type="checkbox"] + .cr > .cr-icon,
    .radio label input[type="radio"] + .cr > .cr-icon {
        transform: scale(3) rotateZ(-20deg);
        opacity: 0;
        transition: all .3s ease-in;
    }

    .checkbox label input[type="checkbox"]:checked + .cr > .cr-icon,
    .radio label input[type="radio"]:checked + .cr > .cr-icon {
        transform: scale(1) rotateZ(0deg);
        opacity: 1;
    }

    .checkbox label input[type="checkbox"]:disabled + .cr,
    .radio label input[type="radio"]:disabled + .cr {
        opacity: .5;
    }

.checkbox, .radio {
    position: relative;
    display: block;
    margin-top: 35px;
    margin-bottom: 10px;
}

.isi-kotak h3 {
    color: #eb7d3c;
}

.btn-biru {
    color: #fff;
    background-color: #52a0f1;
    border-color: #52a0f1;
}

.button-box {
    margin-top: 20px;
}

.kotak-form .section-heading {
    padding: 0;
}

.radio-box {
    padding: 30px;
}

.glyphicon-ok-sign:before {
    content: "\e084";
    font-size: 23px;
    margin-left: -4px;
    color: #eb7d3c;
}

.garisan {
    display: block;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: none;
    border-radius: 1px;
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-transition: none;
    -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    border-bottom: 1px solid #000;
}

.anufloat {
    float: left;
    width: 18%;
    margin-top: 17px;
}

.col-10 {
    float: left;
    width: 90px;
}

.ayainput span {
    float: left;
}

.ayainput .col-10 {
    margin-top: -9px;
}

.ayainput .garisan {
    height: 25px;
    background-color: rgba(255, 255, 255, 0);
    border-color: #f00;
}

.box-form {
    background: rgba(235, 125, 60, 0.33);
    border-radius: 10px;
}

.buton-icon i {
    font-size: 35px;
}

.buton-icon {
    width: 20%;
}

.buton-icon-kotak h3 {
    color: #fff;
}

.stepwizard-step p {
    margin-top: 10px;
}

.stepwizard-row {
    display: table-row;
}

.stepwizard {
    display: table;
    width: 100%;
    position: relative;
    margin-top: 20px;
    margin-bottom: 20px;
}

.stepwizard-step button[disabled] {
    opacity: 1 !important;
    filter: alpha(opacity=100) !important;
}

.stepwizard-row:before {
    top: 14px;
    bottom: 0;
    position: absolute;
    content: " ";
    width: 80%;
    height: 3px;
    background-color: #ccc;
    z-index: 0;
    left: 98px;
}

.stepwizard-step {
    display: table-cell;
    text-align: center;
    position: relative;
}

.btn-circle {
    width: 30px;
    height: 30px;
    text-align: center;
    padding: 6px 0;
    font-size: 12px;
    line-height: 1.428571429;
    border-radius: 15px;
}

.box-kosong {
    background: #dcdcdc;
    padding: 30px;
    min-height: 300px;
    margin-right: 34px;
    margin-left: 34px;
}

    .box-kosong ul li {
        line-height: 40px;
    }

    .box-kosong p {
        text-align: center;
        margin: 0 auto;
    }

        .box-kosong p i {
            font-size: 60px;
            margin-top: 90px;
        }

.header-oren .modal-header {
    background: #de7537;
    color: #fff;
    text-align: center;
}

.modal-content {
    position: relative;
    background-color: #fff;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px solid #999;
    border: 1px solid rgba(0,0,0,.2);
    outline: 0;
    -webkit-box-shadow: 0 3px 9px rgba(0,0,0,.5);
    box-shadow: 0 3px 9px rgba(0,0,0,.5);
    border-radius: 10px;
}

.modal-body {
    position: relative;
    padding: 10px 30px;
}

    .modal-body i {
        font-size: 65px;
        color: #52a0f1;
    }

    .modal-body p {
        line-height: 27px;
    }

    .modal-body a {
        font-size: 13px;
    }

.menu-setup a {
    background: #a7a7a7;
    padding: 12px;
    font-size: 14px;
    color: #fff;
}

    .menu-setup a:first-child {
        border-bottom-left-radius: 25px;
        border-top-left-radius: 25px;
    }

    .menu-setup a:last-child {
        border-bottom-right-radius: 25px;
        border-top-right-radius: 25px;
    }

.menu-setup .active, a:hover {
    /* background: #5074e2;*/
    background: rgba(80, 116, 226, 0);
    color: #eb7d3c;
}

.setup-hed {
    margin-top: 45px;
    margin-bottom: 50px;
}

.formbener .form-group {
    padding-right: 5px;
    padding-left: 5px;
    min-height: 34px;
}

.btn-hijau {
    color: #fff;
    background-color: #00c53d;
    border-color: #00c53d;
    border-radius: 0px;
}

.c-red {
    color: red;
}

.bawah-dik {
    margin-top: 23px;
}

.row.formna, .maid .row.formna.row {
    padding-left: 0 !important;
}

.formna .tombol {
    margin-top: 0;
}

.formna i {
    font-size: 10px;
    color: #676767;
}

.formna p {
    margin-bottom: 5px;
    padding-left: 0;
}

input#checkbox1 {
    margin-left: 0px;
}

.checkbox-1 label {
    color: #929292;
    font-weight: 400;
}

div.clear {
    clear: both;
}

div.product-chooser.disabled div.product-chooser-item {
    zoom: 1;
    filter: alpha(opacity=60);
    opacity: 0.6;
    cursor: default;
}

div.product-chooser div.product-chooser-item {
    padding: 11px;
    border-radius: 0px;
    cursor: pointer;
    position: relative;
    border: 1px solid #efefef;
    margin-bottom: 0px;
    margin-left: 0px;
    margin-right: 10x;
}

    div.product-chooser div.product-chooser-item.selected {
        border: 1px solid #9a9a9a;
        background: #e4e4e4;
        padding: 8px;
        filter: alpha(opacity=100);
        opacity: 1;
    }

}

div.product-chooser div.product-chooser-item img {
    padding: 0;
    margin: 0 auto;
}

div.product-chooser div.product-chooser-item span.title {
    display: block;
    margin: 10px 0 5px 0;
    font-weight: bold;
    font-size: 12px;
}

div.product-chooser div.product-chooser-item span.description {
    font-size: 12px;
}

div.product-chooser div.product-chooser-item input {
    position: absolute;
    left: 0;
    top: 0;
    visibility: hidden;
}

.product-chooser-item img {
    margin: 0 auto;
    width: 30%;
}

.product-chooser .col-md-2 {
    padding: 0;
}

.panel-default .nav-tabs {
    border-bottom: 1px solid #b1b1b1;
}

    .panel-default .nav-tabs > li > a {
        color: #000000;
        border: none;
        width: auto;
        height: auto;
        border-radius: 0;
        text-align: center;
        padding: 15px;
        background: #fff;
        font-size: 14px;
    }

    .panel-default .nav-tabs > li {
        margin-right: 0;
        width: 50%;
    }

.panel-default > .panel-heading {
    color: #333;
    border-color: rgba(221, 221, 221, 0);
}

.panel-heading {
    padding: 0;
    border-bottom: none;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
}

.panel {
    margin-bottom: 20px;
    background-color: #fff;
    border: none;
    border-radius: 4px;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.panel-default .nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover, .nav-tabs > li > a:hover {
    color: #eb7d3c;
    border: none;
    text-align: center;
    padding: 0 15px 15px 0;
    background: none;
}

.formna .radio {
    margin-left: 22px;
    margin-top: 12px;
}

.header-oren {
    background: #eb7d3c;
    margin-bottom: 10px;
}

    .header-oren p {
        color: #fff;
    }

.terakhir {
    background: #d2d2d2;
    padding: 12px;
    margin-top: 11px;
}

.breadcrumb {
    padding: 8px 64px;
    margin-bottom: 6px;
    list-style: none;
    background-color: #eaeaea;
    border-radius: 0px;
}

.nav i {
    padding-left: 4px;
}

#objective p, #trusted p {
    font-size: 20px;
}

#objective h2 {
    padding-bottom: 0;
}

#contact {
    margin-top: 70px;
}

.kontak {
    background: #fff;
    padding-top: 80px;
}

#contactForm .col {
    padding: 0;
    margin-bottom: 8px;
}

.kontak h3 {
    font-size: 20px;
}

form#contact-form .col {
    padding: 0;
}

#owl-demo .item {
    margin: 3px;
}

    #owl-demo .item img {
        display: block;
        height: auto;
        width: 66%;
        margin: 0 auto;
    }

.navbar > .container .navbar-brand {
    margin-left: 0;
}

#intelegent h3 {
    font-size: 20px;
    padding-bottom: 30px;
    color: #575756;
}

#trusted {
    background: url(../images/home/trus.jpg);
    background-attachment: fixed;
    min-height: 400px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}

#professional .section-heading {
    padding-bottom: 0;
}

#value {
    background: url(../images/home/value.jpg);
    background-attachment: initial;
    min-height: 400px;
    background-repeat: no-repeat;
    background-position: center center;
}

@media all and (min-width: 360px) and (max-width: 768px) {
    .fa-chevron-circle-right {
        transform: translate(293%,-165%);
    }

    .btn-text {
        font-size: 16px;
    }
}

@media only screen and (max-width: 420px) {
    #pivot03-video-section a {
        position: absolute;
        /* top: 22%; */
        top: 48%;
    }

    .add-mobile {
        display: block !important;
        padding-left: 16px !important;
    }

    .add {
        padding-left: 1px !important;
        display: none;
    }

    /*#media h2{
	margin-left: 15px;
}*/

    #shareholder img {
        margin-left: 76px;
    }

    .offer {
        overflow: hidden;
        text-align: center;
        margin-top: -50px;
    }

    footer .row:first-child {
        padding: 5px 0;
    }

    section#objective img {
        margin: 0 auto;
    }

    .sha {
        padding-left: 30px;
        padding-right: 30px;
    }

    .more-less {
        height: 33px;
    }

    .sh {
        padding-left: 15px;
        padding-right: 15px;
    }

    .logon {
        margin-top: 40px;
    }
    /*	section#whatyouget {
    background: #fff;
    padding-top: 125px;
}*/
    #overview .more-less {
        float: left;
        color: #212121;
        padding-right: 10px;
        width: 4%;
        height: 21px;
    }

    .ane .section-heading {
        /*    text-align: left;
    padding-left: 43px;*/
        padding-top: 40px;
        /*  margin-left: 40px;*/
    }
    /*#ourteam h2 {
    margin-left: -20px!important;
}*/
    /*#shareholder h2 {
    margin-left: -10px;
}*/
    /*section#media {
    padding-top: 0;
}*/
    .gambarna img {
        height: auto;
    }

    #whatyouget img {
        margin: 0 auto;
        padding-bottom: 35px;
    }
    /*section#shareholder {
    padding-top: 0;
    text-align: center;
}*/
    .faq a {
        text-align: left;
        font-size: 14px;
        font-family: 'Oduda-Bold';
        background: #fff;
        padding: 10px 0;
        line-height: 23px;
    }

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

    .boxa h3 {
        margin: 0;
        text-align: center;
    }

    #advice img {
        margin: 0 auto;
    }

    #advice h1 {
        text-align: center;
        margin-top: 32px !important;
    }

    #overview a {
        width: 100% !important;
    }

    #advice p {
        text-align: center;
    }

    #objective p, #trusted p {
        font-size: 15px;
    }

    .section-padding p {
        font-size: 16px;
    }

    #professional {
        padding-top: 130px;
    }

    #home-slide .owl-nav.disabled + .owl-dots {
        position: relative;
        z-index: 999;
        top: -31px;
        margin-top: 0;
    }

    #intelegent img {
        margin: 0 auto;
    }

    header .home-slider .container h1 {
        font-size: 20px;
        margin-top: 304px;
    }

    .log-1 {
        padding-bottom: 20px;
    }

    .log-2 {
        padding-bottom: 15px;
    }

    .box-home p {
        color: #fff;
        padding: 0 !important;
        margin: 0 !important;
    }

    img.mobi {
        display: block !important;
    }

    img.des {
        display: none;
    }

    .awal-h img {
        margin-bottom: 22px;
    }

    .box-home {
        margin-bottom: 40px !important;
    }

    .halah {
        margin-top: 30px !important;
    }

    .nukiri .colomnatea {
        width: 85%;
        margin-left: 39px !important;
    }

    .nukanan .colomnatea {
        width: 85%;
        margin-bottom: 10px;
    }
}

@media (max-width: 455px) {
    input[type=number] {
        height: 32px;
        width: 32px;
        font-size: 11px;
    }
}

@media all and (max-width: 480px) {
    .radio-inline {
        padding-left: 40px;
        padding-right: 10px;
    }

    #msform input[type=radio] {
        margin-left: -40px;
    }

    #divPrivacyPolicy .modal-header .close {
        margin-top: -120px;
    }

    #divPrivacyPolicy .modal-dialog {
        width: 95%;
        top: 5%;
    }

    input[type=number] {
        height: 30px;
        width: 34px;
        font-size: medium;
        padding: 0px;
    }
}

@media all and (max-width: 500px) {
    #container img {
        height: auto;
        width: 100%;
    }

    .giftbanner {
        width: 55% !important;
        top: 50px !important;
        left: 0px !important;
        height: 12% !important;
        padding-top: 10px !important;
    }

    .giftbox {
        display: block !important;
    }
}

@media (min-width: 767px) {
    .nav-side-menu .menu-list .menu-content {
        display: block;
    }
}

@media only screen and (max-width: 767px) {
    #msform input[type=radio], #msform input[type=checkbox] {
        width: 20px !important;
    }

    header .navbar .navbar-brand {
        margin-bottom: 0;
        margin-right: 0;
        /*left: 100px;*/
    }

    header .navbar .navbar-nav {
        width: 100%;
    }
    /*cusom*/
    .home-slider .owl-controls {
        position: absolute;
        right: 0;
        bottom: 30px;
    }

    .offer .col {
        padding: 0 15px;
        margin-bottom: 0px;
    }

    .offer p {
        text-align: center;
    }

    .box-home .col-md-5 {
        border: none !important;
    }

    .box-home h2 {
        text-align: center !important;
    }

    .ak img {
        margin: 0 !important;
    }

    footer .row:first-child {
        padding: 5px 0;
    }

    footer .theme-logo {
        text-align: justify;
        margin-top: 0px;
        width: 45%;
        margin-left: -6px;
    }

    .nukiri {
        position: relative;
        /* top: 180px; */
        top: 0px;
    }

    .colomnatea.nu-hiji {
        position: relative;
        right: 0px;
        margin-bottom: 9px;
        text-align: right;
    }

    .colomnatea.nu-dua {
        position: relative;
        right: 0px;
        text-align: right;
        margin-bottom: 15px;
        padding-top: 5px;
    }

    .colomnatea.nu-lima {
        text-align: right;
        position: relative;
        left: 0px;
        padding-top: 5px;
        z-index: 999;
    }

    .nukanan {
        position: relative;
        /* top: 120px; */
        top: 0px;
    }

    .colomnatea.nu-genep {
        left: 0px;
        position: relative;
        margin-bottom: 9px;
    }

    .colomnatea.nu-tilu {
        position: relative;
        left: 0px;
        margin-bottom: 9px;
        padding-top: 10px;
    }

    .colomnatea.nu-opat {
        position: relative;
        left: 0px;
        top: 10px;
    }

    .home-slider {
        position: relative;
        overflow: hidden;
        margin-top: 66px;
    }

    #owl-demo .item img {
        display: block;
        height: auto;
        margin-left: 20%;
    }

    .section-heading {
        text-align: center;
        /* padding-bottom: 100px; */
        padding-bottom: 18px;
        overflow: hidden;
    }
    /*.section-padding {
    padding: 58px 0;
    overflow: hidden;
}*/
    .section-padding {
        padding: 100px 0;
        overflow: hidden;
    }

    .navbar-brand > img {
        display: block;
        width: 100%;
        /*margin-top: 7px;*/
    }

    header .navbar-header button {
        /*border: 1px solid #eb7d3c;
    margin-top: 15px!important;
    margin-right: -14px;
    background-color: #eb7d3c;*/
        z-index: 9999999;
        position: relative;
        font-size: xx-large;
        margin-top: 0;
        margin-bottom: 0;
        padding-right: 0;
    }

    header .navbar a {
        /*line-height: 50px !important;*/
        /*padding-left: 25px;*/
        text-align: left;
        /*margin-left: 16px;*/
    }

    .navbar-toggle {
        margin-right: 0;
        padding: 0;
    }

    .copyright p {
        font-size: 12px;
    }
}

@media all and (max-width: 767px) {
    .mainscreen {
        padding: 15px 30px;
    }

    .txtTelephoneSeperator {
        display: none;
    }

    .btn-dark2 {
        margin-top: 5px !important;
    }

    #divPrivacyPolicy .modal-dialog {
        width: 97%;
        top: 10%;
    }

    .form-group select#ddlCountry, input#txtAddressLine1, input#txtAddressLine2, input#txtPostalZipCode, input#txtEmailAddress, input#txtNumber {
        width: 100% !important;
    }

    #content2 h2 {
        margin-left: 0;
    }

    .info h2 {
        padding-left: 0 !important;
    }

    .line-or {
        display: none;
    }

    .texth1, #content2 h2 {
        padding-left: 15px;
    }

    .colUpload1, .colUpload2, .colUpload1 .webuploader-pick, .colUpload2 .webuploader-pick {
        width: 100%;
    }

    .colUpload1 p {
        text-align: center;
    }

    #b_right a {
        margin-bottom: 20px;
    }

    .content2 {
        padding: 0%;
    }

    .center-tombol {
        flex-direction: column-reverse;
    }

    #divPrivacyPolicy .modal-header h1, #divAccountOpeningAgreement .modal-header h1 {
        font-size: 20px;
    }

    .col-md-12 {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }

    .myButton {
        width: 90%;
    }

    .myButtonorg {
        width: 90%;
    }

    .padding50 {
        padding: 20px 30px;
    }

    .ms {
        width: 80%;
    }

    .ms2 {
        width: 85%;
    }
}

@media (max-width: 767px) {
    .btn-mobile {
        display: block;
        font-family: 'Poppins Semibold', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
        padding: 6px 12px !important;
        position: absolute !important;
        right: 70px;
        top: 12px;
    }
    .btn-desktop, footer {
        display: none;
    }
    .center-btn, .tombol {
        margin-bottom: 0;
    }

    #progressbarnew {
        width: 95%;
    }

    .content2 {
        width: 100%;
    }

    #progressbarnew li {
        width: 20% !important;
    }

        #progressbarnew li:before {
            width: 25px;
            height: 25px;
            line-height: 25px;
        }

        #progressbarnew li:after {
            top: 12px;
        }

    #progressbarnew {
        padding: 0px 0px 10px 0;
    }

    .padding50 {
        /*padding: 20px 10px;*/
        padding: 20px;
    }

    .btn-m100 {
        width: 100%;
        margin-right: 0 !important;
        margin-left: 0 !important;
        margin-bottom: 10px;
    }

    .backgroundbody {
        display: inline-block !important;
    }

    header .navbar .navbar-collapse a {
        float: none;
        padding-bottom: 0;
        margin-top: 0;
    }

    .welcome {
        padding-bottom: 15px;
        margin-left: 10px;
        line-height: 15px;
    }

    #newpledge #pledgehistorybtn, #riskprofile #changehistorybtn, #project #projecthistorybtn {
        font-size: small !important;
        float: left;
        margin-top: 15px;
    }

    #newpledge .tombolnext {
        margin-bottom: 20px !important;
    }

    #newpledge .tombolprev {
        margin-bottom: 20px !important;
    }

    .retirement.paddingtop50 {
        padding-top: 0;
    }

    .paddingtop50 h1 {
        padding-left: 0;
    }

    .maid.education table {
        margin-top: 0px !important;
    }

    .tombol a {
        margin-bottom: 15px;
    }

    .btn-light {
        margin-top: 60px;
    }

    .btn-dark {
        margin-top: -215px;
    }

    .paddingtop80 p {
        padding-left: 30px !important;
    }

    .img-round ul {
        display: block;
    }

    li#risk0, li#risk1, li#risk2, li#risk3, li#risk4, li#risk5 {
        /*width: 100%;
        float: none;
        display: block;
        margin-bottom: 30px;*/
        width: 24%;
        margin-bottom: 20px;
    }

    #msform fieldset .col-md-8 h1, #msform fieldset .col-md-8 h2, #msform fieldset .col-md-8 h3 {
        padding: 0 15px;
    }

    #content .row .col-md-8 .sqacc .row {
        margin: 0 !important;
        padding: 0 !important;
    }

    .sqacc {
        padding-bottom: 30px;
    }

        .sqacc table {
            margin-top: 0;
        }

        .sqacc .table-responsive, .withdrawal {
            margin-top: 30px;
            padding-bottom: 10vh;
        }

    #content .row .col-md-8 .row {
        padding-left: 10px;
        padding-right: 10px;
        margin-right: -15px;
    }

    .centercontent {
        text-align: center;
    }

    .gambar {
        text-align: center;
    }

    #content .row div.gambar img {
        margin: 0 auto;
        width: 33.33333% !important;
    }

    .centercontent p {
        text-align: center !important;
    }

    .centercontent .btn {
        margin-right: 0 !important;
    }

    .centercontent .btn-default {
        margin-bottom: 15px;
    }

    .tombolmodal .btn-orange, .tombolmodal .btn-gray {
        width: 100%;
        float: left;
        margin-bottom: 15px !important;
        margin-left: 0 !important;
    }

    .isi4 .tombol {
        border-top: 1px solid #d3d3d3;
    }

    .grayborderleft {
        border-left: 0px solid #d3d3d3;
        border-top: 1px solid #d3d3d3;
    }

    .investment {
        padding-top: 5vh;
        padding-bottom: 3vh;
    }

    .isi2 {
        padding: 10px;
    }

    .boxorange {
        width: 80%;
        font-size: small;
    }

        .boxorange p {
            margin-top: -10px;
        }

    .table-rounded td.borderright {
        border-right: none;
    }

    #content2 .privacy {
        width: 96%;
        margin-left: 3%;
        margin-top: 0;
    }

        #content2 .privacy p {
            margin-top: 0;
        }

    #progressbar li:after {
        width: 75%;
        left: -38%;
    }

    #progressbar {
        margin: 0 auto 10px auto;
    }

    .mygoals .tombolnext {
        margin-bottom: 15px;
    }

    .box-red {
        margin: 20px 0;
    }

    .tombolgoal {
        margin-top: -50px;
    }

    .table-goals {
        border-collapse: inherit;
        margin-top: 10px;
    }

        .table-goals img {
            margin: 0 auto;
        }

        .table-goals tr.table-detail td, .table-goals2 tr td {
            display: block;
            float: left;
            width: 100%;
            text-align: center;
        }

        .table-goals > tbody > tr > td {
            border-top: none;
        }

        .table-goals tr.noborder td {
            border: none;
        }

        .table-goals tr td.bordertop, .table-goals2 tr td.bordertop {
            border-top: 3px solid #e97721;
        }

    .tombol, .tombol2 {
        padding: 10px 0;
    }

    .center-btn .btn2, .center-btn .btn4 {
        float: none;
        display: inline;
    }

    .margin10, .margin {
        margin-right: 10px !important;
    }

    .centerimage {
        /*left: 40% !important;*/
    }

    .cek {
        margin-left: 0;
        margin-bottom: 20px;
    }

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

    .td-orange a, .td-abu a {
        padding: 2px 10px;
    }

    .btn1, .btn2, .btn3, .btn4 {
        float: left;
        display: flex;
        margin: 5px;
        padding: 10px;
        font-size: small;
        justify-content: space-around;
    }

    .tomboladvisor .btn2, .tomboladvisor .btn4 {
        display: block !important;
    }

    .col-md-12.text-center.tomboladvisor {
        padding-left: 0;
    }

    .tableadvisor td {
        padding: 0 !important;
    }

    .maid .privacy {
        margin-left: 0;
        padding-top: 0;
    }

    .maid p, .maid h4 {
        padding-left: 0;
    }

    .btn-orange, .btn-orange2 {
        padding: 5px 15px;
    }

    .chat span {
        display: none;
    }

    .maid2 {
        padding-left: 15px;
    }

    .maid .row, .maid h2 {
        padding-left: 0 !important;
    }

    .borderorange {
        margin-bottom: 15px;
    }

    .nav-side-menu {
        position: relative;
        width: 100%;
        margin-bottom: 10px;
    }

        .nav-side-menu .toggle-btn {
            display: block;
            cursor: pointer;
            position: absolute;
            right: 10px;
            top: 10px;
            z-index: 10 !important;
            padding: 3px;
            background-color: #ffffff;
            color: #000;
            width: 40px;
            text-align: center;
        }

    .brand {
        text-align: left !important;
        font-size: 22px;
        padding-left: 20px;
        line-height: 50px !important;
    }

    #msform fieldset .col-md-8 {
        padding: 10px;
    }

    #msform fieldset .col-md-4 .img-responsive {
        width: 100%;
    }

    .privacy {
        width: 100%;
        text-align: left;
        padding: 15px;
        border: 1px solid #000;
        font-size: large;
        overflow-y: scroll;
    }
}

@media all and (width: 768px) {
    #msform {
        margin-top: 200px !important;
    }

    .mygoals .tombolnext {
        margin: 15px 0;
    }

    #content2 .tombol {
        margin-bottom: 15px;
        margin-top: 30px;
    }

    #content2 .privacy {
        margin-left: 20px;
    }

    #msform input[type=checkbox] {
        margin-left: 15px;
    }

    #content2 .row .col-md-12 {
        padding-right: 15px;
    }

    .tombol, .tombol2 {
        padding: 15px;
    }

    .investment {
        padding-top: 5vh;
    }
}

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

    .section-padding {
        padding: 100px 0;
        overflow: hidden;
    }

    .ane {
        overflow: hidden;
        text-align: left;
        padding-top: 125px;
    }

    #overview a {
        text-align: left;
        font-size: 11px;
        font-family: 'Oduda-Regular';
        background: #e4e4e4;
        padding: 10px 0;
        color: #000000;
    }

    .page-opat {
        position: relative;
        overflow: hidden;
        padding-top: 160px;
    }

    #ourteam .col-sm-4 {
        cursor: pointer;
        text-align: center;
        margin-right: 20px;
        width: 30.3%;
    }

    .nukanan {
        position: relative;
        /* top: 120px; */
        top: 13px;
        width: 100%;
    }

    .col.col-sm-6.middle {
        width: 100%;
        padding-top: 43px;
    }

    img.des {
        display: none;
    }

    img.mobi {
        display: block !important;
    }

    .colomnatea {
        position: relative;
        right: 0 !important;
        left: 0 !important;
        margin-bottom: 25px !important;
    }

    .col.col-sm-3.nukiri {
        width: 100%;
    }

    .colomnatea h2 {
        font-size: 19px;
    }

    .colomnatea p {
        font-size: 16px;
    }

    .nukiri {
        top: 25px;
    }

    .awal-h img {
        width: 100%;
        padding-bottom: 15px;
    }

    .halah h2 {
        font-size: 25px !important;
        padding-left: 8px;
    }

    .halah p {
        font-size: 11px !important;
        padding-left: 8px;
    }

    .halah-1 p {
        font-size: 15px !important;
        padding-left: 8px;
    }

    .inte-g img {
        margin-top: 19px;
    }

    .boxa img {
        width: 100%;
        margin-top: 0px;
    }
    /*section#whatyouget {
padding-top: 150px;
}*/
    p.spesial {
        font-size: 13px !important;
    }
    /*section#overview {
padding-top: 80px;
}*/
    .tim b {
        font-size: 14px !important;
    }

    .ane .section-heading {
        text-align: center;
        /*padding-left: 232px;*/
    }

    #ourteam .section-heading h2 {
        padding-left: 0;
        text-align: center;
    }

    #shareholder .section-heading h2 {
        padding-left: 0;
        text-align: center;
    }

    .gambarna img {
        height: auto;
    }

    #shareholder img {
        width: 71% !important;
        margin-left: 65px;
        width: 58% !important;
        margin-left: 65px;
        margin: 0 auto;
        float: none !important;
    }

    .dua-col .section-heading {
        text-align: left;
        padding-left: 0px;
    }

    .add-mobile {
        display: block !important;
        padding-left: 16px !important;
    }

    .add {
        padding-left: 1px !important;
        display: none;
    }
    /*.page-opat {
position: relative;
overflow: hidden;
padding-top: 175px;
}*/
    .section-heading {
        padding-top: 20px;
    }

    section.offer.section-padding {
        padding-top: 10px;
    }
}

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

    .colomnatea.nu-genep {
        left: -169px;
        position: relative;
        margin-bottom: -14px;
    }

    .colomnatea.nu-tilu {
        position: relative;
        left: -122px;
        margin-bottom: 16px;
        padding-top: 39px;
    }

    .colomnatea.nu-opat {
        position: relative;
        left: -71px;
        top: -5px;
    }

    .nukanan {
        position: relative;
        /* top: 120px; */
        top: 11px;
    }
}

@media (min-width: 768px) {
    .container-fluid > .navbar-collapse, .container-fluid > .navbar-header, .container > .navbar-collapse, .container > .navbar-header {
        margin-right: -10px;
        margin-left: 0;
    }

    section.offer.section-padding {
        padding-top: 50px;
    }

    footer .theme-logo {
        text-align: justify;
        margin-top: 14px;
    }

    footer .row:first-child {
        padding: 5px 0;
    }

    .col.awal-h {
        padding-right: 26px;
        margin-top: 15px;
    }

    fieldset .col-md-4, fieldset .col-md-8 {
        padding-left: 0;
        padding-right: 0;
    }
    /*.maid .form-control{margin-left:30px;width:20%;}*/
    #newpledge .tombolnext, #newpledge .tombolprev,
    #riskprofile .tombolnext, #riskprofile .tombolprev,
    a#changehistorybackbtn,
    #pledgemore .tombolnext, #pledgemore .tombolprev,
    #invest .tombolnext, #invest .tombolprev,
    #withdraw .tombolnext, #withdraw .tombolprev {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }

    #newpledge p {
        font-size: small;
        margin: 5px 0;
    }

    #pledgemore hr {
        margin-top: 250px;
    }

    #content .row .col-md-4, #content .row .col-md-8,
    #content2 .row .col-md-4, #content2 .row .col-md-8 {
        padding-left: 0;
        padding-right: 0;
    }

    #content2 .row .col-md-12 {
        /*padding-right: 0;*/
    }

    .faqs .row .col-md-8 {
        padding: 0 15px;
    }

    .navbar-nav {
        float: left;
        margin-left: auto;
        margin-top: 12px;
        /* margin-left: 140px; 
    margin-right: 15px;*/
    }

    .modal-dialog {
        width: 750px;
        margin: 100px auto;
    }
}

@media all and (max-width: 768px) {
    .mainscreen {
        padding: 40px;
    }

    #txtTelephone {
        width: 78% !important;
    }

    #divPrivacyPolicy .modal-dialog, #divAccountOpeningAgreement .modal-dialog {
        width: 95%;
    }

    .privacy {
        height: 300px !important;
    }

    .colUpload1, .colUpload2, .colUpload1 .webuploader-pick, .colUpload2 .webuploader-pick {
        width: 100%;
    }

        .colUpload1 p {
            text-align: center;
        }

    .tombol {
        align-items: stretch;
        display: flex;
        justify-content: center;
        flex-direction: column;
        margin-right: 0px !important;
    }

    .paddingtop100 {
        padding-top: 80px !important;
    }

    #progressbarnew {
        margin-top: 0;
    }

    .loader-perm {
        width: 35px;
        height: 35px;
    }
}

@media (max-width: 768px) {
    .table {
        max-width:100% !important;
    }
    .table-row-left {
        padding-left: 0%;
    }

    .table-row-right {
        padding-right: 0%;
    }
    .table input, .table input[name=m] {
        color: #000 !important;
        border-left-width: 1px !important;
        border-radius: 5px;
        font-size:10px !important;
    }
    .form-group {
        margin-bottom:0px !important;
    }
    .table .input-icon > i {
        color: #000 !important;
        font-size: 10px !important;
    }
    .dropdown-content {
        position: relative;
        background-color: #ffffff;
        box-shadow: none;
    }

        .dropdown-content a {
            padding: 0px 16px 0px 32px !important;
        }

    .welcome {
        margin-top: 2%;
        margin-left: 42%;
        line-height: 15px;
    }

    .paddingtop80 {
        padding-top: 0;
    }

    .isi {
        padding: 5px 15px;
    }

    .game {
        padding-bottom: 30px;
    }

    .tombolgame .col-md-6 {
        padding: 15px 0;
    }

    .borderbottomdash {
        padding-bottom: 15px;
    }

    .orangeborderleft {
        border-left: 0px solid #f57e2a;
        border-top: 2px solid #f57e2a;
        margin-top: 30px;
    }

    .voucher {
        width: 60%;
    }

    .paddingtop100 {
        padding: 30px 0;
    }

    .img-mobile, .hr-mobile {
        display: block;
        width: 100%;
    }

    .hr-mobile {
        clear: both;
        border-bottom: 1px solid #d3d3d3;
        padding-bottom: 15px;
    }

    .img-desktop, .img-desktop-kiri {
        display: none;
    }

    .abupadding250, .abupadding100, .abupadding140, .abupadding150,
    .abupadding85, .abupadding75, .abupadding70, .abupadding65,
    .abupadding35, .abupadding30, .abupadding25 {
        margin-top: 20px !important;
        margin-bottom: 20px !important;
    }

    .abupadding50 {
        margin-top: 55px !important;
        margin-bottom: 20px !important;
    }

    .margin70 {
        margin-top: 20px !important;
        margin-bottom: 20px !important;
    }

    .margin50, .margin100 {
        margin: 20px 0
    }

    ; .privacy {
        height: 250px;
    }

    .chat {
        right: 15px;
    }

    #content .row .col-md-4, #content2 .row .col-md-4, #content2 .row .col-md-12 {
        padding-right: 0;
        padding-left: 0;
    }

    #content2 .info {
        padding: 15px;
    }

    #msform input[type=text], #msform input[type=date] {
        width: 100%;
    }

    label {
        text-align: left;
    }

    #textbox {
        float: none !important;
        width: 100% !important;
        margin-bottom: 10px !important;
    }

    #colpadding {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }

    .advisor .col-md-6 {
        width: 98%;
        margin: 0 1% 5%;
    }

    .advisor h2 {
        padding: 1em 0;
        margin-bottom: 0;
    }

    .advisor .tombol {
        padding-bottom: 3em;
    }
}

@media (min-width: 769px) {
    .abupadding-80 {
        margin-top: -80px !important;
        margin-bottom: 20px !important;
    }

    .abupadding-80a {
        margin-top: -80px !important;
        margin-bottom: 30px !important;
    }

    .table-goals2 {
        margin-top: 42px;
    }

    .investment {
        padding-top: 10vh;
    }

    .margintop-60 {
        margin-top: -60px;
    }

    .voucher {
        padding-bottom: 30px;
    }
}

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

    .home-slider .owl-controls {
        position: absolute;
        right: 0;
        bottom: 30px;
    }

    .box-white .col-md-4 {
        width: 33.33333333%;
        float: left;
    }

    .box-white .col-md-8 {
        width: 66.66666667%;
        float: left;
    }
}

@media all and (max-width: 991px) {
    #container img {
        height: 100%;
        width: auto;
        object-fit: cover;
        margin: 0 auto;
        float: none;
        position: unset !important;
    }

    .Goal-i {
        height: 122px !important;
        min-height: unset !important;
    }

    .paddingtop100 {
        padding: 130px 10px 10px 10px !important;
    }
}

@media all and (min-width: 992px) {
    .inner-content {
        padding: 0 12%;
    }
}

@media (min-width: 992px) {
    li#butGetStarted {
        margin-right: 0.3em;
        margin-left: 1em;
    }

    .navbar > .container .navbar-brand {
        padding-right: 0;
    }

    .navbar-header, .container > .navbar-collapse {
        display: flex !important;
        align-items: center;
    }

    .navbar-nav li.dropdown a {
        padding-left: 0.4em;
    }

    .buttona.navbar-right {
        display: flex !important;
        justify-content: center;
        align-items: center;
        transform: translate(-19px, 5.5px);
    }

    .navbar-nav {
        float: left;
        margin-left: auto;
        margin-right: auto;
        margin-top: 12px;
        /* margin-left: 140px; 
    margin-right: 15px;*/
    }

    .modal-dialog {
        width: 750px;
        margin: 100px auto;
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 1) and (max-device-width: 1336px) and (min-device-width: 1024px) and (orientation: portrait) {
    .add-mobile {
        display: none !important;
        padding-left: 16px !important;
    }

    .add {
        padding-left: 35px !important;
        display: block;
    }

    .section-padding {
        padding: 50px 0;
        overflow: hidden;
    }

    .ane {
        overflow: hidden;
        text-align: left;
        padding-top: 125px;
    }
}

@media all and (max-width: 1199px) {
    #progressbarnew {
        margin-top: 150px;
    }
}

@media (min-width: 1400px) {
    .container {
        width: 1200px;
    }

    .img-desktop, .img-desktop-kiri {
        object-fit: cover;
    }
}

@media (min-width: 1600px) {
    .container {
        width: 1400px;
    }
}

@media (min-width: 1800px) {
    .container {
        width: 1600px;
    }
}

@media (min-width: 2000px) {
    .container {
        width: 1800px;
    }
}