/*------------------------------------------------------------------------------------------- It is imparative as a web development company that we use clean CSS and that we use it to our full potential. The idea is to use basic tables for layout, and have CSS control 100% the rest of your content, from content layout, fonts, navigations and everything possible! To get more information on CSS use these links: -- Everything CSS - http://www.w3.org/Style/CSS/ -- Learn CSS - http://www.w3.org/Style/CSS/learning -- CSS Specs - http://www.w3.org/Style/CSS/#specs Take charge and educate yourself on usefull CSS implementation. ---------------------------------------------------------------------------------------------*/ /*------------------------------------ This is the body tags you must use this to set the website parameters, do NOT put info inside of the tag, use css instead. ------------------------------------*/ body { background-color:black; margin-top:0px; margin-bottom:0px; margin-left:0px; margin-right:0px; } /* DIV CONTAINERS */ .spacer { clear:both; } .bar { background-image: url(/images/flashbg.gif); background-repeat: no-repeat; height: 225px; width: 896px; padding: 0px 9px 0px 10px; } .logo { position: absolute; z-index: 100; padding: 5px; } #header { z-index: 1; } a img{border:none;} .div_container { width: 915px; background-color: white; background-image: url(../images/bg-container.gif); background-repeat: repeat-x; text-align:left; } .div_content { width: 835px; background-color: #0B0A2C; text-align:left; margin-left: 10px; padding: 10px 30px 10px 30px; } .div_nav { width: 895px; } .div_footer { width: 875px; background-color: black; margin-left: 10px; padding: 10px; text-align:right; } .div_underwater { background-image: url(../images/bg-underwater.jpg); background-repeat: no-repeat; background-position: top center; } .div_calendar { } .div_menu { } /*------------------------------------ Text formatting. Use this area for all of your text formatting. Use this for coontent tags, footer tags, etc. ------------------------------------*/ .nav { font-family:arial; font-size: 10px; color: white; } .content { font-family: arial; font-size: 12px; color: white; } .home-content{ font-size:16px; line-height:24px; color:#A09FBE; } .calendar { font-family: arial; font-size: 12px; color: white; } .printable { float: right; font-weight: bold; font-style: italic; } #menucont { padding:0; margin:0; list-style:none; height:43px; position:relative; z-index:600; font-size: 13px; font-weight: bold; color: #fff; } ul.menulist { margin: 0px; padding: 0px; } #menucont li { display:block; float:left; height:38px; } #menucont li a { display:block; float:left; height:38px; line-height:38px; padding:0 5px; margin:0 2px; background-color: #21325F; border: 1px solid #336699; } #menucont li a:hover { background-color: #1B284B; } .menu-category { width:824px; font-size: 24px; font-weight:bold; color:#FFFFFF; float:left; clear: both; padding: 5px 0px 0px 0px; margin: 5px 0px 0px 0px; border-top: 1px solid #FFFFFF; } .menuCategoryImage { float:right; padding-right:10px; } .menu-title { font-size: 14px; font-weight:bold; color:#FFCC00; } .menu-description { font-style: italic; } .menu-price { font-weight: bold; color: #DA7005; } .menubox { float: left; width: 390px; height: 85px; padding: 10px; background-color: #121148; margin: 2px; } .menuItemName { font-size: 14px; font-weight:bold; } .menuItemPrice { font-size: 12px; font-style:italic; } .menuItemDescription { font-size: 12px; } .footer { font-family:arial; font-size: 11px; color: white; } /*------------------------------------ Set your links here. There are two examples. The main links for the website and a specific link class to use. ------------------------------------*/ .content a:link { color:gold; text-decoration:none; } .content a:visited { color:gold; text-decoration:none; } .content a:hover { color:yellow; text-decoration:none; } .calendar a:link { color:#0B0A2C; text-decoration:none; } .calendar a:hover { color:yellow; text-decoration:none; } .footer a:link { color:gold; text-decoration:none; } .footer a:visited { color:gold; text-decoration:none; } .footer a:hover { color:yellow; text-decoration:none; } /*------------------------------------ Keep your title formatting seperate from your text for organization. Format your titles below. ------------------------------------*/ .title{ font-family: arial; font-size:24px; font-weight:bold; color:#ffffff; font-style:italic; text-shadow: #000099 5px 5px 5px; } /*------------------------------------ In many of our websites, we format the submit buttons. Below is example css to format those buttons. ------------------------------------*/ .formbutton { background-color: #0B0A65; font-size:10px; font-weight:bold; color: #ffffff; border: 2px solid #ffffff; padding: 3px; } /*------------------------------------ If you are formatting tables, IE, backgrounds, text, or anything as such, use the code samples listed below. ------------------------------------*/ .sidepic { border:5px solid white; margin-bottom:5px; } .footertable { background-image:url(../images/footerbg.jpg); background-position:bottom; background-repeat:repeat-x; background-color: #9d001d; padding: 10px; border-top: 4px solid #ffffff; border-right: 1px solid #ffffff; border-left: 1px solid #ffffff; border-bottom: 1px solid #ffffff; } .calendartable { } .calendarhead{ background-color:#666; } .calendarweekdays { background-color:#999; color:#0B0A2C; } .calendarblanks { background-color:#CCC; } .calendardays { background-color:#666; } /*------------------------------------ Use the code below if you will be using an additional css file seperate from this file. This can be used for our dropdown menu system or the tab content system. Customize for your own development. ------------------------------------*/ /* Google Map Tool Tip */ .tooltip{ background-color:#FFFFFF; border:2px solid #CCCCCC; padding:5px; white-space:nowrap; } /* @import url('dropdown_menu.css'); /* IE4 can understand, but not NN4 */ /* ROUND CORNER BOX CODE */ /* set the image to use and establish the lower-right position */ .cssbox, .cssbox_body, .cssbox_head, .cssbox_head h2{ background: transparent url(../images/box.gif) no-repeat bottom right} .cssbox{ /* intended total box width - padding-right(next) */ width:335px !important; /* IE Win = width - padding */ width: 320px; /* the gap on the right edge of the image (not content padding) */ padding-right:15px; /* use to position the box */ margin:20px auto} /* set the top-right image */ .cssbox_head{background-position:top right; /* pull the right image over on top of border */ margin-right:-15px; /* right-image-gap + right-inside padding */ padding-right:40px} /* set the top-left image */ .cssbox_head h2{ background-position:top left; margin:0; /* reset main site styles*/ border:0; /* ditto */ /* padding-left = image gap + interior padding ... no padding-right */ padding:5px 0px 0px 10px; height:auto !important; height:1%} /* IE Holly Hack */ /* set the lower-left corner image */ .cssbox_body{ background-position:bottom left; margin-right:25px; /* interior-padding right */ padding:0px 0px 1px 10px} /* mirror .cssbox_head right/left */ .special { float: left; width: 395px; margin: 2px; padding: 5px; height: 175px; border: 1px solid #C1E5EF; } .special strong { font-size: 18px; color: #FFD700; }