body {
  background: tomato;
  color: #ffb9ad;
}
 
.quicksand{
  font-family: "Quicksand", sans-serif;
}

.raleway{
  font-family: "Raleway",  sans-serif;
}

h1,h2,h3,h4,h5,h6{ 
  font-family: "Raleway",  sans-serif;
}

p {  
  font-family: "Quicksand", sans-serif; 
}

ul { list-style-type: square; }

.bold{  
  font-weight: 700;
  font-style: bold;
}

.uppercase{ 
  text-transform:uppercase; 
}

.tomato{
  background-color:tomato;
}


.text-tomato{
  color:tomato;
}

.transition-ease{
    transition: all 500ms ease-in-out;
}

.accent-green{
 color: #47FFAC
}

.accent-blue{
 color: #4774FF
}

.text-tomato-light{
  color:#ffb9ad;
}
.border-1{
  border: 1px solid #ffb9ad;
}
.border-2{
  border: 2px solid #ffb9ad;
}
.border-3{
  border: 3px solid #ffb9ad;
}
.border-4{
  border: 4px solid #ffb9ad;
}
.border-rounded-1{
  border: 1px solid #ffb9ad;
  border-radius:16px;
}
.rounded-corners{
  border-radius:16px;
}

.sticky{
  position:sticky;
  top:0;
  left:0;
}

.tilt{
  display: inline-block;
   transform: rotate(-2deg);
  transform-style: preserve-3d;
}

/* woven border element */
.weave {
  display: block;
  width: 120px;
  height: 120px;
  border: 4px solid #ffb9ad;
  border-radius: 36px;
  margin: 40px auto 0 auto;
  position: relative;
  color: #ffb9ad;
  text-align: center;
  font: 700 21px "Quicksand", sans-serif;
  line-height: 21px;
  padding-top:10px;

}
.weave:before, .weave:after {
  display: block;
  width: 120px;
  height: 120px;
  border: 4px solid #ffb9ad;
  border-radius: 36px;
  content: "";
  position: absolute;
  top: -4px;
  left: -4px;
}
.weave:before {
  -moz-transform: rotate(30deg);
  -ms-transform: rotate(30deg);
  -webkit-transform: rotate(30deg);
  transform: rotate(30deg);
}
.weave:after {
  -moz-transform: rotate(60deg);
  -ms-transform: rotate(60deg);
  -webkit-transform: rotate(60deg);
  transform: rotate(60deg);
}

 

.fit-content{
  width:fit-content;
}

.shake:hover {
  animation: tilt-n-move-shaking 0.15s ;
  animation-iteration-count: 2;
}

/*utility padding & margins */
.padding-min{ padding:2px  !important} 
.margin-0-auto{ margin:0px auto }
.margin-none{ margin:0 !important }
.padding-none{ padding: 0 !important }
.margin-0{ margin:0  !important} 
.margin-right-0{ margin-right:0  !important}
.margin-left-0{ margin-left:0  !important}
.margin-top-0{ margin-top:0  !important}
.margin-bottom-0{ margin-bottom:0  !important}
.padding-0{ padding:0  !important} 
.padding-right-0{ padding-right:0  !important}
.padding-left-0{ padding-left:0 !important }
.padding-top-0{ padding-top:0 !important }
.padding-bottom-0{ padding-bottom:0  !important}
.margin-1{ margin:1rem !important } 
.margin-right-1{ margin-right:1rem !important }
.margin-left-1{ margin-left:1rem !important }
.margin-top-1{ margin-top:1rem !important }
.margin-bottom-1{ margin-bottom:1rem !important }
.padding-1{ padding:1rem !important } 
.padding-right-1{ padding-right:1rem !important }
.padding-left-1{ padding-left:1rem !important }
.padding-top-1{ padding-top:1rem !important }
.padding-bottom-1{ padding-bottom:1rem !important }
.margin-2{ margin:2rem !important } 
.margin-right-2{ margin-right:2rem !important }
.margin-left-2{ margin-left:2rem !important }
.margin-top-2{ margin-top:2rem !important }
.margin-bottom-2{ margin-bottom:2rem !important }
.padding-2{ padding:2rem !important } 
.padding-right-2{ padding-right:2rem !important }
.padding-left-2{ padding-left:2rem !important }
.padding-top-2{ padding-top:2rem !important }
.padding-bottom-2{ padding-bottom:2rem !important }
.margin-3{ margin:3rem !important } 
.margin-right-3{ margin-right:3rem !important }
.margin-left-3{ margin-left:3rem !important }
.margin-top-3{ margin-top:3rem !important }
.margin-bottom-3{ margin-bottom:3rem !important }
.padding-3{ padding:3rem !important } 
.padding-right-3{ padding-right:3rem !important }
.padding-left-3{ padding-left:3rem !important }
.padding-top-3{ padding-top:3rem !important }
.padding-bottom-3{ padding-bottom:3rem !important }
.margin-4{ margin:4rem !important } 
.margin-right-4{ margin-right:4rem !important }
.margin-left-4{ margin-left:4rem !important }
.margin-top-4{ margin-top:4rem !important }
.margin-bottom-4{ margin-bottom:4rem !important }
.padding-4{ padding:4rem !important } 
.padding-right-4{ padding-right:4rem !important }
.padding-left-4{ padding-left:4rem !important }
.padding-top-4{ padding-top:4rem !important }
.padding-bottom-4{ padding-bottom:4rem !important }
.margin-5{ margin:5rem !important } 
.margin-right-5{ margin-right:5rem !important }
.margin-left-5{ margin-left:5rem !important }
.margin-top-5{ margin-top:5rem !important }
.margin-bottom-5{ margin-bottom:5rem !important }
.padding-5{ padding:5rem !important } 
.padding-right-5{ padding-right:5rem !important }
.padding-left-5{ padding-left:5rem !important }
.padding-top-5{ padding-top:5rem !important }
.padding-bottom-5{ padding-bottom:5rem !important }

/* keyframes */

@keyframes tilt-n-move-shaking {
  0% { transform: translate(0, 0) rotate(0deg); }
  25% { transform: translate(2px, 2px) rotate(2deg); }
  50% { transform: translate(0, 0) rotate(0eg); }
  75% { transform: translate(-2px, 2px) rotate(-2deg); }
  100% { transform: translate(0, 0) rotate(0deg); }
}