@import url(colors.css);
@import url(buttons.css);
@import url(fonts.css);

:root {
    --transition: all .4s ease;
}

/* General styles */
    .jobs-container { cursor: pointer; border-radius: 1rem; background-position: center; background-repeat: no-repeat; background-size: 80%; border: 2px solid var(--gray); transition: var(--transition); }
    .jobs-container:hover { border: .6rem solid var(--gray); }
    .nav-links { color: var(--muted) !important; transition: var(--transition); }
    .nav-links:hover { color: var(--secondary-blue) !important; }
    #scroll-top { position: fixed; bottom: 2rem; right: 1rem; }
/* END General styles */

@media screen and (max-width: 350px) {
    .jobs-container { width: 100%; height: 8rem; }
}

@media screen and (min-width: 351px) and (max-width: 767px) {
    .jobs-container { width: 100%; height: 8rem; }
}

@media screen and (min-width: 768px) and (max-width: 991px) {
    
}

@media screen and (min-width: 992px) {
    
}

@media screen and (min-width: 1200px) {
    
}

@media screen and (min-width: 1360px) {
    
}

@media screen and (min-width: 1400px) {
    .jobs-container { width: 100%; height: 16rem; }
}

@media screen and (min-width: 1600px) {
    
}

@media screen and (min-width: 1920px) {
    
}