Moving css to a separate directory.
[treecutter.git] / style / bluenightsky / css / styles.css
diff --git a/style/bluenightsky/css/styles.css b/style/bluenightsky/css/styles.css
new file mode 100644 (file)
index 0000000..146e482
--- /dev/null
@@ -0,0 +1,467 @@
+/* Created by http://freehtml5templates.com */
+
+/* reset */
+* {
+margin: 0;
+padding: 0;
+}
+
+/* render html5 elements as block */
+header, footer, section, aside, nav, article {
+display: block;
+}
+
+body {
+line-height: 1;
+background: #0d144a;
+font-family: Verdana, Arial, Helvetica, sans-serif;
+color: #333;
+font-size: 14px;
+line-height: 18px;
+}
+       
+/* layout */
+
+#wrapper {
+width: 940px;
+margin: 0 auto;
+margin-top: 20px;
+margin-bottom: 20px;
+border: 3px solid #888;
+background: #d5def7;
+/* curved border radius */
+-moz-border-radius: 10px;
+-webkit-border-radius: 10px;
+}
+
+nav {
+width: 940px;
+height: 50px;
+margin: 0 auto;
+background: #000;
+}
+
+#main {
+width: 940px;
+margin: 0 auto;
+padding-top: 30px;
+background: #d5def7 url(images/colbg.png) repeat-y;
+overflow: hidden;
+}
+
+#content {
+float: right;
+width: 640px; 
+margin: 0 0 10px 0; 
+padding: 10px 30px 5px 0;
+}
+
+#sidebar {
+float: left;
+padding: 10px 0 0 20px;
+width: 220px;
+}
+
+footer {
+width: 940px;
+margin: 0 auto;
+clear: both;
+}
+
+/* basics */
+
+h1,h2,h3,h4,h5,h6 {
+font-weight: bold;
+clear: both;
+color: #333;
+}
+
+a:link, a:visited {
+color:#004C9A;
+}
+
+a:hover, a:active {
+color: #333;
+}
+
+p {
+margin-bottom: 18px;
+}
+
+li {
+padding-left: 5px;
+}
+
+/* nav */
+
+nav {
+margin: 0 auto;
+display: block;
+float: left;
+}
+
+nav .menu {
+font-size: 16px;
+font-weight: bold;
+margin-left: 12px;
+}
+
+nav .menu ul {
+list-style: none;
+margin: 0;
+}
+
+nav .menu li {
+float: left;
+position: relative;
+}
+
+nav .menu a {
+display: block;
+text-decoration: none;
+color: #ccc;
+padding: 0 30px;
+line-height: 50px;
+}
+
+nav .menu a:hover {
+color: #fff;
+text-decoration: underline;
+}
+
+/* nav 1-level dropdowns */
+nav .menu li ul { 
+display: none; 
+z-index: 8888;
+}
+
+nav .menu ul li a {
+display: block;
+text-decoration: none;
+color: #FFF;
+background: #000;
+margin-left: 1px;
+white-space: nowrap;
+}
+nav .menu ul li a:hover { 
+background: #333; 
+}
+
+nav .menu li:hover ul {
+display: block;
+position: absolute;
+}
+
+nav .menu li:hover li {
+float: none;
+}
+
+nav .menu li:hover a { 
+background: #333; 
+}
+
+nav .menu li:hover li a:hover { 
+background: #333; 
+}
+
+/** HEADER */
+
+header {
+padding: 20px 0 0 0;
+}
+
+header img {
+clear: both;
+display: block;
+}
+
+header>h1 {
+float: left;
+margin: 0 0 18px 10px;
+width: 600px;
+font-size: 40px;
+line-height: 36px;
+}
+
+header>h1 a:link, header>h1 a:visited {
+color: #333;
+font-weight: bold;
+text-decoration: none;
+text-shadow: 0px 2px 3px #555;
+}
+
+header>h2 {
+color: #777;
+clear: right;
+float: right;
+font-style: italic;
+font-size: 14px;
+margin: 14px 10px 18px 0;
+}
+
+/** ARTICLES **/
+
+article {
+float: left;
+padding: 20px 10px 10px 10px;
+width: 620px;
+}
+
+.featured {
+width: 620px;
+float: left;
+margin-bottom: 10px;
+background: #BDBFE1;
+/* curved border radius */
+-moz-border-radius: 10px;
+-webkit-border-radius: 10px;
+}
+
+article .featuredthumb {
+float: left;
+width: 200px;
+height: 200px;
+/* curved border radius */
+-moz-border-radius: 10px;
+-webkit-border-radius: 10px;
+}
+
+article .featuredtitle {
+float: right;
+width: 400px;
+font-size: 20px;
+font-weight: bold;
+line-height: 1.8em;
+}
+
+article .featuredstory {
+float: right;
+width: 400px;
+}
+
+article .thumb {
+float: right;
+width: 80px;
+height: 80px;
+/* curved border radius */
+-moz-border-radius: 10px;
+-webkit-border-radius: 10px;
+}
+
+article .title {
+float: left;
+width: 500px;
+font-size: 16px;
+font-weight: bold;
+margin-bottom: 10px;
+}
+
+article .story {
+float: left;
+width: 500px;
+font-size: 12px;
+}
+
+.even {
+border-top: 1px solid #999;
+border-bottom: 1px solid #999;
+}
+
+
+
+#content h1, h2, h3, h4, h5, h6 {
+color: #333;
+margin: 0 0 20px 0;
+line-height: 1.5em;
+}
+
+.alignleft, img.alignleft {
+display: inline;
+float: left;
+margin-right: 10px;
+}
+
+.alignright, img.alignright {
+display: inline;
+float: right;
+margin-left: 10px;
+}
+
+.aligncenter, img.aligncenter {
+clear: both;
+display: block;
+margin-left: auto;
+margin-right: auto;
+}
+
+#lightboxthumbs {
+text-align: center;
+padding-bottom: 10px;
+}
+
+.frameit {
+border: 5px #0D144A solid;
+margin-right: 18px;
+/* curved border radius */
+-moz-border-radius: 10px;
+-webkit-border-radius: 10px;
+}
+
+.frameitlast {
+border: 5px #0D144A solid;
+/* curved border radius */
+-moz-border-radius: 10px;
+-webkit-border-radius: 10px;
+}
+
+/* sidebar and footer widget blocks */
+
+.tabwidget {
+width: 200px; 
+font: 10px normal Verdana, Arial, Helvetica, sans-serif; 
+}
+
+ul.tabs {
+margin: 0;
+padding: 0;
+float: left;
+list-style: none;
+height: 32px;
+border-bottom: 1px solid #999;
+border-left: 1px solid #999;
+width: 100%;
+}
+
+ul.tabs li {
+float: left;
+margin: 0;
+padding: 0;
+height: 31px;
+line-height: 31px;
+border: 1px solid #999;
+border-left: none;
+margin-bottom: -1px;
+background: #e0e0e0;
+overflow: hidden;
+position: relative;
+}
+
+ul.tabs li a {
+text-decoration: none;
+color: #000;
+display: block;
+font-size: 1.2em;
+padding: 0 5px;
+border: 1px solid #fff;
+outline: none;
+}
+
+ul.tabs li a:hover {
+background: #ccc;
+}      
+
+html ul.tabs li.active, html ul.tabs li.active a:hover  {
+background: #BDBFE1;
+border-bottom: 1px solid #BDBFE1;
+}
+
+.tab_container {
+border: 1px solid #999;
+border-top: none;
+clear: both;
+float: left; 
+width: 100%;
+margin-bottom: 20px;
+background: #BDBFE1;
+-moz-border-radius-bottomright: 5px;
+-khtml-border-radius-bottomright: 5px;
+-webkit-border-bottom-right-radius: 5px;
+-moz-border-radius-bottomleft: 5px;
+-khtml-border-radius-bottomleft: 5px;
+-webkit-border-bottom-left-radius: 5px;
+}
+
+.tab_content {
+padding: 20px;
+font-size: 1.2em;
+line-height: 1.5em;
+}
+
+.tab_content ul {
+list-style: none;
+}
+
+.tab_content h3 {
+border-bottom: 1px dashed #03327d;
+}
+
+.tab_content a {
+color: #0A50C0;
+}
+
+.tab_content a:hover, a:active {
+color: #333;
+}
+
+.tab_content img {
+float: left;
+margin-right: 15px;
+border: 1px solid #03327d;
+padding: 5px;
+}
+
+
+aside .standard h3 {
+font-size: 18px;
+text-shadow: 0px 2px 3px #ddd;
+}
+
+aside .standard ul {
+list-style: square;
+color: #bbb;
+margin: -15px 0 15px 25px;
+}
+
+#footer-area {
+background: #525588;
+color: #FFF;
+font-size: 90%;
+padding: 18px 0;
+overflow: hidden;
+/* curved border radius */
+-moz-border-radius-bottomright: 8px;
+-moz-border-radius-bottomleft: 8px;
+-webkit-border-bottom-left-radius: 8px;
+-webkit-border-bottom-right-radius: 8px;
+}
+
+.footer-segment {
+float: left;
+margin-right: 20px;
+margin-left: 20px;
+width: 190px;
+}
+
+footer aside h4 {
+color: #faf0e6;
+font-size: 16px;
+line-height: 1.5em;
+}
+
+footer ul {
+list-style: none;
+margin: -15px 0;
+}
+
+footer a:link, footer a:visited {
+color: #ccc;
+}
+
+footer a:hover { 
+text-decoration: underline; 
+}
+
+footer p {
+margin-top: -15px;
+color: #faf0e6;
+}