@import url('https://fonts.googleapis.com/css?family=Lato|Lato:300|Vollkorn:400italic');

body {
  background: url('../images/web/fondo.png') !important;
  background-repeat: no-repeat !important;
  background-position: bottom;
  background-color: #f6cc91 !important;
  color: #666 !important;
  font-family: 'Lato' !important;
  overflow-x: hidden;
}

h4.blog {
  background: none !important;
  font-family: 'Lato', sans-serif !important;
  font-style: normal !important;
  font-size: 24px !important;
  font-weight: bold !important;
  font-variant: normal !important;
  color: #333 !important;
}

#root-container {
  margin: 4px auto;
  margin-top: 0px;
}

.padding-dest {
  margin: 0 16px;
}

.padding-dest4col {
  margin: 10px 4px;
}

.introColsTitle {
  padding-top: 10px;
  padding-left: 15px;
  padding-right: 15px;
}

.textIntroCols {
  /*   padding-left: 15px;
  padding-right: 15px; */
  font-size: 16px;
  padding-bottom: 25px;
}

.txt2cols {
  padding-top: 10px;
}

#copyright {
  background: #333;
}

#copyright {
  background: #333;
  color: #ccc;
  font-size: 12px;
  padding: 8px 0;
  min-height: 30px;
}

#footer {
  margin-top: 75px;
  padding-top: 10px;
}

#footer,
span.footer {
  background: #eee;
}

.react-calendar__navigation button {
  min-width: auto !important;
}

#circleStep {
  border-radius: 25px !important;
  padding-right: 10px;
  padding-left: 10px;
  text-shadow: none;
}

.textForm {
  width: 100%;
}

input[type='text'],
input[type='password'],
input[type='email'],
textarea,
select {
  width: 70% !important;
}

#contactList {
  list-style: square !important;
  padding-left: 10px;
}

.calendarMod {
  font-size: 70%;
  width: 95% !important;
}

h6 {
  background: url('../images/heading-line.gif') center repeat-x;
  color: #222;
  font-family: 'Vollkorn:800italic' !important;
  font-style: italic !important;
  font-weight: 800 !important;
  line-height: 1em;
  margin-bottom: 0;
}

.react-calendar__navigation {
  background-color: #dddddd;
}

.widget-contact-info {
  font-size: 80% !important;
}

.contactLink {
  text-decoration: none;
  color: seagreen;
  font-size: 120%;
}

.menuDropdown {
  background-color: #242424;
  position: absolute;
  display: flex;
  flex-direction: column;
  -moz-box-shadow: 0 1px 5px #333;
  -webkit-box-shadow: 0 1px 5px #333;
  box-shadow: 0 1px 5px #333;
  margin-top: 13px;
  padding-top: 5px;
  padding-left: 10px;
  padding-right: 10px;
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s 9999s, opacity 0.1s linear;
}

#dropdownLink:hover + div.menuDropdown {
  visibility: visible;
  opacity: 1;
  transition-delay: 0s;
}

.menuDropdown:hover {
  visibility: visible;
  opacity: 1;
  transition-delay: 0s;
}

.menuSelected {
  color: #fff !important;
}

.playball {
  font-family: 'Playball', cursive;
}

.markscript {
  font-family: 'Marck Script', cursive;
}

.lato {
  font-family: 'Lato', sans-serif;
}

.logoImg {
  float: left;
  position: absolute;
  z-index: 31;
  padding: 20px;
}

#sub-banner {
  line-height: 0;
  min-height: 220px;
}

.slider {
  height: 450px;
}

/** navbar **/
#navbar {
  top: 0;
  width: 100%;
  height: 40px;
  background: linear-gradient(93deg, white, transparent);
  position: fixed;
  z-index: 100;
  box-shadow: 0px 0px 4px 1px #0000001f;
}

#menuTop {
  float: left;
  color: white;
}

.dropdown {
  position: fixed !important;
}

#menuDropIcon {
  width: 24px;
  padding: 1px;
  padding-top: 3px;
  padding-bottom: 0px;
  padding-right: 13px;
  height: 22px;
  background-color: #2698451c;
  color: #269845;
  margin-top: -2px;
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
  animation: color-me-in 3s infinite;
  border: 1px solid white;
  visibility: hidden;
  opacity: 1;
  transition: visibility 0s, opacity 0.5s linear;
}

.linkNavbar a {
  color: #333;
  text-decoration: none;
}

.linkNavbar a:hover {
  color: #333;
  text-decoration: none;
}

.linkNavbar a:visited {
  color: #333;
  text-decoration: none;
}

.linkNavbarSelected a:visited {
  color: #bdbdbd;
}

.linkNavbarSelected a {
  color: #bdbdbd;
}

.menuMobileWrap {
  height: 30px;
  width: 100%;
  padding-top: 5px;

  display: flex;
}

.menuTxt {
  padding-top: 5px;
  padding-left: 10px;
  font-size: 90%;
}

.menuMobileIcon {
  padding-top: 5px;
  padding-left: 10px;
}

.menuli li {
  padding-top: 5px;
}

.menuli a {
  text-decoration: none;
}

.menuMobileOpen {
  width: 60%;
  transition: width 0.5s;
  -moz-transition: width 0.5s;
  /* Firefox 4 */
  -webkit-transition: width 0.5s;
  /* Safari and Chrome */
  -o-transition: width 0.5s;
  /* Opera */
  max-width: 250px;
  height: 100%;
  float: left;
  position: fixed;
  background-color: white;
  -moz-box-shadow: 0 1px 5px #333;
  -webkit-box-shadow: 0 1px 5px #333;
  box-shadow: 0 1px 5px #333;
}

.menuMobile {
  width: 0%;
  max-width: 250px;
  height: 100%;
  float: left;
  position: fixed;
  background-color: white;
  -moz-box-shadow: 0 1px 5px #333;
  -webkit-box-shadow: 0 1px 5px #333;
  box-shadow: 0 1px 5px #333;
}

.menuMobileClose {
  width: 0%;
  transition: width 0.5s;
  -moz-transition: width 0.5s;
  /* Firefox 4 */
  -webkit-transition: width 0.5s;
  /* Safari and Chrome */
  -o-transition: width 0.5s;
  /* Opera */
}

.menuMobileInnerTs {
  padding-top: 20px;
  visibility: visible;
  opacity: 1;
  transition: visibility 0s, opacity 0.5s linear;
}

.menuMobileInner {
  visibility: hidden;
  opacity: 0;
}

.menuLeftHr {
  margin: 7px !important;
  background-color: #808080c7 !important;
}

.backMenu {
  position: fixed;
  width: 100%;
  margin-left: 250px;
  height: 100%;
}

/** fin navbar **/

.swal2-title {
  background: none;
}

@media (max-width: 200px) {
  #sliderWrapper {
    max-height: 150px;
  }
}

@media (min-width: 200px) and (max-width: 380px) {
  .logoImg {
    float: left;
    position: absolute;
    z-index: 31;
    padding: 20px;
    max-width: 170px;
    padding-top: 5px;
  }

  .headerImage {
    object-fit: fill;
    height: 105px;
  }

  /* .slider {
    height: auto;
  } */

  #sliderWrapper {
    max-height: 150px;
  }

  .introColsTitle {
    margin-left: 15px;
    margin-right: 15px;
  }

  .container_theme {
    width: 300px !important;
  }

  .container_theme .sixteen.columns {
    width: 300px !important;
  }
}

@media (min-width: 381px) and (max-width: 414px) {
  #intro {
    width: 310px !important;
  }

  .logoImg {
    float: left;
    position: absolute;
    z-index: 31;
    padding: 20px;
    max-width: 170px;
    padding-top: 5px;
  }

  .headerImage {
    object-fit: fill;
    height: 105px;
  }
  /* 
  .slider {
    height: auto;
  } */

  #sliderWrapper {
    max-height: 180px;
  }

  .introColsTitle {
    margin-left: 15px;
    margin-right: 15px;
  }

  .container_theme {
    width: 370px !important;
  }

  .container_theme .sixteen.columns {
    width: 370px !important;
  }
}

@media (min-width: 415px) and (max-width: 479px) {
  #intro {
    width: 310px !important;
  }

  .logoImg {
    float: left;
    position: absolute;
    z-index: 31;
    padding: 20px;
    max-width: 170px;
    padding-top: 5px;
  }

  .headerImage {
    object-fit: fill;
    height: 105px;
  }

  /* .slider {
    height: auto;
  } */

  #sliderWrapper {
    max-height: 190px;
  }

  .introColsTitle {
    margin-left: 15px;
    margin-right: 15px;
  }

  .container_theme {
    width: 410px !important;
  }

  .container_theme .sixteen.columns {
    width: 410px !important;
  }
}

@media (min-width: 480px) and (max-width: 544px) {
  .logoImg {
    float: left;
    position: absolute;
    z-index: 31;
    padding: 20px;
    max-width: 170px;
  }

  .headerImage {
    object-fit: fill;
    height: 140px;
  }

  /* .slider {
    height: 200px;
  } */

  #sliderWrapper {
    max-height: 210px;
  }

  .introColsTitle {
    margin-left: 35px;
    margin-right: 35px;
  }

  .container_theme {
    width: 450px !important;
  }

  .container_theme .sixteen.columns {
    width: 450px !important;
  }
}

@media (min-width: 540px) and (max-width: 767px) {
  .logoImg {
    float: left;
    position: absolute;
    z-index: 31;
    padding: 20px;
    max-width: 170px;
  }

  .headerImage {
    object-fit: fill;
    height: 140px;
  }

  /* .slider {
    height: 200px;
  } */

  #sliderWrapper {
    max-height: 240px;
  }

  .introColsTitle {
    margin-left: 35px;
    margin-right: 35px;
  }

  .container_theme {
    width: 520px !important;
  }

  .container_theme .sixteen.columns {
    width: 520px !important;
  }
}

/*  #Mobile (Portrait)
================================================== */

/* Note: Design for a width of 320px */

@media (min-width: 768px) and (max-width: 959px) {
  .logoImg {
    float: left;
    position: absolute;
    z-index: 31;
    padding: 20px;
    max-width: 200px;
  }
}

@media (min-width: 958px) {
  .logoImg {
    float: left;
    position: absolute;
    z-index: 31;
    padding: 20px;
    width: 100%;
    max-width: 270px;
  }
}