/*============================================== Cyrus Stylesheet ------------------------------------------------ Design by: Cyrus Limited, Inc. - cyrusonline.com Author: Travis Repetto & Brandon Kidd Date: 3-19-2008 Colors used on site ------------------------------------------------ Light Green: #9c9 Mid Green: #696 Dark Green: #575 Light Tan: #e7e6ca Dark Tan: #adac91 ==============================================*/ /* Global */ *{ font-family: Arial, Helvetica, sans-serif; } html, body{ border: 0; font-size: 12px; } body{ color: #333; background: transparent url(Images/bg_bottom.gif) repeat-y top center; } h1, h2, h3, h4, h5, h6, legend{ font-family: Century Gothic, Arial, Helvetica, sans-serif; } h1{ font-size: 24px; } h2{ font-size: 20px; } h3{ font-size: 18px; } h4{ font-size: 16px; } h5{ font-size: 14px; } h6{ font-size: 12px; } hr{ height: 0; margin: 15px 0; border: 0; border-bottom: 2px solid #eee; background: transparent none; } a{ color: #575; outline: none; text-decoration: none; } a:hover{ color: #696; } p a[target="_blank"]{ padding: 0 10px 0 0; background: transparent url(Images/opennew.gif) no-repeat 100% 3px; } address{ font-style: normal; } fieldset{ border: 2px solid #eee; padding: 5px 10px; } legend{ color: #696; font-size: 16px; font-weight: bold; } .ajax-loading{ background: transparent url(Images/ajax-loader.gif) no-repeat center center; } a.morelink{ padding: 2px 7px; border-top: 1px solid #fff; border-left: 1px solid #fff; border-right: 1px solid #d9d8be; border-bottom: 1px solid #d9d8be; background: #fff; white-space: nowrap; color: #696; font-size: 11px; line-height: 22px; text-align: center; text-decoration: none; } a.morelink:hover{ border-top: 1px solid #bbb; border-left: 1px solid #bbb; border-right: 1px solid #fff; border-bottom: 1px solid #fff; background: #d9d8be; color: #666; text-decoration: none; } /* Containers */ #wrap{ background: transparent url(Images/bg_top.gif) repeat-y top center; } #headerwrap, #mainwrap, #subwrap, #footerwrap{ min-width: 960px; } #header, #main, #sub, #footer{ margin: 0 auto; width: 920px; } #headerwrap{ background: transparent url(Images/bg_header.gif) no-repeat top center; } #header{ position: relative; height: 80px; } #mainwrap{ background: transparent url(Images/bg_top.gif) repeat-y top center; } #main{ width: 920px; padding: 20px 0 0 0; } .root #main{ width: 960px; padding: 0; } #main_photo{ width: 960px; height: 300px; background: transparent url(Images/main_photo.jpg) no-repeat; } #subwrap{ background: transparent url(Images/bg_mid.gif) repeat-y top center; } #sub{ padding: 0; background: transparent url(Images/bg_mid_3col.gif) repeat-y top center; } #footerwrap{ background: transparent url(Images/bg_bottom.gif) repeat-y top center; } #footer{ padding: 15px 0; font-size: 11px; line-height: 20px; } /* Header */ #logo{ float: left; display: block; width: 300px; height: 80px; margin: 0 0 0 -20px; background: transparent url(Images/logo_normal.gif) no-repeat top left; } #logo:hover{ background-position: bottom left; } #logo span{ display: none; } #login{ float: right; } #login a{ display: block; width: 170px; height: 35px; background: transparent url(Images/btn_login.gif) no-repeat top left; font-family: Century Gothic, Arial, Helvetica, sans-serif; color: #adac91; font-size: 14px; line-height: 27px; font-weight: bold; text-align: center; } #login a:hover{ background: transparent url(Images/btn_login.gif) no-repeat bottom left; color: #999; } #login span{ display: none; } /* Nav */ #nav{ float: right; _display: inline; width: 625px; height: 25px; margin: 20px 0 0 0; } #nav ul{ list-style: none; } #nav li{ float: left; _display: inline; position: relative; list-style: none; margin: 0 10px; z-index: 10; } #nav li a{ float: left; display: block; height: 25px; color: #999; font-size: 15px; line-height: 25px; font-weight: bold; text-align: center; cursor: pointer; } #nav li a:hover{} #nav li:hover a, #nav li.sfhover a{ color: #666; } /* Nav Selected */ body.root #nav_home, body.about #nav_about_cyrus, body.ehealthsolutions #nav_ehealth_solutions, body.webservices #nav_web_services, body.ourclients #nav_our_clients, body.contact #nav_contact{ background: transparent url(Images/nav_selected_r.gif) no-repeat top right; _background: #8c8 none; } body.root #nav_home:hover, body.about #nav_about_cyrus:hover, body.ehealthsolutions #nav_ehealth_solutions:hover, body.webservices #nav_web_services:hover, body.ourclients #nav_our_clients:hover, body.contact #nav_contact:hover{ background: transparent url(Images/nav_selected_r.gif) no-repeat bottom right; _background: #999 none; } body.root #nav_home span, body.about #nav_about_cyrus span, body.ehealthsolutions #nav_ehealth_solutions span, body.webservices #nav_web_services span, body.ourclients #nav_our_clients span, body.contact #nav_contact span{ display: block; _display: inline; height: 25px; padding: 0 7px; color: #fff; background: transparent url(Images/nav_selected_l.gif) no-repeat top left; _background: transparent none; } body.root #nav_home:hover span, body.about #nav_about_cyrus:hover span, body.ehealthsolutions #nav_ehealth_solutions:hover span, body.webservices #nav_web_services:hover span, body.ourclients #nav_our_clients:hover span, body.contact #nav_contact:hover span{ color: #fff; background: transparent url(Images/nav_selected_l.gif) no-repeat bottom left; _background: transparent none; } /* Nav Dropdowns */ #nav li div{ display: none; position: absolute; top: 17px; left: 0px; width: 195px; padding: 0 0 20px 0; background: transparent url(Images/dropdown_top.png) no-repeat top left; _background: transparent url(Images/dropdown_top.gif) no-repeat top left; z-index: 20; } #nav li ul{ display: none; position: absolute; top: 20px; left: 0px; width: 195px; padding: 0 0 10px 0; background: transparent url(Images/dropdown.png) no-repeat bottom left; _background: transparent url(Images/dropdown.gif) no-repeat bottom left; _filter: alpha(opacity=95); z-index: 20; } #nav li li{ background: transparent none; margin: 0; z-index: 20; } #nav li li a{ display: block; width: 175px; _width: 173px; height: 20px; margin: 0 0 0 5px; _margin: 0 0 0 3px; padding: 0 0 0 10px; background: transparent none; color: #666; font-size: 12px; line-height: 20px; font-weight: bold; text-align: left; } #nav li li a:hover{ color: #fff; background: #696 none; } #nav li > #nav ul{ top: auto; left: auto; } #nav li:hover ul, #nav li.sfhover ul, #nav li:hover div, #nav li.sfhover div{ display: block; } /* Nav Selected Dropdown */ body.root #nav_home li a, body.about #nav_about_cyrus li a, body.ehealthsolutions #nav_ehealth_solutions li a, body.webservices #nav_web_services li a, body.ourclients #nav_our_clients li a, body.contact #nav_contact li a{ color: #666; background: transparent none; } body.root #nav_home li a:hover, body.about #nav_about_cyrus li a:hover, body.ehealthsolutions #nav_ehealth_solutions li a:hover, body.webservices #nav_web_services li a:hover, body.ourclients #nav_our_clients li a:hover, body.contact #nav_contact li a:hover{ color: #fff; background: #696 none; } /* Nav Dropdown Selected */ #nav li li.selected a{ color: #fff; background: #8c8 none; } #nav li li.selected a:hover{ color: #fff; background: #696 none; } /* Font Sizer Custom */ .root .menu{ display: none; } .menu .font_sizer .font_normal, .menu .font_sizer .font_medium, .menu .font_sizer .font_large{ background: transparent none; border: 0 none; margin: 0; padding: 1px 3px; color: #696; font-weight: bold; text-decoration: none; } .menu .font_sizer .font_normal:hover, .menu .font_sizer .font_medium:hover, .menu .font_sizer .font_large:hover{ color: #575; text-decoration: underline; } .menu .font_normal{ font-size: 10px; } .menu .font_medium{ font-size: 14px; } .menu .font_large{ font-size: 18px; margin-right: 0; } /* Main */ #main{ font-size: 12px; } #main_inner{ background: #fff; } #main_content{ float: right; width: 680px; margin: 0 0 20px 0; } #main_sidebar{ float: left; _display: inline; width: 220px; margin: 0 20px 20px 0; padding: 0 0 10px 0; } #main_sidebar li ul{ padding-top: 0; background: transparent none; } .contentrightspacer{ margin: 10px; } #main_content img.pageheader{ width: 600px; height: 100px; border: 0; margin: 0 0 0 0; } #main_content h1, #main_content h2, #main_content h3, #main_content h4, #main_content h5, #main_content h6{ color: #696; } #main_content h1{ margin: 0 0 5px 0; padding: 115px 0 0 0; border-bottom: 1px dashed #696; background: transparent url(Images/pageheader_1.jpg) no-repeat top left; } .about #main_content h1{ background-image: url(Images/header_AboutCyrus.jpg); } .ehealthsolutions #main_content h1{ background-image: url(Images/header_eHealthSolutions.jpg); } .webservices #main_content h1{ background-image: url(Images/header_WebServices.jpg); } .ourclients #main_content h1{ background-image: url(Images/header_OurClients.jpg); } .contact #main_content h1{ background-image: url(Images/header_ContactUs.jpg); } #main_content h2{ margin: 0 0 5px 0; line-height: 24px; } #main_content h2 a:hover{ color: #999; } #main_content p{ margin: 0 0 15px 0; line-height: 20px; text-align: justify; } #main_content p a:hover, #main_content li a:hover{ text-decoration: underline; } #main_content ul{ list-style: none; margin: 0 0 15px 10px; } #main_content li{ list-style: none; margin: 0 0 10px 0; padding: 0 0 0 15px; background: transparent url(Images/bullet.png) no-repeat 0 4px; line-height: 16px; } * html #main_content li{ background: transparent url(Images/bullet.gif) no-repeat 0 4px; } #main_content ul.highlight{ margin: 0; } #main_content ul.highlight li{ background: transparent none; padding: 0; } #main_content ul.highlight h2{ background: #eee url(Images/bullet.png) no-repeat 5px 8px; padding-left: 15px; } #main_content ul.highlight h2 a{ display: block; background: #eee; } #main_content ul.highlight h2 a:hover{ color: #696; text-decoration: none; } * html #main_content ul.highlight h2{ background: transparent url(Images/bullet.gif) no-repeat 5px 8px; } .partners li{ clear: both; } #main_content img.left{ float: left; _display: inline; margin: 10px 20px 5px 0; } #main_content img.right{ float: right; _display: inline; margin: 10px 0 5px 20px; } #main_content dl{ margin: 0 0 20px 0; } #main_content dt{ color: #696; font-size: 14px; line-height: 20px; font-weight: bold; } #main_content dd{ margin: 0 0 15px 0; } #main_content address{ margin: 0 0 5px 0; font-style: normal; } #main_content .button{ padding: 5px 10px; border: 2px solid #adac91; background: #e7e6ca; color: #adac91; font-size: 12px; line-height: 20px; font-weight: bold; text-align: center; } #main_content .button:hover{ color: #fff; background: #adac91; text-decoration: none; } .threecolumn .column{ float: left; width: 200px; } #main_sidebar h2{ height: 31px; margin: 0 0 10px 0; padding: 0 10px; background: transparent url(Images/sidebar_header.gif) no-repeat top left; color: #fff; font-size: 18px; line-height: 30px; } #main_sidebar h3 a:hover, #main_sidebar p a:hover, #main_sidebar p a:hover, #main_sidebar li a:hover{ text-decoration: underline; } #main_sidebar h3, #main_sidebar h3 a{ color: #696; font-size: 14px; } #main_sidebar p{ margin: 0 0 15px 0; color: #666; line-height: 18px; } #eventslist dd{ margin: 0 0 10px 5px; color: #666; } .eventdate{ color: #666; font-weight: bold; } .eventdate span{ font-weight: normal; } .eventlocation{ color: #333; font-weight: bold; } /* Side Menu */ #sidemenu{ margin: 0 0 20px 0; padding: 0 0 10px 0; background: #eee url(Images/sidebar_bottom.gif) no-repeat bottom left; } #sidemenu h2{ display: block; } /* Content Sidebar */ .contentmaincolumn{ float: left; width: 500px; } .contentsidecolumn{ float: right; _display: inline; width: 140px; padding: 10px; border: 2px solid #eee; background: #f6f6f6; font-size: 11px !important; } .contentsidecolumn h3{ margin: 0 0 5px 0 !important; } .contentsidecolumn p{ line-height: 16px !important; text-align: left !important; } .contentsidecolumn ul{ list-style: square !important; margin: 0 0 0 10px !important; padding: 0 0 0 10px !important; } .contentsidecolumn li{ list-style: square !important; margin: 0 0 3px 0 !important; padding: 0 0 0 0 !important; background: transparent none !important; color: #666; line-height: 16px !important; text-align: left !important; } /* Sidebar Lists */ #main_sidebar ul{ list-style: none; margin: 0 0 5px 0; } #main_sidebar li{ list-style: none; margin: 0 0 0 10px; padding: 0 0 0 15px; background: transparent url(Images/right_bullet.gif) no-repeat 0 5px; line-height: 18px; font-weight: bold; } #main_sidebar li ul{ margin: 0 0 10px 0; } #main_sidebar li ul li{ margin: 0 0 5px 0; padding: 0 0 0 7px; background: transparent url(Images/footerbullet1.gif) no-repeat 0 7px; line-height: 14px; font-weight: normal; } #main_sidebar li ul li a{ color: #696; } /* Quick Links */ #quicklinks{ margin: 0 0 20px 0; padding: 0 0 10px 0; background: #eee url(Images/sidebar_bottom.gif) no-repeat bottom left; } #quicklinks h2{ background: transparent url(Images/quicklinks_header.gif) no-repeat top left; color: #adac91; } #quicklinks li{ background: transparent url(Images/footerbullet1.gif) no-repeat 5px 7px; } #quicklinks li a{ color: #999; } /* Features Page */ .featuressection{ float: left; width: 50%; } .featuressection h2, .featuressection p, .featuressection ul{ width: 95%; } /* Portfolio Page */ #featuredproject{} #featuredproject #projectdescription{ float: left; _display: inline; width: 320px; margin: 0 0 30px 0; } #featuredproject #projectphotos{ float: right; _display: inline; width: 250px; margin: 0 6px 0 0; } #featuredproject h2{ margin: 0 0 10px 0; } #featuredproject h2 span{ color: #696; } #featuredproject legend{ color: #696; } #featuredproject h3{ margin: 0 0 5px 0; color: #adac91; } #featuredproject .client{ color: #666; font-size: 14px; font-weight: bold; text-align: left; } #featuredproject li{ color: #666; line-height: 14px; font-weight: bold; } #featuredproject .internalimgheader{ margin: 10px 0 0 0; } #featuredproject .mainphoto{ display: block; width: 250px; height: 165px; border: 3px solid #ccc; } #featuredproject .smallphoto{ display: block; width: 250px; height: 50px; margin: 5px 0 0 0; border: 3px solid #ddd; } #featuredproject a:hover{ border-color: #9c9; } #featureddesigns{ margin: 0 0 20px 0; } #featureddesigns ul, #featureddesigns li{ list-style: none; margin: 0 0 30px 0; padding: 0; } #featureddesigns h2{ margin: 0 0 10px 0; } #featureddesigns li{ float: left; _display: inline; width: 135px; height: 135px; margin: 0 10px 15px 5px; background: none; } * html #featureddesigns li{ margin: 0 0 15px 7px; } #featureddesigns li a{ display: block; width: 135px; height: 135px; border: 3px solid #ddd; } #featureddesigns li a:hover{ border-color: #9c9; } /* Contact Form */ .form_general{} .form_general textarea.text{ width: 470px; } .form_general .privacy{ border: 2px solid #ddd; background: #f1f1f1; margin: 0 10px 0 0; } #main_sidebar address{ margin: 0 0 5px 10px; } #main_sidebar #phonenumbers{ margin: 0 0 0 10px; color: #666; line-height: 18px; } #main_sidebar #map{ width: 212px; height: 200px; overflow: hidden; margin: 10px 0 15px; border: 4px solid #ddd; } /* Sub */ #sub{ padding: 10px 0; font-size: 12px; } #sub h1, #sub h2{ margin: 0 0 5px 0; color: #575; } #subleft{ float: left; _display: inline; width: 200px; margin: 10px 0 10px 0; } #subleft .leftcontainertop{ margin: 0 0 20px; } #subleft ul{ margin: 0 0 10px 0; list-style: none; } #subleft ul li{ line-height: 20px; } #submiddle{ float: left; _display: inline; width: 440px; margin: 10px 40px 10px 40px; } #submiddle p{ margin: 0 0 15px 0; line-height: 24px; text-align: justify; } .submiddlenav{ color: #999; text-align: center; } .submiddlenav a{ color: #696; text-decoration: underline; } .submiddlenav a:hover{ text-decoration: none; } #subright{ float: left; _display: inline; width: 200px; margin: 10px 0 10px 0; } #subright h2{ position: relative; } #subright h2 a{ color: #696; } #subright h2 a:hover{ color: #9c9; } #subright h2 .rssbutton{ position: absolute; top: 3px; right: 0; display: block; width: 16px; height: 16px; background: transparent url(Images/rss.gif) no-repeat top left; text-indent: -9000px; } #subleft li a:hover, #subright dt a:hover{ text-decoration: underline; } /* Home News */ #homenews.control_container{ margin: 0; } #homenews.control_container h2 .viewall{ display: none; } #homenews.control_container dt{ margin: 0 0 12px 0; line-height: 16px; font-weight: bold; } #homenews.control_container dt a{ font-family: Arial, Helvetica, sans-serif; color: #696; font-size: 12px; } #homenews.control_container dt a:hover{ text-decoration: underline; } #homenews.control_container dt .date{ display: block; font-family: Arial, Helvetica, sans-serif; color: #333; font-size: 11px; font-weight: normal; } #homenews.control_container dd{ display: none; color: #666; font-size: 12px; } #homenews.control_container dd .readmore{ font-size: 10px; font-weight: bold; text-decoration: none; } #homenews.control_container dd .readmore:hover span{ text-decoration: underline; } /* Footer */ #footer{ color: #575; line-height: 16px; } #footer ul{ padding: 0 0 0 15px; } #footer li{ display: list-item; list-style: square; color: #fff; font-size: 11px; line-height: 18px; font-weight: bold; } #footernav li p{ margin: 0 0 5px 0; color: #575; font-size: 10px; line-height: 12px; font-weight: normal; } #footer li a{ color: #575; font-weight: bold; } #footer li a:hover{ text-decoration: underline; } #footer li li{ float: none; display: list-item; list-style: square; margin: 0 10px 0 0; color: #ccc; font-size: 10px; line-height: 14px; font-weight: normal; } #footer li li a{ color: #666; font-weight: normal; } #footernav{ float: left; width: 699px; margin: 0 20px 0 0; border-right: 1px dashed #696; } #footernav ul{ padding: 0; } #footernav li{ float: left; _display: inline; list-style: none; margin: 0 10px 0 0; } #footernav li ul{ padding: 0 0 0 15px; } #footercontactinfo{ float: left; width: 200px; } #footercontactinfo h2{ font-size: 11px; line-height: 14px; margin: 0 0 3px 0; } #footercontactinfo h2 a{ color: #fff; } #footercontactinfo h2 a:hover{ text-decoration: underline; } #footercontactinfo p{ margin: 0 0 10px 0; } #footercontactinfo .contactdata a:hover{ text-decoration: underline; } #footercontactinfo .contacttype{ float: left; display: block; width: 55px; font-size: 10px; line-height: 14px; font-weight: bold; } #footercontactinfo .contactdata{ float: left; display: block; color: #fff; font-size: 10px; line-height: 14px; } #footercontactinfo .contactdata a{ color: #fff; } /* Personnel Detail Hack Once we have photos for Fabio and Brandon, remove this hack section. */ #personnelDetail a.button{ display: none; }