@import url('https://fonts.googleapis.com/css2?family=Merriweather:ital,opsz,wght@0,18..144,300..900;1,18..144,300..900&family=Raleway:ital,wght@0,100..900;1,100..900&display=swap');
@import url('css/slider.css');

@charset "utf-8";

* {
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;
	margin:0;
	padding:0;
}

Body {
	font-family: 'Merriweather', Verdana, Helvetica, sans-serif;
	font-size: 17px;
	font-weight:300;
	color: #fff;
	background-color:#000;
}

main {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-flow: row wrap;
	flex-flow: row wrap;
	align-content: center;
	width:100%;
	max-width:1920px;
	margin:auto;
	max-height:1080px;
	border: # 4px dotted;
	margin:auto;
	/*max-height:100vh;*/
}

section {
	width:100%;
	position: relative;
	margin:auto;
}

h1 {
	font-size:24px;
	font-weight:500;
	color: #D4F2E3;
	text-shadow: #000 1px 1px 2px;
	letter-spacing:1px;
	border-bottom: #D4F2E3 2px solid;
	border-top: #D4F2E3 2px solid;
	background-color:rgba(0,0,0,.4);
	width: auto;
	min-width:140px;
	padding: 8px 12px;
	margin:16px;
	width:auto;
	z-index:99;
	position: absolute;
}

/*-----------------------------------------------------------------------------------*/

header {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-flow: row wrap;
	flex-flow: row wrap;
	justify-content: space-around;
	align-items: stretch;
	width:100%;
	max-width:1366px;
	/*background-color:rgba(0,0,0,.1);*/
	position:fixed;
	z-index:99;
}

header .titulo{
	width:75%;
}

img {
    max-width: 100%;
    height: auto;
}

/*---------------------------------- MENU -------------------------*/

header .navegar {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-flow: row wrap;
	flex-flow: row wrap;
	justify-content:center;
	width:20%;
}

.nav {
	list-style: none;
	width: auto;
	margin:auto;
	z-index:9999;
}

.nav ul {
    list-style: none;
}

.nav a {
	font-size:16px;
	font-weight:400;
    color:#fff;
	text-decoration: none;
    padding:2px 8px 4px;
	background-color:#000;
	background-color:rgba(0,0,0,.6);
	display:block;
}

.nav a:hover {
    color:#cc0;
	background-color:#000;
}

.nada {
	font-size:16px;
	font-weight:400;
    color:#fff;
	text-decoration: none;
    padding:2px 8px 3px;
	border:#bbb thin solid;
	border-top:none;
	background-color:rgba(131,21,41,.6);
	display:block;
}

.nav li {
    position: relative;
}
.nav > li {
    float: left;
}

.nav li  ul {
    position: absolute;
    left: -9999px;
}

/*--------------------------------------------------- Full Screen ----------------------------------*/

header .fullscreen {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-flow: row wrap;
	flex-flow: row wrap;
	align-items:stretch;
	width:5%;
}

.fullscreen input {
	cursor: pointer;
	background-image:url(../gif/fullscreem01.gif);
	width:26px;
	height:22px;
	margin:auto;
	background-color:rgba(66,66,66,.4);
}

.fullscreen input:hover {
	background-image:url(../gif/fullscreem02.gif);
	background-color:rgba(66,66,66,.8);
}

input {
	font-weight:400;
	font-size:20px;
	color: #000;
	background-color:#EAEFFF;
	letter-spacing:1px;
	border: none;
	padding: 6px;
}



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


main {
	/*min-height:0vh;*/
}

wrapper {
	text-align:left;
	border-bottom:#7E1151 3px solid;
	border-top:#7E1151 3px solid;
}

h1 {
	font-weight:500;
	font-size:20px;
	color: #fff;
	text-indent:7px;
	letter-spacing:0;
	line-height:2;
	text-shadow: 1px 1px 2px #000;
	background-color: none;
}

.grboton a {
	font-size:17px;
    color:#fff;
    padding: 4px 12px;
	margin: 6px auto;
	line-height:1.4;
}

/*-----------------------------------------------------------------------------------*/

header {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-flow: row wrap;
	flex-flow: row wrap;
	justify-content: space-around;
	align-items: stretch;
	width:100%;
	max-width:1280px;
	background-color:rgba(90,90,90,.4);
	position:fixed;
	z-index:99;
}


header .navegar {
	width:60%;
}
	
header .titulo{
	width:35%;
}

.fullscreen input {
	padding:0;
	display: inline;
}

.titulo h1 {
	font-size:15px;
	color:#fff;
	text-shadow:#000 1px 1px 1px;
	padding:3px 5px;
	margin:auto;
	line-height:2;
	border-radius:6px;
	border:#909090 thin solid;
	background-color:#000;
	background-color:rgba(0,0,0,.3);
	display: inline;
}

/*---------------------------------- MENU -------------------------*/

.nav a {
	font-size:12px;
	font-weight:400;
    color:#fff;
    padding:0 4px 4px;
	margin-left:1px;
}

.nav li {
    position: relative;
}
.nav > li {
    float: left;
    /*border-top: 1px solid #104336;*/
}

.nav > li > .parent {
    background-image: url(../gif/downArrow.png);
    background-repeat: no-repeat;
    background-position: right;
	background-position: 10% 105%;
}

.nav > li > a {
    display: block;
}
.nav li  ul {
    position: absolute;
    left: -9999px;
}
.nav > li.hover > ul {
    left: 0;
}
.nav li li.hover ul {
    left: 100%;
    top: 0;
}
.nav li li a {
	font-size:12px;
	text-align:left;
	line-height:1.2;
    display: block;
    background: rgba(0,0,0,0.6);
    position: relative;
    z-index:300;
    border-top:rgba(0,0,0,1) thin solid;
	width:120px;
}

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


main {
	/*min-height:0vh;*/
}

wrapper {
	text-align:left;
	border-bottom:#7E1151 3px solid;
	border-top:#7E1151 3px solid;
}

h1 {
	font-weight:500;
	font-size:20px;
	color: #fff;
	text-indent:7px;
	letter-spacing:0;
	line-height:2;
	text-shadow: 1px 1px 2px #000;
	background-color: none;
}

.grboton a {
	font-size:17px;
    color:#fff;
    padding: 4px 12px;
	margin: 6px auto;
	line-height:1.4;
}

/*---------------------------------- MENU -------------------------*/


.toggleMenu {
	font-size:15px;
	font-weight:600;
	letter-spacing:3px;
}

.nav:before, .nav:after {
    content: ""; 
    display: table; 
}
.nav:after {
    clear: both;
}
.nav ul {
    list-style: none;

}
.nav a {
	font-size:12px;
	font-weight:400;
    color:#fff;
    padding:0 6px 4px;
	margin-left:1px;
	border-radius:px;
	background-color:#000;
	background-color:rgba(0,0,0,.5);
}

.nav li {
    position: relative;
}
.nav > li {
    float: left;
    /*border-top: 1px solid #104336;*/
}

.nav > li > .parent {
    background-image: url(../gif/downArrow.png);
    background-repeat: no-repeat;
    background-position: right;
	background-position: 10% 105%;
}

.nav > li > a {
    display: block;
}
.nav li  ul {
    position: absolute;
    left: -9999px;
}
.nav > li.hover > ul {
    left: 0;
}
.nav li li.hover ul {
    left: 100%;
    top: 0;
}
.nav li li a {
	font-size:17px;
	text-align:left;
	line-height:1.2;
    display: block;
    background: rgba(0,0,0,0.6);
    position: relative;
    z-index:300;
    border-top:rgba(0,0,0,1) thin solid;
	width:120px;
}

.nav li a:hover, .nav li li a:hover  {
	color:#FFEC86;
	background-color: rgba(100,100,100,0.7);
}
.nav li li li a {
    background:#249578;
    z-index:300;
    border-top: 1px solid #5078F0;
}

}