/* New Styles - December 2010
----------------------------------------------------------------------------------------------------*/
#content-wrap {background-color:#fff; width:980px; margin:0 auto; padding: 0 0 5px 0;}

#headlines { margin: 0 0 0 -10px !important; width: 940px; padding: 30px 20px !important; background: #fff url(../img/bg_headlines.gif) bottom left repeat-x; font-size: 20px; line-height: 22px !important; color: #666; position: relative;}
#headlines h1 {color: #000; font-size: 34px !important; line-height: 38px !important; margin:0 !important; padding:0 !important;}
#presoflow { margin-top: 20px;}
#main-screenshot {margin: -10px 0 -32px 10px;}
#intro-text { padding-top: 20px; font-size: 18px;}

div.upload-arrow { position: absolute; top: 170px; left: -25px;}

p.lead {font-size: 24px; color: #0099cc; font-weight: bold; padding: 10px 0;}  

p.create-presso {margin-left: -6px;}
a.create-presso { text-indent: -9999px; float:left; height: 51px; width: 235px; background-image: url(../img/btn_create-presso.png); background-position: 0 0; background-repeat: no-repeat;}
a.create-presso:hover { background-position: 0 -51px;}

#workflow-start {background: #fff url(../img/bg_workflow-start.gif) bottom 410px no-repeat; padding: 20px 0 10px 0;}
#workflow-start h3 {font-size: 24px; margin: 0 0 10px 0;}

a.more { font-weight: bold;}

/* Basic Typography
----------------------------------------------------------------------------------------------------*/

body { color: #535353; background: #5A686D url(../img/bg_wrapper.jpg) 0 0 repeat-x; font-size: 14px; line-height: 20px !important; padding: 0px; font-family: arial, helvetica, sans-serif; }

a { color: #01a2d8; text-decoration: none;}
a { color: #01a2d8; text-decoration: none; cursor: pointer; }
a:hover {color: #f78500; text-decoration: underline; }
p img {float: left; margin: 0 10px 10px 0;}

h1, h2, h3, h4 { font-family: Myriad Pro, Myrida, arial, helvetica, sans-serif !important;}

h3 { font-size: 18px !important;}

p {margin: 0 0 20px 0;}
p.center { text-align: center; }

ul, ol { list-style-position: outside; }
ul { list-style-type: square; }
ol { list-style-type: decimal; }
ul li { margin: 0px 0px 0px 15px; }

table {margin-bottom: 1.4em;width:100%;}
th {font-weight:normal; color: #cccccc; text-align: left; font-size: 10px;}
th, td {padding:0px 5px;}
.odd {background:#fafaf0;}
tr.even td {background:#E5ECF9;}
tfoot {font-style:italic;}
caption {background:#FFF;}

.hoverlight:hover h4 {color: #F78500}

/* Global Buttons 
---------------------------------------------------------------------- */
.small_button{}
.medium_button{}
.big_button {}

.button_alternative_action { font-family: Myriad Pro, Arial, Helvetica, Verdana, sans-serif; color: #000000; font-size: 15px; margin-bottom: 10px; margin-top: 5px; text-align: center;}

/* Global Lightboxes 
---------------------------------------------------------------------- */
.lightbox{}


/* Global Wrappers
---------------------------------------------------------------------- */
#wrapper {}


/** Header
------------------------------------------------------------------------------*/
#header-marketing { position: relative; overflow: hidden; height: 100px;}

#header-marketing #logoContainer { position: absolute; top: 0; left: 0; text-align: left; }
#header-marketing #logoContainer #bigLogo {margin-top:30px;}
#header-marketing #logoContainer #bigLogo a { }

#header-marketing #userInfoContainer { position: absolute; top: 10px; right: 0; text-align: right; color:#ccc;}
#header-marketing #userInfoContainer ul#userLoginInfo { float: none; font-size: 12px; margin-bottom: 0; }
#header-marketing #userInfoContainer ul#userLoginInfo li { font-size: 10px; display: inline; margin-left: .5em; }
#header-marketing #userInfoContainer ul#userLoginInfo li a { font-size: 10px; font-weight: normal; text-decoration: none; color: #F78500; border: none; }
#header-marketing #userInfoContainer ul#userLoginInfo li a:hover { color: #F78500; border-bottom: 1px solid #F78500; }
#header-marketing #userInfoContainer ul#userLoginInfo li #siteSelection { width: 156px; }
#header-marketing #userInfoContainer #siteActions { margin-top: 5px; }
#header-marketing #userInfoContainer #search { margin-top: 5px; padding-left: 5px; text-align: right; }
#header-marketing #userInfoContainer #search input { display: inline; vertical-align: middle; }
#header-marketing #userInfoContainer #search #searchString { width: 200px; }

#header-marketing #mainNavigationContainer { position: absolute; bottom: 5px; right: 0; }
ul#navigationTabs { margin-top: 0; margin-bottom: 15px; float: right; list-style-type: none; }
ul#navigationTabs li { display: inline; list-style: none; margin: 0; float:left;}
	
ul#navigationTabs li a {
    background: transparent url(../img/bg_navtab-right.png) -200px right no-repeat;
    color: #fff;
    display: block;
    float: left;
    height: 34px;
    padding-right: 20px; /* sliding doors padding */
    font-weight: bold;
    font-size: 14px;
}
ul#navigationTabs li a span {
    background: transparent url(../img/bg_navtab-left.png) -200px no-repeat;
    display: block;
    line-height: 14px;
    padding: 9px 0 0 20px;
    height: 25px;
}
ul#navigationTabs li a:hover {
	background: transparent url(../img/bg_navtab-right.png) bottom right no-repeat;
	text-decoration: none;
	}
ul#navigationTabs li a:hover span {
	background: transparent url(../img/bg_navtab-left.png) bottom left no-repeat;
	}
ul#navigationTabs li a.active {
	color: #fff;
	background: transparent url(../img/bg_navtab-right.png) no-repeat top right;
	}
ul#navigationTabs li a.active span {
	background: transparent url(../img/bg_navtab-left.png) no-repeat top left;
	}
ul#navigationTabs li a.highlight {
	background: transparent url(../img/bg_navtab-right.png) bottom right no-repeat;
	text-decoration: none;
	}
ul#navigationTabs li a.highlight span {
	background: transparent url(../img/bg_navtab-left.png) bottom left no-repeat;
	}



/* Footer 
---------------------------------------------------------------------- */
#footer #footerContainer { margin: 15px 0; }
#footer #footerContents { font-size: 12px; color: #ccc; }
#footer #footerLogo { text-align:right; }
.next { color: #fff; font-style: italic; }
.slide { color: #F78500; font-style: italic; }
.regmark { font-size: 7px; vertical-align: super; }


/* Global Heads and Subheads 
---------------------------------------------------------------------- */
.masthead { font-family: Myriad Pro, Helvetica, Arial, Verdana, sans-serif; text-align: center; }
.masthead h1 { font-size: 41px; color: #000000; font-weight: bold; line-height: 46px; margin-top: 30px; }
.masthead h2 { font-size: 24px; color: #444444; font-weight: normal; line-height: 25px; }
.masthead h3 { font-size: 17px; color: #000000; }

.strapline { font-family: Myriad Pro, Helvetica, Arial, Verdana, sans-serif; color: #000000; font-size: 42px; line-height: 46px; margin-bottom: 20px; margin-top: 30px; text-align: center;}
.suggestion { font-family: Myriad Pro, Helvetica, Arial, Verdana, sans-serif; color: #000000; font-size: 18px; margin-bottom: 20px; margin-top: 30px; text-align: center;}

/* Global Content 
---------------------------------------------------------------------- */
#content { }


/* Global Create Account Button
---------------------------------------------------------------------- */
a.createaccountbutton {
    background-image:url(../img/button_createaccount.jpg);
    background-position:center top;
    background-repeat:no-repeat;
    color:#FFFFFF;
    cursor:pointer;
    display:block;
    font-family:Myriad Pro,Arial,Helvetica,Verdana,sans-serif;
    font-size:24px;
    font-style:italic;
    height:50px;
    padding-top:10px;
}

/* Global Thumbs
---------------------------------------------------------------------- */
.thumbnail{ position: relative; }

.thumbnail .open { position: absolute; display: block; }

.thumbnail .openThin {
    background: transparent url(../img/openIcon.png) no-repeat 0 0;
    width: 21px;
    height: 20px;
    top:0px;
    right: -10px;
}
.thumbnail:hover .openThin { background: transparent url(../img/openIcon.png) no-repeat 0 -20px; }

.thumbnail .openThick { 
    background: transparent url(../img/openIconThick.png) no-repeat 0 0;
    width: 31px;
    height: 30px;
    top:-14px;
    right: -13px;
}
.thumbnail:hover .openThick { background: transparent url(../img/openIconThick.png) no-repeat 0 -30px; }



/* Special Styling */
.rounded { -moz-border-radius: 6px; -webkit-border-radius: 6px; }
.roundNW { -moz-border-radius-topleft: 6px; -webkit-border-top-left-radius: 6px; }
.roundNE { -moz-border-radius-topright: 6px; -webkit-border-top-right-radius: 6px; }
.roundSW { -moz-border-radius-bottomleft: 6px; -webkit-border-bottom-left-radius: 6px; }
.roundSE { -moz-border-radius-bottomright: 6px; -webkit-border-bottom-right-radius: 6px; }


/* Drop Shadows
----------------------------------------------------------------------------------- */
.img-shadow {
  clear: both;
  float:left;
  background: url(../img/effects/shadowAlpha.png) no-repeat bottom right !important;
  background: url(../img/effects/shadow.gif) no-repeat bottom right;
  margin: 20px 0 0 17px !important;
  margin: 20px 0 0 8px;
}

.img-shadow img {
  display: block;
  position: relative;
  background-color: #fff;
  border: 1px solid #a9a9a9;
  margin: -6px 6px 6px -6px;
  padding: 4px;

}

.p-shadow {
  clear: both;
  width: 90%;
  float:left;
  background: url(../img/effects/shadowAlpha.png) no-repeat bottom right !important;
  background: url(../img/effects/shadow.gif) no-repeat bottom right;
  margin: 10px 0 0 10px !important;
  margin: 10px 0 0 5px;
}

.p-shadow div {
  background: none !important;
  background: url(../img/effects/shadow2.gif) no-repeat left top;
  padding: 0 !important;
  padding: 0 6px 6px 0;
}

.p-shadow p {
  color: #777;
  background-color: #fff;
  font: italic 1em georgia, serif;
  border: 1px solid #a9a9a9;
  padding: 4px;
  margin: -6px 6px 6px -6px !important;
  margin: 0;
}


a.button {
	padding: 7px 20px;
	background: #fff url(../img/bg_button-primary.gif) bottom left repeat-x;
	font-weight: bold;
	-webkit-box-shadow: 0 0 5px #ccc;
    -moz-box-shadow: 0 0 5px #ccc;
	box-shadow: 0 0 5px #ccc;
	cursor: pointer;
	font-size: 14px;
	webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	border: #0099cc solid 2px;
	color: #333;
	font-weight: bold;
	}
a.button:hover {
	border: #333 solid 2px;
	color: #000;
	text-decoration: none;
	}
a.button:active {
	border: #999 solid 2px;
	color: #999;
	}
a.linkbutton { background-color : transparent; border: none; display: inline-block; cursor: pointer; vertical-align: middle; text-align:center; padding: 5px 10px; text-decoration: underline; white-space: nowrap; }

/* Generic Sliding Door Button
----------------------------------------------------------------------------------- */
.slidingButton { border: none !important; display: inline-block !important; position: relative !important; cursor: pointer; }
.slidingButton span { position: absolute !important; top: 0 !important; left: 100% !important; }
.slidingButton:hover {  }
.slidingButton:hover span {  }

/* Small Orange Sliding Door Button
----------------------------------------------------------------------------------- */
.slidingButtonSmallOrange {
    color:          #FFFFFF;
    font-weight:    bold;
    font-style:     normal;
    text-decoration:none;
    font-size:      16px;
    
    height:         24px;   /* padding-top PLUS height should EQUAL the actual height of the image */
    padding-top:    6px;    /* padding-top PLUS height should EQUAL the actual height of the image */
    padding-left:   12px;   /* thankfully, this works as expected ! */
    padding-right:  2px;    /* padding-right should be EQUAL to padding-left MINUS the width of the SPAN below */
    margin-left:    -10px;  /* margin-left should be EQUAL to the width of the SPAN below if you want this button to be centered */

    background: transparent url(../img/buttons/buttonSmallOrangeSliding.png) no-repeat left top;
}
.slidingButtonSmallOrange span{ width: 10px; height: 30px; background: transparent url(../img/buttons/buttonSmallOrangeSliding.png) no-repeat right top; }

.slidingButtonSmallOrange:hover{ color: #FFFFFF; background: transparent url(../img/buttons/buttonSmallOrangeSliding.png) no-repeat left -30px ; }
.slidingButtonSmallOrange:hover span{ color: #FFFFFF; background: transparent url(../img/buttons/buttonSmallOrangeSliding.png) no-repeat right -30px; }

.slidingButtonSmallOrange.disabled { color: #FFFFFF; background: transparent url(../img/buttons/buttonSmallOrangeSliding.png) no-repeat left bottom; }
.slidingButtonSmallOrange.disabled span { color: #FFFFFF; background: transparent url(../img/buttons/buttonSmallOrangeSliding.png) no-repeat right bottom; }




/* Big Blue Sliding Door Button
----------------------------------------------------------------------------------- */
.slidingButtonBigBlue {
    color: #FFFFFF;
    font-weight: bold;
    font-style: italic;
    text-decoration: none;
    font-size: 25px;
    
    height:         54px;   /* padding-top PLUS height should EQUAL the actual height of the image */
    padding-top:    11px;    /* padding-top PLUS height should EQUAL the actual height of the image */
    padding-left:   30px;   /* thankfully, this works as expected ! */
    padding-right:  20px;    /* padding-right should be EQUAL to padding-left MINUS the width of the SPAN below */
    margin-left:    -10px;  /* margin-left should be EQUAL to the width of the SPAN below if you want this button to be centered */

    background: transparent url(../img/buttons/buttonBlueBigShadowSliding.png) no-repeat top left;
}
.slidingButtonBigBlue span{ width: 15px; height: 65px; background: transparent url(../img/buttons/buttonBlueBigShadowSliding.png) no-repeat top right; }
.slidingButtonBigBlue:hover{ color: #FFFFFF; background: transparent url(../img/buttons/buttonBlueBigShadowSliding.png) no-repeat bottom left; }
.slidingButtonBigBlue:hover span{ color: #FFFFFF; background: transparent url(../img/buttons/buttonBlueBigShadowSliding.png) no-repeat bottom right; }

/* About Us Page
-------------------------------------------------------------------- */
.teamMember { margin-bottom: 20px; }

/* Privacy Page
---------------------------------------------------------------------- */
.importantPoint { text-transform: uppercase; }

#normalese { margin: 15px 0 15px 0; padding: 20px 0 20px 0; border: solid black; text-align: center; }
#normalese h2 { text-transform: uppercase; }
#normalese ul { list-style: none; } 

#legalese ol { list-style: decimal; }
#legalese ul { list-style: square;  }
#legalese h2 { text-transform: uppercase; text-align: center; }
#legalese h3 { text-transform: lowercase; }

/* Grid Testing Code (uncomment to enable)
---------------------------------------------------------------------- */

/*

.container_12{
    background-image:url(../img/12_col.gif);
    background-repeat: repeat-y;
}

*/

