/* Pentamedios Comunicaciones*/
/* background */
* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
	}
html {
	height: 100%;
	}
body {
	margin: 0;
	background: #ffffff;
	font-size: 1.2rem;
	min-height: 100%;
	min-width: 100%;
	}
video{
	position: fixed;
	min-width: 100%;
	min-height: 100%;
	opacity: 70%;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-50%);
	z-index: -1;
	}
.grid-container > * {
	padding: 0px;
	text-align: center;
	align-content: center;
	}
/* menu */
.header {
	grid-area: header;
	background-color: #001B38;
	box-shadow: -1px 1px 7px 0px rgba(0, 0, 0, 0.75);
	position: relative;
	width: 100%;
	}
	a {
	font-family: 'Racing Sans One', cursive;
	font-size: 1.2rem;
	color: #FFFFFF;
	}
	.header ul {
		margin: 0;
		padding: 0;
		list-style: none;
		overflow:hidden;
		background-color: #001B38;
		}
	.header li a {
		display: block;
		padding: 20px 20px;
		border-right: 0px solid #001B38;
		text-decoration: none;
		}
	.header li a:hover,
	.header .menu-btn:hover {
		background-color: #AD0002;
	}
	.header .logo {
		display: block;
		float: left;
		font-size: 1.2em;
		padding: 10px 10px;
		text-decoration: none;
	}
	.header .menu {
		clear: both;
		max-height: 0;
		transition: max-height .2s ease-out;
	}
	.header .menu-icon {
		cursor: pointer;
		display: inline-block;
		float: right;
		padding: 18px 18px;
		position: relative;
		user-select: none;
		}
	.header .menu-icon .navicon {
		background: #FFFFFF;
		display: block;
		height: 3px;
		position: relative;
		transition: background .2s ease-out;
		width: 20px;
		}
	.header .menu-icon .navicon:before,
	.header .menu-icon .navicon:after {
		background: #FFFFFF;
		content: '';
		display: block;
		height: 100%;
		position: absolute;
		transition: all .2s ease-out;
		width: 100%;
		}
	.header .menu-icon .navicon:before {
		top: 7px;
	}
	.header .menu-icon .navicon:after {
		top: -7px;
	}
	.header .menu-btn {
		display: none;
	}
	.header .menu-btn:checked ~ .menu {
		max-height: 650px;
		}
	.header .menu-btn:checked ~ .menu-icon .navicon {
		background: transparent;
	}
	.header .menu-btn:checked ~ .menu-icon .navicon:before {
		transform: rotate(-45deg);
	}
	.header .menu-btn:checked ~ .menu-icon .navicon:after {
		transform: rotate(45deg);
	}
	.header .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:before,
	.header .menu-btn:checked ~ .menu-icon:not(.steps) .navicon:after {
		top: 0;
	}
	@media (min-width: 45em) {
		.header li {
			float: left;
		}
		.header li a {
			padding: 18px 18px;
		}
		.header .menu {
			clear: none;
			float: right;
			max-height: none;
		}
		.header .menu-icon {
		display: none;
		}
}
	
.navbar {
	grid-area: navbar;
	background: #ffffff25;
	box-shadow: -1px 1px 7px 0px rgba(0, 0, 0, 0.75);
	border-radius: 10px;
	padding: 1%;
	text-align: center;
	}
.sidebar {
	grid-area: sidebar;
	text-align: center;
	max-width: 97%;
	padding: 1px;
	background: #ffffff25;
	box-shadow: -1px 1px 7px 0px rgba(0, 0, 0, 0.75);
	border-radius: 10px;
	align-items: center;
	opacity: 100%;
	}
.L1 {
	padding: 10%;
	width: 99%;
	text-align: center;
	}
	.L2 {
		padding: 20%;
		width: 100%;
		text-align: center;
		}	
.main {
	grid-area: main;
	padding: 1px;
	}
/* footer */
.footer {
	grid-area: footer;
	margin-top: 70px;
	background: #001B38;
	color: white;
	text-align: center;
	padding: 35px;
	font-size: .7rem;
	}
fp {
	padding: 2px;
	text-align: center;
	font-family: 'Gayathri', sans-serif;
	}
fa {
	color: white;
	font-family: 'Archivo Black', sans-serif;
	font-weight: bold;
	}
	
	
	
.grid-container {
	display: grid;
	gap: 10px;
	grid-template:
		"header"  auto
		"navbar"  50vh
		"main"    auto
		"sidebar" auto
		"footer"  auto;
	
	}
@media (min-width: 600px) {
	.grid-container {
		grid-template-columns: 60% auto;
		grid-template-rows: 6% 80% 7% 1%;
	grid-template-areas:
		"header header"
		"navbar sidebar"
		"footer footer"
		"main main"
		}
	}
@media (min-width: 950px) {
	.grid-container {
		padding: 1px;
		grid-template-columns: 40% 40% auto;
		grid-template-rows: 6.1% 79% 6% auto;
 	grid-template-areas:
		"header header header"
		"navbar navbar sidebar"
		"footer footer footer"
		"main main main"
		}
	}