/******************************
Description...:Screen CSS
Author........:lewis@fointypinger.co.uk
Last Changed..:20-11-2011
Notes.........:
/******************/
* {margin:0;padding:0;border:0;}
body {
font-family:"trebuchet ms","lucida sans unicode","lucida grande","lucida sans",arial,sans-serif;
text-align:center;
cursor:default;
background:url(../img/bg.jpg) top center fixed;
}
#container {
position:relative;
width:960px;
margin:0 auto;
text-align:left;
}
/*@font-face {
font-family:"Sunshiney";
src:url("../data/Sunshiney.ttf");
}
.wf-sunshiney-n4-loading h2 {visibility:hidden;}*/
/******************
Header**/
.masthead {
width:100%;height:150px;
background:#000 url(../img/fp.gif) center no-repeat;
}
.masthead h1 {}
.masthead h1 span {position:absolute;left:-9999px;}
/*skippy*/
a.skip {position:absolute;left:-9999px;}
a.skip:focus, a.skip:active {
top:0;left:0;
width:100%;
z-index:999;
font-size:0.7em;
color:#fff;
padding:5px 0;
background:#000;
opacity:0.7;
}
/******************
Navigation system**/
#system {
width:100%;
text-align:left;
margin:0 auto 10px;
border-top:3px solid #333;
border-bottom:3px solid #333;
background:#021f1f;
}
.dhtml {
font:bold 1em georgia,"times new roman",times,serif;
letter-spacing:-1px;
text-transform:lowercase;
}
.dhtml ul {
width:140px;
list-style:none;
background:#333;
border:3px solid #555;
}
.dhtml li {
padding:7px 0;
display:block;
position:relative;
z-index:9;
}
.dhtml a {
text-decoration:none;
color:#fff;
display:block;
}
.dhtml ul#navtop {
width:960px;
border:0;margin:0 auto;
background:#021f1f;
}
.dhtml li.navtoplevel {
float:left;
margin:0 10px;
}
.dhtml li.navtoplevel:hover {background:#294c6f;}
.dhtml li.navtoplevel a:hover {color:#fff;}
.dhtml a.navtoplink {
display:inline;
color:#fff;
font-weight:bold;
text-decoration:none;
padding:7px 15px;

-moz-transition:background 300ms ease-in;
-webkit-transition:background 300ms ease-in;
-o-transition:background 300ms ease-in;
transition:background 300ms ease-in;
}
.dhtml a.navtoplink:visited {color:#fff;}
.dhtml a.navtoplink:hover, .dhtml a.selected {
color:#fff;
text-decoration:none;
background:#45678f;
}
.dhtml ul ul {
display:none;
position:absolute;
top:-3px;right:-146px;

border-radius:4px;
}
.dhtml li:hover ul ul {display:none;}
.dhtml li:hover ul, .dhtml li:hover li:hover ul {display:block;}
.dhtml ul.menu {
position:absolute;
left:-3px;top:28px;
}
.dhtml ul.menu li {
padding:4px 17px 4px 6px;
font-weight:normal;

-moz-transition:background 200ms ease-out;
-webkit-transition:background 200ms ease-out;
-o-transition:background 200ms ease-out;
transition:background 200ms ease-out;
}
.dhtml li.navtoplevel ul.menu li:hover {background-color:#c2652e;}
.dhtml li.folder {background:url(../img/arr_mid.gif) no-repeat 98% 50%;}
.dhtml li.folder:hover {background:#c2652e url(../img/arr_mid.gif) no-repeat 98% 50%;}
.dhtml li.folder ul li:hover {background-color:#c2652e;}
.dhtml li.folder ul li.new, .dhtml li ul li.new {background:url(../img/icon-new.gif) no-repeat 99% 50%;}
.dhtml ul.menu li.folder:hover {background: url(../img/arr_mid.gif) no-repeat 98% 50%;}

.dhtml li.navtoplevel a:focus {background:#333;}
/******************
Moo move**/
#box {
position:absolute;
left:935px;top:-37px;
width:16px;height:16px;
}
#boo {
position:absolute;
left:0;top:0;
width:16px;height:16px;
cursor:help;
z-index:999;
background:url(../img/boo-small.gif) bottom;
}
#boo:hover {background-position:top;}
/******************
Options**/
#options {
position:absolute;
top:-195px;right:3px;
width:125px;
}
.options-btn {
float:right;
width:24px;height:24px;
cursor:pointer;
opacity:0.5;
background:url(../img/icon-help.gif) no-repeat right top;
}
.options-btn:hover {opacity:1;}
.options-btn p {text-align:center;}
#optionsClosed {
width:125px;height:56px;
padding:40px 0 0;margin-right:5px;
background:url(../img/options_bg.gif) no-repeat;
}
#optionsClosed span {position:absolute;left:-9999px;}
#optionsClosed a {
float:left;
width:16px;height:16px;
margin:4px -12px 0 18px;
}
#optionsClosed a:hover {}
#optionsClosed a.rss {padding:0;background:none;}
#optionsClosed a:link, #options a:visited {color:#fff;text-decoration:none;}
#optionsClosed a:hover {color:#ccc;text-decoration:underline;}
/******************
Search**/
#search {
float:left;
margin:5px 0 0 13px;
}
#search input {
vertical-align:top;
color:#fff;
background:#29614a;
}
#search input.query {
width:47px;
font-size:0.75em;
padding:1px 3px;
border:1px solid #4a3018;
}
#search input.search {
cursor:pointer;
width:16px;height:16px;
padding:0;margin:1px 0 0 1px;
background:url(../img/icon-search.gif);
}
/******************
Main Content**/
#content-holder {
float:left;
width:750px;
margin:0 10px 0 0;
background:url(../img/content-holder_bg.png) bottom no-repeat;
}
.content {
float:left;
width:750px;min-height:450px;
margin-bottom:10px;
background:#634049 url(../img/content_bg.png) no-repeat;
}
.content h2 {
position:relative;
clear:right;
font:bold 1.2em "Sunshiney",cambria,georgia,palatino,"palatino linotype",times,"times new roman",serif;
letter-spacing:-1px;
color:#eab066;/*c7df53*/
margin:10px 0;padding:5px 10px;
background:#613d42;
border-top:2px solid #522c32;
border-bottom:2px solid #522c32;

text-shadow:0 1px 2px #222;
}
.content h2 span {
position:absolute;
top:9px;right:10px;
font:bold 0.65em georgia,"times new roman",times,serif;
color:#956e3d;

text-shadow:none;
-moz-transition:color 500ms ease-in;
-webkit-transition:color 500ms ease-in;
-o-transition:color 500ms ease-in;
transition:color 500ms ease-in;
}
.content h2 span:before { content:": Posted: ";}
.content h2 span strong {color:#956e3d;}
.content h2:hover span {color:rgba(149,110,61,0.5);}
.content h3 {
clear:right;
color:#af844c;
font-size:1em;
font-weight:normal;
letter-spacing:-1px;
padding:3px 10px;
background:#4f272e;
border-top:1px solid #3a1c21;
border-bottom:1px solid #3a1c21;
}
.content h4 {
clear:right;
color:#af844c;
font-size:0.85em;
font-weight:normal;
padding:10px 15px 0;
}
.content p {
color:#fff;
font-size:0.9em;
line-height:1.35em;
margin:10px 15px;

text-shadow:0 1px 1px #111;
}
.content img {
float:right;
margin:10px 15px;
border:3px solid #795;

-o-box-shadow:0 0 6px #333;
-moz-box-shadow:0 0 6px #333;
-webkit-box-shadow:0 0 6px #333;
box-shadow:0 0 6px #333;

-o-border-radius:2px;
-moz-border-radius:2px;
-webkit-border-radius:2px;
border-radius:2px;
}
.content img:hover {border:3px solid #900;-moz-box-shadow:none;-webkit-box-shadow:none;}
.content ul {margin:7px 0 14px;}
.content li {
color:#fff;
list-style:none;
font-size:0.9em;
line-height:1.1em;
margin:0 0 10px 25px;
padding-left:18px;
background:url(../img/icon-list.gif) 0 2px no-repeat;
}
.content a {
color:#eab066;
font-weight:bold;
text-decoration:none;
border-bottom:1px dotted #795;
}
.content a:hover {
color:#c59961;
border-bottom:0;
padding-bottom:1px;
}
.content a:visited, a:active {text-decoration:none;}
.content a:focus {border:1px dotted #795;}
.content span.share {float:right;margin:17px 0 0;}
/******************
Type**/
h3.type-gme {background:#4f272e url(../img/icon-type01.gif) no-repeat 98% 50%;}
h3.type-msc {background:#4f272e url(../img/icon-type02.png) no-repeat 98% 50%;}
h3.type-fet {background:#4f272e url(../img/icon-type03.png) no-repeat 98% 50%;}
/******************
Zoomy**/
#zoom img {
float:right;
margin:0 10px 10px;padding:0;
width:150px;/*show only thumbnail*/
height:105px;
background:url(../img/news/thunderforce_01_small.gif) no-repeat top left;
}
#zoom img:hover {
width:240px;/*adjust size to zoomed photo*/
height:170px;
background:url(../img/news/thunderforce_01.gif) no-repeat top left;
}
/******************
Reviews**/
.review {}
.review p.score {
display:inline;
font-size:1.05em;
letter-spacing:-1px;
color:#eab066;
padding:2px 6px;
background:#4f272e;

-o-border-radius:8px;
-moz-border-radius:8px;
-webkit-border-radius:8px;
border-radius:8px;
}
.review p.score strong {color:#795;}
/******************
Image tags**/
.tagimage {
float:right;
clear:right;
width:145px;
margin:0 0 10px 10px;
border:2px solid #3a1c21;
border-right:0;
}
.tagimage cite {
float:right;
clear:right;
width:114px;
font-size:0.7em;
font-weight:normal;
color:#fff;
line-height:12px;
margin:-7px 10px 10px 0;padding:5px;
background:#4f3137;
border:1px solid #3a1c21;
}
.tagimage img, .tagimage_large img {margin:10px;}
.tagimage_large {
float:right;
width:175px;
margin:0 0 10px 10px;
border:2px solid #3a1c21;
border-right:0;
}
.tagimage_large cite {
float:right;
clear:right;
width:144px;
font-size:0.7em;
font-weight:normal;
color:#fff;
line-height:12px;
margin:-5px 10px 10px 0;padding:5px;
background:#4f3137;
border:1px solid #3a1c21;
}
.tagimage_large ul.numeric {
float:right;
width:142px;
font-style:italic;
margin:-7px 10px 0 0;padding:5px;
background:#edebd5;
border:1px solid #795;
}
.tagimage_large ul.numeric li {
color:#000;
font-size:0.6em;
line-height:12px;
font-style:italic;
margin:-7px 2px 0 20px;padding:5px;
}
/******************
BoxOuts**/
.boxout {
float:left;
width:140px;
margin:0 10px 5px 15px;
border:3px solid #795;
background:#3a1c21;
}
.boxout:hover {border:3px solid #900;}
.boxout h3 {
color:#eab066;
font-size:0.8em;
font-weight:bold;
letter-spacing:-1px;
margin:3px;padding:5px;
border:0;
}
.boxout p {
clear:left;
color:#795;
font-size:0.7em;
line-height:1.20em;
margin:7px 5px;
}
/******************
Gallery**/
#gallery {
display:none;
padding:10px 0 20px 45px;
}
#gallery ol li {
background:none;padding:0 0 5px 0;margin:10px 10px 0 0;/*reset*/
float:left;
position:relative;
width:156px;
font-size:0.8em;
text-align:center;
background:#522c32;

-moz-border-radius-bottomright:8px;
-webkit-border-bottom-right-radius:8px;
-moz-border-radius-bottomleft:8px;
-webkit-border-bottom-left-radius:8px;
}
#gallery ol li img {margin-bottom:-10px;float:left;margin:0 0 5px 0;}
#gallery ol li span {
position:absolute;
top:-6px;left:-3px;
color:#fff;
font-size:2.2em;
line-height:0.8em;
padding:4px 6px;
background:#23364c;

-o-border-radius:8px;
-moz-border-radius:8px;
-webkit-border-radius:8px;
border-radius:8px;
}
#gallery ol li strong {display:block;color:#eab066;}
/******************
Links**/
#links-holder {
float:left;
width:200px;
background:url(../img/links-holder_bg.png) bottom no-repeat;
}
.links {
float:left;
width:200px;
font-family:"lucida sans","lucida sans unicode",lucida,verdana,sans-serif;
background:#4d343e url(../img/links_bg.png) no-repeat;
margin-bottom:10px;
}
.links dl dt {
clear:both;
text-align:right;
font:normal 0.75em georgia,"times new roman",times,serif;
text-transform:uppercase;
color:#cfab81;
padding:3px 10px;margin:10px 0 5px;
background:#31455c;
border-top:1px solid #0a131f;
border-bottom:1px solid #0a131f;
}
.links dl dt.nav01 {background:#17283a;}
.links dl dt.nav02 {background:#23364c;}

.links dl dd {
list-style:none;
font-size:0.75em;
margin:2px 12px;
}
.links img {margin:5px -5px 5px 12px;}
.links a {color:#8eac6e;text-decoration:underline;}
.links a:visited {color:#8eac6e;}
.links a:hover, .links a:active {color:#795;text-decoration:none;}
.links a:focus {margin-left:15px;}
/******************
Twatter**/
#twitter_div {
float:left;
position:relative;
width:160px;/*min-height:90px;*/
color:#795;
font-size:0.75em;
line-height:1.2em;
letter-spacing:-1px;
padding:15px 30px 5px 10px;
background:url(../img/twitter_bg.png) 155px 50% no-repeat;
}
#subby {
cursor:pointer;
float:right;
position:absolute;
top:-8px;right:-11px;
width:36px;height:46px;
font-size:0.75em;
letter-spacing:normal;
opacity:0.3;
background:url(../img/twitter-gul.gif) right top no-repeat;
}
#subby:hover {opacity:1;}
a#follow {
display:none;
position:absolute;
bottom:4px;right:4px;
font-size:0.85em;
line-height:normal;
color:#ff537f;
padding:4px 16px 4px 7px;
background:#222 url(../img/icon-twitter.png) no-repeat 96% 50%;

-o-border-radius:8px;
-moz-border-radius:8px;
-webkit-border-radius:8px;
border-radius:8px;
}

ul#twitter_update_list {}
ul#twitter_update_list li {list-style:none;clear:left;/*for multi*/}
ul#twitter_update_list li span:before {content:open-quote;}
ul#twitter_update_list li span:after {content:close-quote;}
ul#twitter_update_list li a {
float:left;
clear:left;
margin:0px 0 10px;
color:#7bbb15;
}
ul#twitter_update_list li span {display:inline-block;vertical-align:text-top;/*for opera*/}
ul#twitter_update_list li span a {float:none;margin:0;}
ul#twitter_update_list li a:hover {color:#8eac6e;text-decoration:none;}
/******************
Footer**/
#footer {
float:left;
width:100%;
margin-top:15px;padding:20px 0;
background:#000;
background:rgba(000,000,000,0.3);
border-top:3px solid #795;
}
#footer p {
font-size:0.8em;
text-align:center;
line-height:1.6em;
letter-spacing:-1px;
text-transform:lowercase;
color:#a6a4af;

text-shadow:0 1px 2px #444;
}
#footer em {opacity:0.7;}
#footer a:link, #footer a:active, #footer a:visited {
color:#a6a4af;
text-decoration:underline;
}
#footer a:hover {text-decoration:none;}
#back-top {
position:fixed;
top:50%;left:5px;
}
#back-top a {
display:block;
width:21px;height:22px;
background:url(../img/icon-top.gif);
opacity:0.2;
}
#back-top a:hover {opacity:1;}
/******************
Common**/
acronym, abbr {cursor:help;border-bottom:1px solid #9a8e51;}
blockquote {font-size:1.05em;font-weight:bold;}
q {font-style:italic;font-size:0.8em;color:#ddd;margin:10px 10px 0;display:block;}
cite {font-weight:bold;color:#fff;font-size:0.8em;margin:-10px 10px 0;}
strong {color:#9a7;}
.error {text-decoration:line-through;}
.hide {position:absolute;left:-9999px;}
p.tiny {font-size:0.7em;}
a:active, a:focus {outline:none;}
::-moz-selection {background:#ff537f;color:#fff;}/*888f1a*/
::selection {background:#ff537f;color:#fff;}
a.rss {padding-right:13px;background:url(../img/icon-rss.gif) no-repeat 100% 50%;}
a.twitter {padding-right:13px;background:url(../img/icon-twitter.png) no-repeat 100% 50%;}
a.xhtml {padding-right:19px;background:url(../img/icon-html.gif) no-repeat 100% 50%;}
a.netvibes {padding-right:13px;background:url(../img/icon-netvibes.gif) no-repeat 100% 50%;}
a.cmsms {padding-right:13px;background:url(../img/icon-cmsms.png) no-repeat 100% 50%;}
a.more {letter-spacing:-1px;padding-right:14px;background:url(../img/icon-more.gif) no-repeat 100% 3px;}

/******************
ToolTips**/
.toolTipElement {/*cursor:help;*/}
.tool-tip {
color:#111;
max-width:115px;
z-index:99;
}
.tool-title {position:absolute;left:-9999px;}
.tool-text {
text-align:left;
font:bold 0.7em arial,tahoma,sans-serif;
padding:3px 5px;
background:#fff;
background:rgba(255,255,255,0.85);

-o-border-radius:8px;
-moz-border-radius:8px;
-webkit-border-radius:8px;
border-radius:8px;

-o-box-shadow:1px 1px 2px #555;
-moz-box-shadow:1px 1px 2px #555;
-webkit-box-shadow:1px 1px 2px #555;
box-shadow:1px 1px 2px #555;
}
/******************
Clearfix**/
.clearfix:after {
content:".";
display:block;
clear:both;
visibility:hidden;
line-height:0;
height:0;
}
html[xmlns] .clearfix {display:block;}
* html .clearfix {height:1%;}

/******************
Meejia**/
@media screen and (max-width:980px) {
body {/*font-size:120%;*/}
#container {width:100%;}
#box {display:none;left:0;top:0;}
.dhtml ul#navtop {width:100%;}
.dhtml li.navtoplevel {margin:0 -10px 0 10px;}
.dhtml li:hover ul, .dhtml li:hover li:hover ul {display:none;}
#content-holder {width:67%;margin-left:10px;background:#634049 none;border-radius:10px;}
.content {width:100%;background:#634049 none;border-radius:10px;}
.content h2 span {display:none;}
#links-holder {width:27%;background:#303341 none;border-radius:10px;}
.links {width:100%;/*font-size:90%;*/background:#303341 none;border-radius:10px;}
#twitter_div {width:90%;padding:15px 5% 5px 5%;}
#subby {right:0;}
#back-top {top:50%;left:67%;}
}

@media screen and (max-width:380px) {
body {background:#fff none;}
#system {margin:0 0 10px;border:0;}
.masthead {background:#fff none; height:auto;}
.masthead h1 span {position:static;left:0;}
#options, #back-top {display:none;}
.dhtml li {clear:left;text-align:center;width:100%;}
.dhtml li.navtoplevel {margin:0;}
.dhtml a.navtoplink {padding:7px 0;width:100%;display:block;}
#content-holder {width:100%;margin:0;}
.content img {float:none;}
#links-holder {width:100%;margin:10px 0;}
#footer {margin:0;padding:20px 0;background:#000;}
}