* {margin: 0px; padding: 0px; }

body
{ margin: auto;
width: 100%;
height: 1050px;
background-image: url(youtube-900.png);
background-size: cover;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-attachment: fixed; 
background-repeat: no-repeat;
background-color:#000000;
 }

@media screen and (max-width:450px)
{body 
{width: 100%;
height: 540px;
background-image: url(youtube-350.jpg); background-attachment: fixed;}}

div#supremo
{ position: absolute;
top: 5px;
left: 5px;
width: 100%;
height: auto; }

table {font-size:1.5em;}

div#left
{ float:left;
top: 10px;
left: 10px;
font-family: arial;
color: #0000ff;
text-decoration: none;
text-align: center; }


div#right
{ float:right;
top: 20px;
position: fixed;
right: 20px;
width: auto; }


azul { display: block;
padding-top: 10px;
padding-bottom: 10px;
box-sizing:border-box; }

azul:hover { display: block;
padding-top: 10px;
padding-bottom: 10px;
box-sizing:border-box;
background-image: url(resaltado-2.png); }

div#titulo
{ position: fixed;
top:0px;
left: 200px;
visibility: hidden;
display: none; }

@media screen and (max-width: 450px)
{ div#titulo
{ position: fixed;
top:0px;
left: 15px;
visibility: visible;
display: block; }}

div#titulo-2
{ position: fixed;
top:0px;
left: 0px;
visibility: hidden;
display: none; }

@media screen and (min-width: 450px)
{ div#titulo-2
{ position: fixed;
top:0px;
left: 0px;
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)
{ }