@charset "utf-8";
@import url("/css/reset.css");

/* 1 :-------- Global Styles ------------ */

body,td,th {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.2em;
}
body  {
	margin: 0;
	padding: 0;
	font-size: 62.5%;
	height: 100%;
	background: #fff;
	color: #000;
}
table { font-size: 0.9em;}
p {
	font-size: 1.2em;
	line-height: 1.2em;
	padding-bottom: 10px;
}
a {
	font-size: inherit;
	text-decoration: underline;
	padding: 0;
	background: none;
	color: #464646;
}
a:hover {
	text-decoration: none;
	color: #464646;
}
h1,h2,h3,h4,h5,h6 {
	font-weight: bold;
	letter-spacing: 0.04em;
	padding-bottom: 7px;
	color: #0055a5;
}
h1 {
	font-size: 2.0em;
}
h2 {
	font-size: 1.8em;
}
h3 {
	font-size: 1.6em;
}
h4 {
	font-size: 1.5em;
}
h5 {
	font-size: 1.4em;
}
h6 {
	font-size: 1.3em;
}
hr {
	border: none;
	background: transparent url(../images/seperator.gif) no-repeat;
	border-color: #fff;
	height: 15px;
	margin: 10px 0;
}
input,select,textarea {
	font-family: Arial, Helvetica, sans-serif;
}
.cleaner {
	clear: both;
	font-size: 1px;
	height: 0;
    line-height: 0px;
	border: none;
	margin: 0;
	padding: 0;
	background: transparent;
}
.invisible {
	visibility: hidden;
	display: none;
}
.visible {
	visibility: visible;
}


.update_success {
	display: block;
	width: 90%;
	background: #e0eed9 url(../images/icons/success.gif) no-repeat;
	background-position: 5px 2px;
	padding: 5px 5px 5px 35px;
	margin-bottom: 10px;
	border: #a1d07e 1px solid;
	font-size: 12px;
}
.update_failure {
	width: 90%;
	display: block;
	background: #ffd6d6 url(../images/icons/fail.gif) no-repeat;
	background-position: 5px 2px;
	padding: 5px 5px 5px 35px;
	margin-bottom: 10px;
	border: #f00 1px solid;
	font-size: 12px;
}



#profile {
	width: 706px;
	height: 701px;
	background-color: #fff;
}
#profile #header { 
	position: relative;
	width: 706px;
	text-align: left;
	height: 170px;
}
#profile #header .sidebar1 {
	position: absolute;
	top: 0;
	left: 0;
	width: 260px;
	padding: 0;
}
#profile #header .sidebar2 {
	position: absolute;
	top: 0;
	right: 0;
	width: 250px;
	padding: 30px 0 0 0;
}
#profile #header .mainContent { 
	margin: 0 250px 0 260px;
	padding: 35px 0 0 5px;
}
.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* this class can be used to float an element left in your page */
	float: left;
	margin-right: 8px;
}


#profile #header .sidebar1 h1.artistprofile {
	width: 260px;
	height: 170px;
	margin: 0;
	background: transparent url(../images/profile/artist-profile.gif) no-repeat;
}
#profile #header .sidebar1 h1.artistprofile span {display:none;}
#profile #header .mainContent p {
	font-size: 1.4em;
}




#profile #header .sidebar2 ul {
/*	margin-left: 239px;
	padding-left: 10px;*/
}
#profile #header .sidebar2 ul li {
	color: #eb2a2e;
	font-size: 1.2em;
	padding-left: 40px;
	height: 35px;
	padding-top: 9px;
	font-weight: bold;
}
#profile #header .sidebar2 ul li a {
	color: #eb2a2e;
	text-decoration: none;
}
#profile #header .sidebar2 ul li a:hover {
	text-decoration: underline;
}
#profile #header .sidebar2 ul li.blank,
#profile #header .sidebar2 ul li.new {
	height: 50px;
}
#profile #header .sidebar2 ul li {
	background: transparent url(../images/buttons/tick-off-products.gif) no-repeat;
}
#profile #header .sidebar2 ul li:hover {
	background: transparent url(../images/buttons/tick-on-products.gif) no-repeat;
}
#profile #header .sidebar2 ul li.inactive,
#profile #header .sidebar2 ul li.inactive a {
	color: #ccc;
}
#profile #header .sidebar2 ul li.inactive {
	background: transparent url(../images/buttons/tick-off-products-inactive.gif) no-repeat;
}
#profile #header .sidebar2 ul li.inactive:hover {
	background: transparent url(../images/buttons/tick-off-products-inactive.gif) no-repeat;
}




#profile #items { 
	position: relative;
	width: 706px;
	text-align: left;
	height: 531px;
}
#profile #items .sidebar1 {
	position: absolute;
	top: 0;
	left: 0;
	width: 242px;
	height: 531px;
	padding: 0;
	background: #fff url(../images/profile/bg-sidebar1.gif) no-repeat;
}
#profile #items .sidebar2 {
	position: absolute;
	top: 0;
	right: 0;
	width: 239px;
	height: 531px;
	padding: 0 0 0 0;
	background: #fff url(../images/profile/bg-sidebar2.gif) no-repeat;
}
#profile #items .middlebar { 
	height: 531px;
	margin: 0 242px 0 239px;
	padding: 0 0 0 0;
}
#profile #items .middlebar h1.galleryitems {
	width: 122px;
	height: 47px;
	margin: 0 0 0 18px;
	background: transparent url(../images/profile/gallery-items.gif) no-repeat;
}
#profile #items .middlebar h1.galleryitems span {display:none;}
#profile #items .sidebar1 h1.projects {
	width: 77px;
	height: 47px;
	margin: 0 0 0 32px;
	background: transparent url(../images/profile/projects.gif) no-repeat;
}
#profile #items .sidebar1 h1.projects span {display:none;}
#profile #items .sidebar2 h1.showandtell {
	width: 113px;
	height: 47px;
	margin: 0 0 0 29px;
	background: transparent url(../images/profile/show-and-tell.gif) no-repeat;
}
#profile #items .sidebar2 h1.showandtell span {display:none;}




#scroll-container-gallery {
	position: relative;
	height: 460px;
	margin: 0 0 0 15px;
}
#scroll-container-projects {
	position: relative;
	height: 460px;
	margin: 0 0 0 20px;
}
#scroll-container-showtell {
	position: relative;
	height: 460px;
	margin: 0 0 0 20px;
}
.content {
	position: absolute;
	top: 0;
	left: 0;
	width: 167px;
	clip: rect(0px, 167px, 430px, 0px);
	overflow: hidden;
}
.content p:first-child {
	margin-top: 0;
}
.track {
	position: absolute;
	left: 171px;
	top: 15px;
	width: 23px;
	height: 415px;
	background: #fff url(../images/profile/track.gif) repeat-y;
}
.handle {
	position: absolute;
	left: 0;
	top: 0;
	width: 23px;
	height: 30px;
	background: #fff url(../images/profile/handle.gif) no-repeat;
	cursor: hand;
	cursor: pointer;
}
.button-up {
	position: absolute;
	top: 0;
	left: 171px;
	width: 23px;
	height: 20px;
	background: #fff url(../images/profile/button-up.gif) no-repeat;
	cursor: hand;
	cursor: pointer;
}
.button-down {
	position: absolute;
	top: 430px;
	left: 171px;
	width: 23px;
	height: 21px;
	background: #fff url(../images/profile/button-down.gif) no-repeat;
	cursor: hand;
	cursor: pointer;
}


/* Image Frame */
#profile #items .imageframe {
	clear: both;
}
#profile #items .imageframe .image {
	width: 164px;
	height: 180px;
	background: transparent url(../images/products/border.gif) no-repeat;
	text-align: center;
}
#profile #items .imageframe .image img {
	margin: 11px 8px 0 8px;
}
#profile #items h2 {
	font-size: 1.4em;
	width: 157px;
	background: #fff url(../images/icons/information-4.gif) no-repeat;
	height: 35px;
	padding-left: 30px;
}
#profile #items h2 a {
	color: #000;
	text-decoration: none;
}
#profile #items h2 a:hover {
	text-decoration: underline;
}





/* RIOT MAIL */

#profile #header .emailcol {
	position: absolute;
	top: 0;
	left: 0;
	width: 255px;
	padding: 0;
}
#profile #header .emailcol h1.riotmail {
	width: 253px;
	height: 149px;
	margin: 0;
	background: transparent url(../images/email/riot-mail.gif) no-repeat;
}
#profile #header .emailcol h1.riotmail span {display:none;}
#profile #header .mailContent { 
	width: 300px;
	margin: 0 250px 0 350px;
	padding: 35px 0 0 5px;
}
#profile #emailcontent {
	clear: both;
}
table.pad {
	font-size: 1.1em;
}
table.pad th,
table.pad td {
	padding: 5px;
	vertical-align: top;
}
table.pad th {
	font-weight: bold;
	text-align: right;
}








/* RIOT CHAT */
#chat {
	width: 420px;
	height: 500px;
	background-color: #fff;
}
#chat #headerchat {
	width: 420px;
	text-align: left;
	height: 100px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #e0e0e0;
	background: url(../images/chat/riot-chat.gif) no-repeat;
}
#chat #headerchat .pic {
	position: absolute;
	margin: 30px 0 0 155px;
}
#chat #headerchat .name {
	position: absolute;
	margin: 60px 0 0 230px;
	font-size: 1.4em;
	color: #0055a5;
	font-weight: bold;
}


#scroll-container-chat {
	width: 420px;
	height: 310px;
	margin: 0;
}
.content-chat {
	position: absolute;
	top: 105px;
	left: 0;
	width: 380px;
	padding: 0 10px 0 10px;
	clip: rect(0px, 380px, 360px, 0px);
	overflow: hidden;
}
.content-chat p:first-child {
	margin-top: 0;
}
.track-chat {
	position: absolute;
	left: 390px;
	top: 130px;
	width: 23px;
	height: 330px;
	background: #fff url(../images/profile/track.gif) repeat-y;
}
.handle-chat {
	width: 23px;
	height: 30px;
	background: #fff url(../images/profile/handle.gif) no-repeat;
	cursor: hand;
	cursor: pointer;
}
.button-up-chat {
	position: absolute;
	top: 110px;
	left: 390px;
	width: 23px;
	height: 20px;
	background: #fff url(../images/profile/button-up.gif) no-repeat;
	cursor: hand;
	cursor: pointer;
}
.button-down-chat {
	position: absolute;
	top: 460px;
	left: 390px;
	width: 23px;
	height: 21px;
	background: #fff url(../images/profile/button-down.gif) no-repeat;
	cursor: hand;
	cursor: pointer;
}
#scroll-container-chat table td {
	vertical-align: top;
	padding: 5px;
}
#scroll-container-chat table p.name {
	font-size: 1.1em;
	color: #0055a5;
	font-weight: bold;
}
#scroll-container-chat table .time {
	color: #999;
}

#sendmessage {
	position: absolute;
	width: 385px;
	padding: 4px 0 0 35px;
	top: 485px;
	border-top-width: 2px;
	border-top-style: solid;
	border-top-color: #0055a5;
	background: #fff url(../images/chat/bot-bg.gif) no-repeat;
}
#sendmessage .message {
	width: 300px;
	height: 25px;
	font-size: 1.2em;
}
#sendmessage .send {
	font-size: 1.2em;
}