/*  
Theme Name:201Squadron
Theme URI: http://www.jewelion.com
Description: Theme developed for 201 Squadron website
Version: 0.1
Tags: one-col, two-col
Author: Julian Stokes
Author URI: http://www.jewelion.com


*/

/* RESET
   ----- */

body, h1, h2, h3, h4, h5, h6, p, form, img, ul, ol,
table, tbody, thead, tr, td {
    margin: 0;
    padding: 0;
    border: 0;
    vertical-align: baseline;
}


/* LAYOUT
   ------ */
body {
    background-image: url(img/sky-sized-fade-bg.jpg);
    background-repeat: no-repeat;
    background-color: #121524;
    background-position: top center;
    background-attachment: fixed;
    color: #fff;

}

#site {
    width: 100%;

}

#wrap {
    width: 960px; /* The full site width */
    margin: 0px auto;
}

#header {
    width: 100%;
    float: left;
    text-align: center;
}

h1#logo, div#logo {
    width: 620px;
    float: left;
}

div.search {
    width: 500px;
    float: right;
    text-align: right;
}

div#header-blurb { /* The text blurb on the front page header */
    position: absolute;
    width: 260px;
    margin-left: 620px;
    background: url(img/white-50.png);
}

div#header-blurb p {
    padding: 20px;
}


#landscape {
    width: 940px;
    height: 158px;
    margin-left: auto;
    margin-right: auto;
    border-bottom: 2px solid #d7aa52;
}

.darkblue {
    background-color: #171c30;
}

.lightblue {
    background-color: #1f7ca6;
}

#plate {
    width: 100%;
    float: left;
    background-color: transparent; /* This is the actual site background */
    padding: 0px;

}

#content-wrap {
    overflow: auto;
    /* background-image: url(img/2col-bg.gif); */
    background-position: right;
}

#content-fp-wrap {
    overflow: auto;
    width: 100%;
    background-color: #171c30;
    margin: 0px;

}

div.minor-menu {


    width: 100%;
    float: right;
    /* background: #d5cba7; */
}

div.top-menu ul {
}

div.top-menu ul li {
    float: right;
    list-style: none;
    padding: 15px 0;
}

div.minor-menu ul {
}

div.minor-menu ul li {
    float: right;
    list-style: none;
    padding: 15px 0;

}

div.minor-menu ul li.menu-item a {
    padding: 15px 0px 15px 20px;
    font-size: small;
    color: #4c6443;
    /* border: 1px solid #f3ecd2;
    border-width: 0 1px 0 0;*/
    text-decoration: none;
    text-transform: none !important;

}

div.minor-menu ul li.menu-item a:hover {
    color: #336;
    /* background: #2e0854; */
    text-decoration: underline;
}

#centeredmenu {
    /*margin-top:5px;*/
    float: left;
    width: 960px;
    margin-left: auto;
    margin-right: auto;
    background: #003;
    border-bottom: 2px solid #fff;
    /* border-top:2px solid blue;*/
    overflow: hidden;
    position: relative;
}

#centeredmenu ul {
    clear: left;
    float: left;
    list-style: none;
    margin: 0;
    padding: 0;
    position: relative;
    left: 50%;
    text-align: center;
}

#centeredmenu ul li {
    display: block;
    float: left;
    list-style: none;
    margin: 0;
    padding: 0;
    position: relative;
    right: 50%;
}

#centeredmenu ul li a {
    color: #fff;
    font-weight: bold;
    display: block;
    width: 119px;
    margin: 0 0 0 1px;
    padding: 10px 0px;
    text-decoration: none;
    line-height: 1.3em;
}

#centeredmenu ul li a:hover {
    background: #333;
    color: #fff;
}

#centeredmenu ul li a.active,
#centeredmenu ul li a.active:hover {
    color: #fff;
    background: #000;
    font-weight: bold;
}

#custom-header {
    float: left;
    padding: 20px;
}

#content {
    padding-top: 0px;
    /* width: 620px;  Active content width is 600 px due to left margin */
    float: left;
}

div.post, div.page, h1#archive-title {
    padding: 0 1rem 0 1rem; /* The left margin */
    margin-bottom: 10px;
}

div.entry-content, div.entry-meta {
    margin-bottom: 24px;
}

div.entry-meta {
    padding: 20px;
    background: #333;
    border: 1px solid #f3ecd2;
    border-width: 1px 0; /* Only top and bottom */
}

/* Comments style */
h3#comments {
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid #888;
}

h3#comments, div.navigation, ol.commentlist, div#respond {
    margin-left: 20px; /* Getting the left column right */
}

ol.commentlist {
    margin-bottom: 20px;
}

li.comment {
    list-style: none;
    margin-top: 10px;
}

li.depth-1 {
    padding-bottom: 10px;
    border-bottom: 1px solid #888; /* Bottom border on top level comments */
}

div.comment-author {
}

div.comment-author img.avatar {
    float: left;
    margin-right: 10px;
}

div.comment-meta, div.comment-body p {
    margin-bottom: 10px; /* Adding some space */
}

ul.children {
    margin-left: 20px; /* Left margin for replies in threaded comments */
}

div.reply { /* Reply link in threaded comments */
    padding-top: 5px;
    text-align: right;
    border-top: 1px solid #bfbfbf;
}

div#respond {
}

/* The reply to comments box */
form#commentform {
    margin-top: 10px;
    padding: 20px 20px 10px 20px; /* We only need 10px bottom */
    background: #666;
}

form#commentform p {
    margin-bottom: 10px;
}

form#commentform input {
    margin-right: 10px;
    padding: 3px; /* Some space in the input fields */
    width: 200px;
}

textarea#comment {
    width: 540px;
    padding: 10px;
}

#sidebar-container {
    background-color: #1f7ca6;
    padding-top: 10px;

}

ul#sidebar {
    padding-right: 20px; /* The right margin */
}

ul#sidebar li {
    list-style: none;
}

li.widget {
    margin-bottom: 20px;
}

li#postmeta {
}

li#postmeta h2 {
    margin-bottom: 4px;
}

li.pagenav {
    background: #f6f5ef;
    padding: 10px;
    margin-bottom: 20px;
    font-weight: bold;
}

li.pagenav ul {
    margin-top: 5px;
}

li.pagenav ul li.page_item {
    margin-top: 5px;
    border-width: 0 0 1px 0;
}

li.pagenav ul li.current_page_item {
}

li.latest-box {
    padding: 20px;
    background: #f6f5ef;
}

li.latest-box-story {
    margin-top: 10px;
}

#footer {
    border-top: 5px solid #fff;
    background-color: #171C30;
    width: 100%;
    float: left;
    padding: 20px 0;
}

div.bottom-menu {
    float: left;
    padding: 10px 20px;
}

div.bottom-menu ul {
    width: 920px; /* Full width 960 px -40px padding from div.bottom-menu */
    float: left;
    padding: 10px 0;
    /*border: 1px solid #d5cba7;*/
    /*border-width: 1px 0;*/
}

div.bottom-menu ul li {
    float: left;
    padding: 0 5px;
    list-style: none;
}

div.footer-left {
    width: 320px; /* Active width is 600 px due to left margin */
    float: left;
    padding-left: 20px;
}

div.footer-left ul {
    padding-left: 20px;
}

div.footer-left ul li {
    list-style: none;
}

div.footer-right {
    width: 600px; /* Active width is 300 px due to right margin */
    float: right;
    font-size: x-small;
}

div.footer-right ul {
    padding-right: 20px;
}

div.footer-right ul li {
    list-style: none;
}

#footer-bottom {
    width: 100%;
    float: left;
}

#footer-bottom p {
    padding: 20px 20px 0 20px;
}

div.two-col {
    display: grid;
    grid-template-columns: 66% 34% ;
}

div.col1 {
    padding: 1rem;
}
div.col2 {
    padding: 1rem;
    border-left: 3px white solid;
}


/* LINKS
   ----- */

#logo a {
    color: #000;
    text-decoration: none;
}


div.entry a, h2.entry-title a {
    color: #ccf;
    text-decoration: none;
}

div.entry a:hover, h2.entry-title a:hover {
    color: #a80;
    text-decoration: underline;
}

div.entry-meta a, ul#sidebar a, div#footer a, li.comment a {
    color: #eee;
    text-decoration: none;
}

div.entry-meta a:hover, ul#sidebar a:hover, div#footer a:hover, li.comment a:hover {
    color: #000;
    text-decoration: underline;
}

span.meta-category a {
    color: #887b4c !important;
    text-transform: uppercase;
    font-weight: bold;
}


/* TYPOGRAPHY
   ---------- */

#header, div.top-menu, div.bottom-menu, #sidebar,
div.comment-author, div.comment-meta, div.reply,
h1, h2, h3, h4, h5, h6 {
    font-family: Helvetica, Arial, sans-serif;
}

h1#logo, div#logo, div.entry p, #footer-bottom,
input, textarea, div#header-blurb p {
    font-family: Arial, sans-serif;
}

h1#logo, div#logo {
    font-weight: normal;
    font-size: 48px;
    font-variant: small-caps;
}

div#header-blurb p {
    font-style: italic;
    line-height: 24px;
}

div.entry p {
    font-size: 16px;
    line-height: 24px;
    margin-bottom: 16px;
}

div.comment-body p, div.entry-meta, li.menu-item, h2.widgettitle,
li.latest-box-story h4, input, textarea {
    font-size: 14px;
}

li.menu-item {
    line-height: 14px;
    /*text-transform: uppercase;*/
}

div.search, ul#sidebar li, div.reply,
div.comment-author, div.comment-meta {
    font-size: 12px;
}

li.widget {
    color: #ddd;
}

li.widget p {
    margin-bottom: 8px;
    line-height: 18px;
}

h1.entry-title, h1#archive-title {
    font-size: 36px;
    line-height: 36px;
}

h1.entry-title {
    margin-bottom: 24px;
}

h1#archive-title {
    margin-bottom: 36px;
}

h1#archive-title span {
    font-weight: normal;
    color: #666;
}

h2.entry-title {
    font-size: 24px;
    line-height: 24px;
    margin-bottom: 6px;
}

div.entry h2 {
    margin: 48px 0 12px 0;
}

h2.widgettitle, li.pagenav {
    text-transform: uppercase;
    margin-bottom: 8px;
}

li.latest-box h3 {
    text-transform: uppercase;
    color: #887b4c;
}

li.latest-box-story p {
    margin: 4px 0 0 0;
    color: #666;
    line-height: 12px;
}

li.pagenav ul { /* Fix for Pages lacking proper h2 */
    text-transform: none;
    margin-bottom: 0;
    font-weight: normal;
}

span.meta-category {
    color: #666;
}

div.comment-author, div.comment-meta {
    line-height: 16px;
}

li.widget-area-empty {
    color: red;
}

input {
    font-style: italic;
}


/* WORDPRESS STYLES
   ---------------- */

img.alignleft {
    float: left;
    margin: 0 15px 15px 0;
}

img.alignright {
    float: right;
    margin: 0 0 15px 15px;
}

.wp-caption {
    padding: 10px 7px;
    border: 1px solid #bfbfbf;
    font-size: 12px;
    color: #888;
    font-style: italic;
    text-align: center;
}

p.wp-caption-text {
    margin: 10px 0 0 0;
    padding: 0;
    line-height: 14px;
}

div.gallery {
    margin-bottom: 14px;
}

dl.gallery-item {
}

dt.gallery-icon {
}

img.attachment-thumbnail {
    border: 0;
}

dd.gallery-caption {
    margin-top: 8px;
    font-size: 12px;
    color: #888;
    font-style: italic;
}

#FadeIn_CSS {
    width: 600px;
    padding-left: 50px;
    padding-right: 50px;
    height: 50px;
    background-image: url(img/quotes.gif);
    background-repeat: no-repeat;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    color: #4c6443
}

#FadeIn_CSS a {
    color: #4c6443;
}

#content-fp h1 {
    display: none;
}

#menu-item-27 {
    background-color: #2697b5
}

#menu-item-26 {
    background-color: #3f9be6
}

#menu-item-25 {
    background-color: #5b7dc5
}

#menu-item-75 {
    background-color: #5b7dc5
}

#menu-item-24 {
    background-color: #13375b
}

#menu-item-23 {
    background-color: #215b89
}

#menu-item-22 {
    background-color: #3f9bc6
}

#menu-item-21 {
    background-color: #5b7dc5
}

#menu-item-20 {
    background-color: #14385c
}

.shadow {
    -moz-box-shadow: 0px 0px 4px #ccc;
    -webkit-box-shadow: 3px 3px 4px #000;
    box-shadow: 0px 0px 8px #000;
    /* For IE 8 */
    filter: progid:DXImageTransform.Microsoft.Glow(Color=#000000, Strength=10);
    width: 0px;
    /* For IE 5.5 - 7 */

}

.attachment-large-feature {
    border-top: 0px solid white;
    border-bottom: 5px solid #fff;
    margin-bottom: -4px;
}

#links3 {
    width: 960px;
    height: 225px;
    background-color: #2697b5;
    border-bottom: 5px solid white;
    overflow: visible;
}

#area1 {
    float: left;
    width: 300px;
    padding: 185px 10px 0px 10px;
    height: 40px;
    background-image: url(img/history.jpg);
    background-position: top;
    background-repeat: no-repeat;
    background-color: #2697b5;
}

#area2 {
    float: left;
    width: 300px;
    padding: 185px 10px 0px 10px;
    height: 40px;
    background-image: url(img/stories.jpg);
    background-position: top;
    background-repeat: no-repeat;
    background-color: #3f9be6;
}

#area3 {
    float: left;
    width: 300px;
    padding: 185px 10px 0px 10px;
    height: 40px;
    background-image: url(img/members.jpg);
    background-position: top;
    background-repeat: no-repeat;
    background-color: #5b7dc5;
}

#links3 a {
    color: #fff;
    text-decoration: none;
    font-size: medium;
    font-family: sans-serif;
}

#content h1 {
    padding-top: 10px;
}

h2#comments-title {
    padding-left: 10px;
}

p.must-log-in a {
    color: #ccc;
    font-weight: bold;
    text-decoration: none;
}

p.must-log-in a:hover {
    text-decoration: underline;
    color: yellow;
}