/*
*
* CSS for Pixlweb plugin
*
*
*/

#services {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-column-gap: 16px;
}
#services .service-button{
    display:block; 
    margin-top: 16px
}

#services .h4{font-size: 1.375rem}

#employee-list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-column-gap: 32px;
    grid-row-gap: 60px
}

#employee-list h3{
    font-family: Open sans, sans-serif;
    margin-top: 8px;
    font-size: 1rem
}
#employee-list h2{margin-bottom:0;
font-size: 1.5rem}



#employee-list ul{margin-left:0}
#employee-list li{list-style-type:none; margin-left:0}

#employee-list input[type=submit], #emplyee-list input[type=submit]:hover{
    color: #009959;
    background: #fff;
    text-transform: none;
    padding: 8px;
    font-size: 1rem;
    font-family: 'Merriweather', serif;
}
.link-block h3{
    margin: 0 0 8px
    
}
.link-block ul{
    list-style-type:none;
    margin-left:16px;
}
.link-block li{margin-bottom: 16px}


.file-collection {
    display: grid;
    grid-template-columns: 1fr 2fr fit-content(33%);
    grid-column-gap: 32px;
    margin-bottom: 40px;
    padding: 32px
}

.file-collection h2{margin-top:0}

.file-collection div.divider{
    width: 48px;
    border-top: 2px solid #009959;
}

#file-list li{list-style-type:none;
margin-bottom: 1rem}
#file-list li i{margin-right: 1rem}



@media screen and (min-width: 768px) and (max-width: 1024px){
    #employee-list {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media screen and (max-width: 768px){
    #services {
        display: grid;
        grid-template-columns: 1fr;
        grid-row-gap: 16px;
    }

    #employee-list {
        display: block;
    }
    #employee-list .employee{
        margin-bottom: 32px
    }
}