@charset "UTF-8";

/**
 * Sabotage Project Tool
 *
 * @copyright       Copyright 2009, PEGAS systemhaus gmbh
 *
 * @link            http://www.sabotage-films.com/project-tool/
 * @package         
 * @version         1.01
 * @revision        $Revision: 11 $
 * @lastmodified    $Date: 2009-08-13 $
 */

@media all
{

	
body { 
	margin:0; 
	padding:0; 
	background: url('/media/background/pt_main.jpg');
	font-family: Verdana, Helvetica, Arial, sans-serif;
    font-size: 11px; 
    font-weight: normal; 
    color: #FFFFFF; 
    text-decoration: none; 
    background-color:#000000; } 

table,td,tr { 
	margin:0; 
	padding:0; } 

a:link,
a:active,
a:visited { 
	color:#FFFFFF; 
	font-weight:normal; 
	text-decoration:none; 
	line-height:20px; }
a:hover { 
	color:#E40003; 
	font-size:11px;
	font-weight:normal; 
	line-height: 20px;
    text-decoration:none;}
    
td { 
	vertical-align:bottom; }

.folder_back { /* obsolete */}


/**
 * repeating or global elements
 * -------------------------------------------------------------------------- */

.thead {
	font-weight: bold;}
	
	/** printing out validation errors in forms **/
.errorlist { 
	background-color: #DC0000;
	color: #F1F1F1;
	font-size: 11px;
	margin-left: 20px;
	padding: 2px;
	width: 300px;}

.errorlist ul {
	margin: 0;
	padding: 0;}
.errorlist li {
	list-style-type:none;}
	
	/** colors **/
.sabo_red {
	color: #DC0000;}
.grey {
	color: #999999;}
.darkgrey {
	color: #333333;}
.white {
	color: #FFFFFF;}
	
	/* font size */
.font-size-9 {
	font-size: 9px;}	
.font-size-10 {
	font-size:10px;}
.font-size-11 {
	font-size: 11px;}
.font-size-12 {
	font-size: 12px;}
	
	/* margins */
.margin-1em {
	margin: 1em;}

	/* top + bottom */
.margin-top-5 {
	margin-top:5px;}
.margin-top-10 {
	margin-top:10px;}
.margin-bot-5 {
	margin-bottom:5px;}
.margin-bot-10 {
	margin-bottom:10px;}
.margin-bot-25 {
	margin-bottom:25px;}

	/* line-heights */
.lineheight-20 {
	line-height:20px;}
.lineheight-30 {
	line-height:30px;}

	/* clearings */
.clearBoth {
	clear:both;}
.clearLeft {
	clear:left;}
.clearRight {
	clear:right;}

	/* paddings */
.padding-5 {
	padding: 5px;}
.padding-15 {
	padding: 15px;}
	
	/* left + right */
.padding-left-5 {
	padding-left: 5px;}
.padding-left-10 {
	padding-left: 10px;}
.padding-left-15 {
    padding-left:15px;}
.padding-left-20 {
	padding-left: 20px;}
.padding-right-5 {
	padding-right: 5px;}
.padding-right-10 {
	padding-right: 10px;}
.padding-right-15 {
	padding-right: 15px;}
.padding-right-20 {
	padding-right: 20px;}
	
	/* widths */
.width-75 {
	width:75px;}
.width-100 {
	width: 100px;}
.width-105 {
	width: 105px;}
.width-125 {
	width: 125px;}
.width-150 {
	width: 150px;}
.width-180 {
	width: 180px;}
.width-200 {
	width: 200px;}
.width-250 {
	width: 250px;}
.width-300 {
	width: 300px;}
.width-670 {
	width: 670px;}
.width-690 {
	width: 690px;}
.width-700 {
	width: 700px;}

.height-20 {
	height:20px;}
	
	/* floats */
.floatLeft {
	float:left;}
.floatRight {
	float:right;}	

	/* backgrounds */
.bg25tr {
	background: transparent url('/media/img/bg_[25tr].png') repeat 0 0;}
.bg50tr {
	background: transparent url('/media/img/bg_[50tr].png') repeat 0 0;}
.bg20sand {
	background: transparent url('/media/img/bg_sand_[20tr].png') repeat 0 0;}
	
	/* cursor */
.curWait { 
	cursor: wait;}
.arrow {
	cursor: default;}
.cursor { 
	cursor:pointer;}
	
.allcaps {
	text-transform: uppercase;}
	
	
	
	
/* menu 
 * -------------------------------------------------------------------------- */
.m-left { padding-left:0.8em; padding-right:0.5em; border-right:solid 1px;
    cursor:pointer; font-size:10px; text-transform:uppercase; }
.m-left:hover { color: #E40003; border-color:#FFFFFF;}
.m-left a:link { font-size:10px;}
.m-left a:visited { font-size:10px;}
.m-left a:active { font-size:10px;}
.m-left a:hover { font-size:10px;}

/* address */
#address { padding-top:5.3em; float:left; width:380px; }
#address_logo { float:left; }
#address_contact { float:left;padding-top:1.7em; }
#address_tele { float:left;margin-top:1.5em; }


#content { margin-left:2em; font-size:12px; }
#content a:hover { font-size:12px; }
#nav { margin-left:4em; float:left; margin-top:11.9em; }


	
/**
 * tooltips when hovering a gallery
 * -------------------------------------------------------------------------- */
div.tooltip {
	/*background:transparent url(/media/project/img/tooltip/shadow_tooltip.png) no-repeat scroll 0 0;*/
	font-size:11px;
	/*height:153px;*/
	padding:10px;
	/*width:310px;*/
	background-color: #000;
	font-size:14px;
	display:none;
	color:#fff;
	z-index: 1000;
	border: 1px solid #FFF;}	

div.tooltip p {
	margin:0;
	font-size:11px;
	color:#fff;
}



/**
 * project-script: upload
 * -------------------------------------------------------------------------- */
#upload { 
	display:none; 
	/* margin:1.3em; 
	/* padding:15px 0 0 15px;
	background:transparent url('/media/img/bg_sand_[20tr].png') repeat; */}
#upload .button { 
	background-color:#777; 
	border:1px solid #F1F1F1; 
	color: #F1F1F1;}
#upload h2 { 
	margin:0; }

.uploadWindow {
	background: transparent url('/media/img/bg_sand_[20tr].png') repeat;
	border: 1px solid #333333;}
.uploadWindowCpWrap {
	height:25px;}

	
.bar {width: 300px;}
.progress {  background: #eee; border: 1px solid #222; margin-top: 20px;}
.progressBar { width: 0px; height: 24px; background: #999; }

.galSlctUpld {line-height:28px;}
.galSlctUpld select { background-color:#777; border:1px solid #F1F1F1; color:#F1F1F1; min-width:200px;}




/* pt navigation
 * -------------------------------------------------------------------------- */
#info {
	float:right; 
	width:330px; 
	margin-top: 11.4em;}




/* repeating elements
 * -------------------------------------------------------------------------- */

.padd5 { padding:5px; }




/**
 * pt_login  
 * -------------------------------------------------------------------------- */
#wrapLogin { height:50px; width:700px; padding: 10px 0;}
#content #id_username, #content #id_password { background-color:#777777;
    border:1px solid #777777; color:#FFFFFF; margin-left:15px;}
span.loginWithCookiesPal { font-size:#11px; color:#777777; clear:left;}



.nav-style { text-decoration:underline; cursor:pointer; }

.button { 
	border: solid 1px; }
.icon { 
	margin-left: 0.4em; 
	cursor:pointer; }
.hidden { 
	color: #222; }

.menu_item { 
	cursor: pointer; 
	padding-left: 0.8em;
	/*color:#DC0000;*/}
.menu_item:hover { 
	color: #E40003; 
	font-size: 12px;  
	font-weight: normal;
    text-decoration: none; }

	
/**
 * pt_archive
 * -------------------------------------------------------------------------- */
 
.projectArchiveWrap { /* carrier class !! don't touch !! */ } 

.projectArchiveWrap .h2head {
	margin:0; 
	font-size:20px;
	padding:5px 0 3px 10px;
	line-height:18px;}

/**
 * pt_table 
 * -------------------------------------------------------------------------- */
#breadWrap { 
	height:25px; 
	font-size:11px;
	/*background: transparent url('/media/img/bg_[25tr].png') repeat 0 0;*/}
	
#breadRoot { 
	padding: 5px 0 5px 10px; 
	float:left;}
    
    #breadRoot a:link,
    #breadRoot a:visited,
    #breadRoot a:active { 
    	font-size: 11px; 
    	color: #DC0000;}
    #breadRoot a:hover { 
    	font-size: 11px; 
    	color: #FFFFFF;}

#bread { 
	padding: 5px 0;
	float: left;
	line-height: 20px;}

/**
 * manipulate bread crumb appearance: pt_table.html 
 * -------------------------------------------------------------------------- */  
.breadCrumb { 
	color: #DC0000;
	border-bottom: 1px dotted #DC0000;}
.breadCrumb:hover {
	color: #FFFFFF;
	border-bottom: 1px dotted #FFFFFF;}
	
.projectTableWrap { /**/ }
	
.projectDetails { /* carrier class !! don't touch !! */ }	
	
.projectDetails .h2head {
	margin:0; 
	font-size:20px;
	padding:5px 0 3px 10px;
	line-height:18px;}
	
.projectDescription { /* project description entered via form */
	}
		
.tableListing {
	width:100%;
	/*margin-top:1.5em;*/}	
.tableListingType {
	font-weight:bold;}

.projectAreaType {
	font-weight: bold;
	color: #DC0000;
	padding-left:10px;}

	.projectAreaType img {
	   vertical-align: middle;}
	
/**
 * pt_main 
 * showing a list of selected projects
 * -------------------------------------------------------------------------- */

.projectList { /* carrier class !! don't touch !! */ }

	.projectList a:link,
	.projectList a:visited,
	.projectList a:active {
		font-weight: normal;}

	.projectList .hovTd:hover {
		background: transparent url('/media/img/bg_[25tr].png') repeat scroll 0 0;}
	
	.projectList img {
		vertical-align: middle;}


	/** position the pagination inside the control panel **/
.paginateProjects { 
	text-transform: normal; 
	text-decoration: none; 
	border: none;
    float: right; 
    color: #DC0000; 
    padding:2px 0 0 0;}


	/** project control panel **/
.projectCp {
	/*float:left;*/
	padding: 2px 0 0 5px;}
	
	.projectCp img {
		vertical-align: middle;}
	
	.projectCp a:link,
	.projectCp a:visited,
	.projectCp a:active {
	   	text-decoration: none; 
	   	border-bottom: none; 
       	text-transform: uppercase; 
       	color: #DC0000; }	
	
	.projectCp a:hover {
	   	text-decoration: none; 
	   	border-bottom: none; 
       	text-transform: uppercase; 
       	color: #FAFAFA; }		

	/* Form */
.projectFilterForm { /* carrier class !! don't touch !!*/ 
	padding: 2px 0 0 5px;}	

	.projectFilterForm select {
		background: #333 url('/media/img/bg_[50tr].png') repeat 0 0;
		color: #FFFFFF;
		border: 1px solid #777777;}
	

/**
 * pt_editproject.html
 * -------------------------------------------------------------------------- */

.projectEdit {/* no longer in use */ }
	
	.projectEdit .h2head { /* container healine */
		margin:0; 
		font-size:20px;
		line-height:30px;}


	/* dirty try to influence generated elements */
#id_project, 
#id_project_id, 
#id_sabo_user, 
#id_sabo_pwd,
#id_ext_user, 
#id_ext_pwd, 
#id_desc	{ 
	margin-left:20px; 
	width:300px;
    border:1px solid #777777; 
    background-color:#777777; 
    color:#F1F1F1;}

#id_showreel,
#id_others {
	margin-left:20px;}
	
#id_project:hover,
#id_project_id:hover,
#id_sabo_user:hover,
#id_sabo_pwd:hover,
#id_ext_user:hover, 
#id_ext_pwd:hover, 
#id_desc:hover,
	/* editproject */
.id_edtPro:hover {
	border:1px solid #F1F1F1;}

#id_project:focus,
#id_project_id:focus,
#id_sabo_user:focus,
#id_sabo_pwd:focus,
#id_ext_user:focus, 
#id_ext_pwd:focus, 
#id_desc:focus,
	/* editproject */
.id_edtPro:focus {
	color: #DC0000;
	border:1px solid #F1F1F1;
	background: #FFF;}
	
	/* back button */
.subNavBack {width:700px; text-indent:5px;}
	.subNavBack a:link {color:red;}
	.subNavBack a:visited {color:red;}
	.subNavBack a:active {color:red;}
	.subNavBack a:hover {color:red;}

.projectInfo { /* carrier class !! don't touch !! */}
	
	.projectInfo input { 
		border:1px solid #777777; 
		background-color:#777777;
    	color:#F1F1F1;}
    
	.projectInfo th { 
		text-align:left; 
		font-weight:normal;}

.projectInfoBut { /* width-100 */ }


/**
 * elements used in pt_createproject/pt_editproject
 * -------------------------------------------------------------------------- */

.projectName { /* no longer in use */ }

.projectNameFields {
	padding: 5px 0 5px 15px; 
	height: 200px;}

	.projectNameFields .button { 
		border:1px solid #F1F1F1; 
		color:#F1F1F1;
    	background:#777777;}

.projectUsers { /* carrier class !! don't touch!! */}
	
	.projectUsers input { 
		border:1px solid #777777; 
		background-color:#777777;
    	color:#F1F1F1;}
	.projectUsers .button { 
		border:1px solid #F1F1F1;}

	.projectUsers .h2head {
		margin:0; 
		font-size:20px;
		line-height:30px;}
	
/* update message appearing */
.projectUpdtMsg { 
	width:700px; 
	text-align:right; 
	color:#DC0000; }
	
	.projectUpdtMsg ul { 
		list-style: none outside url('');}

	/* element description */
.descrProject { 
	font-size:10px; 
	color:#777; }






/**
 * pt_createproject.html
 * -------------------------------------------------------------------------- */
.projectCreate { /* no longer in use */}
	
.projectCreate textarea { 
	font-family: Verdana, Helvetica, sans-serif;
    font-size:12px;}
    
.projectCreate input, 
.projectCreate textarea { 
	border:1px solid #777777;
    background-color:#777777; 
    color:#F1F1F1; }
	
.projectCreate .button { 
	border:1px solid #F1F1F1; 
    margin-top:20px; }

.projectCreate th { 
	vertical-align:top; 
	font-weight:normal; 
	text-align:left;}

.projectCreate .h2head {
	margin:0; 
	font-size:20px;
	line-height:30px;}

	
	
	
	
	

/**
 * pt_table/pt_gallery_browse.html/pt_createproject.html 
 * -------------------------------------------------------------------------- */
	
	/* takes our controls */
.startPanel { 
	width:690px; 
	float:left; 
	padding:5px;
	clear:both;}
	
.startpanel img {
   vertical-align: middle;}
	
.clickWrap { 
	height:25px; 
	width:700px; 
	padding:5px 0;}

.clickWrap img {
    vertical-align: middle; }
	
.clickRefresh { 
	float:left; 
	/* font-weight:bold; */
	padding: 2px 0 0 0;}
	
.clickRefresh img {
   vertical-align: middle; }
	
.clickRefresh span { 
   text-transform: uppercase; 
   color:#DC0000;
   /* to bring it in line with the a from .clickBack */ line-height:20px; }

.clickRefresh span:hover { 
   color:#FFFFFF; }

.clickBack { 
	float:left; 
	text-transform:uppercase; 
	padding: 2px 0 0 5px;}

.clickBack img {
   vertical-align: middle;}
	
.clickBack a:link,
.clickBack a:visited,
.clickBack a:active{ 
	font-weight:normal; 
	color:#DC0000; }
		
.clickBack a:hover { 
	color:#FFFFFF; }

.galleryDetails {
	background: transparent url('/media/img/bg_sand_[20tr].png') repeat;}

.galleryDetailsTitle {
	line-height:18px;
	padding:5px 0 0 10px;;
	margin:0;}

.galleryImg {
	/*border: 1px dotted #DC0000;*/}

.gallerySwitch {
	text-align:right;
	padding:2px 5px 0 5px; 
	line-height:20px;
	text-transform:uppercase;}

.gallerySwitch img {
	vertical-align:middle;}

.gallerySwitch :hover {
	color: #FFFFFF;}
	
.gallerySwitch a:link,
.gallerySwitch a:visited,
.gallerySwitch a:active{ 
	font-weight:normal; 
	color:#DC0000; }

	/*switching through the galleries inside an area */
.prev_next {
	cursor: pointer;
	padding-left: 0.8em;
	color:#DC0000;}
.prev_next:hover {
	color:#FFFFFF;}
.prev_next img {
	vertical-align: middle;}	
	
/* 
 * @used pt_gallery_browse.html
 * -------------------------------------------------------------------------- */ 
	
.gallerySingleImgWrapper { /* inside a gallery, we wrap image elements */ 
	background: transparent url('/media/img/bg_[25tr].png') repeat;}	
	
.galleryImgEncaps { /* encapsulate image and title_slug */
	height: 190px; /* match img thumbnail height + few pixels */
	padding-top:10px;}

.gallerySingleImg { /* the image */
	text-align: center;
	position: relative;  /* relative to .galleryImgEncaps */
	left: 0;
	top: 0;
	/* width: 200px; /* must match .gallerySingleImgWrapper width :: width-200 */
	z-index: 1;}
	
.gallerySlugOverlay { 
	/* overlay the title_slug */ 
	text-align: center;
	background: transparent url('/media/img/bg_sand_[20tr].png') repeat; */
	border-bottom: 1px dotted #333;
	position:relative; /* relative to .galleryImgEncaps */
	left: 0;
	top: 0;
	/* width: 200px; /* must match .gallerySingleImgWrapper width :: width-200 */
	height: 30px;
	z-index: 2;
	padding-top:5px;}
	
.galleryImgPermOptions {
	text-align: center;}
	


/**
 * create new sub area/gallery  
 * -------------------------------------------------------------------------- */
.createNewSubWrap {
	width: 700px;}
.createNewSub { 
	padding: 5px;
	clear: left;}
.createNewSub input { 
	background-color:#777777; 
	border:1px solid #777777;
    color:#F1F1F1; 
    font-family: Verdana, Helvetica, Arial, sans-serif;}
.createNewSub select { 
	background-color:#777777; 
	border:1px solid transparent;
    color:#F1F1F1; 
    font-family: Verdana, Helvetica, Arial, sans-serif;}
.createNewSub .button { 
	border:1px solid #F1F1F1;}



/**
 * pt_gallery_browse | loc_main 
 * -------------------------------------------------------------------------- */
.actionPanel { 
	padding:5px;}
.actionPanel .button { 
	background-color:#777777; 
	border: 1px solid #F1F1F1;
    color:#F1F1F1; 
    padding: 0 5px;}
.actionPanel .button:hover,
.actionPanel .button:focus {
	border:1px solid #333;}
.actionPanel select { 
	background-color:#777777; 
	border:1px solid #777777;
    color:#F1F1F1;}


/**
 * LocationDb style elements
 * -------------------------------------------------------------------------- */



/**
 * loc_main
 * -------------------------------------------------------------------------- */

/* #importLink defines upload area */
#importLink { /* carrier class !!don't touch !! */}

	#importLink img {
	   vertical-align: middle;}
	
	#importLink a:link, 
	#importLink a:visited, 
	#importLink a:active {
		color:#DC0000;
		font-weight:normal;
		text-decoration:none;
		text-transform:uppercase;}
	#importLink a:hover {
		color:#FFF;}   

#wraplocDbSearchTable { /* carrier class */ }

.locDbDescr {
	font-size:10px;}

#locDbSearchTable td,
#locDbSearchTable th {
	vertical-align:top;
	font-weight:normal;
	text-align:left;}

#locDbSearchTable td.descr {
	width:100px;
	vertical-align:top;}
#locDbSearchTable ul { 
	list-style:none;
	margin:0; }
#locDbSearchTable input:hover,
#locDbSearchTable textarea:hover {
	border:1px solid #F1F1F1;}
#locDbSearchTable input:focus,
#locDbSearchTable textarea:focus {
	color: #DC0000;
	border:1px solid #F1F1F1;
	background: #FFF;}
#locDbSearchTable .button {
	background-color:#777; 
	border:1px solid #F1F1F1;
	color:#F1F1F1;
	padding: 0 5px;}
#locDbSearchTable .button:hover, 
#locDbSearchTable .button:hover {
	border:1px solid #333; }
#locDbSearchTable thead {
	font-size: 20px;
	line-height:30px;}



/** 
 * loc_add: location search form
 * -------------------------------------------------------------------------- */
#addLocationForm { 
	clear:left; 
	float:left; 
	width:700px; 
	margin: 2em 0;
    /* margin-top:6em; */ 
    padding: 2em 0; 
    border: 1px solid #333333;}
#addLocationForm ul {
	list-style:none; 
	padding:0; 
	margin:2px 0 0 0;}
#addLocationForm th { 
	vertical-align:top; 
	text-align:right;}    
#addLocationForm td { 
	vertical-align:top; 
	text-align:left;}

	/* defines the form input fields */
#id_keywords, 
#id_attr_location, 
#id_attr_location, 
#id_attr_project, 
#id_attr_date, 
#id_attr_scout, 
#id_attr_zip, 
#id_attr_city, 
#id_attr_address, 
#id_attr_contact, 
#id_attr_costs, 
#id_name { 
	font-family: Verdana, Arial, sans-serif; 
	color:#F1F1F1;
	background-color:#777777; 
	border:1px solid #777777; 
	font-size:11px; 
	width:300px;}

#id_keywords { /* textarea */
	height:50px;} 

#addLocationForm .button { 
	color:#F1F1F1; 
	background-color:#777777;
    border:1px solid #F1F1F1; 
    padding: 0 5px; 
    margin-left: 15px;}
#addLocationForm label { 
	font-weight:normal; 
	text-align:left;}





 	/* loc_import: import new elements to the server */
#uploadImp {
	width:685px;
	float:left; 
	/* margin:1.3em; */ 
	display: block;
	padding:15px 0 0 15px;
	background:transparent url('/media/img/bg_sand_[20tr].png') repeat; }
#uploadImp .button { 
	background-color:#777; 
	border:1px solid #F1F1F1; 
	color: #F1F1F1;}
#uploadImp .inputUp input {
	background-color:#777; 
	border:1px solid #F1F1F1; 
	color: #F1F1F1;}
#uploadImp .h2head { 
	margin:0; 
	font-size:20px;
	line-height:30px;}

	/* JS history area */
.backLink {
	padding: 5px 0;
	/* margin-left:15px; */
	background: transparent url('/media/img/bg_[50tr].png') repeat;
	width:700px;
	text-transform:uppercase;}
.backLink img {
	margin-left:5px;}
	
.backLink a:link, 
.backLink a:visited, 
.backLink a:active {
	color:#DC0000;}
.backLink a:hover {
	color:#FFFFFF;}
	
	
}
