@media (min-width: 992px) {
	.page-content {
		padding: 1rem;
		width: 100%;
		margin-left: 0;
		margin-top: 8rem;
		transition: all 0.4s;
	}

	#managementButtons span {
		font-size: 1rem;
	}
	#managementButtons i {
		font-size: 2.5rem;
	}

	#managementButtons p {
		font-size: 0.8rem;
	}

	#sidebar.active {
		margin-left: -12rem;
	}
	
	.nav-item-text.active {
		font-size: 0px;
	}
	.header-item-text.active {
		font-size: 0px;
	}
	.nav-submenu.active {
		display: none;
	}
}

@media (max-width: 992px) {
	.statistics {
		border-right: none;
	}

	#user-navbar {
		display: none !important;
	}
	.vertical-nav {
		display: none;
	}
	.page-content {
		padding: 1rem;
		width: 100%;
		margin-left: 0;
		margin-top: 8rem;
		transition: all 0.4s;
	}

	.navbar-content {
		display: none !important;
	}

	#sidebar-toggle {
		display: none;
	}
	#sidebar.active {
		margin-left: 0;
	}
	#content {
		width: 100%;
		margin: 0;
	}
	#content.active {
		width: 90%;
		margin: auto;
		
	}

}

@media (min-width: 1301px) {
	#content.active {
		width: 80%;
		margin-left: 15rem;
	}

	#user-navbar {
		font-size: small;
	}

	#homeButtons h5 {
		font-size: 1rem;
	}
}



/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
	#managementButtons span {
		font-size: 0.9rem;
	}
	#managementButtons .col-auto {
		padding-left: 0;
	}

	#magementButtons .row {
		display: flex;
		justify-content: space-around;
	}

	#managementButtons .card-body {
		padding: 1rem 0.3rem 1rem 1rem;
	}

	.navbar-content {
		width: 100%;
		margin-left: 0;
	}

	.logo {
		width: 30%;
	}
	.card-responsive {
		width: 90%;
	}
	#accesos-directos {
		display: none;
	}
	.title-sna {
		font-size: large;
		width: fit-content;
		text-align: center !important;
		padding: 0 !important;
	}
	.title-sna-login {
		font-size: large;
		width: fit-content;
		text-align: center !important;
		padding: 0 !important;
	}

	.icon-sna {
		position: absolute;
		left: 8%;
		top: 50%;
		transform: translateY(-50%);
		font-size: 25pt;
	}
	.btnL {
		text-align: center;
		position: relative;
		vertical-align: middle;
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
		background-color: transparent;
		border: 1px solid transparent;
		padding: 0.375rem 0.75rem;
		font-size: 0.8rem;
		line-height: 1.3;
		border-radius: 1rem;
		transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out,
			border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
	}
	/* .breadcrumb{
        font-size: 3.5vw;
    } */
}

@media only screen and (max-width: 600px) {

	/* Scrollable cards like MR and EE forms tables */
	.scrollable-card {
		overflow-x: auto;
		white-space: nowrap;
	}

	#coursesTable {
		min-width: 700px;
	}

	[id^='mrCard'] .row {
		/* Anula el ancho mínimo establecido por Bootstrap */
		min-width: 500px;
	}

	[id^='activity'] {
		/* Anula el ancho mínimo establecido por Bootstrap */
		min-width: 500px;
	}

	.border-activity-delete {
		min-width: 500px;
	}

	#scrollRightInfo {
		display: block;
	}

	#guion {
		color: #fff;
	}
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
	.container-logo {
		align-items: left !important;
	}
	.logo {
		width: 40%;
	}
	.card-responsive {
		width: 90%;
	}
	.title-sna {
		font-size: x-large;
		text-align: left !important;
	}
	.title-sna-login {
		font-size: x-large;
		text-align: center !important;
	}

	.icon-sna {
		position: absolute;
		left: 8%;
		top: 50%;
		transform: translateY(-50%);
		font-size: 20pt;
	}
	.btnL {
		text-align: center;
		position: relative;
		vertical-align: middle;
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
		background-color: transparent;
		border: 1px solid transparent;
		padding: 0.375rem 0.75rem;
		font-size: 0.8rem;
		line-height: 1.3;
		border-radius: 1rem;
		transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out,
			border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
	}
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
	.logo {
		width: 55%;
	}
	.card-responsive {
		width: 60%;
	}
	.title-sna {
		font-size: 23pt;
		text-align: left !important;
	}
	.title-sna-login {
		font-size: 23pt;
		text-align: center !important;
	}

	.icon-sna {
		position: absolute;
		left: 8%;
		top: 50%;
		transform: translateY(-50%);
		font-size: 20pt;
	}
	.btnL {
		text-align: center;
		position: relative;
		vertical-align: middle;
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
		background-color: transparent;
		border: 1px solid transparent;
		padding: 0.375rem 0.75rem;
		font-size: 0.8rem;
		line-height: 1.3;
		border-radius: 1rem;
		transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out,
			border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
	}
}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
	.logo {
		width: 30%;
	}

	.page-footer h9 {
		font-size: 11px;
	}

	.page-footer h6 {
		font-size: 12px;
	}


	.card-responsive {
		width: 50%;
	}
	.title-sna {
		font-size: 33pt;
		margin-top: 5%;
		text-align: left !important;
	}
	.title-sna-login {
		font-size: 33pt;
		margin-top: 5%;
		text-align: center !important;
	}

	.icon-sna {
		position: absolute;
		left: 8%;
		top: 50%;
		transform: translateY(-50%);
		font-size: 30pt;
	}
	.btnL {
		text-align: center;
		position: relative;
		vertical-align: middle;
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
		background-color: transparent;
		border: 1px solid transparent;
		padding: 0.375rem 0.75rem;
		font-size: 0.8rem;
		line-height: 1.3;
		border-radius: 1rem;
		transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out,
			border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
	}
}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
	.page-footer h9 {
		font-size: 14px;
	}

	.page-footer h6 {
		font-size: 15px;
	}

	.card-responsive {
		width: 30%;
	}
	
	.title-sna {
		font-size: 40pt;
		margin-top: 5%;
		text-align: left !important;
	}
	.title-sna-login {
		font-size: 40pt;
		margin-top: 5%;
		text-align: center !important;
	}


	.icon-sna {
		position: absolute;
		left: 8%;
		top: 45%;
		transform: translateY(-50%);
		font-size: 35pt;
	}
	.btnL {
		text-align: center;
		position: relative;
		vertical-align: middle;
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
		background-color: transparent;
		border: 1px solid transparent;
		padding: 0.375rem 0.75rem;
		font-size: 1rem;
		line-height: 1.3;
		border-radius: 1rem;
		transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out,
			border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
	}
}

/* Quick access buttons  */
/* Style for Extra Large Screen */
@media (max-width: 3920px) {
	.btn-sq-responsive {
		width: 180px !important;
		max-width: 100% !important;
		max-height: 100% !important;
		height: 180px !important;
		font-size: 18px;
	}
}

/* Style for Medium Screen */
@media (max-width: 767px) {
	.btn-sq-responsive {
		width: 100px !important; /* whatever width you want for medium screen */
		max-width: 100% !important;
		max-height: 100% !important;
		height: 100px !important; /* whatever height you want for medium screen */
		font-size: 12px;
	}
}

/* Style for Small Screen */
@media (max-width: 575px) {
	.btn-sq-responsive {
		width: 50px !important; /* whatever width you want for mobile screen */
		max-width: 100% !important;
		max-height: 100% !important;
		height: 50px !important; /* whatever height you want for mobile screen */
		font-size: 5px;
		padding: 0px;
		font-size: 7px;
	}
}
