/* Standard */

img
{
border: 0px;
}

* 
{ 
margin: 0; 
padding: 0; 
font-family: "Verdana", "Geneva", sans-serif;
} 

body 
{
background-repeat: repeat-x;
margin: 0px;
}

body, td, p, div
{
font-size: 11px;
line-height: 20px;
}

p
{ 
margin-bottom: 15px;
}

p.center
{
text-align: center;
}

b
{
display: block;
margin-top: 25px;
}

a 
{
}
 
a:link 
{
text-decoration: none;
}

a:visited 
{
text-decoration: none;
}

a:hover 
{
text-decoration: underline;
}

a:active 
{
text-decoration: none;
}

hr
{
color: black;
background: black;
width: 100px;
height: 1px;
margin: 30px 0px 30px 0px;
}

/* interface and content main structure */
 
#content
{
position: relative;
top: -160px;
left: 25px;
width: 470px;
text-align: left;
margin: 0px 0px -160px 0px;
padding: 0px 0px 55px 0px;
border: 0px solid blue;
}

#interface
{
position: relative;
top: -30px;
left: 14px;
width: 164px;
margin: 0px 0px -30px 0px;
padding: 0px 0px 30px 0px;
border: 0px solid aliceblue;
text-align: left;
}

#interface a 
{
display: block;
margin: 0px 0px 2px 0px;
width: 164px;
height: 25px;
border-width: 1px; 
border-style: solid;
-moz-opacity:.80; 
filter:alpha(opacity=80); 
opacity:.80; 
}

#interface a:link 
{
text-decoration: none;
}

#interface a:visited 
{
text-decoration: none;
}

#interface a:hover 
{
text-decoration: none;
}

#interface a:active 
{
text-decoration: none;
}


/* for the main navigation on the left */
ul.mainnav
{
margin: 0px 0px 30px 0px;
font-size: 12px;
line-height: 25px;
letter-spacing: 1px;
}

/* for the select-a-layouter */
ul.layoutlist
{
margin: -15px 0px 0px 0px;
border: 0px solid blueviolet;
}

div#layoutselect
{
width: 100px;
margin: 0px 0px 0px 30px;
padding: 20px 0px 0px 0px;
border: 0px solid burlywood;
}



/* design layout and structure */

#main
{
position: absolute;
top: 0px;
left: 50%;
margin-left: -363px;
width: 727px;
}

#lefty
{
position: absolute; 
top: 0px;
left: 0px;
width: 202px;
margin: 0px 0px 30px 0px;
padding: 0px;
border: 0px solid cadetblue;
}


#righty
{
position: absolute; 
top: 0px;
left: 202px;
width: 525px;
margin: 0px 0px 30px 0px;
padding: 0px;
border: 0px solid chartreuse;
}

#lefttop
{
position: relative;
top: 0px;
left: 0px;
width: 202px;
height: 330px;
margin: 0px;
padding: 0px;
border: 0px solid deepskyblue;
}

#righttop
{
position: relative;
top: 0px;
left: 0px;
width: 525px;
height: 330px;
margin: 0px;
padding: 0px;
border: 0px solid chocolate;
}

#leftcontent
{
position: relative;
top: 0px;
left: 0px;
width: 202px;
margin: 0px;
padding: 0px;
border: 0px solid coral;
}

#rightcontent
{
position: relative;
top: 0px;
left: 0px;
width: 525px;
margin: 0px;
padding: 1px;
border: 0px solid crimson;
}

#leftbottom
{
position: relative;
top: 0px;
left: 0px;
width: 202px;
height: 30px;
margin: 0px;
padding: 0px;
border: 0px solid firebrick;
}

#rightbottom
{
position: relative;
top: 0px;
left: 0px;
width: 525px;
height: 30px;
margin: 0px;
padding: 0px;
border: 0px solid gold;
}



/* not sure, really */

.levzero, .levone, .levtwo, .levthree, .levfour, .levfive
{
display: block;
}

.levone, .levtwo, .levthree, .levfour, .levfive
{
text-align: left;
}

.levzero
{
text-align: right;
}

.levone
{
font-weight: bold;
letter-spacing: 2px;
margin-top: 0px;
margin-bottom: 0px;
}

.levtwo
{
font-style: italic;
margin-top: 0px;
margin-bottom: 0px;
}

.levthree
{
margin-top: 0px;
margin-bottom: 0px;
}

.levfour
{
margin-top: 0px;
font-size: larger;
}

.levfive
{

}

.port /* portfolio */
{
width: 100%;
min-height: 95px;
position: relative;
margin-bottom: 20px;
padding: 0;
}

img.portimage /* portfolio */
{
margin-right: 20px;
margin-bottom: 0;
margin-top: 5px;
padding-right: 0;
float: left;
}

img.portimagebig /* portfolio-desc */
{
}

/* wtf labels */

label
{
position: relative;
top: -2px;
padding-right: 10px;
padding-bottom: 5px;
margin: 0;
}

label.indentonce
{
margin: 2px 0px 2px 30px;
}


#contactpage /* contact page! */
{
margin: 0px;
padding: 0px;
border: 1px solid white;
}

/* list stuff */

ul 
{
padding: 0;
list-style-type: none;
}

ol ul ul
{
margin: 0px 0px 0px 20px;
}

ul.contact
{
margin: -10px 0px 10px 20px;
padding: 0;
list-style-type: square;
}

ul.home
{
margin: -18px 0px 10px 20px;
padding: 0;
list-style-type: square;
}

ul.resources
{
margin: -10px 0px 10px 20px;
padding: 0;
list-style-type: square;
}

ul.services
{
margin: -10px 0px 10px 20px;
padding: 0;
list-style-type: square;
}

ul.information
{
margin: -10px 0px 10px 20px;
padding: 0;
list-style-type: square;
}

ul.searchportfolio
{
margin: -10px 0px 30px 0px;
padding: 0;
list-style-type: none;
}

ol
{
margin: -10px 0px 0px 25px;
padding: 0;
}


ol#webdesignmenu 
{
margin: 0px 0px 0px 15px;
}

ol#webdesignmenu li
{
display: block;
}


li input.underlined
{
border-bottom: 1px ridge;
}

.nextprevious
{
position: relative;
left: 10px;
height: 30px;
padding: 30px 0px 0px 0px;
margin: 0px 0px -10px 0px;
}

.previous
{
position: absolute;
top: 20px;
left: 0px;
text-align: left;
}

.next
{
position: absolute;
top: 20px;
left: 400px;
text-align: right;
}

.page
{
position: absolute;
top: 20px;
left: 190px;
text-align: center;
}




h1 /* used as right-aligned title on subpages */
{
font-weight: normal;
font-size: 13px;
text-align: right;
margin: 0px 0px 10px 80px;
padding: 0px 0px 2px 0px; 
border-bottom: 1px solid;
}


h2 /* used as back link on subpages and portfolio sublinks*/
{
font-weight: normal;
font-size: 11px;
margin: 0px 0px 30px 0px;
padding: 0px 0px 0px 0px;
text-align: right;
}

h3 /* not used */
{
font-weight: normal;
font-size: 11px;
text-align: center;
margin: 0px 0px 20px 0px;
}

h4 /* portfolio site name */
{
font-size: 12px;
font-weight: normal;
text-align: center;
letter-spacing: 1px;
margin: 20px 0px 0px 0px;
padding: 0px 0px 0px 0px;
height: 20px;
}


h5 /* used in questionnaire to make underlined headers */

{
font-size: 12px;
font-weight: normal;
text-align: left;
letter-spacing: 0px;
border-bottom: 1px ridge;
margin: 30px 60px 15px 10px;
padding: 0px 0px 2px 0px;
}


h6 /* used for a faq headline */

{
font-size: 12px;
text-align: left;
letter-spacing: 2px;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
}

.logposttitle /* used in mode=home */
{
display: block;
font-size: 12px;
text-align: left;
line-height: 40px;
height: 40px;
margin: 0px 5px 0px 0px;
padding: 0px 0px 0px 0px;
text-decoration: underline;
-moz-opacity:.80; 
filter:alpha(opacity=80); 
opacity:.80; 
}

.gimmesomespace
{
margin: 1px 0px 1px 0px;
}

table#searchportfolio
{
width: 400px;
border: 1px solid yellow;
}

.spacer
{
float: right;
}

/* used in mode=colors */
#colorshinies
{
border: 1px solid black;
}


td#colorcell
{
cursor: pointer;
cursor: hand;
width: 10px;
height: 10px;
}


div#color-table
{
position: absolute;
top: 40px;
left: 0px;
width: 372px;
height: 372px;
border: 0px solid yellow
}

div#color-table-sidebar
{
position: absolute;
top: 40px;
left: 382px;
width: 88px;
height: 372px;
border: 0px solid blue
}


.fontexample
{
margin: 0px 0px 30px 0px;
padding: 0px 0px 0px 0px;
overflow: hidden;
display: block;
font-weight: bold;
border: 0px solid white;
height: 66px;
}


.toupper
{
text-transform: capitalize;
}

#sneakylinkhome
{
position: relative;
top: 5px;
left: 180px;
width: 330px;
height: 65px;
border: 0px solid orange;
}



/* form stuff */

input, textarea, select, option
{
font-size: 11px;
}

input, textarea
{
padding-right: 3px;
padding-left: 3px;
}

textarea#contact
{
overflow: auto;
width: 196px;
height: 100px;
}

input.noborders
{
border: 0px;
background: transparent !important;
}

input.option
{
border: 0px;
}



.virgoformselect
{
width: 200px;
}

.virgoformtext
{
width: 192px;
}



td.colornames
{
width: 115px;
padding: 3px 1px 3px 1px;
color: #2F2D2D;
border: 1px solid black;
}

table.colorlist
{
margin: 0px 0px 30px 0px;
}

label.levelone, label.leveltwo, label.levelthree
{
display: block;
}

label.levelone
{
margin: 0px 0px 0px 0px;
}

label.leveltwo
{
margin: 0px 0px 0px 10px;
}

label.levelthree
{
margin: 0px 0px 0px 20px;
}


a.huh
{
position: relative; /*this is the key*/
z-index: 24; 
background-color: #ccc;
color: #000;
text-decoration: none;
}

a.huh:hover
{
z-index: 25; 
background-color: #ff0;
}

a.huh span
{
display: none;
}

a.huh:hover span
{ 
/*the span will display just on :hover state*/
display: block;
position: absolute;
top: -15px; 
left: 25px; 
width: 200px;
padding: 5px;
border: 1px solid #0cf;
background-color: #cff; 
color: #000;
text-align: center;
}