/* 
LOOKSEECITY STYLE SHEET: SCREEN STYLES
Style sheet by Rupert Sliwa
[ www.sliwacreative.com ]
----------------------------------------------- */

body {color:#fff; margin:0; padding:0; text-align:left; background:#000 url(/lookseecity/graphics/bg_gradient.jpg) top repeat-x; font-family:Arial, Helvetica, sans-serif}
ul {list-style-type:disc; padding-left:10px; margin:0 0 15px 7px; font-size:80%}
ul li {margin-bottom:8px}
ol {list-style-type:decimal; padding-left:10px; margin:0 0 15px 7px; font-size:80%}
table, tr, td {margin:0; padding:0; border:0}
img {border:0}
p.error_message {
	font-weight: bold;
	color: #f48534;
	background: #482227;
	border: 1px dotted #f48534;
	text-align: left;
	padding: 2px 20px;
	font-variant: small-caps;
	width: auto;
	display: inline-block;
}


/* General links
----------------------------------------------- */

a, a:link, a:visited {color:#f48534; text-decoration:none; font-weight:normal}
a:hover, a:active {color:#f48534; text-decoration:underline; font-weight:normal}


/* Headings
----------------------------------------------- */

h1 {font-size:170%; font-weight:normal; color:#fff; margin:0}
h2 {font-size:140%; font-weight:bold; color:#fff; margin:0; padding-bottom:15px}
h3 {font-size:90%; font-weight:bold; color:#fff; margin:0; padding-bottom:15px; line-height:20px}
h3 a, h3 a:link, h3 a:visited, h3 a:hover, h3 a:active {
	font-size:120%;
	font-weight:bold;
	color:#fff;
	margin: 0;
	padding-bottom: 0px;
	text-decoration:none;
	line-height: normal;
}
h3 a:hover, h3 a:active {color:#f48534;}


/* Text
----------------------------------------------- */

p {font-size:80%; line-height:18px; margin:0 0 15px 0; padding:0; display:block}

.large {font-size:90%; line-height:20px}

.orange {color:#da641e}


/* Masthead
----------------------------------------------- */

#masthead {padding-top:17px}

#masthead .home {background:transparent url(/lookseecity/graphics/masthead_bar_home.jpg) top left no-repeat; height:120px}
#masthead .home h1 {font-size:140%; font-weight:bold; color:#fff; margin:0}
#masthead .home .strap {float:right; text-align:right; padding:44px 39px 0 0}

#masthead .city {background:transparent url(/lookseecity/graphics/masthead_bar_city.jpg) top left no-repeat; height:68px}
#masthead .video {background:transparent url(/lookseecity/graphics/masthead_bar_topnav.jpg) top left no-repeat; height:68px}

#masthead .city .left, #masthead .video .left {padding:15px 0 0 39px; float:left}
#masthead .city .right, #masthead .video .right {padding:20px 39px 0 0; float:right}

#masthead .homeLink {float:left; margin:30px 0 0 30px}


/* Top Navigation
----------------------------------------------- */

#topnav {background:transparent url(/lookseecity/graphics/topnav_bg_mid.gif) left repeat-y; font-size:90%; color:#666; padding:0 39px 0 39px}
.topnavBot {background:transparent url(/lookseecity/graphics/topnav_bg_bot.gif) bottom left no-repeat; height:11px}

#topnav a {color:#da641e; text-decoration:none; font-weight:normal}
#topnav a:hover, #topnav a:active {color:#da641e; text-decoration:underline; font-weight:normal}

#topnav ul {list-style-type:none; margin:0; padding:0}
#topnav ul li {float:left; width:auto; margin:0 12px 0 0}
#topnav ul .arrow {background:#fff url(/lookseecity/graphics/topnav_divider.png) top left no-repeat; padding-left:20px}


/* General layout
----------------------------------------------- */

.clearboth {clear:both; height:1px; overflow:hidden; font-size:1px; line-height:0}
.hidden {display:none}

#container {margin:0 auto; width:958px}
.bgHome {background:transparent url(/lookseecity/graphics/bg_city.jpg) top center no-repeat; margin:0}

#bodyMain {text-align:left; width:940px; margin:30px 9px 0 9px}

#twoColLayout .left {width:480px; float:left}
#twoColLayout .right {width:420px; margin-left:40px; float:left}
#twoColLayout .description {padding:30px 10px 30px 10px}
#twoColLayout .textonly {padding:25px 30px 10px 30px}

#threeColLayout .left {width:230px; float:left}
#threeColLayout .middle {width:400px; margin-left:40px; float:left}
#threeColLayout .right {width:230px; margin-left:40px; float:left}

.floatLeft {float:left}
.floatRight {float:right}


/* List styles
----------------------------------------------- */

.web {list-style-image:url(/lookseecity/graphics/icon_website.png); margin-left:5px; vertical-align:middle}
.play {list-style-image:url(/lookseecity/graphics/icon_play.png); margin-left:5px; vertical-align:middle}
.playing {list-style-image:url(/lookseecity/graphics/icon_play_grey.png); margin-left:5px; vertical-align:middle; color:#bbb}
.forum {list-style-image:url(/lookseecity/graphics/icon_forum.png); margin-left:5px; vertical-align:middle}


/* Panels and Frames
----------------------------------------------- */

.panelA {width:190px}
.frameA {background:transparent url(/lookseecity/graphics/frame_190_top.gif) top left no-repeat; padding:25px 30px 0 30px}
.frameABot {background:transparent url(/lookseecity/graphics/frame_190_bot.gif) bottom left no-repeat; margin-bottom:20px; height:10px; clear:both}

.panelB {width:230px}
.panelB .thumb {width:60px; margin-bottom:20px; float:left}
.panelB .text {width:100px; margin:5px 0 10px 10px; float:left; font-size:80%}
.frameB {background:transparent url(/lookseecity/graphics/frame_230_top.gif) top left no-repeat; padding:25px 30px 0 30px}
.frameBBot {background:transparent url(/lookseecity/graphics/frame_230_bot.gif) bottom left no-repeat; margin-bottom:20px; height:10px; clear:both}

.panelC {width:400px}
.frameC {background:transparent url(/lookseecity/graphics/frame_400_top.gif) top left no-repeat; padding:25px 30px 0 30px}
.frameCBot {background:transparent url(/lookseecity/graphics/frame_400_bot.gif) bottom left no-repeat; margin-bottom:20px; height:25px; clear:both}

.panelD {width:420px}
.panelD .thumb {width:170px; margin-bottom:20px; float:left}
.panelD .text {width:170px; margin:5px 0 10px 20px; float:left}
.frameD {background:transparent url(/lookseecity/graphics/frame_420_top.gif) top left no-repeat; padding:30px 30px 0 30px}
.frameDBot {background:transparent url(/lookseecity/graphics/frame_420_bot.gif) bottom left no-repeat; margin-bottom:20px; height:20px; clear:both}

.panelE {width:600px}
.frameE, .frameE_hover {
	background:url(/lookseecity/graphics/frame_600_top.gif) no-repeat left top;
	padding:25px 30px 0 30px;
	cursor: auto;
}
.frameE_hover {
	cursor: pointer;
}
.frameEBot {background:transparent url(/lookseecity/graphics/frame_600_bot.gif) bottom left no-repeat; margin-bottom:20px; height:25px; clear:both}


/* Forms
----------------------------------------------- */

form {margin:0}

.dropDown {font:80% Arial, Helvetica, sans-serif; padding:0; display:block}

label {font:80% Arial, Helvetica, sans-serif; display:block; margin-bottom:5px; color:#ccc}
.formField {border:1px solid #999; background:#fff; margin-bottom:10px; font-size:80%; width:340px; display:block}
.formArea {border:1px solid #999; background:#fff; font:80% Arial, Helvetica, sans-serif; width:340px; display:block}
.formSend {border:2px solid #999; background:#da641e; color:#fff; padding:5px; font-size:80%; font-weight:bold}

span.login_forgotten {
	font:80% Arial, Helvetica, sans-serif;
	color:#ccc;
	position: relative;
	top: -8px;
	left: 60px;
}


/* Footer
----------------------------------------------- */

#footer {padding:20px 9px 20px 9px}
#footer {font-size:70%; line-height:16px; color:#666; text-align:left; margin:0}
#footer a {color:#da641e; text-decoration:underline; font-weight:normal}
#footer a:hover, #footer a:active {color:#fff; text-decoration:underline; font-weight:normal}