/*---------------------- Collapsing Animations ----------------------*/
.sidebar-collapse {
    animation-name: collapse;
    animation-duration: .32s;
    animation-fill-mode: forwards;
    animation-timing-function: ease-in-out;
}

.sidebar-collapse-reverse {
    animation-name: collapse-reverse;
    animation-duration: .32s;
    animation-fill-mode: forwards;
    animation-timing-function: ease-in-out;
}


@keyframes collapse {
    from {
        transform: translate(0%);
    }
    to {
        transform: translate(-100%);
    }
}

@keyframes collapse-reverse {
    from {
        transform: translate(-100%);
    }
    to {
        transform: translate(0%);
    }
}
/*---------------------- Collapsing Animations ----------------------*/

/*---------------------- Arrow Animations ----------------------*/
.arrow-flip {
    animation-name: arrow;
    animation-duration: .25s;
    animation-fill-mode: forwards;
}

.arrow-flip-reverse {
    animation-name: arrow-reverse;
    animation-duration: .25s;
    animation-fill-mode: forwards;
}

@keyframes arrow {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(180deg);
    }
}

@keyframes arrow-reverse {
    from {
        transform: rotate(180deg);
    }
    to {
        transform: rotate(360deg);
    }
}
/*---------------------- Arrow Animations ----------------------*/




/*Animations*/
@import "animations.css";


/*BG TecNM Color: #1b396a*/

/*---------------------- Basic Configuration ----------------------*/
#sidebar {
    height: 100%;

    position: relative;
    text-align: left;
    padding: 0;

	box-shadow: 25px 0px 26px -3px rgba(0, 0, 0, 0.39);
}

#sidebar span, #sidebar a {
    padding: 0px 20px 0px 20px;
    color: rgb(255, 255, 255);
}

.sidebar-separator {
    font-size: small;
    background-color: rgb(4, 17, 82) !important;
}


#collapser {
    position: relative;
    z-index: 1000;
}

#collapser a {
    position: absolute;
    padding: 5px 0 5px 0;
    top: 50px;
    right: -35px;

    background: #0c1a30;
    border-radius: 0px 10px 10px 0px;;
}

.submenu a {
    padding-left: 40px !important;
}

.item-style {
    width: 100%;
    min-height: 50px;
    max-height: fit-content;

    background-color: #1b396a;
}

.item-style a, .item-style span{
    word-break: break-all;

    width: 100%;
    min-height: 50px;
    max-height: fit-content;

    display: flex;
    align-items: center;
}

.item-style img {
    margin-right: 10px;
}

.item-style a:hover {
    background-color: #244d8f;
}

.submenu-button {
    margin-left: auto;
}
/*---------------------- Basic Configuration ----------------------*/




@charset "UTF-8";

.bg-tecnm {
	background-color: #1b396a !important;
	color: #fff !important;
}

.text-tecnm {
	color: #1B396A !important;
}

/* Redes Sociales Lateral */
.sticky-container {
	padding: 0px;
	margin: px;
	position: fixed;
	right: -135px;
	bottom: -20px;
	width: 210px;
	z-index: 1100;
}

/*.sticky-container:hover{ right:-135px;}*/
.sticky li {
	list-style-type: none;
	background-color: transparent;
	color: #efefef;
	height: 43px;
	padding: 0px;
	margin: 0px 0px 1px 0px;
	-webkit-transition: all 0.25s ease-in-out;
	-moz-transition: all 0.25s ease-in-out;
	-o-transition: all 0.25s ease-in-out;
	transition: all 0.25s ease-in-out;
	cursor: pointer;
}

.sticky li:hover {
	background-color: #fff;
}

.sticky li:hover {
	margin-left: -115px;
}

.sticky li img {
	float: left;
	margin: 5px 4px;
	margin-right: 5px;
}

.sticky li p {
	padding-top: 5px;
	margin: 0px;
	line-height: 16px;
	font-size: 11px;
}

.sticky li p a {
	text-decoration: none;
	color: #000;
}

.sticky li p a:hover {
	text-decoration: underline;
}

/* Menú Azul */
#main_navbar .dropdown-menu {
	background-color: #1B396A;
}

#main_navbar .dropdown-menu li:before {
	background-color: #1B396A;
}

#main_navbar .dropdown-menu li:after {
	background-color: #1B396A;
}

#main_navbar .dropdown-menu a {
	color: #fff;
}

#barraGobmx {
	z-index: 10012;
}

#main_navbar {
	z-index: 10004;
}

#main_navbar2 {
	z-index: 10008;
}



.align-right {
	display: flex;
	justify-content: flex-end;
}

.align-center {
	display: flex;
	justify-content: center;
}

#desface-noticias {
	margin-top: 20px;
}

.neomorphic-defase {
	color: white;
	border-radius: 10px;
	background: #2f476f;
	box-shadow: 20px 20px 60px #172336,
		-20px -20px 60px #476ba8;
}

.neomorphic-defase-2 {
	color: white;
	background: #2f476f;
	box-shadow: 20px 20px 60px #172336,
		-20px -20px 60px #476ba8;
}

.shadow-xs {
	-webkit-box-shadow: 0px 10px 49px 0px rgba(0, 0, 0, 0.60);
	-moz-box-shadow: 0px 10px 49px 0px rgba(0, 0, 0, 0.60);
	box-shadow: 0px 10px 49px 0px rgba(0, 0, 0, 0.60);
}

.yogurt-defase {
	color: rgb(104, 104, 104);
	border-radius: 20px;
	background: #ffffff;
	box-shadow: 20px 20px 60px #172336,
		-20px -20px 60px #06060633;
}

.stupid-defase {
	color: #303030;
	background-color: #d4d4d4;
	border-radius: 15px;
	/*Stupid Simple Shadow, Simple Black*/
	-webkit-box-shadow: 10px 10px 12px -6px rgba(0, 0, 0, 0.75);
	-moz-box-shadow: 10px 10px 12px -6px rgba(0, 0, 0, 0.75);
	box-shadow: 10px 10px 12px -6px rgba(0, 0, 0, 0.75);
}

.bordered-con {
	background-color: white;
	border-radius: 18px 18px 18px 18px;
	-moz-border-radius: 18px 18px 18px 18px;
	-webkit-border-radius: 18px 18px 18px 18px;
	border: 0px solid #000000;
}

.hide-scroll::-webkit-scrollbar {
	display: none;
}

/* For Webkit browsers (Chrome, Safari, etc.) */
::-webkit-scrollbar {
	width: 18px;
	/* Width of the scrollbar */
}

::-webkit-scrollbar-track {
	background: transparent;
	/* Make scrollbar track transparent */
}

::-webkit-scrollbar-thumb {
	background-color: white;
	/* Color of the scrollbar thumb */
	border-radius: 10px;
	/* Round the corners of the scrollbar thumb */
	border: 3px solid transparent;
	/* Adds some space around the thumb */
	background-clip: content-box;
	/* Clips the thumb to the content box */
}

/* For Firefox */
body {
	scrollbar-width: thin;
	/* Makes the scrollbar thinner */
	scrollbar-color: white transparent;
	/* Scrollbar thumb color white, track color transparent */
}


/* Hide scrollbar for IE, Edge and Firefox */
.hide-scroll {
	-ms-overflow-style: none;
	/* IE and Edge */
	scrollbar-width: none;
	/* Firefox */
}

@media (min-width: 768px) {
	html {
		font-size: 16px;
	}
}


/* Estilo del carrucel */
.sitios {
  width: 75%;
  margin: 0px auto;
}

.principal {
  width: 100%;
  /*height: 60vh;*/
  margin: 0px 0px;
  margin-bottom: 0px;
}

.slick-slide {
  margin: 0px 0px;
}

.anexo .slick-slide {
  margin-left: 5px;
  margin-right: 5px;
}

.anexo>.slick-prev:before {
  /* Flecha azul - lado izquierdo */
  background: url('/img/flechas/izquierda_gris.png');
  background-size: contain;
  color: transparent;
}

.anexo>.slick-next:before {
  /* Flecha azul - lado derecho */
  background: url('/img/flechas/derecha_gris.png');
  background-size: contain;
  color: transparent;
}

#noticias>.slick-prev:before {
  /* Flecha azul - lado izquierdo */
  background: url('/img/flechas/izquierda_azul.png');
  background-size: contain;
  color: transparent;
}

#noticias>.slick-next:before {
  /* Flecha azul - lado derecho */
  background: url('/img/flechas/derecha_azul.png');
  background-size: contain;
  color: transparent;
}

.slick-slide {
  transition: all ease-in-out .3s;
  opacity: 1;
}

.slick-active {
  opacity: 1;
}

.slick-current {
  opacity: 1;
}


.carousel-item {
  width: 100vw;
  height: 60vh;
  min-height: 10%;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  background: round;
}

.card-columns .card {
  display: inline-block;
  width: 100%;
}

.card-img-top {
  width: 100%;
  height: 200px !important;
  border-top-left-radius: calc(0.25rem - 1px);
  border-top-right-radius: calc(0.25rem - 1px);
}

@media (max-width: 400px) {
  .carousel-item {
    height: 30vh;
  }
}

@media (max-width: 500px) {
  .carousel-item {
    height: 25vh;
  }
}

/*Menu Fijo*/
#main_navbar {
  box-shadow: 0px 0px 10px #00000085;
}

#main_navbar,
#main_navbar2 {
  width: 100%;
}

.menuazul,
.menublanco {
  position: fixed;
}

.menublanco {
  top: 41px;
}

.menuazul {
  top: 90px;
}

@media (max-width: 700px) {
  .contenedorGobierno {
    height: 37.13px;
  }

  #pleca_3 {
    display: none;
  }

  .container-cabecera {
    background-color: #1B396A;
  }

  .menublanco {
    top: 34px;
    padding-top: 3px;
    padding-bottom: 1px;
  }

  .menuazul {
    top: 78px;
  }
}