/*
Bancodepermutas.com.ar
DESCRIPTION: Estilos del sitio
AUTHOR: Revuelta Ignacio
2009
*/

*{
margin: 0;
padding: 0;
}
body{
font-family:Arial,Verdana, Helvetica, sans-serif;
background: #ece8a1 url(../images/bg_site.gif) repeat-x 0 0;
}
a img{border: none }

.pattern{
position: absolute;
left:0;
top:570px;
width: 100%;
height:158px;
background: url(../images/bg_pattern.jpg) repeat-x 0 0;
}
/*MAIN CONTAINER*/
.mainContainer{
position: relative;
margin: 0 auto;
width: 942px;
}
/*END MAIN CONTAINER*/

/*HEADER*/
.header{
position: relative;
height:61px;
overflow: hidden;
}
.header h1 a{
position: absolute;
left:0;
top:0;
width:299px;
height:60px;
overflow: hidden;
text-indent: -9999px;
background: url(../images/logo.jpg) no-repeat 0 0;
}
.header ul.menu{
position: absolute;
left:427px;
top:15px;
width:493px;
height: 31px;
list-style: none;
}
.header .menu a{
float: left;
display: block;
width:117px;
height: 31px;
display: block;
overflow: hidden;
text-indent: -9999px;
background: url(../images/sp_main.gif) no-repeat 0 -33px;
}

/*Menu*/
.header .menu a.about{background-position: 0 -33px;}
.header .menu a.help{width: 131px;background-position: -117px -33px;}
.header .menu a.club{width: 142px;background-position: -248px -33px;}
.header .menu a.contactus{width: 103px;background-position: -390px -33px;}

/*Hover*/
.header .menu a.about:hover{background-position: 0 -64px;}
.header .menu a.help:hover{background-position: -117px -64px;}
.header .menu a.club:hover{background-position: -248px -64px;}
.header .menu a.contactus:hover{background-position: -390px -64px;}

/*Current*/
.header .menu a.about.current{background-position: 0 -95px;}
.header .menu a.help.current{background-position: -117px -95px;}
.header .menu a.club.current{background-position: -248px -95px;}
.header .menu a.contactus.current{background-position: -390px -95px;}
/*END HEADER*/

/*FOOTER*/
.footer{
display: block;
text-align: left;
font-size: 11px;
color: #a0992d;
margin: 7px 0 20px 0;
}
.footer a{color: #a0992d;}
.footer a:hover{color: #4e4b16;}
.copyright,.legal{display: inline;}
/*END FOOTER*/

/*MAIN CONTENT*/
.mainContent{
padding:20px; 
background: #f6f2b5;
}
/*END MAIN CONTENT*/

/*TOP*/
.top{
background: url(../images/sp_top.jpg) no-repeat 0 0;
position: relative;
width: 942px;
height: 89px;
margin-top: 9px;
}
.top .deco{
position: absolute;
left:15px;
top:-18px;
width:266px;
height:103px;
background: url(../images/sp_top.jpg) no-repeat 0 -90px;
}
.top h2{
overflow: hidden;
text-indent: -9999px;
background-image: url(../images/sp_top.jpg);
background-repeat: no-repeat;
position: absolute;
left: 292px;
top: 21px;
width:301px;
height:50px;
}

.top.home{
background: url(../images/sp_top_home.jpg) no-repeat 0 0;
width: 940px;
height: 176px;
margin-top: 5px;
}
.top.home h2,.top.home .deco{
background: none;
}
.top.home .accessSimulator{
font-size: 14px;
color: #FFF;
font-weight: Bold;
position: absolute;
left:648px;
top:142px;
}
/*Top secciones*/
.textList{background-position:-267px -89px;}
.textDetails{background-position:-569px -190px;}
.textPermutar{background-position:-266px -140px;}

.textAbout{background-position:-569px -89px;}
.textHelp{background-position:-569px -140px}
.textContactus{background-position:-267px -190px;}
.textLegal{background-position:-267px -242px;}
.textClub{background-position:-569px -242px;}

/*END TOP*/

/*LEFT COLUMN*/
.leftColumn{
float: left;
display: block;
width: 233px;
}
.leftColumn .userResults h3,.banners h3{
font-size: 14px;
display: block;
color: #443a08;
margin-bottom:9px;
padding-bottom:7px;
border-bottom: 1px solid #c3bf82;
}
.leftColumn .userResults .data{
margin-bottom: 20px;
color: #41b800;
font-size: 12px;
font-weight: bold;
}

/*Banners*/
.adBig .banner.ppg{
display:block;
float:left;
margin-right:14px;
}
.leftColumn .banners a{
display: block;
margin-bottom: 5px;
text-align: center;
}
.banners img{
border: 2px solid #dcca70;
}

/*END LEFT COLUMN*/

/*PAGE CONTENT*/
.pageContent{
margin-left: 260px;
}
/*Page footer*/
.pageFooter{
padding-top: 10px;
text-align: right;
display: block;
height: 30px;
border-top:1px solid #c3bf82; 
}
#back,#goTop{
background:transparent url(../images/sp_main.gif) no-repeat scroll -207px 4px;
color:#E87401;
display:block;
float:right;
font-size:11px;
height:21px;
margin-left:11px;
padding:2px 0 1px 18px;
text-align:left;
text-decoration:none;
width:35px;
}
.internal #back,.internal #goTop{padding:6px 0 1px 18px;}

#goTop{background-position: -260px 4px;}
#back:hover,#goTop:hover{color:#c26100;background: url(../images/sp_main.gif) no-repeat -313px 4px;}
#goTop:hover{background-position: -366px 4px;}
/*END PAGE CONTENT*/

/*END NAVIGATION*/

/*COMMON STYLES*/
.clearfloat{clear: both;}
.marginB{margin-bottom: 10px !important }
.noMarginR{margin-right: 0 !important;}
.noMarginB{margin-bottom: 0 !important;}
/*END COMMON STYLES*/

/*SECTION > HOME*/
.application{
display: block;
margin-bottom: 20px;
}
/*END SECTION > HOME*/

/*SECTION > LIST*/
.item{
display:block;
float:left;
height:160px;
margin:0 13px 15px 0;
overflow:hidden;
width:150px; 
}
.item .image img{border: 3px solid #dcca70;}
.item .image:hover img{border: 3px solid #d4be28;}
.itemData{
display: block;
font-size: 11px;
color: #505050;
}
.itemData .title{
display: block;
color: #ff4000;
font-size:14px;
font-weight: bold;
margin: 6px 0 3px 0;
}
.itemData .title:hover{color: #d33500;}
/*END SECTION > LIST*/

/*SECTION > DETAILS*/
#images{
float: left;
display: block;
position: relative;
text-align:left;
}
#images .imgWrapper{
border:3px solid #e6da87;
height:269px;
overflow:hidden;
width:308px;
}
#images .imgWrapper img{
position: absolute;
display: none;
}
.details{height: 280px;}
.details .column{
margin-left: 330px;
padding-top: 10px;
font-size: 14px;
}
.details .column h2{
display: block;
color: #4c9c00;
font-size: 18px;
font-weight: bold;
letter-spacing: -1px;
border-bottom: 1px solid #c4c079;
margin-bottom: 10px;
padding-bottom: 8px;
}
.infoWrapper{
display: block;
border-bottom: 1px solid #c4c079;
margin-bottom: 10px;
padding-bottom: 8px;
font-weight: bold;
}
.infoWrapper .label{
float: left;
display: block;
color: #ff4000;
}
.infoWrapper .data{
margin-left: 69px;
color: #039ba6;
}
.details .brief{
display: block;
margin-bottom: 20px;
color: #505050;
font-size: 12px;
font-weight: bold;
}
.details a{
display: block;
overflow: hidden;
background: url(../images/sp_buttons.gif) no-repeat 0 0;
width: 142px;
height:29px;
text-decoration: none;
color: #FFF;
font-size: 14px;
font-weight: bold;
text-align: center;
padding-top: 12px;
}
.details a:hover{background-position: 0 -50px;}
.description{
border-top: 1px solid #c4c079;
margin:10px 0;
padding: 8px 0 0 0;
font-size: 12px;
color: #505050;
line-height: 22px;
}
/*END SECTION > DETAILS*/

/*SECTION > PERMUTAR*/
.permutaDetail{
display: block;
font-size: 12px;
font-weight: bold;
height: 120px;
border-bottom: 1px solid #c4c079;
margin-bottom: 10px;
}
.permutaDetail .thumb{
float: left;
display: block;
border: 3px solid #dcca70;
}
.permutaDetail .column{margin-left: 165px;}
.permutaDetail .data{
margin: 5px 0 10px 0;
font-size: 14px;
color: #887103;
}
.requiredTitle{
font-size: 12px;
font-weight: bold;
color: #887103;
margin-bottom: 8px;
}
.group{
padding: 10px 17px;
margin-bottom: 10px;
background: #f1eb92;
}
.formField{
display: block;
margin-bottom: 10px;
}
.formField label{
float: left;
display: block;
padding-top: 3px;
font-size: 12px;
font-weight: bold;
color: #8f8121;
}
.formField .column{
position: relative;
margin-left: 125px;
}
.formField .mandatory{
position: absolute;
top: 2px;
left: 363px;
font-size: 18px;
color:#c4c079;
width: 10px;
height: 10px;
}
.formField input,textarea{
border: 1px solid #CCC;
padding: 3px;
font-family:Arial,Verdana, Helvetica, sans-serif;
font-size: 11px;
color: #505050;
background:#FFF;
width: 350px;
} 

.formField input.send{
border: none;
display: block;
overflow: hidden;
background: url(../images/sp_buttons.gif) no-repeat 0 -100px;
width: 142px;
height:42px;
text-decoration: none;
color: #FFF;
font-size: 14px;
font-weight: bold;
text-align: center;
padding-top: 0;
cursor: pointer;
}
.formField input.send:hover{background-position: 0 -150px;}

/*END SECTION > PERMUTAR*/

/*SECTION > HELP*/
#about,#help,#club,#contactus{
color: #63521e;
text-align: justify;
}
#about,#help,#club{
font-size: 14px;
line-height: 24px;
}
#about h3,#help h3,#club h3, #contactus h3{
color:#1a1700;
font-weight: bold;
font-size: 14px;
display: block;
}
/*About*/
.aboutData{
border-bottom: 1px solid #c4c079;
margin-bottom: 15px;
padding: 12px 0;
text-align: justify;
}
#about .step a{
color: #ff7f01;
}
.aboutLinks{
display: block;
margin-top: 10px;
text-align: center;
line-height: 28px;
}
.aboutLinks a{
font-size: 14px;
font-weight: bold;
color: #ff7f01;
}

/*Club*/
#club .leftColumn{
width: 245px;
}
#club .leftColumn img{
border-bottom: 1px solid #c4c079;
margin-bottom: 10px;
padding-bottom: 20px;
}
#club .leftColumn .step{
font-size: 12px;
line-height: 19px;
width: 230px;
text-align: left;
}
#club .leftColumn h3,#club .benefits p{margin-bottom: 10px;}
#club .leftColumn h3,#club .leftColumn a{color: #fb7925;}

.clubData{
border-bottom: 1px solid #c4c079;
margin-bottom: 15px;
padding: 12px 0;
text-align: justify;
}
.becomeMember{
position: relative;
border-top: 1px solid #c4c079;
margin-top: 15px;
padding-top: 10px;
height: 70px;
text-align: center;
}
.becomeMember a{
border: none;
display: block;
overflow: hidden;
background: url(../images/sp_buttons.gif) no-repeat 0 0;
width: 142px;
height:35px;
margin: 0 auto;
text-decoration: none;
color: #FFF;
font-size: 14px;
font-weight: bold;
text-align: center;
padding-top: 8px;
cursor: pointer;
}
.becomeMember a:hover{background-position: 0 -50px;}
.isFree{
color:#1A1700;
font-size:14px;
font-weight:bold;
}

/*Help*/
.intro{margin-bottom: 20px;}
.step{
display: block;
margin-bottom: 20px;
}
.more{margin-bottom: 10px;}
.more a{color: #ff7f01;}

/*Contactus*/
.contact .text{
border-bottom: 1px solid #c4c079;
margin-bottom: 15px;
padding-bottom: 7px;
font-weight: bold;
font-size: 14px;
line-height: 20px;
}
/*END SECTION > HELP*/

/*SIGND AND VALIDATION*/
.sign{
display: block;
font-size: 12px;
font-weight: bold;
padding: 10px 14px;
margin: 10px 0;
}
.sign.success{
background: #4ca606;
color: #FFF; 
}
.sign.success strong{
display: block;
font-size: 14px;
margin-bottom: 2px;
color: #85ff12;
}
.sign.error{
background: #a60624;
color: #FFF; 
}

/*Validation*/
.error{
border:1px solid #990000 !important;
color: #990000 !important;
background:#F1C5C5 !important;
}

/*END SIGND AND VALIDATION*/