* {margin:0px; padding:0px; text-decoration:none; }

body
{ position: absolute;
top: 10px;
left: 10px;
width: 99%;
height: 100%;
font-family: arial;
font-size: 0.9em;
color:#ffffff;
text-decoration: none;
font-weight: bold;
text-align: justify;
text-shadow: -3px 3px 3px  #000000;
background-color:#000000;

background-image: url(nl-500-v.jpg);
background-size: cover;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-repeat: no-repeat;
background-attachment: fixed; }

@media screen and (min-width: 700px)
{body { font-size: 1.3em;
background-image: url(nl-900-v.jpg);
background-size: cover;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-attachment: fixed; 
background-repeat: no-repeat; }}

@media screen and (max-width: 450px)
{body { position: absolute;
top: 5px;
left: 5px;
font-size: 0.6em;
height: 2500px;
background-image: url(nl-350-v.png);
background-size: cover;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-attachment: fixed; 
background-repeat: no-repeat; }}


####################################
========= MORPHEUS MONITOR =========
####################################


*/ div#morpheus-m
{ position: absolute;
top: 100px;
left: 10px;
visivility: hidden;
display: none; }

@media screen and (min-width:700px)
{div#morpheus-m { visivility: visible;
display: block; }}

div#morpheus-m
{ position: absolute;
top: 150px;
left: 50px;
padding-right: 25px;
visivility: hidden;
display: none; }

@media screen and (min-width:700px)
{div#morpheus-m { visivility: visible;
display: block; }} /*


####################################
========= MORPHEUS TABLET ==========
####################################


*/ div#morpheus-tablet
{ position: absolute;
top: 150px;
left: -25px;
visivility: visible;
display: block; }

@media screen and (min-width:700px)
{div#morpheus-tablet { visivility: hidden;
display: none; }}

@media screen and (max-width:450px)
{div#morpheus-tablet { visivility: hidden;
display: none; }} /*


#####################################
========= MORPHEUS CELULAR ==========
#####################################


*/ div#morpheus-celular
{ position: absolute;
top: 95px;
left: -15px;
visivility: hidden;
display: none; }

@media screen and (max-width:450px)
{div#morpheus-celular { visivility: visible;
display: block; }} /*


###############################
========= RESALTADOR ==========
###############################


*/ blanco-m { display: block;
width: 444px;
box-sizing:border-box;
padding:10px; }

blanco-m:hover { display: block;
width: 444px;
box-sizing:border-box;
padding:10px;
background-image: url(resaltado-1.png); }  /*


*/ blanco-t { display: block;
width: 345px;
box-sizing:border-box;
padding: 3px; }

blanco-t:hover { display: block;
width: 345px;
box-sizing: border-box;
padding: 3px;
background-image: url(resaltado-1.png); }  /*


*/ blanco-c { display: block;
width: 240px;
box-sizing:border-box;
padding: 3px; }

blanco-c:hover { display: block;
width: 240px;
box-sizing: border-box;
padding: 3px;
background-image: url(resaltado-1.png); }  /*


###################################
========= HEADER MONITOR ==========
###################################


*/ div#header-monitor
{ position: absolute;
top: 0px;
left: 0px;
visivility: hidden;
display: none; }

@media screen and (min-width:700px)
{div#header-monitor { visivility: visible;
display: block; }} /*


##################################
========= HEADER TABLET ==========
##################################


*/ div#header-tablet
{ position: absolute;
top: 0px;
left: 0px;
visivility: visible;
display: block; }

@media screen and (min-width:700px)
{div#header-tablet { visivility: hidden;
display: none; }}

@media screen and (max-width:450px)
{div#header-tablet { visivility: hidden;
display: none; }} /*


###################################
========= HEADER CELULAR ==========
###################################


*/ div#header-celular
{ position: absolute;
top: 0px;
left: 0px;
visivility: hidden;
display: none; }

@media screen and (max-width:450px)
{div#header-celular { visivility: visible;
display: block; }} /*


###################################
========= INDICE MONITOR ==========
###################################


*/ div#indice-monitor
{ box-sizing: border-box;
visibility: hidden;
display: none; }

@media screen and (min-width: 700px)
{div#indice-monitor { position: absolute;
top: 0px; 
left: 0px;
width: 120px;
height: 3000px;
box-sizing: border-box;
cursor: pointer;
visibility: visible;
display: block; 

}}

div#indice-monitor-b
{ position: absolute;
top: 110px;
left: 0px;
width: 455px;
height: 3000px;
cursor: pointer;
box-sizing: border-box;
visibility: hidden;
display: none; } 

@media screen and (min-width: 700px)
{div#indice-monitor:hover div#indice-monitor-b  { box-sizing: border-box; visibility: visible; display: block;}} /*


#################################
========= INDICE TABLET =========
#################################


*/ div#indice-tablet
{ position: absolute;
top: 0px; 
left: 0px;
width: 110px;
height: 2500px;
cursor: pointer;
visibility: visible; 
display; block; }

@media screen and (min-width:700px)
{div#indice-tablet { visibility: hidden; display: none; }}

@media screen and (max-width:450px)
{div#indice-tablet { visibility: hidden; display: none; }}

div#indice-tablet-b
{ position: absolute;
top: 85px;
left: 0px;
width: 300px;
height: 2500px;
visibility: hidden;
display: none; }

@media screen and (max-width:700px)
{div#indice-tablet:hover div#indice-tablet-b { visibility: hidden; display: none; }}

@media screen and (min-width:450px)
{div#indice-tablet:hover div#indice-tablet-b { visibility: visible; display: block; }} /*


###################################
========= INDICE CELULAR ==========
###################################


*/ div#indice-celular
{ position: absolute;
top: 0px; 
left: 0px; 
width: 75px;
height: 2500px;
cursor: pointer;
visibility: hidden;
display: none; }

@media screen and (max-width:450px)
{div#indice-celular { visibility: visible; display: block; }} 

div#indice-celular-b
{position: absolute;
top: 55px;
left: 0px;
width: 210px;
text-align: left;
visibility: hidden;
display: none; }

@media screen and (max-width:450px)
{div#indice-celular:hover div#indice-celular-b { visibility: visible; display: block; }} /*


####################################################################################################################################


##################################
========= MENU MONITOR ===========
##################################


*/ div#menu-monitor
{ position: absolute;
top: 0px; 
left: 300px;
width: 350px;
height: 100px;
cursor: pointer;
visibility: hidden;
display: none; }

@media screen and (min-width:700px)
{div#menu-monitor { visibility: visible; display: block; }}

div#menu-monitor-b
{position: absolute;
top: -9px;
left: -8px;
padding-left: 9px;
height: 130px;  
visibility: hidden;
display: none;}


@media screen and (min-width:700px)
{div#menu-monitor:hover div#menu-monitor-b { visibility: visible; display: block; }} /*


################################
========= MENU TABLET ==========
################################


*/ div#menu-tablet
{ position: absolute;
top: 0px; 
left: 240px;
cursor: pointer;
visibility: visible; 
display; block; }

@media screen and (min-width:700px)
{div#menu-tablet { visibility: hidden; display: none; }}

@media screen and (max-width:450px)
{div#menu-tablet { visibility: hidden; display: none; }}

div#menu-tablet-b
{position: absolute;
top: 1px;
left: -5px;
visibility: hidden;
display: none; }

@media screen and (max-width:700px)
{div#menu-tablet:hover div#menu-tablet-b { visibility: hidden; display: none; }}

@media screen and (min-width:450px)
{div#menu-tablet:hover div#menu-tablet-b { visibility: visible; display: block; }} /*


#################################
========= MENU CELULAR ==========
#################################


*/ div#menu-celular
{ position: absolute;
top: 0px; 
left: 165px; 
width: 100px;
height: 200px;
cursor: pointer;
visibility: hidden;
display: none; }

@media screen and (max-width:450px)
{div#menu-celular { visibility: visible; display: block; }} 

div#menu-celular-b
{position: absolute;
top: -1px;
left: 4px;
height: 200px;
visibility: hidden;
disply: none;}

@media screen and (max-width:450px)
{div#menu-celular:hover div#menu-celular-b  { visibility: visible; display: block; }} /*


####################################################################################################################################


/* ----------- iPad ----------- */

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px)  

/* Landscape */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) 

/* Portrait */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait)


/* ----------- iPad 1 & 2 /Mini Media Queries  ----------- */
/* ----------- Retina iPad in portrait & landscape  ----------- */

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (-webkit-min-device-pixel-ratio: 1) 

/* Landscape */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio: 1) 

/* Portrait */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio: 1) 



/* ----------- iPad 3 & 4  ----------- */
/* ----------- Retina iPad in portrait & landscape ----------- */

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (-webkit-min-device-pixel-ratio: 2)  

/* Landscape */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio: 2)

/* Portrait */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio: 2)


/* ----------- iPhone 4 and 4S ----------- */

@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2) 
{ }

/* Portrait */
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2)
and (orientation: portrait) 
{ }

/* Landscape */
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2)
and (orientation: landscape) 
{ }

/* ----------- iPhone 5 and 5S ----------- */

@media only screen and (min-device-width : 320px) and (max-device-width : 568px)
{ }

/* Landscape */
@media only screen and (min-device-width : 320px) and (max-device-width : 568px) and (orientation : landscape) 
{ }

/* Portrait */
@media only screen and (min-device-width : 320px) and (max-device-width : 568px) and (orientation : portrait) 
{ }


/* ----------- iPhone 6, 7, 8 ----------- */

@media only screen and (min-device-width : 375px) and (max-device-width : 667px) 
{ }

/* Landscape */
@media only screen and (min-device-width : 375px) and (max-device-width : 667px) and (orientation : landscape)  
{ }

/* Portrait */
@media only screen and (min-device-width : 375px) and (max-device-width : 667px) and (orientation : portrait)  
{ }


/* ----------- iPhone 6, 7, 8 Plus ----------- */

@media only screen and (min-device-width : 414px) and (max-device-width : 736px) 
{ }

/* Landscape */
@media only screen and (min-device-width : 414px) and (max-device-width : 736px) and (orientation : landscape) 
{ }

/* Portrait */
@media only screen and (min-device-width : 414px) and (max-device-width : 736px) and (orientation : portrait) 
{ }


/* ----------- iPhone X ----------- */

@media only screen and (min-device-width : 375px) and (max-device-width : 812px) and (-webkit-device-pixel-ratio : 3)
{ }

/* Landscape */
@media only screen and (min-device-width : 375px) and (max-device-width : 812px) and (-webkit-device-pixel-ratio : 3) and (orientation : landscape) 
{ }

/* Portrait */
@media only screen and (min-device-width : 375px) and (max-device-width : 812px) and (-webkit-device-pixel-ratio : 3) and (orientation : portrait)
{ }