/* ~-~-~~-~-~ CSS Document -~-~-~-~-~ *\
|                                      |
|              Created for             |
|           AshtonSanders.com          |
|           by Ashton Sanders          |
|         WebsitesinaFlash.com         |
|                                      |
\* ~-~-~~-~-~-~-~-~-~-~-~-~-~-~-~-~-~ */

/* ~-~-~-~-~-~-~-~-~~-~-~ ASHTON'S RESET ~-~-~-~-~-~-~-~-~-~-~*/

html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, font, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol,  ul, li,fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: top;
}
ol, ul {
	list-style: none;
}

strong, b, h1 {font-weight:900;}
em { font-style:italic; }
p { margin:1.5em 0;}
html { overflow-y: scroll; font-family: Arial, Helvetica, sans-serif;}


img[alt="View all fonts in this project"] { margin-right: -400px;}



h2 { font-size: 43px;}
H3 { font-size: 33px;}

/* ~-~-~~-~-~ Layout -~-~-~-~-~ */

body {
	font-family: Arial, Helvetica, sans-serif;
	text-align:center;
	background: url("../images/ashton-sanders-universe.jpg") #000000 no-repeat center top;
	color:#FFFFFF;
}

.container {
	margin: 0 auto;
	width: 960px;
}

#home {
	width: 775px;
	margin-bottom: 400px;
	position:relative;
}

#title1 {
	padding-top: 190px;
	height: 410px;
	text-align: left;
	overflow:hidden;
}

#lookaround {
	position:absolute;
	bottom: 20px;
	right:0;
	height: 50px;
	width: 110px;
	text-decoration:none;
	text-align: center;
}

#lookaround span {
	display:block;
	margin:5px auto 0;
	border-width: 10px 5px 0;
	border-color: #FFFFFF #000000 #000000;
	border-style: solid;
	width:1px;
	height:1px;
}
#lookaround:hover span {
	border-top-color: #AAA;
}


#title1 h1{
	text-indent: -600px;
	height: 215px;
}

#title1 h2{
	font-size:33px;
	margin-left:140px;
	letter-spacing:2px;
}
#title1 p {
	text-align:right;
}

.font2 {
	font-family: 'Albertus W01', Arial, Helvetica, sans-serif;
}
#nav1 {
	height: 150px;
}

#nav1 li {
	list-style:none;
	float:left;
	margin-right:50px;
}



/* ~-~-~~-~-~ ABOUT -~-~-~-~-~ */
#aboutashton {
	margin:100px auto 200px;
	padding: 100px 0 0;
	text-align:left;
}
#aboutashton .container {
	position:relative;
}

#piechart {
	position:absolute;
	width:325px;
	height:345px;
	top:0;
	right:50px;
}

#piechart img {
	position:absolute;
}

#piechart #pieoverlay {
	top: -53px;
	left: -52px;
}

#piechart #entrepreneur {
	left:31px;
	top:0;
}
#piechart #nerd {
	left:162px;
	top:11px;
}
#piechart #designer {
	left:0px;
	top:66px;
}
#piechart #gamer {
	left:162px;
	top:162px;
}
#piechart #athlete {
	left:27px;
	top:162px;
}

.piespaceholder {
	float:right;
	width:400px;
	height:278px;
}



/* ~-~-~~-~-~ PLANETS -~-~-~-~-~ */
#planet1 {
    right: 150px;
    position: absolute;
    top: 150px;
    z-index: 60;
}
#planet2 {
    right: 250px;
    position: absolute;
    top: 280px;
    z-index: 60;
}
#planet3 {
    right: 200px;
    position: absolute;
    top: 50px;
    z-index: 60;
}

/* ~-~-~~-~-~ STREAM -~-~-~-~-~ */

#ashtonstream {
	background: url("../images/wires-pipe.jpg") 0 168px repeat-x;
	margin: 200px 0;
}

#television {
	width: 821px;
	height:405px;
	position:relative;
	background: url("../images/about-tv.jpg") 0 0 no-repeat;
	-moz-box-shadow: 0px 0 20px #000000;
	-webkit-box-shadow: 0px 0 20px #000000;
	box-shadow: 0px 0 20px #000000;
}

#television #livefeed {
	position: absolute;
	top: 25px;
	left: 35px;
	z-index:10;
}

#television #overlay {
	position: absolute;
	top: 25px;
	left: 35px;
	z-index:100;
}

#television .screenshot {
	background: url('../images/ashton-sanders-live-feed-cover.jpg') no-repeat;
}


#copyright {
	font-size:12px;
	color:#FFFFFF;
	margin:40px auto 20px;
}
#copyright a, #copyright a:link, #copyright a:active { color: #CC0000;}



/* ~-~-~~-~-~ Anchors -~-~-~-~-~ */

a, a:link, a:active {
	color:#FFFFFF;
}

a:hover {
	color:#AAA;
}

a img { border: none;}



/* ~-~-~~-~-~ ABOUT CAROSEL -~-~-~-~-~ */

.jcarousel-skin-tango .jcarousel-container {
}

.jcarousel-skin-tango .jcarousel-direction-rtl {
	direction: rtl;
}

.jcarousel-skin-tango .jcarousel-container-horizontal {
    width: 100%;
    padding: 20px 40px;
}

.jcarousel-skin-tango .jcarousel-container-vertical {
    width: 920px;
    height: 350px;
    padding: 0 20px 40px;
}

.jcarousel-skin-tango .jcarousel-clip {
    overflow: hidden;
}


.jcarousel-skin-tango .jcarousel-clip-vertical {
    width:  960px;
    height: 350px;
}

.jcarousel-skin-tango .jcarousel-item {
    width: 960px;
    height: 350px;
}

.jcarousel-skin-tango .jcarousel-item-horizontal {
	margin-left: 0;
    margin-right: 10px;
}

.jcarousel-skin-tango .jcarousel-direction-rtl .jcarousel-item-horizontal {
	margin-left: 10px;
    margin-right: 0;
}

.jcarousel-skin-tango .jcarousel-item-vertical {
    margin-bottom: 10px;
}

.jcarousel-skin-tango .jcarousel-item-placeholder {
    background: #fff;
    color: #000;
}

/**
 *  Horizontal Buttons
 */
.jcarousel-skin-tango .jcarousel-next-horizontal {
    position: absolute;
    top: 43px;
    right: 5px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: transparent url(next-horizontal.png) no-repeat 0 0;
}

.jcarousel-skin-tango .jcarousel-direction-rtl .jcarousel-next-horizontal {
    left: 5px;
    right: auto;
    background-image: url(prev-horizontal.png);
}

.jcarousel-skin-tango .jcarousel-next-horizontal:hover,
.jcarousel-skin-tango .jcarousel-next-horizontal:focus {
    background-position: -32px 0;
}

.jcarousel-skin-tango .jcarousel-next-horizontal:active {
    background-position: -64px 0;
}

.jcarousel-skin-tango .jcarousel-next-disabled-horizontal,
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal:hover,
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal:focus,
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal:active {
    cursor: default;
    background-position: -96px 0;
}

.jcarousel-skin-tango .jcarousel-prev-horizontal {
    position: absolute;
    top: 43px;
    left: 5px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: transparent url(prev-horizontal.png) no-repeat 0 0;
}

.jcarousel-skin-tango .jcarousel-direction-rtl .jcarousel-prev-horizontal {
    left: auto;
    right: 5px;
    background-image: url(next-horizontal.png);
}

.jcarousel-skin-tango .jcarousel-prev-horizontal:hover, 
.jcarousel-skin-tango .jcarousel-prev-horizontal:focus {
    background-position: -32px 0;
}

.jcarousel-skin-tango .jcarousel-prev-horizontal:active {
    background-position: -64px 0;
}

.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal,
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:hover,
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:focus,
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:active {
    cursor: default;
    background-position: -96px 0;
}

/**
 *  Vertical Buttons
 */
.jcarousel-skin-tango .jcarousel-next-vertical {
    position: absolute;
    bottom: 5px;
    left: 43px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: #FFF url(next-vertical.png) no-repeat 0 0;
}

.jcarousel-skin-tango .jcarousel-next-vertical:hover,
.jcarousel-skin-tango .jcarousel-next-vertical:focus {
    background-position: 0 -32px;
}

.jcarousel-skin-tango .jcarousel-next-vertical:active {
    background-position: 0 -64px;
}

.jcarousel-skin-tango .jcarousel-next-disabled-vertical,
.jcarousel-skin-tango .jcarousel-next-disabled-vertical:hover,
.jcarousel-skin-tango .jcarousel-next-disabled-vertical:focus,
.jcarousel-skin-tango .jcarousel-next-disabled-vertical:active {
    cursor: default;
    background-position: 0 -96px;
}

.jcarousel-skin-tango .jcarousel-prev-vertical {
    position: absolute;
    top: 5px;
    left: -143px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: #FFF ;
}

.jcarousel-skin-tango .jcarousel-prev-vertical:hover,
.jcarousel-skin-tango .jcarousel-prev-vertical:focus {
    background-position: 0 -32px;
}

.jcarousel-skin-tango .jcarousel-prev-vertical:active {
    background-position: 0 -64px;
}

.jcarousel-skin-tango .jcarousel-prev-disabled-vertical,
.jcarousel-skin-tango .jcarousel-prev-disabled-vertical:hover,
.jcarousel-skin-tango .jcarousel-prev-disabled-vertical:focus,
.jcarousel-skin-tango .jcarousel-prev-disabled-vertical:active {
    cursor: default;
    background-position: 0 -96px;
}