/*--------------------------------*/
/* GLOBAL */
/*--------------------------------*/

@import url('https://fonts.googleapis.com/css2?family=Cabin:wght@400;700&family=Quicksand:wght@500;700&display=swap');


body{
	font-family: 'Cabin', sans-serif;
	font-weight: 400;
	font-size: 1rem;
	color: #474747;

	/*
	background: -moz-linear-gradient(top, #e71c19 0%,#a1cfd5 700px, #f3f5f6 700px, #f3f5f6 100%); 
	background: -webkit-linear-gradient(top, #e71c19 0%,#a1cfd5 700px, #f3f5f6 700px,#f3f5f6 100%); 
	background: linear-gradient(to bottom, #e71c19 0%,#a1cfd5 700px, #f3f5f6 700px,#f3f5f6 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e71c19', endColorstr='#f3f5f6',GradientType=0 ); 
	*/
	background-color: #f3f5f6;
	/*background-repeat: no-repeat;*/
	padding: 0;
	margin: 0;
}

p {
	margin-top: 0;

}

h1, h2, h3, h4,h5,h6{
	margin-bottom: 1rem;
	margin-top: 0;
	font-family : 'Quicksand', sans-serif;
	font-weight: 500;
} 



h2 { font-size: 1.4rem ; }
h3 { font-size: 1.2rem ; }
h4 { font-size: 1.1rem ; }
h5, h6 { font-size: 1rem;}

.text-bold {
	font-weight: 700;
}

iframe {
	border: none;
	width: 100%;
}

blockquote{
	font-style:italic;
	color: #777;
}

.text-n {
	font-size : 1rem;
}

.text-l {
	font-size: 1.2rem; 
}

.text-xl {
	font-size: 1.3rem; 
}

.text-sm {
	font-size: .8rem;
}

.fw-700 {
	font-weight: 700;
}

.fw-800 {
	font-weight: 800;
}

.text-white{
	color: #fff;
}

.text-gray {
	color: #666;
}

.text-graylight {
	color: #ccc;
}

.text-red {
	color: #e71c19;
}

.text-dark {color: #474747}


.bg-eaeced {
	background: #eaeced;
}

.bg-f3f5f6 {
	background: #F3F5F6;
}

.text-underline { text-decoration:underline;}

a {
	color: #e71c19;
	font-weight: 400;
	opacity: 1;
}

.link-black {
	color: #474747;
}

.link-gray {
	color: #777;
}

a:hover {
	color: #e71c19;
	opacity: .9;
}

.lst-none{
	list-style: none;
	padding: 0;	
}

.lst-w-icon {
	list-style:none;
}

.lst-w-icon > li {
	position:relative;
	padding-left: 1.5rem;
}

.icon-lst {
	position: absolute;
	top: 2px;
	left : 0;
}	


.pedago {
	background: #eaeced;
	color: #777;
	font-weight: 700;
}

.btn {
	white-space : normal;
	text-decoration:none!important;
	border-radius: 20px;
}

.btn-red {
	background: #e71c19;
	border-color: #e71c19;
	color: #fff;
	
}

.btn-red:hover {
    color: #fff;
    background-color: #B41613;
    border-color: #B41613;
}

.btn-outline-red {
	border-color: #e71c19;
	color: #e71c19;
}

.btn-outline-red:hover {
    color: #B41613;
    background-color: transparent;
    border-color: #B41613;
}

.btn-dark {
	color: rgba(0,0,0,.8);
	color: #fff;
}

.desktop {
	display:block;
}

.mobile {
	display:none;
}


@media(max-width: 786px){

	h1 {
		font-weight: 800;
		font-size: 1.5rem;
	}

	h2 { font-size: 1.3rem ; }
	h3 { font-size: 1.2rem ; }
	h4 { font-size: 1.1rem ; }
	h5, h6 { font-size: 1rem;}	
	
	.text-l {
		font-size: 1.1rem;
	}
	
	.text-xl {
		font-size: 1.2rem;
	}
	
	.desktop {
		display:none;
	}

	.mobile {
		display:block;
	}
	
	
}

/*--------------------------------*/
/* TOP NAVIGATION */
/*--------------------------------*/



.navbar {
	margin-bottom: 4.5rem;
	padding: .2rem 1rem;
	min-height: 80px;
}

.navbar-brand{
	position:relative;
	width: 100px;
}


.navbar-light {
	background: #fff;
}

.btn-disconnect {
	color: #777777;
	font-weight: 300;
}

.navbar-expand-lg .navbar-nav .nav-link {
    padding-right: .9rem;
    padding-left: .9rem;
}

.nav-link {
	font-weight: 300;
}


.navbar.fixed-top{
	transition: all 0.3s ease-in;
	box-shadow : 0px 0px 20px -15px rgba(0, 0, 0, .5);
	webkit-box-shadow : 0px 0px 20px -15px rgba(0, 0, 0, .5);
	moz-box-shadow : 0px 0px 20px -15px rgba(0, 0, 0, .5);	

}	

.navbar.fixed-top #navbarLogo {
	width: 60%;
}

@media(min-width:990px){
	.navbar-brand  #navbarLogo {
		max-width: 100%;
		height: auto;
		position:absolute;
		top: -40px;
    }
    
    .navbar-brand{
        width: 150px;
    }

}

@media(max-width:1100px){
	.navbar-expand-lg .navbar-nav .nav-link {
		padding-right: .2rem;
		padding-left: .2rem;
	}	
}

/*--------------------------------*/
/* PRODUCT PAGES */
/*--------------------------------*/

.page-title {
	margin-top: 1.1rem;
	margin-bottom: 1.1rem;
}

.mobile-offer {
	background: #fff;
	padding: 1rem;
	text-align: center;
	display:none;
}

.mobile-offer p { margin-bottom: 0;}

.content-header-img {
	width: 100%;
	height: 160px;
	background-repeat : no-repeat;
	position :relative;
}

.content-header-offer {
    background: url(../img/pastille-fond-blanc_150x150.png) no-repeat center center;
    width: 150px;
    height: 150px;
    position: absolute;
    right: 1rem;
    top: 50%;
    color: #474747;
    text-align: center;
    padding: .5rem;
	margin-top: -75px;
	display:flex;
	flex-direction: column;
	justify-content: center;
}

.content-header-offer p {
    margin-bottom: 0;
}


.t-bar-center {
	text-align: center;
	padding-bottom: 1rem;
	position: relative;
}

.t-bar-center:after {
	position: absolute;
	content : '';
	width: 50px;
	height: 5px;
	background: #e71c19;
	left: 50%;
	bottom: 0;
	margin-left: -25px;
}

.t-bar-left {
	text-align: left;
	padding-bottom: 1rem;
	position: relative;
}

.t-bar-left:after {
	position: absolute;
	content : '';
	width: 50px;
	height: 5px;
	background: #e71c19;
	left: 0%;
	bottom: 0;

}

.proc-steps {
	display: flex;
	flex-wrap : wrap;
}

.proc-steps .step {
	text-align: center;
	width: 25%;
	padding: 1.5rem .8rem;
	border-right: 1px solid #eaeced;
}

.proc-steps .step:last-child{
	border-right: none;
}


.step .stepnb {
	width: 50px;
	height: 50px;
	border : 2px solid #e71c19;
	color: #e71c19;
	border-radius: 50%;
	text-align:center;
	font-size: 1.2rem;
	line-height: 50px;
	margin: auto;
	font-weight: 800;
}

.step .stepdesc {
	margin-top: 1rem;
	margin-bottom: 0;
}

.step .step-img{
	max-width: 50px;
	height: auto;
}

@media(max-width: 790px){
	.content-header-img{display:none;}
	.mobile-offer{display:block;}
	
	.ppc-frame {
		position:relative;
		min-height: 300px;
	}
	
	.ppc-simulator {
		-webkit-transform: scale(0.45);
		-moz-transform: scale(0.45);
		transform: scale(0.45);
		position: absolute;
		display: block;		
		width: 209%;
		height: 209%;
		top: -65%;
		left: -54%;		
		z-index: 9999;
	}	

	.proc-steps .step {
		width: 100%;
		border-right: none;
		border-bottom: 1px solid #eaeced;
	}
	
	.widget p, .widget .t-bar-left {
		text-align:center;
	}
	
	.widget .t-bar-left:after {
		position: absolute;
		content : '';
		width: 50px;
		height: 5px;
		background: #e71c19;
		left: 50%;
		margin-left: -25px;
		bottom: 0;

	}
	
	
}

/* PPR SIMULATOR */
.field-cont {
	margin-bottom: .8rem;
}

.field {
    width: 100%;
    display: block;
    border: none;
    padding: .8rem .4rem;
    color: #777;
    font-size: 1rem;
    font-weight: 300;
    background: #eee;
}


.field-w-after {
	display: flex;
	align-items: center;
}

.field-w-after input, .field-w-after select {
	width: 85%;
	margin-right: .5rem;
}

.field-after {
	font-size: 1rem;
	width: 15%;

}

.field-mensu {
	font-size: 2rem;
	color: #FF8800;
}

.field-mensu .sim-field {
	text-align: left;
	color: #FF8800;	
}


.btn-simulator-ppr {
	background: #FF8800;
	color: #fff;
    padding: 1rem 1.2rem;
    border: 1px solid transparent;
    font-weight: 700;
    font-size: 1.2rem;
    box-shadow: 0px 0px 20px -5px #aaa;	
}

.result {
	color: #444;
	padding: 1rem 1.5rem;	
	position: relative;
	border : 2px solid #eaeced;
	border-radius: 20px;
}

.result-title {
    position: absolute;
    top: -15px;
    width: 300px;
    left: 50%;
    margin-left: -150px;
    margin-top: 0;
    padding: 0 20px;
    background: white;
    color: #777;
    text-align: center;
}

.result-table {
	width: 100%;
}

.result-table tr {
	height: 2.5rem;
}

.table-titre, .table-info  {
	width: 50%;
	border-bottom: 1px solid #eee;
	background: transparent;
}

.result-table tr:last-child .table-titre, .result-table tr:last-child  .table-info:last-child  {

	border-bottom: 1px solid transparent;
}

.table-info {
	text-align: right;
}

@media(max-width: 600px) {
	.result {
		padding: 1rem .8rem;
	}	
}

@media(max-width: 400px) {

	.label-mensu {display:block;}

	.result {
		padding: 1rem .8rem;
	}	
	
	.result-title {
		font-size: 1.2rem;
		position: relative;
		top: 0;
		margin-left: 0;
		left: 0;
		padding: 0;
		text-align: center;
		width: 100%;
		background: transparent;
	}
	
	.table-titre, .table-info  {
		width: 100%;
		display: block;
		text-align: center;
	}
	
	.table-info {
		border-bottom: 1px solid #ccc;
		margin-bottom: .5rem;
		padding-bottom: .5rem;
	}
	
	.table-titre {
		border-bottom: none;
		
	}
	
}


/* widgets */

.aside-info-sim {
	color: #fff;
}

.aside-tabs .nav-link {
	padding: .5rem .5rem;
}

.aside-tabs .nav-tabs {
	border-bottom: 1px solid #fff;
}

.aside-tabs  .nav-tabs .nav-item {
	margin-left : .2rem;
	margin-bottom: 0;
}

.aside-tabs  .nav-tabs .nav-item:first-child{
	margin-left: 0!important;
}

.aside-tabs  .nav-tabs .nav-link {
    border: 1px solid transparent;
    border-top-left-radius: .25rem;
    border-top-right-radius: .25rem;
    color: #474747;
	font-weight: 700;
	background-color: #eee;

	
}


.aside-tabs .nav-tabs .nav-item.show .nav-link, .aside-tabs  .nav-tabs .nav-link.active {
    color: #8a7e79;
    background-color: #fff;
    border-color: #fff #fff #fff;
}

.aside-tabs .nav-tabs .nav-link:focus, .aside-tabs .nav-tabs .nav-link:hover {
    border-color: transparent transparent transparent;
}

.aside-accordion .accordion-header {
    border-bottom: 1px solid #EAECED;
    padding-bottom: .5rem;
    margin-bottom: .5rem;
    padding-right: 1rem;
    position: relative;
    cursor: pointer;
}

.aside-accordion .accordion-header::after {
    color: #aaa;
}

.aside-accordion .accordion-content {
    padding: .5rem 0 1rem 0;
    display: none;
    font-size: 1rem;
}

.icon-absolute {
    position: absolute;
    top: 50%;
    left: 50%;
    font-size: 2.5rem;
    width: 50px;
    height: 50px;
    line-height: 50px;
    margin-left: -25px;
    margin-top: -25px;
}


@media(max-width: 768px){
	.aside-info-sim {color: #474747;}	
	.aside-tabs  .nav-tabs .nav-link {color: #e71c19;}
	.aside-tabs .nav-tabs .nav-item.show .nav-link, .aside-tabs  .nav-tabs .nav-link.active {color: #474747;}	
	
}


/*--------------------------------*/
/* RECLAMATION PAGE */
/*--------------------------------*/
.list-reclas > li {
    display: flex;
    margin-bottom: 1.5rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid rgba(0,0,0,.05);
}

.recla-nb {
    width: 50px;
    min-width: 50px;	
    height: 50px;
    border: 2px solid #e71c19;
    color: #e71c19;
    border-radius: 50%;
    text-align: center;
    font-size: 1.2rem;
    line-height: 50px;
    font-weight: 800;
	margin-right: 1rem;
}


/*--------------------------------*/
/* INSURANCE PAGE */
/*--------------------------------*/

.insur-hiddable .insur-hiddable-title {
    font-size: 1.3rem;
    font-weight: 700;
    margin-bottom: 1rem;
    padding-bottom: 1rem;
	position:relative;
	cursor: pointer;
	padding-right: 30px;
	border-bottom: 1px solid #F3F5F6;
}

.insur-hiddable .insur-hiddable-title > span {
	position:absolute;
	top: 50%;
	margin-top: -12px;
	right: 0;
	color: #ddd;
}

.insur-hiddable.active .insur-hiddable-title > span {
	transform : rotate(180deg);
}

.insur-hiddable .insur-hiddable-content {
	display:none;
}

.insur-hiddable.active .insur-hiddable-content {
	display: block;
}




.tableau-garanties {
margin-bottom: 10px;
}


.tableau-garanties, .tableau-garanties td {
	border: 1px solid #ccc;
}

.tableau-garanties tr {
	height: 50px;
}

.tableau-garanties .cell-titre {
	text-align: left;
	border-left: 1px solid #fff;
}


.tableau-garanties > tbody > tr > td {
	text-align: center;
	padding: 3px;
	vertical-align: middle;
}


.tableau-garanties .col-titre{
background: #8b7e79;
color: #fff;
border-color: #fff;
}

.question {
width: 15px;
height: 15px;
opacity: 1;
transition: opacity 0.3s ease-in;
}

.question:hover {
opacity: .8;
}

.tableau-garanties .check {
    color: green;
    font-weight: 500;
    font-size: 20px;
}


.tableau-garanties .noborder {
	border: 1px solid transparent;
	background: #fff;

}

.tableau-garanties .btn {
margin-top: 10px;
}

@media (max-width: 576px) {

	.tableau-garanties td {
		padding: 2px;
		font-size: 12px;
		max-width: 50px;
	}	

	.tableau-garanties .col-titre {
	padding: 2px;
	}		

	.tableau-garanties .cell-titre {
	max-width: 80px;
	}	
	
	.tableau-garanties .check {
		font-size: 12px;
	}
}	

/*--------------------------------*/
/* LOGIN PAGE */
/*--------------------------------*/


.login .container {
	width: 90%;
	max-width: 750px;
	margin:auto;
}

.login-container {
	text-align:center;
	margin-top: 140px;
	box-shadow: 0px 0px 20px -10px #474747;
}


.login-container h1 {
	font-size: 1.4rem;
}

#loginForm {
	justify-content : center;
}

#loginForm #login_code, #loginForm  #LoginFormBtn {
	width: 180px;
}

#loginForm #login_code {
	margin-right: 1rem;
}


#loginHelpBtn.active  #loginHelpIco {
	transform: rotate(180deg);
}	

@media(min-width: 550px){
	.login .page-footer {
		background: transparent;
		padding: 0 0 ;
		font-weight: 700;
		text-shadow: 2px 2px 5px #000;
		-moz-text-shadow: 2px 2px 5px #000;
		-wekbit-text-shadow: 2px 2px 5px #000;
	}	
}

.login .page-footer .nav-link {
	font-weight: 700;	
}

.login .page-footer hr {
	border-color: rgba(255,255,255, .8);
}

@media(max-width: 768px){
	.login-container {
		margin-top: 100px;
	}	
	
	#loginForm #login_code, #loginForm  #LoginFormBtn {
		width: 100%;
		margin-bottom: 1rem;
	}	
	
	#loginForm #login_code {
		margin-right: 0;
	}	
	
}

@media(max-width: 400px){
	.login-container {
		margin-top: 50px;
	}	
}



/*--------------------------------*/
/* FOOTER */
/*--------------------------------*/
.page-footer {
	background: #474747;
	color: #fff;
	text-align:center;
	padding: 2rem 0;
	margin-top: 3rem;
}

.page-footer .nav-link {
	color: #fff;
}

.page-footer .nav {
	justify-content : center;
}

.page-footer hr {
	border-top: 1px solid rgba(255,255,255, .1);
}

/*--------------------------------*/
/* MISC */
/*--------------------------------*/

.modal-xl {
	max-width: 1200px;
}

.default-accordion-title {
    font-size: 1.2rem;
    font-weight: 400;
    margin-bottom: .2rem;
}

.default-accordion-undertitle {
    font-size: 1.0rem;
    color: #777;
    margin-bottom: 0;
}

.default-accordion .accordion-header {
    border-bottom: 1px solid #EAECED;
    padding-bottom: 1rem;
    margin-bottom: 1rem;
    padding-right: 1.5rem;
    position: relative;
    cursor: pointer;
}

.accordion-header::after {
    content: '+';
    position: absolute;
    top: 50%;
    margin-top: -13px;
    right: 0;
    color: #e71c19;
    font-weight: 700;
    font-size: 1.3rem;
}

.accordion-header.active::after {
    content: '-';
}

.default-accordion .accordion-content {
    padding: 1rem 0 1rem .5rem;
    display: none;
    font-size: 1rem;
}


.alert{
    border: none;
    border-radius: 0;
    border-left: 15px solid transparent;
	text-align:left;
}

.alert-full{
    border: none;
    border-radius: 0;	
	padding: .8rem .7rem;
	text-align:center;
}

.alert-danger {
    color: #e71c19;
    border-color: #e71c19;
    background: #faf1f1;
}

.alert-info {
    color: #e71c19;
	border-color: #e71c19;
    background: #e3ebee;
}


#backToTop {
    position: fixed;
    bottom: 1rem;
    right: -4rem;
    width: 3rem;
    height: 3rem;
    background: rgba(0,0,0,.8);
    text-align: center;
    padding-top: .7rem;
    color: #fff;
    border-radius: .25rem;
    transition: right 0.3s ease-in;
    font-size: 1.3rem;
}

#backToTop.active {
	right: 1rem;
}

#cookieBann {
	font-size: .9rem;
    position: fixed;
    bottom: 1rem;
	left: 1rem;
    background: rgba(0,0,0,.7);
    width: 100%;
	max-width: 360px;
	padding: 1rem;
	color: #fff;

}

#cookieBann a {
	color: #fff;
	text-decoration: underline;
}


#feedbackBtn{
	border: none;
    padding: 1rem 1.3rem 1rem 1rem;;
    background: #e71c19;
    color: white;
    position: fixed;
    right: -2.2rem;
    bottom: 50%;
    transform: rotate(-90deg);
	-webkit-transform : rotate(-90deg);
	-ms-transform : rotate(-90deg);
    border-radius: .3rem .3rem 0 0;
    font-weight: 700;
	transition: all 0.3s ease-in;
	-webkit-transition: background, right 0.3s ease-in;
}

#feedbackBtn:hover{
	background: #B41613;
	right: -2rem;
	text-decoration:none;
}


#closeFeedbackBtn{
	position: absolute;
	top: .2rem;
	right: .4rem;
	color: #fff;
	
}

@media(max-width: 550px){
	#cookieBann  {
		left: 0;
		bottom: 0;
	}
	
	#feedbackBtn{
		padding: .5rem 1.5rem .5rem .5rem;
		font-size: .9rem;
		background: #e71c19;
		color: white;
		position: fixed;
		right: 15px;
		bottom: 15px;
		transform: rotate(0);
		-webkit-transform : rotate(0);
		-ms-transform : rotate(0);
		border-radius: .3rem;
		font-weight: 400;
		transition: all 0.3s ease-in;
		-webkit-transition: all 0.3s ease-in;
	}	
	
	#feedbackBtn:hover{
		right: .5rem;
	}
	
	
}

.table-header-rounded th{
	background: #8b7e79;
	border-color: #fff!important;
	color: #fff;
}

.table-header-rounded th a {
	color: #fff!important;
	text-decoration:underline;
}

.table-header-rounded th:first-child{
	border-radius : 20px 0 0 0 ;
}

.table-header-rounded th:last-child{
	border-radius : 0 20px 0 0 ;
}

.table thead th{
	vertical-align:top;
}