/*
 * magenta: #FF39FF
 * yellow:  #FFFD52
 * green:   #1FFF5E
 * red:     #FF4545
 * purple:  #8C2BFF
 * blue:    #0EAFFF
 * aqua:    #3DE5FF
 */

/* reglisse */

/*
 * body {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !default;
}
*/
body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue",sans-serif;
  margin: 0;
  background-color: white;
  color: #666;
  font-size: 20px;
  line-height: 150%;
  background-image: url(https://cdn.r2ware.dev/legacyfoam/prod/assets-rev/bubble-pattern.c346c354.png);
  background-repeat: repeat;
}

.color-green {
  color: #1FFF5E;
}
.color-red {
  color: #FF4545;
}
.color-purple {
  color: #8C2BFF;
}
.text-center {
  text-align: center;
}

a {
  color: #FF39FF;
  text-decoration: none;
  font-weight: bold;
}

.title a {
  text-transform: uppercase;
  margin-left: 1em;
  margin-right: 1em;
  font-family: ReglisseFill;
}


.footer {
  font-size: 75%;
}
.footer a {
  all: unset;
  all: revert;
  color: #666;
}
.footer a:hover {
  color: #333;
  cursor: pointer;
}


table {
  text-align: left;
}
th, td {
  padding: 5px 20px;
}

/* Override UGG site */
#main {
  width: 100%;
  padding:0;
}
.content-asset p {
  margin:0 auto;
}
.breadcrumb {
  display:none;
}
/* Helpers */
/**************************/
.margin-top-10 {
  padding-top:10px;
}
.margin-bot-10 {
  padding-bottom:10px;
}
/* Typography */
/**************************/
#parallax-world-of-ugg h1 {
  font-size:24px;
  font-weight:400;
  text-transform: uppercase;
  color:black;
  padding:0;
  margin:0;
}
#parallax-world-of-ugg h2 {
  font-family: Reglisse;
  font-size:70px;
  letter-spacing:10px;
  text-align:center;
  font-weight:400;
  text-transform:uppercase;
  z-index:10;
  opacity:.9;
}
#parallax-world-of-ugg h3 {
  font-size:14px;
  line-height:0;
  font-weight:400;
  letter-spacing:8px;
  text-transform: uppercase;
}
#parallax-world-of-ugg p {
}
.sc {
  color: #3b8595;
}
.ny {
  color: #3d3c3a;
}
.atw {
  color: #c48660;
}
/* Section - Title */
/**************************/

.parallax-one img {
  width: 800px;
  max-width: 100%;
}

#parallax-world-of-ugg .title {
  padding: 20px;
  padding-top: 30px;
  margin:0 auto;
  text-align:center;
}
.title img {
  height: 200px;
}
#parallax-world-of-ugg .title h1 {
  font-size:35px;
  letter-spacing:8px;
}
/* Section - Block */
/**************************/
.border1 {
  background-color: #3CE6FF;
  height: 20px;
}
.border2 {
  background-color: #B3F6FF;
  height: 28px;
}
.top1 {
  background-color: #3CE6FF;
  height: 60px;
  margin-top: -30px;
  --mask: 
    linear-gradient(to bottom,#0000 30px,#000 0),
    radial-gradient(30px,#000 98%,#0000) top/55.50px 60px;
  -webkit-mask: var(--mask);
          mask: var(--mask);
}
.top2 {
  background-color: #B3F6FF;
  height: 55px;
  margin-top: -30px;
  --mask: 
    linear-gradient(to bottom,#0000 30px,#000 0),
    radial-gradient(30px,#000 98%,#0000) top/55.50px 60px;
  -webkit-mask: var(--mask);
          mask: var(--mask);
}
.top3 {
  background-color: white;
  height: 35px;
  margin-top: -30px;
  --mask: 
    linear-gradient(to bottom,#0000 30px,#000 0),
    radial-gradient(30px,#000 98%,#0000) top/55.50px 60px;
  -webkit-mask: var(--mask);
          mask: var(--mask);
}

.bot1 {
  background-color: #3CE6FF;
  height: 60px;
  margin-bottom: -30px;
  position: relative;
  z-index: 10;
  --mask:
    linear-gradient(to top,#0000 30px,#000 0),
    radial-gradient(30px,#000 98%,#0000) bottom/55.50px 60px;
  -webkit-mask: var(--mask);
          mask: var(--mask);
}
.bot2 {
  background-color: #B3F6FF;
  height: 55px;
  margin-bottom: -30px;
  position: relative;
  z-index: 20;
  --mask: 
    linear-gradient(to top,#0000 30px,#000 0),
    radial-gradient(30px,#000 98%,#0000) bottom/55.50px 60px;
  -webkit-mask: var(--mask);
          mask: var(--mask);
}
.bot3 {
  background-color: white;
  height: 35px;
  margin-bottom: -30px;
  position: relative;
  z-index: 30;
  --mask: 
    linear-gradient(to top,#0000 30px,#000 0),
    radial-gradient(30px,#000 98%,#0000) bottom/55.50px 60px;
  -webkit-mask: var(--mask);
          mask: var(--mask);
}

#parallax-world-of-ugg .block {
  padding: 60px;
  width:820px;
  margin:0 auto;
}
#parallax-world-of-ugg .block-gray {
  background: #f2f2f2;
  padding: 60px;
}
#parallax-world-of-ugg .section-overlay-mask {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: black;
  opacity: 0.70;
}
/* Section - Parallax */
/**************************/
#parallax-world-of-ugg .parallax-one {
  padding-top: 100px;
  padding-bottom: 100px;
  overflow: hidden;
  position: relative;
  width: 100%;
  background-image: url(https://cdn.r2ware.dev/legacyfoam/prod/assets-rev/foam-pov-edit.4cc4a242.jpg);
  background-size: cover;
  -moz-background-size: cover;
  -webkit-background-size: cover;
  background-repeat: no-repeat;
  background-position: top center;
}
#parallax-world-of-ugg .parallax-two {
  padding-top: 200px;
  padding-bottom: 200px;
  overflow: hidden;
  position: relative;
  width: 100%;
  background-image: url(https://cdn.r2ware.dev/legacyfoam/prod/assets-rev/foamy-ppl-orig.bba55cb9.jpg);
  background-size: cover;
  -moz-background-size: cover;
  -webkit-background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
}
#parallax-world-of-ugg .parallax-three {
  padding-top: 200px;
  padding-bottom: 200px;
  overflow: hidden;
  position: relative;
  width: 100%;
  background-image: url(https://cdn.r2ware.dev/legacyfoam/prod/assets-rev/foam-setup-orig.fd1be821.jpg);
  background-size: cover;
  -moz-background-size: cover;
  -webkit-background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
}
/* Extras */
/**************************/
#parallax-world-of-ugg .line-break {
  border-bottom:1px solid black;
  width: 150px;
  margin:0 auto;
}



/* Media Queries */
/**************************/
@media screen and (max-width: 959px) and (min-width: 768px) {
  #parallax-world-of-ugg .block {
    padding: 40px;
    width:620px;
  }
}
@media screen and (max-width: 767px) {
  #parallax-world-of-ugg .block {
    padding: 30px;
    width:420px;
  }
  #parallax-world-of-ugg h2 {
    font-size:30px;
  }
  #parallax-world-of-ugg .block {
    padding: 30px;
  }
  #parallax-world-of-ugg .parallax-one, #parallax-world-of-ugg .parallax-two, #parallax-world-of-ugg .parallax-three {
    padding-top:100px;
    padding-bottom:100px;
  }
}
@media screen and (max-width: 479px) {
  #parallax-world-of-ugg .block {
    padding: 30px 15px;
    width:290px;
  }
th, td {
  padding: 3px;
  font-size: 10px;
  line-height: 12px;
}

}
