#dev-fecr-logo-container {
    text-align: center;
    transition: .5s;
}

#dev-fecr-logo {
    margin-top: 20px;
    width: 100%; 
    transition: .5s;
}

#dev-grid-container-columns { 
    display: grid;
    transition: .5s;
}

#dev-grid-container-columns img {
    width: 100%;
}

#dev-item-1 {
    grid-area: dev-item-1;
    text-align: center;
    transition: .5s;
    margin: 0;
    font-size: 1.2em;
    line-height: 1.8em;
}

#dev-item-2 {
    grid-area: dev-item-2;
    text-align: center;
    transition: .5s;
    margin: 0;
    font-size: 1.2em;
    line-height: 1.8em;
}

.dev-item-text {
    text-align: left;
    transition: .5s;
}



@media only screen and (max-width: 360px) {

    #dev-fecr-logo {
        padding: 0 5%; 
    }
    
    #dev-founded-by-text {
        padding: 0 5%;   
    }

    #dev-grid-container-columns {
        grid-template-areas: "dev-item-1"
                             "dev-item-2";  
    }

    .dev-item-text {
        padding: 0 5%;
    }

    
}

@media only screen and (min-width: 360px) and (max-width: 760px) { 
    
    #dev-fecr-logo {
        padding: 0 16%; 
    }
    
    #dev-founded-by-text {
        padding: 0 10%;   
    }

    #dev-grid-container-columns {
        grid-template-areas: "dev-item-1"
                             "dev-item-2"; 
        transition: .5s;
    }

    .dev-item-text {
        padding: 0 10%;
    }
}

@media only screen and (min-width: 760px) and (max-width: 1280px) { 
    
    #dev-fecr-logo {
        width: 500px; 
    }
    
    #dev-founded-by-text {
        padding: 0 7%;   
    }

    #dev-grid-container-columns {
        grid-template-areas: "dev-item-1 dev-item-2"; 
        transition: .5s;
        padding: 6% 5%;
    }
   
    #dev-item-1 {
        margin-right: 50px;
    }

    #dev-item-2 {
        margin-left: 50px;
    }

    .dev-item-text {
        padding: 0 5%;
    }

}

@media only screen and (min-width: 1280px) and (max-width: 1460px) { 
    
    #dev-fecr-logo {
        width: 500px; 
    }
    
    #dev-founded-by-text {
        padding: 0 12%;   
    }

    #dev-grid-container-columns {
        grid-template-areas: "dev-item-1 dev-item-2"; 
        transition: .5s;
        padding: 6% 10%;
    }
   
    #dev-item-1 {
        margin-right: 50px;
    }

    #dev-item-2 {
        margin-left: 50px;
    }

    .dev-item-text {
        padding: 0 5%;
    }
}

@media only screen and (min-width: 1460px) and (max-width: 1760px) { 
    
    #dev-fecr-logo {
        width: 500px; 
    }
    
    #dev-founded-by-text {
        padding: 0 16.5%;   
    }

    #dev-grid-container-columns {
        grid-template-areas: "dev-item-1 dev-item-2"; 
        transition: .5s;
        padding: 6% 15%;
    }
   
    #dev-item-1 {
        margin-right: 50px;
    }

    #dev-item-2 {
        margin-left: 50px;
    }

    .dev-item-text {
        padding: 0 5%;
    }
}

@media only screen and (min-width: 1760px) and (max-width: 2020px) { 
    
    #dev-fecr-logo {
        width: 500px; 
    }
    
    #dev-founded-by-text {
        padding: 0 20%;   
    }

    #dev-grid-container-columns {
        grid-template-areas: "dev-item-1 dev-item-2"; 
        transition: .5s;
        padding: 6% 20%;
    }
   
    #dev-item-1 {
        margin-right: 50px;
    }

    #dev-item-2 {
        margin-left: 50px;
    }
}

@media only screen and (min-width: 2020px) and (max-width:2400px ) { 
    
    #dev-fecr-logo {
        width: 500px; 
    }
    
    #dev-founded-by-text {
        padding: 0 15%;   
    }

    #dev-grid-container-columns {
        grid-template-areas: "dev-item-1 dev-item-2"; 
        transition: .5s;
        padding: 6% 15%;
    }
   
    #dev-item-1 {
        margin-right: 50px;
    }

    #dev-item-2 {
        margin-left: 50px;
    }

}

@media only screen and (min-width: 2400px) {
    
    #dev-fecr-logo {
        width: 500px; 
    }
    
    #dev-founded-by-text {
        padding: 0 25%;   
    }

    #dev-grid-container-columns {
        grid-template-areas: "dev-item-1 dev-item-2"; 
        transition: .5s;
        padding: 6% 25%;
    }
   
    #dev-item-1 {
        margin-right: 50px;
    }

    #dev-item-2 {
        margin-left: 50px;
    }
}