:root{--sky: #caebf2;--carbon: #a9a9a9;--watermelon: #ff383f;--neutral: #efefef}html{height:100%;box-sizing:border-box}*,*:before,*:after{box-sizing:inherit}body{font-family:Lato,sans-serif;position:relative;margin:0;padding-bottom:6rem;min-height:100%}.nav{text-align:center;background-color:var(--sky);border-bottom:1px solid var(--watermelon)}.nav a{text-decoration:none;color:#000}.nav a h1{margin:0;padding:1em}.nav a h1 i{margin-left:.3em}.gridContainer{width:100%;overflow:hidden}.gridContainer .courseFilterDiv{margin:1em auto 0;text-align:center}.gridContainer .courseFilterDiv label{margin-right:.5em}.gridContainer .courseFilterDiv select{font-family:Lato,sans-serif;font-size:.9em;border-color:#000;outline:none}.gridContainer .grid{max-width:900px;margin:0 auto;overflow:hidden;text-align:center;padding:.6em 0}.col-4{width:90%;box-sizing:border-box;cursor:pointer;text-decoration:none;display:inline-block;border-bottom:2px solid var(--carbon);padding:.5em 0}.col-4 .thumbContainer{height:6em;text-align:center}.col-4 .thumbContainer img{width:6em;height:100%;display:block;float:left}.col-4 .thumbContainer .recipeTitle{margin:0;padding:.6em .1em;color:#000;float:right;font-family:Lato,sans-serif;width:60%;box-sizing:border-box;height:50%;font-size:1em}.col-4 .thumbContainer .recipeCourse{margin:0;padding:.6em 0;color:#000;float:right;font-family:Lato,sans-serif;width:60%;box-sizing:border-box;height:50%;font-size:.8em;line-height:2em}.col-4 .thumbContainer .recipeCourse:first-letter{text-transform:capitalize}.col-4:hover{background-color:var(--neutral)}.col-4:last-of-type{border:none}.recipeDiv{padding:1em}.recipeDiv .homeLink{text-decoration:none;color:var(--watermelon);font-weight:bolder}.recipeDiv .homeLink i{margin-right:.4em}.recipeDiv .recipeContain{max-width:900px;margin:0 auto}.recipeDiv .recipeContain h1{text-align:center}.recipeDiv .recipeContain img{height:12em;display:block;margin:0 auto 1em;border:1px solid var(--carbon);background-color:#fff;padding:.3em;width:90%}.recipeDiv .recipeContain h4{font-size:1.3em}.recipeDiv .recipeContain .ingredients,.recipeDiv .recipeContain .steps{margin:.4em 0;line-height:1.5}.recipeDiv .recipeContain p{line-height:1.5;margin:.4em 0}.recipeDiv .recipeContain ul,.recipeDiv .recipeContain ol{padding:0 .5em 0 2em}.recipeDiv .recipeContain .notes{clear:both}.footer{text-align:center;background-color:var(--sky);border-top:1px solid var(--watermelon);position:absolute;right:0;bottom:0;left:0;padding:1rem}.footer p{margin:0;padding:1em}.footer p a,.footer p a:visited{color:#000}@media(min-width:480px){.col-4{width:46%;float:left;margin:2%;padding:.5em 0 .5em .5em;border:2px solid var(--carbon)}.col-4 .thumbContainer img{width:5.2em}.col-4 .thumbContainer .recipeTitle{padding:.2em .1em}.col-4 .thumbContainer .recipeCourse{padding:1.8em 0}.col-4:last-of-type{border:2px solid var(--carbon)}.recipeDiv .recipeContain img{width:15em}}@media(min-width:768px){.col-4{width:30%;margin:1.65%}.recipeDiv{overflow:hidden}.recipeDiv .ingredientsDiv{float:left;width:50%}.recipeDiv .ingredientsDiv h4{font-size:1.3em}.recipeDiv .stepsDiv{float:left;width:50%}.recipeDiv .stepsDiv h4{font-size:1.3em}}@media(min-width:992px){.col-4{width:23%;margin:1%;padding:0}.col-4 .thumbContainer{padding:.5em;height:17em}.col-4 .thumbContainer img{height:11em;width:100%}.col-4 .thumbContainer .recipeTitle{height:3em;padding:1em 0 0;float:none;width:100%;clear:both}.col-4 .thumbContainer .recipeCourse{margin:-1em auto 0;float:none;padding:1.5em}}