Slaidrāde kā info lapa pa visu ekrānu

by Antikrists

HTML

<html><head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

    
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Viss interesantais un noderīgais par un ap dabu.</title>

<meta name="description" content="Tevi interesē daba?Tad tev šī ir īstā vieta." />
<meta name="keywords" content="Par dabu, noderīgi daba, interesanti daba" />

<style>
html {
    min-height: 100%
    }
body {
    min-height: 100%;
    margin:0;
    padding:0;
    font: 15px Tahoma;
    color:#555;
    }
p {
    margin: 1em 0;
    text-align: center
    }
#top{
    width:100%;
    background: #222;
    text-align:center;
    height:35px;
    line-height:35px;
    }
#top a{color:#00FF00;text-decoration:none;}
.logo{
    width:200px;
    font: 22px/125% Tahoma;
    float:left;
    line-height:35px;
    }
.logo span{font: 12px/125% Tahoma;}

.body_slides{
    list-style:none;
    margin:0;
    padding:0;
    z-index:-2;
    background:#000;}
.body_slides,
.body_slides:after{
    position: fixed;
    width:100%;
    height:100%;
    top:0px;
    left:0px;}
.body_slides:after {
    content: '';
    background: transparent url(images/pattern.png) repeat top left;}

@-webkit-keyframes anim_slides {
0% {opacity:0;}
6% {opacity:1;}
24% {opacity:1;}
30% {opacity:0;}
100% {opacity:0;}
}
@-moz-keyframes anim_slides {
0% {opacity:0;}
6% {opacity:1;}
24% {opacity:1;}
30% {opacity:0;}
100% {opacity:0;}
}
.body_slides li{
    width:100%;
    height:100%;
    position:absolute;
    top:0;
    left:0;
    background-size:cover;
    background-repeat:none;
    opacity:0;
    -webkit-animation: anim_slides 18s linear infinite 0s;
    -moz-animation: anim_slides 18s linear infinite 0s;
    -o-animation: anim_slides 18s linear infinite 0s;
    -ms-animation: anim_slides 18s linear infinite 0s;
    animation: anim_slides 18s linear infinite 0s;
}
  
.body_slides li:nth-child(1){
background-image:...