2013-01-08 22:08:01 +00:00
|
|
|
BODY /* applies global body style, same as using inside <body> tag */
|
|
|
|
|
{
|
|
|
|
|
background: #000;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
img
|
|
|
|
|
{
|
|
|
|
|
max-width: 80%;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#container /* Contains everything */
|
2012-09-21 03:34:38 +00:00
|
|
|
{
|
|
|
|
|
margin: 0 auto;
|
|
|
|
|
width: 100%;
|
2013-01-08 22:08:01 +00:00
|
|
|
background: #000;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/* Begin stuff for header */
|
|
|
|
|
|
|
|
|
|
#header-bg-bg /* The background of the background of the header */
|
|
|
|
|
{
|
|
|
|
|
background: #333;
|
|
|
|
|
width: 100%;
|
|
|
|
|
float: left;
|
|
|
|
|
border:0px solid gray;
|
|
|
|
|
resize:none;
|
|
|
|
|
outline:0;
|
|
|
|
|
padding:2px;
|
|
|
|
|
border-top-right-radius:20px;
|
|
|
|
|
border-top-left-radius:20px;
|
|
|
|
|
-webkit-box-shadow:0px 0px 16px 1px gray;
|
2012-09-21 03:34:38 +00:00
|
|
|
}
|
|
|
|
|
|
2013-01-08 22:08:01 +00:00
|
|
|
#header-bg /* The background of the header */
|
2012-09-21 03:34:38 +00:00
|
|
|
{
|
2013-01-08 22:08:01 +00:00
|
|
|
margin-left: 12%;
|
|
|
|
|
margin-right: 10%;
|
|
|
|
|
width: 1060px;
|
|
|
|
|
background: #444;
|
|
|
|
|
border:0px solid gray;
|
|
|
|
|
resize:none;
|
|
|
|
|
outline:0;
|
|
|
|
|
border-radius:80px;
|
|
|
|
|
-webkit-box-shadow:0px 0px 20px 1px gray;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#header /* The header - Transparent image */
|
|
|
|
|
{
|
|
|
|
|
margin-left: 0%;
|
|
|
|
|
margin-right: 0%;
|
2012-09-21 03:34:38 +00:00
|
|
|
text-align: center;
|
2013-01-08 22:08:01 +00:00
|
|
|
float: center;
|
|
|
|
|
padding: 0px;
|
2012-09-21 03:34:38 +00:00
|
|
|
}
|
|
|
|
|
|
2013-01-08 22:08:01 +00:00
|
|
|
/* End stuff for header, begin stuff for navigation */
|
2012-09-21 03:34:38 +00:00
|
|
|
|
2013-01-08 22:08:01 +00:00
|
|
|
#navigation-bg
|
2012-09-21 03:34:38 +00:00
|
|
|
{
|
|
|
|
|
float: left;
|
|
|
|
|
width: 100%;
|
|
|
|
|
background: #333;
|
2013-01-08 22:08:01 +00:00
|
|
|
border:0px solid gray;
|
|
|
|
|
resize:none;
|
|
|
|
|
outline:0;
|
|
|
|
|
padding:2px;
|
|
|
|
|
border-bottom-left-radius:20px;
|
|
|
|
|
border-bottom-right-radius:20px;
|
|
|
|
|
-webkit-box-shadow:0px 0px 16px 1px gray;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#navigation /* Navigation menu -- Such a pain to center it to the header */
|
|
|
|
|
{
|
|
|
|
|
float: center;
|
|
|
|
|
width: 100%;
|
2012-09-21 03:34:38 +00:00
|
|
|
text-align: center;
|
2013-01-08 22:08:01 +00:00
|
|
|
padding: 0px 8%;
|
2012-09-21 03:34:38 +00:00
|
|
|
}
|
|
|
|
|
|
2013-01-08 22:08:01 +00:00
|
|
|
#navigation ul /* Formatting to center text in list */
|
2012-09-21 03:34:38 +00:00
|
|
|
{
|
|
|
|
|
margin: 0;
|
|
|
|
|
}
|
|
|
|
|
|
2013-01-08 22:08:01 +00:00
|
|
|
#navigation ul li /* Formatting to render list as bar */
|
2012-09-21 03:34:38 +00:00
|
|
|
{
|
|
|
|
|
list-style-type: none;
|
|
|
|
|
display: inline;
|
|
|
|
|
}
|
|
|
|
|
|
2013-01-08 22:08:01 +00:00
|
|
|
#navigation li a /* Add some coolness to the links and change text size to fit */
|
2012-09-21 03:34:38 +00:00
|
|
|
{
|
2013-01-08 22:08:01 +00:00
|
|
|
font-size: 18px;
|
2012-09-21 03:34:38 +00:00
|
|
|
float: left;
|
|
|
|
|
padding: 5px 10px;
|
|
|
|
|
color: #fff;
|
|
|
|
|
text-decoration: none;
|
|
|
|
|
border-right: 1px solid #fff;
|
2013-01-08 22:08:01 +00:00
|
|
|
border-left: 1px solid #fff;
|
|
|
|
|
-webkit-transition: all 0.35s ease;
|
|
|
|
|
-moz-transition: all 0.35s ease;
|
|
|
|
|
-o-transition: all 0.35s ease;
|
|
|
|
|
-ms-transition: all 0.35s ease;
|
|
|
|
|
transition: all 0.35s ease;
|
2012-09-21 03:34:38 +00:00
|
|
|
}
|
|
|
|
|
|
2013-01-08 22:08:01 +00:00
|
|
|
#navigation li a:hover /* Create the purple halo with blue background effect on mouse:hover */
|
|
|
|
|
{
|
|
|
|
|
text-align: center;
|
|
|
|
|
background: #009999;
|
|
|
|
|
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 15px rgba(179, 51, 229, 0.9) !important;
|
|
|
|
|
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 15px rgba(179, 51, 229, 0.9) !important;
|
|
|
|
|
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 15px rgba(179, 51, 229, 0.9) !important;
|
|
|
|
|
border:0px solid gray;
|
|
|
|
|
resize:none;
|
|
|
|
|
outline:0;
|
|
|
|
|
padding: 5px 10px;
|
|
|
|
|
border-right: 1px solid #fff;
|
|
|
|
|
border-left: 1px solid #fff;
|
|
|
|
|
}
|
2012-09-21 03:34:38 +00:00
|
|
|
|
2013-01-08 22:08:01 +00:00
|
|
|
/* End navigation, begin cc1 or left side */
|
|
|
|
|
|
|
|
|
|
#content-container1 /* Allows left side of page to shrink or grow depending on window size */
|
2012-09-21 03:34:38 +00:00
|
|
|
{
|
|
|
|
|
float: left;
|
|
|
|
|
width: 100%;
|
2013-01-08 22:08:01 +00:00
|
|
|
background: #777677 url(left.gif) repeat-y 20% 0;
|
|
|
|
|
border:0px solid gray;
|
|
|
|
|
resize:none;
|
|
|
|
|
outline:0;
|
|
|
|
|
padding:2px;
|
|
|
|
|
border-top-right-radius:20px;
|
|
|
|
|
border-top-left-radius:20px;
|
|
|
|
|
-webkit-box-shadow:0px 0px 16px 1px gray;
|
2012-09-21 03:34:38 +00:00
|
|
|
}
|
|
|
|
|
|
2013-01-08 22:08:01 +00:00
|
|
|
/* Begin cc2 or right side */
|
|
|
|
|
|
|
|
|
|
#content-container2 /* Allows right side of page to shrink or grow depending on window size */
|
2012-09-21 03:34:38 +00:00
|
|
|
{
|
|
|
|
|
float: left;
|
|
|
|
|
width: 100%;
|
2013-01-08 22:08:01 +00:00
|
|
|
background: url(right.gif) repeat-y 80% 0;
|
|
|
|
|
border:0px solid gray;
|
|
|
|
|
resize:none;
|
|
|
|
|
outline:0;
|
|
|
|
|
padding:2px;
|
|
|
|
|
border-top-right-radius:20px;
|
|
|
|
|
border-top-left-radius:20px;
|
|
|
|
|
-webkit-box-shadow:0px 0px 16px 1px gray;
|
2012-09-21 03:34:38 +00:00
|
|
|
}
|
|
|
|
|
|
2013-01-08 22:08:01 +00:00
|
|
|
/* Begin left panel navigation - (Services Offered) */
|
|
|
|
|
|
|
|
|
|
#section-navigation /* Basic aligning stuff */
|
2012-09-21 03:34:38 +00:00
|
|
|
{
|
|
|
|
|
float: left;
|
|
|
|
|
width: 16%;
|
|
|
|
|
padding: 20px 0;
|
|
|
|
|
margin: 0 2%;
|
|
|
|
|
display: inline;
|
|
|
|
|
}
|
|
|
|
|
|
2013-01-08 22:08:01 +00:00
|
|
|
#section-navigation ul /* Draw a box with rounded corners and shadow around the list */
|
2012-09-21 03:34:38 +00:00
|
|
|
{
|
|
|
|
|
margin: 0;
|
|
|
|
|
padding: 0;
|
2013-01-08 22:08:01 +00:00
|
|
|
border:0px solid gray;
|
|
|
|
|
resize:none;
|
|
|
|
|
outline:0;
|
|
|
|
|
padding:5px;
|
|
|
|
|
border-radius:30px;
|
|
|
|
|
-webkit-box-shadow:0px 0px 20px 1px gray;
|
|
|
|
|
float: center;
|
|
|
|
|
border-color: #B333E5;
|
|
|
|
|
background-color:#777;
|
|
|
|
|
color:#ffffff;
|
2012-09-21 03:34:38 +00:00
|
|
|
}
|
|
|
|
|
|
2013-01-08 22:08:01 +00:00
|
|
|
#section-navigation ul li /* Format the list, similar to navigation above */
|
2012-09-21 03:34:38 +00:00
|
|
|
{
|
|
|
|
|
margin: 0 0 1em;
|
|
|
|
|
padding: 0;
|
|
|
|
|
list-style-type: none;
|
|
|
|
|
}
|
|
|
|
|
|
2013-01-08 22:08:01 +00:00
|
|
|
#section-navigation ul li h4 /* center <h4> tags */
|
|
|
|
|
{
|
|
|
|
|
text-align: center;
|
|
|
|
|
padding: 0;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#section-navigation ul li img
|
|
|
|
|
{
|
|
|
|
|
border:0px solid #F8DAE2;
|
|
|
|
|
resize:none;
|
|
|
|
|
outline:0;
|
|
|
|
|
padding:0;
|
|
|
|
|
border-radius:15px;
|
|
|
|
|
-webkit-box-shadow:0px 0px 18px 1px #443377;
|
|
|
|
|
float: center;
|
|
|
|
|
border-color: #F8DAE2;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/* End left panel navigation, begin main content or center content */
|
|
|
|
|
|
|
|
|
|
#content /* To the right of #section-navigation this is the main part of page*/
|
2012-09-21 03:34:38 +00:00
|
|
|
{
|
|
|
|
|
float: left;
|
|
|
|
|
width: 56%;
|
2013-01-08 22:08:01 +00:00
|
|
|
padding: 18px 8px;
|
|
|
|
|
margin: 0 0 0 1.34%;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#content h2 /* Format a transparent box with rounded edges around colored bolded <h2> tags with shadow */
|
|
|
|
|
{
|
|
|
|
|
margin: 0;
|
|
|
|
|
padding: 0px;
|
|
|
|
|
text-align: center;
|
|
|
|
|
border-radius:10px;
|
|
|
|
|
-webkit-box-shadow:0px 0px 8px 1px #333;
|
|
|
|
|
color: #443377;
|
|
|
|
|
text-shadow: 0 0 0.3em #87F;
|
|
|
|
|
font-weight: 900;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/* Begin content post stuff - renders posts */
|
|
|
|
|
|
|
|
|
|
.content-post-wrapper { /* Responsible for outer design on left and right sides along with shadows on the posts */
|
|
|
|
|
border:0px solid #b333e5;
|
|
|
|
|
resize:none;
|
|
|
|
|
outline:0;
|
|
|
|
|
padding:5px;
|
|
|
|
|
border-radius:15px;
|
|
|
|
|
-webkit-box-shadow:0px 0px 18px 1px gray;
|
|
|
|
|
float: center;
|
|
|
|
|
border-color: #B333E5;
|
|
|
|
|
background-color:#444;
|
|
|
|
|
color:#ffffff;
|
|
|
|
|
text-align: left;
|
|
|
|
|
padding: 1px 6px;
|
|
|
|
|
-moz-box-shadow: 2px 2px 2px 3px #999;
|
|
|
|
|
-webkit-box-shadow: 0px 0px 18px 1px gray, 2px 2px 2px 3px #999;
|
|
|
|
|
box-shadow: 2px 2px 2px 3px #999;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#content-post /* Basic box with rounded corners */
|
|
|
|
|
{
|
|
|
|
|
border:0px solid #b333e5;
|
|
|
|
|
resize:none;
|
|
|
|
|
outline:0;
|
|
|
|
|
padding:5px;
|
|
|
|
|
border-radius:15px;
|
|
|
|
|
-webkit-box-shadow:0px 0px 18px 1px gray;
|
|
|
|
|
float: center;
|
|
|
|
|
border-color: #B333E5;
|
|
|
|
|
background-color:#444;
|
|
|
|
|
color:#ffffff;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#content-post p /* Make the text to the left with a little bit of spacing for readibility */
|
|
|
|
|
{
|
|
|
|
|
text-align: left;
|
|
|
|
|
padding: 1px 6px;
|
2012-09-21 03:34:38 +00:00
|
|
|
}
|
|
|
|
|
|
2013-01-08 22:08:01 +00:00
|
|
|
#content-post h3 /* Format <h3> tags to center top of post with a font size of 16 */
|
|
|
|
|
{
|
|
|
|
|
text-align: center;
|
|
|
|
|
padding: 0px;
|
|
|
|
|
font-size: 16px;
|
|
|
|
|
top: 100%;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#content-post p:last-child:after { /* Adds the 'Φ' to the right corner of posts */
|
|
|
|
|
content: "\03A6"; /* capital Phi */
|
|
|
|
|
font-size: 130%;
|
|
|
|
|
padding-left: 10px;
|
|
|
|
|
float: right;
|
|
|
|
|
position: relative;
|
|
|
|
|
top: 15px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#content-foot
|
|
|
|
|
{
|
|
|
|
|
position: relative;
|
|
|
|
|
top: 100%;
|
|
|
|
|
bottom: auto;
|
|
|
|
|
width: 100%;
|
|
|
|
|
border:0px solid #fff;
|
|
|
|
|
resize:none;
|
|
|
|
|
outline:0;
|
|
|
|
|
padding:5px;
|
|
|
|
|
border-radius:15px;
|
|
|
|
|
-webkit-box-shadow:0px 0px 18px 1px gray;
|
|
|
|
|
float: center;
|
|
|
|
|
border-color: #B333E5;
|
|
|
|
|
background-color:#444;
|
|
|
|
|
color:#ffffff;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#content-foot p
|
|
|
|
|
{
|
|
|
|
|
text-align: right;
|
|
|
|
|
padding: 1px 6px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/* Begin content post links - Still WIP */
|
2012-09-21 03:34:38 +00:00
|
|
|
|
2013-01-08 22:08:01 +00:00
|
|
|
#content-post a /* Draw box around link */
|
|
|
|
|
{
|
|
|
|
|
border:0px solid gray;
|
|
|
|
|
resize:none;
|
|
|
|
|
outline:0;
|
|
|
|
|
padding:2px;
|
|
|
|
|
border-radius:2px;
|
|
|
|
|
-webkit-box-shadow:0px 0px 2px 1px gray;
|
|
|
|
|
text-decoration: none;
|
|
|
|
|
-webkit-transition: all 0.35s ease;
|
|
|
|
|
-moz-transition: all 0.35s ease;
|
|
|
|
|
-o-transition: all 0.35s ease;
|
|
|
|
|
-ms-transition: all 0.35s ease;
|
|
|
|
|
transition: all 0.35s ease;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#content-post a:hover /* Change box to oval and change unvisited link color */
|
|
|
|
|
{
|
|
|
|
|
border:0px solid gray;
|
|
|
|
|
resize:none;
|
|
|
|
|
background: #444;
|
|
|
|
|
color: blue;
|
|
|
|
|
outline:0;
|
|
|
|
|
padding:2px;
|
|
|
|
|
border-radius:10px;
|
|
|
|
|
-webkit-box-shadow:0px 0px 16px 1px gray;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#content-post a:visited /* Change box to oval and change visited link color */
|
|
|
|
|
{
|
|
|
|
|
border:0px solid gray;
|
|
|
|
|
resize:none;
|
|
|
|
|
background: #444;
|
|
|
|
|
color: red;
|
|
|
|
|
outline:0;
|
|
|
|
|
padding:2px;
|
|
|
|
|
border-radius:10px;
|
|
|
|
|
-webkit-box-shadow:0px 0px 16px 1px gray;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/* End content post stuff, begin right panel - Still WIP */
|
|
|
|
|
|
|
|
|
|
#aside /* Everything on the right side of page */
|
2012-09-21 03:34:38 +00:00
|
|
|
{
|
|
|
|
|
float: right;
|
|
|
|
|
width: 16%;
|
|
|
|
|
padding: 20px 0;
|
|
|
|
|
margin: 0 2% 0 0;
|
|
|
|
|
display: inline;
|
|
|
|
|
}
|
|
|
|
|
|
2013-01-08 22:08:01 +00:00
|
|
|
#aside ul
|
|
|
|
|
{
|
|
|
|
|
margin: 0;
|
|
|
|
|
padding: 0;
|
|
|
|
|
border:0px solid gray;
|
|
|
|
|
resize:none;
|
|
|
|
|
outline:0;
|
|
|
|
|
padding:5px;
|
|
|
|
|
border-radius:30px;
|
|
|
|
|
-webkit-box-shadow:0px 0px 20px 1px gray;
|
|
|
|
|
float: center;
|
|
|
|
|
border-color: #B333E5;
|
|
|
|
|
background-color:#777;
|
|
|
|
|
color:#ffffff;
|
|
|
|
|
}
|
2012-09-21 03:34:38 +00:00
|
|
|
|
2013-01-08 22:08:01 +00:00
|
|
|
#aside ul li /* Format the list, similar to navigation above */
|
|
|
|
|
{
|
|
|
|
|
margin: 0 0 1em;
|
|
|
|
|
padding: 0;
|
|
|
|
|
list-style-type: none;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/*#aside h3 { margin: 0; } /* fix spacing for right-side <h3> tags */
|
|
|
|
|
|
|
|
|
|
/* End right panel, begin footer - Still WIP */
|
|
|
|
|
|
|
|
|
|
#footer /* Very bottom of document - small alignment and fitting to keep everything fluid */
|
2012-09-21 03:34:38 +00:00
|
|
|
{
|
|
|
|
|
clear: both;
|
2013-01-08 22:08:01 +00:00
|
|
|
background: #aaa;
|
2012-09-21 03:34:38 +00:00
|
|
|
text-align: right;
|
2013-01-08 22:08:01 +00:00
|
|
|
padding: 5px 0px;
|
|
|
|
|
margin: 10px auto;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/* End main formatting, begin misc formatting */
|
|
|
|
|
|
|
|
|
|
/* -------------------------------------------------------------------------- */
|
|
|
|
|
|
|
|
|
|
#ads
|
|
|
|
|
{
|
|
|
|
|
padding: 0;
|
|
|
|
|
text-align: center;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/* Begin noads for when ads are blocked or JS disabled - Still WIP */
|
|
|
|
|
|
|
|
|
|
#noa { /* Shows up inside <noscript> tag - draws a bordered box */
|
|
|
|
|
padding: 5px 10px;
|
|
|
|
|
margin: 10px;
|
|
|
|
|
border: 1px dashed #fff;
|
|
|
|
|
text-align: center;
|
|
|
|
|
float: center;
|
|
|
|
|
color: #ffe;
|
|
|
|
|
border-radius:10px;
|
|
|
|
|
-webkit-box-shadow:0px 0px 16px 1px gray;
|
|
|
|
|
-moz-box-shadow: 0 0 0 4px #ff0030, 2px 1px 4px 4px rgba(10,10,0,.5);
|
2012-11-17 01:35:58 +00:00
|
|
|
}
|
2013-01-08 22:08:01 +00:00
|
|
|
|
|
|
|
|
/* End noads, begin text highlight coloring */
|
|
|
|
|
|
|
|
|
|
::-moz-selection {
|
|
|
|
|
background-color: #009999;
|
|
|
|
|
color: #fff;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
::selection {
|
|
|
|
|
background-color: #009999;
|
|
|
|
|
color: #fff;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/* End text highlight coloring */
|
