/* Theme Name: LCARS-Next-Gen theme for the GetSimple CMS Theme Developer: Kenneth John odle Developer Website: http://www.kjodle.net/ Theme URL: Version: 1.0 Release Date: 1 August 2014 Description: LCARS-Next-Gen is a theme for the Get Simple CMS (get-simple.info). It is designed to resembled the computer displays from the Enterprise-D (NCC-1701D) from Star Trek: The Next Generation. It is written in HTML5 and CSS3, uses a custom font for display headings, and supports both get_header() and get_footer() hooks. It also includes the HTML shim, enabling support of HTML5 elements in Internet Explorer 6-9. It includes a single navigation bar and dual sidebars to the right of the main content area. Tags: dark, black, orange, yellow, science fiction, television, sidebar, custom font */ /* Resets and clearfixes */ * { margin: 0px; padding: 0px; color: #F9E0A2; } .clear { clear: both; } /* HTML Components */ @font-face { font-family: lcars; src:url('lcars.ttf'); } body { background: #000; color: #ddd; font: 13px/18px tahoma,sans-serif; border-left: double 3px; border-right: double 3px; animation: borderStripe 5s linear infinite; } @keyframes borderStripe { 0% {border-color: #ea0;} 50% {border-color: #000;} 100% {border-color: #ea0;} } @-webkit-keyframes borderStripe { 0% {border-color: #ea0;} 50% {border-color: #000;} 100% {border-color: #ea0;} } h1, h2, h3, h4, h5, h6 { background: #fb1; color: #000; margin: 10px 0 5px 0; padding: 10px; border-radius: 20px; font-family: lcars,sans-serif; letter-spacing: 1px; font-weight: normal; } h1 { background: #fb1; font-size: 40px; line-height: 38px; border-radius: 38px; padding-left: 24px; } h2 { background: #FFC127; font-size: 32px; line-height: 30px; border-radius: 30px; padding-left: 24px; } h3 { background: #FFC73C; font-size: 28px; line-height: 26px; border-radius: 26px; padding-left: 24px; } h4 { background: #FFCE52; font-size: 24px; line-height: 22px; border-radius: 22px; padding-left: 24px; } h5 { background: #FFD468; font-size: 22px; line-height: 18px; border-radius: 18px; padding-left: 24px; } h6 { background: #FFDA7D; font-size: 20px; line-height: 16px; border-radius: 18px; padding-left: 24px; } ol, ul { margin-left: 18px; color: #c69; } ol li, ul li { color: #f96; } dl { margin: 10px 25px 10px 40px; } dt { margin: 5px 50px 0 0; padding: 0 0 5px 0; border-bottom: solid 1px #fb1; font-family: lcars, sans-serif; font-size: 1.5em; letter-spacing: 1.5px; color: #fb1; } dd { margin: 0 50px 0 0; padding: 0 0 0 0; color: #ffc73c; font-family: "Lucida Console", Monaco, monospace; font-size: 0.9em; } p { margin-top: 10px; } blockquote { border: double 3px #ffa217; margin: 10px auto; width: 85%; padding: 10px 15px 15px; border-radius: 20px; } a { text-decoration: none; display: inline-block; } a:link { color: #99c; border-radius: 9px; padding: 0 3px 3px 3px; margin: 0 -3px; } a:visited { color: #c69; } a:hover { color: #000; background: #fb1; } pre, code { margin: 10px 25px; padding: 10px; border-radius: 20px; font-family: "Lucida Console", Monaco, monospace; color: #ACA595; background: #111; border: dotted 1px #ea0; } /* Theme Components */ #container { width: 1000px; margin: 0px auto; background: #000; } #header { padding: 20px; border-bottom: solid 5px #ea0; border-left: solid 20px #ea0; border-bottom-left-radius: 20px; border-right: solid 5px #ea0; border-bottom-right-radius: 20px; } #header a {color: #000;} #header h2 {background: #000; color: #ffb546; border: solid 1px #ffb546;} #nav { background: #000; margin: 6px 0 3px 0; border-top: solid 2px #FFB546; border-bottom: solid 2px #FFB546; border-left: solid 20px #FFB546; border-bottom-left-radius: 20px; border-top-left-radius: 20px; border-right: solid 20px #FFB546; border-top-right-radius: 20px; border-bottom-right-radius: 20px; padding: 2px 0; } #content { margin-top: 3px; float: left; width: 573px; padding: 10px 5px 10px 10px; border-top: solid 5px #FFA217; border-right: solid 5px #FFA217; border-bottom: solid 5px #FFA217; border-left: solid 20px #FFA217; border-radius: 20px; } #content p { margin: 10px 25px 0 25px; } #content ul { margin: 10px 25px 0 40px; } #content ol { margin: 10px 25px 0 45px; } #sidebar { width: 168px; float: left; margin: 3px 0 0 5px; padding: 5px; border-top: solid 5px #FFA217; border-right: solid 5px #FFA217; border-bottom: solid 5px #FFA217; border-left: solid 5px #FFA217; border-radius: 20px; } #sidebar2 { width: 169px; float: left; margin: 3px -10px 0 5px; padding: 5px; border: solid 5px #FFA217; border-radius: 20px; } #footer { margin-top: 3px; padding: 10px; border-top: solid 5px #ea0; border-left: solid 20px #ea0; border-top-left-radius: 20px; border-right: solid 5px #ea0; border-top-right-radius: 20px; } #sitemap { font: 12px/16px tahoma,sans-serif; } #credits { font-size: 0.7em; margin-top: -8px; } .left {float: left;} .right {float: right;} /* Sidebar Headings */ #sidebar h1, #sidebar2 h1 {font-size: 2.0em; padding: 10px 20px; line-height: 1;} #sidebar h2, #sidebar2 h2 {font-size: 1.8em; padding: 8px 20px; line-height: 1;} #sidebar h3, #sidebar2 h3 {font-size: 1.6em; padding: 8px 20px; line-height: 1;} #sidebar h4, #sidebar2 h4 {font-size: 1.4em; padding: 8px 20px; line-height: 1;} #sidebar h5, #sidebar2 h5 {font-size: 1.3em; padding: 8px 20px; line-height: 1;} #sidebar h6, #sidebar2 h6 {font-size: 1.2em; padding: 8px 20px; line-height: 1;} /* Navigation elements */ #nav ul { margin-left: 0px; background: #000; } #nav a, #nav li a {display: block;} #nav li a:link, #nav li a:visited { color: #000; background: #FFB546; text-decoration: none; border-radius: 15px; padding: 2px 10px; border: solid 1px #000; font-family: lcars,sans-serif; letter-spacing: 0.5px; font-size: 1.6em; margin: 0px; } #nav li { display: block; float: left; padding: 3px 2px; line-height: 24px; background: #000; color: #000; } #nav li:first-child { margin-left: 3px; } #nav li a:hover { color: #FFB546; background: 000; border-color: #FFB546; } #nav li.current a { color: #FFB546; background: #000; border-color: #FFB546; } #nav li.current a:hover { color: #FFB546; } /* Image Styles */ #content img { display: block; padding: 15px; background: #111; border: dotted 1px #222; } .center { margin-left: auto; margin-right: auto; } /* Form Elements */ form { margin: 0; padding: 0 5px 0 0; } fieldset { padding: 10px; border: solid 1px #ea0; border-radius: 15px; margin-top: 10px; } legend { background: #ea0; color: #000; border-radius: 15px; padding: 5px 15px; margin-left: 30px; font-family: lcars,sans-serif; font-size: 1.6em; letter-spacing: 1.3px; text-transform: uppercase; } input, textarea { background: #222; color: #ea0; border-radius: 5px; border: dotted 1px #333; padding: 5px; } textarea { margin-top: 5px; } option, label { padding-left: 5px; } select { background: #222; color: #ea0; border-radius: 5px; border: dotted 1px #333; margin-top: 3px; } select option {padding: 5px;} input, textarea, select, option { font-family: "Lucida Console", Monaco, monospace; font-size: 1em; } .button { margin-top: 5px; background: #ea0; color: #000; border: solid 3px #ea0; border-radius: 20px; text-transform: uppercase; font-family: lcars,sans-serif; text-align: center; font-size: 1.8em; letter-spacing: 1.5px; padding: 0px 15px; } .button:hover { background: #000; color: #ea0; } form p { margin: 10px 0 0 0 !important; } .printonly { display: none; }