* {
  margin: 0;
  padding: 0;
  border: 0;
}
h1 {
  font-size: 2.2em;
}
h2 {
  font-size: 2em;
}
h3 {
  font-size: 1.8em;
}
h4 {
  font-size: 1.6em;
}
h5 {
  font-size: 1.4em;
}
p {
  font-size: 16px;
}

html {
  height: 100vh;
}
body {
  font-family: myriad-pro;
}


.white { color: #ffffff; }
.orange { color: #f47d4c; }
.grey { color: #4b4846; }
.background-grey { background-color: #4b4846 !important; }
.background-white { background-color: #ffffff !important; }
.background-orange { background-color: #F47D4C !important; }
.semibold {font-family: myriad-pro; font-weight:600;}
.bold { font-family: myriad-pro; font-weight:700; }
.p-bottom { padding-bottom: 2rem!important;}
.heading span {
  font-family: myriad-pro;
  font-style: italic;
  letter-spacing: 1.6pt;
}
.heading h1 span {
  font-style:normal;
  letter-spacing:inherit;
  display:inline-block;
}
.heading h1 span.position-absolute {
  right:-10px;
}
a.button {
    background-color: #f47d4c;
    border: 1px solid #f47d4c;
    padding: 16px 29px;
    border-radius: 10px;
    color:#ffffff;
    display: flex;
    align-items: center;
    text-transform:uppercase;
    font-size: 14px;
    line-height:14px;
    letter-spacing:1.5px;
    -webkit-transition:all 0.15s ease-in;  
    -moz-transition:all 0.15s ease-in;  
    -o-transition:all 0.15s ease-in;  
    transition:all 0.15s ease-in;
    text-decoration:none;
    width: max-content;
    position:relative;
    z-index:4;
    padding-left: 33px;
    padding-bottom:17px;
}
/* a.button:hover {
    background-color: #4b4846;
    color:#f47d4c;
} */
a.button i {
    font-family: FontAwesome;
    font-style:normal;
    margin-left: 4px;
    margin-top:2px;
    font-size:9px;
    line-height:9px;
}

footer {
    bottom:20px;
    left:0;
    right:0;
    text-align:center;
    letter-spacing:5px;
    font-size:12px;
}
footer svg {
  width:auto;
  max-width: 220px;
}
#home footer {
  bottom:0;
  position:fixed;
}
nav {
  position:fixed;
  top:0;
  width:100%;
  z-index:10;
  background-color: #ffffff;
  height:74px;
}
nav img, nav svg {
    width: 52px;
    position: absolute;
    right: 10px;
    top: 10px;
    z-index: 2;
}

#home nav { background-color: transparent; }
#menuToggle {
  display: block;
  position: relative;
  top: 23px;
  padding-left: 18px;
  left:0;
  z-index: 1;
  -webkit-user-select: none;
  user-select: none;
}

#menuToggle a {
  text-decoration: none;
  color: #ffffff;
  transition: color 0.3s ease;
  width: 100%;
  display: block;
  font-weight:300;
  font-family: myriad-pro;
}

#menuToggle a:hover {
  color: #f47d4c;
}

#menuToggle input {
  display: block;
  width: 40px;
  height: 32px;
  position: absolute;
  top: -7px;
  left: 14px;
  cursor: pointer;
  opacity: 0; 
  z-index: 2; 
  -webkit-touch-callout: none;
}
#menuToggle input.active ~ span {
  background: #ffffff !important;
}

#menuToggle span {
  display: block;
  width: 33px;
  height: 4px;
  margin-bottom: 7px;
  position: relative;
  background: #ffffff;
  border-radius: 3px;
  z-index: 1;
  transform-origin: 4px 0px;
  transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1),
    background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1), opacity 0.55s ease;
}
#meet-camila #menuToggle span, #about-dc #menuToggle span, #connect-page #menuToggle span { 
  background: #4b4846;
}

#menuToggle span:first-child {
  transform-origin: 0% 0%;
}

#menuToggle span:nth-last-child(2) {
  transform-origin: 0% 100%;
}

#menuToggle input:checked ~ span {
  opacity: 1;
  transform: rotate(45deg) translate(-2px, -1px);
}

#menuToggle input:checked ~ span:nth-last-child(3) {
  opacity: 0;
  transform: rotate(0deg) scale(0.2, 0.2);
}

#menuToggle input:checked ~ span:nth-last-child(2) {
  transform: rotate(-45deg) translate(3px, -3px);
}

#menu {
  position: absolute;
  width: 100%;
  height:100vh;
  margin: -56px 0 0 -18px;
  padding: 16px;
  padding-top: 125px;
  background: #4b4846;
  list-style-type: none;
  -webkit-font-smoothing: antialiased;
  transform-origin: 0% 0%;
  transform: translate(-100%, 0);
  transition: transform 0.3s cubic-bezier(0.77, 0.2, 0.05, 1);
  overflow-x:hidden
}

#menu li {
  padding: 30px 0;
  font-size: 32px;
  border-bottom: 1px solid #f47d4c;
}
#menu a:after {
    content:"\f105";
    font-family:FontAwesome;
    position:absolute;
    right:15px;
}
#menu a:last-child li {
  border-bottom: none;
}

#menuToggle input:checked ~ ul {
  transform: none;
}

#landingPage h1 {
  font-size: 24px;
  line-height: 1;
  padding-top: 30px;
  letter-spacing: 0.4px;
}
body#landingPage,
body#home {
  background: no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  background-position: 80%;
  height:100vh;
  width:100%;
  overflow:hidden;
  position:relative;
}
.landingPage_content-wrapper {
  position: relative;
  top: 50%;
  left: 50%;
  width: 100%;
  transform: translate(-50%, -50%);
}
.landingPage_content-wrapper img.main-text {
  width: 100%;
  max-width: 360px;
  margin-top: 10px;
  margin-bottom: 68px;
}
.landingPage_content-wrapper .subtext {
  font-size: 18px;
  line-height: 27px;
  letter-spacing: 4.8px;
}
.landingPage_content-wrapper img.stamp {
  position: absolute;
  right: 11%;
  width: 112px;
  z-index:0;
}

#home #content {
  height: 100vh;
  width: 100%;
  overflow: hidden;
  position: relative;
  -webkit-transition:all 1.5s ease-in-out;  
  -moz-transition:all 1.5s ease-in-out;  
  -o-transition:all 1.5s ease-in-out;  
  transition:all 1.5s ease-in-out;
}
#home #splash {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index:100;
  -webkit-transition:all 1.5s ease-in-out;  
  -moz-transition:all 1.5s ease-in-out;  
  -o-transition:all 1.5s ease-in-out;  
  transition:all 1.5s ease-in-out;
  width:100%;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  #home #splash {
    top:45%;
  }
}

body#home {
  background-position: 75%;
}

#about-dc main a {
  color:#f47d4c;
}
#about-dc .left { width:100%; }
#about-dc .main-image {
  width:100%;
  margin: 0 auto;
  padding-bottom:10px;
  padding-top:32px;
  text-align: center;
}
#about-dc .main-image img { 
  position: relative;
  width:100%;
}
#about-dc .main-image svg { 
  width:90%;
  margin:0 auto;
  position: relative;
  height: auto;
}

#meet-camila main, #about-dc main {
  margin-top:84px;
}
#meet-camila .main-image { 
  padding-top:32px;
  margin: 0 auto;
  position:relative;
} 
#meet-camila .left {
  width:100%;
  padding-left:25px;
  padding-right:25px;
}
#meet-camila .main-image img { 
  width:92%;
  margin:0 auto;
  position: relative;
  bottom: -3px;
  left:12px;
}
#meet-camila .main-image svg { 
  margin: 0 auto;
  position: relative;
  width: 95%;
  height: auto;
  bottom: -2px;
  display: flex;
}

@media (min-width: 768px) {
  #meet-camila .row .left, #about-dc .row .left { 
    position:fixed; 
    width: inherit;
  }
  #meet-camila .row .left .main-image img { 
    width:auto;
    position:absolute;
    height:480px;
    right:0;
    left:auto;
    bottom: auto;
   }
  #meet-camila .main-image svg {
    position: absolute;
    right: 30px;
    top: 45px;
    width: auto;
    height: 520px;
  }
  #about-dc .main-image svg { 
    width: 90%;
    max-width: 340px;
    height:auto;
    top:32px;
  }
}
@media (min-width: 768px) {
  .container, .container-md, .container-sm {
    max-width: 100%;
  }
}
@media (min-width: 1200px) {
  .container, .container-lg, .container-md, .container-sm, .container-xl {
      max-width: 100%;
  }

}
@media (min-width: 1400px) {
  .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
    max-width: 1700px;
  }
  #meet-camila .main-image svg { 
    width:100%; 
    height:auto; 
    position:unset;
  }
}
@media only screen and (min-width: 1400px) {
  #meet-camila .main-image svg {
    right: 30px;
    top: 45px;
    /* position: absolute; */
    /* width: auto;
    height: 520px; */
  }
}
#meet-camila h1, #about-dc h1, #connect-page h1 {
  font-size: 44px; 
  letter-spacing:4.4pt; 
  line-height:44px;
  font-family: myriad-pro;
  font-weight:700;
}

#meet-camila h2, #about-dc h2 { 
  font-family: myriad-pro;
  font-weight:700;
  font-size:28px;
  line-height:30px; 
}

.grey-block {
  border-radius:15px;
  margin-bottom:10px;
  padding: 30px;
  padding-bottom:14px;
  position:relative;
}
.grey-block i.fas {
  font-family: FontAwesome;
  font-style: normal;
  color: #f47d4c;
  padding: 0 3px;
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: #4B4846;
}
.grey-block hr {
  background-color: #f47d4c;
  height: 1px;
  opacity: 1;
}
.grey-block p {
  font-size:16px;
  line-height:20px;
  padding-right:16px;
  margin-bottom: 0px;
  padding-bottom: 16px;
}
.grey-block span.bolditalic {
  font-family: myriad-pro;
  font-weight:700;
  font-style:italic;
}
.grey-block .desktop { display:none; }
.grey-block .mobile { display:block; }

.banner-badge {
  width: fit-content;
  border-radius: 8px;
  padding: 2px;
  background-color: #ffffff;
  margin: 0 auto;
}
/* .banner-badge__inner {
  border: 1px solid #4B4846;
  padding:1px;
  border-radius: 8px;
} */
.banner-badge__inner-left {
  display: flex;
  align-items: center;
  /* padding: 16px;
  border: 2px solid #4B4846;
  border-radius: 6px; */
}
.banner-badge__inner-left svg, .banner-badge__inner-left img {
  overflow:initial;
  width: 144px;
  height: 144px;
}
.ectp-block {
  width: 42px;
  min-width: 42px;
  background-color: #4b4846;
  border-left: 1px solid #4B4846;
  margin-left: 1px;
  display: flex;
  align-items:center;
  justify-content: center;
}
.ectp-block img {
  align-self:center;
  width: 16px;
}
.banner-badge__text {
  border-right: 3px solid #4B4846;
  width: 100%;
  letter-spacing:5px;
  font-size: 12px;
  line-height: 15px;
  padding-top:15px;
  padding-left:10px;
  padding-right:10px; 
  text-align: left;
  overflow: hidden;
  flex-wrap: wrap;
  justify-content: center;
  z-index:1;
}

.banner-badge__text .text { 
  display:inline-block
}
.banner-badge__text .text .position-absolute { 
  right:-13px;
}

.banner-badge__inner-right {
  width:18px;
}
.banner-badge__inner-right svg {
  transform:scale(1.05);
}

#connect-page main { padding-top:70px; }
#connect-page nav { background-color:transparent; }
#connect-page footer { 
  bottom:0;
}
#connect-page { 
  background: no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  background-position: 75%;
  width:100%;
  overflow:auto;
  height:100%;
  position:relative;

}
#connect-page h1.orange span {
  right:-10px;
}
@media only screen and (min-height: 800px) {
  #connect-page footer { position:absolute; }
  #connect-page { overflow:visible;}
}
@media only screen and (min-width: 361px) {
  #connect-page main { padding-top:95px; }
}
@media only screen and (min-width: 380px) {
  .banner-badge__text {
    letter-spacing:6px;
    display: flex;
  }
}


.formFooter { display:none !important; }


span.reg {
  font-family: myriad-pro, sans-serif;
}
.opacity-0 {opacity:0;}
.opacity-1 {opacity:1;}

.fade-in {animation: fade-in 2s forwards;}
.fade-out {animation: fade-out 1s forwards;}

.splash-panel { 
  opacity:0;
  text-align: center;
  color: #ffffff;
}

.splash-panel .top-text {
    font-size: 20px;
    letter-spacing: 8px;
    line-height: 32px;
    margin-left:8px;
}
.splash-panel .bottom-text {
    font-size: 36px;
    font-family: myriad-pro;
    font-weight:700;
    letter-spacing: 8px;
    line-height: 36px;
    margin-left:8px;
}


@keyframes fade-in {
  0% { opacity:0; }
  100% { opacity:1; }
}
@keyframes fade-out {
  0% { opacity:1; }
  100% { opacity:0; }
}

@media only screen and (min-width: 321px) {
  .landingPage_content-wrapper img.main-text {
    width: auto;
  }
  .splash-panel .top-text {
    font-size: 28px;
    letter-spacing: 10px;
    line-height: 40px;
  }
  .splash-panel .bottom-text {
      font-size: 44px;
      letter-spacing: 8px;
      line-height: 55px;
  }
  #about-dc h1 {
    padding-left: 20px;
    padding-right: 20px;
  }
  .banner-badge__text {
    font-size: 18px;
    line-height: 18px;
    padding-top:11px;
  }
}

@media only screen and (min-width: 480px) {
  a.button {
    position:unset;
  }
  .landingPage_content-wrapper {
    max-width: 400px;
    top:40%;
    left:40%;
  }
  .landingPage_content-wrapper img.stamp {
    right: 0;
    margin-top:60px;
  }
  .splash-panel .top-text {
    font-size: 40px;
    letter-spacing: 12px;
    line-height: 56px;
  }
  .splash-panel .bottom-text {
      font-size: 63px;
      line-height: 63px;
      letter-spacing: 10px;
  }
}

@media only screen and (min-width: 634px) { 
  .banner-badge__text {
    justify-content: center;
    padding-left:20px;
    padding-right:20px;
    padding-top:25px;
    font-size:20px;
    line-height:20px;
  }
  .banner-badge__text .text {
    display: flex;
  }
}

@media only screen and (max-width: 992px) and (min-width:768px) { 
  #about-dc h1 { 
    font-size:40px;
    letter-spacing:4px;
  }
}

@media only screen and (max-height: 568px) { 
  #menu li {
    padding: 10px 0;
  }
  #menu { 
    padding-top:80px;
  }
}

@media only screen and (min-width: 768px) {
  .grey-block .desktop { display:block; }
  .grey-block .mobile { display:none; }
  #landingPage h1 {
    font-size: 56px;
    padding-top: 64px;
  }
  #about-dc h1 {
    padding-left: 0px;
    padding-right: 0px;
  }
  .landingPage_content-wrapper img {
    width: 197px;
  }
  #about-dc .heading {
    max-width: 428px;
    margin: 0 auto;
  }
  .banner-badge__text .text {
    display: inline-block;
  }
  .banner-badge__text {
    padding-top:8px;
  }
}

@media only screen and (min-width: 968px) {
  body.position-fixed main {
    padding-right:33px !important;
  }
  body.position-fixed nav img { right: 33px; }
  body#connect-page.position-fixed nav img { right: 16px; }
  body#home.position-fixed nav img { right: 16px; }

  #menu li {
    width: 100%;
    max-width: 800px;
    margin: 0 auto;
    position: relative;
  }
  #menu {
    padding-top:180px;
  }
  .banner-badge__text .text {
    display: flex;
  }
  .banner-badge__text {
    padding-top:25px;
  }
}

@media only screen and (min-width: 1024px) {
  #connect-page.position-fixed main > .col-12 {
    margin-left: 8px;
  }
}
@media only screen and (min-width: 1120px) {
  .banner-badge__text {
    font-size:28px;
    line-height:30px;
    padding-top:21px;
  }
  .banner-badge__text .text .position-absolute { 
    right:-19px;
  }
}

@media only screen and (min-width: 1655px) {
  body {
    background-size: 100% auto;
  }
}

@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: landscape) {
  html {
    height: 100vh;
  }
  #landingPage h1 {
    font-size: 24px;
    padding-top: 30px;
  }
  .landingPage_content-wrapper img {
    width: 100px;
  }
  .landingPage_content-wrapper {
    top: 50%;
  }
  .landingPage_content-wrapper img.main-text {
    margin-bottom:40px;
  }
  #menu {
    padding-left:40px;
  }
  #home #splash {
    top:60% !important;
  }
#meet-camila .row .left, #about-dc .row .left {
  position:inherit;
  width:auto;
}

}

@supports (-webkit-touch-callout: none) {
  #home #splash { 
    padding-bottom:75px;
    top:50%;
  }
}
