/****************************************************/
/********************* FONT SIZE ********************/
/****************************************************/
.font8 {font-size:.5rem}
.font9 {font-size:.5625rem}
.font10 {font-size:.625rem}
.font11 {font-size:.6875rem}
.font12 {font-size:.75rem}
.font13 {font-size:.8125rem}
.font14 {font-size:.875rem}
.font15 {font-size:.9375rem}
.font16 {font-size:1rem}
.font17 {font-size:1.063rem}
.font18 {font-size:1.125rem}
.font19 {font-size:1.1875rem}
.font20 {font-size:1.25rem}
.font21 {font-size:1.3125rem}
.font22 {font-size:1.375rem}
.font23 {font-size:1.438rem}
.font24 {font-size:1.5rem}
.font25 {font-size:1.563rem}
.font26 {font-size:1.625rem}
.font27 {font-size:1.688rem}
.font28 {font-size:1.75rem}
.font30 {font-size:1.875rem}
.font31 {font-size:1.938rem}
.font32 {font-size:2rem}
.font33 {font-size:2.2rem}
.font34 {font-size:2.125rem}
.font35 {font-size:2.188rem}
.font36 {font-size:2.25rem}
.font38 {font-size:2.375rem}
.font40 {font-size:2.5rem}
.font65 {font-size:4.0625rem}
/****************************************************/
/******************** FONT FAMILY *******************/
/****************************************************/
.montserrat {font-family: 'Montserrat', sans-serif;}
.quicksand {font-family: 'Quicksand', sans-serif;}
/****************************************************/
/******************** FONT WEIGHT *******************/
/****************************************************/
.light {font-weight: 300;}
.regular {font-weight: 400;}
.medium {font-weight: 500;}
.semi-bold {font-weight: 600;}
.bold {font-weight: 700;}
.extra-bold {font-weight: 800;}
.black {font-weight: 900;}
/****************************************************/
/*********************** COLOR **********************/
/****************************************************/
.blue {color: #2581C4;}
.blue-light {color: var(--blue);}
.gold {color: #75b94e;}
.green {color: #009E4E}
.grey {color: #b7b7b7}
.grey-dark {color: #393939;}
.grey-light {color: #7e7e7e;}
.orange {color: #d55c03;}
.red {color: #cd6266}
.blue-gradient {background: linear-gradient(to right, #1d438a 0%, #6ac8ce 100%);-webkit-background-clip: text;-webkit-text-fill-color: transparent;}

.bg-blue {background-color: #2581C4;}
.bg-grey-light {background-color: #f4f4f4;}
.bg-grey-medium {background-color: #e6e6e6;}
.bg-grey {background-color: #f7f7f7;}
.bg-green {background-color: #009E4E;}
.bg-trans {background-color: rgba(255,255,255,.8)}
.bg-orange {background-color: #d56912}
.bg-rouge {background-color:  #cd6266;}
.bg-secondary {background-color: #008485;}
/****************************************************/
/********************* POSITION *********************/
/****************************************************/
.float-center {position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);}
.bg-img {background-position:center center;background-size:cover;background-repeat:no-repeat;}
/****************************************************/
/********************** BOUTONS *********************/
/****************************************************/
.btn {outline: none !important;box-shadow:none !important}
.btn-primary {color: #fff;background-color: #009E4E !important;border-color: #009E4E;padding: .688rem 1.546rem;}
.btn-primary:hover {background-color: #75b94e;border-color: #75b94e;opacity:.8}
.btn-primary:disabled {color: #fff;background-color: #bfbfbf !important;border-color: #bfbfbf;}
.btn-secondary {color: #fff;background-color: #cd6165 !important;border-color: #cd6165;padding: .688rem 1.546rem;}
.btn-secondary:hover {background-color: #cd6165;border-color: #cd6165;opacity:.8}
.btn-secondary:disabled {color: #fff;background-color: #bfbfbf !important;border-color: #bfbfbf;}
.btn-outline-primary {color: #75b94e;border-color: #75b94e;padding: .688rem 1.546rem;}
.btn-outline-primary:hover {color: #75b94e;border-color: #75b94e;background-color: transparent;opacity:.8}
.btn-outline-secondary {color: #c2001b;border-color: #c2001b;padding: .282rem .449rem;border-radius: .25rem;margin-bottom: .3rem;}
.btn-outline-secondary:hover {color: #c2001b;border-color: #c2001b;background-color: #ffffff;opacity:.8}
.btn-outline-white {color: #ffffff;border-color: #ffffff;padding: .282rem .449rem;border-radius: .25rem;margin-bottom: .3rem;}
.btn-outline-white:hover {color: #ffffff;border-color: #ffffff;background-color: transparent;opacity:.8}
.btn-blue {color: #fff;background-color: #113953 !important;border-color: #113953;padding: .688rem 1.546rem;}
.btn-blue:hover {color: #fff;background-color: #113953;border-color: #113953;opacity:.8}
.btn-green {color: #fff;background-color: #008385 !important;border-color: #008385;padding: .688rem 1.546rem;}
.btn-green:hover {color: #fff;background-color: #008385;border-color: #008385;opacity:.8}
.btn-outline-green {color: #008385;background-color: transparent !important;border-color: #008385;padding: .688rem 1.546rem;}
.btn-outline-green:hover {color: #008385;background-color: transparent;border-color: #008385;opacity:.8}
/****************************************************/
/********************** HEADER **********************/
/****************************************************/
header .dropdown-toggle::after {display:none}
header .nav-link img {display:inline-block;margin-right:10px;height:26px;}
header .nav-link img + div {display:inline-block}
header .dropdown-menu img {width: 25px;margin-right:5px;}
.navbar-brand img {height:5rem;}
.headband {background: linear-gradient(#f9f9f9, #ececec);position: relative;padding-bottom: 8rem;padding-top:20px;}
.bkg {background: url('../img/visuel-home-1.png') calc(100% - 0rem) center no-repeat;background-size: auto 100%;}
.diagonal{width: 100%;height: 8rem;background: #fff;-webkit-clip-path: polygon(0% 0%, 0 100%, 100% 100%);clip-path: polygon(0% 0%, 0 100%, 100% 100%);position: absolute;left: 0;bottom: -0.1rem;}
.vertical-line {z-index: 5;margin: 0 auto;margin-top: -12.5rem;width: 50%;height: 15rem;position:relative;text-align: center;font-weight: 800;font-size: 1.2rem;}
.vertical-line:after {content:"";display: block;width: .75rem;height: .75rem;background: #ffdd00;border-radius: 0.5rem;margin: 0 auto;}
.vertical-line-bo {z-index: 5;margin: 0 auto;margin-top: -12.5rem;width: 50%;height: 12rem;position:relative;text-align: center;font-weight: 800;font-size: 1.2rem;}
.vertical-line-bo:after {content:"";display: block;width: .75rem;height: .75rem;background: #cd6266;border-radius: 0.5rem;margin: 0 auto;}
.line {width: 0.2rem;height: 8rem;background: #ffdd00;margin: 0 auto;}
.line-bo {width: 2px;height: 6rem;background: #cd6266;margin: 0 auto;}
.nav .avatar img {width: 26px;border-radius: 50%;}
.logo-w {margin: 6px 0;}
/****************************************************/
/********************** FOOTER **********************/
/****************************************************/
footer {background-color: #F6F6F6;}
footer ul li {margin: .5rem 0;}
footer ul li a {color: #1d4388;text-transform: uppercase;font-size:.6875rem;font-weight: 700;text-decoration: none;}
.footer {background: linear-gradient(to right, #1d4388 0%, #00a19a 100%);position: relative;padding-top: 5rem;}
.footer-bo {background: linear-gradient(to right, #1d4388 0%, #008586 100%);position: relative;padding-top: 5rem;}
.footer .diagonal-bottom {width: 100%;height: 5rem;background: #f6f6f6;-webkit-clip-path: polygon(0 0, 0 100%, 100% 0);clip-path: polygon(0 0, 0 100%, 100% 0);position: absolute;top: -0.1rem;}
.footer-bo .diagonal-bottom-bo {width: 100%;height: 5rem;background: #ffffff;-webkit-clip-path: polygon(0 0, 0 100%, 100% 0);clip-path: polygon(0 0, 0 100%, 100% 0);position: absolute;top: -0.1rem;}
/****************************************************/
/********************* GENERAL **********************/
/****************************************************/
html, body {height:100%;}
body {padding-top: 106px;}
.form-select {border: 1px solid #042645;border-radius: 0;height: 45.13px;background-image: url('../img/arrow-select.png');background-size: auto;}
.ui-front {z-index: 10000;}
.truncate {display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow:hidden;}
/* Diagonal Separator */
.show-ie {display: none;}
.triangle {width: 0;height: 0;border-style: solid;margin-left: -2rem;}
.triangle.type-1 {border-width: 0 100vw 10rem 0;border-color: transparent transparent #FFF transparent;}
.triangle.type-2 {border-width: 13rem 100vw 0 0;border-color: #FFF transparent transparent transparent;}
.triangle.type-3 {border-width: 6rem 100vw 0 0;border-color: #F6F6F6 transparent transparent transparent;}
.triangle.type-4 {border-width: 0 100vw 4rem 0;border-color: transparent transparent #FFF transparent;}
.triangle.type-5 {border-width: 0 0 8rem 100vw;border-color: transparent transparent #FFF transparent;}
.triangle.type-6 {border-width: 0 100vw 4rem 0;border-color: transparent transparent #f9f9f9 transparent;}
.triangle.type-7 {border-width: 6rem 100vw 0 0;border-color: #F9F9F9 transparent transparent transparent;}

.filet-bleu {background-image: url('../img/bo/line-top.png'), url('../img/bo/line-bottom.png'); background-repeat: no-repeat;background-position: left top, left bottom;margin-top:4rem;margin-bottom:4rem}
.filet-red {background-image: url('../img/bo/line-top-red.png'), url('../img/bo/line-bottom-red.png'); background-repeat: no-repeat;background-position: left top, left bottom;margin-top:4rem;margin-bottom:4rem}


textarea {-webkit-appearance: none;font-family: 'Montserrat', sans-serif;font-size: .875rem;border: 0;border-radius: 1rem;padding: 1rem;-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2) !important;-webkit-box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 20%) !important;box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 20%) !important;width: 100%;min-height: 8rem;}

.profil {padding-top:60px;}
.profil .avatar {top: -65px;position: absolute;left: 50%;transform: translateX(-50%);}
.profil .avatar img {object-fit: cover;border-radius: 50%;width: 125px;height: 125px;}
.profil .nav-pills .nav-link {background: #ffffff;border: 1px solid #042645;border-radius: 2rem;color: #042645;font-family: 'Montserrat';font-weight: 600;font-size: .8125rem;margin: 0.5rem auto;width: 100%;}
.profil .nav-pills .nav-link.active {color: #ffffff;background:#042645}
.profil .nav-pills .nav-link.active img {filter: brightness(0) invert(1);}

.subscription input[type='password'], .subscription input[type='email'], .subscription input[type='tel'], .subscription input[type='text'], .account input, .planning input[type='date'] {font-family: 'Montserrat', sans-serif;font-size: .8125rem;border: 0;border-radius: 1.5rem;-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2) !important;-webkit-box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 20%) !important;box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 20%) !important;width: 100%;margin-bottom:1rem;}
/*.account label {font-family: 'Montserrat', sans-serif;color:#1d4388;font-weight:700;text-transform:uppercase;font-size:.75rem;margin-left: 0.75rem;margin-bottom: 0.35rem;}*/
.tableFixHead { overflow: auto; height: 500px;border-collapse: collapse; width: 100%; }
.liste-prestations thead th { position: sticky; top: 0; z-index: 1;background:#ffffff }
.liste-prestations th, .liste-prestations td { padding: 8px 16px; }


.btn-check:active+.btn-outline-blue, .btn-check:checked+.btn-outline-blue, .btn-outline-blue.active, .btn-outline-blue:active, .show>.btn-outline-blue.dropdown-toggle {color: #ffffff;background-color: #1d4388;border-color: #1d4388;}
.type-dechets-checkbox label {position: relative;height: 66px;line-height: .875rem;display:table-cell;border: 1px solid #1d4388;}
input[type='checkbox'].btn-check:checked+.btn-outline-blue:after {content:url('../img/small-check-gold.png');position:absolute;left:3px;top:3px;}


.search-input input, .search-input button {-webkit-appearance: none;border: 0;border-radius: 2.5rem;height: 3.125rem;-moz-box-shadow: 1px 5px 30px 3px rgba(0,0,0,0.2);-webkit-box-shadow: 1px 5px 30px 3px rgb(0 0 0 / 20%);box-shadow: 1px 5px 30px 3px rgb(0 0 0 / 20%);}
.search-input input[type='text'] {border-top-right-radius: 0;border-bottom-right-radius: 0;height: 50px;margin-top: 0;}
.easy-autocomplete-container {z-index: 999999;max-height: 20rem;overflow-y: auto;width: calc(100% - 22px);margin-left: 22px;}
.search-input .icon {position: absolute;right: 1.5rem;top: 1.5rem;font-size: 1.5rem;color: #D7D7D7;}

.conditions-collecte {overflow: auto;max-height: 45vh;margin-bottom: 2rem;}
/* Firefox */
.conditions-collecte {scrollbar-width: auto;scrollbar-color: #00a199 #ffffff;}

/* Chrome, Edge, and Safari */
.conditions-collecte::-webkit-scrollbar {width: 16px;}
.conditions-collecte::-webkit-scrollbar-track {background: #ffffff;}
.conditions-collecte::-webkit-scrollbar-thumb {background-color: #00a199;border-radius: 10px;border: 3px solid #ffffff;}

.titre-step {font-family: 'Quicksand', sans-serif;font-weight: 700;font-size:1.438rem;color: #1d4388}
.dot-step {background: url('../img/dot-gold.png') center center no-repeat;}
.row-off .dot-step {background: url('../img/dot-grey.png') center center no-repeat;}
.row-done .dot-step {background: url('../img/dot-blue.png') center center no-repeat;}
.line-step {background: url('../img/line-step.png') center center repeat-y;}
.row-off .line-step {background: url('../img/line-step-off.png') center center repeat-y;}
.line-step img {height: 100%;width: 17px;min-height: 50px;margin-bottom: 1rem;}
.row-off .titre-step {color: #b7b7b7}

input[type='email'], input[type='password'], input[type='text'], input[type='tel'] {-webkit-appearance: none;height:40px;padding-left: 1rem;border:1px solid transparent;margin: 0.5rem 0;-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2) !important;-webkit-box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 20%) !important;box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 20%) !important;}
input[type='email']:focus, input[type='password']:focus, input[type='text']:focus, input[type='tel']:focus {border:1px solid #1d4388;-moz-box-shadow: none !important;-webkit-box-shadow: none !important;box-shadow: none !important;}

.demande-recap {border: 1px solid #75b94e;border-radius: 5px;}
.demande-recap td {padding:.5rem}

.button-radio {-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2) !important;-webkit-box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 20%) !important;box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 20%) !important;}
.button-radio:focus {border:1px solid #1d4388;-moz-box-shadow: none !important;-webkit-box-shadow: none !important;box-shadow: none !important;}
.button-radio .styled-input-single {width: fit-content;padding: 8px 0 8px 30px;text-align: left;margin: 1rem auto;}
.styled-input-single {position: relative;padding: 20px 0 20px 40px;text-align: left;}
.styled-input-single label {cursor: pointer;}
.styled-input-single label:before, .styled-input-single label:after {content: "";position: absolute;top: 50%;transform: translateY(-50%);}
.styled-input-single input[type='radio'] + label:before {left: 0;width: 18px;height: 18px;background: #ffffff;border-radius:15px;border:1px solid #75b94e}
.styled-input-single input[type='radio'] + label:after {left: 3px;width: 12px;height: 12px;border-radius: 13px;opacity: 0;background: #75b94e;transition: opacity 0.25s ease-in-out, transform 0.25s ease-in-out;}
.styled-input-single input[type='checkbox'] + label:before {left: 0;width: 20px;height: 20px;background: #ffffff;border-radius:5px;border:1px solid #cccccc}
.styled-input-single input[type='checkbox'] + label:after {left: 3px;width: 14px;height: 14px;border-radius: 3px;opacity: 0;background: #1d4388;transition: opacity 0.25s ease-in-out, transform 0.25s ease-in-out;}
.styled-input-single input[type='radio']:checked + label:after, .styled-input-single input[type='checkbox']:checked + label:after {opacity: 1;}
.styled-input-single input[type='radio'], .styled-input-single input[type='checkbox'] {position: absolute;top: 0;left: -9999px;visibility: hidden;}

.liste-collecte tr th, .liste-collecte tr td {padding-top:1rem;padding-bottom:1rem;}
.liste-collecte tr td {border-bottom: 1px solid #e4e4e4}
.liste-collecte tr:last-of-type td {border:0}

.type-collecte .btn {width:200px;margin:.5rem 1.5rem}

.ms-choice {font-family: 'Montserrat', sans-serif;font-size:.875rem;border: 0;border-radius: 2.5rem;height: 3rem;padding: 0 3rem;-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2) !important;-webkit-box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 20%) !important;box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 20%) !important;}
.ms-choice>span {padding: 11px 1px 1px 25px;color: #1d4388;}
.ms-choice > div {position: absolute;top: calc(50% - 4.5px);right: 20px;width: 15px;height: 9px;background: url('../img/arrow-select.png') no-repeat;}
.ms-choice>div.open {transform: rotate(180deg)}

.pictures-list {flex-direction: row;display: flex;}
.picture-rounded{display: inline-block;border-radius: 1rem;width: 55px;height: 55px;overflow: hidden;text-align: center;margin-right: 2rem;position: relative;}
.picture-rounded img{max-width: calc(100% - -6px);}
.picture-rounded .remove-picture{position: absolute;line-height: 55px;height: 100%;width: 100%;background-color: rgba(0,0,0,0.8);color: #FFF;text-align: center;top: 0;left: 0;font-size: 3rem;display: none;cursor: pointer;}
.picture-rounded:hover .remove-picture{display: block;}
button.picture{display: inline-block;border-radius: 1rem;width: 55px;height: 55px;overflow: hidden;text-align: center;background-color: #FFF;border: 1px #CCC solid;cursor: pointer;color: #CCC;margin: 0;}
button.picture:hover{color: #999;border-color: #999;}
button.picture .icon{font-size: 3rem;line-height: 55px;}

.circle-badge {border-radius: 15rem;box-shadow: 0px 0px 10px #c0c0c0;font-family: 'Montserrat', sans-serif;font-size:18px;font-weight:700;width:255px;height:255px;margin:auto;padding:3rem 1rem 1rem;text-align:center;color: #1d4388;-webkit-transition: all 1.5s 0s ease;-moz-transition: all 1.5s 0s ease;-o-transition: all 1.5s 0s ease;transition: all 1.5s 0s ease;margin-bottom:3rem;}
.circle-badge.active {background: rgb(17,58,83);background: linear-gradient(141deg, rgba(17,58,83,1) 0%, rgba(1,131,133,1) 100%);color: #ffffff;box-shadow: 0px 0px 10px rgb(0 0 0 / 0%);width:180px;height:180px;padding-top: 2.5rem;}
.circle-badge.active img {max-height:88px;}