@charset "utf-8";

*{box-sizing: border-box;}
img {max-width: 100%; height: auto;}

/*navigation styles */

nav ul {list-style: none;}
nav li {display: inline-block; margin: 0 10px; padding: 5px; background-color: greenyellow;}
li:hover {background-color: #658c8f}

/* grid styles*/

.fullwidth {float:left; width: 100%;}
.half-width-column {float: right; width: 46%; margin: 2%; padding: 1%;}
.third-width-column {float: left; width: 29.33%; margin: 2%; padding: 1%;}
.quarter-width-column {float: left; width: 21%; margin: 2%; padding: 1%;}

/*--- layout style ---*/

body {margin: 0; padding: 0; background-color: greenyellow;}
header {float:left; width: 100%; background-color: #005C53;}
footer {float:left; width: 100%;  background-color: #005C53;}
section {float: left; width: 100%;}
#main-content {float:left; width: 100%;}

#logo {float: left; width: 200px; height: auto; margin-right: 20px;}
#social {float: right; width: 120px; height: auto; margin-left: 20px;}
#social-media {float: left; width: 120px; height: auto; margin-left: 20px;}

/* layout */
#image_hover {width: 400px; height:300px; background-image: url("../assets/img/pumpkins-8338100_1280.jpg"); background-size: 
cover; background-repeat: no_repeat;}
#image_hover:hover {background-image: url("../assets/img/donkey-3728294_1280.jpg");}

/*--- Breakpoints ---*/



/* XL */
@media only screen and (max-width: 1200px) {

}

/* Large */
@media only screen and (max-width: 1000px) {
    .quarter-width-column {width: 46%;}
}

/* Small */
@media only screen and (max-width: 576px) {
    .half-width-column {width: 96%;}
    .third-width-column {width: 96%;}
    .quarter-width-column {width: 96%;}
}