@import url("reset.css");
@import url("typography.css");
@import url("grid.css");

body { margin-top: 0; }
a:active { outline: none; }


#mastahead { background: #000; height: 55px; position: relative; }
#logo { line-height: 55px; position: absolute; left: 50%; margin-left: -480px; top: 9px; }
#logo img { float: none; margin: 0; }
#logo a:hover img { opacity: 0.8; -moz-opacity: 0.8; -webkit-opacity: 0.8; -khtml-opacity: 0.8; filter:alpha(opacity=80); }

#top-description { position: absolute; right: 50%; margin-right: -460px; padding-left: 20px; width: 760px; border-left: 1px solid #1f1f1f; height: 45px; top: 5px; }
#top-description h1 { font-size: 1.5em; line-height: 40px; margin-right: 20px; position: absolute; left: 50%; margin-left: -370px;}
#top-description h1 a { color: #fff; text-decoration: none; }
#top-description h1 a:hover { color: #ccc; }

#top-description .quiet { font-size: 0.9167em; line-height: 1.6364em; margin-top: 3px; height: 45px; width: 500px; position: absolute; left: 50%; margin-left: -180px; }

#sign-up { position: absolute; right: 0px; top: 1px;}
#sign-up a { width: 77px; height: 77px; text-indent: -999999px; display: block; overflow: hidden; background: url(../images/sign-up.gif);}
#sign-up a:hover { background-position: bottom left; }

#body { width: 960px; margin: 0 auto; margin-top: 2.5em;}
#movie { position: relative; height: 565px; margin-bottom: 0.75em; margin-left: -20px; }
#embed { width: 670px; height: 275px; position: absolute; top: 0; left: 5px;}
#movie #sign { position: absolute; left: 0; top: 275px; }
#message { background: transparent; width: 440px; height: 240px; position: absolute; top: 280px; left: 135px; font-family: "Chalkboard", "Comic Sans MS"; font-size: 2.75em; color: #151515; overflow: hidden; font-weight: bold; text-transform: uppercase; font-style: italic;}


/* 290+275 */

#friends-form { background: url(../images/form-bg.jpg) top left no-repeat; display: block; float: left; color: #8c8c8c; position: absolute; left: 675px; top: 0; }
#friends-form { padding: 30px 20px; padding-right: 0; padding-top: 40px; width: 260px; height: 481px; }
#friends-form strong { color: #fff; font-weight: normal; font-size: 1.167em; display: block;}
#form-overflow { overflow-y: auto; height: 480px; overflow-x: hidden; position: relative;}
#friends-form hr { color: #000; border: 0px solid #000; background: #000; width: 200px; }
#friends-form legend { color: #fff; font-size: 1.167em; margin-bottom: 0.643em;}
#friends-form label { font-size: 0.9167em; width: 5em; display: block; float: left; clear: left; margin-right: 5px; }
#friends-form input { margin-bottom: 0.5em; width: 165px; }
#friends-form textarea { width: 230px; }

#friends-form a { color: #c5621c; text-decoration: none;}
#friends-form a span { text-decoration: underline; }
#friends-form a:hover { color: #fff; }
#friends-form a:hover span { text-decoration: none;}

#friends-form .remove-friend { position: absolute; left: 3.5em; margin-top: 3px;}
#friends-form .remove-friend a { width: 12px; height: 12px; text-indent: -9999px; display: block; background: url(../images/delete.gif); overflow: hidden;}

#friends-form button { text-indent: -99999px; width: 53px; height: 19px; position: relative; background: url(../images/send.gif); border: 0; cursor: pointer; }
#friends-form button:hover { background-position: 0 33%; }
#friends-form button:active { background-position: 0 66%; top: 1px; left: 1px;}
#friends-form button:disabled,
#friends-form button.disabled { background-position: 0 100%; }

#friends .friend { margin-bottom: 0.5em;}

#control-friends-btns { text-align: right; width: 230px; font-size: 0.8334em;}
#remove-friend { margin-right: 10px; }
 
/*#mood-slider { width: 160px; padding-left: 10px; padding-right: 17px; height: 52px; background: url(../images/mood.gif); margin: 0 auto; position: relative; clear: left; }*/
#mood-slider { width: 187px; height: 52px; background: url(../images/mood.gif); position: relative; clear: left; overflow: visible; position: relative; margin: 0 auto; }
* html #mood-slider { padding: 0; width: 187px; position: static;}
#mood-slider .ui-slider-handle { width: 11px; height: 11px; background: url(../images/slider-handle.png); position: relative; display: block; outline: none; top: 45px; margin-left: -4px;}
* html #mood-slider .ui-slider-handle { background: url(../images/ie-slider-handle.gif); position: relative; }


#friends-form .small { width: 230px; }
#friends-form .submit { width: 230px; font-size: 0.9167em; }

#small-info { margin-left: 60px; position: relative; top: -25px; }

#movie-embed { height: 540px; position: relative; }
a#send-message { position: absolute; bottom: -20px; right: 20px; display: block; text-indent: -99999px; height: 150px; width: 149px; background: url(../images/skicka-knapp.png) top left; cursor: pointer; overflow: hidden; }
a:hover#send-message { background-position: bottom left; }

* html a#send-message { background: url(../images/ie-skicka-knapp.gif) top left;}


#slide { height: 580px; overflow-y: hidden; }
* html #slide { overflow: hidden;}
