@import url('https://fonts.googleapis.com/css2?family=Sanchez&display=swap');

html 			{	width:100%;height:100%;font-family: 'Sanchez', serif;margin:0;padding:0;overflow-x: hidden;	}
body 			{	height:100%;width:100%;background:#e6e3d7;display:inline-block;text-align:center;margin:0;padding:0;	}
h1, h2, h3, h4, p {	color:#333;	}
h4 				{	font-size:24px;font-family:'Sanchez', serif;letter-spacing: 1px;	}
h5 				{	margin-top:-5px;color:#888;font-size:14px;font-style:italic;border-top:1px solid #dadada;padding-top:5px;  }

h1 { color:#fff;font-size:56px;font-family:'Sanchez', serif;margin-bottom:40px;letter-spacing: 1px; }
h2 { color:#000;font-size:48px;font-family:'Sanchez', serif;margin-bottom:40px;text-align: center;letter-spacing: 1px; }
h3 { font-size:36px; }
p { color:#000;font-family: 'Nunito', sans-serif;font-size:19px; }

/* bloque 1 */
.container1 { min-height:100%;width:100%;background:#000;display:inline-block;text-align:left;margin:0;padding:0;margin-bottom:-10px;overflow: hidden;padding-bottom: 60px; }
.container1 .contenedor { width:90%;margin-left:5%; }
.container1 .contenedor .izq { width:50%;float:left;padding-left:0px;	}

.head { margin:0;padding:0 5%;width:100%;position: fixed;left:0;background:#000;z-index: 2; }
.head a.logo { padding:0;margin-top:10px;display: inline-block; }
.head a.logo:hover { background:transparent; }
.head a.logo img { width:140px; }

.head ul.menu-principal { width:300px;float:right; }
.head ul.menu-principal li { list-style: none;float:left;margin:0; }
.head ul.menu-principal li a { padding:21px 10px;display: block;color:#efd35e;border:1px solid #efd35e;padding:8px 12px;border-radius:15px;margin-top:10px;margin-left:10px; }
.head ul.menu-principal li a:hover, .head ul.menu-principal li a:active { color:#000; }
.container1 .contenedor .izq p { color:#fff; }
.container1 a 		{	transition:all ease .5s;-webkit-transition:all ease .5s;-moz-transition:all ease .5s;cursor:pointer !important; ;color:#efd35e;	}
.container1 a:hover {	color:#000;background:#efd35e;text-decoration: none;	}
.container1 a:active {	color:#000;background:#efd35e;text-decoration: none;	}

.container1 .contenedor .izq .intro { margin-top:120px; }
.container1 .contenedor .izq .menu {	width:100%;display: inline-block; }
.container1 .contenedor .izq .menu ul { width:600px;margin:0 auto !important;padding:0;display: inline-block; }
.container1 .contenedor .izq .menu ul li { list-style: none;margin:0;padding:0;float:left;margin-right:10px;margin-top:10px; }
.container1 .contenedor .izq .menu ul li a { width:auto;background:#efd35e;color:#000;font-size:24px;padding:12px 24px 14px 24px;display: inline-block;border-radius:30px; }
.container1 .contenedor .izq .menu ul li a:hover { text-decoration: none; background:#ffb900; }

.container1 .contenedor .der { width:32%;float:right;height:100%;display:inline-block;overflow: hidden; }
.container1 .contenedor .der img { height:85%;position: absolute;bottom: 2%;right:7%;z-index: 1; }
.container1 .contenedor .der .bola { background-color: #efd35e;width:1200px;height:1200px;border-radius:600px;position: absolute;left:55%;bottom:100px;z-index: 1; }

/* bloque 2 */
.container2 h1 { text-align: center;color:#000;border-bottom:3px solid #efd35e;padding-bottom:15px;width:540px;margin:0 auto 70px auto; }
.container2 { min-height:100%;width:100%;background:#fff;display:inline-block;text-align:left;margin:0;padding:60px 0 40px 0;margin-bottom:-10px; }
.container2 .contenedor { width:90%;margin:0 5%; }
.container2 .contenedor .item { margin-top:20px;width:33.3%;float:left;padding:0 40px;position: relative;text-align: center; }
.container2 .contenedor .item img { width:80%;margin-bottom:30px; }
.container2 .contenedor .item h4 small { background-color: #efd35e;padding:2px 10px;border-radius: 10px;font-size:70%;line-height: 3; }

/* Footer */
a 		{	transition:all ease .5s;-webkit-transition:all ease .5s;-moz-transition:all ease .5s;cursor:pointer !important; ;color:#efd35e;	}
a:hover {	color:#efd35e;text-decoration: underline;	}
a:active {	color:#efd35e;text-decoration: underline;	}

.redes      		{   margin:0;padding:0;width:190px;clear:both;margin-top:10px;margin-bottom:10px;padding-bottom:10px;height:36px;   }
.redes li   		{   list-style:none;float:left;margin-right:14px;    }
.redes li a 		{   font-size:28px;color:#fff;transition:all 0.4s ease;   }
.redes li a:hover 	{	text-decoration: none;color:#efd35e;	}

.footer 		{	color:#fff;background:#000;text-align: center;padding:40px 0;width:100%;clear:both;margin:0;display: inline-block;	}
.footer h2 		{	margin:0;color:#fff;text-align: left;font-size: 32px;margin-bottom: 10px;	}
.footer p 		{	color:#fafafa;  }
.footer .izq 	{	width:44%;float:left;margin-left:5%;text-align: left;	}
.footer .der 	{	width:44%;float:right;margin-right:5%;text-align: right;	}
.footer .der img { width:400px;float:right;	}

/* login + registro */
.logo-detalle { width:220px; }
.container-fluid { background-color: #000 !important; }
.container-fluid h1 { font-size: 32px;text-align: left !important;width: 100%; }
.form-group { margin-bottom:15px; }
input { border-radius: 20px !important;padding-left:20px !important;border:none !important;font-size:18px; }
label { color:#fff;text-align: left;width: 100%;margin-bottom:3px;font-size: 18px; }
.text-muted { color: rgba(255,255,255,0.7) !important;font-size:16px; }
a.btn-primary, button.btn-primary { border-color: #efd35e;border-radius:24px;color:#efd35e;background-color: transparent;width:auto; }
a:hover.btn-primary, button:hover.btn-primary, a:active.btn-primary, button:active.btn-primary { border-color: #efd35e;background-color: #efd35e !important;color:#000 !important; }
.text-center { text-align: left !important; }
.bg-auth, .bg-auth {display: none; }
.border-primary { border-color: #efd35e !important;border-top-width:6px !important; }
.vh-100 { margin-top: 0 !important }
.navbar-light .navbar-toggler { color:#fff; }

/* dashboard */
.navbar-vertical { background-color: #000 !important; }
.navbar-vertical hr { display: none; }
.navbar-vertical p { color:#fafafa; }
.navbar-vertical.navbar-expand-md .navbar-brand { text-align: left !important;margin-left:0px; }
.navbar-brand-img { width:80%;text-align:left;max-height:180px !important; }
.navbar-light .navbar-user { border-top-color:transparent; }
.navbar-vertical.navbar-expand-md .navbar-nav { margin-top:30px; }
.navbar-vertical.navbar-expand-md .navbar-nav .nav-link { color:#fafafa;padding-left:15px; }
.navbar-vertical.navbar-expand-md .navbar-nav .nav-link.active:before { border-left:5px solid #efd35e;top:0;bottom:0; }
.icon>.fe { color:#fafafa; }
.main-content .container-fluid { background-color: transparent !important; }
.main-content .container-fluid h1 { color:#000;padding-bottom:10px; }
.main-content .container-fluid .header-body { border-bottom:none;padding:15px 0; }
.main-content label { color:#777; }
.main-content input { border:1px solid #dadada !important; }
.header { margin-bottom:0px; }
.header-pretitle { color: #777;text-align: left;font-size: 14px;padding:0;margin:0;margin-bottom:5px; }
.btn-outline-info { border-color: #000;border-radius:24px;color:#000;background-color: transparent;width:auto; }
a:hover.btn-outline-info, button:hover.btn-outline-info, a:active.btn-outline-info, button:active.btn-outline-info { border-color:#000;background-color: #000 !important;color:#efd35e !important; }
.mt-2, .my-2 { overflow: hidden;margin-top:0 !important;border: 3px solid #000;border-radius: 20px; }
.mapboxgl-canvas { margin:0; }

/* caja contenido */
.col-12.col-lg-10.col-xl-8 { flex: 0 0 97%;max-width: 97%;background:#fff;padding:20px 30px;border-radius:20px;text-align: left; }
.col-12.col-lg-10.col-xl-8 .justify-content-between { height:auto;background:#e6d7d7;padding:14px 12px;border-radius:10px; }
.col-12.col-lg-10.col-xl-8 .justify-content-between .text-muted { color:#000 !important; }
.col-12.col-lg-10.col-xl-8 .justify-content-between .col-md-6 { flex: 0 0 75%;max-width: 75%;margin-bottom: 0 !important; }
.btn-danger { border-radius:22px; }
.header-tabs { margin-bottom:-16px;margin-top:20px;margin-left:15px; }
.header-tabs .nav-link { padding:10px; }
.badge-pill, .badge-secondary { color:#000;background-color:#efd35e; }
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active { border-color: transparent;background-color:#fff;font-size:16px; }
.nav-tabs .nav-link:not(.active) { color:#333;font-size:16px; }
.card { border:none; }
.card-header { background-color:#fff !important;text-align: left;border-bottom:0;padding-top:25px;padding-bottom:25px;height:74px; }
.card-body { padding-top:0;padding-bottom:0; }

.col-4 .card-body { padding-top:20px; }
.col-3 h3.card-title { text-align: center;font-family:'Sanchez', serif; }
.col-3 h4.card-title { text-align: center;font-family:'Sanchez', serif;border-bottom:2px solid #efd35e;padding-bottom:15px;margin-bottom: 15px; }
.col-3 p.txt-dash { text-align: center; }
.tab-content .col-lg-6.offset-lg-3.col-12 { flex: 0 0 100%;max-width: 100%;margin-left:0;padding:0; }
.tab-content .col-lg-6.offset-lg-3.col-12 .card-body label { display: none; }
.tab-content .col-lg-6.offset-lg-3.col-12 .card-body .text-muted { color:#777 !important;text-align: left; }
.card-footer-boxed { text-align: center; }
.card-footer-boxed a { display: inline-block;margin-top:10px; }
.card-footer-boxed button { display: inline-block;margin-top:10px;margin-right:0 !important; }
.card-footer-boxed .col-auto { margin:0 auto;display: inline-block;width:170px; }

.btn-info, .btn-success { background-color:#4ddbd1;border-color:#4ddbd1;color:#000;border-radius:22px;padding-left:16px;padding-right:16px;font-size:16px; }

.btn-info, .btn-success { background-color:#4ddbd1 !important;border-color:#4ddbd1 !important;color:#000 !important;border-radius:22px;padding-left:16px;padding-right:16px;font-size:16px; }

.header-body a.btn-primary, .header-body button.btn-primary { background:#efd35e;color:#000;font-size:16px; }
.header-body a:hover.btn-primary, .header-body button:hover.btn-primary, .header-body a:active.btn-primary, .header-body button:active.btn-primary { background:#000 !important;color:#efd35e !important;border-color:#000; }
.btn-info { font-size:16px; }
a:hover.btn-info, button:hover.btn-info, a:active.btn-info, button:active.btn-info,
a:hover.btn-success, button:hover.btn-success, a:active.btn-success, button:active.btn-success { background-color:#000 !important;border-color:#000 !important;color:#4ddbd1 !important; }

.card-table { width:100%; }
.avatar-dash { width:120px;margin:15px auto 20px auto; }
.avatar-img { border:3px solid #efd35e;overflow: hidden;border-radius:50%; }
.table tbody td, .table tbody th, .table thead th { font-size: 16px; }
.table-sm thead th { font-size:15px; }

@media screen and (max-width: 920px) {
	.container1 .contenedor .der img { height:auto;width:50%;top:120px;right:0%; }
	.container2 .contenedor .item { width:100%; }
	.container2 .contenedor .item .cont-img { width:50%;float:left; }
	.container2 .contenedor .item h4 { width:50%;float: right;text-align: left;padding-top: 40px; }
	.redes { width:210px;padding-left:20px;margin:10px auto; }
	.footer .izq, .footer .der { width:90%;text-align: center; }
	.footer h2 { text-align: center; }
	.footer .der img { float:none; }
}

@media screen and (max-width: 700px) {
	.container1 .contenedor .izq .menu ul { width:auto; }
	.container1 .contenedor .izq { width:100%; }
	.container1 .contenedor .der { display: none; }
	.container2 h1 { width: 100%; }
	.container2 .contenedor .item { padding: 0; }
	.container2 .contenedor .item h4 { padding-top: 20px; }
	.footer .der img { width:360px; }
}

@media screen and (max-width: 540px) {
	.container2 .contenedor .item .cont-img { width:100%; }
	.container2 .contenedor .item .cont-img img { width:300px;margin-bottom: 0; }
	.container2 .contenedor .item h4 { width:100%;text-align: center;padding-top:10px;margin-bottom:40px; }
}

@media screen and (max-width: 440px) {
	h1 { font-size:52px; }
	h2 { font-size: 44px; }
	h3 { font-size: 30px; }
	.head { text-align: center;display: inline-block;padding-bottom:10px; }
	.head ul.menu-principal { float:none;padding-left:0;margin:0 auto;width:210px; }
	.container1 .contenedor .izq { padding-top:30px; }
	.container2 .contenedor .item .cont-img img { width:280px; }
	.footer .der img { width:300px; }
}