@import url('https://use.typekit.net/oke0sjj.css');
@import url('buttons.css');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600&family=Oswald:wght@200;300;400;500;600&display=swap');
*{
  box-sizing: border-box;
}
body{
  font-family: 'Montserrat', sans-serif;
  font-weight: 300;
}

main .container {
  margin-top: 4rem;
}

h1, h2, h3, h4,.title, .nav-item, .text-atrament ,.font-secondary{
  font-family: 'Oswald', sans-serif;
}

.font-primary{
  font-family: 'Montserrat', sans-serif;
}
.font-logo{
  font-family:'atrament-web';
}
/*font-weight*/
h1, h2, h3, h4,.title{
  font-weight: 400;
}
h2{
  font-size: 1.7em;
}
.fw100 {
  font-weight: 100;
}
.fw200 {
  font-weight: 200;
}
.fw300 {
  font-weight: 300;
}
.fw400 {
  font-weight: 400;
}
.fw600 {
  font-weight: 600;
}
/*--Font- sizes*/
.title-page,.title-production,.mainTitle{
  font-size: 2.4rem;
}
.title-author *{
  font-size: 1.2em;
  font-weight: 600;
  color: #46669c;
  margin-top: 0.5em;
}
.title-author{
  color: #46669c;
}
.title-custom{
  font-family: 'Montserrat', sans-serif;
  font-size: 1.1rem;
  font-weight: 600;
}
a .title-custom:hover{
  color:#000;
}
.title-activity{
  padding: 0.7em;
  border-radius: 0.7em 0.7em 0 0;
}
.title-subtitle{
  font-size: 1.5rem;
}
.subTitle,.sub-title, .title-section{
  font-size: 1.7rem;
  font-weight: 400;
}
.title-level-3{
  font-size: 2rem;
}
.title-level-4{
  font-size: 1.7rem;
}
.title-level-5{
  font-size: 1.4rem;
}
.title-level-6{
  font-size: 1.2rem;
}
p,.activity-slogan p, .activity-slogan li{
  font-size: 0.95rem;
  margin-bottom: 0em;
  line-height: normal;
}
.activity-slogan,.activity-slogan p, .activity-slogan li{
  font-weight: 400;
  margin-bottom: 0.4em;
  text-align: justify;
  hyphens: auto;
  font-size: 15px;
  line-height: 19px;
}
.font-size-09{
  font-size: 0.9rem;
}
.font-size-08{
  font-size: 0.8rem;
}
.font-size-075{
  font-size: 0.75em;
}
a:hover{
  text-decoration: none;
  opacity: 0.8;
}
footer li a:hover{
  color:#ccc!important;
}
.btn:hover{
  opacity: 1;
  background-color: #5c5c5e;
}
.btn-outline-green:hover{
  background-color: #fff;
}
/*----Menu----*/
.nav-item, .navbar .title{
 text-transform: uppercase;
 font-size: 0.95em;
 font-weight: 500;
 letter-spacing: 0.5px;
}

.nav-item a.nav-link{
  color: #43454B!important;
}

.nav-item a {
  padding-right: 0.5rem;
  padding-left: 0.5rem;
}

#btn-register, #btn-login {
  padding-right: 1.1rem;
  padding-left: 1.1rem;
}

.nav-item .bc-purple {
  border-color: #7B1C61;
}

.navbar-right .nav-item{
  text-transform: initial;
}
.navbar-right .dropdown-item{
  font-size: 1rem;
}
.container-menu {
  width: 100%;
}
.dropdown-item:focus, .dropdown-item:hover {
  background-color:#ffe997!important;
}


.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon {
  display:none;
}

.navbar-toggler[aria-expanded="false"] .clos {
  display:none;
}

.clos{
  color: white;
}
.resourceTitle{
  font-size: 12px;
}


/*----Logo----*/
.isologo{
  position: absolute;
  width: 77px;
  top: 8px;
  left: 13px;
  z-index: 100;
}

#isologo:hover{
  opacity: 1;
}
.logo{
  max-width: 290px;
}
.logoHome {
  position: absolute;
  top: -5px;
  left: 30px;
}
/*----Footer----*/
footer{
  background-color:#343a40;
  padding: 2em 0;
  margin-top: 1em;
}
footer a{
  color:#fff;
  font-size: 11.5px;
}
footer h4{
  color:#fff;
}
footer li{
  list-style: none;
}
footer .social{
  width: 2em;
  height: 2em;
  margin-right: 0.2em;
  font-size: 1.2em;
  display: inline-flex;
  justify-content: center;
  align-items: center;
}
.footer-logo{
  width: 160px;
  margin:auto;
}
.footer-logo p{
  margin-bottom: 0px;
}



/*--Fuentes --*/
.text-arboria{
  font-family: 'Montserrat', sans-serif;
}
/*-- Colores Texto--*/
.text-dark-green{color:#007E71;}
.text-dark-blue{color:#001b49;}
.text-dark-purple{color:#60144b;}
.text-dark-red{color:#bf2d20;}
.text-dark-yellow{color:#d89900;}
.text-dark-gray{color:#737277;}
p.text-dark-gray{color:#212121;}

.text-green{color:#009e8f;}
.text-blue{color:#001e6e;}
.text-purple{color:#7b1c61;}
.text-red{color:#e65940;}
.text-yellow{color:#FEDD69;}
.text-gray{color:#9c9ba0;}

.text-light-green{color:#72bf85;}
.text-light-blue{color:#4b69a3;}
.text-light-purple{color:#90598c;}
.text-light-red{color:#eb826c;}
.text-light-yellow{color:#fedd69;}
.text-light-gray{color:#c3c5ca;}

.text-ultra-light-green{color:#a7d5cc;}
.text-ultra-light-blue{color:#7b91c1;}
.text-ultra-light-purple{color:#b17faa;}
.text-ultra-light-red{color:#fd9e93;}
.text-ultra-light-yellow{color:#ffe997;}
.text-ultra-light-gray{color:#edeef0;}

.text-ultra2-light-green{color:#c0e0d8;}
.text-ultra2-light-blue{color:#9bb3d8;}
.text-ultra2-light-purple{color:#c6a9c4;}
.text-ultra2-light-red{color:#f6c7c2;}
.text-ultra2-light-yellow{color:#fff4c5;}
.text-ultra2-light-gray{color:#f7f8f8;}

/*-- Colores Fondo--*/
.bg-dark-green{background-color:#007E71;}
.bg-dark-blue{background-color:#001b49;}
.bg-dark-purple{background-color:#60144b;}
.bg-dark-red{background-color:#bf2d20;}
.bg-dark-yellow{background-color:#d89900!important;}
.bg-dark-gray{background-color:#737277;}
.bg-dark-orange{background-color: #f46414;}

.bg-green{background-color:#009e8f;}
.bg-green-opacity{background-color:rgba(0, 158, 143,0.2);}
.bg-blue{background-color:#001e6e;}
.bg-purple{background-color:#7b1c61;}
.bg-red{background-color:#e65940;}
.bg-yellow{background-color:#f9c139;}
.bg-gray{background-color:#9c9ba0;}

.bg-light-green{background-color:#72bf85;}
.bg-light-blue{background-color:#4b69a3;}
.bg-light-purple{background-color:#90598c;}
.bg-light-red{background-color:#eb826c;}
.bg-light-yellow{background-color:#fedd69;}
.bg-light-gray{background-color:#c3c5ca;}

.bg-ultra-light-green{background-color:#a7d5cc;}
.bg-ultra-light-blue{background-color:#7b91c1;}
.bg-ultra-light-purple{background-color:#b17faa;}
.bg-ultra-light-red{background-color:#fd9e93;}
.bg-ultra-light-yellow{background-color:#ffe997;}
.bg-ultra-light-gray{background-color:#edeef0;}

.bg-ultra2-light-green{background-color:#c0e0d8;}
.bg-ultra2-light-blue{background-color:#9bb3d8;}
.bg-ultra2-light-purple{background-color:#c6a9c4;}
.bg-ultra2-light-red{background-color:#f6c7c2;}
.bg-ultra2-light-yellow{background-color:#fff4c5;}
.bg-ultra2-light-gray{background-color:#f7f8f8;}

/*--Contenedores--*/
.container-small{
  max-width: 700px;
}
.container-medium{
  max-width: 900px;
}
.container-normal{
  max-width: 1140px;
}
.sequence-container{
  padding: 1rem 1rem 0.5rem 1rem;
}
.modal-header .close{
  color: white;
  font-weight: 300;
  font-size: 24px;
  text-shadow: none;
  opacity: 1 !important;
}

.modal-title{
  font-size: 17px;
  font-weight: 600;
}

.modal-body{
  padding: 1.3rem 1.5rem;
}

.modal-body ul{
  padding-left: 10px;
}

.modal-body p, .modal-body li{
  font-size: 15px;
  margin-bottom: 0.3em;
  line-height: 19px;
}

.modal-body li:first-letter {
  text-transform: uppercase;
}

/* .modal-body li::before{
  content: "\2022";
  font-size: 5px;
} */

/*-- Radius --*/
.border-radius{border-radius:0.7em;}
.modal-content{
  border-radius: 0.7rem;
}
.rounded-10{border-radius: 0.7em;}
.brb-1{border-radius: 0 0 0.7em 0.7em;}

/*-- Borders --*/
.border-3{border: 3px solid;}

/*-- Margenes --*/
.mt-2{ margin-top:2em;}
.mt-4{ margin-top:4em;}

/*-- Formularios --*/
.form-control, select, .select{
  border:none;
  border-bottom: 1px solid #333a40;
  border-radius:0;
  font-size: 0.9rem;
  font-weight: 300;
}
.alert-success {
  color: #2b2b2b;
  background-color: #fff4c5;;
  border-color: #fff4c5;;
}
.z-index-10{
  position: relative;
  z-index: 10;
}

label{
  font-size: 0.8em;
}
.btn{
  cursor:pointer;
  font-weight: 500;
  border-radius: 0.5em;
  text-transform: uppercase;
}
.btn-primary{
  background-color:#333a40;
  border-color:#333a40;
}
.btn-yellow{
  background-color: #FEDD69;
  color:#333a40;
}
.btn-violet{
  background-color: #90598C;
  color:#fff;
}
.btn-violet:hover{
  color:#fff;
}
.btn-outline-green{
  border:3px solid #009e8f;
}

.btn-primary:hover, .dropdown-item.active, .dropdown-item:active,.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show>.btn-primary.dropdown-toggle {
  background-color: #f5d967;
  color: #343a40;
  border-color: #f5d967;
}
.btn-link,a{
  color: #626263;
}

.btn-toggle > span {
  line-height: 1.2em;
  margin-bottom: 0;
  display: none !important;
}

.btn-toggle > i {
  transform: rotate(180deg);
  transition: transform 0.1s linear;
}

.btn-toggle.collapsed > i {
  transform: rotate(0deg);
  transition: transform 0.1s linear;
}

.btn-toggle.collapsed > span {
  display: inline-block !important;
}
.btn-view-more{
  font-size: 1.2em;
  position: relative;
  top: -0.2em;
  border: none;
  padding: 0em 0.3em;
  background: rgba(255,255,255,0.1);
  height: 30px;
  width: 30px;
}
.btn-primary:not(:disabled):not(.disabled).active:focus, .btn-primary:not(:disabled):not(.disabled):active:focus, .show>.btn-primary.dropdown-toggle:focus {
box-shadow: 0 0 0 0.2rem var(--gray);
}
.btn-primary.focus, .btn-primary:focus {
box-shadow: 0 0 0 0.2rem var(--gray);
}

.toast-success{
  background-color: #343a40!important;
}
.c-pointer{
  cursor:pointer;
}
.select2-container {
  width: 100% !important;
  font-size: 0.8em;
}

.select2-container .select2-selection--single {
  height: 37px;
  padding: 3px 0;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
  top: 5px;
}

.country-container .error,
.province-container .error, 
.city-container .error {
  position: absolute;
  bottom: -27px;
}

.error {
  color: #d80b0b;
}

/*Sequence and classroom*/
.h-220{
  min-height: 220px;
}
.sequence-container .author * {
  font-size: 1.3em;
  font-weight: 600;
  color: #46669c;
  margin-top: 1em;
}

.related-teachingSequences-container .sequence-container {
  background-color: #fff;
  border-radius: 0.7em;
  -webkit-box-shadow: 4px 4px 5px 1px rgba(0,0,0,0.5);
  -moz-box-shadow: 4px 4px 5px 1px rgba(0,0,0,0.5);
  box-shadow: 4px 4px 5px 1px rgba(0,0,0,0.5);
}

.related-teachingSequences-container .sequence-container .icons-container {
  position: absolute;
  top: 5px;
  right: 25px;
}

.related-teachingSequences-container .sequence-container .icons-container img{
  border: 5px solid #fff;
  border-radius: 100%;
  margin: 0 -4px;
  width: 55px;
  display: inline;
}
/*--Card --*/
.card-title{
  font-size: 1.23rem;
  line-height: 1.3rem;
  margin-bottom: 0.3rem!important;
}
.card-author{
  height: 2.6em;
  width: 100%;
  overflow-y: hidden;
  font-size: 0.85rem;
  font-weight: 600;
}
.card-author a, .card-author{
  color:#4b69a3;;
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 600;
  font-size: 12px;
  line-height: 15px;
}
.card-text{
  height: 167px;
  overflow-y: hidden;
  font-style: normal;
  font-weight: 400;
  font-size: 12px;
  line-height: 16px;
}
.card-top{
  height: 2.5em;
  width: 13rem;
}
.card-production{
  position: relative;
  height: 540px;
  min-width: 210px;
}
.card-production .btn{
  font-size: 0.9em;
}
.card-image {
  height: 230px;
  overflow: hidden;
  background-size: contain;
  display: flex;
  align-items: flex-end;
  background-size: cover;
  background-position: center;
  aspect-ratio: 8/9;
  width: 100%;
}

.card-author-pd a {
  font-weight: 600;
  font-size: 18px;
  line-height: 24px;
  color: #7B1C61;
}

.card-text-pd {
  font-weight: 400;
  font-size: 18px;
  line-height: 30px;
  color: #5C5C5C;
}

.texttag-pd {
  font-weight: 500 !important;
  font-size: 18px !important;
}

.topictag-pd {
  height: 24px !important;
}

/*Resources*/
.resources-container p {
  margin-bottom: 0px;
  font-size: 0.85rem;
}
.activity-slogan ul{
  padding: 0em 0em 0em 0.5em;
}
.icons-levels img {
  border-radius: 100%;
  -webkit-box-shadow: 4px 4px 5px 1px rgba(0,0,0,0.5);
  -moz-box-shadow: 4px 4px 5px 1px rgba(0,0,0,0.5);
  box-shadow: 4px 4px 5px 1px rgba(0,0,0,0.5);
}
/*Author*/
.author-thumb-200{
  max-width: 200px;
}
.author-thumb-300{
  max-width: 300px;
}
.slider-sponsors img{
  max-height: 200px;
  width: auto;
}

/*custom toast*/
.toast-success {
  background-color: #009e8f;
}
.toast-error {
  background-color: #ed5565;
}
.list-group-item.active {
  color:#f9c139!important;
  background-color: #343a40;
  border-color: #343a40;
}
a.list-group-item:hover {
  color: #737277!important;
}
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
  color: #343a40!important;
  background-color: #f9c139;
  border-color: #343140;
  border:0;
  border-bottom:1px solid;
}
.nav-tabs .nav-item a.nav-link{
  color:#343a40!important;
}
.row.pagination-center nav {
  margin: auto;
}
.row.pagination-center .page-link {
  color: #343140;
}
.row.pagination-center .page-item.active .page-link {
  color: #343140;
  background-color: #f9c139;
  border-color: #f9c139;
}
button.btn.bg-dark-orange.btn-secondary.border.border-left-0{
  height: 37px;
}
.tooltip-new {
  position: relative;
  display: inline-block;
}
.tooltip-new .tooltiptext {
  visibility: hidden;
  width: 120px;
  background-color: black;
  color: #fff;
  text-align: center;
  padding: 5px 0;
  border-radius: 6px;
  position: absolute;
  z-index: 1;
  top: 100%;
  left: 50%;
  margin-left: -60px;
}
/*.tooltip-new .tooltiptext::after {
  content: " ";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: black transparent transparent transparent;
}*/

.tooltip-new:hover .tooltiptext {
  visibility: visible;
}

.topictag {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 0px 9px;
  gap: 10px;

  width: fit-content;
  height: 18px;

  border-radius: 10px;

  flex: none;
  order: 0;
  flex-grow: 0;
}

.texttag {
  height: 24px;
  font-style: normal;
  font-weight: 700;
  font-size: 12px;
  line-height: 24px;

  display: flex;
  align-items: center;
  text-align: center;

  color: #FFFFFF;

  flex: none;
  order: 0;
  flex-grow: 0;
}

.topictitle {

  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 0px 9px;
  gap: 10px;

  width: fit-content;
  height: 18px;

  background: #43454B;
  border-radius: 10px;

  flex: none;
  order: 1;
  flex-grow: 0;
}

.productionslink a{
  width: 75px;
  height: 24px;

  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;

  text-align: center;
  letter-spacing: 1px;

  color: #DB9900;

  flex: none;
  order: 0;
  flex-grow: 0;
}

.rectangleimage {
  background: #4d434387;
  padding: 3px;
  padding-top: 5px;
  width: 100%;
}

.rectangleimage-text {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 500;
  font-size: 22px;
  line-height: 24px;
  display: flex;
  align-items: center;
  color: #FFFFFF;
  width: 75%;
}

.countclasses {
  position: absolute;
  right: 3%;
  bottom: 3px;

  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 600;
  font-size: 10px;
  line-height: 24px;

  display: flex;
  align-items: center;
  width: max-content;

  color: #FFFFFF;
}

.imgCircle{
  width: 40px;
  border-radius: 50%;
  margin-left: 26px;
  outline-width: 0px;
  outline-style: solid;
  outline-color: #FEDD69;
}

.imgCircle.notifySurvey{
  outline-color: #007E71;
}

.show-notification {
  outline-width: 8px;
  animation: pulse 1s ease-in-out 5;
}

@keyframes pulse {
  0% {
    outline-width: 0px;
  }
  50% {
    outline-width: 8px;
  }
  100% {
    outline-width: 0px;
  }
}

.save-navbar{
  color: white;
  font-size: 14px;
}

@media screen and (max-width:991px){
  .navbar ul{
    margin-left: 0;
    margin-top: 0.5rem;
  }

  .navbarPd {
    padding-left: 45px;
  }
  .navLine{
    border-color: white;
    margin: 9px 0 -23px -15px;
    width: 84%;
  }
  .navbar-right{
    flex-direction: row;
    justify-content: flex-start;
    margin-top: 39px !important;
  }
  /* .navbar-nav.main-menu{
    width: 100%!important;
    border-bottom:1px solid #737277;
  } */

  #btn-login{
    background-color: #FEDD69;
    color: #43454B !important;
    
  }

  #btn-register{
    border-color: #FEDD69;
    background-color: #343a40 !important;
    color: white;
  }

  .main-menu.navbar-nav li:first-child.nav-item {
    margin-top: 0.6em;
  }
  .navbar {
		background-color: #343a40;
	}
	.nav-item a.nav-link{
		color: white !important;
	}
  .nav-item.active a.nav-link, .nav-item a.nav-link:hover{
    color:#f9c139!important;
  }

  .imgCircle{
    margin-left: 0;
    margin-right: 20px;
  }

}
@media screen and (max-width:759px){
  /*Celular*/
  .about-container{
    max-width: 97%;
    text-align-last: center;
  }
  .home-logo-figure{
    width: 70%;
    margin: auto;
  }
  .nav-item, .navbar .title {
    font-size: 0.8em;
  }
  .author-thumb{
    max-width: 100px;
  }
  .resources-container ul{
    padding: 0;
  }
  .breadcumb.container.margin-title {
    margin-top: 1.5em;
  }
  .timeline li.activity-item:before{
    left: -22px!important;
    width: 60px!important;
    height: 60px!important;
    padding: 10px 24px!important;
    font-size: 1.8em!important;
  }
  .sequence-container .timeline:before {
    left: 15px!important;
  }
  .sequence-container .timeline > li a:before{
    left: -18px!important;
  }
  .sequence-container .timeline > li:not(:last-child) {
    margin-left: 25px!important;
  }
  .sequence-container .timeline > li:last-child:before {
    left: -3px!important;
  }
  /* .sequence-container {
    padding: 0.9rem!important;
  } */
  .sequence-image{
    /* max-width: 70%!important; */
    margin: auto;
  }
}
@media screen and (min-width:760px) and (max-width:991px){
  .footer-follow{
    padding-inline-start: 55px;
  }

  .author-thumb{
    max-width: 100px;
  }
}
@media screen and (min-width:992px){
  main .container {
    margin-top: 8rem;
  }
  
  .isologo {
		display: block;
    position: absolute;
    width: 164px;
    top: 12px;
    left: 53px;
    z-index: 100;
	}

  .searcher-row {
    margin-top: 8rem;
  }

  .margin-title{
    padding-left: 115px;
  }
  .navbar-collapse{
    display: flex;
    justify-content: flex-end;
    width: 100%;
  }
  ul.main-menu{
    display: flex;
    justify-content:end;
    width: 100%;
    margin-left: 110px;
  }

  .main-menu li {
    margin-left: 1rem;
  }

  .navbar-right{
    width: 430px;
    display: flex;
    justify-content: center;
    margin-right: 5px;
  }
  .nav-item-lg{
    width: 170px;
    text-align: center;
  }
  .nav-item-xlg{
    width: 200px;
    text-align: center;
  }
  .author-thumb{
    max-width: 150px;
  }

  .navbar-after-video {
    background-color: #43454B;
    height: 80px;
  }

  .navbar-after-video div div ul li a {
    color: white;
  }

  li.active a {
    color:#FEDD69 !important;
  }

  .navbar-after-video #btn-login {
    background-color: #FEDD69;
    color: #43454B;
  }

  .navbar #btn-login:hover {
    background-color: #90598C;
  }

  .navbar-after-video #btn-login:hover {
    background-color: #FFE997;
  }

  .navbar-after-video #btn-register {
    border-color: #FEDD69;
  }

  .navbar #btn-register:hover {
    background-color: #7B1C61 !important;
    color: #FFFFFF;
  }

  .navbar-after-video #btn-register:hover {
    background-color: #FFFFFF !important;
    color: #43454B;
  }

  .dropdown-after-video {
    background-color: #43454B;
  }
}

@media screen and (min-width:992px) and (max-width:1080px){
  ul.main-menu{
    font-size: 0.9em;
  }
} 

@media screen and (min-width:1260px){
  .col-custom-lg{
    flex: 0 0 20%;
  }
  .nav-item-xlg{
    width: 220px;
  }

  .container-max{
    max-width: 71em;
    margin:auto;
  }
}

@media screen and (min-width:1240px) and (max-width:1350px){
  ul.main-menu{
    margin-left: 120px!important;
  }
}
@media screen and (min-width:80em){
  .container-menu {
    max-width: 90%;
    margin: auto;
  }
  ul.main-menu{
    justify-content: end;
    margin-left: 0;
  }
  ul.main-menu li{
    width: auto;
  }
}
@media screen and (min-width:90em){
  .container-max{
    max-width: 71em;
    margin:auto;
  }
  
}

@media (min-width: 992px) {
  .adminLayout {
    display: none;
  }
  
}

.ulAdmin{
  list-style: none;
}

.ulAdmin li{
  font-size: 12px;
  font-weight: 600;
  font-family: 'Montserrat';
  text-transform: none;
}

.input-group {
  position: relative;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-align: stretch;
  justify-content: space-between;
}

/* #autocomplete{
  position: absolute !important;
} */

#autocomplete_listbox{
  top: 100%;
  left: 0px;
  display: block;
  width: 100%;
  position: absolute;
  z-index: 100;
}

#productions{
  display: flex;
  flex-direction: column;
}

ul.pagination{
  margin-top: revert;
}

.filter-production {
display: flex;
    align-items: center;
}

.filter-production .filter-title{
  margin-top: 0;
}

#search_listbox {
  width: 100%;
}

.tt-hint, .tt-input {
  border-radius: 0 4rem 4rem 0;
}
.slick-prev:before, .slick-next:before {
  color: #7B1C61;
}

.searchPd{
  padding-right: 45px;
  padding-left: 45px;
}

@media screen and (min-width:1600px){
  .col-xxl-2{
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
  }
}
@media screen and (min-width:2000px){
  .col-xxl-2{
    -ms-flex: 0 0 16.6%;
    flex: 0 0 16.6%;
    max-width: 16.6%;
  }
}
@media screen and (min-width:2500px){
  .col-xxl-2{
    -ms-flex: 0 0 14.2%;
    flex: 0 0 14.2%;
    max-width: 14.2%;
  }
}

  @media (max-width:768px){
    .card-text {
      height: 180px;
    }

    .card-production{
      height: 555px;
    }

    .footer-logo{
      margin-left: 34px;
      margin-bottom: 19px;
    }

    .footer-follow{
      text-align: left!important;
      margin-left: 34px;
    }
}

.card-image img{
  position: relative;
  height: 100%;
  /* top: -20%; */
}

/*tags colors */
.bio, .ser {
  background-color: #007E71;
}

.qui, .mat {
  background-color: #E65940;
}

.ast, .tie {
  background-color: #001E6E;
}

.fis, .mun {
  background-color: #7B1C61;
}

.multi {
  background-color: #DB9900;
}