/* ==============================
   Phone
   ============================== */
@media (max-width: 580px) and (min-width: 320px) {
    .col-xs-12{
        width: 100%;
    }
    .h-xs-auto{
        height: auto !important;
    }
    .darkside:before { 
        min-width: 100%;
    }
    body .info--hero {
        padding: 40px 15px;
        width: 100%;
    }
    section{
        overflow: hidden !important;
    }
    body .info--hero div span {
        font-size: 7vw;
    }
    .mb-xs-180 {
        margin-bottom: 180px !important;
    }
    .mb-xs-80 {
        margin-bottom: 80px !important;
    }
    .mb-xs-70 {
        margin-bottom: 70px !important;
    }
    .mb-xs-40 {
        margin-bottom: 40px !important;
    }
    .mb-xs-20 {
        margin-bottom: 20px !important;
    }
    .mb-xs-0 {
        margin-bottom: 0px !important;
    }
    .text-xs-center{
        text-align: center;
    }
    body .l--60px{
        margin-left: 0 !important;
    }
    .info--video--aside{
        display: none !important;
    }

    body .box--container-top5>.item,
    body .box--container-top5>.item:nth-child(3),
    body .box--container-top5>.item:nth-child(4),
    body .box--container-top5>.item:nth-child(5) {
        flex-basis: 300px;
        width: 100% !important;
    }
    body .box--container-top5 .item--info { 
        font-size: 4.3vw; 
    }
    body .box--container-top5 .item--info span { 
        font-size: 13vw;
    }
    body .box--reverse span {
        font-size: 6vw;
    }
    .lateral--bar-ng,
    body .bar--balck--vertical {
        background: #0F0E0C;
        display: flex;
        writing-mode: initial;
        justify-content: space-between;
        height: auto;
        width: 100%;
    }
    .flex-xs-wrap{
        flex-wrap: wrap;
    }
    .lateral--bar-ng h4,
    body .bar--balck--vertical span {
        font-size: 4.5vw;
        margin-bottom: 0 !important;
        line-height: 1.3;
        transform: rotate(0deg) !important;
        padding: 20px 30px;
        text-transform: uppercase;
    }
    body .inf--lifechange img{
        width: 25%;
    }
    body .inf--lifechange span {
        font-size: 5vw;
    }
    body .list--box-x4 h2 {
        font-size: 10vw;
        margin-bottom: 15px;
    }
    .list--box-x4 span {
        font-size: 4vw;
    }
    .icon--dr img { 
        height: 35px;
    }
    ul.box--next-gen li {
        width: 25%;
        flex: 1;
        flex-basis: 50%;
        border: 2px solid black;
        height: 190px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        min-height: 0%;
        text-align: center;
        text-transform: uppercase;
        padding: 0 25px;
    }
    .box--next-gen img{
        height: 90px;
    }
    .box--next-gen h5 {
        font-size: 3vw;
        line-height: 1.2;
    }

    .digital--reach--x4>div {
        border-right: 2px solid #EBE9E1;
        flex: 1;
        flex-basis: 25%;
        color: #EBE9E1;
        width: 50%;
        text-align: center;
        margin-bottom: 60px;
    }
    .digital--reach--x4>div:nth-child(even) {
        border: 0 !important;
    }
    .digital--reach--x4>div h3 {
        font-size: 4vw;
        text-transform: uppercase;
        line-height: 1.4;
        min-height: 90px;
    }
    .mb-280 {
        margin-bottom: 80px;
    }
    .xrotating {
        margin-bottom: 140px;
    }
    .xrotating img{
        max-width: 50%;
    }
    .box--2 { 
        gap: 10px; 
    }

    h1.h1-big {
        font-size: 40vw;
        line-height: 1;
    }
    .h1-big--title {
        font-size: 8vw;
        text-align: center;
    }
    .box--container-top5 {
        padding: 0px;
    }
    body .box--container-top5 .item--info {
        font-size: 6.3vw;
        line-height: 1;
    }
    .embedVideo {
        width: 100%;
        height: 265px;
    }
    .list--box-x4.x2 li {
        max-width: 50%;
    }
    body .carrousels {
        max-width: calc(200% + 25px) !important;
        width: 200%;
    }
    p.mb-120{font-size: 4vw !important;}
    .digital--reach--x4.x5>div {
        max-width: 100%;
    }
    .fzvw4{
        font-size: 4vw !important;
    }
    .wmax50{
        max-width: 50px;
    }
    body .big--stroke--title h2{
        line-height: 1;
    }
    body .col-md-6.p0{
        padding: 0 15px !important
    }
    .aic-xs-off{align-items: initial !important;}
        body .pr-80 {
            padding-right: 0px;
        }
    body .border-xs-off{
        border-color: transparent !important;
    }
    footer img{
        max-width: 170px !important;
    }
    body .bar--balck--vertical.custom--mod2 {
        background: #fff;
        height: auto !important;
        display: flex;
        writing-mode: horizontal-tb;
        justify-content: space-between;
        width: 100%;
        margin-bottom: 30px;
    }
    body .flex-xs-off{
        display: block !important;
    }
    .ml0{
        margin-left: 0 !important;
        margin-bottom: 30px;
    }
    body section div .text-xs-left{
        text-align: left !important;
    }
        .world-text--rotator {
            position: absolute;
            right: 0;
            z-index: 9999;
        }
}