themes/vista/css/layoutg.css |
/* Started from SilverStripe Windows Vista Theme http://www.silverstripe.com Modified layout & menuing */ /************ * Misc Styles and defaults */ * { margin: 0; padding: 0; } body { color: #444444; font-size: 64.5%; margin-bottom: 40px; font-family: Verdana, Helvetica, Arial, sans-serif; }
a {color:#000;} a:visited {color:#111;} a:active {color:#222;} a:hover {text-decoration:none;}
table { border-collapse: collapse; border-spacing: 0; } caption, th, td { text-align: left; font-weight: normal; }
html { background-attachment: fixed; background-color: #FFFFFF; background-image: url(../images/background.jpg); } .clear{ clear: both; } img { border: 4px solid #E9E9E9; }
/************** Site Container Box */
#BgContainer { background-color: #FFFFFF; border: solid #444444; border-width: 0px 1px 1px 1px; /* width: 960px; */ width: 100% margin: 0 auto; filter: alpha(opacity=80); opacity: 0.8; -moz-opacity: 0.8; } #Container { /* width: 960px; */ width: 100% padding-bottom: 15px; } #Layout { /* width: 920px; */ width: 99%; clear: both; overflow: hidden; margin: 1% auto; } #Content { /* width: 698px; */ width: 30% float: right; margin: 0; text-align: left; } /** Header **/ #Header { /* width: 928px; */ width: 100% margin: 0 auto; overflow: hidden; } #Header h1 { color: #3E91C4; font-size: 3.2em; font-family: Verdana, Helvetica, Arial, sans-serif; font-weight: 300; padding: 20px 0 0 30px; } #Header p { font-size: 1.4em; color: #444444; clear: left; margin: 0 0 0 100px; } /* ================================================================ This copyright notice must be untouched at all times.
The original version of this stylesheet and the associated (x)html is available at http://www.cssplay.co.uk/menus/skeleton.html Copyright (c) 2005-2007 Stu Nicholls. All rights reserved. This stylesheet and the associated (x)html may be modified in any way to fit your requirements. =================================================================== */ #skelnav, #skelnav ul {padding:0 0 5px 0; margin:0; list-style:none; font: bold 10px verdana, sans-serif; border:1px solid #000; border-color:#eca #b97 #a86 #edb; border-width:1px 2px 2px 1px; background:#fff; position:relative; z-index:200;} #skelnav {height:25px; padding:0;margin:1% auto;}
#skelnav table {border-collapse:collapse;} /*#skelnav li {float:left; padding:0 20px 0 10px;}*/ #skelnav li {float:left; padding:0 10px 0 5px;} #skelnav li li {float:none;} /* a hack for IE5.x and IE6 */ #skelnav li a li {float:left;}
#skelnav li a {display:block; float:left; color:#888; height:25px; padding-right:5px; line-height:25px; text-decoration:none; white-space:nowrap;} #skelnav li li a {height:20px; line-height:20px; float:none;}
#skelnav li:hover {position:relative; z-index:300; background:#fff;} #skelnav a:hover {position:relative; z-index:300; text-decoration:underline; color:#b75;}
#skelnav :hover ul {left:0; top:22px;} /* another hack for IE5.5 and IE6 */ #skelnav a:hover ul {left:-10px;}
#skelnav ul {position:absolute; left:-9999px; top:-9999px;}
/* it could have been this simple if all browsers understood */ /* show next level */ #skelnav li:hover li:hover > ul {left:-15px; margin-left:100%; top:-1px;} /* keep further levels hidden */ #skelnav li:hover > ul ul {position:absolute; left:-9999px; top:-9999px; width:auto;} /* show path followed */ #skelnav li:hover > a {text-decoration:underline; color:#b75;}
/* but IE5.x and IE6 need this lot to style the flyouts*/ /* show next level */ #skelnav a:hover a:hover ul, #skelnav a:hover a:hover a:hover ul, #skelnav a:hover a:hover a:hover a:hover ul, #skelnav a:hover a:hover a:hover a:hover a:hover ul {left:100%; top:-1px;}
/* keep further levels hidden */ #skelnav a:hover ul ul, #skelnav a:hover a:hover ul ul, #skelnav a:hover a:hover a:hover ul ul, #skelnav a:hover a:hover a:hover a:hover ul ul {position:absolute; left:-9999px; top:-9999px;}
/*Credits: CSSplay */ /*URL: http://www.cssplay.co.uk/menus/pro_one */
/*.menu {padding:0 0 0 32px; margin:0; list-style:none; height:35px; background:#fff url(../images/button1.gif); position:relative; margin: 15px 0px 0px 0px;} */ .menu {padding:0 0 0 32px; margin:0; list-style:none; background:#fff url(../images/button1.gif); position:relative; margin: 15px 0px 0px 0px;} .menu li {float:left;} .menu li a {display:block; float:left; height:35px; line-height:35px; color:#aaa; text-decoration:none; font-size:12px; font-family:Verdana, Helvetica, Arial, sans-serif; font-weight:bold; text-align:center; padding:0 0 0 8px; cursor:pointer;} .menu li a b {float:left; display:block; padding:0 16px 0 8px; color:#aaa;} .menu li.current a {color:#fff; background:url(../images/button3.gif);} .menu li.current a b {background:url(../images/button3.gif) no-repeat right top; color:#fff;} .menu li a:hover {color:#fff; background:#000 url(../images/button2.gif);} .menu li a:hover b {background:url(../images/button2.gif) no-repeat right top; color:#fff;} .menu li.current a:hover {color:#fff; background:#000 url(../images/button3.gif); cursor:default;} .menu li.current a:hover b {background:url(../images/button3.gif) no-repeat right top;} /** Breadcrumbs **/ #Breadcrumbs { color: #444444; text-align: left; font-size: 10px; margin: 0px 5px 10px 0; } #Breadcrumbs p { color: #444444; margin: 0; } #Breadcrumbs a { color: #999999; margin: 0; }
/*** Message Boxs ***/
.message { margin: 15px; padding: 5px; width: 92%; color: #979908; border: 4px solid #F7F8B4; background: #FFFFEA; } span.middleColumn .message { margin: 4px 0 0 3px; } .required { margin: 4px 0 0 3px; padding: 5px; width: 92%; color: #DC1313; border: 4px solid #FF7373; background: #FED0D0; }
p#Remember label { margin: -24px 0 0 20px; text-align: left; } .entry { border-bottom: 1px solid #eee; } /* Sidebar ***********************************/ #Sidebar { color: #444444; float: left; font-size: 10px; margin: 10px 0px 0px 0px; padding: 0px 0px 0px 0px; /* width: 200px; */ width: 21% }
#Sidebar div.sidebarBox { border: solid #444444; border-width: 0px 1px 1px 1px; margin: 0px 0px 15px 0px; padding: 0px 0px 5px 0px; }
#Sidebar ul { margin: 2px 0px 5px 8px; }
#Sidebar li { list-style: none; margin: 8px 2px 8px 2px; }
#Sidebar h3 { background-image: url(../images/menu-background.gif); background-repeat: repeat-x; clear: both; color: #FFFFFF; font-size: 12px; font-weight: 700; height: 35px; line-height: 35px; margin: 0px 0px 10px 0px; padding: 1px 0px 0px 10px; }
#Sidebar a em { font-style: normal; font-size: 12px; }
ul#Menu2 { margin: 0px 0px 0px 0px; }
ul#Menu2 li { font-size: 10px; list-style: none; margin: 1px 0px 5px 4px; }
ul#Menu2 li a { color: #444444; display: block; text-indent: 4px; font-size: 10px; height: 18px; line-height: 18px; }
ul#Menu2 li a:hover { text-decoration: none; }
ul#Menu2 li a.current { font-weight: 700; }
ul#Menu2 li a:hover.current { text-decoration: none; }
ul#Menu2 li ul li { display: inline; font-size: 10px; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; width: 160px; }
ul#Menu2 li li a.current, ul#Menu2 li li a.section, ul#Menu2 li li a.section:hover, ul#Menu2 li li a.current:hover { font-weight: 700; }
/* Sub Menu */
ul#Menu2 li a.levelb { margin-left: 2px; text-indent: 2px; } ul#Menu2 li a.levelb:hover, ul#Menu2 li li a.current, ul#Menu2 li li a.current:hover, ul#Menu2 li li a.section, ul#Menu2 li li a.section:hover { text-decoration: none; color: #444444; } /* Comments ******************************************/
#CommentHolder ul { list-style: none; margin: 20px 0; }
#PageComments li { margin: 5px 0; padding: 1px; width: 88%; } #PageComments li.odd { background: #E8F6FF url(../images/commentBg.png) no-repeat 1% 10%; padding-left: 40px; padding-right: 10px; border-bottom: 2px solid #BCE4FE; }
#PageComments li.even { background: #fff url(../images/commentBgAlt.png) no-repeat 99% 10%; padding-right: 40px; padding-left: 10px; }
#PageComments li.odd p.info { color: #3AA0C3; }
.actionLinks li a { padding-right: 3px; font-size: 10px; } .actionLinks li { display: inline; border-right: 1px solid; } .actionLinks li.last { border-right: none; }
.commentrss { background: transparent url(../images/feed-icon-14x14.png) no-repeat; padding-left: 20px; font-size: 1.1em; line-height: 1.6em; } #PageCommentsPagination p { text-align: center; font-size: 1.2em; } #PageComments p { font-size: 1em; } #PageComments p.info { color: #999; margin: 0px; padding: 0; line-height: 1em; font-size: 0.9em; }
/* Search Results *****************************************/ ul#SearchResults { margin: 10px 0; } ul#SearchResults li { list-style: none; margin: 5px 0; font-size: 1em; } /* Footer *****************************************/
#Footer { background-image:url(../images/menu-background.gif); clear: both; /* width: 960px; */ width: 100%; height: 35px; line-height: 35px; text-align: center; } #Footer p { color: #FFFFFF; font-size: 10px; text-align: center; } #Footer a { color: #FFFFFF; text-decoration: none; } #Footer a:hover { color: #FFFFFF; text-decoration: underline; }
|