@font-face {
    font-family: KlinicSlab-Bold;
    src: url(../fonts/klinicslabbold.otf);
}

@font-face {
    font-family: KlinicSlab-Medium;
    src: url(../fonts/klinicslabmedium.otf);
}

@font-face {
    font-family: Goudy-Bold;
    src: url(../fonts/goudy-boldosf.otf);
}

@font-face {
    font-family: Goudy;
    src: url(../fonts/goudy.otf);
}

@font-face {
    font-family: SocialMediaCircled;
    src: url(../fonts/socialmediacircles.otf);
}

body {
    width: 1024px;
    margin: 0 auto;
}

ol, ul {
    list-style: none;
}

hr {
    border-top: 2px dotted rgb(85, 50, 55);
}


/* BEGIN HEADER */

header {
    background: white;
    width: 100%;
    height: 95px;
    margin: 0 auto;
    display: inline-block;
}

header div#logo a {
    float: left;
    margin-left: 0;
    margin-top: 36px;
}

header nav {
    float: right;
    padding-top: 10px;
}

header ul {
    float: right;
    margin: 0 auto;
    margin-top: 11px;
}

header li {
    float: left;
}

header nav a {
    text-decoration: none;
    color: rgb(207, 28, 68);
    font-family: KlinicSlab-Bold;
    font-size: 25px;
    margin-left: 15px;
}
            
header a:hover {
    color: maroon;
    text-indent: 0px;
}
            
div#socialtop a {
    text-decoration: none;
    color: rgb(11, 148, 70);
    font-family: SocialMediaCircled;
    font-size: 32px;
    margin-left: 8px;
}
            
div#socialtop a:hover {
    color: darkgreen;
}

/* END HEADER */



/* BEGIN INDEX PAGE */

/* Feature Section */

section#featurehome {
    background-image: url(../images/image_home_hero.jpg);
    height: 420px;
    background-repeat: no-repeat;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    margin-top: 15px;
}

section#featurehome h3 {
    font-family: KlinicSlab-Bold;
    font-size: 70px;
    font-weight: normal;
    color: white;
    text-shadow: 0 0 20px black;
    text-align: center;
    line-height: 1;
    margin: 0 auto;
}

/* Menu Section */

section#menu {
    width: 506px;
    height: 300px;
    float: left;
    text-align: center;
    margin-top: 12px;
    background-color: rgb(11, 148, 70);
}

section#menu img {
    margin-top: 30px;
}

section#menu h1 {
    margin: inherit;
    text-align: center;
    font-family: KlinicSlab-Bold;
    color: white;
    font-size: 40px;
    font-weight: normal;
    line-height: 1;
    margin-top: 15px;
}

section#menu a {
    text-decoration: none;
}

.menubutton {
    border: 1.5px solid white;
    width: 130px;
    height: 40px;
    border-radius: 10px;
    margin-top: 20px;
    display: inline-block;
    background-color: rgb(11, 148, 70);
}

.menubutton h2 {
    margin: inherit;
    padding: 0;
    font-size: 23px;
    text-align: center;
    font-family: KlinicSlab-Bold;
    color: white;
    padding-top: 7px;
    font-weight: normal;
}

.menubutton a:hover h2 {
    color: darkgreen;
}

.menubutton:hover {
    box-shadow: 0 0 12px white;
}

/* Catering Section */

section#catering {
    width: 506px;
    height: 300px;
    float: right;
    text-align: center;
    margin-top: 12px;
    background-color: rgb(207, 28, 68);
}

section#catering img {
    margin-top: 30px;
}

section#catering h1 {
    margin: inherit;
    text-align: center;
    font-family: KlinicSlab-Bold;
    color: white;
    font-size: 40px;
    font-weight: normal;
    line-height: 1;
    margin-top: 15px;
}

section#catering a {
    text-decoration: none;
}

.cateringbutton {
    border: 1.5px solid white;
    width: 130px;
    height: 40px;
    border-radius: 10px;
    margin-top: 20px;
    display: inline-block;
}

.cateringbutton h2 {
    margin: inherit;
    padding: 0;
    font-size: 23px;
    text-align: center;
    font-family: KlinicSlab-Bold;
    color: white;
    padding-top: 7px;
    font-weight: normal;
    text-decoration: none;
}

.cateringbutton a:hover h2 {
    color: maroon;
}

.cateringbutton:hover {
    box-shadow: 0 0 12px white;
}

/* Images Section */

.images {
    width: 1024px;
    height: 247px;
    padding-top: 12px;
    display: flex;
    justify-content:space-between;
}

/* END INDEX PAGE */




/* BEGIN MENU PAGE */

/* Feature Section */

section#featuremenu {
    background-image: url(../images/image_menu_hero.jpg);
    height: 420px;
    background-repeat: no-repeat;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 15px;
}

section#featuremenu h3 {
    font-family: KlinicSlab-Bold;
    font-size: 70px;
    font-weight: normal;
    color: white;
    text-shadow: 0 0 32px black;
    text-align: center;
    line-height: 1;
    margin: 0 auto;
}

/* Menu Section */

section#menutable table {
    width: 100%;
    margin-top: 40px;
}

section#menutable th {
    width: 512px;
    font-family: KlinicSlab-Bold;
    font-size: 35px;
    font-weight: normal;
    text-align: left;
    color: rgb(207, 28, 68);
    margin: 0px;
}

section#menutable td {
    width: 512px;
    font-family: Goudy;
    font-size: 18px;
    font-weight: normal;
    text-align: left;
    color: rgb(85, 50, 55);
    line-height: 1.3; 
    vertical-align: text-top;
    margin: 0px;
}

section#menutable h3 {
    font-family: Goudy-Bold;
    font-size: 21px;
    font-weight: normal;
    color: rgb(85, 50, 55);
    margin: 0px;
}

.nutrition {
    font-size: 18px;
    font-family: Goudy;
    font-weight: normal;
    text-align: left;
    color: rgb(85, 50, 55);
    line-height: 1.3; 
    margin-top: 30px;
}

.menuimages {
    width: 1024px;
    height: 247px;
    padding-top: 15px;
    padding-bottom: 35px;
    display: flex;
    justify-content: space-between;
}

/* END MENU PAGE */



/* BEGIN CATERING PAGE */

/* Feature Section */

section#featurecatering {
    background-image: url(../images/image_catering_hero.jpg);
    width: 1024px;
    height: 420px;
    background-repeat: no-repeat;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 15px;
}

section#featurecatering h3 {
    font-family: KlinicSlab-Bold;
    font-size: 70px;
    font-weight: normal;
    color: white;
    text-shadow: 0 0 20px black;
    text-align: center;
    line-height: 1;
}

/* Main Section */

section#cateringtable table {
    width: 100%;
    margin-top: 40px;
}

section#cateringtable th {
    width: 512px;
    font-family: KlinicSlab-Bold;
    font-size: 35px;
    font-weight: normal;
    text-align: left;
    color: rgb(207, 28, 68);
    margin: 0px;
}

section#cateringtable tr {
    display: flex;
}

section#cateringtable td {
    width: 500px;
    font-family: Goudy;
    font-size: 18px;
    font-weight: normal;
    text-align: left;
    color: rgb(85, 50, 55);
    line-height: 1.5; 
    margin: 0px;
    margin-right: 20px;
    margin-top: 15px;
}

section#cateringtable h3 {
    font-family: Goudy-Bold;
    font-size: 21px;
    font-weight: normal;
    color: rgb(85, 50, 55);
    margin: 0px;
}

/* END CATERING PAGE */


/* BEGIN LOCATIONS PAGE */

section#featurelocations {
    background-image: url(../images/image_locations_hero.jpg);
    background-repeat: no-repeat;
    width: 1024px;
    height: 420px;
    margin-top: 15px;
}

section#addresses table {
    margin-top: 40px;
    margin-bottom: 40px;
}

section#addresses th {
    font-family: KlinicSlab-Bold;
    font-size: 35px;
    font-weight: normal;
    text-align: left;
    color: rgb(207, 28, 68);
}

section#addresses td {
    width: 500px;
    font-family: Goudy;
    font-size: 18px;
    font-weight: normal;
    text-align: left;
    color: rgb(85, 50, 55);
    line-height: 1.3; 
    margin-top: 20px;
}

/* END LOCATIONS PAGE */




/* BEGIN CONTACT PAGE */

section#contactform {
    width: 1024px;
    height: 560px;
}

section#contactform hr{
    margin-top: 15px;
    margin-bottom: 15px;
}


section#contactform h3 {
    font-family: KlinicSlab-Bold;
    font-size: 35px;
    font-weight: normal;
    text-align: left;
    color: rgb(85, 50, 55);
    margin: 0 auto;
}

section#contactform tr {
    vertical-align: top
}

section#contactform td {
    text-align: left;
    vertical-align: top;
}

section#contactform img {
    margin-left: 24px;
}

section#contactform form {
    font-family: Goudy-Bold;
    font-size: 18px;
    color: rgb(85, 50, 55);
}

section#contactform input {
    width: 470px;
    height: 25px;
    margin-top: 3px;
    margin-bottom: 15px;
    font-size: 14px;
    border: 1px solid rgb(167, 169, 172);
    border-radius: 5px;
    padding: 10px;
}

section#contactform textarea {
    width: 470px;
    height: 140px;
    margin-top: 5px;
    font-size: 14px;
    border: 1px solid rgb(167, 169, 172);
    border-radius: 5px;
    padding: 10px;
}

section#contactform input[type=submit] {
    background-color: rgb(85, 50, 55);
    width: 130px;
    height: 45px;
    border-radius: 10px;
    font-family: KlinicSlab-Bold;
    color: white;
    font-size: 18px;
    text-align: center;
    font-weight: normal;
    border: none;
    margin: 0 auto;
    margin-top: 10px;
}

section#contactform input[type=submit]:hover {
    color: burlywood;
}

/* END CONTACT PAGE */



/* BEGIN FOOTER */

footer {
    background: rgb(207, 28, 68);
    height: 125px;
    margin-top: 12px;
    margin-bottom: 12px;
}

footer div#contact {
    color: white;
    font-family: KlinicSlab-Bold;
    float: left;
    font-size: 20px;
    margin-left: 30px;
    line-height: 1;
}

footer ul {
    float: right;
    margin-right: 25px;
}

footer ul li {
    text-decoration: none;
    float: left;
}

footer a {
    text-decoration: none;
    font-weight: normal;
    color: white;
    font-family: SocialMediaCircled;
    font-size: 33px;
    margin-left: 8px;
}

footer a:hover {
    color: maroon;
}

/* END FOOTER */
