body{
  margin: 0px;
  background-color: #222;
  background-image: url('../back.png'); 
}

.wrap{
  min-width: 1080px;
  max-width: 1080px;
  margin: auto;
  background: #000;
}

.main{
  padding: 16px;
}

.header{
  margin: auto;
}

td,div{
  font-family: 'Mukta', sans-serif;
  font-size: 18px;
  color: #fff;
  font-weight: 400;
}

.section{
  color: orange;
  font-weight: 800;
  font-size: 24px;
}

.logo{
  font-family: 'Mukta', sans-serif;
  font-size: 80px;
  color: #fff;
  font-weight: 800;
  text-align: center;
  line-height: 1;
}

.by{
  text-align: right;
}

.text{
  text-align: justify;
  justify-content: top;
}

img{
 padding: 4px;
}

hr{
  border: 5px solid orange;
  border-radius: 5px;
  width: 90%;
}

a:link,
a:visited,
a:active{
  text-decoration: none;
  font-weight: none;
  color: limegreen;
  font-size: 24px;
}
a:hover{
  text-decoration: underline;
}

li{
  padding-left: 12px;
}

.boing{
  position: relative;
  top: 6px;
}

.footer{
  width: 100%;
  height: 50px;
  background: #fff;
  color: #000;
  font-weight: 800;
  font-size: 24px;
  text-align: center;
  vertical-align: middle;
}

.screenshots {
    position:relative;
    margin:auto;
}
.screenshots img {
    position:absolute;
    left:0px;
    -webkit-animation-name: fade;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-duration: 6s;
    animation-name: fade;
    animation-iteration-count: infinite;
    animation-duration: 6s;
}

@-webkit-keyframes fade {
    0% {opacity: 0;}
    20% {opacity: 1;}
    33% {opacity: 1;}
    53% {opacity: 0;}
    100% {opacity: 0;}
}
@keyframes fade {
    0% {opacity: 0;}
    20% {opacity: 1;}
    33% {opacity: 1;}
    53% {opacity: 0;}
    100% {opacity: 0;}
}

#sc1 {
}
#sc2 {
    -webkit-animation-delay: -4s;
}
#sc3 {
    -webkit-animation-delay: -2s;
}