/******************************
    The Art in Articles
    By Timothy Foster
    Copyright 2013
******************************/
 
/* Imports
=============================*/
@import url(/css/code/1);
@import url(/css/code/2);
@import url(http://themes.wdfiles.com/local--files/the-art-in-articles/cssFont_Tangerine.css);
@import url(http://snippets.wdfiles.com/local--code/sp-css-import);
@import url(http://checklist-app.wdfiles.com/local--code/checklist-css);
@import url(http://fonts.googleapis.com/css?family=Ewert);
 
/* Logo Image
=============================*/
#container-wrap{
    background-image: url(http://imperialshadows.wdfiles.com/local--files/css/Backgrounds.jpg);
    background-repeat: no-repeat;
}
 
/* Global
=============================*/
body{
    font-family: sans-serif;
    min-height: 101%;
}
p{    line-height: 1.4em; }
a{
    color: #c20404;
    text-decoration: none;
}
#main-content a
{
color:#53aee6;
}
a:hover{
    color: #4ebfde;
    text-decoration: none;
    background: none;
}
a.newpage{    color: #AAA; }
a.newpage:hover{    color: #A2A2A2; }
div.buttons input, input.button, button,
a.button, .pager span.target a,
.owindow .button-bar a, div.new-post a{
    border-radius: 10px;
    background: #E4E4E4;
    color: #444;
    border: none;
    text-decoration: none;
    transition: background 150ms;
    -moz-transition: background 150ms;
    -webkit-transition: background 150ms;
    -o-transition: background 150ms;
}
div.buttons input:hover, input.button:hover, button:hover,
a.button:hover, .pager span.target a:hover,
.owindow .button-bar a:hover, .new-post a:hover{
    background: #E4E4E4;
    color: white;
    text-decoration: none;
}
input.text, input[type=text], textarea{
    border-radius: 5px;
    border: 1px solid #DDD;
    box-shadow: 0 0 2px -1px rgba(0,0,0,.25) inset;
    transition: box-shadow 150ms;
    -moz-transition: all 150ms;
    -webkit-transition:all 150ms;
    -o-transition: all 150ms;
}
input.text:focus, input[type=text]:focus, textarea:focus{
    box-shadow: 0 0 2px -1px rgba(0,0,0,.05) inset;
    border-color: #BBB;
}
 
/* ?! */
html *::selection{
    background-color: #5CA2E0;
    color: #F7F7F7;
}
html *::-moz-selection{
    background-color: #5CA2E0;
    color: #F7F7F7;
}

/*  */
 
/* Outer Frame
=============================*/

body{    background-color: black; }
#container-wrap{
    margin: 30px 0 0 30px;
    background-color: #3d3d3d;
    border-top-left-radius: 50px;
    background-repeat: no-repeat;
}
 
/* Header
=============================*/

#header{    height: 225px; 
    padding-top: 40px
}

#header h1{
    font-family: 'star_jediregular';
    font-size: clamp(1.25rem, 0.1931rem + 4.6974vw, 5.83rem);
    margin: 0px 0px 0px 75px;
}

#header h1 a{
    color: white;
    text-shadow: -5px 5px 0px rgba(0,0,0,0.25);
    transition: color 1750ms ease-in-out;
    -moz-transition: color 1750ms ease-in-out;
    -webkit-transition: color 1750ms ease-in-out;
    -o-transition: color 1750ms east-in-out;
}

#header h1 a:hover{
    text-decoration: none;
    color: #660000;
}

#header h2{
    color: white;
    font-family: 'star_jediregular';
    font-size: 15pt;
    margin: 0 0 0 200px;
    letter-spacing: 1px;
}
 
/* Top Bar
=============================*/
#top-bar{
    width: 100%;
    right: 10px;
    background: #DDD;
    margin: 0;
    border-radius: 0 10px 10px 0;
}
#top-bar ul{    padding: 0 0 0 227px; }
#top-bar li a{
    color: #444;
    background: #DDD no-repeat right center url(http://themes.wdfiles.com/local--files/the-art-in-articles/topBarArrow.png);
    padding-right: 1.75em;
    padding-left: .5em;
    padding-top: 1px;
    /*font-style: italic;*/
    letter-spacing: 1px;
    transition: all 400ms;
    -moz-transition: all 400ms;
    -webkit-transition: all 400ms;
    -o-transition: all 400ms;
}
#top-bar li ul li{
    background: #DDD;
    transition: all 400ms;
    -moz-transition: all 400ms;
    -webkit-transition: all 400ms;
    -o-transition: all 400ms;
}
#top-bar li ul li a{
    display: block;
    width: 150px;
    background: #DDD;
    font-size: 90%;
    padding: 0 80px 0 24px;
    text-indent: -10px;
}
#top-bar li ul li:hover{    background: #E5E5E5; }
#top-bar li a:hover, #top-bar li a.current-link{
    background-color: #E5E5E5;
    color: #444;
    text-decoration: none;
}
#top-bar li ul li a:hover{
    background: #E5E5E5;
    text-indent: 0;
}
#top-bar li ul{
    background: #DDD;
    overflow: hidden;
    width: 0px;
    margin-left: 13px;
    transition: all 400ms ease-in;
    -moz-transition: all 400ms ease-in;
    -webkit-transition: all 400ms ease-in;
    -o-transition: all 400ms ease-in;
}
#top-bar li:hover ul{    width: 200px; }
 
/* Login Status
=============================*/
#login-status{
    color: #444;
    font-size: 90%;
}
#login-status a strong{    text-decoration: none; }
#login-status .printuser a{    display: none; }
#account-topbutton{
    background: #DDD;
    color: #444;
    border: none;
    border-radius: 5px;
}
#account-options{
    background-color: #FFF;
    border: 1px solid #BBB;
    box-shadow: 0 0 2px -1px rgba(0,0,0,.25);
    border-radius: 5px;
    text-align: right;
    max-width: 120px;
}
#account-options li a{
    transition: padding-right 150ms;
    -moz-transition: padding-right 150ms;
    -webkit-transition: padding-right 150ms;
    -o-transition: padding-right 150ms;
}
#account-options li a:hover{
    color: #487AAB;
    text-decoration: none;
    padding-right: 8px;
}
#account-options li:nth-child(1),
#account-options li:nth-child(2),
#account-options li:nth-child(3),
#account-options li:nth-child(5){    display: none; }
 
/* Search Bar
=============================*/
#search-top-box{
    width: 242px;
    top: 60px;
    border: 1px solid #AAA;
    background: #FFF;
    border-radius: 3px;
}
#search-top-box input.text{
    border: none !important;
    background: none !important;
    box-shadow: none !important;
    width: 212px;
    color: #555;
    border-radius: 0;
}
#search-top-box input.text.empty{    color: #AAA; }
#search-top-box input.button{
    text-indent: -9999px;
    width: 20px;
    height: 20px;
    border: none;
    padding: 0;
    background-color: #FFF;
    background-image: url(http://themes.wdfiles.com/local--files/the-art-in-articles/search-icon.png);
    background-repeat: no-repeat;
    background-position: center center;
    cursor: pointer;
}
 
/* Side Bar
=============================*/
#side-bar{
    width: 225px;
    font-size: 100%;
    font-weight: bold;
    color: black;
}
#side-bar h1, #side-bar h2{
    font-family: 'star_jediregular';
    font-size: 15pt;
    background-color: #e4e4e4;
    padding: 25px 0 5px 1em;
    margin: 0 7px 0 -1em;
    border-radius: 0 10px 10px 0;
}

#side-bar h2{
    
    font-size: 15pt;
    padding: 3px 0 3px 1em;
}
#side-bar h3, #side-bar h4
#side-bar h5, #side-bar h6{    font-size: 15pt; }
/* Footer
=============================*/
#footer{
    background: #DDD;
    border-radius: 0 10px 10px 0;
    margin-right: 10px;
}
#license-area{    opacity: .75; }
 
/* Main Content
=============================*/
#main-content{
    margin: 15px 15px 15px 220px;
    width: 75%;
    background-color: rgba(0,0,0,0.8);
    border: 1px solid black;
    border-right: none;
    box-shadow: 0 0 4px -1px rgba(0,0,0,0.25);
    border-radius: 10px 10px 10px 10px;
    color: white;
}
#main-content h1,
#main-content h2,
#main-content h3,
#main-content h4,
#main-content h5,
#main-content h6{    margin: 12px 0 8px 0; }
#main-content h1{    font-size: 18pt; }
#main-content h2{    font-size: 16pt; }
#main-content h3{    font-size: 14pt; }
#main-content h4{    font-size: 12pt; }
#main-content h5{    font-size: 11pt; }
#main-content h6{    font-size: 10pt; }
#main-content h1{    border-bottom: 1px solid #CCC; }
#main-content p{    margin: 8px 0 12px 0 }
hr{    background-color: #CCC; }
#breadcrumbs{
    margin-left: 2em;
    font-size: 90%;
    color: #444;
}
.page-watch-options{    font-size: 80%; }
.pager .pager-no{    display: none; }
.pager .current{
    background: #DDD;
    padding: 2px 9px;
    color: #444;
    border-radius: 10px;
    border: none;
}
#page-version-info{    display: none; }
.error-block{    text-align: center; }
 
/* Toc
=============================*/
#toc{
    background-color: #FFF;
    border: 1px solid #BBB;
    box-shadow: 0 0 2px -1px rgba(0,0,0,.25);
    border-radius: 5px;
    min-width: 210px;
}
#toc #toc-action-bar{
    padding: 0;
    position: relative;
    left: 146px;
    top: 4px;
    font-size: 80%;
    height: 0;
}
#toc-action-bar::before{
    color: #444;
    content: '(';
}
#toc-action-bar::after{
    color: #444;
    content: ')';
}
#toc .title{
    padding-left: 2em;
    color: #444;
    text-align: left;
}
 
/* Code Blocks
=============================*/
.code{
    background: none;
    background-image: url(http://themes.wdfiles.com/local--files/the-art-in-articles/code.png);
    background-repeat: no-repeat;
    background-position: top right;
    border: none;
    border-left: 2px solid #DDD;
    border-right: 1px dashed #EEE;
    margin: 6px 1em 6px 1em;
    padding: 0 1em;
    box-shadow: 2px 0 4px -2px rgba(0, 0, 0, 0.2);
}
.code pre{
    font-family: monospace;
    font-size: 13px;
    line-height: 1.25em;
}
 
/* Wikidot's Tables
=============================*/
table.wiki-content-table{
    border-radius: 5px;
    opacity: 0.7;
}
table.wiki-content-table th{
    background: #DDD;
    color: #444;
    font-weight: bold;
    letter-spacing: 1px;
    border: none;
    padding: 1px 1em;
}
table.wiki-content-table td{
    border: none;
    background: none;
    padding: 2px 1em;
    color: #222;
}
table.wiki-content-table tr:nth-child(odd){
    background-color: #F7F7F7;
}
 
/* Timothy Foster's Image Box
=============================*/
.image-box{
    border: 1px solid #BBB;
    border-radius: 5px;
    background-color: #FFF;
    box-shadow: 0 0 2px -1px rgba(0,0,0,.25);
}
.image-box-heading{
    background-color: #DDD;
    border-radius: 5px 5px 0 0;
    color: #444;
    letter-spacing: 1px;
}
.image-box-caption{
    color: #777;
    font-style: normal !important;
}
 
/* Generic Hovertips
=============================*/
.hovertip{
    border: 1px solid #BBB !important;
    background: white;
    opacity: .95 !important;
    border-radius: 5px;
    box-shadow: 0 0 2px -1px rgba(0,0,0,.25);
}
.hovertip .content{    font-size: 90%; }
 
/* James Kanjo's Hovertips
=============================*/
.hover{
    text-decoration: underline;
    border-bottom: 1px solid;
    color: #4476A7;
}
.hover:hover{
    text-decoration: none;
    border-bottom: none;
}
.hover span{    
    visibility: hidden;
    position: absolute;
    opacity: 0;
    transition: opacity 500ms;
    -moz-transition: opacity 500ms;
    -webkit-transition: opacity 500ms;
    -o-transition: opacity 500ms;
}
.hover:hover span{
    visibility: visible;
    position: absolute;
    display: inline;
    opacity: 1;
    color: #444;
    font-size: 90%;
    margin: 15px -20px;
    height: auto;
    background: #FFFFFF;
    border: 1px solid #BBB;
    width: 300px;
    padding: 1em;
    border-radius: 5px;
    box-shadow: 0 0 2px -1px rgba(0,0,0,.25);
}
.hover:hover span span{
    position: relative;
    margin: auto;
    height: auto;
    width: auto;
    border: none;
    padding: 0;
}
 
/* Tabview
=============================*/
.yui-navset .yui-nav a{
    border-radius: 5px 5px 0 0;
    border: #3173ad;
    background: none;
    color: #777;
    font-size: 90%;
}
.yui-navset .yui-nav .selected a{
    background: #3173ad;
    border-radius: 5px 5px 0 0;
    border: #3173ad;
    color: #444;
    letter-spacing: 1px;
    font-size: 100%;
}
.yui-navset .yui-nav{    border-bottom: 3px solid #3173ad; }
.yui-navset .yui-nav a:hover,
.yui-navset .yui-nav a:active,
.yui-navset .yui-nav a:focus{
    background: none;
    color: #444;
}
.yui-navset .yui-nav .selected a:hover,
.yui-navset .yui-nav .selected a:active,
.yui-navset .yui-nav .selected a:focus{
    background: #3173ad;
    color: #FFF;
}
.yui-navset .yui-nav a em{    border: none}
.yui-navset .yui-content{
    border-radius: 0 0 5px 5px;
    border: 1px solid #BBB;
    background-color: black;
    box-shadow: 0 0 2px -1px rgba(0,0,0,.25);
}
 
/* Rate Widget
=============================*/
.page-rate-widget-box{    margin: 5px 0; }
.page-rate-widget-box .rate-points{
    border: 1px solid #BBB;
    background: #FFF;
    box-shadow: 0 0 2px -1px rgba(0,0,0,.25);
    border-radius: 5px;
    padding: 2px 10px;
    margin-right: 6px;
    text-transform: capitalize;
    color: #444;
    font-weight: normal;
}
.page-rate-widget-box .rate-points .number{    font-weight: bold; }
.page-rate-widget-box .rateup a,
.page-rate-widget-box .ratedown a,
.page-rate-widget-box .cancel a{
    color: #444;
    background: #DDD;
    font-weight: bold;
    transition: all 150ms;
   -moz-transition: all 150ms;
   -webkit-transition: all 150ms;
   -o-transition: all 150ms;
}
.page-rate-widget-box .rateup a:hover,
.page-rate-widget-box .ratedown a:hover,
.page-rate-widget-box .cancel a:hover{
    background: #E4E4E4;
    text-decoration: none;
}
.page-rate-widget-box .rateup a{    border-radius: 10px 0 0 10px; }
.page-rate-widget-box .cancel a{    border-radius: 0 10px 10px 0; }
 
/* Owindow
=============================*/
.odialog-shader{    opacity: .5; }
.owindow{
    border: 1px solid #BBB;
    background-color: #FFF;
    border-radius: 5px;
    box-shadow: 0 0 8px 4px rgba(0,0,0,.1);
}
.owindow .button-bar a{    text-transform: capitalize; 
    color:white;
}
.owindow h1{    font-size: 14pt; }
.owindow h2{    font-size: 12pt; }
.owindow .content img:first-child{
    border-radius: 5px;
    box-shadow: 0 0 2px -1px rgba(0,0,0,.25);
    padding: 0 !important;
    margin: 2px 8px;
 }
 
/*
 * HOVER-SENSITIVE EDITOR BUTTONS
 * More info: http://bit.ly/l5dRds
 */
 
/* Show only one row of icons by default */
#np-editor-panel, #wd-editor-toolbar-panel {
    height: 30px;
    position: relative;
    overflow: hidden;
    -webkit-transition: height 450ms ease-in-out; /* Chrome & Safari */
    -moz-transition: height 450ms ease-in-out; /* Firefox */
    -o-transition: height 450ms ease-in-out; /* Opera */
    -ms-transition: height 450ms ease-in-out; /* Internet Explorer 9 */
    transition: height 450ms ease-in-out; /* Generic */
}
/* When your mouse hovers over it, reveal the other rows */
#np-editor-panel:hover, #wd-editor-toolbar-panel:hover {
    height: 90px;
}

 
/* Navi-Bar
=============================*/
#navi-bar{
    border-color: #888;
    box-shadow: 0 1px 2px rgba(0,0,0,.2);
}
#navi-bar .new-site input.text{
    text-align: right;
    opacity: .5;
    transition: opacity 500ms;
    -moz-transition: opacity 500ms;
    -webkit-transition: opacity 500ms;
    -o-transition: opacity 500ms;
}
#navi-bar .new-site input.text:focus{    opacity: 1; }
 
/* Kenneth's simpleCal
=============================*/
.cal-main-table{
    border-radius: 5px;
    box-shadow: 0 0 4px -2px rgba(0,0,0,.25);
}
.cal-wrap-table a{    color: #4476A7; }
.cal-wrap-table a:hover{    color: #487AAB; }
.cal-wrap-table .cal-main-table .cal-hover-box{    margin-top: 3px; }
.cal-wrap-table .cal-main-table div.hover-mini-event,
.cal-event-list div.mini-event{
    border: none;
    background: #DDD;
    border-radius: 10px;
    padding: 1px 8px;
}
.cal-wrap-table .cal-main-table .hover-mini-event a{    color: #444; }
.cal-wrap-table .cal-main-table .dh-content{    background: #FFF; }
.cal-wrap-table .new-page-box{
    border: none !important;
    background: none !important;
    padding: 0 !important;
}
.cal-wrap-table .new-page-box input.text{
    border-radius: 5px;
    border: none;
    border: 1px solid #DDD !important;
    box-shadow: 0 0 2px -1px rgba(0,0,0,.25) inset;
    background: #FFF !important;
    padding: 2px !important;
    transition: box-shadow 150ms;
    -moz-transition: all 150ms;
    -webkit-transition:all 150ms;
    -o-transition: all 150ms;
}
.cal-wrap-table .cal-hover-box .new-page-box input.text{
    width: 95%;
}
.cal-wrap-table .cal-modal-content{
    border: 1px solid #BBB;
    background-color: #FFF;
    border-radius: 5px;
    box-shadow: 0 0 8px 4px rgba(0,0,0,.1);
}
.cal-wrap-table .cal-hover .collapsible-block-unfolded-link{
    right: 47%;
    top: 17%;
}
 
/* Timothy's Checklist
=============================*/
.checklist-status-head,
.checklist-item-head,
.checklist-priority-head,
.checklist-date-head,
.checklist-options-head{
    background-color: #DDD;
    padding: 0 5px 0 5px;
    color: #444;
    letter-spacing: 1px;
    font-weight: bold;
}
.checklist-table tr:nth-child(odd){    background-color: #F7F7F7; }
 
/* Quick Comments
=============================*/
#np-editor-title, #np-title,
#np-editor-panel,
#np-cancel, #np-preview,
#new-post-form br{    display: none; }
#np-text{
    width: 85% !important;
    height: 200px !important;
}
.signature{    display: none; }
span.printuser.avatarhover a:first-child{    display: none; }
#thread-container .head .options{    display: none; }
#thread-container .post{
    border: 1px solid #BBB;
    border-radius: 5px;
    background: #FFF;
    margin: 14px 0;
    padding: 5px 10px;
    color: #777;
}
#thread-container .post .content{    padding-left: 8px; }
#thread-container .head .odate{    float: right; }
#thread-container .head{    background: none; }
div.comments-box #thread-container .post{
    font-size: 90%;
    color: #444;
}
 
/* Forum
=============================*/
blockquote{
    background: none;
    background-image: url(http://themes.wdfiles.com/local--files/the-art-in-articles/quotes.png);
    background-repeat: no-repeat;
    background-position: top right;
    border: none;
    border-left: 2px solid #DDD;
    border-right: 1px solid #EEE;
    margin: 6px 2em;
    padding: 3px 1em;
    box-shadow: 2px 0 4px -2px rgba(0, 0, 0, 0.2);
}
blockquote p{
    font-style: italic;
    color: #555;
}
.forum-start-box .forum-group div.head{
    background: #DDD;
    color: #444;
    border: none;
}
.forum-start-box .head .title{
    color: #444;
    letter-spacing: 1px;
}
 
/* Site Manager
=============================*/
#site-manager .head{    border-bottom: 1px solid #CCC; }

/* Printing
=============================*/
body.print-body{
    background-image: none !important;
    background-color: #FFF !important;
}
.print-body #content-wrap,
.print-body #main-content{
    border: none !important;
    box-shadow: none !important;
    margin: 0;
}
.print-body .quickCom{    display: none !important; }
 
// Special class for omitting things from print
.print-body .noprint{    display: none; }

div.ThreeColumns {
    -moz-column-count:3; -ms-column-count:3; -o-column-count:3; -webkit-column-count:3; column-count:3;

div.FourColumns {
    -moz-column-count:4; -ms-column-count:4; -o-column-count:4; -webkit-column-count:4; column-count:4;