@charset "utf-8";

@font-face {
  font-family: 'MonotypeCorsiva';
  src: url('MonotypeCorsiva.eot?#iefix') format('embedded-opentype'),  url('MonotypeCorsiva.woff') format('woff'), url('MonotypeCorsiva.ttf')  format('truetype'), url('MonotypeCorsiva.svg#MonotypeCorsiva') format('svg');
  font-weight: normal;
  font-style: normal;
}



/* CSS Document */
body {
	background-image: url(../images/background.jpg);
	background-repeat: repeat;
}
#header a {
	display: block;
	float: left;
	height: 120px;
	width: 250px;
	margin-left: 345px;
}
#header a:hover {
	display: block;
	float: left;
	height: 120px;
	width: 250px;
	margin-left: 346px;
	background-image: url(../images/sophieslogohover.png);
}
#wrapper {
	width: 950px;
	margin: auto;
	height: 825px;
}
#wrappergallery {
	width: 950px;
	margin: auto;
	height: 1500px;
}

#header {
	float: left;
	height: 120px;
	width: 950px;
	background-image: url(../images/sophieslogo.png);
}
#menu {
	float: left;
	height: 35px;
	width: 950px;
}
#menutext {
	text-align: center;
	padding-top: 5px;
	margin: 0px;
	font-family: "Times New Roman", Times, serif;
	color: #333;
	font-weight: lighter;
}


#banner {
	float: left;
	height: 260px;
	width: 950px;
}
#metro {
	width: 950px;
	height: 230px;
	float: left;
	margin-top: 25px;
}
.metro:after {
    display:block;
    clear:both;
    content:'';
}
.metroitem {
	overflow: hidden;
	float: left;
	position: relative;
	height: 210px;
	width: 310px;
	margin: 5px;
    background-position: 50% 50%;
    background-size: cover;
	-webkit-box-shadow: 0px 1px 5px 0px #4a4a4a;
    -moz-box-shadow: 0px 1px 5px 0px #4a4a4a;
    box-shadow: 0px 1px 5px 0px #4a4a4a;
}
.metroitem:nth-child(3n+1) { margin-left: 0; }
.metroitem:nth-child(3n) { margin-right: 0; }
.metroitem>a {
	display: block;
	height: 100%;
	width: 100%;
}
.metroitem span {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	padding: 6px;
	color: #FFF;
	font-family: 'MonotypeCorsiva';
	font-size: 24px;
	height: 1.25em;
	background: -webkit-linear-gradient(left, rgba(108,49,49,1) 16%, rgba(0,0,0,0.2)); /* For Safari 5.1 to 6.0 */
	background: -o-linear-gradient(right, rgba(108,49,49,1) 16%, rgba(0,0,0,0.2)); /* For Opera 11.1 to 12.0 */
	background: -moz-linear-gradient(right, rgba(108,49,49,1) 16%, rgba(0,0,0,0.2)); /* For Firefox 3.6 to 15 */
	background: linear-gradient(to right, rgba(108,49,49,1) 16%, rgba(0,0,0,0.2)); /* Standard syntax */
}
.metroitem:hover span,
.metroitem.active span {
	background: -webkit-linear-gradient(left, rgba(56,102,56,1) 16%, rgba(32,32,32,0.2)); /* For Safari 5.1 to 6.0 */
	background: -o-linear-gradient(right, rgba(56,102,56,1) 16%, rgba(32,32,32,0.2)); /* For Opera 11.1 to 12.0 */
	background: -moz-linear-gradient(right, rgba(56,102,56,1) 16%, rgba(32,32,32,0.2)); /* For Firefox 3.6 to 15 */
	background: linear-gradient(to right, rgba(56,102,56,1) 16%, rgba(32,32,32,0.2)); /* Standard syntax */
}
.metroitem .alt {
	-webkit-transition: height 0.5s;
	transition: height 0.5s;
}
.metroitem:hover .alt {
	height: 200px;
}
.metroitem .info {
	display: block;
	position: absolute;
	bottom: 0;
	top: 100%;
	left: 0;
	right: 0;
	color: #FFF;
	padding: 0.5em;
	border-top: 1px solid #000;
	overflow-y: scroll;
	overflow-x: hidden;
	-webkit-transition: top 0.5s;
	transition: top 0.5s;
}
.metroitem:hover .info {
	top: 40px;
}


.minimetroitem {
	overflow: hidden;
	float: left;
	position: relative;
	height: 100px;
	width: 230px;
    margin: 5px;
    background-position: 50% 50%;
    background-size: cover;
	-webkit-box-shadow: 0px 1px 5px 0px #4a4a4a;
    -moz-box-shadow: 0px 1px 5px 0px #4a4a4a;
    box-shadow: 0px 1px 5px 0px #4a4a4a;
}
.minimetroitem:nth-child(4n+1) { margin-left: 0; }
.minimetroitem:nth-child(4n) { margin-right: 0; }
.minimetroitem>a {
	display: block;
	height: 100%;
	width: 100%;
}
.minimetroitem span {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	padding: 6px;
	color: #FFF;
	font-family: 'MonotypeCorsiva', serif;
	font-size: 24px;
	height: 1.25em;
	background: -webkit-linear-gradient(left, rgba(108,49,49,1) 16%, rgba(0,0,0,0.2)); /* For Safari 5.1 to 6.0 */
	background: -o-linear-gradient(right, rgba(108,49,49,1) 16%, rgba(0,0,0,0.2)); /* For Opera 11.1 to 12.0 */
	background: -moz-linear-gradient(right, rgba(108,49,49,1) 16%, rgba(0,0,0,0.2)); /* For Firefox 3.6 to 15 */
	background: linear-gradient(to right, rgba(108,49,49,1) 16%, rgba(0,0,0,0.2)); /* Standard syntax */
}
.minimetroitem:hover span,
.minimetroitem.active span {
	background: -webkit-linear-gradient(left, rgba(56,102,56,1) 16%, rgba(32,32,32,0.2)); /* For Safari 5.1 to 6.0 */
	background: -o-linear-gradient(right, rgba(56,102,56,1) 16%, rgba(32,32,32,0.2)); /* For Opera 11.1 to 12.0 */
	background: -moz-linear-gradient(right, rgba(56,102,56,1) 16%, rgba(32,32,32,0.2)); /* For Firefox 3.6 to 15 */
	background: linear-gradient(to right, rgba(56,102,56,1) 16%, rgba(32,32,32,0.2)); /* Standard syntax */
}
.minimetroitem:nth-last-child(1):nth-child(4n+1) { margin-left:360px; }
.minimetroitem:nth-last-child(2):nth-child(4n+1) { margin-left:240px; }
.minimetroitem:nth-last-child(3):nth-child(4n+1) { margin-left:120px; }


.menusection {
    background-color: #6c3131;
    border-radius: 20px;
    padding: 20px;
    margin: 20px;
    color: #FFF;
	-webkit-box-shadow: 0px 1px 5px 1px #4a4a4a;
    -moz-box-shadow: 0px 1px 5px 1px #4a4a4a;
    box-shadow: 0px 1px 5px 1px #4a4a4a;
    overflow: hidden;
    
}
.menuinside {
    background-color: #D2BCB3;
    border-radius: 20px;
    padding: 20px;
    margin: 20px;
    color: #444;
	-webkit-box-shadow: 0px 1px 5px 1px #9F5638;
    -moz-box-shadow: 0px 1px 5px 1px #9F5638;
    box-shadow: 0px 1px 5px 1px #9F5638;
}
.menuinside:after { display: block; clear: both; content: ''; }
.menuitem {
    width: 50%;
    padding: 1em;
    box-sizing: border-box;
    float: left;    
}
.menuitem:first-child:last-child {
    width: 100%;
    padding: 0 1em;
}
.foodmenu h1,
.foodmenu h2,
.foodmenu h3,
.foodmenu h4,
.foodmenu h5,
.foodmenu h6,
.foodmenu b { font-family: 'MonotypeCorsiva', serif; margin: 0; padding: 0; }
.foodmenu h1 { font-size: 2.75em; }
.foodmenu h2 { font-size: 2.25em; }
.foodmenu h3 { font-size: 1.5em; }
.menuitem h1,
.menuitem h2,
.menuitem h3 { text-decoration: underline; color: #4c2121; }
.menuitem h4,
.menuitem h5,
.menuitem h6 { margin-left: 0.5em; color: #4c2121; }
.menuitem p { padding: 0; margin: 0.8em; }
.menuitem p.list { margin: 0.5em; display: flex; }
.menuitem p.list>b,
.menuitem p.list>span { display: block; }
.menuitem p.list>b { width: 3.25em; flex-shrink: 0; flex-grow: 0; }




#metromenu {
	width: 950px;
	height: 230px;
	float: left;
}
#footer {
	height: 35px;
	float: left;
	width: 950px;
}
#menutext a {
	text-decoration: none;
	font-weight: normal;
	color: #333;
	font-size: large;
	padding-bottom: 1px;
}
#menutext a:visited {
	text-decoration: none;
	color: #333;
}
#menutext a:hover {
	color: #663333;
	text-decoration: none;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #366636;
}
#footer a {
	text-decoration: none;
	font-weight: normal;
	color: #333;
	font-size: large;
	padding-bottom: 1px;
}
#footer a:visited {
	text-decoration: none;
	color: #333;
}
#footer a:hover {
	color: #639;
	text-decoration: none;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #366636;
}
#gallerywrapper {
	height: 1300px;
	width: 950px;
	overflow: hidden;
	float: left;
}

#center {
	height: 600px;
	width: 950px;
	margin-top: 50px;
	margin-right: auto;
	margin-left: auto;
	background-image: url(../images/404.png);
	-moz-box-shadow:    1px 3px 20px 5px #333;
    -webkit-box-shadow: 1px 3px 20px 5px #333;
    box-shadow:         1px 3px 20px 5px #333;
}
#leftin {
	float: left;
	height: 600px;
	width: 565px;
}
#rightin {
	float: left;
	height: 600px;
	width: 365px;
	padding-left: 20px;
}
#rightin a {
	font-family: Verdana, Geneva, sans-serif;
	font-size: x-large;
	color: #32363E;
	text-decoration: none;
}
#rightin a:hover {
	color: #66725E;
}
#wrapper .boxes {
	height: 210px;
	width: 310px;
	float: left;
	margin-top: 10px;
	margin-left: 5px;
}
#wrappergallery .gallery {
	height: 210px;
	width: 310px;
	float: left;
	margin-top: 10px;
	margin-left: 5px;
}
#gallerywrapper #img {
	display: block;
	height: 210px;
	width: 310px;
	float: left;
	margin-top: 5px;
	margin-left: 5px;
}



#wrappergallery .gallery a {
	text-decoration: none;
	display: block;
	width: 310px;
	height: 210px;
}
#augten {
	background-image: url(../images/upcoming/augten.png);
	-webkit-box-shadow: 0px 1px 5px 0px #4a4a4a;
	-moz-box-shadow: 0px 1px 5px 0px #4a4a4a;
	box-shadow: 0px 1px 5px 0px #4a4a4a;
}
#augten a {
	display: block;
	height: 210px;
	width: 310px;
}
#augten a:hover {
	background-image: url(../images/upcoming/augtenhover.jpg);
	display: block;
	height: 210px;
	width: 310px;
}
#augthree {
	background-image: url(../images/upcoming/augthree.jpg);
	-webkit-box-shadow: 0px 1px 5px 0px #4a4a4a;
	-moz-box-shadow: 0px 1px 5px 0px #4a4a4a;
	box-shadow: 0px 1px 5px 0px #4a4a4a;
}
#augthree a {
	display: block;
	height: 210px;
	width: 310px;
}
#augthree a:hover {
	background-image: url(../images/upcoming/augthreehover.jpg);
	display: block;
	height: 210px;
	width: 310px;
}
#julytwoseven {
	background-image: url(../images/upcoming/julytwoseven.jpg);
	-webkit-box-shadow: 0px 1px 5px 0px #4a4a4a;
	-moz-box-shadow: 0px 1px 5px 0px #4a4a4a;
	box-shadow: 0px 1px 5px 0px #4a4a4a;
}
#julytwoseven a {
	display: block;
	height: 210px;
	width: 310px;
}
#julytwoseven a:hover {
	background-image: url(../images/upcoming/julytwosevenhover.jpg);
	display: block;
	height: 210px;
	width: 310px;
}
#newmenu {
	background-image: url(../images/upcoming/menu.png);
	-webkit-box-shadow: 0px 1px 5px 0px #4a4a4a;
    -moz-box-shadow: 0px 1px 5px 0px #4a4a4a;
    box-shadow: 0px 1px 5px 0px #4a4a4a;
}
#newmenu a {
	display: block;
	height: 210px;
	width: 310px;
}
#newmenu a:hover {
	background-image: url(../images/upcoming/menuhover.png);
	display: block;
	height: 210px;
	width: 310px;
}
#breakfast {
	background-image: url(../images/menu/breakfast.png);
	-webkit-box-shadow: 0px 1px 5px 0px #4a4a4a;
	-moz-box-shadow: 0px 1px 5px 0px #4a4a4a;
	box-shadow: 0px 1px 5px 0px #4a4a4a;
}
#breakfast a {
	display: block;
	height: 210px;
	width: 310px;
}
#breakfast a:hover {
	background-image: url(../images/menu/breakfasthover.png);
	display: block;
	height: 210px;
	width: 310px;
}
#grill {
	background-image: url(../images/menu/grill.png);
	-webkit-box-shadow: 0px 1px 5px 0px #4a4a4a;
	-moz-box-shadow: 0px 1px 5px 0px #4a4a4a;
	box-shadow: 0px 1px 5px 0px #4a4a4a;
}
#grill a {
	display: block;
	height: 210px;
	width: 310px;
}
#grill a:hover{
	background-image: url(../images/menu/grillhover.png);
	display: block;
	height: 210px;
	width: 310px;
}
#sandwich {
	background-image: url(../images/menu/sandwiches.png);
	-webkit-box-shadow: 0px 1px 5px 0px #4a4a4a;
	-moz-box-shadow: 0px 1px 5px 0px #4a4a4a;
	box-shadow: 0px 1px 5px 0px #4a4a4a;
}
#sandwich a {
	display: block;
	height: 210px;
	width: 310px;
}
#sandwich a:hover {
	background-image: url(../images/menu/sandwicheshover.png);
	display: block;
	height: 210px;
	width: 310px;
}
#dinner {
	background-image: url(../images/menu/dinner.jpg);
	-webkit-box-shadow: 0px 1px 5px 0px #4a4a4a;
	-moz-box-shadow: 0px 1px 5px 0px #4a4a4a;
	box-shadow: 0px 1px 5px 0px #4a4a4a;
}
#dinner a {
	display: block;
	height: 210px;
	width: 310px;
}
#dinner a:hover {
	background-image: url(../images/menu/dinnerhover.jpg);
	display: block;
	height: 210px;
	width: 310px;
}
#ukrainian {
	background-image: url(../images/menu/ukrainian.png);
	-webkit-box-shadow: 0px 1px 5px 0px #4a4a4a;
	-moz-box-shadow: 0px 1px 5px 0px #4a4a4a;
	box-shadow: 0px 1px 5px 0px #4a4a4a;
}
#ukrainian a {
	display: block;
	height: 210px;
	width: 310px;
}
#ukrainian a:hover{
	background-image: url(../images/menu/ukrainianhover.png);
	display: block;
	height: 210px;
	width: 310px;
}
#pizza {
	background-image: url(../images/menu/pizza.jpg);
	-webkit-box-shadow: 0px 1px 5px 0px #4a4a4a;
	-moz-box-shadow: 0px 1px 5px 0px #4a4a4a;
	box-shadow: 0px 1px 5px 0px #4a4a4a;
}
#pizza a {
	display: block;
	height: 210px;
	width: 310px;
}
#pizza a:hover {
	background-image: url(../images/menu/pizzahover.jpg);
	display: block;
	height: 210px;
	width: 310px;
}
#liquor {
	background-image: url(../images/menu/liquor.jpg);
	-webkit-box-shadow: 0px 1px 5px 0px #4a4a4a;
	-moz-box-shadow: 0px 1px 5px 0px #4a4a4a;
	box-shadow: 0px 1px 5px 0px #4a4a4a;
}
#liquor a {
	display: block;
	height: 210px;
	width: 310px;
}
#liquor a:hover {
	background-image: url(../images/menu/liquorhover.jpg);
	display: block;
	height: 210px;
	width: 310px;
}
#hours {
	background-image: url(../images/upcoming/hours.png);
	-webkit-box-shadow: 0px 1px 5px 0px #4a4a4a;
	-moz-box-shadow: 0px 1px 5px 0px #4a4a4a;
	box-shadow: 0px 1px 5px 0px #4a4a4a;
}
#hours a {
	display: block;
	height: 210px;
	width: 310px;
}
#hours a:hover {
	background-image: url(../images/upcoming/hourshover.png);
	display: block;
	height: 210px;
	width: 310px;
}
#market {
	background-image: url(../images/upcoming/market.png);
	-webkit-box-shadow: 0px 1px 5px 0px #4a4a4a;
	-moz-box-shadow: 0px 1px 5px 0px #4a4a4a;
	box-shadow: 0px 1px 5px 0px #4a4a4a;
}
#market a {
	display: block;
	height: 210px;
	width: 310px;
}
#market a:hover {
	background-image: url(../images/upcoming/markethover.png);
	display: block;
	height: 210px;
	width: 310px;
}
#1 {
	background-image: url(../images/gallery/Thumbs/1Thumb.jpg);
}
#2 {
	background-image: url(../images/gallery/Thumbs/2Thumb.jpg);
}
#3 {
	background-image: url(../images/gallery/Thumbs/3Thumb.jpg);
}
#4 {
	background-image: url(../images/gallery/Thumbs/4Thumb.jpg);
}
#5 {
	background-image: url(../images/gallery/Thumbs/5Thumb.jpg);
}
#6 {
	background-image: url(../images/gallery/Thumbs/6Thumb.jpg);
}
#7 {
	background-image: url(../images/gallery/Thumbs/7Thumb.jpg);
}
#8 {
	background-image: url(../images/gallery/Thumbs/8Thumb.jpg);
}
#9 {
	background-image: url(../images/gallery/Thumbs/9Thumb.jpg);
}
#10 {
	background-image: url(../images/gallery/Thumbs/10Thumb.jpg);
}
#11 {
	background-image: url(../images/gallery/Thumbs/11Thumb.jpg);
}
#12 {
	background-image: url(../images/gallery/Thumbs/12Thumb.jpg);
}
#13 {
	background-image: url(../images/gallery/Thumbs/13Thumb.jpg);
}
#14 {
	background-image: url(../images/gallery/Thumbs/14Thumb.jpg);
}
#15 {
	background-image: url(../images/gallery/Thumbs/15Thumb.jpg);
}
#16 {
	background-image: url(../images/gallery/Thumbs/16Thumb.jpg);
}
#17 {
	background-image: url(../images/gallery/Thumbs/17Thumb.jpg);
}
#18 {
	background-image: url(../images/gallery/Thumbs/18Thumb.jpg);
}
