/* Virtual Ad Taker CSS Template */

/* Reset default positioning values */
@import "reset.css";

/*************** Layout */

body {
   text-align: center;
}

#wrapper {
  width: 768px;
  height: auto;
  margin-left: auto;
  margin-right: auto;
  font-family: helvetica, arial, sans-serif;
  font-size: 11px;
  line-height: 16px;
  color: #666666;
}

#header {
	width: 768px;
	height: 80px;
	background: url("../image/header_bg.jpg") no-repeat;
	margin: 12px 0px 12px 0px;
}

div[header] {
	float: left;
	display: inline;
}
#headerBranding {
	width: 768px;
	height: 80px;
	background: url("../image/branding_header_bg.jpg") no-repeat;
	margin: 2px 0px 2px 0px;
}

div[headerBranding] {
	float: left;
	display: inline;
}

#logo {
	float: left;
	display: inline;
	width: 333px;
	height: 56px;
	font-size: 22px;
	line-height: 26px;
	margin: 10px 0px 0px 10px;
}

#logoBranding {
   display: none;
}

#logoBranding img {
   display: none;
}

#nav {
	float: left;
	display: inline;
	width: 768px;
	height: auto;
}

#content {
	width: 768px;
	height: auto;
}

div[content] {
	float: left;
	display: inline;
}

/*************** Header Buttons */

#button {
  float: right;
  display: inline;
  width: 380px;
  height: 28px;
  margin: 29px 0px 0px 0px;
}

#button a {
  float: right;
  display: block;
  font-size: 11px;
  font-weight: bold;
  line-height: 24px;
  text-align: center;
  text-decoration: none;
}

#buttonBranding {
  float: right;
  display: inline;
  width: 768px;
  height: 28px;
  margin: 29px 0px 0px 0px;
}

#buttonBranding a {
  float: right;
  display: block;
  font-size: 11px;
  font-weight: bold;
  line-height: 24px;
  text-align: center;
  text-decoration: none;
}

#buttonBranding #home {
   float: left;
  margin: 0px 8px 0px 8px;
}

#buttonBranding #logout {
  margin: 0px 8px 0px 8px;
}

#home:link, #home:visited {
  width: 65px;
  height: 28px;
  margin: 0px 8px 0px 0px;
  color: #337733;
  background: url("../image/header_home.gif") no-repeat;
}

#home:hover, #home:active {
  color: #559955;
}

#account:link, #account:visited {
  width: 95px;
  height: 28px;
  margin: 0px 8px 0px 0px;
  color: #335577;
  background: url("../image/header_account.gif") no-repeat;
}

#account:hover, #account:active {
  color: #557799;
}


#userguide:link, #userguide:visited {
  width: 95px;
  height: 28px;
  margin: 0px 8px 0px 0px;
  color: #335577;
  background: url("../image/header_account.gif") no-repeat;
}

#userguide:hover, #userguide:active {
  color: #557799;
}

#reporting:link, #reporting:visited {
  width: 85px;
  height: 28px;
  margin: 0px 8px 0px 0px;
  color: #335577;
  background: url("../image/header_reporting.gif") no-repeat;
}

#reporting:hover, #reporting:active {
  color: #557799;
}

#logos:link, #logos:visited {
  width: 85px;
  height: 28px;
  margin: 0px 8px 0px 0px;
  color: #335577;
  background: url("../image/header_logos.gif") no-repeat;
}

#logos:hover, #logos:active {
  color: #557799;
}

#logout:link, #logout:visited {
  width: 75px;
  height: 28px;
  color: #773333;
  background: url("../image/header_logout.gif") no-repeat;
}

#logout:hover, #logout:active {
  color: #995555;
}

#publisher:link, #publisher:visited {
  width: 115px;
  height: 28px;
  color: #773333;
  margin: 0px 8px 0px 0px;
  background: url("../image/header_publisher.gif") no-repeat;
}

#publisher:hover, #publisher:active {
  color: #995555;
}


/*************** Step Arrows */

#steps {
  float: left;
  display: inline;
  width: 768px;
  height: 42px;
}

.step1 {
  background: url("../image/steps_1.gif") no-repeat;
}

.step2 {
  background: url("../image/steps_2.gif") no-repeat;
}

.step3 {
  background: url("../image/steps_3.gif") no-repeat;
}
.step4 {
  background: url("../image/steps_4.gif") no-repeat;
}
.step34 {
  background: url("../image/steps_34.gif") no-repeat;
}

.step5 {
  background: url("../image/steps_5.gif") no-repeat;
}

#steps a:link, #steps a:visited, #steps span {
  float: left;
  display: inline;
  width: 168px;
  height: auto;
  font-size: 20px;
  line-height: 37px;
  letter-spacing: -1px;
  text-decoration: none;
  color: #224466;
  text-align: center;
}

#steps a:hover, #steps a:active {
  color: #224466;
}

#steps #step1, #steps #step5 {
  width: 130px;
}

#steps span {
  color: #aabbcc;
}

/*************** Buckets */

div.bucket {
  float: left;
  display: inline;
  width: 768px;
  height: auto;
  padding: 10px 0px 25px 0px;
  background: url("../image/div_bg.jpg") bottom no-repeat;
}

/*************** Calendar */

table.calendar {
  float: none;
  clear: none;
  display: block;
  width: auto;
  height: auto;
  margin: 0px 1px 0px 0px;
  border-collapse: collapse;
}

table.calendar.last {
  margin: 0px;
}

table.calendar tr td.day {
  font-weight: normal;
  text-align: center;
  padding: 1px;
  font-size: 11px;
  width: 27px;
  height: 27px;
  background: #f0f0f0 url("../image/calendar_bg.jpg") top repeat-x;
}

table.calendar tr td.month {
  font-weight: bold;
  text-align: left;
  padding: 2px;
  font-size: 16px;
  width: 189px;
  height: 27px;
  border: 0px;
}

table.calendar tr td {
  border: solid 1px #cccccc;
  font-weight: normal;
  text-align: right;
  padding: 1px;
  width: 27px;
  height: 27px;
}

table.calendar tr td span {
  float: left;
  display: block;
  text-align: right;
  padding: 0px;
  width: 100%;
  color: #708090;
}

table.calendar tr td input {
  float: none;
  clear: left;
  display: inline;
  padding: 0px;
  border: 0px solid white;
  width: 12px;
}


/*************** Small Buttons */

a.buttonBackSmall:link, a.buttonBackSmall:visited {
  float: left;
  display: inline;
  width: 150px;
  height: 38px;
  background: url("../image/button_back_small_bg.gif") repeat-x;
  text-decoration: none;
  color: #335577;
}

a.buttonBackSmall.w300:link, a.buttonBackSmall.w300:visited {
  width: 300px;
}

a.buttonBackSmall:hover, a.buttonBackSmall:visited {
  color: #002266;
}

a.buttonBackSmall span {
  float: left;
  display: inline;
  width: auto;
  height: 38px;
  font-size: 16px;
  letter-spacing: -1px;
  line-height: 34px;
  cursor: pointer;
  text-align: center;
}

a.buttonBackSmall span.left {
  float: left;
  display: inline;
  width: 8px;
  height: 38px;
  background: url("../image/button_back_small_left.gif") left no-repeat;
}

a.buttonBackSmall span.right {
  float: right;
  display: inline;
  width: 8px;
  height: 38px;
  background: url("../image/button_back_small_right.gif") right no-repeat;
}


/*************** Buttons */

a.button:link, a.button:visited {
  float: left;
  display: inline;
  width: auto;
  height: 48px;
  margin: 0px 8px 0px 0px;
  text-decoration: none;
}

a.button span {
  float: left;
  display: inline;
  width: auto;
  height: 48px;
  font-size: 16px;
  letter-spacing: -1px;
  line-height: 44px;
  cursor: pointer;
  text-align: center;
}

a.button span.left {
  float: left;
  display: inline;
  width: 8px;
  height: 48px;
}

a.button span.right {
  float: right;
  display: inline;
  width: 8px;
  height: 48px;
}

a.button.floatRight, a.button.green.floatRight, a.button.blue.floatRight, a.button.grey.floatRight {
  float: right;
  margin: 0px;
}


/*************** Grey Buttons */

a.button.grey:link, a.button.grey:visited {
  background: url("../image/button_back_bg.gif") repeat-x;
  color: #667788;
}

a.button.grey:hover, a.button.grey:active {
  color: #224466;
}

a.button.grey span.left {
  background: url("../image/button_back_left.gif") left no-repeat;
}

a.button.grey span.right {
  background: url("../image/button_back_right.gif") right no-repeat;
}


/*************** Blue Buttons */

a.button.blue:link, a.button.blue:visited {
  background: url("../image/button_blue_bg.gif") repeat-x;
  color: #3377cc;
}

a.button.blue:hover, a.button.blue:active {
  color: #224466;
}

a.button.blue span.left {
  background: url("../image/button_blue_left.gif") left no-repeat;
}

a.button.blue span.right {
  background: url("../image/button_blue_right.gif") right no-repeat;
}


/*************** Green Buttons */

a.button.green:link, a.button.green:visited {
  background: url("../image/button_next_bg.gif") repeat-x;
  color: #336600;
}

a.button.green:hover, a.button.green:active {
  color: #003300;
}

a.button.green span.left {
  background: url("../image/button_next_left.gif") left no-repeat;
}

a.button.green span.right {
  background: url("../image/button_next_right.gif") right no-repeat;
}


/*************** Button Sizes */


a.button.smaller:link, a.button.smaller:visited, a.button.smaller:hover, a.button.smaller:active { width: 104px; height: 48px; }
a.button.smaller span { width: 88px; height: 48px; }
a.button.smaller span.left, a.button.smaller span.right { width: 8px; height: 48px; }

a.button.small:link, a.button.small:visited, a.button.small:hover, a.button.small:active { width: 120px; height: 48px; }
a.button.small span { width: 104px; height: 48px; }
a.button.small span.left, a.button.small span.right { width: 8px; height: 48px; }

a.button.medium:link, a.button.medium:visited, a.button.medium:hover, a.button.medium:active { width: 140px; height: 48px; }
a.button.medium span { width: 124px; height: 48px; }
a.button.medium span.left, a.button.medium span.right { width: 8px; height: 48px; }

a.button.large:link, a.button.large:visited, a.button.large:hover, a.button.large:active { width: 160px; height: 48px; }
a.button.large span { width: 144px; height: 48px; }
a.button.large span.left, a.button.large span.right { width: 8px; height: 48px; }

a.button.huge:link, a.button.huge:visited, a.button.huge:hover, a.button.huge:active { width: 180px; height: 48px; }
a.button.huge span { width: 164px; height: 48px; }
a.button.huge span.left, a.button.huge span.right { width: 8px; height: 48px; }

a.button.gigantic:link, a.button.gigantic:visited, a.button.gigantic:hover, a.button.gigantic:active { width: 274px; height: 48px; }
a.button.gigantic span { width: 258px; height: 48px; overflow:hidden; }
a.button.gigantic span.left, a.button.gigantic span.right { width: 8px; height: 48px; }

/*************** Small Buttons */

a.buttonEdit:link, a.buttonEdit:visited {
  float: left;
  display: inline;
  width: 60px;
  height: 26px;
  text-decoration: none;
  background: url("../image/button_small_green_bg.gif") repeat-x;
  color: #337733;
}

a.buttonEdit:hover, a.buttonEdit:active {
  color: #559955;
}

a.buttonApprove:link, a.buttonApprove:visited {
  float: left;
  display: inline;
  width: 74px;
  height: 28px;
  text-decoration: none;
  background: url("../image/button_small_green_bg.gif") repeat-x;
  color: #337733;
}

a.buttonApprove:hover, a.buttonApprove:active {
  color: #559955;
}

a.buttonDelete:link, a.buttonDelete:visited {
  float: left;
  display: inline;
  width: 60px;
  height: 26px;
  text-decoration: none;
  background: url("../image/button_small_orange_bg.gif") repeat-x;
  color: #663300;
}

a.buttonDelete:hover, a.buttonDelete:active {
  color: #885511;
}
a.buttonReject:link, a.buttonReject:visited {
  float: left;
  display: inline;
  width: 74px;
  height: 26px;
  text-decoration: none;
  background: url("../image/button_small_orange_bg.gif") repeat-x;
  color: #663300;
}

a.buttonReject:hover, a.buttonReject:active {
  color: #885511;
}

a.buttonPreview:link, a.buttonPreview:visited {
  float: left;
  display: inline;
  width: 82px;
  height: 26px;
  text-decoration: none;
  background: url("../image/button_small_blue_bg.gif") repeat-x;
  color: #336677;
}

a.buttonPreview:hover, a.buttonPreview:active {
  color: #558899;
}

a.buttonRelease:link, a.buttonRelease:visited {
  float: left;
  display: inline;
  width: 74px;
  height: 44px;
  text-decoration: none;
  background: url("../image/button_blue_bg.gif") repeat-x;
  color: #336677;
}

a.buttonRelease:hover, a.buttonRelease:active {
  color: #558899;
}

a.buttonApprove span {
  float: left;
  display: inline;
  width: auto;
  font-family: tahoma, geneva, sans-serif;
  height: 28px;
  font-size: 12px;
  font-weight: bold;
  letter-spacing: 0px;
  line-height: 24px;
  cursor: pointer;
  text-align: center;
}

a.buttonReject span {
  float: left;
  display: inline;
  width: auto;
  font-family: tahoma, geneva, sans-serif;
  height: 28px;
  font-size: 11px;
  font-weight: normal;
  letter-spacing: 0px;
  line-height: 24px;
  cursor: pointer;
  text-align: center;
}

a.buttonEdit span, a.buttonDelete span, a.buttonPreview span {
  float: left;
  display: inline;
  width: auto;
  font-family: tahoma, geneva, sans-serif;
  height: 26px;
  font-size: 11px;
  font-weight: bold;
  letter-spacing: 0px;
  line-height: 24px;
  cursor: pointer;
  text-align: center;
}
a.buttonRelease span {
  float: left;
  display: inline;
  width: 60px;
  font-family: tahoma, geneva, sans-serif;
  height: 44px;
  font-size: 11px;
  font-weight: normal;
  letter-spacing: 0px;
  line-height: 11px;
  cursor: pointer;
  text-align: center;
  padding-top: 4px;
}

a.buttonPreview span.left {
  float: left;
  display: inline;
  width: 8px;
  height: 26px;
  background: url("../image/button_small_blue_left.gif") left no-repeat;
}

a.buttonRelease span.left {
  float: left;
  display: inline;
  width: 7px;
  height: 44px;
  background: url("../image/button_blue_left.gif") left no-repeat;
}

a.buttonEdit span.left, a.buttonApprove span.left {
  float: left;
  display: inline;
  width: 8px;
  height: 28px;
  background: url("../image/button_small_green_left.gif") left no-repeat;
}

a.buttonDelete span.left, a.buttonReject span.left {
  float: left;
  display: inline;
  width: 8px;
  height: 26px;
  background: url("../image/button_small_orange_left.gif") left no-repeat;
}
a.buttonPreview span.right {
  float: right;
  display: inline;
  width: 8px;
  height: 26px;
  background: url("../image/button_small_blue_right.gif") right no-repeat;
}

a.buttonEdit span.right, a.buttonApprove span.right {
  float: right;
  display: inline;
  width: 8px;
  height: 26px;
  background: url("../image/button_small_green_right.gif") right no-repeat;
}

a.buttonDelete span.right, a.buttonReject span.right {
  float: right;
  display: inline;
  width: 8px;
  height: 26px;
  background: url("../image/button_small_orange_right.gif") right no-repeat;
}

a.buttonRelease span.right {
  float: left;
  display: inline;
  width: 7px;
  height: 44px;
  background: url("../image/button_blue_right.gif") right no-repeat;
}

a.floatRight {
  float: right;
}


/*************** Tags */

h1 {
	float: left;
	display: inline;
	width: 768px;
	height: auto;
	font-weight: normal;
	color: #111111;
	letter-spacing: -2.0px;
	font-size: 26px;
	line-height: 30px;
	font-family: helvetica, arial, sans-serif;
	margin: 0px 0px 12px 0px;
}

h2 {
	float: left;
	display: inline;
	clear: left;
	width: 768px;
	height: auto;
	font-size: 20px;
	line-height: 26px;
	font-weight: normal;
	letter-spacing: -1px;
	color: #708090;
	font-family: georgia, serif;
	margin: 0px 0px 4px 0px;
}

h3 {
	float: left;
	display: inline;
	clear: left;
	width: 768px;
	height: auto;
	font-size: 12px;
	line-height: 16px;
	font-weight: bold;
	color: #999999;
	font-family: helvetica, arial, sans-serif;
	margin: 0px 0px 4px 0px;
}

h4 {
	float: left;
	display: inline;
	clear: left;
	width: 768px;
	height: auto;
	font-size: 11px;
	line-height: 16px;
	font-weight: bold;
	color: #6699cc;
	font-family: helvetica, arial, sans-serif;
	margin: 0px 0px 4px 0px;
}

p {
	float: left;	
	display: inline;
	width: 768px; 
	height: auto;
	margin: 0px 0px 12px 0px;
	line-height: 16px;
}

a, a:link {
	color: #6699cc;
}

a:visited {
	color: #336699;
}

a:hover, a:active {
	color: #99ccff;
}

blockquote {
	float: left;
	display: inline;
	width: 744px;
	height: auto;
	padding: 12px;
	margin: 0px 0px 12px 0px;
	color: #999999;
	font-size: 11px;
	line-height: 16px;
	background: #eeeeee;
}


/*************** Column Layout */
div.half {
	width: 364px;
}
.half h1, .half h2, .half h3, .half h4, .half p {
	width: 344px;
	height: auto;
}
.half th {
	width: 100%;
	}
.half td p {
	margin-left:0px;
	width:300px;
	} 
	
.half table {
  margin-left:0px;
  padding-left: 0px;
  width: 390px;
  } 

.third h1, .third h2, .third h3, .third h4, .third p {
	width: 33%;
	height: auto;
}

.twoThirds h1, .twoThirds h2, .twoThirds h3, .twoThirds h4, .twoThirds p, .twoThirds table {
	width: 100%;
	height: auto;
}

.twoThirds table td {
  width: 50%;
}

.half blockquote {
	width: 90%;
}

.third blockquote {
	width: 90%;
}

.twoThirds blockquote {
	width: 90%;
}


/*************** Lists */

div.list {
	float: left;	
	display: inline;
	width: 768px;
	height: auto;
	margin: 0px 0px 12px 0px;
}

ul, ol {
	margin: 0px;
}

ul {
	list-style: disc;
	padding: 0px 0px 0px 18px;	
}

ol {
	list-style: decimal;
	padding: 0px 0px 0px 28px;	
}

ul li, ol li {
	font-size: 12px;
	line-height: 16px;
	padding: 0px;
	margin: 0px;
}

ul li ul {
	margin: 4px 0px;
	padding: 0px 0px 0px 18px;	
}

ol li ol {
	list-style: lower-alpha;
	margin: 4px 0px;
	padding: 0px 0px 0px 18px;	
}

ul li ul li, ol li ol li {
	font-size: 11px;
	line-height: 16px;
	padding: 0px;
	margin: 0px;
}


/*************** Tables */

table {
	float: left;
	clear: left;
	display: inline;
	widthx: 768px;
	height: auto;
	margin: 0px 0px 12px 0px;
	border-collapse: collapse;
}

div.smallBottom {
	padding: 10px 0px 25px 0px;
  background: url('../image/shadow_small.gif') bottom center no-repeat;
}

div.smallerBottom {
	padding: 10px 0px 25px 0px;
  background: url('../image/shadow_smaller.gif') bottom center no-repeat;
}

table tr th {
	width: 150px;
	height: auto;
	font-weight: normal;
	padding: 5px 3px 3px 0px;
	vertical-align: top;
	font-family: georgia, serif;
	font-size: 16px;
	letter-spacing: -1px;
	font-weight: normal;
	text-align: left;
}

table tr td {
	width: auto;
	height: auto;
	padding: 3px 0px 3px 0px;
	vertical-align: top;
}

table tr td.pad {
	padding: 3px 5px;
}

table tr.borderTop td {
  border-top: solid 1px #cccccc;
}

/*************** Forms */

p.required {
  float: left;
  display: inline;
  width: 100%;
	color: #335577;
	border: solid 1px #55aaee;
	background: #dff4ff url("../image/blue_bg.gif") top repeat-x;
	text-align: center;
	padding: 5px 0px;
	font-weight: bold;
}

input {
	font-family: helvetica, arial, sans-serif;
	font-size: 14px;
	line-height: 18px;
	letter-spacing: -1px;
	padding: 2px;
	color: #666666;
	border: solid 1px #cccccc;
	background: #ffffff url("../image/grey_bg.gif") top repeat-x;
}

input.required, select.required {
	color: #335577;
	border: solid 1px #55aaee;
	background: #dff4ff url("../image/blue_bg.gif") top repeat-x;
}

input.file {
	width: 500px;
	height: auto;
}

input.text {
	width: 558px;
	height: auto;
}

input.text.short {
  width: 50px;
}

input.text.mid {
  width: 150px;
}

input.text.midBig {
  width: 310px;
}

input.text.password {
	font-family: arial, sans-serif;
}

span.check {
	float: left;
	clear: left;
	display: inline;
	line-height: 16px;
}

span.check input {
	float: left;
	display: inline;
	width: auto;
	height: auto;
	border: 0px;
	background: none;
	margin: 0px 8px 0px 0px;
	padding: 0px;
	line-height: 16px;
}

select {
	width: auto;
	height: auto;
	font-family: helvetica, arial, sans-serif;
	font-size: 14px;
	line-height: 16px;
}

select.mid {
  width: 400px;
}

select.multiple {
	width: 308px;
	height: auto;
}

select.state {
	width: 50px;
	height: auto;
}

select.month {
	width: 80px;
	height: auto;
}

select.day {
	width: 50px;
	height: auto;
}

select.year {
	width: 80px;
	height: auto;
}

textarea {
	width: 300px;
	height: 150px;
	font-family: helvetica, arial, sans-serif;
	font-size: 12px;
	line-height: 16px;
	color: #333333;
	border: solid 4px #eeeeee;
	background: #eeeeee;
}

input.submit {
	width: auto;
	height: auto;
	margin: 0px 8px 0px 0px;
	padding: 3px 8px;
	font-family: helvetica, arial, sans-serif;
	font-size: 12px;
	line-height: 16px;
	color: #4a8933;
	font-weight: bold;
	text-align: center;
	background: #88bbdd;
	border: solid 1px #3388bb;
}

input.submit:hover {
	background: #99ccee;
	cursor: pointer;
}

.error {
	float: left;
	display: inline;
	width: 756px;
	height: auto;
	font-size: 14px;
	font-weight: bold;
	color: #990000;
	background: #ee9999;
	border: 1px solid #aa2222;
	padding: 5px;
	margin: 0px 0px 12px 0px;
}

.spellError {
   color: red;
}

/*************** Generic Classes */

.floatLeft 			{ float: left; display: inline; }
.floatRight 		{ float: right; display: inline; }
img.floatLeft		{ float: left; display: block; margin: 0px 8px 8px 0px; }
img.floatRight	{ float: right; display: block; margin: 0px 0px 8px 8px; }
.centered 			{ text-align: center; }
img.centered    { float: none; display: block; margin-left: auto; margin-right: auto; }
.alignRight 		{ text-align: right; }

.tiny 					{ font-size: 10px; line-height: 16px; }
.small 					{ font-size: 11px; line-height: 16px; }
.normal 				{ font-size: 12px; line-height: 18px; }
.medium 				{ font-size: 14px; line-height: 20px; }
.big 						{ font-size: 16px; line-height: 22px; }
.huge						{ font-size: 18px; line-height: 24px; }

.italic 				{ font-style: italic; }
.bold 					{ font-weight: bold; }
.nobold 				{ font-weight: normal; }

.grey						{ color: #999999; }
.blue						{ color: #336699; }
.green					{ color: #339933; }
.red						{ color: #993333; }
.black					{ color: #111111; }

.half 					{	width: 50%; }
.third					{ width: 33%; }
.twoThirds			{	width: 66%; }

/******************* IE6 Hacks */

.clearBucket { display: inline; clear: both; }

/******************** YUI Library Hacks */

.yui-skin-sam .yui-editor-container h1,h2,h3,h3 { float: none; display: block; width: auto; }