/* gutter*/
    .g-1, .gx-1 {
        --bs-gutter-x: 0.25rem;
    }
    .g-2, .gx-2 {
        --bs-gutter-x: 0.5rem;
    }
    
    .g-3, .gx-3 {
        --bs-gutter-x: 1rem;
    }
    
    .g-4, .gx-4 {
        --bs-gutter-x: 1.5rem;
    }
    
    .g-5, .gx-5 {
        --bs-gutter-x: 3rem;
    }
    
    
    
    
    .g-1, .gy-1 {
        --bs-gutter-y: 0.25rem;
    }
    
    .g-2, .gy-2 {
        --bs-gutter-x: 0.5rem;
    }
    
    .g-3, .gy-3 {
        --bs-gutter-x: 1rem;
    }
    
    .g-4, .gy-4 {
        --bs-gutter-x: 1.5rem;
    }
    
    .g-5, .gy-5 {
        --bs-gutter-x: 3rem;
    }
    
    
    /* end gutter */
    
    /* width */
    
    .w-25{width:25%}
    .w-50{width:50%}
    .w-75{width:75%}
    .w-100{width:100%}
    
    /* end width */
    
    
    
    
    /* padding */
    
    .p-0 {
        padding: 0 !important;
    }
    
    .p-1 {
        padding: 15px !important;
    }
    
    .p-2 {
        padding: 30px !important;
    }
    
    .p-3 {
        padding: 45px !important;
    }
    
    .p-4 {
        padding: 60px !important;
    }
    
    .p-5 {
        padding: 75px !important;
    }
    
    .p-6 {
        padding: 90px !important;
    }
    
    
    
    
    
    .pt-0 {
        padding-top: 0 !important;
    }
    
    .pe-0 {
        padding-right: 0 !important;
    }
    
    .pb-0 {
        padding-bottom: 0 !important;
    }
    
    .ps-0 {
        padding-left: 0 !important;
    }
    
    
    .pt-1 {
        padding-top: 15px !important;
    }
    
    .pe-1 {
        padding-right: 15px !important;
    }
    
    .pb-1 {
        padding-bottom: 15px !important;
    }
    
    .ps-1 {
        padding-left: 15px !important;
    }
    
    
    
    
    .pt-2 {
        padding-top: 30px !important;
    }
    
    .pe-2 {
        padding-right: 30px !important;
    }
    
    .pb-2 {
        padding-bottom: 30px !important;
    }
    
    .ps-2 {
        padding-left: 30px !important;
    }
    
    
    
    .pt-3 {
        padding-top: 45px !important;
    }
    
    .pe-3 {
        padding-right: 45px !important;
    }
    
    .pb-3 {
        padding-bottom: 45px !important;
    }
    
    .ps-3 {
        padding-left: 45px !important;
    }
    
    
    
    
    .pt-4 {
        padding-top: 60px !important;
    }
    
    .pe-4 {
        padding-right: 60px !important;
    }
    
    .pb-4 {
        padding-bottom: 60px !important;
    }
    
    .ps-4 {
        padding-left: 60px !important;
    }
    
    
    
    
    .pt-5 {
        padding-top: 75px !important;
    }
    
    .pe-5 {
        padding-right: 75px !important;
    }
    
    .pb-5 {
        padding-bottom: 75px !important;
    }
    
    .ps-5 {
        padding-left: 75px !important;
    }
    
    
    
    
    .pt-6 {
        padding-top: 90px !important;
    }
    
    .pe-6 {
        padding-right: 90px !important;
    }
    
    .pb-6 {
        padding-bottom: 90px !important;
    }
    
    .ps-6 {
        padding-left: 90px !important;
    }
    
    
    
    
    /* end padding */
    
    
    
    /* margin */
    
    
    
    .m-0 {
        margin: 0 !important;
    }
    
    .m-1 {
        margin: 15px !important;
    }
    
    .m-2 {
        margin: 30px !important;
    }
    
    .m-3 {
        margin: 45px !important;
    }
    
    .m-4 {
        margin: 60px !important;
    }
    
    .m-5 {
        margin: 75px !important;
    }
    
    .m-6 {
        margin: 90px !important;
    }
    
    
    
    
    
    .mt-0 {
        margin-top: 0 !important;
    }
    
    .me-0 {
        margin-right: 0 !important;
    }
    
    .mb-0 {
        margin-bottom: 0 !important;
    }
    
    .ms-0 {
        margin-left: 0 !important;
    }
    
    .mt-1 {
        margin-top: 15px !important;
    }
    
    .me-1 {
        margin-right: 15px !important;
    }
    
    .mb-1 {
        margin-bottom: 15px !important;
    }
    
    .ms-1 {
        margin-left: 15px !important;
    }
    
    
    
    
    .mt-2 {
        margin-top: 30px !important;
    }
    
    .me-2 {
        margin-right: 30px !important;
    }
    
    .mb-2 {
        margin-bottom: 30px !important;
    }
    
    .ms-2 {
        margin-left: 30px !important;
    }
    
    
    
    .mt-3 {
        margin-top: 45px !important;
    }
    
    .me-3 {
        margin-right: 45px !important;
    }
    
    .mb-3 {
        margin-bottom: 45px !important;
    }
    
    .ms-3 {
        margin-left: 45px !important;
    }
    
    
    
    
    .mt-4 {
        margin-top: 60px !important;
    }
    
    .me-4 {
        margin-right: 60px !important;
    }
    
    .mb-4 {
        margin-bottom: 60px !important;
    }
    
    .ms-4 {
        margin-left: 60px !important;
    }
    
    
    
    
    .mt-5 {
        margin-top: 75px !important;
    }
    
    .me-5 {
        margin-right: 75px !important;
    }
    
    .mb-5 {
        margin-bottom: 75px !important;
    }
    
    .ms-5 {
        margin-left: 75px !important;
    }
    
    
    
    
    
    .mt-6 {
        margin-top: 90px !important;
    }
    
    .me-6 {
        margin-right: 90px !important;
    }
    
    .mb-6 {
        margin-bottom: 90px !important;
    }
    
    .ms-6 {
        margin-left: 90px !important;
    }
    
    
    
    /* end margin */
    
    
    
    /* column */
    
    
    .col-1 {
        flex: 0 0 8.33333333%!important;
    }
    
    .col-2 {
        flex: 0 0 16.66666667%!important;
    }
    
    .col-3 {
        flex: 0 0 25%!important;
    }
    
    .col-4 {
        flex: 0 0 33.33333333%!important;
    }
    
    .col-5 {
        flex: 0 0 41.66666667%!important;
    }
    
    .col-6 {
        flex: 0 0 50%!important;
    }
    
    .col-7 {
        flex: 0 0 58.33333333%!important;
    }
    
    .col-8 {
        flex: 0 0 66.66666667%!important;
    }
    
    .col-9 {
        flex: 0 0 75%!important;
    }
    
    .col-10 {
        flex: 0 0 83.33333333%!important;
    }
    
    .col-11 {
        flex: 0 0 91.66666667%!important;
    }
    
    .col-12 {
        flex: 0 0 100%!important;
    }
    
    
    /* end column */
    
    
    
    /* background */
    
    
    .bg-primary,
    .btn-primary {
        background-color: var(--color3);
    }

   
 
    .bg-secondary,
    .btn-secondary {
        background-color: var(--color1)!important;
    }


    .bg-success,
    .btn-success {
        background-color: #198754!important;
    }
    .bg-danger,
    .btn-danger {
        background-color: #dc3545!important;
    }
    .bg-warning,
    .btn-warning {
        background-color: #ffc107!important;
    }
    
    .bg-info,
    .btn-info {
        background-color: #0dcaf0!important;
    }
    .bg-light,
    .btn-light {
        background-color: #f8f9fa!important;
    }
    
    .bg-dark,
    .bnt-dark {
        background-color: #212529!important;
    }
    
    
    
    /* end background */
    
    
    
    
    
    
    @media(max-width:1199px) {
    
    	.pe-4{
    		padding-right:15px!important;
    	}
    	
    }
    
    
    
    @media(max-width:767px){
    
       .col-sm-1 {
            flex: 0 0 8.33333333%!important;
        }
    
        .col-sm-2 {
            flex: 0 0 16.66666667%!important;
        }
    
        .col-sm-3 {
            flex: 0 0 25%!important;
        }
    
        .col-sm-4 {
            flex: 0 0 33.33333333%!important;
        }
    
        .col-sm-5 {
            flex: 0 0 41.66666667%!important;
        }
    
        .col-sm-6 {
            flex: 0 0 50%!important;
        }
    
        .col-sm-7 {
            flex: 0 0 58.33333333%!important;
        }
    
        .col-sm-8 {
            flex: 0 0 66.66666667%!important;
        }
    
        .col-sm-9 {
            flex: 0 0 75%!important;
        }
    
        .col-sm-10 {
            flex: 0 0 83.33333333%!important;
        }
    
        .col-sm-11 {
            flex: 0 0 91.66666667%!important;
        }
    
        .col-sm-12 {
            flex: 0 0 100%!important;
            width: 100%;
        }
    
        
    }