:root
{
    --white: #FFFFFF;
    --dark:#343A40;
    --black:#000000;
    --red:#C11C23;
    --grey-blue:#7B8797;
}
body,html
{
    width: 100%;
    height:-webkit-fill-available;
    padding: 0;
    margin: 0;
    font-size: 20px;
    font-family: 'Nunito Sans', sans-serif;
    font-weight: 400;
    background: var(--white);
    font-family: als_sector;
    color:var(--dark);
}
*
{
    box-sizing: border-box;
}
.red 
{
    color: var(--red);
}

@media all and (min-width: 800px)
{
    .mobile
    {
        display: none;
    }
    .desktop
    {
        height: -webkit-fill-available;
        width: 100%;
        background-color: #FCFCFC;
        display: grid;
        grid-template-columns: 3fr 2fr;
        padding:40px 0 0;
    }
    .left
    {
        display: flex;
        align-items: flex-start;
        justify-content: center;
        flex-direction: column;
        gap:40px;
        padding: 0 8vw 0 15vw;
    }
    .headline
    {
        margin: 0;
        padding: 0;
        /*font-size: 40px;*/
        font-size: 2.9vw;
        /*line-height: 48px;*/
        line-height: 3.5vw;
        color: var(--black);
    }
    .text>p 
    {
        margin:0;
        font-weight: 400;
    }
    .text
    {
        display: flex;
        flex-direction: column;
        color: #525D6B;
        /*line-height: 28px;*/
        gap:20px;
        font-size: 1.4vw;
        line-height: 1.8vw;
    }
    .links
    {
        padding-top: 40px;
        display: flex;
        gap:20px;
        justify-content: flex-start;
    }
    .links img 
    {
        /*height: 60px;*/
        height: 4.5vw;
    }
    .right 
    {
        background-image: url('/images/app_view_onhand.png');
        background-size: contain;
        background-position: right center;
        background-repeat: no-repeat;
    }
    .app-icon
    {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap:10px;
    }
    .app-icon>img
    {
        width:100px;
    }

}
@media all and (min-width: 1140px)
{
    .text
    {
        font-size: 1.2vw;
        line-height: 1.6vw;
    }
    .links img {
    /* height: 60px; */
    height: 4vw;
    }
}
@media all and (max-width: 799px)
{
    body
    {
        display: grid;
grid-template-columns: 1fr;
grid-template-rows: 1fr;
    }
    .desktop
    {
        display: none;
    }
    .app-icon
    {
        margin-bottom: 5vh;
    }
    .app-icon>img
    {
        width:100px;
    }
    .app-icon>span
    {
        display: block;
        text-align: center;
    }
    .mobile
    {
        display: block;
        height: 100%;
        width: 100%;
        background-image: url('/images/primakov_bg.png');
        background-repeat: no-repeat;
        background-position: center 110%;
        background-size: 100% auto;
        padding-top: 5vh;
    }
    .links, .app-icon
    {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap:5px;
    }
    .app-icon
    {
        gap:10px;
    }
    .links>span 
    {
        font-size: 16px;
        color:var(--grey-blue);
    }
    .links a img 
    {
        width: 160px;
    }
}

@media all and (max-width: 799px) and (orientation: landscape)
{
    .mobile
    {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        background-image: none;
    }

    .app-icon
    {
        margin-bottom: 0;
    }
}