@charset "utf-8";

html, body {
    height: 98%;
}

body{
  margin: 0;
  padding: 0;
	padding-top: 10px;
  text-align: center;  /* to get the content div in the middle !*/
	background-image: url('../images/background_loop.jpg');
	background-repeat: repeat-x;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;  
	color: #333333;
	/* overflow: hidden; */ /* Removed by YATRIK */ 
}

#Wrapper{
  height: 100%;
/*	min-height:100%;for mozilla*/
  width: 901px;
  margin: 0px auto;
  /*margin-bottom:  30px;*/
/*  padding-bottom: 120px; */
  text-align: center;
	background: #FFFFFF;    
} 

#Content {
/*  margin: 5px 20px; */
	height: 100%;
	padding: 5px;
	padding-bottom: 2px;
	padding-right: 6px; /* small fix */
}

#menu {
	width:	100%;
}

#nav {
	border: 1px solid #2799f1;
	width:	100%;
	margin: 2px 0;
}

#container {
/*	height: 90%; */
  background: #FFFFFF;
  margin: 0;
	border: 1px solid #78b4d9;
	text-align: left;
		
	overflow: auto;
	
	height: 100%;
	max-height: 100%; 
	width: 100%;
}

#status {
	position: relative;
	width: 		100%;
	border:  	1px solid #78B4D9;
}

#buttons {
	height: 	114px;
}
/* this is for restricting the size of template THUMBS in the STATUS BOX */
img.status_template_thumb {
	width:	60px;
	cursor:	default;
}

a img {
	border: 0;
}

a:link {
	border: 0;
	text-decoration: none;
	font-family: verdana;
	font-size: 10px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	color: #333333;	
}
a:visited {
	border: 0;
	text-decoration: none;
	font-family: verdana;
	font-size: 10px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	color: #333333;	
}
a:hover {
	border: 0;
	text-decoration: none;
	font-family: verdana;
	font-size: 10px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	color: #333333;	
}
a:active {
	border: 0;
	text-decoration: none;
	font-family: verdana;
	font-size: 10px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	text-align: left;
	color: #333333;	
}

a.linkNavTrail {
	text-decoration: none;
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	font-variant: normal;
	color: #FFFFFF;
}

.maintext {
	width: 262px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #333333;
	text-align: left;
}
.mainheader {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #999999;
}

table.tblNavTrail {
	width: 100%;
	border: 0; 
}

.trail {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style: normal;
	font-weight: bold;
	font-variant: normal;
	text-transform: none;
	color: #FFFFFF;
	padding: 2px;
}

.mainheaderactive {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	font-variant: normal;
	text-transform: none;
	color: #333333;
}
.topmenu {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	font-variant: normal;
	color: #1f4f99;
	text-align: left;
}
.light-red {
	color: #FF0000;
	font-weight: bold;
	font-family: verdana;
	font-size: 10px;
	font-style: normal;
	line-height: normal;
	font-variant: normal;
	text-transform: none;
	text-align: left;
}
.light-orange {
	color: #FF9900;
	font-family: Verdana;
	font-size: 10px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	text-align: left;	
}
.light-green {
	color: #009900;
	font-weight: normal;
	font-family: Verdana;
	font-size: 10px;
	font-style: normal;
	line-height: normal;
	font-variant: normal;
	text-transform: none;
	text-align: left;
}

.trailselected {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style: normal;
	font-weight: bold;
	font-variant: normal;
	text-transform: none;
	color: #FFFFFF;
}


/*======================================================================================== my stuff ================================================================= */
/* page subheading, which is actually mini instructions for a block usually..  so it's a block instructions*/
.subheading {
  font-weight: bold;
  text-decoration: underline;
  padding-left: 10px;
  text-align: left;
}

/* standard bold text..*/
.txtStdBold {
  font-weight: bold;
}

/* the small text under the CONFIRM buttons, like 'confirm and continue'.. */
.buttonLabelStd {
  color:#333333;
  font-family:Verdana,Arial,Helvetica,sans-serif;
  font-size:10px;
  font-style:normal;
  font-variant:normal;
  font-weight:normal; 
  text-align: right;
  padding-right: 20px;
}

/* the small text under the CONFIRM buttons, like 'confirm and continue'.. */
.buttonLabelStdNoPad {
  color:#333333;
  font-family:Verdana,Arial,Helvetica,sans-serif;
  font-size:10px;
  font-style:normal;
  font-variant:normal;
  font-weight:normal; 
  text-align: right;
}


/*a normal (long) textbox ! */
.textboxStdLong {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #333333;
	text-align: left;
  width:  365px;
  margin-right: 20px;    /* the buttons should be a distance away .. */
  margin-left: 5px;      /* the label .. */
 }

 
.textboxSnippetHttpPrecursor {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	color: #333333;
} 

.textboxSnippetImgLink {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #333333;
	text-align: left;
  width:  330px;
}
 
/*a normal textbox ! eg on the login page */
.textboxStd {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #333333;
	text-align: left;
  width:  150px;
  margin-right: 20px;    /* the buttons should be a distance away .. */
  margin-left: 5px;      /* the label .. */
 }


/*a normal / long textbox ! eg on the EDIT CONTACT page */
.textboxStdMedLong {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #333333;
	text-align: left;
  width:  250px;
  margin-right: 20px;    /* the buttons should be a distance away .. */
  margin-left: 5px;      /* the label .. */
 }
 
 
.selectStdLong {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	color: #333333;
	text-align: left;
  width:  365px;
  margin-right: 30px;    /* the buttons should be a distance away .. */
  margin-left: 5px;      /* the label .. */
 }
 
/*cellpadding="4" */
table.tableFormStd {
/*  width:  730px; */
/*	width:	100%;   we take this off because it can be set in the individual form if desired */
} 


TH.dataSmall {
	text-align: center;
	font-weight: bold;
}

TD.dataSmall {
	text-align: center;
	font-weight: normal;
}

TH.formLabelSmall {
  width:      	150px;
  text-align: 	right;
	font-weight: 	bold;
}

TD.formLabelSmall {
  width:      150px;
  text-align: right;
}

TD.formLabelMedium {
  width:      200px;
  text-align: right;
}
 
TD.formLabelStd {
  width:      250px;
  text-align: right;
}
 
TD.formItemStd {
  width:      400px;
  text-align: left;
}

/* this is the cell that holds a large submit button ! usually in the second col.. */
TD.submitButtonStd {
  padding-right:  20px;
  padding-top:    20px;
}

/*after each row there is a space for buttons or help or whatever*/ 
TD.formButtonsStd {
  text-align:   left;
  /*width:  100px;
    we're not setting a width= it's on the end so best if it can disappear or be longer or whatever ..!
    */  
}

TD.formItemExampleStd {
  text-align: left;
}


P.formItemExampleStd {
  font-style: italic;
}

TABLE.tblSearchResultsStd{
  width:          375px; /* we want the table to be as long as the search box .. */
  border:         0;
  padding:        0;
  margin:         0;
  border-spacing: 0;
}
/* a TD specifically designed to hold a small butotn like edit/delete/view etc ..! 
so a 15px by 15px image would have 2px padding either side..!
*/
TD.buttonSmall {
  width:      19px;
  text-align: center;
  padding-top: 3px;
}

TD.searchItemName {
  padding-left: 20px;
}


/* to create light blue table rows for alternate rows .. */
.searchRowOdd{
  background-color: #FFFFFF;
}

.searchRowEven{
  background-color: #eaf7ff;
}


/* mini icons like delete email trash can .. generally 15 x 15 px */
img.buttonSmall {
  height: 15px;
  width:  15px;
  border: 0;
}
/* eg: MORE INFO button or search button - they are floated left !! */
img.buttonStd {
  float:  left;
  height: 25px;
  width:  25px;
  border: 0;
  padding:  0 2px;  /*don't want the buttons next to each other too closely*/
}

img.buttonLarge {
  border: 0;
}

/*this is for eg the EXPAND and CONTRACT buttons for a COMPANY */
div.buttonStd{
float: left; 
padding-bottom: 2px; 
padding-right: 2px;
}


/*TEMPLATE SELECT PAGE AND OTHERS THAT NEED A NICE SEPARATOR HR*/
hr.std {
  width:        100%;
  text-align:   left;
  margin-left:  0px;
}


/* snippet creation html editor */
TD.snippetCreateEditor {
  text-align:     right;
  padding-left:   20px;
  padding-right:  0px;
  margin-right:   0px;
}

/* the blue line that separates blocks.. */
.blockSeparator {
  padding-top:      30px;
  padding-bottom:   10px;
}


/*============ CONTACTS LISTING ==================== */
/* tblCompanyList is the OUTSIDE TABLE containing the company name*/
TABLE.tblCompanyList {
  width: 100%;
  border: 0;
  text-align: left
}

/* the grey/black header cells for the CONTACTS LISTING */
TABLE.tblCompanyList th {
  	background-color: #CCCCCC;
	color: #333333;  
  	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	font-variant: normal;
	text-transform: none;
/*  padding: 2px 0;*/
  	text-align: left;
  	
}

TABLE.tblCompanyList td {
	font-size: 10px;
	font-style: normal;
  /*padding: 2px 0;*/
  text-align:left
}


/* tblContactList is the INSIDE TABLE containing the CONTACTS for a COMPANY*/
TABLE.tblContactList {
  width: 100%;
  border: 0;
  text-align:left
}

TABLE.tblContactList td {
  font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	text-align:left
}


/* and now we can set the width explicitly of the cells that we will need in other tables !! */
.contacts_contactID {
  width: 80px;
  text-align: left;
}
.contacts_name {
  width: 100px;
  text-align: left;
}
.contacts_email {
  width: 200px;
  text-align: left;
}
.contacts_phone {
  width: 120px;
  text-align: left;
}
.contacts_std {
  width: 120px;
  text-align: left;
}
.contacts_date {
  width: 80px;
  text-align: left;
}

.blank_th { width: 100px; }

/* TRACKING = CAMPAIGNS OVERVIEW */
.infoHeaderCell {
  color:            #FFFFFF;
  background-color: #1F4F99;
  font-weight:      bold;
}


/*snippets.search.tpl page=snippets*/
.snippetsGroupHeading {
  font-weight: normal;
  text-decoration: none;
  padding-left: 10px;
  text-align: left;
}