home.css 1008 B

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475
  1. * {
  2. margin: 0;
  3. padding: 0;
  4. box-sizing: border-box;
  5. }
  6. body {
  7. font-family: 'Quicksand', sans-serif;
  8. background-image: url(../img/fondo.jpg);
  9. }
  10. /* Carrusel de inicio*/
  11. .slider {
  12. position: relative;
  13. width: 100%;
  14. height: calc(100vh - 90px);
  15. overflow: hidden;
  16. z-index: 0;
  17. }
  18. .slider-container {
  19. display: flex;
  20. transition: transform 1s ease;
  21. }
  22. .slide {
  23. min-width: 100%;
  24. }
  25. .slide img {
  26. width: 100%;
  27. display: block;
  28. }
  29. .btn {
  30. background-color: rgb(255, 255, 255);
  31. border: none;
  32. border-radius: 100%;
  33. width: 50px;
  34. height: 50px;
  35. color: #76225e;
  36. padding: 10px;
  37. cursor: pointer;
  38. position: absolute;
  39. top: 50%;
  40. transform: translateY(-50%);
  41. transform: scale(1.2);
  42. font-size: 24px;
  43. z-index: 10;
  44. }
  45. .prev {
  46. left: 15px;
  47. }
  48. .next {
  49. right: 15px;
  50. }
  51. @keyframes fadeInDown {
  52. from {
  53. opacity: 0;
  54. transform: translate3d(0, -20%, 0);
  55. }
  56. to {
  57. opacity: 1;
  58. transform: translate3d(0, 0, 0);
  59. }
  60. }