silverstripe-simple/css/layout.css

header:after, .main:after, #Root:after {height:0;content:".";display:block;clear:both;visibility:hidden;}

body{margin:0; background:#ededed; min-width:240px;-webkit-text-size-adjust:none; font-family:Arial, Helvetica, sans-serif;}
.ie7 body, .ie8 body{min-width:860px;}

::-moz-selection{background:#b80000; color:#fff; text-shadow:none;}
::selection {background:#b80000; color:#fff; text-shadow:none;}
a:link {-webkit-tap-highlight-color:#b80000;}

a.btn{background:#b80000; color:#fff; display:inline-block; border-radius:4px; padding:6px 15px; margin-top:10px; text-transform:uppercase; letter-spacing:1px; border-bottom:none !important; font-size:13px;}
a.btn:after{content:'\2192'; padding-left:10px;  font-size:14px; font-family:Arial, Helvetica, sans-serif;}
a.btn:hover{background:#d80000; color:#fff;}
.content img{border:5px solid #d7d7d7; width:60%; height:auto; float:left; margin:6px 20px 10px 0;}
.content ul{margin:20px 0 20px 30px;}
.content li{line-height:22px; margin-bottom:5px; list-style-type:disc;}

.content-container h1{font-size:36px; border-bottom:1px solid #e5e5e5; padding-bottom:7px; margin:0 0 23px 0;}
.content-container h1 span.amp{font-family:Baskerville,"Goudy Old Style","Palatino","Book Antiqua",Georgia; font-style:italic;}
.content-container h2{font-size:25px; margin-bottom:15px; padding-top:15px;}
.content-container h3{font-size:21px; margin-bottom:10px; padding-top:10px;}
.content a{border-bottom:1px dashed #b80000;}

.brand{float:left; display:block;}
.brand h1{margin:0; padding:0; font-size:50px; font-family: "HelveticaNeueLTPro-Bd", "Helvetica Neue LT Pro Bold", "HelveticaNeueBold", "HelveticaNeue-Bold", "Helvetica Neue Bold", "Helvetica Neue LT Pro", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif; color:#fff; font-weight:600; font-stretch:normal; line-height:1em;} 
.brand, .brand:hover{color:#fff;}

/* Log in Form */

#MemberLoginForm_LoginForm fieldset { border:none; padding-left:0px;}
#MemberLoginForm_LoginForm fieldset #Email label {margin-top:7px;}
#MemberLoginForm_LoginForm fieldset #Email input.text {border:1px solid #e5e5e5; border-radius:4px; color:#888; background:#ededed; margin:0;}
#MemberLoginForm_LoginForm fieldset #Email input.text:focus {outline:none; background:#fff;}
#MemberLoginForm_LoginForm fieldset #Password label {margin-top:7px;}
#MemberLoginForm_LoginForm fieldset #Password input.text {border:1px solid #e5e5e5; border-radius:4px; color:#888; background:#ededed; margin:0;}
#MemberLoginForm_LoginForm fieldset #Password input.text:focus {outline:none; background:#fff;}

#MemberLoginForm_LoginForm .Actions input {cursor:pointer; text-align:center; color:#fff; background-color:#888; border:none; border-radius:4px; font-size: 13px;
  font-weight: bold; margin: 5px 0; padding:5px; font-family:"HelveticaNeueLTPro-Bd", "Helvetica Neue LT Pro Bold", "HelveticaNeueBold", "HelveticaNeue-Bold", "Helvetica Neue Bold", "Helvetica Neue LT Pro", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;}

/* Search Form */
.search-bar {position:absolute; right:0; top:18px; max-width: 1100px; margin: 0 auto; padding: 0 30px 0 0;}
.search-dropdown-icon {display:none;}
.search-bar .search-bubble-arrow {display:none;}
.search-bar form {margin:10px 0 0 0; float:right; width:200px;}
.search-bar form fieldset {position:relative; padding:0; margin:0;background:#ededed; border:1px solid #888; border-radius:4px;}
.search-bar form div.field {margin:0;}
.search-bar form div.field .middleColumn {float:none; width:100%;}
.search-bar form input.text {text-indent:32px; float:left; color:#888; margin:0; border:0px; border-radius:4px; background:transparent;}
.search-bar form input.action {background:transparent url(../images/search-icon.png) 5px 5px no-repeat; text-indent:-9999em; position:absolute; left:0px; cursor:pointer; height:32px; width:35px; border:none;
							border-top-left-radius:4px; border-bottom-left-radius:4px; padding:0;}
.search-bar form input.action:active {background:transparent url(../images/search-icon-active.png) center 5px no-repeat;}
.search-bar form input:focus, .header textarea:focus {outline:none; background:#fff;}

/* navigation visible when menu items overflow the 1100px width and when users don't have javascript enabled*/
 
.header .primary ul {float:right; margin:24px -15px 0 0; white-space:normal; padding:0;} 
.header .primary ul .menu-bubble-arrow {display:none;}
.header .primary ul li{float:left; margin:0 0 10px 6px; padding-bottom:0; background-image:none; list-style-type:none;}
.header .primary ul li.current a, .header .primary ul li.section a{background-color:#525252;}
.header .primary li a{letter-spacing:1px; color:#888; font-size:15px; font-family:Helvetica, Arial, sans-serif; padding:6px 8px; border-radius:4px; font-weight:bold; display:block; -moz-transition:color 0.2s; -webkit-transition:color 0.2s; transition:color 0.2s;}
.header .primary li a:hover{color:#fff;} 
.header .primary li.section a, .header .primary li.current a{color:#fff;}
 
 /* fancy javascript initiated menu - for when menu items fit within the 1100px width (nowrap)*/
 
.header .primary ul.standard-nav{float:right; margin:24px -15px 0 0; white-space:nowrap;}
.header .primary ul.standard-nav .menu-bubble-arrow {display:none;}
.header .primary .standard-nav li{float:left; padding-bottom:20px; margin:0 5px;}
.header .primary .standard-nav li.section, .header .primary li.current {background:url(../images/selected.png) center bottom no-repeat;}
.header .primary ul.standard-nav li.current a, .header .primary ul.standard-nav li.section a {background:none;}

.header .nav-open-button {display:none;}

.inner{max-width:1100px; margin:0 auto; padding:0 30px;}
.ie6 .inner {width:960px;}

.main{background:#fff; padding:50px 0 60px;}
aside{float:left; width:20%; margin-top:17px;}

.secondary h3{font-size:20px; color:#b8b7b7; margin:0 0 8px 0;}
.secondary {border-bottom:1px solid #e5e5e5;}
.secondary ul {padding:0; margin:0;}
.secondary li{border-top:1px solid #e5e5e5; position:relative; list-style-type:none;}
.secondary li .arrow{color:#b80000; padding-right:5px; display:block; font-size:15px; line-height:20px; position:absolute; left:2px; top:5px; -moz-transition:0.2s; -webkit-transition:0.2s; transition:0.2s;}
.secondary li:hover .arrow{left:6px;}
.secondary li a{padding:8px 0; display:block; width:100%; text-transform:uppercase; letter-spacing:2px; font-size:11px; color:#333; line-height:17px; font-family:'Lucida Sans', 'Lucida Grande', Arial, Helvetica, sans-serif;}
.secondary li .text {padding-left:28px; display:block;}
.secondary li.section, .secondary li.current{background-color:#f9f9f9;}
.secondary li.section a, .secondary li.current a{color:#000;}

.content-container{float:right; width:75%; padding-bottom:20px;}
.no-sidebar .content-container{float:left;}
.header{background:#161616;}
.header .inner{padding-top:55px; position:relative;}

/* Search Results */


.searchResults h1 { font-size:36px; margin-bottom:15px;}
.searchResults p.searchQuery {color:#333; margin-bottom:10px;}

.searchResults ul#SearchResults {padding-left:20px;}
.searchResults ul#SearchResults li {margin-bottom:20px; list-style-type:none;}
.searchResults ul#SearchResults p {font-size:1.1em; font-weight:normal; line-height:2em;}
.searchResults ul#SearchResults a.searchResultHeader {font-size:1.3em; font-weight:bold; text-decoration:none; margin:20px 0 8px 0;}
.searchResults ul#SearchResults a {text-decoration:none;}

.footer{color:#999; background:#ededed; padding:20px 0; font-size:11px; line-height:22px;}
.footer a{color:#999;}
.footer .left{float:left; color:#000; display:block;}
.footer .right{float:right; display:block;}
.footer span{padding:0 3px; color:#bbb;}
.footer .primary, .footer .primary ul{display:inline; margin:0; padding:0;}
.footer .primary li{display:inline;}
/*.ie6 .footer .primary li, .ie7 .footer .primary li{display:inline; zoom:1; margin-right:10px;}*/
.footer .primary li:after{padding:0 3px 0 5px; content:'/'; color:#999;}
.footer .primary li:last-child:after{content:'';}
.footer .arrow{padding:0 8px 0 5px; color:#b80000; font-size:13px;}
.footer .primary .nav-open-button {display:none;}
.footer .primary ul#nav .menu-bubble-arrow {display:none;}

@media only screen and (max-width: 960px) {
.content img{width:97%; height:auto; margin:0 0 20px;}
.header .primary ul {margin-left:-12px; -webkit-padding-start: 0px;} 
}

@media only screen and (max-width: 700px) {
.brand{float:none; display:inline-block; margin-left:12px; margin-bottom:10px;}
.brand h1{font-size:30px;}
.header {padding:0px;}
.header .inner{padding:10px 0 0 0;}
.header .primary {height:42px;}
.primary .nav-open-button {z-index:100; position:relative; padding:6px 0; background:#525252; width:100%; height:30px; display:block; cursor:pointer; font-family:'WebSymbolsRegular'; font-size:20px; color:#ededed; text-indent:10px; 
                          text-align:left; line-height:30px; -webkit-box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.3);-moz-box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.3);box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.3);} 
.primary .nav-open-button .menu-text {letter-spacing:1px; margin-left:10px; color:#fff; font-size:15px; font-family:Helvetica, Arial, sans-serif; font-weight:bold;}
.primary ul#nav .menu-bubble-arrow {z-index:110; display:none; color:#525252; height:20px; width:20px;position:absolute; left:10px; top:-7px; font-family:'WebSymbolsRegular'; font-size:20px;text-align:center; line-height:20px;
                                    text-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3);}
.header .primary ul {position:relative; background:#ededed; display:none; float:left; margin:0; padding:0; width:100%; white-space:normal; -webkit-box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.2);-moz-box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.2);box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.2);} 
.header .primary ul#nav li{width:100%; margin:0; float:none; background:none;}
.header .primary ul#nav li a {padding:8px 0 8px 40px; font-weight:normal;}
.header .primary ul#nav li a:hover {color:#525252;}
.header .primary ul#nav li.current a, .header .primary ul#nav li.section a{border-radius:0; background-color:#999; color:#fff;}
/* Search Form */
.search-bar {z-index:200; position:absolute; top:50px; display:none; padding:5px 0; height:32px; margin:0; background-color:#303030;-webkit-box-shadow: -1px 1px 5px 0px rgba(0, 0, 0, 0.3);-moz-box-shadow: -1px 1px 5px 0px rgba(0, 0, 0, 0.3);box-shadow: -1px 1px 5px 0px rgba(0, 0, 0, 0.3);}
.search-dropdown-icon {display:block; cursor:pointer; width:20px; height:20px; position:absolute; right:10px; top:14px; font-family:'WebSymbolsRegular'; font-size:20px; color:#ededed; text-align:center; line-height:20px;}
.search-bar .search-bubble-arrow {display:block; height:20px; width:20px;position:absolute; right:14px; top:-12px; font-family:'WebSymbolsRegular'; font-size:20px; color:#303030; text-align:center; line-height:20px;}
.search-bar form {display:none; float:right; margin:0 5px; height:32px;}

/* Main Content */
.main{padding:20px 0 45px;}
.content-container, aside{width:100%;}
.content-container h1{font-size:30px; margin-bottom:15px; padding-bottom:3px;}
.content-container p{font-size:14px; line-height:23px;}
p.intro{font-size:19px; line-height:27px;}
.main .inner{padding:0 22px;}
/* Secondry Nav */
.secondary li a{line-height:24px;}
.secondary li .arrow{line-height:26px;}
/* Footer */
.footer .right{float:left; padding-top:14px; width:100%;}
}


@media print {
  * { background: transparent !important; color: black !important; box-shadow:none !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; }
	.header,  .footer{display:none;}
  a, a:visited {text-decoration:underline;}
  thead {display:table-header-group;}
  tr, img {page-break-inside: avoid;}
  img {max-width:100% !important;}
  @page {margin:0.5cm;}
  p, h2, h3 {orphans:3; widows:3;}
  h2, h3 {page-break-after:avoid;}
}