*
{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

.footerContainer
{
    display: grid;
    grid-template-rows: 1fr;
    grid-template-columns: 20% 1fr 1fr 1fr 20%;
    grid-gap: 0.2em;    
    
    min-height: 10vh;
    padding: 50px 0;
    background-color: var(--brown);
    color: white;
    font-family: Yekan_Regular;
    font-size: 12px;
    text-align: right;
    direction: rtl;

    grid-template-areas: 
    ".. col1 col2 col3 ..";
}

.footerContainer h3
{    
    margin-bottom: 20px;
}

.footerContainer ul
{
    list-style: none;
}

.footerContainer li
{
    height: 25px;
}

.footerContainer a
{
    height: 100%;
    color:white;
    text-decoration: none;
    border:none;   
}

/*----------------------*/
#footnav1
{
    grid-area: col1;
}

#footnav2
{
    grid-area: col2;
}

#footnav3
{
    grid-area: col3;
}

/*----------------------*/
#footnav2 #third
{
    margin-top: 20px;
}

#footnav3 ul
{
    border-bottom: 2px solid white;
    margin-bottom: 10px;
}

#footnav3 li
{
    display: inline-block;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background-color: white;
}

#footnav3 img
{
    width: 35px;
    height: 35px;
    border:none;
}

/*---------------------------------------------------------*/

#fixedFootNav
{
    display: none;
    background-color:var(--cream);
    padding:0 30px;
    padding-top:5px;

    position:fixed;
    bottom:0;
    width:100%;
	box-sizing: border-box;
}

    #fixedFootNav ul
    {
        height:30px;
        display:flex;
        flex-direction:row-reverse;
        list-style-type:none;
        justify-content:space-between;
    }

    #fixedFootNav li
    {
    }

    #fixedFootNav a
    {
        border:none;
        text-decoration:none;
        color:#414141;
    }

    #fixedFootNav img
    {
        width:20px;
        height:auto;
    }
/*---------------------------------------------------------*/
/*                      Media Queries                      */
/*---------------------------------------------------------*/

/*----------------------------------------- Tablet --------------------------------------*/
@media (max-width: 768px)
{
    .footerContainer
    {
        display: grid;
        grid-template-rows: 1fr 0.6fr;
        grid-template-columns: 0.2fr 0.5fr;
        grid-template-areas: 
        "col1 col2"
        "col3 ..";
    
        padding: 30px;
        grid-gap:40px;
    }

    /*#fixedFootNav
    {
        display:block;
    }*/
}

/*------------------------------------------- Mobile ------------------------------------*/
@media (max-width: 420px)
{
    .footerContainer
    {
        display: grid;
        grid-template-rows: 3fr;
        grid-template-columns: 1fr;
        grid-template-areas: 
        "col1"
        "col2"
        "col3";
    
        padding: 30px;
        grid-gap:30px;
    }

    #fixedFootNav
    {
        display:block;
    }
}