/* RWD FULLPAGE.JS NAVIGATION --------------------------------------------------------------------------------*/
#rwd-side-nav {
  position: fixed;
  z-index: 100;
  opacity: 1;
  right: 4em;
  top: 50%;
  height: 9em;
  margin-top: -4.5em;
}

#rwd-side-nav li {
  display: block;
  width: 2em;
  height: 1.5em;
  position: relative;
  list-style:none; 
}

#rwd-side-nav li a {
  width: 100%;
  height: 100%;
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
}

#rwd-side-nav li a div {
  width: 30%;
  height: 3px;
  background-color: white;
  transition: all 0.25s ease;
}

#rwd-side-nav li a:hover div {
  width: 60%;
}

#rwd-side-nav li.active a div {
  width: 60%;
  background-color: #c44fff;
}



/* RWD LAYOUT --------------------------------------------------------------------------------*/
.rwdSection {
  width: 100%;
  min-height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  align-content: center;
  overflow: hidden;
  flex-wrap: wrap;
}

.rwdRow {
  display: flex;
  max-width: 1400px;
  position: relative;
  width: 100%;
  justify-content: space-between;
  flex-wrap: wrap;
  overflow: hidden;
}

.rwdRow.clear {
  background-color: transparent;
}

.rwdRowReverse {
  flex-direction: row-reverse;
}

.rwdColumn {
  display: flex;
  width: 100%;
  height: auto;
  flex-wrap: wrap;
  align-content: center;
}

.rwdElement {
  width: 100%;
}

@media screen and (max-width: 1400px) {
  .rwdSection {
    padding: 4rem 4rem;
    align-items: start;
    min-height: 0px;
  }
}

@media screen and (max-width: 1024px) {
  .rwdSection {
    padding: 3rem 2rem;
  }
}

@media screen and (max-width: 768px) {
  .rwdSection {
    padding: 2rem 1rem;
  }
}

@media screen and (max-width: 360px) {
  .rwdSection {
    padding: 2rem .5rem;
  }
}

/* RWD FONTS --------------------------------------------------------------------------------*/
.rwdFontH1 {
  font-size: 4rem;
  font-family: proxima-nova, sans-serif;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: 0.1px;
  color: #fff;
}

.rwdFontH4 {
  font-size: 2.4rem;
  font-family: proxima-nova, sans-serif;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  color: #212121;
}

.rwdFontH5 {
  padding-right: .8rem;
  text-decoration: none;
  font-size: 1rem;
  font-family: proxima-nova, sans-serif;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  color: #fff;
  letter-spacing: .5px;
}

.rwdFontH6 {
  font-size: .8rem;
  font-family: proxima-nova, sans-serif;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

.rwdFontButton {
  padding-right: .8rem;
  text-align: left;
  text-decoration: none;
  font-size: 1rem;
  font-family: proxima-nova, sans-serif;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: .5px;
}

.rwdFontH7 {
  font-size: .8rem;
  font-family: proxima-nova, sans-serif;
  font-style: normal;
  font-weight: 700;
  line-height: 0;
}

.rwdFontList {
  font-size: 16px;
  font-family: proxima-nova, sans-serif;
  font-style: normal;
  font-weight: normal;
  line-height: 0;
  letter-spacing: .5px;
}

.rwdFontP {
  font-size: .7rem;
  font-family: proxima-nova, sans-serif;
  font-style: normal;
  font-weight: normal;
  line-height: 1.2rem;
  letter-spacing: .5px;
  color: black;
}

a.linkSimple {
  color: #212121;
  text-decoration: underline;
}

a.linkSimple:hover {
  color: #970cc2;
}

@media screen and (max-width: 1400px) {
}

@media screen and (max-width: 1024px) {
}

@media screen and (max-width: 768px) {
  .rwdFontH1 {
    font-size: 3.2rem;
  }
  .rwdFontH4 {
    font-size: 2rem;
  }
  .rwdFontButton {
    font-size: .9rem;
  }
}

@media screen and (max-width: 375px) {
  .rwdFontH1 {
    font-size: 2.5rem;
    line-height: 1;
  }
  .rwdFontH4 {
    font-size: 1.5rem;
  }
  .rwdFontButton {
    font-size: .8rem;
  }
}


/* RWD FOOTER --------------------------------------------------------------------------------*/
.rwdFooter ul {
 list-style: none; 
  padding: 0;
}

.rwdFooterTop {
  padding-top: 3rem;
  width: 100%;
}

.rwdFooterTop ul {
  list-style: none; 
  padding: 0;
}

.rwdFooterBottom {
  width: 100%;
}

.rwdFooterHiring {
	padding-bottom: 2rem;
}

.rwdFooterLinks {
	padding-top: 1rem;
}

.footerBottom {
  width: 100%;
  display: flex;
  grid-auto-rows: auto;
  flex-flow: row wrap;
  justify-content: space-between;
}

.footerBottomText {
  padding: 2rem 0;
}

.rwdFooterLinks .rwdColumn {
  width: auto;
  display: block;
}

.rwdFooter .rwdFontH7 {
	color: #212121;
}

.rwdFooter.dark .rwdFontH7 {
	color: #fff;
}

.rwdFooter .rwdFontList {
	color: #212121;
}

.rwdFooter.dark .rwdFontList {
	color: #fff;
}

.rwdFooter.dark a.linkSimple {
  color: #fff;
}

.rwdFooter.dark a.linkSimple:hover {
  color: #970cc2;
}

.rwdFooter .rwdFontH7 {
	display: flex;
	height: 20px;
	width: 100%;
	align-items: center;
}

/*
.rwdFooter .rwdRow {
	max-width: inherit;
	padding: 0 3.5rem;
}

@media screen and (max-width: 1400px) {
  .rwdFooter .rwdRow {
    padding: 0 3.5rem;
  }
}

@media screen and (max-width: 1024px) {
  .rwdFooter .rwdRow {
    padding: 0 2rem;
  }
}

@media screen and (max-width: 768px) {
  .rwdFooter .rwdRow {
    padding: 0 1rem;
  }
	.rwdFooter .rwdColumn {
    width: 50%;
    padding-bottom: 1.5rem;
  }
}

@media screen and (max-width: 360px) {
  .rwdFooter .rwdRow {
    padding: 0 .5rem;
  }
	.rwdFooter .rwdColumn {
    width: 100%;
  }
}
*/


/* RWD BUTTON--------------------------------------------------------------------------------*/

.button {
  background: linear-gradient(115deg, #8725e8, #d525e8);
  transition: padding .4s ease-in-out;
  border: none;
  border-radius: 0px;
  padding: .8rem 1.5rem;
  display: flex;
  align-content: center;
  justify-content: start;
}

.button .rwdFontButton {
  color: #fff;
}

.button.secondary {
  background: linear-gradient(115deg, #ebebeb, #ebebeb);
}

.button.secondary .rwdFontButton {
  color: #212121;
}

a:hover .button {
  background: linear-gradient(115deg, #8725e8, #d525e8);
}

a:hover .buttonText {
  color: white;
}

a:hover .button.secondary {
  background: linear-gradient(115deg, #ebebeb, #ebebeb);
}
  
#animatedArrow {
  width: 20px;
  height: auto;
  min-height: 20px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  opacity: 1;
  position: relative;
  transition: all 300ms cubic-bezier(.23, 1, .32, 1);
}

#animatedArrow .line {
  width: 100%;
  height: 3px;
  margin: 5px 0;
  position: relative;
  border-radius: 10px;
  background-color: #fff;
}
  
#animatedArrow .square {
  width: 1px;
  height: 20px;
  border: solid #fff;
  border-width: 0 3px 0px 0;
  transform: rotate(0deg);
  position: absolute;
}

.button.secondary #animatedArrow .line {
  background-color: #212121;
}

.button.secondary #animatedArrow .square {
  border: solid #212121;
  border-width: 0 3px 0px 0;
}

a:hover #animatedArrow .line {
  background-color: #fff;
}

a:hover #animatedArrow .square {
  width: 15px;
  height: 15px;
  right: 0;
  border: solid #ffffff;
  border-width: 0 3px 3px 0;
  transform: rotate(-45deg);
}

a:hover #animatedArrow {
  width: 40px;
}

a:hover .button.secondary #animatedArrow .line {
  background-color: #212121;
}

a:hover .button.secondary #animatedArrow .square {
  border: solid #212121;
  border-width: 0 3px 3px 0;
  transform: rotate(-45deg);
}

a:hover .button.secondary .buttonText {
  color: #212121;
}

.buttonWrapper {
  display: flex;
  width: max-content;
  padding-bottom: 1rem;
}

.buttonWrapper.noPadding {
  padding-bottom: 0;
}

@media screen and (max-width: 375px) {
  .buttonWrapper {
    padding-bottom: .5rem;
  }
}