/* style sheet for the minturn saloon /* ----------------------------------------------------------------- LISTING ORDER -------------------------------------------------------------------- Universal Page Structure -Head -Nav -Sub Nav -Content -Footer Content Images -------------------------------------------------------------------- -------------------------------------------------------------------- Universal -------------------------------------------------------------------- */ * { margin: 0; padding: 0; } body { background: transparent url(../images/patterns/background-pat.jpg) repeat scroll left top; color: #000000; font-family: Times New Roman, Times, serif; font-size: 62.5%; /* 16px ? 62.5% = 10px */: ; margin: 0 auto; text-align: center; } h1 { color: #1e1c1b; font-size: 2em; /* 10px ? 2em = 20px */: ; margin: 0; padding: 0; } h2 { color: #1e1c1b; font-family: Georgia; font-size: 2.2em; /* 10px ? 2.2em = 22px */: ; font-weight: lighter; margin: 0; padding: 0 0 10px 0; } h3 { color: #6F2229; font-size: 1.8em; /* 10px ? 1.8em = 18px */: ; margin: 0; padding: 0 0 15px 0; } h4 { color: #6F2229; font-size: 1.8em; /* 10px ? 1.8em = 18px */: ; margin: 0; padding: 0 0 15px 0; } h5 { color: #6F2229; font-size: 1.8em; /* 10px ? 1.8em = 18px */: ; margin: 0; padding: 0 0 15px 0; } h6 { color: #6F2229; font-size: 1.8em; /* 10px ? 1.8em = 18px */: ; margin: 0; padding: 0 0 15px 0; } p { color: #1e1c1b; font-size: 1.4em; /* 10px ? 1.4em = 14px */: ; margin: 0; padding: 0 0 15px 0; text-align: justify; } li { font-size: 1.4em; /* 10px ? 1.4em = 14px */: ; margin: 0; padding: 0 0 15px 0; } a { color: #2B5466; outline: none; } a:hover { color: #CF350C; text-decoration: none; } /* ----------------------------------------------------------------- Page Structure -------------------------------------------------------------------- */ /* ------------------HEAD------------------------*/ #head-repeat { background: transparent url(../images/head-repeat.jpg) repeat-x scroll left top; height: 314px; margin: 0 auto; overflow: hidden; width: 100%; } #head-wrap { background: url(../images/head-wrap.jpg) transparent no-repeat 50% 0; height: 314px; margin: 0 auto; overflow: hidden; text-align: center; width: 100%; } #header { background: url(../images/header.jpg) transparent no-repeat top left; height: 314px; margin: 0 auto; overflow: hidden; width: 600px; } #minturn-broadway { background: url(../images/minturn-broadway.jpg) transparent no-repeat top left; float: left; height: 96px; margin-top: 36px; text-indent: -9999px; width: 600px; } #buff-wrap { float: left; position: relative; height: 100px; width: 600px; } #moreinfo { position: absolute; display: block; text-indent: -10000px; text-decoration: none; width: 162px; height: 100px; top: 0; left: 220px; cursor: pointer; } .floatingpanel { position: relative; display: block; margin-top: 0px; margin-left: -3px; width: 180px; height: 109px; padding-top: 1px; padding-left: 40px; padding-right: 20px; background: transparent url(../images/commentbub/commentBubble-buf.png) no-repeat top left; text-indent: 0px; color: #333333; display: none; } #moreinfo:hover .floatingpanel { display: block } .floatingpanel p { margin: 0; margin-top: 8px; padding: 0; color: #333333; text-align: center; display: block; width: 180px; } .moreinfo { position: absolute; display: block; text-indent: -10000px; text-decoration: none; width: 162px; height: 100px; } #minturn-home { background: url(../images/minturn-home.jpg) transparent no-repeat top left; float: left; height: 56px; text-indent: -9999px; width: 600px; } #social-small { float: left; height: 22px; width: 543px; padding-left: 57px; } #social-small a { float: left; padding: 6px 0 0; } #social-small a img { border: none } .bubbleInfo { position: relative; top: 0; left: 0; width: 16px; float: left; margin-left: 8px; } .trigger { position: absolute } /* Bubble pop-up */ .popup { position: absolute; display: none; z-index: 50; border-collapse: collapse; width: 105px; height: 82px; background: transparent url(../images/commentbub/follow.png) no-repeat top left; text-indent: 0px; padding-left: 12px; } .popup p { margin-top: 15px; line-height: .8em; } /* ------------------NAV------------------------*/ #nav-wrap { background: url(../images/nav-wrap.png) transparent no-repeat 50% 0; clear: left; height: 102px; margin: 0 auto; overflow: hidden; text-align: center; width: 100%; } #nav { height: 34px; margin: 0 auto; padding: 0; width: 600px; } #nav ul { padding: 0; margin: 0; } #nav li { float: left; list-style-position: outside; list-style-type: none; position: relative; margin: 0; padding: 0; } #nav a { display: block; padding: 34px 0 0 0; overflow: hidden; height: 0px !important; height : 34px; } #nav a#home { background: url(../images/nav/home.jpg) top left no-repeat; width: 90px; } #nav a#home:hover { background-position: 0 -34px } #nav a#home:active, #nav a#home.selected { background-position: 0 -34px } #nav a#menu { background: url(../images/nav/menu.jpg) top left no-repeat; width: 100px; } #nav a#menu:hover { background-position: 0 -34px } #nav a#menu:active, #nav a#menu.selected { background-position: 0 -34px } #nav a#groups { background: url(../images/nav/groups-n-parties.jpg) top left no-repeat; width: 220px; } #nav a#groups:hover { background-position: 0 -34px } #nav a#groups:active, #nav a#groups.selected { background-position: 0 -34px } #nav a#about { background: url(../images/nav/about.jpg) top left no-repeat; width: 90px; } #nav a#about:hover { background-position: 0 -34px } #nav a#about:active, #nav a#about.selected { background-position: 0 -34px } #nav a#contact { background: url(../images/nav/contact.jpg) top left no-repeat; width: 100px; } #nav a#contact:hover { background-position: 0 -34px } #nav a#contact:active, #nav a#contact.selected { background-position: 0 -34px } /* ------------------SUB NAV------------------------*/ li ul { background: url(../images/nav/sub-menu.png) no-repeat; display: none; height: 30px; position: absolute; top: 34px; text-align: center; z-index: 9999; } li ul.menu-sub { width: 575px; right: -390px; top: 34px; z-index: 9999; } li ul.group-sub { width: 565px; right: -175px; top: 34px; z-index: 9999; } li ul.about-sub { width: 565px; right: -95px; top: 34px; z-index: 9999; } li ul.contact-sub { width: 235px; right: 2px; top: 34px; z-index: 9999; } li li { float: right; background-color: transparent; font-size: 100%; border: 0 none; display: inline-block; } #nav li li a { color: #2B5466; display: inline-block; padding: .4em 12px; position: relative; overflow: visible; } #nav li li a:hover { color: #CF350C; display: inline-block; text-decoration: none; } #nav li li a.sub-select { color: #CF350C; display: inline-block; text-decoration: none; } li > ul { top: auto; left: auto; } li:hover ul, li.over ul { display: block } /* ------------------CONTENT------------------------*/ #content-wrap { background: url(../images/content-wrap.png) transparent scroll repeat-y 50% 0; clear: both; margin: 0 auto; min-height: 300px; text-align: center; width: 100%; } #content-nav { height: 15px; margin: 15px auto; width: 540px; } #content-nav ul { margin: auto; width: 540px; } #content-nav li { float: left; list-style-position: outside; list-style-type: none; position: relative; margin-bottom: 20px; padding: 0 8px 20px 4px; } p#bread { width: 540px; margin: auto; text-align: left; position: relative; } a.bread-select { color: #CF350C; text-decoration: none; } #h2-wrapper { background: url(../images/blackline.jpg) repeat-x scroll center center; width: 540px; margin: auto; padding: 0; } h2 span { background: #DECEB2 none repeat scroll 0 0; position: relative; } #content-area { background: #DECEB2; margin: 0 auto; width: 550px; text-align: left; } #content-area h3 a.normal-hTag { color: #1e1c1b; text-align: center; } #content-area a.normal-pTag { color: #6F2229 } #content-area .highlight { color: #CF350C } #content-area p { line-height: 1.4em } #content-area p.right-top { float: right } #content-area ul { padding-bottom: 15px } #content-area li { list-style: inherit; margin-left: 30px; padding: 0 0 5px 0; text-indent: 10px; } #content-area #left-column { border: 4px #B18C65 solid; float: left; height: 180px; margin: 0 auto; position: relative; width: 260px; } #content-area #left-column h3 { margin-top: 10px; text-align: center; } #content-area #left-column p { padding-left: 15px; text-align: left; } #content-area #right-column { border: 4px #B18C65 solid; float: right; height: 180px; margin: 0 auto; position: relative; width: 260px; } #content-area #right-column h4 { margin-top: 10px; text-align: center; } #content-area #right-column p { padding-left: 15px; text-align: left; } #content-area dl.no-back { background: none; margin: 20px 0 0 0; width: 540px; } #content-area dl { background-image: url(../images/content-images/dot.jpg); background-position: 0px 13px; background-repeat: repeat-x; margin: 20px 0 0 0; overflow: auto; width: 540px; } #content-area dt { float: left; padding-right: 3px; } #content-area dd.price { float: right; padding-left: 3px; } #content-area dt, dd.price { background-color: #DECEB2; font-size: 1.5em; /* 10px ? 1.5em = 15px */: ; } #content-area dd.price { font-weight: bold } #content-area dd.ingredients { float: left; font-size: 1.4em; /* 10px ? 1.4em = 14px */: ; text-align: left; padding: 3px 0pt; width: 100%; } #content-area table { margin: 15px 0 0 0 } #content-area table p { font-weight: normal } #content-area ul.marg-list { padding: 0 0 0 14px } #content-area ul.marg-list li { list-style-position: inside; list-style-type: none; margin: 0; padding: 0; text-indent: 0; } #special-tonight { border: 4px #B18C65 solid; height: 100%; margin: 0 auto; text-align: center; width: 540px; } #special-tonight p { font-weight: bold; padding-top: 10px; text-align: center; } .hr { border-top: 2px #B18C65 solid; height: 4px; width: 550px; margin: 0 auto; padding: 0 0 20px; } .thumbnail { padding: 0 0 20px 5px } .thumbnail a img { padding: 2px; border: solid 2px #2B5466; } .thumbnail a:hover img { padding: 2px; border: solid 2px #CF350C; } .video { padding-bottom: 20px } element.style { text-indent: -9999px !important } #content-area span.red {color: #CF350C;} /* ------------------copywrite------------------------*/ #copywrite-wrap { background: url(../images/copywrite-wrap.png) transparent no-repeat 50% 0; clear: both; height: 90px; margin: 0 auto; overflow: hidden; text-align: center; width: 100%; } #copywrite { background: url(../images/copywrite-back.jpg) transparent no-repeat left top; height: 50px; margin: 40px auto; width: 600px; } #copywrite p { float: left; line-height: 1.6em; margin-top: 0; text-align: left; width: 400px; } #copywrite p.social-large { margin-top: 0; width: 200px; } #copywrite p.social-large a { float: right; margin-left: 15px; padding-top: 5px; } #copywrite p.social-large a img { border: none } /* ------------------FOOTER------------------------*/ #footer-repeat { background: transparent url(../images/footer-repeat.jpg) repeat-x scroll left bottom; height: 170px; margin: 0 auto; overflow: hidden; width: 100%; } #footer-wrap { background: url(../images/footer-wrap.jpg) transparent no-repeat 50% 0; height: 170px; margin: 0 auto; overflow: hidden; text-align: center; width: 100%; } #footer { margin: 0 auto; height: 170px; width: 800px; } #f-left { float: left; height: 170px; width: 250px; } #f-left p { float: left; font-weight: bold; margin-top: 65px; position: relative; left: 85px; text-align: left; } #f-center { float: left; height: 170px; width: 300px; } #f-center p { float: left; font-weight: normal; margin-top: 5px; position: relative; left: 28px; text-align: center; } #f-center {float: left; height: 170px; width:290px;} #f-center p.yelp {float: left; margin-top: 40px;} #f-center p.urbanSpoon {float: left; margin-top: 50px;} #f-center a img {border: none;} #f-right { float: right; height: 170px; width: 250px; } #f-right p { float: right; font-weight: 600; line-height: 1.1em; margin-top: 30px; position: relative; right: 0; text-align: center; width: 250px; } #footer p.left { float: left; font-weight: bold; margin-top: 65px; position: relative; left: 85px; text-align: left; width: 160px; } #footer p.right { float: right; font-weight: 600; line-height: 1.1em; margin-top: 30px; position: relative; right: 0; text-align: center; width: 250px; } #footer p.right span { color: #6F2229; font-weight: bold; } #footer a { color: #1e1c1b } #footer a:hover { color: #CF350C } /* ----------------------------------------------------------------- Content Images -------------------------------------------------------------------- */ img.center { border: 4px #B18C65 solid; float: left; margin: 5px 0 15px 0; } img.right { border: 4px #B18C65 solid; float: right; margin: 5px 0 10px 20px; } img.left { border: 4px #B18C65 solid; float: left; margin: 5px 15px 10px 0; }