a{
    color: rgb(0, 130, 197);
    text-decoration: none!important;
}
body{
    font-family: circularstd;
}
@font-face {
    font-family: circularstd;
    src: url('../fonts/CircularStd-Medium.ttf');
  }
.oid-header {
    background-size: cover;
    width: 100%;
}

.oid-header.home{
    background: rgb(249 250 251);
    background-size: cover;
}
.oid-header.order,.oid-content.checkout{
    background: rgb(249 250 251);
    background-size: cover;
}
.oid-header.inventory{
    background: rgb(249 250 251);
    background-size: cover;
}
.oid-header.shipping{
    background: rgb(249 250 251);
    background-size: cover;
}
.oid-header.partner{
    background: rgb(249 250 251);
    background-size: cover;
}
.oid-header.pricing{
    background: rgb(249 250 251);
    background-size: cover;
}

.oid-header h4{
    font-family: circularstd;
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 20px;
    text-transform: uppercase;
    margin-left: 10px;
}
.oid-header.partner{
    padding-top: 250px;
}
.oid-header.partner h4{
    font-family: circularstd;
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 20px;
    text-transform: uppercase;
    color: rgb(0, 130, 197);
}
.oid-header.partner p{
    margin-top: 15px;
    font-family: circularstd;
    font-style: normal;
    font-weight: normal;
    font-size: 20px;
    line-height: 35px;
    text-align: center;
    color: #828282;
}
.oid-header h4 img{
    margin-right: 10px;
}
.oid-header.order h4{
    color: #2F80ED;
}
.oid-header.inventory h4{
    color: #F2994A;
}
.oid-header.shipping h4{
    color: #219653;
}
.oid-header h1 {
    font-family: circularstd;
    font-style: normal;
    font-weight: bold;
    font-size: 59px;
    line-height: 70px;
    letter-spacing: -0.03em;
    color: #333333;
}


.oid-header .oid-header-right {
    padding-top: 120px;
}

.oid-header p {
    font-family: circularstd;
    font-style: normal;
    font-weight: normal;
    font-size: 20px;
    line-height: 35px;
    color: #828282;
}

.nav-link {
    font-family: circularstd;
    font-style: medium;
    font-weight: 500;
    font-size: 18px;
    line-height: 20px;
    color: #333;
    margin-right: 25px;
}
.navbar {
    background: none;
}

.btn-oid {
    font-family: circularstd;
    background-color: rgb(0, 130, 197);
    padding: 10px 15px;
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 20px;
    border:none;
    border-radius: 25px;
    text-align: center;
    color: #FFFFFF;
}

.btn-oid-inverse {
    background-color: #FFFFFF;
    padding: 10px 15px;
    font-family: circularstd;
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 20px;
    border:none;
    border-radius: 25px;
    /* identical to box height */
    text-align: center;
    /* White */
    color: #0082c5;
}

.btn-oid2 {
    font-family: circularstd;
    background: rgb(0, 130, 197);
    border-radius: 8px;
    padding: 10px 15px;
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 20px;
    border:none;
    text-align: center;
    color: #FFFFFF;
}

.oid-content{
    background-color: #fff;
    padding:50px 0;
    padding-top:0;
}

.oid-content h4{
    font-family: circularstd;
    font-style: normal;
    font-weight: 500;
    font-size: 20px;
    line-height: 25px;
    color: rgb(0, 130, 197);
}

.oid-content p{
    font-family: circularstd;
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 28px;
    color: #828282;
}

.oid-content a{
    font-family: circularstd;
    color: rgb(0, 130, 197);
    text-decoration: none;
    font-weight: bold;
}

.row-oid-content h4{
    font-family: circularstd;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 18px;
    text-transform: uppercase;
    color: #828282;
}
.row-oid-content h2{
    font-family: circularstd;
    font-style: normal;
    font-weight: bold;
    font-size: 31px;
    line-height: 40px;
    letter-spacing: -0.03em;
    color: #333333;
}
.row-oid-content p{
    font-family: circularstd;
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 28px;
    /* or 175% */
    /* Gray 3 */
    color: #828282;
}
.oid-content .pricing{
    background-color: #fff;
    padding: 20px 25px;
    border-radius: 20px;
}
.btn-oid-more{
    font-family: circularstd;
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 20px;
    color: #56175D;
    border:none;
    background-color: #fff;
}
.oid-section{
    background: rgb(249 250 251);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width:100%;
}
.oid-section h4{
    font-family: circularstd;
    font-style: normal;
    font-weight: 500;
    font-size: 20px;
    line-height: 25px;
    /* Purple 2 */
    color: #000000;
}
.oid-section h2{
    font-family: circularstd;
    font-style: normal;
    font-weight: bold;
    font-size: 39px;
    line-height: 55px;
    letter-spacing: -0.03em;
    /* White */
    color: #000000;
}
.oid-section p{
    font-family: circularstd;
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 28px;
    color: #000000;
    opacity: 0.6;
}
.oid-section h3{
    font-family: circularstd;
    font-style: normal;
    font-weight: normal;
    font-size: 20px;
    line-height: 26px;
    /* or 130% */
    /* White */
    color: #FFFFFF;
}
.oid-product{
    background: #FAFAFA;
    padding: 100px 0 50px 0;
    width:100%;
}
.oid-product h4{
    font-family: circularstd;
    font-style: normal;
    font-weight: 500;
    font-size: 20px;
    line-height: 25px;
}
.oid-product h2{
    font-family: circularstd;
    font-style: normal;
    font-weight: normal;
    font-size: 39px;
    line-height: 55px;
    letter-spacing: -0.03em;
    color: #333333;
}
.oid-product h5{
    font-family: circularstd;
    font-style: normal;
    font-weight: normal;
    font-size: 20px;
    line-height: 26px;
    color: #333333;
}
.oid-product p{
    font-family: circularstd;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 24px;
    color: #333333;
    opacity: 0.6;
}
.oid-product.order h4{
    color: #2F80ED;
}
.oid-product.inventory h4{
    color: #F2994A;
}
.oid-product.shipping h4{
    color: #219653;
}
.oid-product.shipping .header{
    background-color: #fff;
    margin-bottom: 25px;
}
.oid-product.shipping .header h3{
    font-family: circularstd;
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 55px;
    text-align: center;
    letter-spacing: 0.4em;
    text-transform: uppercase;
    color: #333333;
}
.oid-product-featured{
    background-color: #fff;
    padding:50px 0;
    width: 100%;
}
.oid-product-featured.shipping h3{
    font-family: circularstd;
    font-style: normal;
    font-weight: 500;
    font-size: 20px;
    line-height: 25px;
    color: #219653;
}
.oid-product-featured.oid-header.shipping h2{
    font-family: circularstd;
    font-style: normal;
    font-weight: normal;
    font-size: 39px;
    line-height: 55px;
    letter-spacing: -0.03em;
    color: #333333;
}
.row-oid-product h4{
    font-family: circularstd;
    font-style: normal;
    font-weight: bold;
    font-size: 16px;
    line-height: 24px;
    color: #333333;
    margin-top: 25px;
}
.row-oid-product p{
    font-family: circularstd;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 18px;
    color: #828282;
}
.row-oid-product .col-featured{
    background: #FFFFFF;
    box-shadow: 0px 40px 60px rgba(0, 0, 0, 0.1);
    border-radius: 13px;
    padding:10px 15px;
}
.oid-preview{
    
    width: 100%;
    height: 500px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position-x: right;
}
.oid-preview h3{
    font-family: circularstd;
    font-style: normal;
    font-weight: 500;
    font-size: 20px;
    line-height: 25px;
    /* Ungu */
    color: rgb(0, 130, 197);
}
.oid-preview h2{
    font-family: circularstd;
    font-style: normal;
    font-weight: bold;
    font-size: 39px;
    line-height: 55px;
    letter-spacing: -0.03em;
    color: #333333;
}
.oid-preview b{
    font-family: circularstd;
    font-style: normal;
    font-weight: bold;
    font-size: 16px;
    line-height: 24px;
    color: #333333;

}
.oid-preview p{
    font-family: circularstd;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 18px;
    color: #828282;
}
.oid-logo-partner{
    background: #F6F9FC;
    padding: 80px 0;
}
.oid-footer.checkout{
    padding:5px 0;
    background:none;
}
.oid-footer.checkout p.small{
    font-family: circularstd;
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 20px;
    color: #4F4F4F;
    opacity: 0.4;
}
.oid-footer{
    background: #0082c5;
    padding: 80px 0;
    min-height: 320px;
}
.oid-footer p.small{
    font-family: circularstd;
    font-style: normal;
    font-weight: normal;
    font-size: 12px;
    line-height: 20px;
    color: #FFFFFF;
    opacity: 0.4;
}
.oid-footer h3{
    font-family: circularstd;
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 20px;
    color: #FFFFFF;
    opacity: 0.7;
}
.oid-footer ul{
    list-style-type: none;
    padding-left: 0;
}
.oid-footer li{
    margin-left: 0;
}
.oid-footer ul li a{
    font-family: circularstd;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 18px;
    color: #FFFFFF;
    padding:0;
    margin:0;
    text-decoration: none;
}
.carousel-control-prev-icon {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%230082c5' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E");
}

.carousel-control-next-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%230082c5' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E") !important;
}
.carousel-item{
    transition: transform 1s ease, opacity .5s ease-out
}
.dropdown-menu{
    border:none !important;
}
.pricing ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden; 
    border: 1px solid #E0E0E0;
    border-radius: 20px;
}
.pricing ul li{
    color: #828282;
    float: left;
    background: #FAFAFA;
    box-sizing: border-box;
}
.pricing ul li.left{
    color: #828282;
    float: left;
    background: #FAFAFA;
    border-radius: 20px;
    box-sizing: border-box;
}
.pricing ul li.right{
    color: #828282;
    float: left;
    background: #FAFAFA;
    border-radius: 20px;
    box-sizing: border-box;
}
.pricing ul li label{
    padding:10px 50px;
}
.pricing ul li.right label{
    padding:10px 53px 10px 52px;
}
.pricing ul li label:hover{
    background-color: rgb(0, 130, 197);
    color:#fff;
    cursor: pointer;
    border-radius: 20px;
}
.pricing ul li input[type="radio"]{
    display: none;
}
.pricing ul li input[type="radio"]:checked+label{ 
    background-color: rgb(0, 130, 197);
    color:#fff;
    border-radius: 20px;
} 
.col-pricing:hover > .header-col-pricing{
    /*background: rgb(0, 130, 197);
    color:#fff;*/
    cursor: pointer;
    border-radius: 8px 8px 0 0;
}
.col-pricing .content-col-pricing:hover{
    cursor: pointer;
}
.row-pricing .col-pricing{
    
    /*
    border: 1px solid #E0E0E0;
    box-sizing: border-box;
    border-radius: 8px;
    */
    margin-top: 80px;
    border-radius: 20px;
}
.row-pricing .header-col-pricing{
    background: #FAFAFA;
    color:#333333;
    padding:20px;
}
.row-pricing .header-col-pricing h3{
    font-family: circularstd;
    font-style: normal;
    font-weight: 500;
    font-size: 20px;
    line-height: 25px;
    text-align: center;
}
.row-pricing .header-col-pricing h2{
    font-family: circularstd;
    font-style: normal;
    font-weight: bold;
    font-size: 39px;
    line-height: 49px;
    text-align: center;
    letter-spacing: -0.03em;
}
.row-pricing .header-col-pricing h2 sup,.row-pricing .header-col-pricing h2 sub{
    font-family: circularstd;
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 20px;
    text-align: center;
    color: #828282;
}
.row-pricing .col-pricing .footer-col-pricing{
    border-top: 1px dashed #E0E0E0;
    padding:10px 25px;
}
.row-pricing .col-pricing .footer-col-pricing .btn-oid{
    border:1px solid rgb(0, 130, 197);
    padding:10px 0;
    color:rgb(0, 130, 197);
    text-align: center;
    border-radius: 25px;
    background-color: #fff;
    width: 100%;
    max-width: 250px;
}
.col-pricing:hover > .footer-col-pricing .btn-oid{
    background: rgb(0, 130, 197);
    color:#fff;
    cursor: pointer;
    border:1px solid #333;
}
.oid-content.pricing .row-pricing{
    margin: 50px 0;
}
.oid-content.pricing .row-pricing .col-pricing{
    padding:25px 15px;
}
.oid-pricing{
    background: #F6F9FC;
}
.oid-pricing h4{
    font-family: circularstd;
    font-style: normal;
    font-weight: 500;
    font-size: 20px;
    line-height: 25px;
    text-align: center;
    color: rgb(0, 130, 197);
}
.oid-pricing h3{
    font-family: circularstd;
    font-style: normal;
    font-weight: normal;
    font-size: 39px;
    line-height: 55px;
    text-align: center;
    letter-spacing: -0.03em;
    color: #333333;
}
.oid-pricing .content-packet{
    background: #FFFFFF;
    border-radius: 5px;
}
.oid-pricing .content-packet tr .row-addons{
    background: #F2F2F2;
    border-radius: 5px;
}
.oid-pricing .content-packet table tr td,.oid-pricing .content-packet table tr th{
    border-style: dashed;
}
.oid-content.checkout .register{
    background: #FFFFFF;
    border-radius: 13px;
    padding:25px;
}
.oid-content.checkout .register h3{
    font-family: circularstd;
    font-style: normal;
    font-weight: bold;
    font-size: 25px;
    line-height: 40px;
    letter-spacing: -0.03em;
    color: #333333;
}
.oid-content.checkout .register label{
    font-family: circularstd;
    font-style: normal;
    font-weight: normal;
    font-size: 13px;
    line-height: 20px;
    color: #333333;
}
.oid-content.checkout .register label small{
    font-family: circularstd;
    font-style: normal;
    font-weight: normal;
    font-size: 13px;
    line-height: 20px;
    color: #828282;
}
.oid-content.checkout .register .form-group{
    margin-bottom: 15px;
}
.oid-content.checkout .register .header-register{
    background: #EBFFF3;
    border: 1px solid #219653;
    box-sizing: border-box;
    box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    padding:10px 0 10px 10px;
    position: relative;
}
.oid-content.checkout .register .header-register .right-top{
    position: absolute;
    top: 0px;  
    right: 0px;
    background: url('../images/right-top.png');
    background-position: right;
    width: 200px;
    text-align: right;
    height:47px;
}
.oid-content.checkout .register .header-register .right-top p{
    color:#fff;
    transform: rotate(30deg);
    margin-top: -32px;
}
.oid-content.checkout .register .header-register h3{
    font-family: circularstd;
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 20px;
    color: #333333;
    margin:0;
    padding:0;
}
.oid-content.checkout .register .header-register p{
    font-family: circularstd;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 18px;
    color: #828282;
}
.oid-content.checkout .register .body-register{
    background: #F6F9FC;
    border-radius: 8px;
    margin-top: 25px;
    padding:10px;
}
.oid-content.checkout .register .body-register p{
    font-family: circularstd;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 18px;
    color: #333333;
}
.oid-content.checkout .register .footer-register{
    border-top: 1px dashed #BDBDBD;
    padding: 20px 10px 10px 10px;
    margin-top: 25px;
}

.oid-content.checkout .register .footer-register p{
    font-family: circularstd;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 10px;
    color: #828282;
}

.oid-content.checkout .register .footer-register h2{
    font-family: circularstd;
    font-style: normal;
    font-weight: bold;
    font-size: 31px;
    line-height: 40px;
    letter-spacing: -0.03em;
    color: #333333;
}
.oid-content.checkout .register .form-register #ck-button label span{
    text-align:left;
    padding:10px;
    font-family: circularstd;
    display:block;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 30px;
    color: #4F4F4F;
    height: 120px;
}
.oid-content.checkout .register .form-register #ck-button label span h4{
    font-family: circularstd;
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 20px;
    color: #333333;
}
.oid-content.checkout .register .form-register #ck-button label span p{
    font-family: circularstd;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 18px;
    color: #828282;
}
.oid-content.checkout .register .form-register #ck-button label span.period{
    text-align:left;
    padding:10px 50px;
    font-family: circularstd;
    display:block;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 30px;
    color: #4F4F4F;
    height: auto;
}


#ck-button {
    margin-right: 5px;
    background-color:#fff;
    border-radius:4px;
    border:1px solid #D0D0D0;
    float:left;
}

#ck-button:hover {
    background:#D7EAFD;
    cursor: pointer;
}

#ck-button label {
    float:left;
}

#ck-button label span {
    text-align:center;
    padding:0 10px;
    font-family: circularstd;
    display:block;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 30px;
    color: #4F4F4F;
}

#ck-button label input {
    position:absolute;
    top:-20px;
}

#ck-button input:checked + span {
    background-color:#D7EAFD;
    color:#4F4F4F;
}

.oid-content.login{
    background: url(../images/bg-user.png);
    background-size: cover;
}

.oid-content.login .login{
    background: #fff;
    padding:25px;
    margin-top: 25px;
    border-radius: 13px;
}
.oid-content.login .login h3{
    font-family: circularstd;
    font-style: normal;
    font-weight: bold;
    font-size: 25px;
    line-height: 40px;
    letter-spacing: -0.03em;
    color: #333333;
    border-bottom: 1px dashed #BDBDBD;
    padding-bottom: 25px;
    margin-bottom: 25px;
}
.oid-content.login .login a{
    font-family: circularstd;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 20px;
    text-align: right;
    text-decoration-line: underline;
}
.oid-content.login .login label{
    font-family: circularstd;
    font-style: normal;
    font-weight: normal;
    font-size: 13px;
    line-height: 20px;
    color: #333333;
}
.oid-content.login .login .form-group{
    margin-bottom: 25px;
}
.oid-content.login .login .form-group .form-control{
    background: #FFFFFF;
    border: 1px solid #E0E0E0;
    box-sizing: border-box;
    border-radius: 8px;
}
.oid-content.login .login .form-group .form-control::placeholder{
    font-family: circularstd;
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 20px;
    color: #BDBDBD;
}
.oid-footer.login-footer{
    padding:5px 0;
    background:none;
}

.oid-footer.login-footer p{
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 20px;
    text-align: center;
    color: #4F4F4F;
    opacity: 0.4;
}

.accordion-button{
    font-family: circularstd;
    font-style: normal;
    font-weight: normal;
    font-size: 20px;
    line-height: 26px;
    color: #333333;
    margin:10px;
}
.accordion-body {
    font-family: circularstd;
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 24px;
    color: #333333;
    opacity: 0.6;
}
.navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(148,77,156, 0.7)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}

.sub-title {
    color: #999;
}

@media (min-width: 768px){  
    .img-lp-builder{width: 70%}
    .nav-link.active{
        border:1px solid rgb(0, 130, 197);
        padding:10px 0;
        width: 150px;
        color:rgb(0, 130, 197);
        text-align: center;
        border-radius: 25px;
    }
    .dropdown-menu {
        min-width: 300px !important;
        border-radius: 20px !important;
        padding:15px 0;
    }
    .dropdown-item {
        padding:15px !important; 
    }
    .dropdown-item b{
        font-family: circularstd;
        font-style: normal;
        font-weight: bold;
        font-size: 16px;
        line-height: 20px;
        color: #333333;
    }
    .dropdown-item p{
        font-family: circularstd;
        font-style: normal;
        font-weight: normal;
        font-size: 13px;
        line-height: 20px;
        color: #828282;
    }
    .row-oid-content.left,.row-oid-content.right{
        margin-top:50px;
    }
    .oid-section{
        padding:80px 0 80px 0;
        /*height: 420px;*/
    }
    .oid-section .col-margin{
        margin-right: 50px;
    }
    .oid-header .oid-header-left {
        padding-top: 160px;
    }
    .oid-preview{
        padding:50px 0 50px 0;
    }
    .oid-preview .left{
        padding-top:150px;
    }
    .oid-preview .col-preview{
        padding:15px 10px;
        border-radius:0 0 13px 13px;
    }
    .oid-preview .col-preview.active{
        background-color: #fff;
        border-top: 2px solid  #9B51E0;
        box-shadow: 1px 24px 35px -9px rgba(0,0,0,0.3);
    }
    .oid-product.shipping{
        padding-top: 50px;
    }
    .row-oid-product{
        padding:50px 0;
    }
    .oid-header{
        height: 700px;
        margin-top:-100px;
    }
    .oid-header.order{
        height: 630px;
        margin-top:-100px;
    }
    .oid-content .pricing{
        margin-top: -150px;
    }
    .oid-footer p.small{
        margin-top:50px;
    }
    .carousel-preview{
        height: 420px;
    }
    .carousel-preview-logistic{
        height: 400px;
    }
    .oid-pricing .content-packet{
        padding:15px 20px;
    }
    .oid-pricing{
        padding: 100px 0;
    }
    .oid-header.order,.oid-content.checkout{
        background-size: cover;
    }
}
@media (max-width: 767px){
    .oid-header{
        padding:50px 0;
    }
    .oid-header h1{
        font-size: 32px;
        line-height: 50px;
    }
    .oid-header-left button {
        width: 100%!important;
        margin: 8px 0 ;
    }
    .oid-header p{
        font-size: 16px;
        line-height: 24px;
    }
    .oid-header .oid-header-right {
        padding-top: 40px;
    }
    .row-oid-content.left,.row-oid-content.right{
        margin-top:25px;
    }

    .fitur-title{
        margin-top: 20px;
        font-size: 18px!important;
        line-height: 38px!important;
    }

    .oid-section{
        padding:50px 0;
    }
    .oid-preview{
        padding:50px 0 50px 0px;
    }
    .carousel-preview{
        height: 250px;
    }
    .pricing ul li label{
        padding:10px 20px;
    }
    .pricing ul li.right label{
        padding:10px 22px;
    }
    .oid-header.partner{
        padding-top: 50px;
    }
    .row-pricing ,.col-pricing{
        margin-bottom: 25px;
    }
    .oid-pricing .content-packet{
        padding:5px 5px;
    }
    .oid-pricing{
        padding: 50px 0;
    }
    .oid-content.checkout .register{
        margin-top: 25px;
    }
    .oid-content.checkout .register .form-register #ck-button label span{
        text-align:center;
        padding:10px 30px;
        font-family: circularstd;
        display:block;
        font-style: normal;
        font-weight: normal;
        font-size: 14px;
        line-height: 30px;
        color: #4F4F4F;
    }
    .oid-content.checkout .register .form-register #ck-button{
        margin-top: 15px;
    }

    .row-pricing .col-pricing{
      margin-top: 20px;
    }
    .oid-footer{margin-top: 100px;}
    .img-fluid{max-width:100%!important;}
}

.content-center {
    display: flex;
    justify-content: center;
}
.ecomm-logo{
  width: 80px;
  /*
  -moz-box-shadow: 10px 10px 50px #ccc;
    -webkit-box-shadow: 10px 10px 50px #ccc;
    box-shadow: 10px 10px 50px #ccc;
  */
    border-radius: 20px;
}

@media (max-width: 768px) { /* You can adjust this breakpoint as needed for "small screen" */
  video {
    width: 98% !important;
    height: auto !important;
  }
}
video{
     box-shadow: 0px 4px 18px rgba(0, 0, 0, 0.1);   
}
@media (max-width: 480px) {
  .btn-full-sm{width:100%;}
  .btn-margin-20{margin-top:20px;}
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.main-title {
  animation: fadeIn 1s ease-in forwards; 
}
.secondary-title {
    animation: fadeIn 1s ease-in forwards; 
}