body{ overflow-x: scroll; width: auto; white-space: nowrap; overflow-y: hidden;
}

body::-webkit-scrollbar { background-color: #00a651; height: .9rem;
}

body::-webkit-scrollbar-thumb { border-radius: 0px; background-color: white;

}

.maincontainer { margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; font-size:
0;

} img { display: inline-block; width: 515px; margin: 0px 0px 0px 0px; padding:
0px 0px 0px 0px; line-height: 0;
}

#gif { margin-right: .5%; margin-left: .5%;
}



@media  screen and (max-width: 1600px) { img{ width:475px; margin-top: 0px;
}

}

@media  screen and (max-width: 1500px) { img{ width:420px; margin-top: 0px;
}

}

@media  screen and (max-width: 1400px) { img{ width:350px; margin-top: 0px;
}

}


@media  screen and (max-width: 1300px) { img{ width:325px; margin-top: 0px;
}

}

@media  screen and (max-width: 1200px) { img{ width:250px; margin-top: 0px;
}

}

@media  screen and (max-width: 1100px) { img{ width:200px; margin-top: 0px;
}

}

@media  screen and (max-width: 800px) { img{ width:500px; margin-top: 10px;
}

}

@media  screen and (max-width: 600px) { img{ width:500px; margin-top: 10px;
}

}

@media screen and (max-width: 500px) { img{ width:450px; margin-top: 10px;
          }
@media screen and (max-width: 450px) { img{ width:340px; margin-top: 20px;
                        }

@media screen and (max-width: 400px) { img{ width:300px; margin-top: 20px;
              }

@media screen and (max-width: 350px) { img{ width:250px; margin-top: 20px;
                            }

}

@media screen and (max-width: 320px) { img{ width:225px; margin-top: 20px;
                            }

}