/*
	>> filename		>> screen.css
	>> project		>> looxagency.com
	>> author		>> jon leverrier
	>> url			>> www.hivecreative.net
	>> date			>> 13th July 2010
	>> version		>> 1.0.1
	>> info			>> Design concept by LDG. Development by Hive Creative.
*/


/* 
==============================================================

GENERIC

==============================================================
 */
 
 
* { margin: 0px; padding: 0px; }
img { border: 0px; }
.clear { clear: left; }


body { font-family: Arial, Helvetica, sans-serif; position: relative; text-align: left; }
#pagewidth { width: 1215px; height: 200px; }

.padding_0px35px0px0px { padding: 0px 35px 0px 0px; }


/* 
==============================================================

TEMPLATE ELEMENTS

==============================================================
 */
 
#tpl_level0, #tpl_level1 { background: url(../img/backgrounds/img_loox_splash.gif) top left no-repeat; position: relative; }
#tpl_level3 { background: url(../img/backgrounds/bg_plain.gif) top left no-repeat; position: relative; }

#tpl_level0 h1 { position: absolute; top: 293px; left: 148px; }
#tpl_level0 h1 a { display: block; width: 221px; height: 73px; }
#tpl_level0 h1 span, #tpl_level1 h1 span, #tpl_level2 h1 span, #tpl_level3 h1 span { display: none; }
#tpl_level0 p { display: none; }
#tpl_level1 ul { width: 366px; text-align: right; font-size: 14px; text-transform: uppercase; position: absolute; top: 80px; line-height: 1.4em; list-style: none; }
#tpl_level1 ul a { color: black; text-decoration: none; }
#tpl_level1 ul a:hover { color: #CCC; text-decoration: none; }

#tpl_level2 ul, #tpl_level3 ul { width: 305px; text-align: left; font-size: 11px; position: absolute; top: 258px; left: 71px; list-style: none; }
#tpl_level2 ul li, #tpl_level3 ul li { margin-bottom: 10px; }
#tpl_level3 ul li { color: #999; }
#tpl_level2 ul li span, #tpl_level3 ul li span { text-transform: uppercase; color: black; font-size: 14px; font-weight: bold; }
#tpl_level2 ul li a, #tpl_level3 ul li a { text-decoration: none; color: #999; font-weight: normal; }
#tpl_level2 ul li a:hover, #tpl_level3 ul li a:hover { text-decoration: none; color: #CCC; }
#tpl_level2 ul li a:hover span, #tpl_level3 ul li a:hover span { color: #CCC; }
#tpl_level2 h1 a, #tpl_level3 h1 a { display: block; width: 136px; height: 46px; top: 71px; left: 71px; position: absolute; }


#tpl_static { width: 537px; position: absolute; top: 80px; left: 437px; }
#tpl_static .col1 { width: 265px; background: white; float: left; }
#tpl_static .col2 { width: 265px; background: white; float: left; }

#tpl_level3 #tpl_static { width: 850px; position: absolute; top: 175px; left: 366px; }
#tpl_level3 #tpl_static .col2 { background: black; text-align: center; margin: 0px; padding: 0px; line-height: 0px; }
#tpl_level3 #cta { width: 136px; position: absolute; top: 319px; left: 71px; }
#tpl_level3 #cta p { margin-bottom: 6px; float: left; }
#tpl_level3 .pagination a.left { width: 26px; position: absolute; top: 0px; left: -45px; }
#tpl_level3 .pagination a.right { width: 26px; position: absolute; top: 0px; right: -45px; }


#but_previous { background: url(../img/buttons/but_previous_arrow.gif) no-repeat; width: 24px; height: 24px; position: absolute; top: 175px; left: 71px; }
#but_previous a { display: block; height: 24px; width: 24px; }
#but_previous span { display: none; }


/* 
==============================================================

MANAGER STYLES

==============================================================
 */

#tpl_static h1 { font-size: 14px; text-transform: uppercase; margin-bottom: 10px; }
#wysiwyg p, #form_generic p { font-size: 11px; line-height: 1.2em; margin-bottom: 10px; display: block; }
#wysiwyg p a { border-bottom: 1px dotted #CCC; text-decoration: none; color: #000; }
#wysiwyg p a:hover { border-bottom: 1px dotted #CCC; color: #CCC; }

#form_generic label { font-size: 11px; line-height: 1.2em; margin-bottom: 4px; display: block; }
#form_generic dd { margin-bottom: 10px; }




/* 
==============================================================

FOOTER STYLES

==============================================================
 */
 
.credit { font-size: 11px; margin-top: 20px; }
.credit a { border-bottom: 1px dotted #CCC; text-decoration: none; color: #000; }
.credit a:hover { border-bottom: 1px dotted #CCC; color: #CCC; }
 
 
/* 
==============================================================

EXTERNAL JAVASCRIPT

==============================================================
 */
 
 .scrollable { position:relative; overflow:hidden; width: 850px; height:543px; float:left; }
 .scrollable .items { width:20000em; position:absolute; clear:both; }
 .items p { float:left; width: 850px; }
 .scrollable img { float:left; background-color:#fff; width:850px; height:543px; }
 .scrollable .active { position:relative; cursor:default; }
 
a.disabled { visibility:hidden !important; }
a.browse { display: block; height: 26px; width: 26px; cursor:pointer; font-size:1px; }

a.right { background: url(../img/buttons/but_next_arrow.gif) no-repeat; height: 26px; width: 26px; display: block; }
a.right:hover { }
a.right:active { } 


/* left */
a.left	{ background: url(../img/buttons/but_previous_arrow.gif) no-repeat; height: 26px; width: 26px; display: block; } 
a.left:hover { }
a.left:active { }