/*! bulma.io v0.6.2 | MIT License | github.com/jgthms/bulma */
@font-face {
  font-family: ProximaNova-Bold;
  src: url(https://cdn.shopify.com/s/files/1/2510/5836/t/13/assets/ProximaNova-Bold.otf?12179193295937161946); }
@font-face {
  font-family: ProximaNova-Regular;
  src: url(https://cdn.shopify.com/s/files/1/2510/5836/t/13/assets/ProximaNova-Regular.otf?12179193295937161946); }
@font-face {
  font-family: ProximaNova-Light;
  src: url(https://cdn.shopify.com/s/files/1/2510/5836/t/13/assets/ProximaNova-Light.otf?12179193295937161946); }
@font-face {
  font-family: ProximaNova-Thin;
  src: url(https://cdn.shopify.com/s/files/1/2510/5836/t/13/assets/ProximaNova-Light.otf?12179193295937161946); }
h1,
h2,
h3 {
  margin: 0px;
  letter-spacing: 0.075em; }

p,
a,
input {
  margin: 0px;
  font-size: 16px;
  font-family: "ProximaNova-Light";
  line-height: 1.5em; }

h1 {
  font-size: 28px;
  font-weight: lighter;
  font-family: "ProximaNova-Thin"; }
  @media (min-width: 600px) {
    h1 {
      font-size: 40px; } }
  @media (min-width: 1200px) {
    h1 {
      font-size: 46px; } }

h2 {
  font-size: 22px;
  font-family: "ProximaNova-Bold";
  text-transform: uppercase;
  letter-spacing: 0.1em; }
  @media (min-width: 600px) {
    h2 {
      font-size: 28px; } }
  @media (min-width: 1200px) {
    h2 {
      font-size: 30px; } }

h3 {
  font-size: 14px;
  font-family: "ProximaNova-Bold";
  letter-spacing: 0; }

.text-center {
  text-align: center; }

.h-inv {
  color: #FAFAFA; }

.hstyle-1 {
  color: #191919;
  background-color: white; }

.hstyle-2 {
  color: #191919;
  background-color: #FAFAFA; }

.hstyle-3 {
  color: #FAFAFA;
  background-color: #191919; }

.hstyle-4 {
  color: #FAFAFA;
  background-color: #EE343B; }

.mt-5 {
  margin-top: 5px; }

.mt-10 {
  margin-top: 10px; }

.mt-15 {
  margin-top: 15px; }

.mt-20 {
  margin-top: 20px; }

.mt-25 {
  margin-top: 25px; }

.mt-30 {
  margin-top: 30px; }

.mt-35 {
  margin-top: 35px; }

.mt-40 {
  margin-top: 40px; }

.mt-45 {
  margin-top: 45px; }

.mt-50 {
  margin-top: 50px; }

.mb-10 {
  margin-bottom: 10px; }

.mb-15 {
  margin-bottom: 15px; }

.mb-20 {
  margin-bottom: 20px; }

.mb-25 {
  margin-bottom: 25px; }

.mb-30 {
  margin-bottom: 30px; }

.mb-35 {
  margin-bottom: 35px; }

.mb-40 {
  margin-bottom: 40px; }

.mb-45 {
  margin-bottom: 45px; }

.mb-50 {
  margin-bottom: 50px; }

.m-5 {
  margin: 5px; }

.m-10 {
  margin: 10px; }

.m-15 {
  margin: 15px; }

.m-20 {
  margin: 20px; }

.m-25 {
  margin: 25px; }

.m-30 {
  margin: 30px; }

.m-35 {
  margin: 35px; }

.m-40 {
  margin: 40px; }

.m-45 {
  margin: 45px; }

.m-50 {
  margin: 50px; }

.p-5 {
  padding: 5px; }

.p-10 {
  padding: 10px; }

.p-15 {
  padding: 15px; }

.p-20 {
  padding: 20px; }

.p-25 {
  padding: 25px; }

.p-30 {
  padding: 30px; }

.p-35 {
  padding: 35px; }

.p-40 {
  padding: 40px; }

.p-45 {
  padding: 45px; }

.p-50 {
  padding: 50px; }

.pt-5 {
  padding-top: 5px; }

.pt-10 {
  padding-top: 10px; }

.pt-15 {
  padding-top: 15px; }

.pt-20 {
  padding-top: 20px; }

.pt-25 {
  padding-top: 25px; }

.pt-30 {
  padding-top: 30px; }

.pt-35 {
  padding-top: 35px; }

.pt-40 {
  padding-top: 40px; }

.pt-45 {
  padding-top: 45px; }

.pt-50 {
  padding-top: 50px; }

.pb-5 {
  padding-bottom: 5px; }

.pb-10 {
  padding-bottom: 10px; }

.pb-15 {
  padding-bottom: 15px; }

.pb-20 {
  padding-bottom: 20px; }

.pb-25 {
  padding-bottom: 25px; }

.pb-30 {
  padding-bottom: 30px; }

.pb-35 {
  padding-bottom: 35px; }

.pb-40 {
  padding-bottom: 40px; }

.pb-45 {
  padding-bottom: 45px; }

.pb-50 {
  padding-bottom: 50px; }

.button, .button-inv, .button-hero, .button-strong {
  display: inline-block;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-family: ProximaNova-Bold;
  border-style: solid;
  border-width: 2px;
  text-decoration: none;
  vertical-align: top;
  font-size: 14px;
  padding: 6px 16px 4px 16px;
  margin: 4px auto; }
  @media (min-width: 600px) {
    .button, .button-inv, .button-hero, .button-strong {
      padding: 8px 25px;
      margin: 8px auto;
      font-size: 16px; } }

.button-small {
  font-size: 12px;
  padding: 4px 14px 2px 14px;
  margin: 4px auto; }

.button:hover {
  opacity: 1;
  color: #FAFAFA;
  background-color: #191919; }

.button-inv {
  border-color: #FAFAFA;
  color: #FAFAFA; }

.button-inv:hover {
  opacity: 1;
  color: #191919;
  background-color: white; }

.button-hero {
  vertical-align: middle;
  display: block;
  opacity: 1;
  border-color: white;
  background-color: white; }

.button-strong {
  font-family: ProximaNova-Regular;
  border-color: #EE343B;
  background-color: #EE343B;
  color: #FAFAFA; }

.button-strong:hover {
  border-color: #d62e35;
  background-color: #d62e35;
  color: #FAFAFA; }

/*# sourceMappingURL=fightcamp.css.map */
body {
  margin: 0px;
  background-color: white
}

a,
div,
img,
section {
  box-sizing: border-box;
}

.fcm-body {
  background-color: #F5F5FA;
  padding: 5px;
}

.fcm-page {
  background-color: white;
  margin: 0px auto;
  max-width: 500px;
}

.pp-header {
  margin-bottom: 20px;
}

.pp-header h2 {
  font-family: "ProximaNova-Light"
}

.pp-header p {
  text-align: justify;
  margin: 0px 10px
}

.pp-header-cover {
  height: 281px;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

.pp-header-cover-overlay {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4)
} 

.pp-header-title {
  color: white;
  text-align: center;
}

.pp-header-divider {
  width: 100px;
  border-top: 1px solid #eee;
  margin: 20px auto
}

.pp-header-subtitle {
  color: white;
  font-size: 20px;
  text-align: center;
}

.pp-workouts-day-container p {
  font-family: "ProximaNova-Regular";
  line-height: 0;
}

.pp-workouts-container {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.pp-workouts-day-container {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 65px;
  height: 65px;
  margin: 10px 0px 10px 5px;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: url('./Diamond.svg');
  flex: 0 0 65px;
}
.pp-workouts-day-container p{
  font-size:14px
}


.pp-workouts-tasks-container {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  margin: 5px;
}

.pp-workouts-task {
  display: flex;
  flex-direction: row;
  width: 100%;
  margin:2px 0px;
  justify-content: space-between;
  align-items: center;
  padding: 5px;
  background-color: #f5f5fa;
  text-decoration: none;
  color:#191919;
  cursor:pointer;
}
.pp-workouts-task-text p {
 font-size:14px;
}
.pp-workouts-task-icon {
}

.pp-section-header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  margin: 2px 4px;
  padding: 14px;
  background-color: #f5f5fa;
}

.pp-section-header-chevron  { 
   height: 16px;
   -webkit-transition:all 300ms ease-in 0s;
   -moz-transition: all 300ms ease-in 0s;
   -o-transition: all 300ms ease-in 0s;
   transition: all 300ms ease-in 0s;
}

.pp-section-header-chevron-open { 
  transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);

}

.pp-workouts-task-chevron  {
  height: 16px; 
  transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
}
.pp-workouts-task-chevron .path {
  fill:#e5e5ea;
}

.pp-section-content {
  max-height: 0;
  overflow: hidden;

  -webkit-transition:all 300ms ease-in 0s;
  -moz-transition: all 300ms ease-in 0s;
  -o-transition: all 300ms ease-in 0s;
  transition: all 300ms ease-in 0s;
}
.pp-section-content-inner {
  margin: 10px;
}
.pp-section-content-inner p{
  margin-bottom: 20px;
}
.pp-section-content-inner h3{
  margin-bottom: 20px;
  text-transform:none;
}
.pp-section-content p {
  text-align: justify;
}

.pp-workouts-header {
  text-align: center;
  padding: 30px 0px 
}

.pp-workouts-header h2 {
  font-family: "ProximaNova-Light"
}


.pp-workouts-divider {
  width: 100px;
  border-top: 1px solid #f5f5fa;
  margin: 15px auto
}

.pp-disabled {
  opacity: 0.5;
  cursor: default;
}
.pp-trainer-speak {
  margin:0px -5px;
  display: flex;
  flex-direction: row;
}
.pp-trainer-speak img{
height: 75px;
width: 75px;
border-radius: 100%;
}
.steps-container {
  display: flex;
  flex-direction: column;
  background-color: white;
}

.light-background {
  background-color: #f5f5fa
}

.step-section {
  width: 100%;
}

.step-box {
  display: flex;
  flex-direction: row;
  width: 100%;
  max-width: 500px;
  margin: 0 auto;
}

.step-box-centered {
  display: flex;
  justify-content: center;
  text-align: center;
  flex-direction: column;
  width: 100%;
  padding: 20px;
  align-content: space-around;
  max-width: 500px;
  margin: 0 auto;
}

.step-box-centered h3 {
  padding: 20px 0px;
  text-transform: none;
}

.step-box-title-container {
  display: flex;
  flex-direction: column;
  padding: 30px 20px;
  justify-content: flex-end;
  text-align: right;
  max-width: 500px;
  margin: 0px auto;
}

.step-box-text-container {
  width: 50%;
  display: flex;
  flex-direction: column;
  text-align: center;
  align-items: center;
  justify-content: top;
  padding: 20px 10px 20px 10px;
}

.step-box-text-container-2 {
  text-align: center;
  padding: 30px 20px;
}

.step-box-img-container {
  display: flex;
  flex-direction: row;
  width: 50%;
  align-items: flex-end;
  margin: 0px 10px;
}

.step-box-img-container img {
  width: 100%;
  max-height: 100%;
}

.step-box-icon {
  width: 75px;
  height: 75px;
  margin: 5px;
  object-fit: contain;
}

.step-button-container {
  margin: 20px;
}

.step-button {
  padding: 15px 40px;
  background-color: #FF3C3C;
  color: white;
  text-decoration: none;
  border-radius: 50px;
  font-size: 20px;
  font-family: "ProximaNova-Bold";
}

/* ============================================================================================================================
== BUBBLE WITH A BORDER AND TRIANGLE
** ============================================================================================================================ */

/* THE SPEECH BUBBLE
------------------------------------------------------------------------------------------------------------------------------- */

.triangle-border {
  position:relative;
  padding:10px;
  margin: 0 ;
  border:2px solid #e5e5ea;
  color:#333;
  background:#fff;
  /* css3 */
  -webkit-border-radius:10px;
  -moz-border-radius:10px;
  border-radius:10px;
}

/* Variant : for left positioned triangle
------------------------------------------ */

.triangle-border.left {
  margin-left:30px;
}

/* Variant : for right positioned triangle
------------------------------------------ */

.triangle-border.right {
  margin-right:30px;
}

/* THE TRIANGLE
------------------------------------------------------------------------------------------------------------------------------- */

.triangle-border:before {
  content:"";
  position:absolute;
  bottom:-20px; /* value = - border-top-width - border-bottom-width */
  left:40px; /* controls horizontal position */
  border-width:20px 20px 0;
  border-style:solid;
  border-color:#F5f5fa transparent;
  /* reduce the damage in FF3.0 */
  display:block;
  width:0;
}

/* creates the smaller  triangle */
.triangle-border:after {
  content:"";
  position:absolute;
  bottom:-13px; /* value = - border-top-width - border-bottom-width */
  left:47px; /* value = (:before left) + (:before border-left) - (:after border-left) */
  border-width:13px 13px 0;
  border-style:solid;
  border-color:#fff transparent;
  /* reduce the damage in FF3.0 */
  display:block;
  width:0;
}

/* Variant : top
------------------------------------------ */

/* creates the larger triangle */
.triangle-border.top:before {
  top:-20px; /* value = - border-top-width - border-bottom-width */
  bottom:auto;
  left:auto;
  right:40px; /* controls horizontal position */
  border-width:0 20px 20px;
}

/* creates the smaller  triangle */
.triangle-border.top:after {
  top:-13px; /* value = - border-top-width - border-bottom-width */
  bottom:auto;
  left:auto;
  right:47px; /* value = (:before right) + (:before border-right) - (:after border-right) */
  border-width:0 13px 13px;
}

/* Variant : left
------------------------------------------ */

/* creates the larger triangle */
.triangle-border.left:before {
  top:14px; /* controls vertical position */
  bottom:auto;
  left:-22px; /* value = - border-left-width - border-right-width */
  border-width:11px 22px 11px 0;
  border-color:transparent #e5e5ea;
}

/* creates the smaller  triangle */
.triangle-border.left:after {
  top:16px; /* value = (:before top) + (:before border-top) - (:after border-top) */
  bottom:auto;
  left:-18px; /* value = - border-left-width - border-right-width */
  border-width:9px 18px 9px 0;
  border-color:transparent #fff;
}

/* Variant : right
------------------------------------------ */

/* creates the larger triangle */
.triangle-border.right:before {
  top:10px; /* controls vertical position */
  bottom:auto;
  left:auto;
  right:-30px; /* value = - border-left-width - border-right-width */
  border-width:15px 0 15px 30px;
  border-color:transparent #5a8f00;
}

/* creates the smaller  triangle */
.triangle-border.right:after {
  top:16px; /* value = (:before top) + (:before border-top) - (:after border-top) */
  bottom:auto;
  left:auto;
  right:-21px; /* value = - border-left-width - border-right-width */
  border-width:9px 0 9px 21px;
  border-color:transparent #fff;
}