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

body 
{position:absolute;
top: 0px;
left: 0px;
width:95%;
height:100%;
border:0px;
font-family: arial;
text-align: justify;
color:#ffffff;
text-decoration:none;
text-shadow: -3px 3px 3px #000000;
background-image: url(islam-4.png);
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 (max-width:450px)
{body {font-size: 1em;
background-image: url(islam-4-350.png);
background-attachment: fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-repeat: no-repeat;}}

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

div#right
{ float: right;
margin-right: 10px;
width: auto;
font-family: arial;
color: #ffffff;
text-decoration: none;
text-align: center;
text-shadow: -3px 3px 3px #000000; }

div#left
{ position: fixed;
top: 10px;
left: 10px;
width: 105px; }

div#sinopsis
{width: 100px;
height: 66px;
background-image: url(sinopsis-100.png);
visibility:visible; }

div#sinopsis-2
{position:relative;
left: 120px;
top: -200px;
width:550px;
height:360px;
background-image: url(sinopsis-islam.png);
visibility:hidden;}

div#sinopsis:hover div#sinopsis-2 
{visibility:visible; }

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

table {font-size:1.5em;}

@media screen and (min-width:800px)
{body {font-size:100%; /* ampliamos los textos si mide más de 800px */ }}

@media screen and (min-width:1200px)
{body {	font-size:120%;	/* ampliamos más aún los textos si mide más de 1200px */ }}

azul { display: block;
box-sizing:border-box;
padding:5px; }

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


/* ----------- 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)
{ }