/* -------------------------------------------------------------- ----------------------------------------------------------------- DEFINITIONS: Global styles AUTHOR: The Cupcake Shoppe VERSION: 12.08.2009 CONTENTS: 1 Typography 2 Colors 3 Alignments 4 Links 5 Form Elements 6 Header 7 Footer 8 Navigation 9 Page HOME ----------------------------------------------------------------- -------------------------------------------------------------- */ /* 1 Typography =============================================================== */ body#home h1 {font:bold 18px Arial; color:#f4a9b7; text-align: center; padding-bottom: 25px;} body#home h2 {font:bold 14px Arial; color:#8a5b3d; text-align: center; font-style: italic; padding-bottom: 25px;} body#menu h1 {font-size:18px; text-align: center; letter-spacing: .1em; line-height: 1.3em; margin-bottom:30px;} body#events h1, body#events h2 {font:bold 14px Arial; text-align: center; padding-bottom:15px;} p {line-height:1.6em; margin-bottom:18px; text-align: justify;} p.success {text-align:center; font-size:18px; color:#8ca217;} p.error {text-align:center; font-size:18px; color:#e7101e;} .bold {font-weight: bold;} /* 2 Colors =============================================================== */ /* 3 Alignments =============================================================== */ .alignRight {text-align:right;} .alignCenter {text-align:center;} .clearBoth {clear:both; height:1px;} .clearRight {clear:right;} .floatLeft {float:left;} .floatRight {float:right;} .margin0 {margin:0;} .height10 {height:10px;} .paddtop20 {padding-top: 20px;} #displaynone {display:none;} .mright30 {margin-right:30px;} /* 4 Links =============================================================== */ a, a:hover, a:visited, a:active {color:#8a5b3d;} a.logo {float:left; width:156px; height:156px; background:url(../images/logo.png) no-repeat; margin-left:1px;} a.twitter {float:left; padding-top:30px; margin:0 20px 0 100px;} a.download_menu {float:left; padding:15px 0 0; margin-left:20px;} /* 5 Form Elements =============================================================== */ .input_newsletter {border:1px solid #000; padding:3px; font-size: 11px; color:#8a5b3d; width:200px;} /* 6 Header =============================================================== */ /* 7 Footer =============================================================== */ #footer_text p {text-align: center; font-size: 11px; padding:5px 0 0 0; margin:0;} /* 8 Navigation =============================================================== */ ul#nav_left a, ul#nav_right a {color:#8a5b3d; text-decoration: none; padding:13px 16px;} ul#nav_left, ul#nav_right {float:left; font:12px Arial; text-transform: uppercase; background:url(../images/bg/nav_dot.gif) repeat-x bottom;} ul#nav_left li, ul#nav_right li {display: inline;} ul#nav_left {float:left; margin:70px 0 0 50px; height:30px; padding-right:15px;} ul#nav_right {float:right; margin:70px 50px 0 0; height:30px; padding-left:8px;} ul#nav_right a.faq {padding:14px 19px;} #header a.active {background:url(../images/bg/nav_active.gif) no-repeat bottom center;} #header a:hover {text-decoration: underline;} /* 9 Page HOME =============================================================== */ #newsletter {float:left; width:395px; height:30px; padding:4px 10px 8px 10px; background-color:#fbedf0; margin:20px 0 0; } #newsletter ul li {display: inline; padding:0 4px; float:left;} #newsletter ul li.first {padding-top:7px;} #newsletter ul li label {font-size:11px; padding-right:10px;} a.flavorofweek {float:left; margin-left:70px;} a.edit_circle { float:left; margin-left:40px; width:94px; height:62px; background: url(../images/edit_circle.gif) no-repeat; text-align: center; color:#543018; padding:30px 10px 25px 10px; text-decoration: none; font:bold 11px Arial; line-height:1.3em; } a.edit_circle:hover {text-decoration: underline;} p.hours {font-size:11px; float: left; padding:15px 0 0; text-align: center; width:380px; } p.hours span {padding:0 10px;} /* 10 Page MENU =============================================================== */ .m_item {float:left; width:200px; text-align: center; margin:15px 5px;} .m_item h2 {font:bold 14px Arial; padding:10px 0 5px 0; letter-spacing: .05em;} .m_item p {text-align: center; margin:0;} /* 10 Page PRESS =============================================================== */ body#press .m_item h2 {line-height: 1.5em;} body#press .m_item p {font-style: italic;} body#press .m_item a {text-decoration: none;} body#press .m_item a:hover h2, body#press .m_item a:hover p {text-decoration: underline;} /* 11 Page CONTACT =============================================================== */ ul.contact {float:left; width:210px;} ul.contact li {line-height:1.4em;} ul.contact li.blank {height:15px;} ul.contact li.twitter_facebook {text-align: center; padding-top:20px;} ul.contact li.twitter_facebook a {margin:0 5px;} /* 12 Page FAQ =============================================================== */ ul.faq li {padding: 4px 0;} /* 13 Page GALLERY =============================================================== */ .list_gallery_display { display: block; height: 423px; position: relative; width: 311px; z-index: 1; cursor:pointer; float:left; text-align: center; overflow: hidden; } .list_gallery_display span { background: url(/assets/frontend/images/gallery_big_mask.png) no-repeat top center; cursor: pointer; display: block; height: 423px; left: 0; position: absolute; top: 0; width: 311px; z-index: 2; } .list_gallery_list {float:right; width:465px;} .list_gallery_list a { display: block; height: 74px; position: relative; width: 74px; z-index: 1; cursor:pointer; float:left; text-align: center; overflow: hidden; } .list_gallery_list span { background: url(/assets/frontend/images/gallery_thumb_mask.png) no-repeat top center; cursor: pointer; display: block; height: 74px; left: 0; position: absolute; top: 0; width: 74px; z-index: 2; } #tab-container-gallery-nav {float:right; width:330px; margin:0 20px 20px 0;} #tab-container-gallery-nav li {display:inline;} #tab-container-gallery-nav .active {font-weight:bold; background-position: 0 0;} #tab-container-gallery-nav a {float:left; width:80px; height:58px; background-position: 0 -58px; margin-left:30px;} .tab_birthdays {background:url(../images/tab_on_birthdays.gif) no-repeat;} .tab_weddings {background:url(../images/tab_on_weddings.gif) no-repeat;} .tab_so {background:url(../images/tab_on_so.gif) no-repeat;}