a:hover {
	color: #2d8ec4;
}

.block-column > .grid, .item-list > .block-column > .grid {
  margin: 0 0 1rem;
  padding: 10px;
  box-shadow: 5px 0px 10px 0px #bcd5d969;
}

ul.breadcrumb {
  padding: 8px 16px;
  list-style: none;
  color: #000;
}

h1{
  color: #2d8ec4;
}

h2, h3 {
  color: #009796;
}

h1.page-title {
  padding: 24px 0px;
  font-size: 46px;
}

.field--name-field-note p {
  font-size: 16px;
}

.slick-arrow::before {
  color: #ffffff;
  font-size: 36px;
  font-size: 2.25rem;
}

.slide__caption {
  background-color: #ffffffd6;
}

.slide__title {

  text-align: center;
}

.slide__link {
	margin: 30px auto;
	padding: 4px;
	color: #000;
	background: #fff;
	width: 200px;
	text-align: center;
	border-radius: 100px;
	font-weight: bolder;
	box-shadow: 0 1px 2px 1px #00000059;
}

/* Global */
html,
body,
button,
input,
select,
optgroup,
textarea {
  color: #637381;
}

a,
.w3-button {
  transition: 0.4s !important;
}

.ul-parent-account {
  color: inherit;
}

#header .fa,
#header .svg-inline--fa {
  color: inherit;
}

#top-container .top-box>div,
#bottom-container .bottom-box>div,
#footer-container .footer-box>div {
  border-width: 1px;
  border-style: solid;
}

/* Border Color  */
.cke_top,
.w3-border,
ul.primary,
.cke_bottom,
.cke_chrome,
ul.secondary,
ul.primary > li,
#top-container .top-box>div,
#bottom-container .bottom-box>div,
#footer-container .footer-box>div {
  border-color: #d3d8dd !important;
}

/* Hover Color  */
.w3-hover-over:hover,
.w3-button:hover,
#open-search:hover,
#open-nav-inner:hover {
  color: #637381 !important;
  background-color: #e6e9ec !important;
}

input:focus,
select:focus,
textarea:focus {
  box-shadow: 0 25px 57px 0 rgba(0, 0, 0, .25);
  border-color: #a3aeb8;
}

#footer-menu-inner form.w3-content {
  border: 1px solid #fff;
}

/* You must have a sub-theme available and an image name page-wrapper.jpg
  inside images folder */

/* Use the image on drupal.org for direction on how to change the colors for each region. */

/* https://www.drupal.org/files/project-images/drupal8-w3css-theme-color-guidance.jpg */

/* Disable colors on all parents */


.page-wrapper,
#footer-menu,
#highlighted,
#welcome-text,
#top-container,
#main-container,
#bottom-container,
#footer-container {
  background-color: transparent;
  color: #637381;
}

 #footer-menu {
  background-color: #ffffffd4;
  color: #444;
  font-size: 12px;
}

#header,
.close-nav,
#copyright,
.mobile-nav,
#page-title,
.search-slide-wrapper,
.main-navigation-wrapper {
  background-color: white;
  color: #637381;
}

#top-container .top-box>div,
#footer-container .footer-box>div,
#main-container-inner .main-box>div,
#bottom-container-inner .bottom-box>div {
  background-color: white;
  color: #637381;
}



/* We apply the main image to the whole page wrapper */
.page-wrapper {
  background-color: transparent;
  background-image: url(../../images/sfondo-farmacia.jpg);
  background-repeat: no-repeat;
  background-attachment: fixed;
}

/* button animation  */
@keyframes btnBorderAnimation {
  0% {
    width: 0;
    height: 0;
    border-bottom-color: #a3aeb8;
  }

  99.9999% {
    width: 100%;
    height: 100%;
    border-bottom-color: #a3aeb8;
  }

  100% {
    width: 0;
    height: 0;
    border-bottom-color: transparent;
  }

}

/* Border animation  */
@keyframes borderLeftColors {
  0% {
    width: 0;
    height: 0;
    border-top-color: #a3aeb8;
    border-right-color: transparent;
    border-bottom-color: transparent;
    border-left-color: transparent;
  }

  50% {
    width: 100%;
    height: 0;
    border-top-color: #a3aeb8;
    border-right-color: #a3aeb8;
    border-bottom-color: transparent;
    border-left-color: transparent;
  }

  99.9999% {
    width: 100%;
    height: 100%;
    border-top-color: #a3aeb8;
    border-right-color: #a3aeb8;
    border-bottom-color: transparent;
    border-left-color: transparent;
  }

  100% {
    width: 0;
    height: 0;
    border-top-color: transparent;
    border-right-color: transparent;
    border-bottom-color: transparent;
    border-left-color: transparent;
  }

}

@keyframes borderRightColors {
  0% {
    width: 0;
    height: 0;
    border-top-color: transparent;
    border-right-color: transparent;
    border-bottom-color: #a3aeb8;
    border-left-color: transparent;
  }

  50% {
    width: 100%;
    height: 0;
    border-top-color: transparent;
    border-right-color: transparent;
    border-bottom-color: #a3aeb8;
    border-left-color: #a3aeb8;
  }

  99.9999% {
    width: 100%;
    height: 100%;
    border-top-color: transparent;
    border-right-color: transparent;
    border-bottom-color: #a3aeb8;
    border-left-color: #a3aeb8;
  }

  100% {
    width: 0;
    height: 0;
    border-top-color: transparent;
    border-right-color: transparent;
    border-bottom-color: transparent;
    border-left-color: transparent;
  }

}