/* 	----------------------------------------
	------- CSS for Sackcast Chatbox ------- 
	--------- (c) Zac Colley 2009 ---------- 
	---------------------------------------- */
	
/* -----------------------------------------
	------ Stylings for .../index.php ------
	---------------------------------------- */	
	
	       /* Whole site stylings */

body /* Background Colour and Basic Fonts */
{
background-color: #d2edee;
font-family: "Century Gothic",sans;
color: #ffffff;
font-weight: bold;
}

#logo /* Align logo to the middle */
{
top: 2px;
}

#close /* Close image top right */
{
position: absolute;
right: 0px;
top: 0px;
}

#border /* Border for different sections */
{
background-color: #88aec4;
width:90%;
padding:10px;
border: 5px solid #ffffff;
/* Curved edges */
-moz-border-radius:8px;
-webkit-border-radius:8px;
-opera-border-radius:8px;
-khtml-border-radius:8px;
border-radius:8px;
margin: auto;
margin-bottom:1.5em; /* Drop shadow */
-khtml-box-shadow:rgba(0,0,0,0.5) 0px 0px 24px;
-moz-box-shadow:rgba(0,0,0,0.5) 0px 0px 24px;
box-shadow:rgba(0,0,0,0.5) 0px 0px 24px;
}



#chat /* Chat stylings */
{
background-color: #99d3e9;
width:90%;
padding:10px;
border: 5px solid #ffffff;
/* Curved edges */
-moz-border-radius:8px;
-webkit-border-radius:8px;
-opera-border-radius:8px;
-khtml-border-radius:8px;
border-radius:8px;
margin: auto;
margin-bottom:1.5em; /* Drop shadow */
-khtml-box-shadow:rgba(0,0,0,0.5) 0px 0px 24px;
-moz-box-shadow:rgba(0,0,0,0.5) 0px 0px 24px;
box-shadow:rgba(0,0,0,0.5) 0px 0px 24px;
}

hr /* Horizontal rule styling for the chat(The big brown line) */
{
border: 0;
color: #77513b;
background-color: #77513b;
height: 1px;
}

form#login /* Basic <form> stylings */
{ 
font-family:"Century Gothic",sans;
font-weight: bold;
font-size: 15px;
margin: auto;
width: 90%;
}

input /* Username input box */
{
background-color: #d2edee;
font-family:"Century Gothic",sans;
font-weight: bold;
color: #77513b;
margin-left:5px;
margin-right:5px;
border: 2px solid #cccccc;  
}

#login .password /* Password input box */
{ 
background-color: #d2edee;
font-family:"Century Gothic",sans;
font-weight: bold;
color: #77513b;
margin-left:5px;
margin-right:5px;
border: 2px solid #cccccc; 
}
/* Links stylings */
a:link { text-decoration: none; color: #77513b; } /* Basic link */
a:visited { text-decoration: none; color: #77513b; } /*Visited link*/
a:hover { background: white; } /* Hover over link */