Advertisement
wclendining

Noah Rows style.css

Jun 20th, 2015
469
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 7.56 KB | None | 0 0
  1. /*
  2. Theme Name: Noah rows
  3. Author: Just a guy
  4. Description: This is the HTML for the theme I used while attending the course Customizing Themes in WordPress.
  5.  
  6. The styles are grouped into the following sections:
  7.    Section 1: Document defaults
  8.    Section 2: Header element rules
  9.    Section 3: Content element rules
  10.    Section 4: Footer element rules
  11.    Section 5: Responsive rules
  12.    Section 6: Print rules
  13.  
  14. Version: 1.0
  15. */
  16.       /* ============================ */
  17.       /* Section 1: Document defaults */
  18.       /* ============================ */
  19.       @import url(http://fonts.googleapis.com/css?family=Hind:400,700);
  20.       @import url(http://fonts.googleapis.com/css?family=Bangers);
  21.       @import url(http://fonts.googleapis.com/css?family=Oxygen:400,700);
  22.       body {
  23.          margin: 55px 0 0 0;
  24.          font-family: Oxygen, Hind, Verdana, Arial, Helvetica, sans-serif;
  25.          font-size: 11pt;
  26.       }
  27.  
  28.       /* =============================== */
  29.       /* Section 2: Header element rules */
  30.       /* =============================== */
  31.     /* ======================================== */
  32.     /* ===      Top Navigation Styles       === */
  33.     /* ======================================== */
  34.     nav.TopNavigation {
  35.        height: 30px;
  36.        position: fixed;
  37.        top: 0;
  38.        left:0;
  39.        width: 100%;line-height: 1em;padding-top: .2em;
  40.        box-shadow: 0 2px 5px #888888;
  41.        background-color: white;
  42.        z-index: 2;
  43.        }
  44.     nav.TopNavigation h1 {
  45.        display: inline-block; float: left;
  46.        height: 30px;
  47.        margin: 0;
  48.        padding: .1em 0 0 0;
  49.        font-family: Lobster, cursive;
  50.        font-weight: normal;
  51.        font-size: 30px;
  52.        vertical-align: text-bottom;
  53.        /*border: dotted #339999; 1px;*/
  54.        }
  55.     nav.TopNavigation div {display: inline-block;}
  56.     nav.TopNavigation ul {
  57.        display: inline-block;
  58.        margin: 0;
  59.        padding: 0;
  60.        height: 30px;
  61.        /*border: dashed blue 1px;*/
  62.        vertical-align: text-bottom;
  63.        }
  64.     nav.TopNavigation li {
  65.        display: inline-block;
  66.        padding: 0 1em;
  67.        height: 30px;
  68.        /*border: dotted red 1px;*/
  69.        margin: 0;
  70.        /*background-color:white*/
  71.        font-size: 13px;
  72.        }
  73.     nav.TopNavigation ul ul {
  74.         display: none;
  75.         background-color:white;
  76.         z-index: 9999;
  77.         position: absolute;
  78.         top: 30px;
  79.         float: left;
  80.         height: 30px;
  81.         }
  82.     nav.TopNavigation ul li:hover > ul {display: block;border: solid #888888 1px;box-shadow: 0 2px 5px #888888}
  83.     nav.TopNavigation ul ul ul li {display: block;width: 198px;}
  84.     nav.TopNavigation ul ul ul {width: 202px;height: auto;border: solid black 1px;}
  85.     nav.TopNavigation ul ul ul ul {left: 202px;}
  86.     nav.TopNavigation a {display: block;height: 30px;text-decoration: none;color: black;}
  87.     nav.TopNavigation a:hover {text-decoration: underline;color: #D40202;}
  88.     nav.TopNavigationl ul li.current_page_item > a,
  89.     nav.TopNavigation ul li.current-menu-ancestor > a,
  90.     nav.TopNavigation ul li.current-menu-item > a,
  91.     nav.TopNavigationl ul li.current-menu-parent > a {color: #D40202;} 
  92.     nav.TopNavigtion form {display: inline-block;height: 30px;margin: 0; }
  93.     .GlobalNav {
  94.        float: right;
  95.        }
  96.       header {
  97.           width:25%;
  98.           float: left;
  99.           height: 50px;
  100. `      }
  101.       header h1 {
  102.          margin: 0;
  103.          line-height: 1em;
  104.          padding: 0;text-align: center;
  105.          font-family: Bangers, "Times New Roman", Times, serif;
  106.          font-size: 2vw;
  107.          /*text-shadow: 8px 8px #B9D9E8;*/
  108.          }
  109.       header p.TagLine {margin: 0; font-style: italic; text-align: center; font-size: .8vw}
  110.       #global {
  111.          width: 25%;
  112.          float: right;
  113.          overflow: auto;
  114.          font-size: .8vw;
  115.          text-align: right;
  116.          height: 50px;
  117.         }
  118.       #global a, #global a:link, #global a:active, #global a:visited {color: black;text-decoration: none; }
  119.       #global a:hover {color: #990033; text-decoration: underline; }  
  120.       #searchform {display: inline; float: right; }
  121.  
  122.       /* ================================ */
  123.       /* Section 3: Content element rules */
  124.       /* ================================ */
  125.       #main {
  126.          padding: 0 1em;
  127.          overflow: auto;
  128.          }
  129.       article {
  130.          overflow: auto;
  131.          padding: 0 1em;
  132.          }
  133.       #leftbar {font-size: 90%;}
  134.       #rightbar {padding-left: 1em;font-size: 90%;}
  135.       #breadcrumbs {border-bottom: solid #324853 1px;font-size: 90%;}
  136.       #breadcrumbs a, #breadcrumbs a:link, #breadcrumbs a:active, #breadcrumbs a:visited {color: black; text-decoration: none; }
  137.       #breadcrumbs a:hover {color: black; text-decoration: underline;}
  138.       #pagefoot {
  139.          margin: 1em 2em;
  140.          border-width: 0;
  141.          border-top: solid #666699 1px;
  142.          font-size: 90%;
  143.          overflow: auto;
  144.          clear: both;
  145.          text-align: center;
  146.          }
  147.       /* Making the sidebar thing happen */
  148.       article {margin: 0 2%;}
  149.       #leftbar {width: 198px; float: left;display: none;}
  150.       #rightbar {width: 198px; float: right;display: none;}
  151.  
  152.       /* === Text styles === */
  153.       #main ul {list-style-type: initial;margin: 2em;}
  154.  
  155.       /* === Wordpress-isms === */
  156.       .current_page_item, .current-page-ancestor, .current-menu-item {font-weight: bold;color: #330000;} /* Mainly to highlight the section in cardinal navigation */
  157.       .alignright {float: right;}
  158.       .alignleft {float: left;}
  159.       .wp-caption {
  160.         border: solid black 1px;
  161.         margin: 2em auto;
  162.         padding: 15px;
  163.         text-align: center;
  164.         border-radius: 10px; -ms-border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; /* this is an example of how to make rounded corners, the extra rules are for older browsers that do it own their own. */
  165.        }
  166.        .wp-caption-text {font-style: italic;font-size: 90%;}
  167.      
  168.       /* =============================== */
  169.       /* Section 4: Footer element rules */
  170.       /* =============================== */
  171.       footer {
  172.          font-size: 80%;
  173.          margin-top: 5px;
  174.       }
  175.       footer a, footer a:link, footer a:active, footer a:visited, footer a:hover {color: black; text-decoration: none;}
  176.       footer a:hover {color: #1a2d38; text-decoration: underline;}
  177.      .TopRow {
  178.         background-color: white;
  179.         clear: both;
  180.         overflow: auto;
  181.         box-shadow: 0 -2px 5px #888888;
  182.         }
  183.       .Centre {text-align: center;}
  184.       .BottomRow {
  185.          height: 40px;
  186.          margin-top: 5px;
  187.          background-color: #1a2d38;
  188.          color: white;
  189.          text-align: center;box-shadow: 0 -2px 5px #888888;
  190.       }
  191.       /* making the 3 column thing happen */
  192.       .Centre {margin: 0 200px;}
  193.       .LeftSide {width: 198px; float: left;padding-left: 2em;}
  194.       .RightSide {width: 198px; float: right;padding-left: 2em;}
  195.  
  196.       /* =========================== */
  197.       /* Section 5: Responsive rules */
  198.       /* =========================== */
  199.       @media (min-width: 1100px) {
  200.       /* what to do for wide screens */
  201.       }
  202.       @media (min-width: 600px) and (max-width: 1099px) {
  203.       /* what to do for medium screens */
  204.       }
  205.       @media (max-width: 599px) {
  206.       /* what to do for small screens */
  207.       body {margin: 50px 0 0 0; }
  208.       article, .Centre {margin: 0;}
  209.       #leftbar, #rightbar, .LeftSide, .RightSide {float: none;width: 100%; }
  210.       }
  211.  
  212.       /* ====================== */
  213.       /* Section 6: Print rules */
  214.       /* ====================== */
  215.       @media print {
  216.          body {font-size: 10pt; margin: 0; }
  217.          nav, aside#rightbar {display: none;}
  218.          article {margin: 0;}
  219.       }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement