@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;700&display=swap');

html, body {
  height: 100%;
  padding: 0;
  margin: 0;
}
body {
  display: flex;
  flex-direction: column;
	font-size: .8rem;
	padding-top: 80px;
	font-family: 'Open Sans', sans-serif;
	/*color: #3b4251;*/
    color: #000000;
	background-color: #f7f7f7;
}

p {margin-bottom: 0rem !important}

strong {font-weight: 600}

.red {color: red}

/**
@media all and (min-width: 1200px) and (max-width: 1440px){ 
	body {
  padding-top: 90px 
}
} **/

a {color: #ec008c; cursor: pointer; }
a:hover {text-decoration: none; color: #000;}


.lienModal, .lienModal:hover, .lienModal:focus {
    color: #fff !important;
    cursor: pointer;
}

.lienModal2, .lienModal2:focus {
    color: #ec008c !important;
    cursor: pointer;
	text-decoration: underline !important;
}
.lienModal2:hover{text-decoration: none !important;;}


/******************* TABLE *****************************/
table {width: 100%}

.table-result td {vertical-align: middle}
.table-result th a, .table-appels th a {color: white !important; text-decoration: underline}
.table-result th a:hover { text-decoration: none}

.table-appels td a {color: white !important; text-decoration: underline}
.table-appels td a:hover { text-decoration: none}
.table-appels td {vertical-align: middle}

.underline {text-decoration: underline;}

th.min, td.min {
  min-width: 20rem !important;
  white-space: nowrap !important;
}

th.min15, td.min15{
  min-width: 15rem !important;
  white-space: nowrap !important;
}

th.min10, td.min10{
  min-width: 10rem !important;
  white-space: nowrap !important;
}

th.min5, td.min5{
  min-width: 5rem !important;
  white-space: nowrap !important;
}

th.max5, td.max5{
  max-width: 5rem !important;
  white-space: nowrap !important;
}

th.max10, td.max10{
  max-width: 10rem !important;
  white-space: nowrap !important;
}

th.min50, td.min50{
  width: 50rem !important;
  white-space: nowrap !important;
}
.bg-rural {background-color:#008000; color: white}
.bg-canin {background-color:#e29058; color: white}
.bg-mixte {background-color:#c0c0c0; color: white}
.bg-normal {background-color: #c0c0c0; color: white}
.bg-santevet {background-color: #97c93e;color: white}
.bg-pink {background-color: #e83e8c;color: white}

.lienRenvoi  {color: white;}
.lienRenvoi:hover {color: black}




.form-group {
    margin-bottom: .5rem;
}

li {list-style: none}

.sizeFa {font-size: 1.4rem !important}

h5 {font-weight: 600 !important; /*color: #3b4251;*/}
h6 {font-weight: 600 !important; font-size: .9rem !important;}


.container-fluid a:hover {text-decoration: none;}


.lH100 {line-height: 100px}

.card-body {padding: .25rem 1.25rem}
.cadre-identite {border: 1px solid #e0e0e0; border-radius: 0px !important; font-size: .8rem; background-color: #F9F9FA;}


.hr-text {
  line-height: 1em;
  position: relative;
  outline: 0;
  border: 0;
  color: black;
  text-align: center;
  height: 1.5em;
	opacity: .5;}
  .hr-text:before {
    content: '';
    /** use the linear-gradient for the fading effect
        use a solid background color for a solid bar **/
    background: linear-gradient(to right, transparent, #818078, transparent);
    position: absolute;
    left: 0;
    top: 50%;
    width: 100%;
    height: 1px;
  }
  .hr-text:after {
    content: attr(data-content);
    position: relative;
    display: inline-block;
    padding: 0 .5em;
    line-height: 1.5em;
    /** this is really the only tricky part, you need to specify the background color of the container element... **/
    color: #818078;
    background-color: #fcfcfa;
  }





@media all and (min-width: 320px) and (max-width: 992px){
	
	.border-right { border-right: none !important;}
	
}

/******************** ECRAN GESTION *****************************************************************/

.blockquote-custom {
  position: relative;
  font-size: .9rem;
}

.blockquote-custom-icon {
  width: 35%;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: -25px;
  left: 50px;
}

/************************************** SNIPPETS FICHE HORAIRES ET CONSIGNES**************************/



/* With arrow tabs */

.with-arrow .nav-link.active {
  position: relative;
}

.with-arrow .nav-link.active::after {
  content: '';
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 6px solid #ec008c;
  position: absolute;
  bottom: -6px;
  left: 50%;
  transform: translateX(-50%);
  display: block;
}



.nav-pills .nav-link {
  color: #555; 
}

.nav-pills .nav-link:hover {
  background-color: #e5e5e5;
}


.text-uppercase {
  letter-spacing: 0.1em;
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    color: #fff;
    background-color: #ec008c;
}


.nav-link-rural {
    background-color: #008000; color: #fff !important;
}

.nav-pills .nav-link-rural.active, .nav-pills .show > .nav-link {
    color: #fff;
    background-color: #008000 !important;
}

.with-arrow .nav-link-rural.active::after {
  content: '';
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 6px solid #008000;
  position: absolute;
  bottom: -6px;
  left: 50%;
  transform: translateX(-50%);
  display: block;
}

/************************************** FIN SNIPPETS FICHE HORAIRES ET CONSIGNES**************************/





/************************************ COULEURS **************************************************/

.couleur01 {color: #00417e;} /* bleu fonce */
.couleur02 {color: #ec008c;} /* rose */
.couleur03 {color: red;} /* rouge */
.couleur04 {color: #318ed3;} /* bleu badge */
.couleur05 {color: #a94761;} /* violet */

.color02 {background-color: #f2dede;}

.Bg-couleur01 {background-color: #d8e5f4 !important} /*cadre équipe */
.Bg-couleur02 {background-color: #00417e;} /* header modal */

.Bg-couleur03 {background-color: #ec008c } /*footer rose */
.Bg-couleur04 {background-color: #000;} /* footer */

.Bg-couleur05 {background-color: #fabfe2 !important; color: #fff !important} /*cadre CP Veto */
.Bg-couleur06 {background-color: #f360b7 !important; color: #fff !important} /*cadre Structure Veto */
.Bg-couleur07 {background-color: #ec008c !important; color: #fff !important} /*cadre Tel Veto */


.Bg-couleur08 {background-color: #84b036 !important; color: #fff !important} /*cadre tel SAnteVet */
.Bg-couleur09 {background-color: #71972f !important; color: #fff !important} /*cadre cp SAnteVet */
.Bg-couleur10 {background-color: #5e7e27 !important; color: #fff !important} /*cadre ass SAnteVet */
.Bg-couleur11 {background-color: #4c651f !important; color: #fff !important} /*cadre anim SAnteVet */

.Bg-couleur12 {background-color: #F9F9FA;}

.Bg-jours {background-color: #544E56;}



/************************************ /COULEURS **************************************************/

.nom-vet-regul {text-align: center; font-weight: bold; font-size: .7rem}

.lienTel  {color: #ec008c; text-decoration: underline; font-weight: bold}
.lienTel:hover  {text-decoration: none; }


.alert-primary {background-color: #ec008c !important; color: white; border-color: #ec008c;}


.card-header {color: #fff; background-color: #3b4251;}
.card-header-spec {color: #fff; background-color: #000; font-weight: 600}
.card-header-spec2 {color: #FFF; background-color: #97c93e; font-weight: 600}
.card-header-consignes {color: #fff; background-color: #626c82}


.cr {padding:.6rem 1.25rem 0 1.25rem}
.card-text {margin-bottom: auto}
.card-sous-titre {background-color: rgba(0,0,0,.05); /*color: #3b4251;*/ }

.card-sous-titre-message {background-color: rgba(0,0,0,.03); color: #a94761; font-weight: 700; padding: .75rem 1.25rem; border-bottom: 1px solid rgba(0,0,0,.125); border-top: 1px solid rgba(0,0,0,.125); text-transform: uppercase}

.lien a {text-decoration: underline}
.lien a:hover {text-decoration: none}


.badge-messages {background-color: #318ed3; color: #fff;}

.h4 {margin-bottom: 0 !important}

.reglette {
  height: 16px;
  background-color: #f2a4eb; /* For browsers that do not support gradients */
  background-image: linear-gradient(to right, #f2a4eb , #96d2ef); /* Standard syntax (must be last) */
}


/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) { 
	.col-md-auto {padding-left: 5px !important; padding-right: 5px !important;} 
}



.btn-secondary,.btn-secondary:focus {
  color: #fff;
background-color:#ec008c;
border-color:#ec008c;
}

.btn-secondary:hover {
background-color:#9e015e !important;border-color:#9e015e !important;

}
.btn-danger{background-color: red !important}
.btn-santeVet {	color: #fff;background-color:#97c93e;border-color:#97c93e;}

.btn-badge {color: #495057; background-color: #e9ecef}
.btn-badge:hover {color: #495057; background-color: #dce0e3}

.badge-Nantes {color: #fff; background-color: #0bbfbf}
.badge-Belgique {color: #fff; background-color: #03a9f4}

.btn-motif {color: #fff;background-color:#549f97;border-color:#549f97;}
.btn-motif:hover {color: #fff;background-color:#43736e;border-color:#43736e;}

.btn-xs {padding: .15rem .25rem; font-size: .75rem !important; line-height: 1.5; border-radius: .2rem;}

.mois-arrow {font-weight: 600; font-size: 1rem}

.btn-outline-light {line-height: .8rem !important; font-weight: bold}

.cadre-equipe {background-color: #fff; border-radius: .25rem; padding: .75rem 1.25rem .45rem 1.25rem; line-height: 1rem; border: 1px solid rgba(0,0,0,.125);}

.form-control, .btn, .btn a {text-decoration: none !important; border-radius: 0px; font-size: .8rem}
.form-control-plaintext {color: #747474 !important; font-weight: 400 !important; font-size: .8rem;}
.form-control::placeholder {font-style: italic;}


.input-group-text, .custom-select, .input-group-append {font-size: .8rem; border-radius: 0px !important}

.input-group-sm > .custom-select, .input-group-sm > .form-control, .input-group-sm > .input-group-append > .btn, .input-group-sm > .input-group-append > .input-group-text, .input-group-sm > .input-group-prepend > .btn, .input-group-sm > .input-group-prepend > .input-group-text {
    border-radius: 0px !important;
}


.logos { width: 90px}


label { margin-bottom: .3rem;}

/************************************ CONFIG  **************************************************/

.close {
    color: #00417e;
    text-shadow: 0;
	opacity: 1;
}

.close:hover {color: #fff;}

.portfolio-item {
  margin-bottom: 30px;
}

.bouton-urgence-veterinaire, .bouton-urgence-veterinaire a {
    color: #fff;
text-transform: uppercase;
	text-decoration: none !important;
font-size: 1.5rem;
background-color: #fb6567;
    border-radius: 6px;
    padding: 6px;
    text-align: center;
}

.bouton-urgence-veterinaire:hover {color: #fff; text-decoration: none}

@media all  and (max-width: 576px) {
	
	.bouton-urgence-veterinaire, .bouton-urgence-veterinaire a {padding: 3px; font-size: 1.2rem }
}


textarea.horaires {height: 90%}

@media all and (orientation: portrait) and (max-width: 992px) {
	textarea.horaires {height: auto}
}

/************************************* COMPTE-RENDU ************************************************/

.titlePage {
    color: #ec008c;
    font-weight: bold;
    font-size: 1.1rem;
    text-transform: uppercase;
    
}


/************************************* /COMPTE-RENDU ************************************************/



/* Change this breakpoint if you change the breakpoint of the navbar */

@media (min-width: 992px) {
  .animate {
    animation-duration: 0.3s;
    -webkit-animation-duration: 0.3s;
    animation-fill-mode: both;
    -webkit-animation-fill-mode: both;
  }
}

@keyframes slideIn {
  0% {
    transform: translateY(1rem);
    opacity: 0;
  }
  100% {
    transform:translateY(0rem);
    opacity: 1;
  }
  0% {
    transform: translateY(1rem);
    opacity: 0;
  }
}

@-webkit-keyframes slideIn {
  0% {
    -webkit-transform: transform;
    -webkit-opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
    -webkit-opacity: 1;
  }
  0% {
    -webkit-transform: translateY(1rem);
    -webkit-opacity: 0;
  }
}

.slideIn {
  -webkit-animation-name: slideIn;
  animation-name: slideIn;
}







/**************************************** ACCORDION WITH ICON *******************************************/

.lien-accordion{
    margin: 0;
}

.lien-accordion > a {
  display: block;
  position: relative;
	color: #fff !important;
}

.collapsed > .when-opened,
:not(.collapsed) > .when-closed {
    display: none;
}

/*.lien-accordion > a:after {*/
/*  content: "\f0d7"; !* fa-chevron-down *!*/
/*  font-family: 'FontAwesome';*/
/*  position: absolute;*/
/*  right: 0;*/
/*}*/
/*.lien-accordion > a[aria-expanded="true"]:after {*/
/*  content: "\f0d8"; !* fa-chevron-up *!*/
/*}*/



/**************************************** PAGINATION *******************************************/

.pagination {
    border-radius: 0rem !important;
}

.pagination-sm .page-item:first-child .page-link {
    border-top-left-radius: 0rem !important;
    border-bottom-left-radius: 0rem !important;
}

.pagination-sm .page-item:last-child .page-link {
    border-top-right-radius: 0rem !important;
    border-bottom-right-radius: 0rem !important;
}

.page-item.active .page-link {
    z-index: 3;
    color: #000;
    background-color: #fff;
    border-color: #fff;
	border-bottom: 3px solid #ec008c;
	font-weight: bold;
}

.page-item.disabled .page-link {
    border: 1px solid #fff;
}

.page-link {
    position: relative;
    display: block;
    padding: .5rem .75rem;
    margin-left: -1px;
    line-height: 1.25;
    color: #000;
    background-color: #fff;
    border: 1px solid #fff;
}

/* ga-pec-suite */
.ga-pec-suite-body {
    clear: both;
}

.ga-pec-suite-left-content {
    height: 100vh;
    width: 60%;
    position: fixed;
    float: left;
}

.ga-pec-suite-left-con {
    padding: 0px 15px;
    margin-bottom: 14rem !important;
}
/*
.ga-pec-suite-right-content {
    min-height: 100vh;
    float: right;
    background-color: #f7f7f7;
    width: 40%;
    padding: 0 15px 15px 15px;

}
*/
.ga-pec-suite-right-content {
    height: 100vh;
    float: right;
    background-color: #f7f7f7;
    width: 40%;
    padding: 0 15px 15px 15px;

}

.ga-pec-suite-right-content .lastRow {margin-bottom: 6rem !important;}

.ga-pec-suite-footer {
    padding-top: 19px;
    padding-bottom: 20px;
    clear: both;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background: linear-gradient(#999, #fff);
}

/* ga-pec-suite */


footer {font-size: .8rem; background:#333 ; color: #a0ccf3; margin-top: auto;}

.footer-contenu {
    display: flex; flex-wrap: wrap;

}

.white-space-pre {
    white-space: pre-line;
}

.border-2{
    border-width: 2px !important;
}