* {
	margin:0;
	padding:0;
	border: 0;
}

html {
	 margin:0;
	 padding:0;
}


body {
	margin:0;
	padding:0;
	font-family: Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#333333;
}

[type=reset], [type=submit], button, html [type=button] {
    -webkit-appearance: button;
}

p{
	margin:0;
	padding:0;
}
form, input, div, dl, dt, dd, ul, ol, li, blockquote, fieldset, th, td {
	margin:0;
	padding:0;
}

select {
	color:#000;
	background-color:#fff;
}
:focus {outline:none;}
 

/*------------------------------------------------------*
  *--------    CSS BLOCS     						 ----*
  *------------------------------------------------------*/

#general{
	margin:0 auto;
	padding:0;
	width:100%;
	background-color:#ffffff;
}

#conteneur, #blanc{
	margin:0 auto;
	padding:0;
	width:1262px;
}

#header {
    margin: 0 auto;
    padding: 0;
    width: 100%;
    height: 150px;
    background-color: #0e3083;
}

#header img.sofaxis {
    margin: 0 0 0 47px;
    padding: 0;
    display: block;
    float: left;
    border: none;
    background-image: url(../imgs/sofaxis.jpg);
    background-position: top left;
    background-repeat: no-repeat;
    width: 361px;
    height: 139px;
}
#header p{
	margin:19px 50px 0 0;
	padding:0;
	font-family:Arial, Helvetica, sans-serif;
	font-size:20px;
	line-height:26px;
	color: #FFF;
	font-weight:normal;
	text-align:right;
	float:right;
	display:block;
}
#header p.offrhead {
    margin: 44px 0 0 128px;
    padding: 0;
    font-family: "Arial Black", Arial, Helvetica, sans-serif;
    font-size: 28px;
    line-height: 26px;
    color: #FFF;
    font-weight: bold;
    text-align: center;
    float: left;
    display: block;
    text-transform: uppercase;
}
#header p strong{
	font-size:25px;

}
#header p.partenariat {
    margin: 42px 0 0 195px;
    padding: 0;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    line-height: 19px;
    color: #FFF;
    font-weight: normal;
    text-align: left;
    float: left;
    display: block;
}
#header p.partenariat img {
    margin: 0 0 0 0;
    padding: 3px 0 0 0;
    background-image: none;
    display: block;
    float: none;
    border: none;
}

.credit-municipal-avignon {
	float: left;
	height: 143px;
	width: auto;
}
p.lettre{
	margin:0 auto 26px auto;
	padding:0 0 0 75px ;
	font-family:Arial, Helvetica, sans-serif;
	font-size:16px;
	line-height:24px;
	color: #707173;
	font-weight:normal;
	text-align:left;
/*	float:left;*/
	display:block;
	background-image: url(../imgs/lettre.jpg);
	background-position:top left;
	background-repeat: no-repeat;
	width:468px;
}
p.lettre strong{
	color:#707173;
	font-size:18px;
}

#conteneurformulaire{
	margin:0 auto 35px auto;
	padding:0 0 0 0;
	width:100%;
	clear:both;
	background-color: #e2e8ec;
	overflow:hidden;
}

/*#conteneurformulaire div#formulaire a.teldocu {
	border-width:0;
	background-color:#f17030;
	color:#FFF;
	font-family:Arial, Helvetica, sans-serif;
	font-weight:bold;
	font-size:14px;
	text-transform:uppercase;
	padding:6px 15px 6px 14px;
	margin:10px auto 0;
	display:block;
	text-decoration:none;
	width:266px;
}*/
div#formulaire a.teldocu {
	border-width:0;
	background-color:#f17030;
	color:#FFF;
	font-family:Arial, Helvetica, sans-serif;
	font-weight:bold;
	font-size:14px;
	text-transform:uppercase;
	padding:6px 15px 6px 14px;
	margin:10px auto 0;
	display:block;
	text-decoration:none;
	width:266px;
}


#conteneurformulaire div#formulaire div#phony {
	width:73px;
	height:73px;
	margin:15px auto;
	padding:0;
	background-image: url(../imgs/phone.jpg);
	background-position:top center;
	background-repeat:no-repeat;
	display:block;
	
	}
	
	
	
	
	
	
div.informeouinon {
	overflow:hidden;
	margin:0 15px 30px 0;
	display:block;
	width:517px;
	color:#a3a3a3;
	background-color: #FFF;
	text-align:left;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	border-color:#cccccc;
	border-style:solid;
	border-width:1px;
	padding:11px 7px;
	float:left;
	}
	
div.informeouinon p {
color:#7c7878;
	text-align:left;
	padding:0;
	margin:0 0 0 0 !important;
	font-weight:bold;	
	}
	
div.informeouinon div {
	width:50%;
	float:left;	
	}	
	
div.informeouinon input {	
  width:auto !important;
  height:20px;
  transition: 0.2s all linear;
  margin-right:0;
 position: relative;
  vertical-align: middle;
  margin-left:3px;	
	}	
	
div.informeouinon label {
	color:#a3a3a3;
	float:none !important;
	padding:0 !important;
	border-width:0px !important;
	
	}
div.informeouinon .title-prevoyance {
	
	}
div.informeouinon .title-epargne {
	padding-right: 18px;
	}
		
		
	
	
div#phony img{
	width:73px;
	height:73px;
	margin:0 auto;
	padding:0;
	display:block;
	border:none;	
	}


#left{
	margin:0;
	padding:0;
	width:592px;
	min-height:700px;
	float:left;
	background-color:#e3e8ec;
	background-image: url(../imgs/conserver-votre-niveau-vie.jpg);
	background-position:top left;
	background-repeat: no-repeat;

}
#left p{
	margin:0 0 56px 0;
	padding:0;
	color:#ffffff;
	font-size:14px;
}

#right{
	margin:0;
	padding:7px 0 0 25px;
	width:645px;
	float:left;
	background-color:#e2e8ec;
	min-height:675px;
}

#loader_container {
	margin:91px auto 124px auto;
	padding:0;
	color:#2249a6;
	font-size:14px;
	text-align:left;
	width:272px;
	height:75px;
	}

#loader_container img {
	margin:0 0 0 91px !important;
	padding:0 !important;
	display:block;
	width:48px;
	height:48px;
	}

#formulaire{
	margin:0 auto;
	padding:35px 23px 20px 40px;
	width:552px;
	float:none;
}
#formulaire form {
	margin:0 auto;
	padding:0;
	width:100%;
	display:block;
	overflow:hidden;
	
}
#formulaire form label {
	margin:0 15px 15px 0;
	padding:11px 7px;
	width:243px;
	float:left;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	border-color:#cccccc;
	border-style:solid;
	border-width:1px;
	background-color: #fff;
}
#formulaire form label.madamemonsieur {
	margin:0;
	padding:0;
	width:243px;
	margin-left: 2px;
	float:left;
	border: none;
	background-color: #F3F3F3;
}

#formulaire form label, #formulaire form label.selectfo select, #formulaire form label.civilited, #formulaire form label span {
	font-family:Arial, Helvetica, sans-serif;
	font-size:13px;
	color:#a3a3a3;
	}
	
#formulaire form label.civilited {
	margin:0 19px 15px 0;
	padding:0;
	width:80px;
	float:left;
	border-width:0;
	background-color: #F3F3F3;
}
#formulaire form label.civilited input {
	margin:0 7px 0 0;
	width:13px;
	height:13px;

}
#formulaire form label.adressep {
	margin:0 15px 15px 0;
	padding:11px 7px;
	width:517px;
	float:left;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	border-style:solid;
	border-width:1px;
}
#formulaire form label.adressep .error {
	color: rgb(255,0,0) !important;
	border-color:rgb(255,0,0) !important;
}

#formulaire form label.selectfo  {
}
#formulaire form label.selectfo select {
	border-width: 1px !important;
	border-color:#ffffff;
	border-style:solid;
	width:100%;
	background-color:transparent !important;
	box-sizing: padding-box;
	padding:0;

}

#formulaire form label.selectfo select option {
	border-width: 1px;
	width:100%;
	background-color:transparent !important;
	border-color:#ffffff !important;
	border:none;
}

#formulaire form label input {
	border-width:0;
	width: 100%;
}

#formulaire form input.buttonform {
	border-width:0;
	background-color:#f17030;
	color:#FFF;
	font-family:Arial, Helvetica, sans-serif;
	font-weight:bold;
	font-size:14px;
	text-transform:uppercase;
	padding:6px 15px 5px 14px;
	float:left;
	margin:0 19px 0 0;
}

#formulaire form span.champsobli {
	font-family:Arial, Helvetica, sans-serif;
	font-size:13px;
	color:#a9a9a9;
	float: inherit;
	margin:14px 17px 0 0;

}

#formulaire label.error,input.error {
	background-color: none;
	color: rgb(255,0,0) !important;
	border-color:rgb(255,0,0) !important;
}

div.informeouinon.error {
	background-color: none;
	border-color:rgb(255,0,0) !important;
}
#formulaire form label.civilited.error{
	background-color: none;
	color: rgb(255,0,0);
	border-color:rgb(255,0,0) !important;
}
#formulaire .informe_retraite_optin {
	background-color: none !important;
}


.switch span {
    display: block;
	float:left;
}
.switch input {
    display: none;
}
.switch i {
    background: #fff none repeat scroll 0 0;
    border-radius: 30px;
    box-shadow: 0 0 1px rgba(0, 0, 0, 0.5) inset;
    cursor: pointer;
    display: block;
    margin-top: 0;
    padding-right: 20px;
    transition: all 0.2s ease 0s;
    width: 30px;
	float:right;
}
.switch i::before {
    background: white none repeat scroll 0 0;
    border-radius: 26px;
    box-shadow: 0 0 1px rgba(0, 0, 0, 0.5) inset;
    content: "";
    display: block;
    height: 30px;
    width: 30px;
}
.switch input:checked + i {
    background: #616060 none repeat scroll 0 0;
    box-shadow: 0 0 1px rgba(0, 0, 0, 0.5) inset;
    padding-left: 24px;
    padding-right: 0;
}



#content-blanc {
	margin:0 auto;
	padding:35px 0 35px 0;
	width:100%;
	overflow:hidden;
	background-color:#FFF;
	display:none;

}



.bloc, .blocbleu{
	margin:0 auto;
	padding:87px 35px 107px 35px;
	width:245px;
	color:#000;
	font-family:Arial, Helvetica, sans-serif;
	text-align:center;
	font-size:15px;
	line-height:18px;
	border-color: #eeeeef;
	border-style:solid;
	border-width:0 1px 0 0;
	float:left;
	display:block;
}

.sansbor {
	border-width:0 !important ;
	}

.blocbleu {
	padding:87px 36px 73px 24px;
	width:215px;
	color:#fffff;
	border-width:0 ;
	background-image: url(../imgs/background-bloc-bleu.jpg);
	background-position:top left;
	background-repeat: no-repeat;
	
}

.blocbleu h3 {
	color:#FFF;

}


.blocbleu p{
	color:#FFF;

}

.bloclist{
	background-image: url(../imgs/coeur.jpg);
	background-position:center top;
	background-repeat:no-repeat;
	font-size:17px;
	text-align:center;
	font-weight:normal;
	color:#0e3083;
	margin:0 12px 0 14px;
	padding:90px 0 0 0;
	float:left;
	display:block;
	width:175px;
}

.bloclist#calculatrice{
	background-image: url(../imgs/calculatrice.jpg);

}
.bloclist#tirelire{
	background-image: url(../imgs/tirelire.jpg);

}

.blocbas {
	margin:0 0 20px 0 ;
	padding:25px 37px 20px 37px;
	border-color:#eeeeee;
	border-width:0 1px 0 0;
	border-style:solid;
	float:left;
	width:345px;
	text-align:center;
	height:197px;
	}

	
.blocbas h3 {
	margin:0 auto 25px auto ;
	padding:0;
	font-size:19px;
	color:#0085ca;
	font-weight:bold;
	}
.blocbas p {
	margin:0 ;
	padding:0;
	font-size:15px;
	color:#484747;
	}
.blocbasrouge {
	margin:0 0 20px 0 ;
	padding:90px 49px 70px 27px;
	border-color:#eeeeee;
	border-width:0;
	border-style:solid;
	float:left;
	width:345px;
	text-align:center;
	background-image: url(../imgs/background-bloc-rouge.jpg);
	background-position:center top;
	background-repeat:no-repeat;
	min-height:205px;
	}
.blocbasrouge  h3 {
	margin:0 auto 25px auto ;
	padding:0;
	font-size:19px;
	color:#ffffff;
	font-weight:bold;
	}
.blocbasrouge  p {
	margin:0 ;
	padding:0;
	font-size:15px;
	color:#ffffff;
	}


#footer{
	margin:0 auto;
	padding:0 10px 10px 10px;
	width:1242px;
	text-align:left;
	color:#565659;
	font-size:11px;
	clear:both;
}

#footer a{
	color:#000000;
	text-decoration: underline;
	font-weight:bold;
}

#footer a:hover{
	color:#000000;
	text-decoration:none;
}


  
h1 {
	margin:0 0 24px 0  ;
	padding:12px 0 0 0;
	color:#0e3083;
	font-size:30px;
	line-height:31px;
	font-family:Arial, Helvetica, sans-serif;
	font-weight:normal;
}
  
h2 {
	margin:0  auto 8px  auto;
	padding:0;
	color:#ffffff;
	font-size:30px;
	font-family:Arial, Helvetica, sans-serif;
	font-weight:bold;
	text-align:left;
}

  
h3 {
	margin:0 0 24px 0;
	padding:0;
	color:#0085ca;
	font-size:19px;

	font-family:Arial, Helvetica, sans-serif;
	font-weight:bold;
	line-height:23px;
}

@media only screen and (max-width: 1261px) {
	
#conteneur, #blanc{
	margin:0 auto;
	padding:0;
	width:640px;
}
#header {
    margin: 0 auto;
    height: 335px;
    padding: 5px 0 0 0;
}
#header img.sofaxis {
    margin: 0 auto;
    float: none;
}
#header p.partenariat {
    margin: 20px 0 0 245px;
}
#header p.offrhead {
    margin: 20px 0 0 45px;
}

#header p strong{
	font-size:21px;

}
.credit-municipal-avignon {
	float: none;
	height: 143px;
	text-align: center;
	margin: 0 auto;
	width: 190px;
	padding-left: 220px;
}
p.lettre{
	line-height:22px;
	float:none;
	margin:0 0 28px 53px;
	padding:3px 0 5px 74px;
	clear:both;
	width:482px;

}
p.lettre strong{
	font-size:18px;
}

#conteneurformulaire{
	background-image:none;
	margin:0 auto;

}

#left{
	margin:0 auto;
	width:640px;
	min-height:347px;
	padding:0;
	background-image:url(../imgs/conserver-votre-niveau-vie-640.jpg);
	background-position:center top;
	background-repeat:no-repeat;
	float:none;
	background-size: auto auto !important;
}

#right{
	margin:0;
	padding:20px 0 0 0;
	width:645px;
	float:none;
	min-height:730px;



}

#formulaire{
	margin:0 auto;
	padding:35px 0px 35px 15px;
	width:552px;
	float:none;
}

.bloc, .blocbleu{
	margin:0 auto 25px ;
	padding:35px;
	width:223px;

}

.sanborsix {
	border-width:0;


}
.blocbas {
	margin:0 0 20px 0 ;
	padding:20px 37px 30px 37px;
	border-color:#eeeeee;
	border-width:0 0 1px 0;
	border-style:solid;
	float:none;
	width:566px;
	text-align:center;
	height:110px;
	}
.blocbasrouge {
	margin:0 0 20px 0 ;
	padding:40px 37px;
	border-color:#eeeeee;
	border-width:0;
	border-style:solid;
	float:none;
	width:566px;
	text-align:center;
	background-image: url(../imgs/background-bloc-rouge-640.jpg);
	background-position:right top;
	background-repeat:no-repeat;
	min-height:130px;
	}

.sansbor {
	border-width:0 0 0 0 !important ;
	}
#content-blanc {
	padding:35px 0 10px 0;


}
.blocbleu {
	padding:35px 32px 29px 19px;
	width:224px;
	background-image: url(../imgs/background-bloc-bleu-640.jpg);
}


.bloclist{

	font-size:14px;
	padding:84px 0 0 0;
	width:156px;
}


#footer{
	margin:0 auto;
	padding:60px 10px 10px 10px;
	width:600px;
}



h1 {
	margin:0 auto 35px auto ;
	padding:0 43px ;
	font-size:29px;
	line-height:31px;



}


}



@media only screen and (max-width: 639px) {
	
#conteneur, #blanc{
	margin:0 auto;
	padding:0;
	width:305px;
}
#header{
	margin:0 auto;
	height: 370px;
}

#header img{
	margin:0 auto;
	float:none;

}
#header img.sofaxis {
    margin: 0 auto;
    float: none;
    background-image: url(../imgs/sofaxis-320.jpg);
    background-position: top center;
    width: 270px;
    height: 104px;
}
#header p.partenariat {
    margin: 15px auto 0 auto;
    width: 150px;
    float: none;
}
#header p.offrhead {
    margin: 27px auto 0 auto;
    font-size: 22px;
    line-height: 22px;
    float: none;
}
.credit-municipal-avignon {
    float: none;
    height: 143px;
    text-align: center;
    margin: 0 auto;
    width: 190px;
    padding-left: 60px;
}
.num-desktop {
    display: none;
}
p.lettre{
	line-height: 19px;
    float: none;
    margin: 0;
    font-size: 14px;
    width: 280px;
    padding: 0 0 20px 20px;
    background-image: none;
	
}
p.lettre strong{
	font-size:14px;
}

#conteneurformulaire{
	background-image:none;
	padding-bottom: 8px;
}


#conteneurformulaire div#formulaire a.teldocu {
    font-size: 12px;
    width: 100%;
    padding: 6px 0;
    text-align: center;
}

#left{
	display: none;
}
#left p{
	padding:0 31px 0 0;
}

#right{
	width:305px;
	min-height:auto;
}

div.informeouinon {
	overflow:hidden;
	margin:0 15px 15px 0;
	display:block;
	width:256px;
	color:#a3a3a3;
	text-align:left;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	border-color:#cccccc;
	border-style:solid;
	border-width:1px;
	padding:11px 7px;
	float:left;
}
div.informeouinon div {
    width: 100%;
    float: left;
}
div.informeouinon .title-service {
	padding-right: 24px;
}

.blocbas {
	margin:0 0 10px 0 ;
	padding:27px 37px 30px 37px;
	border-width:0 0 1px 0;
	width:231px;
	height:auto;
	}
	
.blocbasrouge {
	background-position:right top;
	width:204px;
	padding:90px 49px 87px 39px;
	background-image:url(../imgs/background-bloc-rouge-320.jpg);
	}

#formulaire{
	margin:0 auto;
	padding:16px 10px 27px 10px;
	width:273px;
	float:none;
}
#formulaire form label {
    width: 256px;
}

#formulaire form label.adressep {
	width:256px;


}
#formulaire form span.champsobli {
	float:none;
	margin:14px 0 0 0;

}

#formulaire form input.buttonform {
	float: none;
    display: block;
    clear: both;
    margin: 0 auto;
    text-align: center;
}

.bloc, .blocbleu{
	margin:0 auto 25px ;
	padding:35px;
	width:223px;

}


#content-blanc {
	padding:35px 0 10px 0;


}
.blocbleu {
	padding:37px 35px 47px 20px !important;
	width:195px !important;
	background-image: url(../imgs/background-bloc-bleu-320.jpg);
	border:none;

	
}
.bloc, .blocbleu{
	margin:0 auto;
	padding:35px 0;
	width:262px;

	font-size:13px;
	line-height:15px;

	border-width:0 0 1px 0 ;
	float:none;

}
.bloclist{
	display:none;
}

.sansbor {
	border-width:0 ;
	}
	
.sanborsix {
	border-width:0 0 1px 0 !important;


}


#footer{
	margin:0 auto;
	padding:60px 10px 10px 10px;
	width:285px;
}


h1 {
	display: none;

}

h2 {
	font-size:24px;

}

  
h3 {
	margin:0 0 15px 0;
	font-size:16px;
	line-height:18px;
}

	.mt10 {margin-top:25px;}
	input.goto2 {background:#dc3e3e;border:none;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;color:#fff;cursor:pointer;font-size:16px;font-weight:700;float:right;height:40px;margin-right:20px;-webkit-transition:background-color 1000ms linear;-moz-transition:background-color 1000ms linear;-o-transition:background-color 1000ms linear;-ms-transition:background-color 1000ms linear;transition:background-color 1000ms linear;text-transform:uppercase;width:200px;-webkit-appearance:none}
	input.goto2:hover {background-color:rgba(220,62,62,0.8)}
	input.goto2 {float:none;margin:0 auto;width:98%}
	.goto2 {text-decoration:none;width:340px;line-height:40px;text-align:center;margin-top:40px}

}