@charset "UTF-8";
* {margin: 0; padding: 0; box-sizing: border-box; outline: none;}

img {width: 100%;}
a {text-decoration: none; color: #FFF;}
a {color: #eedc9d;}
a:hover, a.current {color: #FFF;} 
p {margin-bottom: 1.2em; line-height: 1.2em; font-size: 1em; text-align: justify;}
ul {list-style-type: none;}
h1, h2, h3, h4 {font-weight: normal;}
h1 {font-size: 2.4em; margin: 0 0 1em 0; line-height: 1.2em;}
h2 {font-size: 2em; margin: 0 0 0.8em 0; line-height: 1.2em;}
h3 {font-size: 1.6em; margin: 0 0 0.6em 0; line-height: 1em;}
h4 {font-size: 1.4em; margin: 0 0 0.4em 0; line-height: 1em;}

body {font: 16px/18px 'Open Sans', sans-serif; color: #333;}

header {height: auto; background: #F7DFC7;}
header {background: #5C678D;}
#navigation {width: 100%; margin: 0 auto; padding: 20px 0;}
#navigation-container {position: relative; max-width: 1200px; width: 100%; margin: 0 auto;}
#navigation #top-contact {position: absolute; right: 0; top: 0; display: flex;}
#navigation #telefono {display: flex; align-items: center;}
#navigation #telefono a {padding-left: 16px; font-size: 2em;}
#navigation #social {display: flex;}
#navigation #social > div {display: flex; margin-left: 20px;}

#logo {display: inline-block;}
#logo img {width: 120px; height: auto;}
#menu {position: absolute; display: flex; bottom: 10px; right: 0}
#menu li {padding: 10px 20px; display: inline-block;}
#menu li:last-child {padding-right: 0;}


ul.nav-pagination {padding-top: 0; text-align: right;}
ul.nav-pagination li {display: inline-block; margin: 0 3px; padding: 5px;}

ul.nav-pagination li.active {background: #49616F;}
ul.nav-pagination li.active a {color: #FFF;}
ul.nav-pagination a {color: #555;}

#inner-wrapper {max-width: 1200px; width: 100%; margin: 0 auto; padding: 100px 0; box-sizing: border-box;}

#terapias img {width: 100%;}
#terapias #img-container {margin-bottom: 80px;}

footer {position: relative; min-height: 300px; padding: 0 2%; background: #555;}
#footer-container {display: flex; justify-content: center; max-width: 1200px; margin: 0 auto; padding: 50px 0;}
.f-div {max-width: 25%; width: 100%; color: #FFF;}
.f-div span {display: block; margin-bottom: 1em; line-height: 1.2em; text-transform: uppercase;}
footer ul li {line-height: 2em;}

#footer-container-down {display: flex; justify-content: space-around; max-width: 1200px; margin: 0 auto; padding: 50px 0;}







 /* Extra small devices (phones, 600px and down) */
 @media only screen and (max-width: 600px) {
    /* xs */
    .xs-12 {grid-column: span 12;}
    .xs-6 {grid-column: span 6;}
 }
 @media only screen and (max-width: 1280px) {

   #navigation {padding: 20px 2%;}
   #inner-wrapper {padding: 100px 2%;}

 }
 @media only screen and (max-width: 1200px) {
 
   #footer-container {flex-wrap: wrap;}
   .f-div {max-width: 33%; width: 100%; margin: 0 0 50px 0; padding: 0 2%;}
   .f-title {text-align: center;}

 }
 @media only screen and (max-width: 1024px) {



 }
 /* Large devices (laptops/desktops, 992px and down) */
 @media only screen and (max-width: 992px) {



   #navigation #menu.up {display: none;}
   #navigation #menu.down {display: block; position: static; padding-top: 30px;} 
   #navigation #menu.down li {display: block; margin: 0 0 10px 0; text-align: center;}
   
   #menu li:last-child {padding: 10px 20px;}
   #navigation #menu.down li a {display: inline-block; padding: 10px 0; }

   #navigation #top-contact {top: 36px; right: 40%; flex-direction: column; padding-right: 0;}
   #social {margin-bottom: 10px;}

   #navigation span.toggle-nav {position: absolute; right: 0; top: 10px; display: block; margin-right: 20px;}
   #navigation span.toggle-nav-btn {display: block; width: 2.2em; height: auto; border: solid 1px #FFF; border-radius: 3px; cursor: pointer;}
   span .s-line {display: block; width: 1.5em; height: 1px; margin: 6px auto; background: #FFF;}

 }
 @media only screen and (max-width: 768px) {

   #navigation #top-contact {right: 30%;}
   .f-div {max-width: 47%;}

 }
 @media only screen and (max-width: 600px) {

   #navigation #top-contact {right: 20%;}
   #navigation #social img {width: 36px; height: auto;}
   #navigation #telefono a {font-size: 1.8em;}
   #navigation #logo img {width: 100px;}

   #footer-container {flex-direction: column; justify-content: center;}
   .f-div {justify-content: center;max-width: 100%; align-items: center; text-align: center;}


 }

 /* Small devices (portrait tablets and large phones, 600px and up) */
 @media only screen and (min-width: 600px) {

    .sm-12 {grid-column: span 12;}
    .sm-6 {grid-column: span 6;}
   
 }
 
 /* Medium devices (landscape tablets, 768px and up) */
 @media only screen and (min-width: 768px) {

    .md-12 {grid-column: span 12;}
    
 }
 
 /* Large devices (laptops/desktops, 992px and up) */
 @media only screen and (min-width: 992px) {

    .lg-12 {grid-column: span 12;}
    .lg-6 {grid-column: span 6;}
    
 }
 
 /* Extra large devices (large laptops and desktops, 1200px and up) */
 @media only screen and (min-width: 1200px) {

    .xl-6 {grid-column: span 6;}
 } 

 .clearfix:after {content: " ";visibility: hidden;display: block;height: 0;clear: both;}table {width: 100%; border-collapse: collapse; font-size: 1em;}
label, input, select, textarea {display: block; width: 100%;}
input, select, textarea {padding: 0.8em; border: solid 1px #CCC; background: none; color: #7483a7;}

label span {display: block; padding-bottom: 3px;}
input {border-radius: 5px;}


.btn {padding: 16px; text-align: center; font-size: 1em; font-weight: 400; border: none; cursor: pointer;}
.btn-send, .btn-success {color: #FFF; background: #698F27;}
.btn-send:hover, .btn-success:hover {background: #17843a;}
.btn-danger {color: #FFF; background: #cc3443;}
.btn-danger:hover {background: #a01b26;}
.btn-cancel {color: #FFF; background: #6a727a;}
.btn-cancel:hover {background: #4e555b;}

.btn-block {display: block; width: 100%;}
.btn-search {color: #FFF; background: #0069D9;}
.form-brick {margin-bottom: 30px;}

.text-danger {color: #cc3443!important;}
.text-danger:hover {color: #a01b26!important;}
.text-success {color: #698F27;;}
.text-success:hover {color: #17843a;}

form .form-group {display: grid; grid-gap: 10px 30px; grid-template-columns: repeat(12,1fr); justify-content: space-between;}

.form-brick.legales {display: flex; flex-direction: row-reverse; margin-bottom: 0; padding-top: 30px;}
input#Legales {display: inline-block; width: 18px; height: 18px; margin-right: 10px;}

.gr-col-sp-8 {grid-column: span 8;}
.gr-col-sp-4 {grid-column: span 4;}
.gr-col-sp-2 {grid-column: span 2;}

.bg-success {background: #698F27;}
.bg-success:hover {background: #17843a;}

.bg-danger {background: #cc3443;}

.btn-lnk {display: block; font-size: 14pt; text-align: center; color: #FFF;}
.msg-box {width: 80%; margin: 0 auto 30px auto; padding: 20px; text-align: center; color: #FFF;} 
span.text-danger {font-size: 0.9em;}



@media all and (max-width: 992px) {
   
}
@media all and (max-width: 768px) {
  
}
@media all and (max-width: 576px) {
   
}
/* Legal y Cookies */

section#cookies p {margin: 0 0 1.5em 0;}

#cookies-table {width: 100%; margin: 0 0 50px 0; border-collapse: collapse;}
#cookies-table td, #cookies-table th {padding: 10px 8px; border: solid 1px #F2F2F2;}
#cookies-table th {background: #1A73E8; color: #FFF;}


/* Banner aviso cookies */

#banner-cookies {position: fixed; bottom: 0; width: 100%; padding: 50px 100px 0 100px; background: #EBEBEB; color: #333;}
/* #banner-cookies {display: none;} */
#banner-cookies h3 {margin-bottom: 1em; color: #3C86E8;}
#banner-cookies p {line-height: 1.2em;}
#banner-cookies a {color: #3C86E8;}
#consent-btn-container {display: flex; flex-direction: row; justify-content: end; width: 100%; padding: 30px 0;}
#consent-btn-container button, #cookies-config-panel button, #btn-config-cookies {padding: 10px 20px; margin: 0 20px; border: none; background: #1A73E8; font-size: 1em; color: #FFF; cursor: pointer;}
#btn-config-cookies {display: block; margin: 80px auto; padding: 30px; border-radius: 60px; font-size: 1.2em;}
#consent-btn-container button:hover, #cookies-config-panel button:hover, #btn-config-cookies:hover {background: #3C86E8;}
#consent-btn-container button a {color: #FFF;}  


/* PopUp configuración de cookies */

#cookies-config-panel-container {position: fixed; top:0; left:0; display: none; align-items: center; height:100%; width: 100%; background: rgb(33,33,33,0.7); z-index: 20;}
#cookies-config-panel {position: relative; height: auto; max-width: 800px; margin: 0 auto; padding: 50px 30px; z-index: 21; background: #F2F2F2;}
#cookies-config-panel h1 {margin: 0 0 1.2em 0; text-align: center; font-size: 1.6em;}
#btn-close-cookies-config-panel {position: absolute; top: 20px; right: 24px; border: none; font-size: 1em; cursor: pointer;}

#cookies-config-panel #buttons-container-2 {display: flex; justify-content: end; padding: 30px;}

.btn-container-item {display: flex; align-items: end; padding: 10px 0;}
.btn-container-item > div {min-width: 200px;}
.btn-name {display: inline-block; padding: 9px 20px;}

/* The switch - the box around the slider */
.switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 30px;
  }
  
  /* Hide default HTML checkbox */
  .switch input {
    opacity: 0;
    width: 0;
    height: 0;
  }
  
  /* The slider */
  .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
  }
  
  .slider:before {
    position: absolute;
    content: "";
    height: 22px;
    width: 22px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
  }
  
  input:checked + .slider {
    background-color: #2196F3;
  }
  
  input:focus + .slider {
    box-shadow: 0 0 1px #2196F3;
  }
  
  input:checked + .slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
  }
  
  /* Rounded sliders */
  .slider.round {
    border-radius: 34px;
  }
  
  .slider.round:before {
    border-radius: 50%;
  }

  @media only screen and (max-width: 768px) {

    #consent-btn-container {flex-direction: column-reverse;}
    #consent-btn-container button {margin-bottom: 20px;}
    #banner-cookies { padding: 50px 5%;}

  }


