/* GLOBAL RESET
------------------------------------------------------------------*/
html,body,div,dl,dt,dd,ul,ol,li,pre,form,fieldset,input,blockquote,table,th,td { margin: 0; padding: 0; }
table { border-collapse: collapse; border-spacing: 0; }
fieldset,img,abbr { border: 0; }
address,caption,cite,code,dfn,th,var { font-style: normal; font-weight: normal; }
ul { list-style: none; }
caption,th { text-align: left; }
h1,h2,h3,h4,h5,h6,p,address { font-size: 1.0em; margin: 15px 0; padding: 0; }
.hide { display: none; }

a img, :link img, :visited img { border: 0; }
a, a:link, a:visited { text-decoration: underline; color: #6b3b05; }
a:hover { color: #cc0000; background-color: transparent; }

.hide{ display: none; }

/* HEADINGS
------------------------------------------------------------------*/
h1, h2, h3, h4, h5, h6{ margin: 15px 0; padding: 0; color: #333; font-weight: normal; }
h2{ font-size: 1.3em; }
h3{ font-size: 1.2em; margin-bottom: 0; }
h4{ font-size: 1.1em; }

/* LISTS
------------------------------------------------------------------*/

#PageContent ul{ margin-left: 2em; list-style: disc;}
#GenericContent ol{ margin-left: 2.5em; }


/* MAIN STRUCTURE
------------------------------------------------------------------*/
html, body{
	background: #fff;
	color: #333;
	min-height: 100%;
	height: auto !important;
	height: 100%;
}

body {
	font-size: 62.5%;
	text-align: center;
}

#Container {
	width: 960px;
	margin: 0 auto 500px auto;
	position: relative;
	font: 1.2em/160% Helvetica, Arial, sans-serif;
}

#Header {
	position: relative;
	width: 960px;
	height: 120px;
	margin: 0 auto;
	text-align: left;
}
#PageBody{
	width: 960px;
	color: #333;
	border-top: solid 1px #a3d8f5;
	position: relative;
}

#PageContent {
	float: right;
	padding: 0;
	text-align: left;
	width: 715px;
	position: relative;
}

#SideCol {
	width: 225px;
	float: left;
	padding: 0;
	color: #000;
	text-align: left;
}

#Footer {
	width: 960px;
	padding: 3px 0 100px 0;
	margin: 0 auto;
	position: relative;
	text-align: left;
	clear: both;
	overflow: hidden;
	border-top: 1px solid #A3D8F5;
}

/* HEAD
------------------------------------------------------------------*/
#Header h1 a
{ width: 140px; height: 31px; overflow: hidden; position: absolute; top: 20px; left: 0; background: transparent url(../Images/thetribe-logo.png) no-repeat 0 0; text-indent: -9999px; }
#Header p#Slogan
{ position: absolute; right: 0; top: 20px; width: 217px; height: 35px; color: #333333; text-align: right; background: url(../Images/better-work-nicer-people.png) 0 0; line-height: 1500%; overflow: hidden; margin: 0; }

/* SITEMAP
------------------------------------------------------------------*/
#Footer a, #Footer a:visited
{ color: #572600; text-decoration: none; }
#Footer a:hover
{ color: #A3D8F5; }

#Footer .FooterContent
{ border-top: 1px solid #a3d8f5; display: none; }
#Footer .SiteMap
{ width: 224px; float: left; color: #333333; font-size: 1em; padding-top: 20px; margin: 0 20px 20px 0; }
#Footer #last
{ margin: 0 0 20px 0; }
#Footer .SiteMap h2
{ color: #333333; font-size: 1.2em; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; margin: 0 0 3px 0;  }
#Footer .SiteMap ul
{ padding: 0px 0px 3px 0px; margin: 0; }
#Footer .SiteMap ul li a
{ color: #572600; text-decoration: none; display: block; padding-left: 0; border-bottom: 1px dashed #ccc; }
#Footer .SiteMap ul li li a
{ padding-left: 15px; }
#Footer .SiteMap ul li a:hover
{ color: #A3D8F5; }

#Footer .toggle
{ cursor: pointer; float: right; margin-top: -35px; }
#Footer #Copy
{ color: #333333; font-size: .9em; margin: 0; padding: 15px 0; width: 100%; border-top: 3px solid #A3D8F5; }



/* MAIN MENU
------------------------------------------------------------------*/
#Menu1
{ font: bold 1.3em/130%  Arial, Helvetica, sans-serif; text-transform: none; position: absolute; top: 90px; left: 0; }
#Menu1 li 
{ padding: 0; margin: 0; display: inline; }
#Menu1 li a 
{ display: block; float: left; text-decoration: none; margin: 0 3em 0 0; color: #572600; }
#Menu1 li a:hover 
{ background: #A3D8F5; color: #fff; }
#Menu1 li a.current
{ color: #A3D8F5; background: #fff; }

/* SUBMENU
------------------------------------------------------------------*/
#Menu2 
{ margin: 12px 0; padding: 0 0 12px 0; color: #CCCCCC; }
#Menu2 li
{ color: #333333; list-style: none; padding: 0; margin: 0; }
#Menu2 li a, #Menu2 li a:visited 
{ text-decoration: none; display: block; color: #333333; width: 225px; list-style: none; padding: 3px 0; margin: 0; display: block; font-size: 1.3em; border-bottom: 1px solid #E4E4E4; }
#Menu2 li a:hover
{ color: #fff; background: #a3d8f5; }
#Menu2 li a.current, #Menu2 li a:visited.current, #Menu2 li a:hover.current
{ color: #a3d8f5; background: #fff; }

#Menu2 li ul 
{ font-weight: normal; padding: 1px 0; margin: 0;}
#Menu2 li ul li
{ padding: 0; margin: 0; }
#Menu2 ul li a, #Menu2 ul li a:visited
{ display: block; padding: 0 0 0 20px; width: 205px; margin: 0; font-size: 1em; color: #333;  }
#Menu2 li ul li a:hover
{ color: #fff; background: #a3d8f5;}
#Menu2 li ul li a.current, #Menu2 li ul li a:visited.current, #Menu2 li ul li a:hover.current
{ color: #a3d8f5; background: #fff; }

/* SIDE COLUMN
------------------------------------------------------------------*/
#SideCol h2{ font-size: 1.3em; }
#SideCol h3{ font-size: 1.2em; margin-bottom: 0; }
#SideCol h4{ font-size: 1.1em; }

/* HOME PAGE
------------------------------------------------------------------*/
#ImgHolder{ width: 715px; height: 369px; background: url(../Images/image-frame-2.png) 0 0 no-repeat; margin: 20px 0; position: relative; }
#ImgHolder img{ margin: 10px 0 0 10px; }
#ImgHolder #flashcontent{ margin: 0; padding: 10px; width: 694px; height: 349px; border: 1px solid #333: }

/* PORTFOLIO
------------------------------------------------------------------*/
#ImgHolder2{ width: 490px; height: 370px; background: url(../Images/image-frame-1.png) 0 0 no-repeat; margin: 20px 0; }
#ImgHolder2 img{ margin: 8px 0 0 8px; border: 1px solid #fff;}
#ImgHolder2 a img{ border: 1px solid #fff;}
#ImgHolder2 a.thumb img{ margin: 8px 0 0 8px; padding: 0; border: 1px solid #fff; }
#ImgHolder2 a:hover.thumb img{ border: 1px solid #a3d8f5; }

#ImgHolder a.thumb img{ margin:0; padding: 0; }
#ImgHolder a:hover.thumb img{ filter:alpha(opacity=60); -moz-opacity: 0.60;	opacity: 0.60; }

#ImgHolder #ad1{ position: absolute; top: 10px; left: 10px; }
#ImgHolder #ad2{ position: absolute; top: 10px; left: 360px; }
#ImgHolder #ad3{ position: absolute; top: 10px; left: 535px; }
#ImgHolder #ad4{ position: absolute; top: 246px; left: 10px; }
#ImgHolder #ad5{ position: absolute; top: 246px; left: 360px; }
#ImgHolder #ad6{ position: absolute; top: 129px; left: 535px; }

#design #ImgHolder #ad1{ position: absolute; top: 10px; left: 10px; }
#design #ImgHolder #ad2{ position: absolute; top: 10px; left: 186px; }
#design #ImgHolder #ad3{ position: absolute; top: 10px; left: 360px; }
#design #ImgHolder #ad4{ position: absolute; top: 128px; left: 186px; }
#design #ImgHolder #ad5{ position: absolute; top: 128px; left: 535px; }

#digital #ImgHolder #ad1{ position: absolute; top: 10px; left: 10px; }
#digital #ImgHolder #ad2{ position: absolute; top: 10px; left: 360px; }
#digital #ImgHolder #ad3{ position: absolute; top: 246px; left: 10px; }
#digital #ImgHolder #ad4{ position: absolute; top: 129px; left: 360px; }
#digital #ImgHolder #ad5{ position: absolute; top: 129px; left: 535px; }


#Discription { float: right; width: 210px; }
#Discription a, #Discription a:visited{ color: #6b3b05; text-decoration: none; padding: 2px; }
#Discription a:hover{ color: #6b3b05; background: #a3d8f5; }
#Discription a.current, #Discription a:visited.current, #Discription a:hover.current{ color: #a3d8f5; }
#Discription ul{ margin: 15px 0; }
#Discription ul li{ margin-left: 0; padding-left: 0; list-style: none; }

#player1{ padding: 10px 0 0 10px; margin: 0; width: 470px; }
#player2{ padding: 10px 0 0 10px; margin: 0; width: 470px; }

#ImgHolder object{ margin: 0; padding: 0; width: 694px; }
#ImgHolder2 object{ margin: 10px 0 0 10px; padding: 0; width: 470px; }

#ImgHolder2 #flashcontent{ margin: 0; padding: 10px; }

/* DIGITAL
------------------------------------------------------------------*/
#whatwedo #PageContent,
#digitalcollaboration #PageContent,
#onya #PageContent{ background: url(../Uploads/Portfolio/Digital/digital-04.png) 475px 10px no-repeat; padding-right: 285px; width: 430px; min-height: 360px; }

/* PEOPLE
------------------------------------------------------------------*/
.silhouette{ float: right; margin: 0 20px; }
h2 em{ display: block; font-size: .7em; font-weight: normal; font-style: normal; }

ul.people { position: relative; width: 960px; height: 280px; background: url(../Uploads/People/people.png) bottom left no-repeat; margin: 0; padding: 0; overflow: hidden; line-height: 5000%; }
ul.people li { display: inline; float: left; margin: 0; height: 220px; }
ul.people li a { height: 270px; display: block; text-decoration: none; margin: 0; }

ul.people #p1{ width: 90px; }
ul.people #p2{ width: 120px; }
ul.people #p3{ width: 105px; }
ul.people #p4{ width: 105px; }
ul.people #p5{ width: 105px; }
ul.people #p6{ width: 75px; }
ul.people #p7{ width: 120px; }
ul.people #p8{ width: 150px; }
ul.people #p9{ width: 90px; }

.people li a span, .people li a:visited span { position: absolute; top: 15px; left: 0; visibility: hidden; line-height: 1.1; color: #333; text-align: left; text-decoration: none; width: 400px; background: #fff;}
.people li a:hover span  { display: block; visibility: visible; text-decoration: none; }
.people li a span strong { display: block;  padding: 3px 0; font-size: 1.3em; }

h2.people{ position: absolute; top: 15px; left: 0; padding: 3px 0; font-size: 1.3em; margin: 0; font-weight: bold; line-height: 1.1; }


/* PRINCIPLES
------------------------------------------------------------------*/
#slogan3{ background: url(../Images/5-things.png) 60px 50px no-repeat; width: 650px; height: 100px; text-indent: -9999px; }
h2.big { padding: 30px 0 0 0; font-size: 3.5em;line-height: 1em; }
h2 strong{ font-size: 3em; font-weight: normal; font-style: normal; padding: 50px 0; }
p.big { padding: 20px 0; font-size: 2em; line-height: 1em; }
.pic1{ float: right; margin: 0 0 0 20px; border: 3px solid #fff; }

#principles #PageContent,
#loyalty #PageContent,
#storytelling #PageContent,
#collaboration #PageContent,
#integration #PageContent,
#integrity #PageContent{ width: 715px; height: 370px; background: url(../Images/image-frame-2.png) 0 0 no-repeat; margin: 20px 0; position: relative; }

#principles #ImgHolder{ background: none; padding: 0 300px 0 10px; width: 405px; height: 369px; margin: 0; }
#loyalty #ImgHolder{ background: url(../Uploads/Principles/loyalty.jpg) top right no-repeat; padding: 0 300px 0 10px; width: 405px; height: 369px; margin: 0; }
#storytelling #ImgHolder{ background: url(../Uploads/Principles/storytelling.jpg) top right no-repeat; padding: 0 300px 0 10px; width: 405px; height: 369px; margin: 0; }
#collaboration #ImgHolder{ background: url(../Uploads/Principles/collaboration.jpg) top right no-repeat; padding: 0 380px 0 10px; width: 325px; height: 369px; margin: 0; }
#integration #ImgHolder{ background: url(../Uploads/Principles/integration.jpg) 330px 0 no-repeat; padding: 0 300px 0 10px; width: 405px; height: 369px; margin: 0; }
#integrity #ImgHolder{ background: url(../Uploads/Principles/integrity.jpg) 360px 20px no-repeat; padding: 0 300px 0 10px; width: 405px; height: 369px; margin: 0; }

#storytelling #ImgHolder p,
#collaboration #ImgHolder p
{ margin: 0; padding: 15px; }/* firefox fix */


/* CONTACT
------------------------------------------------------------------*/
.map{ float: right; margin: 20px 0 10px 15px; }


/* REGISTRATION
------------------------------------------------------------------*/
#Register 
{ width: 480px; position: relative; text-align: left; margin: 18px 0; padding: 10px 0; background: #F6FCFE;border: 1px solid #A3D8F5;  }
#Register label 
{ float: left; display: inline; width: 100px; padding: 2px 5px; margin: 0; text-align: right; font-size: 1em; }
#Register input, #Register textarea, #Register select 
{ border: 1px solid #A3D8F5; background: #fff; color: #333; font: normal 1.2em/120% Arial,Helvetica,sans-serif; position: relative; padding: 2px; width: 300px; }
#Register select
{ width: 306px; }

#Register .checkbox
{ margin-left: 110px; width: 304px; }
#Register .checkbox p
{ display: block; overflow: auto; width: 200px; }
#Register .checkbox label 
{ float: no-float; display: block; width: auto; padding: 0px 5px; margin: 0; text-align: left; font-size: 1em; }
#Register .checkbox input
{ width: auto; float: left; border: none; margin: 2px 0 0 0; }
#Register .label
{ margin: 0 0 0 110px; padding: 0; }
#Register  .asterisk
{ margin: 0 0 0 110px; padding: 0; }

#Register .submit 
{ margin-left: 110px; background: #6b3b05; border-color: #6b3b05; border-style: double; border-width: 3px; color: #fff; cursor: pointer; width: 80px; padding: 1px;font-size: 1em; }
#Register span
{ color: #6b3b05; }

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> thickbox specific link and font settings <<<------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
#TB_window {
	font: 12px Arial, Helvetica, sans-serif;
	color: #333333;
}

#TB_window a:link {color: #fff;}
#TB_window a:visited {color: #ccc;}
#TB_window a:hover {color: #ffff00;}
#TB_window a:active {color: #fff;}
#TB_window a:focus{color: #fff;}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> thickbox settings <<<-----------------------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
#TB_overlay 
{ position: fixed; z-index: 100; top: 0px; left: 0px; height: 100%; width: 100%; }

.TB_overlayMacFFBGHack 
{background: url(macFFBgHack.png) repeat;}
.TB_overlayBG 
{ background-color: #000; filter: alpha(opacity=75); -moz-opacity: 0.75; opacity: 0.75; }

* html #TB_overlay 
{ /* ie6 hack */ position: absolute; height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px'); }

#TB_window 
{ position: fixed; background: transparent; z-index: 102; color: #000000; display: none; border: 0 solid #6b3b05; text-align: left; top: 50%; left: 50%; }

* html #TB_window 
{ /* ie6 hack */ position: absolute; margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px'); }

#TB_window img#TB_Image 
{ display: block; margin: 0; }

#TB_caption
{ margin: 7px 30px 10px 0; padding: 5px; float: left; color: #fff; background: transparent; font-weight: bold; line-height: 1; text-indent: -99999px; }
#TB_secondLine { font: 11px Arial, Helvetica, sans-serif; color: #fff; text-indent: 0; }

#TB_closeWindow
{ width: 12px; height: 12px; padding: 11px 0; float: right; color: #fff; line-height: 5000%; overflow: hidden; }
#TB_closeWindow a
{ background: url(../Images/close.png) 0 0 no-repeat; display: block; width: 12px; height: 12px; }

#TB_closeAjaxWindow
{ padding: 7px 0 5px 0; margin-bottom: 1px; text-align: right; float: right; line-height: 5000%; overflow: hidden; width: 12px; height: 12px;}
#TB_closeAjaxWindow a
{ background: url(../Images/close.png) 0 0 no-repeat; display: block; width: 12px; height: 12px; overflow: hidden;  }

#TB_ajaxWindowTitle
{ float: left; padding: 7px 0 5px 10px; margin-bottom: 1px; }

#TB_title
{ background-color: transparent; height: 27px; }

#TB_ajaxContent
{ clear: both; padding: 2px 15px 15px 15px; overflow: auto; text-align: left; line-height: 1.4em; }

#TB_ajaxContent.TB_modal
{ padding: 15px; }

#TB_ajaxContent p
{ padding: 5px 0px 5px 0px; }

#TB_load
{ position: fixed; display: none; height: 13px; width: 208px; z-index: 103; top: 50%; left: 50%; margin: -6px 0 0 -104px; /* -height/2 0 0 -width/2 *//* -height/2 0 0 -width/2 */ }

* html #TB_load 
{ /* ie6 hack */ position: absolute; margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px'); }

#TB_HideSelect
{ z-index: 99; position: fixed; top: 0; left: 0; background-color: #fff; border: none; filter: alpha(opacity=0); -moz-opacity: 0; opacity: 0; height: 100%; width: 100%; }

* html #TB_HideSelect 
{ /* ie6 hack */ position: absolute; height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px'); }

#TB_iframeContent
{ clear: both; border: none; margin-bottom: -1px; margin-top: 1px; _margin-bottom: 1px; }


/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> Lightbox <<<-----------------------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/


#jquery-overlay {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
}
#jquery-lightbox {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
}
#jquery-lightbox a img { border: none; }
#lightbox-container-image-box {
	position: relative;
	background-color: transparent;
	width: 250px;
	height: 250px;
	margin: 0 auto;
}
#lightbox-container-image { padding: 10px; }
#lightbox-loading {
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
}
#lightbox-nav {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
}
#lightbox-container-image-box > #lightbox-nav { left: 0; }
#lightbox-nav a { outline: none;}
#lightbox-nav-btnPrev, #lightbox-nav-btnNext {
	width: 49%;
	height: 100%;
	zoom: 1;
	display: block;
}
#lightbox-nav-btnPrev { 
	left: 0; 
	float: left;
}
#lightbox-nav-btnNext { 
	right: 0; 
	float: right;
}
#lightbox-container-image-data-box {
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: transparent;
	margin: 0 auto;
	line-height: 1.4em;
	overflow: auto;
	width: 100%;
	padding: 0 10px 0;
}
#lightbox-container-image-data {
	padding: 0 10px; 
	color: #666; 
}
#lightbox-container-image-data #lightbox-image-details { 
	width: 70%; 
	float: left; 
	text-align: left; 
}	
#lightbox-image-details-caption { font-weight: bold; }
#lightbox-image-details-currentNumber {
	display: block; 
	clear: left; 
	padding-bottom: 1.0em;	
}			
#lightbox-secNav-btnClose {
	width: 12px; 
	float: right;
	padding-bottom: 0.7em;	
}