* {
  margin: 0;
  padding: 0;
}

@font-face {
  font-family: "Dirtyline";
  src: url("../resources/font/Dirtyline 36daysoftype 2022.ttf");
}
h1 {
  color: #FF0606;
  font-family: "Dirtyline";
  font-size: 128px;
  font-weight: 400;
  margin: auto;
}
@media (max-width: 480px) {
  h1 {
    font-size: 64px;
  }
}

h2 {
  color: #FF0606;
  font-family: "Dirtyline";
  font-size: 76px;
  font-weight: 400;
}
@media (max-width: 480px) {
  h2 {
    font-size: 45px;
  }
}

h3 {
  color: #FF0606;
  font-family: "Dirtyline";
  font-size: 58px;
  font-weight: 400;
}
@media (max-width: 480px) {
  h3 {
    font-size: 38px;
  }
}

.simple-text {
  font-size: 20px;
}
@media (max-width: 480px) {
  .simple-text {
    font-size: 16px;
  }
}

.main-text {
  text-transform: uppercase;
  font-size: 50px;
  font-weight: 800;
}
@media (max-width: 480px) {
  .main-text {
    font-size: 30px;
  }
}

.quotes-text {
  margin: auto;
  font-size: 42px;
  text-align: center;
  font-weight: 400;
  font-style: italic;
  width: 80%;
}
@media (max-width: 480px) {
  .quotes-text {
    width: unset;
    font-size: 26px;
  }
}

body {
  background-color: #FAF5EB;
  color: #000000 !important;
  font-family: "Work Sans", sans-serif;
}
body .bg-body-tertiary {
  background-color: #000000 !important;
}

/*FOOTER*/
footer {
  margin-top: 90px;
  display: flex;
  align-items: center;
  color: white;
  background-color: black;
  padding: 30px 50px;
  font-size: 20px;
  justify-content: space-between;
}
@media (max-width: 480px) {
  footer {
    flex-direction: column;
    text-align: center;
    margin-top: 50px;
    font-size: 18px;
  }
}
footer #socialMediaIconsCont {
  display: flex;
  align-items: center;
}
footer #socialMediaIconsCont .socialmedia-icons {
  margin: 0px 10px;
}

header {
  display: unset;
}
header .navbar-collapse {
  flex-grow: unset;
}
header .navbar-collapse .nav-link {
  color: #FFFFFF !important;
  font-size: 20px;
  padding-right: 20px !important;
  padding-left: 20px !important;
}
header .navbar-collapse .nav-link:hover {
  color: #FF0606 !important;
}

#contactUs {
  padding: 0px 20px;
  margin-top: 50px;
  display: flex;
}
@media (max-width: 480px) {
  #contactUs {
    flex-direction: column;
    margin-top: 40px;
  }
}
#contactUs #contactUsMainInfo {
  width: 50vw;
}
@media (max-width: 480px) {
  #contactUs #contactUsMainInfo {
    width: 100%;
  }
}
#contactUs #contactUsMainInfo .icons-contact {
  margin: 20px 0px;
  display: flex;
  align-items: center;
}
#contactUs #contactUsMainInfo .icons-contact .txt-icons-contact {
  margin: 0px 0px 0px 15px;
}
#contactUs #contForm {
  width: 50vw;
}
@media (max-width: 480px) {
  #contactUs #contForm {
    width: 100%;
  }
}
#contactUs #contForm form {
  display: flex;
  flex-direction: column;
}
#contactUs #contForm .contact-label {
  border: #FFFFFF;
  border-radius: 10px;
  padding: 15px;
  font-size: 18px;
  margin: 10px 0px;
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
#contactUs #contForm #btnSendForm {
  border-radius: 8px;
  padding: 10px;
  font-size: 18px;
  background-color: #FF0606;
  color: #FFFFFF;
  border: #FFFFFF;
  margin: 10px 0px;
}
#contactUs #contForm #btnSendForm:hover {
  background-color: #9D0303;
  cursor: pointer;
}

#containerGrid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  grid-template-rows: auto auto auto;
  grid-template-areas: "secfirstgrid secfirstgrid secfirstgrid secsecondgrid secsecondgrid secsecondgrid" "elMadrilenioFrameSt elMadrilenioFrameSt elMadrilenioFrameSt firstStatsNumbers secondStatsNumbers thirdStatsNumbers" "albumIdolo albumIdolo albumIdolo idoloFrameSt idoloFrameSt idoloFrameSt";
  row-gap: 100px;
  column-gap: 20px;
  align-items: center;
  margin-top: 22px;
}
@media (max-width: 480px) {
  #containerGrid {
    grid-template-areas: "secfirstgrid secfirstgrid secfirstgrid secfirstgrid secfirstgrid secfirstgrid" "secsecondgrid secsecondgrid secsecondgrid secsecondgrid secsecondgrid secsecondgrid" "elMadrilenioFrameSt elMadrilenioFrameSt elMadrilenioFrameSt elMadrilenioFrameSt elMadrilenioFrameSt elMadrilenioFrameSt" "firstStatsNumbers firstStatsNumbers firstStatsNumbers firstStatsNumbers firstStatsNumbers firstStatsNumbers" "secondStatsNumbers secondStatsNumbers secondStatsNumbers secondStatsNumbers secondStatsNumbers secondStatsNumbers" "thirdStatsNumbers thirdStatsNumbers thirdStatsNumbers thirdStatsNumbers thirdStatsNumbers thirdStatsNumbers" "albumIdolo albumIdolo albumIdolo albumIdolo albumIdolo albumIdolo" "idoloFrameSt idoloFrameSt idoloFrameSt idoloFrameSt idoloFrameSt idoloFrameSt";
    margin-top: 15px;
    row-gap: 20px;
    column-gap: unset;
  }
}
#containerGrid #secFirstGrid {
  grid-area: secfirstgrid;
  padding: 0px 20px;
}
#containerGrid #secFirstGrid .popular-albums {
  margin: 25px 0px 80px 0px;
}
@media (max-width: 480px) {
  #containerGrid #secFirstGrid .popular-albums {
    margin: 25px 0px 25px 0px;
  }
}
#containerGrid #secFirstGrid .madrilenio-album-txt {
  margin-top: 30px;
}
@media (max-width: 480px) {
  #containerGrid #secFirstGrid .madrilenio-album-txt {
    margin-top: 15px;
  }
}
#containerGrid #secSecondGrid {
  grid-area: secsecondgrid;
}
@media (max-width: 480px) {
  #containerGrid #secSecondGrid {
    margin-bottom: 30px;
  }
}
#containerGrid #secSecondGrid img {
  width: 100%;
}
#containerGrid #elMadrilenioFrameSt {
  grid-area: elMadrilenioFrameSt;
  padding: 0px 20px;
}
@media (max-width: 480px) {
  #containerGrid #elMadrilenioFrameSt {
    margin-bottom: 20px;
  }
}
@media (max-width: 480px) {
  #containerGrid #elMadrilenioFrameSt iframe {
    width: 100%;
    height: 75vh;
  }
}
#containerGrid #firstStatsNumbers {
  grid-area: firstStatsNumbers;
  text-align: center;
}
#containerGrid #secondStatsNumbers {
  grid-area: secondStatsNumbers;
  text-align: center;
}
#containerGrid #thirdStatsNumbers {
  grid-area: thirdStatsNumbers;
  text-align: center;
}
#containerGrid #albumIdolo {
  grid-area: albumIdolo;
  padding: 0px 20px;
}
@media (max-width: 480px) {
  #containerGrid #albumIdolo {
    margin-top: 18px;
  }
}
#containerGrid #idoloFrameSt {
  grid-area: idoloFrameSt;
}
@media (max-width: 480px) {
  #containerGrid #idoloFrameSt iframe {
    width: 100%;
    height: 75vh;
    padding: 0px 20px;
  }
}

#historyContGridBoos {
  padding: 0px 8px;
}
@media (max-width: 480px) {
  #historyContGridBoos {
    margin-top: 40px;
  }
}
#historyContGridBoos .row h2 {
  margin-top: 50px;
}
@media (max-width: 480px) {
  #historyContGridBoos .row h2 {
    margin-top: unset;
  }
}

#ctanganaWCat {
  width: 100%;
  margin-bottom: 20px;
}

table {
  width: 60vw;
  margin: auto;
}
@media (max-width: 480px) {
  table {
    width: 100vw;
  }
}
@media (max-width: 480px) {
  table tr {
    display: flex;
    flex-wrap: wrap;
    padding: 0px 20px;
    justify-content: center;
  }
}
table tr th {
  padding: 30px 30px;
  height: 70px;
}
@media (max-width: 480px) {
  table tr th {
    padding: unset;
    height: unset;
  }
}
table .year-history {
  font-size: 38px;
  font-weight: 800;
}
@media (max-width: 480px) {
  table .year-history {
    width: 70vw;
    text-align: center;
    margin-top: 25px;
  }
}
table .table-txt-history {
  font-size: 18px;
  font-weight: 400;
  text-align: left;
}
@media (max-width: 480px) {
  table .table-txt-history {
    margin-top: 20px;
    text-align: center;
  }
}

#homeMain {
  background-image: url("../resources/images/ctangana-imgprincipal-home.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  height: 100vh;
  background-position: center;
  display: flex;
}

#aboutTheArtist {
  width: 98vw;
  overflow-x: hidden;
  margin-top: 80px;
  display: flex;
  padding: 0px 20px;
  column-gap: 110px;
}
#aboutTheArtist .ctangana-yacht {
  margin-top: 20px;
  width: 100%;
}
@media (max-width: 480px) {
  #aboutTheArtist .ctangana-yacht {
    margin-top: unset;
  }
}
@media (max-width: 480px) {
  #aboutTheArtist {
    width: 100vw;
    overflow-x: hidden;
    column-gap: unset;
    flex-wrap: wrap;
    margin-top: 50px;
  }
}

#topHits {
  margin-top: 60px;
  padding: 0px 20px;
}
#topHits .top-hits-imgs {
  margin-bottom: 80px;
  margin-top: 40px;
  display: flex;
  align-items: center;
  justify-content: space-evenly;
  padding: 0px 200px;
}
@media (max-width: 480px) {
  #topHits .top-hits-imgs {
    flex-wrap: wrap;
    padding: unset;
    margin-top: 20px;
    margin-bottom: 20px;
  }
}
#topHits .top-hits-imgs .cont-top-hits {
  display: flex;
  justify-content: center;
  flex-direction: column;
  position: relative;
}
@media (max-width: 480px) {
  #topHits .top-hits-imgs .cont-top-hits {
    margin-bottom: 35px;
  }
}
#topHits .top-hits-imgs .cont-top-hits:hover .txt-img-top-hits {
  visibility: visible;
}
#topHits .top-hits-imgs .cont-top-hits .border-img-tophits {
  border: 2px dashed #FF0606;
  width: 100%;
}
#topHits .top-hits-imgs .cont-top-hits .txt-img-top-hits {
  font-size: 36px;
  font-weight: 900;
  text-transform: uppercase;
  text-align: center;
  position: absolute;
  top: 0px;
  left: 0px;
  background-color: rgba(173, 28, 28, 0.3);
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: end;
  color: #FFFFFF;
  visibility: hidden;
}
@media (max-width: 480px) {
  #topHits .top-hits-imgs .cont-top-hits .txt-img-top-hits {
    font-size: 26px;
  }
}
#topHits .top-hits-imgs .cont-top-hits .txt-img-top-hits .txt-img-top-hits-margin {
  margin-bottom: 51px;
}

#titlePhotoGallery {
  margin: 50px 0px 30px 20px;
}
@media (max-width: 480px) {
  #titlePhotoGallery {
    margin: 40px 0px 30px 20px;
  }
}

.gallery-slider-1 {
  width: 100%;
  height: auto;
  overflow: hidden;
}
.gallery-slider-1 .gslider-track {
  display: flex;
  animation: scroll 40s linear infinite;
  -webkit-animation: scroll 40s linear infinite;
  width: 5250px;
}
.gallery-slider-1 .gslider-track .slide-photo {
  width: 375px;
}
.gallery-slider-1 .gslider-track .slide-photo img {
  width: 100%;
}

@keyframes scroll {
  0% {
    -webkit-transoform: translateX(0);
    transform: translateX(0);
  }
  100% {
    -webkit-transoform: translateX(-2625px);
    transform: translateX(-2625px);
  }
}
#newinShopTitle {
  margin: 50px 0px 0px 20px;
}
@media (max-width: 480px) {
  #newinShopTitle {
    margin: 40px 0px 0px 20px;
  }
}

.products-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
  overflow-x: hidden;
}
@media (max-width: 480px) {
  .products-container {
    flex-direction: column;
  }
}
.products-container .products-shop {
  color: #000000;
  border-radius: 14px;
  padding: 20px;
  width: 400px;
}
@media (max-width: 480px) {
  .products-container .products-shop {
    width: unset;
  }
}
@media (max-width: 480px) {
  .products-container .products-shop .imgs-shop {
    width: 100%;
  }
}
.products-container .products-shop .title-product {
  font-size: 20px;
  font-weight: 700;
}
.products-container .products-shop .price-product {
  margin-bottom: 30px;
}
.products-container .products-shop .btn-buy-product {
  text-decoration: none;
  background-color: #FF0606;
  color: #FFFFFF;
  padding: 12px 24px;
  border-radius: 8px;
}
.products-container .products-shop .btn-buy-product:hover {
  background-color: #9D0303;
}

/*# sourceMappingURL=main.css.map */