/******* Style Sheet for Week 3 Assignment *******/ body { font-size: 16px; color: #000000; /* Black */ background-color: #DFDCE3; /* Clean */ font-family: 'Marmelad', sans-serif; } /***** Navbar *****/ #header-nav { background-color: #A9A9A9; /* DarkGray */ border-radius: 0; } .navbar-brand { background-color: #A9A9A9; /* DarkGray */ padding-top: 25px; } .navbar-brand h1 { /* Food LLC */ color: #874C62; /* Eggplant */ font-family: 'Syncopate', sans-serif; font-size: 1.7em; font-weight: bold; margin-top: 0; margin-left: 0; margin-right:0; margin-bottom: 0; line-height: .75; vertical-align: center; padding-top: 10px; } #nav-list { margin-top: 0; margin-bottom: 0; font-size: 1.2em; } .navbar-header button.navbar-toggle, .navbar-header .icon-bar { border: 1.5px solid #555555; /* Darker Gray */ } .navbar-header button.navbar-toggle { clear: both; margin-top: -30px; } a:hover{ text-decoration: none; } #chicken_button{ background-color: #F2D388; /* Butter */ color: #000000; /* Black */ } #chicken_button:hover{ color: #F2D388; /* Butter */ background-color: #A9A9A9; /* DarkGray */ } #beef_button{ background-color: #C98474; /* Salmon */ color: #FFFFFF; /* White */ } #beef_button:hover{ color: #C98474; /* Salmon */ background-color: #A9A9A9; /* DarkGray */ } #sushi_button{ background-color: #A7D2CB; /* Clean */ color: #000000; /* Black */ } #sushi_button:hover{ color: #A7D2CB; /* Clean */ background-color: #A9A9A9; /* DarkGray */ } /***** Main Page *****/ .container-fluid{ margin-left: 5%; margin-right: 5%; } #title { /* Our Menu */ margin-top: 30px; margin-bottom: 30px; font-size: 2em; } #chicken { background-color: #F2D388; /* Butter */ color: #000000; /* Black */ border: 1px solid #000000; /* Black */ padding: 10px; margin-left: 5px; margin-right: 5px; margin-bottom: 30px; } #beef { background-color: #C98474; /* Salmon */ color: #FFFFFF; /* White */ border: 1px solid #000000; /* Black */ padding: 10px; margin-left: 5px; margin-right: 5px; margin-bottom: 30px; } #sushi { background-color: #A7D2CB; /* Clean */ color: #000000; /* Black */ border: 1px solid #000000; /* Black */ padding: 10px; margin-left: 5px; margin-right: 5px; margin-bottom: 30px; } /***** Media Queries *****/ /* Desktop Styling */ @media (min-width: 1200px) { .navbar-brand { margin-top: 20px; margin-bottom: 20px; } } /* Tablet Styling */ @media (min-width: 992px) and (max-width: 1199px) { .navbar-brand { margin-top: 20px; margin-bottom: 20px; } } /* Small Device Styling */ @media (min-width: 768px) and (max-width: 991px) { .navbar-brand { margin-top: 20px; margin-bottom: 20px; } } /* Phone Styling */ @media (max-width: 767px) { .navbar-brand { padding-top: 10px; } #collapsable-nav a { /* button text */ font-size: 1.2em; } .container-fluid{ margin-left: 10%; margin-right:10%; } }