/* ========================================================================
   Use this file to add custom CSS easily
 ========================================================================== */
@import url('https://fonts.googleapis.com/css?family=Tinos');
font-family: 'Tinos', cursive;

@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/bootstrap-icons.min.css");

@import url('https://fonts.googleapis.com/css?family=Tangerine');
font-family: 'Tangerine', cursive;

@import url('https://fonts.googleapis.com/css?family=Great+Vibes');
font-family: 'Great Vibes', cursive;


<link
    rel="stylesheet"
    href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css"
  />

:root {
  --body-font-family: Tinos !important;
	--body-color:  #000000!important;
  --body-bg:  #ffffff !important;

}   

body {
    font-family: Tinos !important;
}

.uk-scope .uk-h1, .uk-scope .uk-h2, .uk-scope .uk-h3, .uk-scope .uk-h4, .uk-scope .uk-h5, .uk-scope .uk-h6, .uk-scope .uk-heading-2xlarge, .uk-scope .uk-heading-large, .uk-scope .uk-heading-medium, .uk-scope .uk-heading-small, .uk-scope .uk-heading-xlarge, .uk-scope h1, .uk-scope h2, .uk-scope h3, .uk-scope h4, .uk-scope h5, .uk-scope h6 {
    margin: 0 0 20px 0;
    font-family: Tinos,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji" !important;
    font-weight: 400;
    color: #333;
    text-transform: none;
}


h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
    font-family: var(--cassiopeia-font-family-headings,Tinos,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");
    font-weight: var(--cassiopeia-font-weight-headings,700);
}

body {
    /* font-family: var(--body-font-family); */
    font-size: var(--body-font-size);
    font-weight: var(--body-font-weight);
    line-height: var(--body-line-height);
    color: var(--body-color); 

    text-align: var(--body-text-align);
  background-color: var(--body-bg);
      
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: #000000;
    margin: 0;
}


.cat-children{
  list-style: disc;
  padding: 0;
  margin: 0;
  display: flex;           /* Hace que los ítems estén en línea */
  flex-wrap: wrap;         /* Permite que salten a otra línea si no caben */
  gap: 2rem;               /* Espaciado entre los enlaces */
}

.cat-children li {
  margin: 0;
}

.cat-children li a {
  display: inline-block;
  padding: 0.5rem 1rem;
  text-decoration: none;
  background: #f5f5f5;
  border-radius: 4px;
  transition: background 0.3s;
}

.cat-children li::before {
    content: "►";
    padding-right: 5px;
}

.cat-children li a:hover {
  background: #ddd;
}
 
h2, .h2 {
    font-size: calc(.7rem + .9vw) !important;
}

a {
    text-decoration: none !important;
/*    color: #c02a07 !important; */
}

/* mouse over link */
a:hover {
  /* color: red !important; */
}


h3, .h3 {
    font-size: calc(0.8rem + .6vw) !important;
}

 
.dbp04{
  color: #073a9f;
  background:red;
}

.dbp02 {
  padding-top: 20px;
  text-shadow: 2px 2px 4px #6A6969  ;
  font-family: 'Great Vibes', cursive;
  text-decoration: none;
  	color: white;
    text-decoration: none;
    cursor: pointer;
 }

.footer {
    color: #fff;
    background-color: #000000 !important;
    background-image: linear-gradient(135deg, #000000 0%, #000000 100%) !important; 
    margin-top: 1em;
}


.container-header {
    z-index: 10;
    background-color: #000000 !important ;
    background-image: linear-gradient(180deg, #000000 0%, #000000 100%) !important;
    position: relative;
    box-shadow: inset 0 5px 5px #00000008;  
}