img.logo_fmt { width: 13vw; padding-top: 1rem; }
img.logo_fark_media_blue { width: 10vw; }
img.logo_fark_haber { width: 13vw; }
img.logo_geyikli { width: 10vw; }
img.logo_vitalis_homes { width: 10vw; }

section.home
{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

section.home > ul
{
    list-style: none;
    display: flex;
    justify-content: center;
    gap: 2rem;
}

section.home > h1
{
    padding: 1rem 0;
}

section.home > ul > li
{
    width: 20%;
    text-align: center;
    background-color: #f3f3f3;
    padding: 1.5rem;
    padding-bottom: 2rem;
    border-radius: 16px;
    transition: background-color 0.5s ease;
    transform-style: preserve-3d;
    transform: perspective(1000px);
}

section.home > ul > li:hover
{
    background-color: #cefffd;
}

section.home > ul > li > div
{
    min-height: 10vw;
    display: flex;
    align-items: center;
    justify-content: center;
}

section.home > ul > li > h3
{
    padding-bottom: 2rem;
    min-height: 3vw;
    transform: translateZ(60px);
}

section.home > ul > li > p
{
    padding-bottom: 1rem;
    min-height: 5vw;
    transform: translateZ(30px);
}

section.home > ul > li > a
{
    border-radius: 4px;
    padding: 8px 12px;
    color: #fff;
    background-color: #004F87;
    font-size: var(--xsmallFontSize);
    font-weight: 500;
    transition: background-color 0.5s ease;
}

section.home > ul > li > a:hover
{
    background-color: #F48120;
}


section.home > p.copyright
{
    padding-top: 3rem;
    text-align: center;
    font-size: var(--xsmallFontSize);
    color: #868686;
}


li.rgb::after
{
    display: none;
}

li.rgb:hover::after
{
    display: initial;
}

.rgb::after {
    content:"";
    background: linear-gradient(45deg,
    #ff0000 0%, 
    #ff9a00 10%,
    #d0de21 20%,
    #4fdc4a 30%, 
    #3fdad8 40%,
    #2fc9e2 50%, 
    #1c7fee 60%, 
    #5f15f2 70%, 
    #ba0cf8 80%, 
    #fb07d9 90%, 
    #ff0000 100%  )
    repeat 0% 0% / 300% 100%;
    position: absolute;
    inset: -3px;
    border-radius: 16px;
    filter: blur(8px);
    transform: translateZ(-1px); /*or z-index */
    animation: rgb 6s linear infinite;
  }
  @keyframes rgb {
    0% {background-position: 0% 50%;}
    50% {background-position: 100% 50%;}
    100% {background-position: 0% 50%;}
  }

  
@media only screen and (orientation: portrait)
{
    img.logo_fmt { width: 150px; }
    img.logo_fark_media_blue { width: 150px; }
    img.logo_fark_haber { width: 150px; }
    img.logo_geyikli { width: 150px; }
    img.logo_vitalis_homes { width: 150px; }

    section.home > ul
    {
        flex-direction: column;
        align-items: center;
    }

    section.home > ul > li
    {
        width: 80%;
        text-align: center;
        padding: 2rem;
    }

    section.home > ul > li > h3
    {
        padding-top: 2rem;
    }

    section.home > ul > li > p
    {
        padding-bottom: 2rem;
    }

    section.home > p.copyright
    {
        padding-bottom: 3rem;
    }
}