/* 
    Created on : 22/05/2020, 01:09:57 PM
    Author     : manuel alonso
*/

div, table, a {
    background-color: inherit;
    color: inherit;
    font-size: inherit;
}

tr, td, th {
    width: auto;
    white-space: nowrap;
}

thead th {
    position: sticky; 
    top: 0; 
}

.arrow-down {
    width: 0; 
    height: 0; 
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid black;
}

html,body {
    scroll-behavior: smooth;
    margin: 0;
    font-size: 1rem;
    height: 100%;
}

body {
    margin: 0;
    font-size: 1.2rem;
}

p {
    /*padding-left: .5rem;
    padding-right: .5rem;*/
}

a{
    display: inline-block;
    /*transition: all .5s;*/
    text-decoration: none;
    color:inherit;
    font-family: inherit;
}
textarea {
    border-radius: .68rem;
    padding: .375rem .75rem;
    font-size: 1.2rem;
    line-height: 1;
    border: 1px solid #ced4da;
    background-color: #F2F2F2;
    outline: none;
    resize:none;
    font-family: inherit;
    font-size: .8rem;
}

section {padding:0px}
ul {padding:0px;}
li {padding:0px;}


.linktobutton {
    background-color: goldenrod;
    text-decoration: none;
    color: white;
    border-radius: .25rem;
    text-align: center;
    display: inline-block;
    transition: all .3s;
    padding: .5rem;
}
.linktobutton.blue {
    background-color: #4C9EEB;
    text-decoration: none;
    color: white;
    border-radius: .25rem;
    text-align: center;
    display: inline-block;
    transition: all .3s;
    padding: .5rem;
}

.linktobutton:hover, a:hover, .anim_opacity:hover {
    opacity: .6;
}


.buttonlink {
  background: none!important;
  border: none;
  outline: none;
  padding: 0!important;
  color:inherit;
  text-decoration: none;
  cursor: pointer;
}

.top_menu {
    /*width:100%;*/
    height:3.5rem;
    /*overflow:hidden;*/
}

.spacer {
    height: .5rem;
    background-color: inherit;
}

.drop_shadow{
    box-shadow: 1px 1px 1px 1px #e0e0e0;
}
/* responsive_columns styles */


:root {
    --grid_format: repeat(auto-fit, minmax(320px, 1fr));
    --grid_gap_size: 0rem;
}

.responsive_columns {
}

.responsive_columns > ul {
    display: grid;
    /*grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));*/
    /*grid-template-columns: 1fr 2fr 1fr;*/
    grid-template-columns: var(--grid_format);
    grid-gap: var(--grid_gap_size);
    list-style: none; 
    padding: 0rem;
}

.responsive_columns > div {
    display: grid;
    /*grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));*/
    /*grid-template-columns: 1fr 2fr 1fr;*/
    grid-template-columns: var(--grid_format);
    grid-gap: var(--grid_gap_size);
    list-style: none; 
    padding: 0rem;
}

.responsive_columns > ul > li {
    list-style: none; /*padding-left: .5rem;padding-right: .5rem;*/
}

.body_content > section > ul > li {
}

.responsive_columns > ul > li > figure {
    max-height: 280px;
    overflow: hidden;
    /*border-top-left-radius: .5rem;
    border-top-right-radius: .5rem;*/
    position: relative;
}

.responsive_columns > ul > li > figure > img {
    width: 100%;
}

.responsive_columns > ul > li > figure > figcaption {
    position: absolute;
    bottom: 0;
    background-color: rgba(0,0,0,.7);
    width: 100%;
}

.responsive_columns > ul > li > figure > figcaption > h3 {
    color: white;
    padding: .75rem;
    font-size: 1.25rem;
}

.responsive_columns > ul > li > p {
    font-size: 1rem;
    line-height: 1.5;
    padding: 1rem .75rem;
    color: #666666;
}

.responsive_columns > ul > li > a {
    padding: .5rem 1rem;
    margin: .5rem;
}

.responsive_columns > ul > li > ul > li {
    /*font-size: .8rem;*/
    list-style: none;
    color:inherit;
}

.iframe_container {
    position: relative;
    overflow: hidden;
    width: 100%;
    padding-top: 56.25%; /* 16:9 Aspect Ratio (divide 9 by 16 = 0.5625) */
    height: 100%;
}
.iframe-responsive {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    border-style: none;
    overflow-y:visible;
}

.avatar_round {
    border-radius: 50%;
}

.circle {
    border-radius: 50%;
    color: #fff;
    text-align: center;
    padding:0px;
}

.circle.small{width: 3rem; height: 3rem;line-height: 3rem;font-size: 1rem;}
.circle.medium{width: 4rem; height: 4rem;line-height: 4rem;font-size: 2rem;}
.circle.mediumlarge{width: 5rem; height: 5rem;line-height: 5rem;font-size: 3rem;}
.circle.large{width: 10rem; height: 10rem;line-height: 10rem;font-size: 5rem;}
.circle.xlarge{width: 14rem; height: 14rem;line-height: 14rem;font-size: 7rem;}

.sticky{
    position: -webkit-sticky; /* Safari */
    position: sticky;
    top: 0;
}

.navbar {
    overflow: hidden;
    background-color: white;
    /*border-color:#4C9EEB;*/
    font-size: 1rem;
}

.navbar a {
    float: left;
    /*font-size: 16px;
    color: white;*/
    color:inherit;
    background-color: inherit;
    text-align: center;
    padding-left: 1rem;
    /*padding: 14px 16px;*/
    text-decoration: none;
}


@media screen and (max-width: 501px) {
    .hideonmobile{display: none; color:red;}
    .responsive_columns {padding: 0rem;}
    .responsive_columns > ul {grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));}
    .responsive_columns > div {grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));}
    .body_content > section > ul {padding-left: 0px; padding-right: 0px;}
    .top_menu{font-size:.5rem;}
    .emptyfiller{display: none;}
}

@media screen and (min-width: 502px) {
    .hideondesktop {display: none;}
}


@media (prefers-color-scheme: dark) {

    .logo {filter: invert(1);}

    a {
        color: #4C9EEB;
    }
    img {
        filter: grayscale(30%);
    }

    .spacer {background-color: #11161D;}


    textarea {
        background-color: black;
        color: white;
    }

    .spacer {background-color: black;}

    .dropdown {
        color:inherit;
        background-color: black;
    }

    .dropdown-content {
        box-shadow: none;
        color:inherit;
        background-color: inherit;
    }
    .dropdown-content a {
        color:inherit;
        background-color: inherit;
    }
    .dropbtnmenu {
        color:inherit;
        background-color: black;
    }
}


@media print {
   .noprint {
      visibility: hidden;
      max-height: 1em;
      max-width: 1em;
      /*display:none;*/
   }
}


.dropdown {
    color:inherit;
    background-color: inherit;
    float: left;
    overflow: hidden;
}

.dropdown .dropbtnmenu {
    font-family: inherit;
    color:inherit;
    font-size: inherit;
    border: none;
    outline: none;
    /*color: white;*/
    /*padding: 14px 16px;*/
    padding-left: 1rem;
    background-color: inherit;
    /*font-family: inherit;*/
    margin: 0;
}

.top_menu a:hover, .dropdown:hover .dropbtnmenu {
    opacity: .7;
}

.dropdown-content {
    display: none;
    line-height: 1.3rem;
    color:inherit;
    position: absolute;
    background-color: white;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

.dropdown-content a {
    float: none;
    /*color: black;*/
    padding: .5rem .5rem;
    text-decoration: none;
    display: block;
    text-align: left;
}

.dropdown-content a:hover {
    background-color: #ddd;
}

.dropdown:hover .dropdown-content {
    display: block;
}


.blackish:before {
    background-color: rgba(0, 0, 0, 0.7);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1;
}

.container_slider {
    overflow: hidden;
}
.sliding-background {
    /*background: url('images/banners/bg_professions.jpg') repeat-x;*/
    width: 5076px;
    animation: slide 20s linear infinite;
}
@keyframes slide{
    0%{
        transform: translate3d(0, 0, 0);
    }
    100%{
        transform: translate3d(-1600px, 0, 0);
    }
}