@font-face {font-family:'Majesti-Banner';
   src: local('Majesti-Banner-Medium'), url('media/majesti-banner-medium.otf'), format('opentype');}

@font-face {font-family:'Majesti-Banner-Heavy';
   src: local('Majesti-Banner-Heavy'), url('media/majesti-banner-heavy.otf'), 
   format('opentype');}

@font-face {font-family:'Avenir-Light';
   src: local('Avenir'), url('media/avenir.ttc'), format('truetype');}

#container {
   width:100%; margin:auto; min-height:1000px; position:relative; background-color:#41393d;}

/* HEADER ITEMS */

header {width:100%; height:30%;}

#divider {
   width:50%; margin-left:auto; margin-right:auto; background-color:#be1e2d; height:.08em; }

#logo {margin-left:auto; margin-right:auto; padding-top:60px; width:300px; ; }

/* NAVIGATION */

nav {height:35px; margin-top:3%;}

nav ul {list-style-type:none; margin:0; padding:0; width:60%; margin:auto; text-align:center;}

nav ul li a {font-family:'Avenir-Light', sans-serif; text-decoration:none; color:black; font-size:20px; padding:10px;} 

nav li a:hover {color:#8a8c8f;}

.active {color:#be1e2d;}

/* BODY ITEMS */

#home {display:block; margin:auto; object-position: center;}

#main {margin-top:40px; width:75%; height:350px; margin-left:auto; margin-right:auto; background-image: url(images/dumpling-bowl-1.jpg); background-size:cover; border-style:solid; border-color:black; border-width:medium;}

#home-images {margin-top:40px; width:75%; margin-left:auto; margin-right:auto; height:250px; position:relative;}

#image-2 {background-image: url(images/lamb-soup-1.jpg); background-size:cover; width:30%; height:250px; position:absolute; left:34.5%; border-style:solid; border-color:black; border-width:medium;}

#image-1 {background-image: url(images/white-lanterns.jpg); background-size:cover; width:30%; height:250px; position:absolute; left:0px; border-style:solid; border-color:black; border-width:medium;}

#image-3 {background-image: url(images/dumplings-1.jpg); background-size:cover; width:30%; height:250px; position:absolute; right:0px; border-style:solid; border-color:black; border-width:medium;}

.text {font-family:'Avenir-Light'; display:flex; align-items:center; justify-content:center; text-align:center; background-color:#8a8c8f; height:100%; visibility:hidden; opacity:.93; }

.text h1 {margin-top:30px; color:black;}

#image-1:hover .text {visibility:visible;}

#image-2:hover .text {visibility:visible;}

#image-3:hover .text {visibility:visible;}

/* LANDING PAGE ITEMS */

#landing {display:block; margin-left:auto; margin-right:auto; margin-top:30%; width:450px; height:auto;}

#alt-container {width:100%; margin:auto; background-color:#41393d; min-height:800px; position:relative;}

#right {width:55%; position:absolute; min-height:800px; right:0px; font-size:50px;}

#left {width:45%; background-image:url(images/garden.jpg); min-height:800px; position:absolute; left:0px;}

#enter {width:100%; height:10%; margin-top:15%; display:flex; justify-content:center;}

#enter a {text-decoration:none; color:#be1e2d; font-family:'Avenir-Light', sans-serif; font-size:18px; border-style:double; border-color:black; padding:10px; width:10%; text-align:center;}

#enter a:hover {color:#8a8c8f;}

/* ABOUT PAGE */

#feature {margin-left:auto; margin-right:auto; margin-top:40px;}

#about-town {width:36%; height:510px; display:inline-block; float:right; position:relative; display:flex; align-items:center; justify-content:center;}

#about-town p {font-family:'Avenir-Light', sans-serif; text-align:center; font-size:1.4vw; overflow:scroll; color:#8a8c8f;}

#blurb {width:75%; height:500px; margin-left:auto; margin-right:auto; margin-top:40px; position:relative;}

#divide-about {height:510px; width:.08em; background-color:#be1e2d; position:absolute; left:60%;}

#about-img {background-image:url(images/chinese-tiger.jpg); display:inline-block; width:55%; height:500px; background-size:cover; border-style:solid; border-color:#d4a18d; border-width:thick;}

/* MENU PAGE */

#dropdown-menu {width:75%; height:125px; margin-top:60px; text-align:center; position:relative; line-height:125px; margin-left:auto; margin-right:auto;}

#dropdown-menu ul li {list-style-type:none; display:inline-block; width:15%; height:125px; background-color:#8a8c8f; position:absolute; border-style:double;}

#dropdown-menu a {text-decoration:none; color:#d4a18d; font-size:2.1vw; font-family:'Avenir-Light'; }

#dropdown-menu a:hover {color:#be1e2d;}

#link10 {position:absolute; left:2.5%;}

#link20 {position:absolute; left:22.5%;}

#link30 {position:absolute; left:42.5%;}

#link40 {position:absolute; right:22.5%}

#link50 {position:absolute; right:2.5%;}

/* INDIVIDUAL MENUS */

#menu-pages {width:70%; height:600px; margin-left:auto; margin-right:auto; margin-top:60px; position:relative;}

#dropdown {width:25%; text-align:center; line-height:50px; margin-right:5%;}

#dropdown li {list-style-type:none; height:50px; margin-bottom:10px; background-color:#8a8c8f; border-style:double; display:flex; justify-content:center;}

#dropdown a {text-decoration:none; color:black; font-size:2vw; font-family:'Avenir-Light'; padding-right:10px; padding-left:10px;}

#dropdown a:hover {color:#d4a18d;}

#dim-sum {display:inline-block; position:absolute; right:4%; top:0; width:60%; height:auto; text-align:center; background-color:#8a8c8f; border-style:double; }

#dim-sum h1 {font-family:'Avenir-Light', sans-serif; font-size:40px; border-bottom-style:double; border-color:#be1e2d; padding-bottom:10px; padding-top:10px; width:50%; margin-left:auto; margin-right:auto; line-height:40px;}

#dim-sum h3 {line-height:15px}

#dim-sum p {padding-right:2%; padding-left:2%; padding-bottom:2%; font-family:'Avenir-Light', sans-serif; line-height:20px}

/* CONTACT PAGE */

#contact-content {height:500px; width:75%; position:relative; margin-top:5%; margin-left:auto; margin-right:auto;}

#contact {height:100%; width:40%; position:absolute; right:10%; background-image:url(images/restaurant.jpg); background-size:cover; background-repeat:no-repeat; border-style:solid; background-color:black;}

#contact-info {width:30%; height:100%; position:absolute; left:10%; border-style:double; border-color:black; background-color:#8a8c8f ; font-family:'Avenir-Light', sans-serif; display:flex; align-items:center; justify-content:center; text-align:center;}

/* FOOTER ITEMS */

footer {width:100%; height:3em ; position:absolute; bottom:0px; background-color:#d4a18d; display:flex; align-items:center; justify-content:center;}

footer a {color:black; font-family:'Avenir-Light', sans-serif;}

/* SITEMAP */

#sitemap a {font-family:'Avenir-Light', sans-serif;}

#sitemap a:hover {color:#d4a18d;}