@charset "utf-8";

/*
Theme Name: Azurea - Resortwear & Swim Label HTML5 Template
Author: Metropolitanthemes
Version: 1.0.0

Responsive stylesheet - desktop first: 1399 / 1199 / 991 / 767 / 575
*/

/*======================
(min-width: 1600px)
========================*/
@media (min-width: 1600px) {
  /* 1. General */
  .container {
    max-width: 1440px;
  }
  html {
    font-size: 17px;
  }
  body {
    font-size: 17px;
  }
}

/*======================
(min-width: 1960px)
========================*/
@media (min-width: 1960px) {
  /* 1. General */
  .container {
    max-width: 1560px;
  }
  html {
    font-size: 18px;
  }
  body {
    font-size: 17.5px;
  }
}

/*======================
(max-width: 1399px)
========================*/
@media (max-width: 1399px) {
  /* 1. General */
  .sec-pt-120 {
    padding-top: 100px;
  }
  .sec-pb-120 {
    padding-bottom: 100px;
  }

  /* 3. Header */
  .az-header .wide {
    padding: 0 26px;
  }
  .header-style-one .header-main .wide::after {
    left: 26px;
    right: 26px;
  }
  .header-main .wide {
    gap: 26px;
  }
  .header-bag .bag-word,
  .header-bag b {
    display: none;
  }
  .header-bag {
    padding: 3px;
  }

  /* 3. Header */
  .az-nav > ul {
    gap: 24px;
  }
  .az-nav > ul > li > a {
    font-size: 15px;
  }

  /* 8. Home One */
  .hero-copy {
    left: 8%;
    width: 52%;
  }
}

/*======================
(max-width: 1199px)
========================*/
@media (max-width: 1199px) {
  /* 3. Header */
  .az-nav,
  .header-menu {
    display: none;
  }
  .az-menu-toggle {
    display: inline-flex;
  }
  .header-main .wide {
    height: 80px;
  }
  .header-style-three .header-main .wide {
    height: 84px;
  }
  .header-top .top-left,
  .header-top .top-right > a {
    display: none;
  }
  .header-top .top-center {
    flex: 1;
  }

  /* 3. Header */
  .header-style-three.is-sticky .header-main {
    display: block;
  }

  /* 7. Components */
  .piece-row {
    grid-template-columns: repeat(3, 1fr);
  }

  /* 8. Home One */
  .hero-slider {
    min-height: 560px;
  }
  .hero-shop {
    right: 24px;
    bottom: 24px;
  }

  /* 8. Home One */
  .mix-window,
  .mix-item {
    height: 210px;
  }

  /* 9. Home Two */
  .line-scene {
    height: 480px;
  }
  .line-item.is-shirt {
    width: 240px;
  }
  .line-item.is-towel {
    width: 150px;
  }
  .line-item.is-short {
    width: 190px;
  }

  /* 16. Footer */
  .footer-top {
    padding: 80px 0 56px;
  }
}

/*======================
(max-width: 991px)
========================*/
@media (max-width: 991px) {
  /* 1. General */
  .sec-pt-120 {
    padding-top: 84px;
  }
  .sec-pb-120 {
    padding-bottom: 84px;
  }
  .sec-pt-90 {
    padding-top: 70px;
  }
  .sec-pb-90 {
    padding-bottom: 70px;
  }
  .az-photo-band::after {
    background: linear-gradient(90deg, rgba(15, 34, 43, 0.92) 0%, rgba(15, 34, 43, 0.82) 70%, rgba(15, 34, 43, 0.62) 100%);
  }

  /* 1. General */
  .az-title {
    margin-bottom: 42px;
  }
  .az-title.is-split {
    display: block;
  }
  .az-title.is-split .az-btn,
  .az-title.is-split .az-btns {
    margin-top: 22px;
  }

  /* 3. Header */
  .az-search .search-results {
    grid-template-columns: repeat(2, 1fr);
  }
  .search-input {
    font-size: 24px;
    height: 62px;
  }

  /* 7. Components */
  .card-add,
  .card-tool + .card-tool {
    opacity: 1;
    transform: none;
  }

  /* 8. Home One */
  .hero-inset {
    padding: 0 16px;
  }
  .hero-slider {
    height: auto;
    min-height: 0;
  }
  .hero-slider .swiper-slide {
    min-height: 720px;
  }
  .hero-img {
    object-position: 62% center;
  }
  .hero-slider .swiper-slide::before {
    background: linear-gradient(180deg, rgba(140, 211, 236, 0.96) 0%, rgba(140, 211, 236, 0.85) 46%, rgba(140, 211, 236, 0.1) 78%);
  }
  [data-theme="dark"] .hero-slider .swiper-slide::before {
    background: linear-gradient(180deg, rgba(18, 56, 71, 0.96) 0%, rgba(18, 56, 71, 0.85) 46%, rgba(18, 56, 71, 0.1) 78%);
  }
  .hero-copy {
    left: 0;
    top: 0;
    width: 100%;
    padding: 70px 76px 0;
    transform: none;
  }
  .hero-shop {
    left: 76px;
    right: auto;
  }
  .hero-count {
    left: auto;
    right: 30px;
  }

  /* 8. Home One */
  .mix-tag {
    left: auto;
    right: -10px;
    top: -30px;
    transform: rotate(-10deg);
  }

  /* 8. Home One */
  .mosaic-grid {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 340px 260px 260px;
  }
  .mosaic-tile.is-beach {
    grid-row: auto;
    grid-column: 1 / 3;
  }
  .mosaic-tile.is-note {
    grid-column: 1 / 3;
  }

  /* 8. Home One */
  .fit-stamp {
    right: 16px;
    bottom: -30px;
  }

  /* 9. Home Two */
  .collage-wrap {
    grid-template-columns: 1fr;
    min-height: 0;
    gap: 30px;
  }
  .collage {
    height: 520px;
  }

  /* 9. Home Two */
  .line-facts {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .line-facts .az-btn {
    justify-self: start;
  }

  /* 9. Home Two */
  .look-columns {
    grid-template-columns: 1fr 1fr;
  }
  .look-col.is-offset-sm {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: 1fr 1fr;
    padding-top: 0;
  }

  /* 10. Home Three */
  .hero-wave .hero-copy {
    width: auto;
    right: 12px;
    top: 40%;
  }
  .hero-wave .swiper-slide::before {
    background: linear-gradient(180deg, rgba(15, 34, 43, 0.6) 0%, rgba(15, 34, 43, 0.86) 100%);
  }
  .hero-wave-foot {
    flex-direction: column;
    align-items: flex-start;
  }

  /* 12. Shop & Inner Pages */
  .shop-side {
    position: static;
  }

  /* 12. Shop & Inner Pages */
  .az-table th:nth-child(5),
  .az-table td:nth-child(5),
  .az-table th:nth-child(6),
  .az-table td:nth-child(6) {
    display: none;
  }

  /* 12. Shop & Inner Pages */
  .acct-orders li {
    grid-template-columns: 1fr auto;
  }

  /* 13. Feature Pages */
  .pp-gallery {
    position: static;
  }
  .complete-card {
    grid-template-columns: 1fr;
    gap: 30px;
    padding: 26px;
  }

  /* 13. Feature Pages */
  .mb-summary {
    position: static;
  }

  /* 13. Feature Pages */
  .fit-side {
    position: static;
  }

  /* 13. Feature Pages */
  .gift-preview {
    position: static;
  }

  /* 13. Feature Pages */
  .drop-head {
    grid-template-columns: 1fr;
    gap: 26px;
  }
  .drop-block.is-flip .dh-photo {
    order: 0;
  }

  /* 14. Journal, Account & Contact */
  .account-wrap {
    grid-template-columns: 1fr;
  }
  .account-side {
    min-height: 360px;
  }

  /* 14. Journal, Account & Contact */
  .contact-map {
    min-height: 360px;
  }

  /* 15. Subheader */
  .sub-wrap {
    grid-template-columns: 1fr;
    gap: 36px;
  }
  .sub-photo {
    justify-self: start;
    max-width: 100%;
  }
  .sub-photo img {
    aspect-ratio: 16 / 7;
  }
}

/*======================
(max-width: 767px)
========================*/
@media (max-width: 767px) {
  /* 1. General */
  /* Bootstrap's widest gutter is wider than the container's side padding on a phone: rows would spill past the screen */
  .g-5,
  .gx-5 {
    --bs-gutter-x: 1.5rem;
  }

  /* 3. Header */
  .header-top {
    display: none;
  }
  .header-actions .is-wish,
  .header-actions .is-account,
  .header-actions .az-theme-toggle,
  .header-actions .az-lang {
    display: none;
  }
  .header-login {
    font-size: 0;
    gap: 0;
  }
  .header-login i {
    font-size: 16px;
  }

  /* 7. Components */
  .quick-card {
    grid-template-columns: 1fr;
  }
  .quick-media {
    padding: 20px;
  }
  .quick-media img {
    max-width: 260px;
  }
  .quick-body {
    padding: 28px 22px;
  }

  /* 9. Home Two */
  .strip-row {
    grid-template-columns: repeat(3, 1fr);
  }
  .strip-head {
    padding: 0 16px 20px;
  }

  /* 10. Home Three */
  .drop-line {
    display: none;
  }

  /* 10. Home Three */
  .campaign-grid {
    grid-template-columns: 1fr 1fr;
    grid-auto-rows: 200px;
  }

  /* 11. Shop Pages */
  .bag-line {
    flex-wrap: wrap;
  }
  .bl-body {
    flex: 1 1 calc(100% - 120px);
  }
  .bl-total {
    margin-left: auto;
  }

  /* 13. Feature Pages */
  .fit-live,
  .fit-result {
    grid-template-columns: 1fr;
  }
  .fit-list {
    grid-template-columns: 1fr;
  }

  /* 13. Feature Pages */
  .ur-big {
    grid-template-columns: 1fr;
  }
  .upf-result {
    padding: 22px;
  }
  .az-table.is-fabrics th:nth-child(4),
  .az-table.is-fabrics td:nth-child(4),
  .az-table.is-fabrics th:nth-child(5),
  .az-table.is-fabrics td:nth-child(5) {
    display: none;
  }

  /* 13. Feature Pages */
  .store-now {
    grid-template-columns: 1fr;
  }
}

/*======================
(max-width: 575px)
========================*/
@media (max-width: 575px) {
  /* 1. General */
  .az-lead {
    font-size: 16.5px;
  }

  /* 1. General */
  .sec-pt-120 {
    padding-top: 70px;
  }
  .sec-pb-120 {
    padding-bottom: 70px;
  }
  .sec-pt-90 {
    padding-top: 60px;
  }
  .sec-pb-90 {
    padding-bottom: 60px;
  }

  /* 1. General */
  .az-title .line {
    white-space: normal;
  }

  /* 1. General */
  .az-btn {
    height: 50px;
    padding: 0 24px;
  }
  .az-arrow {
    width: 46px;
    height: 46px;
  }

  /* 1. General */
  .az-back-top {
    right: 16px;
    bottom: 16px;
    width: 46px;
    height: 46px;
  }

  /* 2. Preloader */
  .towel-print {
    padding: 22px 24px 18px;
  }
  .towel-print span {
    font-size: 11px;
  }

  /* 3. Header */
  .az-header .wide {
    padding: 0 16px;
  }
  .header-style-one .header-main .wide::after {
    left: 16px;
    right: 16px;
  }
  .header-main .wide {
    height: 70px;
  }
  .az-logo img {
    height: 32px;
  }
  .header-style-three .header-main .az-logo img {
    height: 34px;
  }
  .header-actions {
    gap: 6px;
  }
  .header-actions [data-search-open] {
    display: none;
  }
  .header-bag {
    margin-left: 0;
  }

  /* 3. Header */
  .az-header.is-sticky .header-main .wide {
    height: 66px;
  }

  /* 3. Header */
  .az-search .search-results {
    grid-template-columns: 1fr;
  }
  .search-input {
    font-size: 20px;
  }

  /* 7. Components */
  .az-tabs button {
    height: 40px;
    padding: 0 14px;
    font-size: 13.5px;
  }

  /* 7. Components */
  .piece-row {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }

  /* 8. Home One */
  .hero-slider .swiper-slide {
    min-height: 680px;
  }
  .hero-copy {
    padding: 46px 22px 0;
  }
  .hero-title .line {
    white-space: normal;
  }
  .hero-prev,
  .hero-next {
    top: auto;
    bottom: 22px;
    margin: 0;
  }
  .hero-prev {
    left: auto;
    right: 76px;
  }
  .hero-next {
    right: 18px;
  }
  .hero-count {
    display: none;
  }
  .hero-shop {
    left: 16px;
    bottom: 16px;
    max-width: calc(100% - 150px);
    padding-right: 14px;
  }
  .hs-plate {
    width: 56px;
    height: 56px;
  }
  .hs-body b {
    font-size: 14px;
  }

  /* 8. Home One */
  .mix-stage {
    padding: 14px;
    gap: 12px;
  }
  .mix-window,
  .mix-item {
    height: 170px;
  }
  .mix-tag {
    width: 84px;
    height: 84px;
    font-size: 10.5px;
  }
  .mix-tag b {
    font-size: 20px;
  }
  .mix-pair li {
    grid-template-columns: 64px 1fr auto;
  }

  /* 8. Home One */
  .mosaic-grid {
    grid-template-columns: 1fr;
    grid-template-rows: none;
    grid-auto-rows: 300px;
  }
  .mosaic-tile.is-beach,
  .mosaic-tile.is-note {
    grid-column: auto;
  }
  .mosaic-tile.is-note {
    grid-template-columns: 1fr;
    grid-auto-rows: auto;
  }
  .mosaic-tile.is-note > img {
    display: none;
  }

  /* 8. Home One */
  .fit-mini-fields {
    grid-template-columns: 1fr;
  }
  .fit-stamp {
    width: 116px;
    height: 116px;
  }
  .fit-stamp b {
    font-size: 34px;
  }

  /* 8. Home One */
  .fabric-icons {
    grid-template-columns: repeat(2, 1fr);
  }
  .fabric-card {
    padding: 24px 20px;
  }
  .fabric-card .az-rows li {
    flex-direction: column;
    gap: 2px;
  }
  .fabric-card .az-rows b {
    text-align: left;
  }

  /* 9. Home Two */
  .collage {
    height: 400px;
  }
  .cl-card b {
    font-size: 22px;
  }

  /* 9. Home Two */
  .look-add {
    flex-direction: column;
    align-items: stretch;
  }
  .look-add .az-field {
    flex: none;
  }

  /* 9. Home Two */
  .line-scene {
    height: 330px;
  }
  .line-item.is-shirt {
    width: 150px;
  }
  .line-item.is-towel {
    width: 96px;
  }
  .line-item.is-short {
    width: 118px;
  }
  .peg {
    width: 12px;
    top: -14px;
  }

  /* 9. Home Two */
  .look-columns,
  .look-col.is-offset-sm {
    grid-template-columns: 1fr;
  }
  .look-col.is-offset {
    padding-top: 0;
  }

  /* 9. Home Two */
  .gift-stack {
    height: 300px;
  }
  .gift-stack img {
    width: 68%;
  }
  .gs-a {
    left: 3%;
  }

  /* 10. Home Three */
  .hero-wave .hero-slider {
    height: 860px;
  }
  .hero-wave .hero-copy {
    top: 34%;
  }
  .bc-cells span {
    min-width: 0;
    flex: 1;
    padding: 10px 6px 8px;
  }
  .bc-cells b {
    font-size: 22px;
  }
  .bc-cells {
    width: 100%;
  }
  .book-count {
    width: 100%;
  }
  .hero-wave-foot {
    bottom: 28px;
  }

  /* 10. Home Three */
  .umbrella-stage canvas {
    height: 380px;
  }

  /* 11. Shop Pages */
  .shop-bar {
    flex-direction: column;
    align-items: stretch;
  }

  /* 12. Shop & Inner Pages */
  .az-table th,
  .az-table td {
    padding: 12px 12px;
  }
  .az-table th:nth-child(2),
  .az-table td:nth-child(2) {
    display: none;
  }
  .az-table th img {
    display: none;
  }

  /* 12. Shop & Inner Pages */
  .contact-panel {
    padding: 30px 20px;
  }

  /* 12. Shop & Inner Pages */
  .az-countdown {
    gap: 8px;
  }
  .az-countdown div {
    min-width: 0;
    flex: 1;
  }
  .az-countdown b {
    font-size: 36px;
  }

  /* 13. Feature Pages */
  .mb-picks {
    grid-template-columns: repeat(2, 1fr);
  }
  .mb-options {
    grid-template-columns: 1fr;
  }
  .mb-summary {
    padding: 20px;
  }
  .mb-summary .mix-tag {
    right: -6px;
  }

  /* 13. Feature Pages */
  .az-table.is-chart th,
  .az-table.is-chart td {
    padding: 10px 6px;
    font-size: 13px;
  }
  .az-table.is-chart th:nth-child(2),
  .az-table.is-chart td:nth-child(2) {
    display: table-cell;
  }

  /* 13. Feature Pages */
  .gift-designs {
    grid-template-columns: 1fr 1fr;
  }

  /* 13. Feature Pages */
  .acct-sizes {
    grid-template-columns: 1fr;
  }

  /* 14. Journal, Account & Contact */
  .author-box {
    flex-direction: column;
  }
  .post-nav {
    grid-template-columns: 1fr;
  }
  .comment.is-reply {
    margin-left: 24px;
  }
  .bp-quote {
    padding: 34px 26px;
  }

  /* 14. Journal, Account & Contact */
  .account-form,
  .as-copy {
    padding: 34px 22px;
  }

  /* 14. Journal, Account & Contact */
  .bare-count .az-countdown {
    gap: 6px;
  }
  .bare-count .az-countdown > span {
    min-width: 70px;
    height: 80px;
  }
  .bare-count .az-countdown b {
    font-size: 28px;
  }

  /* 15. Subheader */
  .az-subheader {
    padding: 50px 0 56px;
  }

  /* 16. Footer */
  .news-row {
    flex-direction: column;
  }
  .footer-bottom .container {
    flex-direction: column;
    text-align: center;
  }
  .footer-title .line {
    white-space: normal;
  }
}