/*
PATAPAGE css classes
2009 - Open Lab - Matteo Bicocchi
*/



body{
    background: #EFE7D2 url("../images/bgnds/bgnd.jpg") repeat-x;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    color: #2F2406;
    margin: 0;
}
a:link, a:visited {color:#00526F}
a:hover {color:#00ACCF;}
.smallBtn {
  color: #00526F;
  text-decoration:underline
}
.smallBtn:hover {
  background-color: #FFE79F;
  color: #6F5A1B;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  text-decoration:none
}


tbody {
  font-family: arial,sans-serif;
  font-size: 12px;
  margin:0;
  color: #2F2406;
  text-decoration: none;
}
#bo, #site{
  width:100%;
  position:relative;
}
#pataLogo{
  position:relative;
  padding-top:12px;
  z-index:2000;
  float:left;
}
#site #pp_wrapper{
  margin:0 auto;
  width:900px;
}



#pataMenuContainer {
  white-space:nowrap;
  z-index:1000;
  top:0;
  float:right;
  padding-top:40px;
  text-align:right;
}
#pataMenu{
  z-index:1000;
  text-align:right;
}
#pataMenu a.menuVoice{
  font-family: Arial, Helvetica, sans-serif;
  color:white;
  text-shadow: #666 1px 1px 2px;
  padding:5px;
  font-size:16px
}

#pataMenu a:link.menuVoice {
  color: #fff !important
}

#pataMenu a.menuVoice.logoff{
  font-family: Arial, Helvetica, sans-serif;
  text-shadow: #4F412C 1px 1px 2px;
  font-weight: 700 !important;
  color: #F0DD7A !important;
  padding:5px 12px 5px 5px !important;
  font-size:16px;
}

#pataMenu a.menuVoice.login{
  font-family: Arial, Helvetica, sans-serif;
  text-shadow: #4F412C 1px 1px 2px;
  font-weight: 700 !important;
  color: #F0DD7A !important;
  padding:5px 12px 5px 5px !important;
  font-size:16px;
/*background: url("../images/icons/user.png") no-repeat right top;*/
}

#pataMenu a:hover span {
  color: #F0DD7A !important
}

#pataMenu a.login:hover span, #pataMenu a.logoff:hover span {
  color: #FDC500 !important
}


#pp_header{
  position:relative;
  margin-left:0px;
  margin-top:-115px;
  padding:10px 0 10px 10px;
  height:120px;
  width:300px;
}
#pp_logo{
  position:absolute;
  left:35px;
  top:40px;
}
#pp_content{
  padding:30px;
  padding-left:40px;
  margin-top:0px;
  font: 14px/16px "Trebuchet MS", "Lucida Grande", Verdana, sans-serif;
}

#pp_content p{
  font: 16px/20px "Trebuchet MS", "Lucida Grande", Verdana, sans-serif;
}
#pp_content h1{
  color:white;
  font: 46px/46px "Helvetica",Georgia,serif;
  margin-bottom:20px;
  margin-top:20px;
  text-shadow:#cc9900 1px 1px 2px;
  font-weight:bold;
  font-style:normal;
}
.pp_pataHeroLogin {
  background: url("../images/bgnds/pataHeroLogin.png") left top;
  margin-top: -100px;
  height:577px;
  width:375px;
}

.pp_pataHeroSignup{
  background: url("../images/bgnds/pataHeroSignup.png") no-repeat right 40px;
  padding-right:220px;
  }

.pp_pataHeroLogin h2 {
  color:#00434E;
  font-size:16px;
  margin-top:10px;
  text-shadow:#FFC63F 0px 1px 1px;
}
div#pataButtons h2{
  color:#1A515C;
  margin:0;
  padding:0;
  font-family: Arial, Helvetica, sans-serif;
  font-size:24px;
  text-shadow:#EFECE0 0px 1px 1px;
}

.enrollMail input {
  font-size:12px;
  height: 28px;
  margin-bottom:5px;
  border-color: #8BC7DF
}

input#OPENID {
  height: 22px;
}

input {
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
}
textarea, select {
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
}

.fieldLabel, .fieldLabelPWD {
  color: #fff; font-weight: bold;
}

.fieldLabelPWD input {
  padding-right: 16px
}

.enrollBox {
  width: 560px;
}

.enrollField input{
  font-size:12px;
  height: 22px;
  margin-bottom:5px;
  border-color: #BFAF8F;
  color: #7F7F7F
}

/* STATIC PAGES */

.containerWrapper {
  padding:0 15px
}

.containerWrapper p {
  margin-top:0
}
.containerWrapper code {
  color: #008000;
  background-color:#f8f5e4;
  display:block;
}

.toggleBtn {
  font-size:10px;
  padding:3px;
  line-height:18px;
  cursor:pointer;
  display:inline;
  color:white;
  background-color:#39616B;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
}

a.toggleBtn {
  color:white;
  text-decoration: none;
  text-transform: uppercase
}

.pp-title {
  font-size:38px; color:#00626F; font-weight:normal; letter-spacing: -1px; margin:0; padding:0
}

.pp-subtitle{
  font-size:14px; color:#2F2406; font-weight:normal; margin:20px 0 10px 0; padding:0
}

.pp-paragraph{
  font-size:12px; font-weight:bold; margin:10px 0 10px 40px; padding:0
}

.pp-blockTitle {
  color:#00626F;
  font-style:italic;
  font-size:22px;
  margin-bottom:5px
}

.pataHero {
  position:absolute;
/*float: right;*/
  margin-left:540px;
  bottom: 15px;
  width:329px;
  height:357px;
  background: url("../images/elements/pataHero.png") no-repeat;
}

.ppApi {
  float: right;
  top: 50px;
  width:223px;
  height:148px;
  background: url("../images/elements/api.png") no-repeat;
}

.pp-highlightedBox {
  width:280px; padding:10px;
  background: url("../images/elements/OL_icon.png") no-repeat top right;
  margin-bottom:10px;
  -webkit-border-radius:8px;
  -moz-border-radius:8px;
}

.pp-highlightedBox a:link, .pp-highlightedBox a:visited{
  /*color: #BF8B00*/
}
.pp-highlightedBox a:hover{
  /*color: #EFAE00*/
}

blockquote {
  margin: 5px 0 25px 15px
}

#pp_content #tryIt h2{
  font: 25px/32px "Trebuchet MS", "Lucida Grande", Verdana, sans-serif;
  margin-bottom:15px;
  color:#fff;
}

#pp_content #tryIt h3{
  font: 19px/24px "Trebuchet MS", "Lucida Grande", Verdana, sans-serif;
  margin-bottom:25px;
  color:#00434E;
  font-style:italic;
}

#pp_content ul{
  margin:25px;
}

#pp_content ul li{
  font: 18px/24px "Trebuchet MS", "Lucida Grande", Verdana, sans-serif;
  color: #003366;
  text-shadow: 0 0;
}

#pp_footer{
  color: #fff ;
  font: 18px/23px "Trebuchet MS", "Lucida Grande", Verdana, sans-serif;
  min-width: 100px;
}

.footer{
  position:relative;
  text-align:left;
  margin-right:20px;
  font-family: Arial, Helvetica, sans-serif;
  color:#00292F;
  font-size:13px;
  padding-left: 20px;
  background: url("../../images/footerIcon.png") center left no-repeat;
    width:600px
}
.footer a{
  font-family: Arial, Helvetica, sans-serif;
  color:#00626F;
  font-size:11px;
  font-weight:700;
  text-decoration:none
}

.footer a:hover{
  color:#00ACCF;
  text-decoration:none
}

#pp_footer { z-index:1000; width:198px; float:right;}
.socialBar {
height:20px;
margin-top:10px;
width:198px;
}

/* INDEX CSS*/

.overlay {
  width:100%;
  height:100%;
  top:0;
  left:0;
  position:fixed;
  background: url("../images/bgnds/black_50.png");
}
.overlayTransparent{
  background: transparent url("");
}

#demoExplanations {
  width:400px;
  height:260px;
  position:fixed;
  left:50%;
  margin-left:-200px;
  top:50%;
  padding:20px;
  padding-left:30px;
  padding-right:30px;
  margin-top: -220px;
  background: white;
  border: 1px solid gray;
  -moz-border-radius:15px;
  -webkit-border-radius:15px;
  -moz-box-shadow: 1px 1px 4px #333;
  -webkit-box-shadow: 1px 1px 4px #333;
}

.demoExplanationsDesc{
  font:18px/20px Arial;
}

.demoExplanationsDesc h1{
  margin-top:8px;
  font:24px/28px Arial;
  color:#2eb5cd;
}

.overlayWindow {
  position:fixed;
  left:50%;
  margin-left:-420px;
  top:10%;
  background: white;
  padding:10px;
  -moz-border-radius:10px;
  -webkit-border-radius:10px;
  -moz-box-shadow: 1px 1px 4px #333;
  -webkit-box-shadow: 1px 1px 4px #333;
}

#lizStory {
  width:853px;
  height:530px;
  top:50%;
  padding:20px;
  margin-top: -300px;
  background: white url("../images/bgnds/story.jpg") repeat-y 430px;
  -moz-border-radius:15px;
  -webkit-border-radius:15px;
}

.storyImages {
  width:475px;
  height:90%;
}

#storyText{
  font-family: Georgia,serif;
  font-size:12px;
  line-height:17px;
/*color:#918561;*/
  color:black;
  width:430px;
  height:100%;
  float:right;
  overflow:hidden;
}

#storyText div{
  padding:5px;
}

#switch{
  position:absolute;
  right:20px;
  bottom:20px;
  cursor:pointer;
  color: #b0a37e;
  font-style:italic;
  font-size:16px
}

#pageheader{
  position:absolute;
  color: #b0a37e;
  right:40px;
  font-style:italic;
  top:6px;
  font-size:10px
}

.overlayClose {
  position:absolute;
  right:-15px;
  top:-10px;
  cursor:pointer;
}

/*PATABUTTONS*/

#moreLinks{
  color:white;
  margin-left:515px;
  width:285px;
  padding-left:10px;
  padding-top:10px;
  padding-bottom:5px;
  margin-top:10px;
  display:block;
  -moz-border-radius:4px;
  -webkit-border-radius:4px;
}

#moreLinks a{
  color: #2d271b;
  text-shadow:#EFEFEF 0px 1px 1px;
  text-decoration:none;

}#moreLinks a:hover{
  color: #2d271b;
  text-decoration:underline;
}

#moreLinks span{
  left: 65px;
  padding:15px 0 15px 0;
  line-height:50px
}

#moreLinks img{
  float:left;
  padding-bottom:10px
}

.showOverlay1 {
  width:226px;
  padding:0px 4px 0 0;
  height:139px;
  display:inline-block;
  float:left;
}

.showOverlay1:hover{
  background: transparent url("../images/bgnds/videoThumbHover.png") no-repeat -5px center;
}

.showOverlay2 {
  width:294px;
  padding:0px 2px 0 2px;
  height:139px;
  display:inline-block;
  float:left;
}

.showOverlay2:hover{
  background: transparent url("../images/bgnds/storyThumbHover.png") no-repeat;
}

#buttonsDesc{
  margin-top:30px;
}

#pataButtons {
  width:450px;
  float:left;
  margin-left:25px;
  font-size:13px;
}

#pp_content #pataButtons  {
}

#pataButtons div{
/*margin-top:2px;*/
  padding: 0 0 30px 0;
  margin-bottom:0;
  color:#514632;
  font-weight:normal;
  clear:both;
  -moz-border-radius:4px;
  -webkit-border-radius:4px;
  cursor:pointer;
}

#pataButtons div img{
  position:relative;
  float:left;
  top:0px;
}

.underConstruction{
  display:inline-block;
  /*width:100px;*/
  margin-top:5px;
  padding:0 4px 0 4px;
  color: white;
  background-color:#EFA800;
  -moz-border-radius:3px;
  -webkit-border-radius:3px;
}

#pp_content #tryIt{
  background:  url("../images/bgnds/container_try.png") no-repeat 0px 0px;
    height:340px;
    margin:0;
    padding: 0;
    width:860px;
}

#pp_content #tryIt #yourWebsite {
  font: 18px/15px "Trebuchet MS", "Lucida Grande", Verdana, sans-serif;
  color: #666666;
  background:#ffffff;
  width:440px;
/*height:65px;*/
  padding:19px;
  margin:0 2px 0 5px;
  border:0px solid #fbe250;
  background: url("../images/bgnds/fieldBgnd.jpg") no-repeat top left;
}

#pp_content #tryIt #tryItLabel {
  font: 14px/15px "Trebuchet MS", "Lucida Grande", Verdana, sans-serif;
  color:#00434E
}

#pp_content #tryIt #goToSite {
  font:18px/18px arial, Helvetica, sans-serif;;
  background: url("../images/elements/tryBtn.png") no-repeat 3px top;
  text-align:center;
  display:block;
  color:white;
  padding:17px 15px 18px 15px;
  margin:0;
  text-shadow:#025996 0px 1px 1px;
  cursor:pointer
}

#pp_content #tryIt #goToSite:hover {
  text-decoration:none;
  color:white;
  background: url("../images/elements/tryBtn.png") no-repeat ;
  background-position: 3px -59px;
}

#pp_content #tryIt input#yourWebsite.alert{
  color: #cc0033;
}

.urlExample{
  color:#8F6823;
  padding-left:134px;
  padding-top:0px;
  margin-top:5px;
  font:12px/13px "Trebuchet MS", "Lucida Grande", Verdana, sans-serif !important;
  text-shadow: #FDC500 0px 0px 0px !important;
}

.collectData {
  width:220px;
  display:block;
  margin-top:0;
  margin-left:530px;
  padding:5px;
  color: #514632;
  font-size:11px;
}

.sticker {
  padding:0 2px 0 2px;
  color:#ffffff;
  background-color:#14b4dc;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
}

.suggestedPaypalButton{
  border:2px dotted yellow;
}

td.priceBasic {
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
}
