/* ==========================================================
   Bootstrap Lite
   Part 1 - Reset, Container, Grid
========================================================== */

*,
*::before,
*::after{
    box-sizing:border-box;
}

.container{
    --bs-gutter-x:30px;
    --bs-gutter-y:0;
    width:100%;
    margin-right:auto;
    margin-left:auto;
    padding-right:calc(var(--bs-gutter-x)/2);
    padding-left:calc(var(--bs-gutter-x)/2);
}

@media (min-width:576px){
    .container{max-width:540px;}
}

@media (min-width:768px){
    .container{max-width:720px;}
}

@media (min-width:992px){
    .container{max-width:960px;}
}

@media (min-width:1200px){
    .container{max-width:1140px;}
}

@media (min-width:1400px){
    .container{max-width:1320px;}
}

/* ==========================
   ROW
========================== */

.row{
    --bs-gutter-x:30px;
    --bs-gutter-y:0;

    display:flex;
    flex-wrap:wrap;

    margin-top:calc(-1 * var(--bs-gutter-y));
    margin-right:calc(-.5 * var(--bs-gutter-x));
    margin-left:calc(-.5 * var(--bs-gutter-x));
}

.row>*{

    flex-shrink:0;

    width:100%;
    max-width:100%;

    margin-top:var(--bs-gutter-y);

    padding-right:calc(var(--bs-gutter-x)/2);
    padding-left:calc(var(--bs-gutter-x)/2);

}

.row > *{
    min-width:0;
}
/* ==========================
   GUTTERS
========================== */

.gx-30{

    --bs-gutter-x:30px;

}

/* ==========================
   COLUMNS
========================== */

@media (min-width:576px){

.col-sm-6{
    flex:0 0 auto;
    width:50%;
}

}

@media (min-width:992px){

.col-lg-3{
    flex:0 0 auto;
    width:25%;
}

.col-lg-4{
    flex:0 0 auto;
    width:33.3333333333%;
}

.col-lg-5{
    flex:0 0 auto;
    width:41.6666666667%;
}

.col-lg-6{
    flex:0 0 auto;
    width:50%;
}

.col-lg-7{
    flex:0 0 auto;
    width:58.3333333333%;
}

.col-lg-9{
    flex:0 0 auto;
    width:75%;
}

}

@media (min-width:1200px){

.col-xl-3{
    flex:0 0 auto;
    width:25%;
}

.col-xl-6{
    flex:0 0 auto;
    width:50%;
}

}

@media (min-width:1400px){

.col-xxl-12{
    flex:0 0 auto;
    width:100%;
}

}

/* ==========================================================
   Bootstrap Lite
   Part 2 - Display & Flex
========================================================== */

/* Display */

.d-none{
    display:none!important;
}

.d-block{
    display:block!important;
}

.d-flex{
    display:flex!important;
}

/* Flex */

.align-items-center{
    align-items:center!important;
}

.justify-content-between{
    justify-content:space-between!important;
}

/* Responsive display */

@media (min-width:992px){

.d-lg-none{
    display:none!important;
}

.d-lg-block{
    display:block!important;
}

.d-lg-flex{
    display:flex!important;
}

}

@media (min-width:1200px){

.d-xl-block{
    display:block!important;
}

}

/* Margins */

.mb-20{
    margin-bottom:20px!important;
}

.mb-40{
    margin-bottom:40px!important;
}

.mb-minus-40{
    margin-bottom:-40px!important;
}

/* Position */

.p-relative{
    position:relative!important;
}

.fix{
    overflow:hidden;
}

.text_center{
    text-align:center;
}

.text_white{
    color:#fff!important;
}