/* width */
::-webkit-scrollbar {
  width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #f1f1f1; 
}
 
/* Handle */
::-webkit-scrollbar-thumb {
  background: #888; 
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #555; 

}

body{font-family: Roboto; scroll-behavior: smooth;}

h1,h2,h3,h4,h5,h6  {font-family: Roboto !important; font-weight: 700; margin-bottom: 20px;  color: #023363;}
.h1,.h2,.h3,.h4,.h5,.h6 {font-family: Roboto !important; font-weight: 700; color: #023363;}

header {display: inline-block; width: 100%; background-color: #003863;}

nav.navbar {box-shadow: none !important;min-height: inherit;}
nav a.nav-link {color: #fff }
nav.navbar .navbar-brand img, nav.navbar .navbar-brand {height: 100px !important;}
nav.navbar .navbar-nav .nav-item .nav-link {text-decoration: none !important;}
nav.navbar.navbar-expand-lg .navbar-collapse {justify-content: end;}


#logo {max-width: 300px;} 
.navbar{justify-content: center !important;}
.navbar-nav .nav-link {font-weight: 400; border-bottom: 2px solid transparent}
.navbar-nav .nav-link:hover {border-bottom: 2px solid #1B8C63}

main p, main li, main ol li { color: #023363;}

footer {border-top: 10px solid #21a9af}

@media (max-width: 767px){
  .nav {display: block;}
}
@media (min-width: 768px){
  main p  {font-size: 1.3rem; line-height: 1.8rem;}
  main ul li, main ol li {font-size: 1.3rem; line-height: 2.2rem;}
}

.bg-lima {background-color:#e7ffe8 !important;}
.bg-crema {background-color:#fdf4d4 !important;}

.btn {border-radius: 1.25rem;}

/*--------------------------------------------------------------
# home 
--------------------------------------------------------------*/
.accesos .btn {border: 3px solid #fff !important; transition: 0.7s;} 
.accesos .btn:hover {
-webkit-box-shadow: 7px 7px 0px 0px rgba(0,0,0,1);
-moz-box-shadow: 7px 7px 0px 0px rgba(0,0,0,1);
box-shadow: 7px 7px 0px 0px rgba(0,0,0,1);
transform: translateX(7px 7px);
transition: 0.7s;
}
.card {transition: 0.7s;}
.card:hover {
-webkit-box-shadow: 0px 0px 7px 0px rgba(177,177,177,1);
-moz-box-shadow: 0px 0px 7px 0px  rgba(177,177,177,1);
box-shadow: 0px 0px 7px 0px  rgba(177,177,177,1);
transition: 0.7s;
}
.accesos .btn img {transform: scale(0.9); transition: 0.7s; }
.accesos .btn:hover img {transform: scale(1); transition: 0.7s; }
#links {padding: 3em 0; background-color: rgb(166 186 245 / 40%);;} 
p a {color: blue !important;}

/*--------------------------------------------------------------
# Preloader
--------------------------------------------------------------*/
#preloader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9999;
  overflow: hidden;
  background: #fff;
}

#preloader:before {
  content: "";
  position: fixed;
  top: calc(50% - 30px);
  left: calc(50% - 30px);
  border: 6px solid #1B8C63;
  border-top-color: #d1e6f9;
  border-radius: 50%;
  width: 60px;
  height: 60px;
  -webkit-animation: animate-preloader 1s linear infinite;
  animation: animate-preloader 1s linear infinite;
}

@-webkit-keyframes animate-preloader {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

@keyframes animate-preloader {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

/*--------------------------------------------------------------
# Back to top button
--------------------------------------------------------------*/
.back-to-top {
  position: fixed;
  display: none;
  left: 15px;
  bottom: 15px;
  z-index: 99999;
}

.back-to-top i {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  width: 40px;
  height: 40px;
  border-radius: 50px;
  background: #1B8C63;
  color: #fff;
  transition: all 0.4s;
}

.back-to-top i:hover {
  background: #1c84e3;
  color: #fff;
}

.datepicker-dropdown {
  padding: 20px !important;
}

/*--------------------------------------------------------------
# a11y-contrast
--------------------------------------------------------------*/
.a11y-contrast .alert-info,
.a11y-contrast .alert-warning,
.a11y-contrast .alert-danger,
.a11y-contrast .alert-success,
.a11y-contrast .list-group-item-info,
.a11y-contrast .list-group-item-warning,
.a11y-contrast .list-group-item-danger,
.a11y-contrast .list-group-item-success {background-color: #333;}

/*--------------------------------------------------------------
# toolbar
--------------------------------------------------------------*/

.toolbar .toolbar-btn-group, .toolbar .toolbar-btn {display: inline-block !important;}
.toolbar {justify-content: center;}
.toolbar-btn.toolbar-toggler, .toolbar-btn.toolbar-behavior-read {display: none !important;}
.toolbar-btn.toolbar-behavior-contrast {margin-right: 4px;}

@media (max-width:678px){
  #logo {max-width: 200px;} 
}




