/***************************************************************************** if the style in question starts with or has a . then it is a class and should be called by using class='thisClass' i.e. if the style in question starts with or has a # then it is an id and should be called by using id='thisClass' i.e. ID's should only be used once on a page and shouldn't be repeated. If you assign styles to standard tags such as

then the style will be applied to any

tag unless you use a class or id. ****************************************************************************/ /***************************************************************************** STANDARD TAG TYPOGRAPHY ****************************************************************************/ * { font-family: 'Arial', 'Helvetica', sans-serif; } h1 { font-family: 'Arial', 'Helvetica', sans-serif; font-size: 18px; color: #FF6633; font-weight: bold; } p { font-family: 'Arial', 'Helvetica', sans-serif; font-size: 13px; color: #000000; } h2 { font-family: 'Arial', 'Helvetica', sans-serif; font-size: 12px; font-weight: bold; } /* ************************************************************************* BACKGROUND IMAGES ************************************************************************/ #home { background-image: url('http://www.villasoleil.com/images/homebg_fl.gif'); } #other { background-image: url('http://www.villasoleil.com/images/sitemapbg.gif'); } #info { background-image: url('http://www.villasoleil.com/images/infobg.gif'); } #location { background-image: url('http://www.villasoleil.com/images/locationbg.gif'); } #stcroix { background-image: url('http://www.villasoleil.com/images/fishbg.gif'); } #friends { background-image: url('http://www.villasoleil.com/images/friendsbg.gif'); } #photos { background-image: url('http://www.villasoleil.com/images/photosbg.gif'); } #travel { background-image: url('http://www.villasoleil.com/images/travelbg.gif'); } /**************************************************************************** SUBNAVIGATION div, a, a:hover **************************************************************************/ .subHome { background-color: #e95800; color: #f9e5d9; width: 100%; font-size: 10px; font-weight: bold; margin-top: 0px; } a.subHome { color: #f9e5d9; font-size: 10px; font-family: 'Arial', 'Helvetica', sans-serif; text-decoration: none; font-style : oblique; text-transform: uppercase; font-weight: bold; } a.subHome:hover { font-family: 'Arial', 'Helvetica', sans-serif; color: #ffffff; text-transform: uppercase; font-weight: bold; } .subOther { font-family: 'Arial', 'Helvetica', sans-serif; color: #778cd6; width: 100%; font-size: 13px; font-weight: bold; margin-top: 0px; font-weight: bold; } a.subOther { font-family: 'Arial', 'Helvetica', sans-serif; color: #778cd6; font-size: 12px; text-decoration: underline; font-style : oblique; text-transform: uppercase; font-weight: bold; } a.subOther:hover { font-family: 'Arial', 'Helvetica', sans-serif; color: #c5cde8; text-transform: uppercase; font-weight: bold; } .subInfo { font-family: 'Arial', 'Helvetica', sans-serif; color: #4874d4; width: 100%; font-size: 13px; font-weight: bold; } a.subInfo { font-family: 'Arial', 'Helvetica', sans-serif; color: #4874d4; font-size: 12px; text-decoration: underline; font-style : oblique; text-transform: uppercase; font-weight: bold; } a.subInfo:hover { font-family: 'Arial', 'Helvetica', sans-serif; color: #bfcef0; text-transform: uppercase; font-weight: bold; } .subLocation { font-family: 'Arial', 'Helvetica', sans-serif; color: #009933; width: 100%; font-size: 13px; font-weight: bold; text-transform: uppercase; } a.subLocation { font-family: 'Arial', 'Helvetica', sans-serif; color: #009933; font-size: 12px; text-decoration: underline; font-style : oblique; text-transform: uppercase; font-weight: bold; } a.subLocation:hover { font-family: 'Arial', 'Helvetica', sans-serif; color: #c1e7d8; text-transform: uppercase; font-weight: bold; } .subStcroix { font-family: 'Arial', 'Helvetica', sans-serif; color: #5a10b8; width: 100%; font-size: 13px; font-weight: bold; text-transform: uppercase; } a.subStcroix { font-family: 'Arial', 'Helvetica', sans-serif; color: #5a10b8; font-size: 12px; text-decoration: underline; font-style : oblique; text-transform: uppercase; font-weight: bold; } a.subStcroix:hover { font-family: 'Arial', 'Helvetica', sans-serif; color: #bfa2e3; text-transform: uppercase; font-weight: bold; } .subSubStcroix { font-family: 'Arial', 'Helvetica', sans-serif; color: #5a10b8; width: 100%; font-size: 11px; font-weight: bold; text-transform: uppercase; } a.subSubStcroix { font-family: 'Arial', 'Helvetica', sans-serif; color: #5a10b8; font-size: 11px; text-decoration: none; font-style : oblique; text-transform: uppercase; font-weight: bold; } a.subSubStcroix:hover { font-family: 'Arial', 'Helvetica', sans-serif; color: #bfa2e3; text-transform: uppercase; font-weight: bold; } .subFriends { font-family: 'Arial', 'Helvetica', sans-serif; color: #c400ae; width: 100%; font-size: 13px; font-weight: bold; text-transform: uppercase; } a.subFriends { font-family: 'Arial', 'Helvetica', sans-serif; color: #c400ae; font-size: 12px; text-decoration: underline; font-style : oblique; text-transform: uppercase; font-weight: bold; } a.subFriends:hover { font-family: 'Arial', 'Helvetica', sans-serif; color: #e89bdf; text-transform: uppercase; font-weight: bold; } .subPhotos { font-family: 'Arial', 'Helvetica', sans-serif; color: #0091c0; width: 100%; font-size: 13px; font-weight: bold; text-transform: uppercase; } a.subPhotos { font-family: 'Arial', 'Helvetica', sans-serif; color: #0091c0; font-size: 12px; text-decoration: underline; font-style : oblique; text-transform: uppercase; font-weight: bold; } a.subPhotos:hover { font-family: 'Arial', 'Helvetica', sans-serif; color: #90cfe4; text-transform: uppercase; font-weight: bold; } .subTravel { font-family: 'Arial', 'Helvetica', sans-serif; color: #CC0000; width: 100%; font-size: 13px; font-weight: bold; text-transform: uppercase; } a.subTravel { font-family: 'Arial', 'Helvetica', sans-serif; color: #CC0000; font-size: 12px; text-decoration: underline; font-style : oblique; text-transform: uppercase; font-weight: bold; } a.subTravel:hover { font-family: 'Arial', 'Helvetica', sans-serif; color: #eea6bd; text-transform: uppercase; font-weight: bold; } .subSpecialties { font-family: 'Arial', 'Helvetica', sans-serif; color: #3333FF text-transform: uppercase; font-style : oblique; font-size: 13px; font-weight: bold; text-decoration: underline; } .subSpecialtiesB { font-family: 'Arial', 'Helvetica', sans-serif; color: #3333FF text-transform: uppercase; font-style : oblique; font-size: 13px; font-weight: bold; text-decoration: none; } /***************************************************************************** CONTAINERS - defines content area of page and sub page ****************************************************************************/ .container { width: 640px; background-color: #ffffff; border: 3px outset #ff6600; padding: 0px 0px 0px 0px; } .secContainer { width: 640px; } /******************************************************************************* BOTTOM CONTAINERS w/ water background ******************************************************************************/ .h2oBlock { background-image: url('http://www.villasoleil.com/images/waterbg.jpg'); background-repeat: no-repeat; width: 640px; border: 3px outset #ff6600; } /******************************************************************************* CLASS TYPOGRAPHY *******************************************************************************/ h1.orange { font-family: 'Arial', 'Helvetica', sans-serif; font-size: 22px; color: #FF6633; font-weight: bold; font-style : oblique; } h1.blue { font-family: 'Arial', 'Helvetica', sans-serif; font-size: 22px; color: #4874d4; font-weight: bold; font-style : oblique; } h1.green { font-family: 'Arial', 'Helvetica', sans-serif; font-size: 22px; color: #009933; font-weight: bold; font-style : oblique; } h1.magenta { font-family: 'Arial', 'Helvetica', sans-serif; font-size: 22px; color: #c400ae; font-weight: bold; font-style : oblique; } h1.teal { font-family: 'Arial', 'Helvetica', sans-serif; font-size: 22px; color: #0091c0; font-weight: bold; font-style : oblique; } h1.red { font-family: 'Arial', 'Helvetica', sans-serif; font-size: 22px; color: #CC0000; font-weight: bold; font-style : oblique; } h1.purple { font-family: 'Arial', 'Helvetica', sans-serif; font-size: 22px; color: #660066; font-weight: bold; font-style : oblique; } h2.purple { font-family: 'Arial', 'Helvetica', sans-serif; font-size: 12px; color: #660066; font-weight: bold; font-style : oblique; } .boldBlue { color: #4874d4; font-weight: bold; font-style: oblique; font-size:14px; } .boldOrange { color: #FF6633; font-weight: bold; font-style : oblique; font-size: 14px; } .boldGreen { color: #009933; font-weight: bold; font-style : oblique; font-size: 14px; } .purple { color: #660066; font-size: 12px; } .boldRed { color: #CC0000; font-weight: bold; font-style: oblique; font-size:14px; } .boldPurple { color: #660066; font-weight: bold; font-style: oblique; font-size:14px; } .boldTeal { color: #0091c0; font-weight: bold; font-style : oblique; font-size: 14px; } h2.purple { font-family: 'Arial', 'Helvetica', sans-serif; font-size: 13px; color: #660066; font-weight: bold; } .botNav { color: #ff6600; text-decoration: none; font-size: 10px; } a.botNav { color: #000099; text-decoration: none; font-size: 10px; } a.botNav:hover { color: #ff6600; } .bigBottom { color: #ff6600; font-size: 16px; font-weight: bold; } .rentTable{ border: 2px inset #ff6600; background-color: #778cd6; color: #ffffff; font-size: 12px; font-weight: bold; text-align: center; padding: 0px 5px 0px 5px; } .rentTable2{ border: 2px inset #ff6600; background-color: #FFFFF; color: #ffffff; font-size: 14px; text-align: center; padding: 0px 5px 0px 5px; } .phoneTable{ font-family: 'Verdana', 'Arial', 'Helvetica', sans-serif; text-align: center; padding: 0px 5px 0px 5px; } .rentBody { border: 2px inset #ff6600; font-size: 12px; padding: 5px; } .phoneBody{ font-size: 12px; } a.rentLink { font-size: 12px; font-weight: bold; padding: 5px; color: #000000; text-decoration: none; } a.rentLink:hover { font-size: 12px; font-weight: bold; padding: 5px; color: #000099; text-decoration: underline; } .contMel { font-size: 12px; font-weight: bold; } .rentHeader { border: 2px inset #ff6600; font-size: 10px; font-weight: bold; background-color: #e3fffd; padding: 5px; } .phoneHeader{ font-size: 12px; } .rentHeader2 { border: 2px inset #ff6600; font-size: 12px; font-weight: bold; background-color: #e3fffd; padding: 5px; } .rentDetails { font-size: 12px; } a.rentDetails { font-size: 11px; text-decoration: none; color: #000000; } a.rentDetails:hover { font-size: 11px; text-decoration: underline; color: #000099; } #mainImage{ border: 2px solid #ffcc00; } .mainNav { font-family: 'Arial', 'Helvetica', sans-serif; border-right: 1px solid #ffffff; } .navText { font-family: 'Arial', 'Helvetica', sans-serif; color: #ffffff; text-transform: uppercase; font-style : oblique; font-size: 12px; font-weight: bold; text-decoration: none; line-height: 12px; padding: 2px; } .navText:hover { font-family: 'Arial', 'Helvetica', sans-serif; color: #ffff33; text-transform: uppercase; font-style : oblique; font-size: 12px; font-weight: bold; text-decoration: none; line-height: 12px; padding: 2px; } * html .navText { font-family: 'Arial', 'Helvetica', sans-serif; color: #ffff33; text-transform: uppercase; font-style : oblique; font-size: 12px; font-weight: bold; text-decoration: none; line-height: 8px; } * html .navText:hover { font-family: 'Arial', 'Helvetica', sans-serif; color: #ffffff; text-transform: uppercase; font-style : oblique; font-size: 12px; font-weight: bold; text-decoration: none; line-height: 8px; } div#blog-feed { text-align: left; padding: 0 0 10px 5px; border-bottom: 2px solid #eee; } div#blog-feed b a { font-family: Arial, Helvetica, sans-serif; text-decoration: underline; font-size: 12px; font-weight: bold; display: block; padding: 0 0 3px 0; } div#blog-feed { color: #888; font-size: 9px; line-height: 14px; } div#blog-feed em { color: rgb(72, 116, 212); font-size: 11px; }