.flex-col{flex-direction: column}
.flex-wrap{flex-wrap:wrap}

.h-left{justify-content: flex-start}
.h-center{justify-content: center}
.h-right{justify-content: flex-end}
.h-space-between{justify-content: space-between}


.v-top{align-items: flex-start}
.v-center{align-items: center}
.v-bottom{align-items: flex-end}
.v-stretch{align-items: stretch}

.v-stretch > .ao_basics_col > div.ao_basics_grid_wrapper{height:100%;}
.v-stretch > .ao_basics_col > div.ao_basics_grid_wrapper > div.ao_basics_grid{height:100%;}

.ew,.sw,.nw,.vsw,.fw{margin:0 auto;box-sizing:border-box}
.ao_basics_grid.ew,.ew{max-width: var(--extended-width)}
.ao_basics_grid.sw,.sw{max-width: var(--smaller-width)}
.ao_basics_grid.nw,.nw{max-width: var(--content-width)}
.ao_basics_grid.vsw,.vsw{max-width: var(--very-small-width)}
.ao_basics_grid.fw,.fw{max-width: var(--full-width)}

.ao_basics_grid.npb{padding-bottom:0;}
.ao_basics_grid.npt{padding-top:0;}
.ao_basics_grid.pbs{padding-bottom:20px;}
.ao_basics_grid.pts{padding-top:20px;}

.ao_basics_grid.pl{padding-left:40px;}
.ao_basics_grid.pr{padding-right:40px;}
.ao_basics_grid.plb{padding-left:80px;}
.ao_basics_grid.prb{padding-right:80px;}
.ao_basics_grid.pls{padding-left:20px;}
.ao_basics_grid.prs{padding-right:20px;}

.ao_basics_grid_wrapper.img{
    position:relative;
    overflow: hidden;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.ao_basics_grid_wrapper.img > picture{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block
}
.ao_basics_grid_wrapper.img > picture > img{
    object-fit: cover;
    width: 100%;
    height: 100%;
    display: block
}
.ao_basics_grid > .ao_basics_col > *:first-child{margin-top:0;}
.ao_basics_grid > .ao_basics_col > *:last-child{margin-bottom:0;}


.ao_basics_grid{display:flex;gap:20px;box-sizing: border-box;max-width:var(--content-width);}
.ao_basics_grid.no-gap{gap:unset;}
.ao_basics_grid.small-gap{gap:10px;}
.ao_basics_grid.big-gap{gap:40px;}

.ao_basics_grid > .ao_basics_col{width:100%}

.ao_basics_grid.grid-auto > .ao_basics_col{width:auto}
.ao_basics_grid.grid-20 > .ao_basics_col{width:17%;flex:auto 1 1;}
.ao_basics_grid.grid-25 > .ao_basics_col{width:21%;flex:auto 1 1;}
.ao_basics_grid.grid-32 > .ao_basics_col{width:32%;flex:auto 0 1;}
.ao_basics_grid.grid-33 > .ao_basics_col{width:26%;flex:auto 1 1;}
.ao_basics_grid.grid-50 > .ao_basics_col{width:35%;flex:auto 1 1;}


.ao_basics_grid.grid-25-75 > .ao_basics_col:nth-child(1){width:25%}
.ao_basics_grid.grid-25-75 > .ao_basics_col:nth-child(2){width:75%}
.ao_basics_grid.grid-75-25 > .ao_basics_col:nth-child(1){width:75%}
.ao_basics_grid.grid-75-25 > .ao_basics_col:nth-child(2){width:25%}

.ao_basics_grid.grid-40-60 > .ao_basics_col:nth-child(1){width:40%}
.ao_basics_grid.grid-40-60 > .ao_basics_col:nth-child(2){width:60%}
.ao_basics_grid.grid-60-40 > .ao_basics_col:nth-child(1){width:60%}
.ao_basics_grid.grid-60-40 > .ao_basics_col:nth-child(2){width:40%}

.ao_basics_grid > .ao_basics_col.ao_basics_col-20 {width:20%}
.ao_basics_grid > .ao_basics_col.ao_basics_col-25 {width:25%}
.ao_basics_grid > .ao_basics_col.ao_basics_col-33 {width:33%}
.ao_basics_grid > .ao_basics_col.ao_basics_col-40 {width:40%}
.ao_basics_grid > .ao_basics_col.ao_basics_col-50 {width:50%}
.ao_basics_grid > .ao_basics_col.ao_basics_col-60 {width:60%}
.ao_basics_grid > .ao_basics_col.ao_basics_col-75 {width:75%}
.ao_basics_grid > .ao_basics_col.ao_basics_col-100 {width:100%}

.ao_basics_form > .ao_basics_grid {padding: 0;gap:20px;}

.bs{
    box-shadow: 0 3px 6px #00000029;
    border: 1px solid #D8D8D8;
}

@media only screen and (max-width: 1250px){
    .ao_basics_grid_wrapper.lvl1{padding-left:calc(env(safe-area-inset-left) + 40px); padding-right:calc(env(safe-area-inset-right) + 40px);}
/*    .ao_basics_grid_wrapper.lvl1.no-bg{padding-left:0px;padding-right:0px;}*/
/*    .ao_basics_grid_wrapper.lvl1.no-bg .ao_basics_grid_wrapper.lvl2.no-bg{padding-left:40px;padding-right:40px;}*/
    .ao_basics_grid_wrapper.lvl1 > .ao_basics_grid > .ao_basics_col:first-child > .ao_basics_grid_wrapper.lvl2 {margin-left:-40px;}
    .ao_basics_grid_wrapper.lvl1 > .ao_basics_grid > .ao_basics_col:first-child > .ao_basics_grid_wrapper.lvl2.no-bg {margin-left:0;}
    .ao_basics_grid_wrapper.lvl1 > .ao_basics_grid > .ao_basics_col:last-child > .ao_basics_grid_wrapper.lvl2 {margin-right:-40px;}
    .ao_basics_grid_wrapper.lvl1 > .ao_basics_grid > .ao_basics_col:last-child > .ao_basics_grid_wrapper.lvl2.no-bg {margin-right:0;}
}

@media only screen and (max-width: 800px){
    .ao_basics_grid_wrapper.lvl1 > .ao_basics_grid {flex-direction: column;/* gap: 0; */}
    .ao_basics_grid_wrapper.lvl1 > .ao_basics_grid .ao_basics_col{width:100%;}
    .ao_basics_grid_wrapper.lvl1 > .ao_basics_grid > .ao_basics_col > .ao_basics_grid_wrapper.lvl2 {margin-left:-40px!important;margin-right:-40px!important;}
    .ao_basics_grid_wrapper.lvl1 > .ao_basics_grid > .ao_basics_col > .ao_basics_grid_wrapper.lvl2.no-bg {margin-left:0!important;margin-right:0!important;}
    .ao_basics_grid_wrapper.lvl2 > .ao_basics_grid {flex-direction: column}
    .ao_basics_grid_wrapper.lvl2 > .ao_basics_grid .ao_basics_col{width:100%;}
    .ao_basics_grid_wrapper.lvl3 > .ao_basics_grid {flex-direction: column}
    .ao_basics_grid_wrapper.lvl3 > .ao_basics_grid .ao_basics_col{width:100%;}

}

@media only screen and (max-width: 600px){
    .ao_basics_grid_wrapper.lvl1{padding-left:calc(env(safe-area-inset-left) + 20px); padding-right:calc(env(safe-area-inset-right) + 20px);}
/*    .ao_basics_grid_wrapper.lvl1.no-bg{padding-left:0px;padding-right:0px;}*/
/*    .ao_basics_grid_wrapper.lvl1.no-bg .ao_basics_grid_wrapper.lvl2.no-bg{padding-left:20px;padding-right:20px;}*/
    .ao_basics_grid_wrapper.lvl1 > .ao_basics_grid > .ao_basics_col > .ao_basics_grid_wrapper.lvl2 {margin-left:-20px!important;margin-right:-20px!important;}
    .ao_basics_grid_wrapper.lvl1 > .ao_basics_grid > .ao_basics_col > .ao_basics_grid_wrapper.lvl2.no-bg {margin-left:0!important;margin-right:0!important;}

    .ao_basics_grid.pl{padding-left:20px;}
    .ao_basics_grid.pr{padding-right:20px;}
    .ao_basics_grid.plb{padding-left:40px;}
    .ao_basics_grid.prb{padding-right:40px;}
    .ao_basics_grid.pls{padding-left:20px;}
    .ao_basics_grid.prs{padding-right:20px;}

}