.general-container {
 
}

.general-container p {
  margin-top: 1em;
}

.top-frame p {
  margin-top: 0.6em;
}

.frame28-container {
	font-family: "Raleway-Regular", Helvetica;
	font-weight: 400;
	letter-spacing: 0;
	line-height: normal;
	font-size: 18px;
}

.bg-layer {
	border-radius: 849px;
	background: var(--Colours-Secarma-purple-web-light, #FCE7FF);
	filter: blur(200px);	
	width: 849px;
	height: 849px;
	flex-shrink: 0;
	position: absolute;
	z-index: -1;
	top: -10%;
	left: -10%;
}

.bg-layer-2 {
	top: 50%;
	left: 50%;
}

.flex-100 {
	flex: 1 0 0;
}

.footer-container {
  border-radius: 16px 16px 0px 0px;
  background: var(--Colours-Secarma-purple-600, #75257F);
  font-family: "Space Grotesk", Helvetica;
}

.rounded-contact-area {
	border-radius: 16px;
	border: 1px solid var(--Colours-Secarma-purple-400, #B25DBC);
	background: rgba(252, 231, 255, 0.80);
	backdrop-filter: blur(20px);
}

.rounded-card {
	border-radius: 16px;
}

.rounded-card-sm {
 border-radius: 8px;
}

.bg-secarma-purple-700 {
  background: #5D1466;
}

.secarma-purple-700 {
  color: #5D1466;
}

.secarma-purple-100 {
  color: #FDEFFF;
}


.bg-secarma-purple-700 {
  background: #5D1466;
}

.bg-secarma-teal-web {
  background: #00D4CD;
}

/** colours **/

.border-colours-secarma-purple-900 {
  border-color: #300336;
}

.border-colours-secarma-purple-700 {
  border-color: #5D1466;
}

.border-colours-secarma-purple-500 {
  border-color: #863B8F;
}

.border-colours-neutral-800 {
  border-color: #202020;
}

.colours-secarma-purple-200 {
  color: #F4C2FA;
 }

 .colours-secarma-purple-300 {
  color: #C986D1;
 }

.colours-secarma-purple-400 {
  color: #B25DBC;
 }

.colours-secarma-purple-500 {
  color: #863B8F;
}


.bg-colours-secarma-purple-200 {
 background: #F4C2FA;
}

.bg-colours-secarma-purple-300 {
  background: #C986D1;
 }

 .bg-colours-secarma-purple-400 {
  background: #B25DBC;
 }

 .bg-colours-secarma-purple-500 {
  background: #863B8F;
 }

 .peer-checked\:bg-purple-500 {
  &:is(:where(.peer):checked ~ *) {
    background-color:  #863B8F;
  }
}


.bg-colours-secarma-purple-700 {
  background: #5D1466;
}

.colours-secarma-purple-700 {
  color: #5D1466;
}

.colours-secarma-purple-100 {
  color: #FDEFFF;
}

.bg-colours-secarma-purple-100 {
  background: #FDEFFF;
}

.colours-secarma-purple-300 {
  color: #C986D1;
}

.bg-colours-secarma-purple-300 {
  background: #C986D1;
}

.bg-colours-secarma-teal-web {
  background: #00D4CD;
}
.bg-colours-secarma-teal-600 {
  background: #185D6D;
}

.colours-secarma-teal-300 {
  color: #62B8CD;
}

.colours-secarma-teal-500 {
  color: #267487;
}

.colours-secarma-teal-600 {
  color: #185D6D;
}

.bg-colours-secarma-teal-500 {
  background: #267487;
}

.bg-colours-secarma-teal-600 {
  background: #185D6D;
}


.bg-colours-secarma-teal-300 {
  background: #62B8CD;
}


.bg-colours-neutral-50 {
  background: #FFFFFF;
}

.colours-neutral-50 {
  color: #FFFFFF;
}

.bg-colours-neutral-100 {
  background: #F8F8F8;
}

.colours-neutrals-800 {
  color: #202020;
}

.colours-neutrals-500 {
  color: #575756;
}

.bg-colours-neutral-100 {
  background: #F8F8F8;
}

.outline-colours-secarma-purple-600 {
 outline-color: #75257F;
}

.outline-colours-secarma-purple-200 {
  outline-color: #F4C2FA;
 }

.outline-colours-secarma-purple-400 {
  outline-color: #B25DBC;
 }s
 
 .outline-colours-secarma-purple-500 {
  outline-color: #863B8F;
 }

 .outline-colours-secarma-teal-500 {
  outline-color:  #267487;
 }

 .outline-colours-secarma-teal-200 {
  outline-color:  #98E3F6;
 }

 .outline-colours-secarma-teal-400 {
  outline-color: #4198AD;
 }

 .outline-colours-text {
  outline-color: #211023;
}

.colours-text {
  color: #211023;
}

.bg-colours-text {
  background: #211023;
}

.colours-secarma-purple-web {
  color: #BE00D4;
}

.colours-secarma-purple-web-light {
  color: #FCE7FF;
}

.bg-colours-secarma-purple-web-light {
  background: #FCE7FF;
}

.bg-colours-secarma-teal-100 {
  background: #DEF3F8;
}

/** end colours **/

.feature-image-left, .feature-image-right {           
  position: relative;
  z-index: 1;
}
  
.feature-image-left:before {
      content: '';
      position: absolute;
      height: 285px;
      width: 385px;
      bottom: -10rem;
      right: -3rem;
      z-index: -1;
      background-image: url('/images/assets/digicamo_left_picture.png');
      background-repeat: no-repeat;
}

.feature-image-right:before {
  content: '';
  position: absolute;
  height: 285px;
  width: 385px;
  bottom: -12rem;
  right: 10rem;
  z-index: -1;
  background-image: url('/images/assets/digicamo_right_picture.png');
  background-repeat: no-repeat;
}

.feature-image-left img, .feature-image-right img {
  border-radius: 0px 20px 20px 20px;
}

.feature-block h3, .service-content-block h3 {
 font-size: 1.3em !important;
 font-weight: bold;
 color: #863B8F;
}

h2.subheading {
  font-size: 1.6em !important;
  font-weight: 600;
}

h3.subheading {
  font-size: 1.3em !important;
  font-weight: bold;
  color: #863B8F;
}

.content-block {
  max-width: 1140px;
  text-align: justify;
}

.content-block  p, .content-block li {
  margin-top: 1em;
  font-family: "Raleway";
}

.content-block  ul, .service-content-block ul { 
  list-style-type: disc; 
  list-style-position: inside; 
}
.content-block  ol, .service-content-block ol { 
  list-style-type: decimal; 
  list-style-position: inside; 
}
.content-block  ul ul, ol ul { 
  list-style-type: circle; 
  list-style-position: inside; 
  margin-left: 15px; 
}
.content-block  ol ol, ul ol { 
  list-style-type: lower-latin; 
  list-style-position: inside; 
  margin-left: 15px; 
}

.content-block a {
  text-decoration-line: underline;
  color: #75257F;
}

.content-block a.no-underline {
  text-decoration-line: none !important;
}

.content-block img {
  vertical-align: middle;
  max-width: 100%;
  height: auto;
  margin: 1rem 0 1rem 0;
}

.content-block h2 {
  font-size: 2.25rem;
  font-weight: 800;
  padding-top: 1rem;
}

.content-block h3 {
  font-weight: bold;
  padding-top: 1rem;
}

.content-block hr {
  margin-top: 20px;
  margin-bottom: 20px;
  border: 0;
  border-top: 1px solid #B25DBC;
}

.content-block pre {
  font-family: monospace, monospace;
  font-size: 1em;
  background-color: #f6f6f6;
  padding: 10px 50px;
  margin: 30px 0 30px;
  white-space: pre-wrap;
}

.card-block {
  border-radius: 0px 20px 20px 20px;
	border: 1px solid var(--Colours-Secarma-purple-400, #B25DBC);
	background: var(--Colours-Secarma-purple-web-light, #FCE7FF);
}

.card-block-navy {
  border-radius: 0px 20px 20px 20px;
	border: 1px solid #05247c;
  background: #e6e9f2;
}

.card-block-teal {
	border-radius: 0px 20px 20px 20px;
	border: 1px solid var(--Colours-Secarma-Teal-400, #4198AD);
	background: var(--Colours-Secarma-Teal-100, #DEF3F8);
}

.card-block-grey {
	border-radius: 0px 20px 20px 20px;
	border: 1px solid var(--Colours-Neutral-400, #969696);
	background: var(--Colours-Neutral-200, #E2E2E2);
}

.frame .secarma-logo-wrapper {
  display: inline-flex;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 0px;
  position: relative;
  flex: 0 0 auto;
}

.frame .secarma-logo {
  position: relative;
  width: 244px;
  max-width: 100%;
}

.whitepaper-block p {
  font-family: "Raleway", Helvetica;
  font-size: 1.25rem;
  font-family: "Raleway";
  font-weight: 400;
  background-color: transparent !important;
}

.whitepaper-block span {
  font-family: "Raleway", Helvetica !important;
  font-size: 1.25rem;
  font-family: "Raleway";
  font-weight: 400;
  background-color: transparent !important;
}

div.OutlineElement, div.ListContainerWrapper {
  background-color: transparent !important;
}

.generic-form input[type=text], .contact-form input[type=email], .contact-form input[type=tel] {
  color: #000000; 
  font-size: 1.125rem; /* text-lg */
  font-weight: 400; /* font-normal */
  font-family: 'Raleway', sans-serif; /* font-['Raleway'] */
  align-self: stretch; /* self-stretch */
  padding: 12px 30px; /* px-[30px] py-[12px] */
  background-color: white; /* bg-white */
  border-radius: 14px; /* rounded-[14px] */
  border: 1px solid black; /* border border-black */
  display: inline-flex; /* inline-flex */
  justify-content: flex-start; /* justify-start */
  align-items: flex-start; /* items-start */
  gap: 0.625rem; /* gap-2.5 */
  overflow: hidden; /* overflow-hidden */
}

.generic-form label {
  color: black; /* text-black */
  font-size: 1rem; /* text-base */
  font-weight: 400; /* font-normal */
  font-family: 'Raleway', sans-serif; /* font-['Raleway'] */
  line-height: 1.75rem; /* leading-7 */
}

.generic-form button {
  align-self: stretch;
  padding: 20px 35px; /* px-[35px] py-5 */
  background-color: #211023; /* bg-[#211023] */
  border-radius: 14px; /* rounded-[14px] */
  justify-content: center; /* justify-center */
  align-items: center; /* items-center */
  gap: 0.625rem; /* gap-2.5 */
  display: inline-flex; /* inline-flex */
  text-align: center;
  color: white;
  font-size: 1.25rem; /* text-xl */
  font-weight: bold;
  font-family: 'Raleway', sans-serif;
  line-height: 1.75rem; /* leading-7 */
}



@media only screen and (max-width: 640px) {
  .frame .secarma-logo {
    max-width: none;
  }
}

.topnav {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  position: relative;
  flex: 0 0 auto;
}

.frame .main-navigation {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 4px 0px;
  position: relative;
  flex: 0 0 auto;
}

.frame .text-wrapper {
  position: relative;
  width: fit-content;
  margin-top: -1.00px;
  font-family: "Raleway-Regular", Helvetica;
  font-weight: 400;
  color: #000000;
  font-size: 20px;
  letter-spacing: 0;
  line-height: 28px;
  white-space: nowrap;
}

.frame .chevron-down {
  position: relative;
  width: 20px;
  height: 20px;
}

 .button-ghost {
  border: 1px solid;
  border-color: #211023;
  display: inline-flex;
  align-items: flex-start;
  gap: 10px;
  padding: 20px 35px;
  position: relative;
  flex: 0 0 auto;
  border-radius: 8px;
  background-color: #fff;
}

.button-label {
  position: relative;
  width: fit-content;
  margin-top: -1.00px;
  color: #211023;
  font-size: 20px;
  text-align: center;
  letter-spacing: 0;
  line-height: 28px;
  white-space: nowrap;
}

.button-primary {
  background-color: #211023;
  display: inline-flex;
  align-items: flex-start;
  gap: 10px;
  padding: 20px 35px;
  position: relative;
  flex: 0 0 auto;
  border-radius: 8px;
}

.text-heading {
 font-size: 30px;
}

.text-subheading {
	font-size: 18px;
}

.custom-font-bold {
	font-family: "Raleway", Helvetica;
	font-weight: 800;	
}

.custom-font-extrabold {
	font-family: "Raleway", Helvetica;
	font-weight: 800;
  font-style: normal;
  font-size: 20px;
}

.custom-font-medium {
	 font-family: "Raleway", Helvetica;
	 font-weight: 500;
}

.custom-font-light {
	 font-family: "Raleway", Helvetica;
	 font-weight: 400;
}



.button-label-light {
  position: relative;
  width: fit-content;
  margin-top: -1.00px;
  color: #ffffff;
  font-size: 20px;
  text-align: center;
  letter-spacing: 0;
  line-height: 28px;
  white-space: nowrap;
}



.hero-headline {
  position: relative;
  align-self: stretch;
  font-family: "Raleway-Medium", Helvetica;
  font-weight: 500;
  color: #000000;
  font-size: 60px;
  letter-spacing: 0;
  line-height: normal;
}


.frame .group {
  position: relative;
  width: 478px;
  height: 442px;
  top: 62px;
  left: 122px;
}

.frame .overlap {
  position: relative;
  height: 442px;
}

.frame .div-4 {
  display: flex;
  width: 478px;
  align-items: center;
  justify-content: space-between;
  padding: 16px 24px 16px 32px;
  position: absolute;
  top: 0;
  left: 0;
  background-color: #ffffffcc;
  border-radius: 16px;
  border: 1px solid;
  border-color: #b25dbc;
  backdrop-filter: blur(40px) brightness(100%);
  -webkit-backdrop-filter: blur(40px) brightness(100%);
}

.frame .frame-wrapper {
  display: flex;
  flex-direction: column;
  width: 148px;
  align-items: flex-start;
  justify-content: center;
  gap: 10px;
  padding: 4px 0px;
  position: relative;
  border-radius: 8px;
}

.frame .div-5 {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  position: relative;
  flex: 0 0 auto;
}

.frame .text-wrapper-2 {
  position: relative;
  width: fit-content;
  margin-top: -1.00px;
  font-family: "Raleway-ExtraBold", Helvetica;
  font-weight: 800;
  color: #863b8f;
  font-size: 40px;
  letter-spacing: 0;
  line-height: normal;
  white-space: nowrap;
}

.frame .rectangle {
  position: relative;
  width: 28px;
  height: 8px;
  margin-top: -4px;
  background-color: #c985d1;
}

.frame .img {
  position: relative;
  width: 100px;
  height: 100px;
}

.frame .text-wrapper-3 {
  position: relative;
  width: fit-content;
  font-family: "Raleway-Medium", Helvetica;
  font-weight: 500;
  color: #211023;
  font-size: 16px;
  letter-spacing: 0;
  line-height: 28px;
  white-space: nowrap;
}

.frame .div-6 {
  display: flex;
  flex-direction: column;
  width: 194px;
  align-items: center;
  gap: 10px;
  padding: 16px;
  position: absolute;
  top: 203px;
  left: 284px;
  background-color: #ffffffcc;
  border-radius: 16px;
  border: 1px solid;
  border-color: #959595;
  backdrop-filter: blur(40px) brightness(100%);
  -webkit-backdrop-filter: blur(40px) brightness(100%);
}

.frame .div-wrapper {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  padding: 4px 16px;
  position: relative;
  flex: 0 0 auto;
  border-radius: 8px;
}

.frame .text-wrapper-4 {
  position: relative;
  width: fit-content;
  margin-top: -1.00px;
  font-family: "Raleway-ExtraBold", Helvetica;
  font-weight: 800;
  color: #1f1f1f;
  font-size: 40px;
  letter-spacing: 0;
  line-height: normal;
  white-space: nowrap;
}

.frame .rectangle-2 {
  background-color: #959595;
  position: relative;
  width: 28px;
  height: 8px;
  margin-top: -4px;
}

.frame .text-wrapper-5 {
  position: relative;
  width: fit-content;
  margin-left: -2.00px;
  margin-right: -2.00px;
  font-family: "Raleway-Medium", Helvetica;
  font-weight: 500;
  color: #211023;
  font-size: 16px;
  text-align: center;
  letter-spacing: 0;
  line-height: 28px;
  white-space: nowrap;
}

.frame .div-7 {
  display: flex;
  flex-direction: column;
  width: 194px;
  align-items: center;
  gap: 10px;
  padding: 16px;
  position: absolute;
  top: 203px;
  left: 0;
  background-color: #ffffffcc;
  border-radius: 16px;
  border: 1px solid;
  border-color: #4097ac;
  backdrop-filter: blur(40px) brightness(100%);
  -webkit-backdrop-filter: blur(40px) brightness(100%);
}

.frame .label-4 {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  padding: 4px 16px;
  position: relative;
  flex: 0 0 auto;
  margin-left: -1.50px;
  margin-right: -1.50px;
  border-radius: 8px;
}

.frame .div-8 {
  display: flex;
  align-self: stretch;
  width: 100%;
  flex-direction: column;
  align-items: flex-start;
  position: relative;
  flex: 0 0 auto;
}

.frame .text-wrapper-6 {
  position: relative;
  width: fit-content;
  margin-top: -1.00px;
  font-family: "Raleway-ExtraBold", Helvetica;
  font-weight: 800;
  color: #267487;
  font-size: 40px;
  letter-spacing: 0;
  line-height: normal;
  white-space: nowrap;
}

.frame .rectangle-3 {
  background-color: #62b8cd;
  position: relative;
  width: 28px;
  height: 8px;
  margin-top: -4px;
}

.frame .text-wrapper-7 {
  position: relative;
  align-self: stretch;
  font-family: "Raleway-Medium", Helvetica;
  font-weight: 500;
  color: #211023;
  font-size: 16px;
  text-align: center;
  letter-spacing: 0;
  line-height: 28px;
}

.frame .div-9 {
  display: flex;
  flex-direction: column;
  width: 138px;
  align-items: center;
  padding: 16px;
  position: absolute;
  top: 116px;
  left: 170px;
  background-color: #75257fcc;
  border-radius: 16px;
  border: 1px solid;
  border-color: #300235;
  backdrop-filter: blur(40px) brightness(100%);
  -webkit-backdrop-filter: blur(40px) brightness(100%);
}

.frame .text-wrapper-8 {
  position: relative;
  align-self: stretch;
  margin-top: -1.00px;
  font-family: "Raleway-ExtraBold", Helvetica;
  font-weight: 800;
  color: #ffffff;
  font-size: 40px;
  text-align: center;
  letter-spacing: 0;
  line-height: normal;
}

.frame .text-wrapper-9 {
  position: relative;
  align-self: stretch;
  font-family: "Raleway-Medium", Helvetica;
  font-weight: 500;
  color: #fdeeff;
  font-size: 20px;
  text-align: center;
  letter-spacing: 0;
  line-height: 28px;
}

.frame .group-2 {
  position: absolute;
  width: 22px;
  height: 12px;
  top: 95px;
  left: 120px;
}

.frame .overlap-group {
  position: absolute;
  width: 18px;
  height: 12px;
  top: 0;
  left: 4px;
}

.frame .rectangle-4 {
  position: absolute;
  width: 9px;
  height: 9px;
  top: 3px;
  left: 9px;
  background-color: #267487;
}

.frame .rectangle-5 {
  position: absolute;
  width: 9px;
  height: 9px;
  top: 3px;
  left: 0;
  background-color: #62b8cd;
}

.frame .rectangle-6 {
  position: absolute;
  width: 14px;
  height: 7px;
  top: 0;
  left: 4px;
  background-color: #185c6d;
}

.frame .rectangle-7 {
  position: absolute;
  width: 4px;
  height: 12px;
  top: 0;
  left: 0;
  background-color: #267487;
}



.frame .image {
  width: 66.88px;
  object-fit: cover;
  position: relative;
  height: 80px;
}

.frame .image-2 {
  width: 64.84px;
  object-fit: cover;
  position: relative;
  height: 80px;
}

.frame .image-3 {
  width: 109.23px;
  position: relative;
  height: 80px;
}

.frame .image-4 {
  width: 109.51px;
  position: relative;
  height: 80px;
}

.frame .image-5 {
  width: 97.56px;
  object-fit: cover;
  position: relative;
  height: 80px;
}

.frame .image-6 {
  width: 141.59px;
  object-fit: cover;
  position: relative;
  height: 80px;
}

.frame .div-11 {
  position: relative;
  width: 113px;
  height: 49px;
  background-image: url(./img/image-6.png);
  background-size: cover;
  background-position: 50% 50%;
}




.services-block .act-indicator {
  position: relative;
  align-self: stretch;
  width: 40px;
}


.services-label {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  padding: 4px 16px;
  position: relative;
  flex: 0 0 auto;
  background-color: #5d1466;
  border-radius: 8px;
}



.services-label .text-wrapper {
  position: relative;
  width: fit-content;
  margin-top: -1.00px;
  font-family: "Raleway-ExtraBold", Helvetica;
  font-weight: 800;
  color: #ffffff;
  font-size: 40px;
  letter-spacing: 0;
  line-height: normal;
  white-space: nowrap;
}

.services-block .rectangle {
  position: relative;
  width: 28px;
  height: 8px;
  margin-top: -4px;
  background-color: #c985d1;
}

/** form styles **/

.contact-form button {
  align-self: stretch;
  padding: 20px 35px; /* px-[35px] py-5 */
  background-color: #211023; /* bg-[#211023] */
  border-radius: 14px; /* rounded-[14px] */
  justify-content: center; /* justify-center */
  align-items: center; /* items-center */
  gap: 0.625rem; /* gap-2.5 */
  display: inline-flex; /* inline-flex */
  text-align: center;
  color: white;
  font-size: 1.25rem; /* text-xl */
  font-weight: bold;
  font-family: 'Raleway', sans-serif;
  line-height: 1.75rem; /* leading-7 */
}

.contact-form input[type=text], .contact-form input[type=email], .contact-form input[type=tel] {
  color: #000000; 
  font-size: 1.125rem; /* text-lg */
  font-weight: 400; /* font-normal */
  font-family: 'Raleway', sans-serif; /* font-['Raleway'] */
  align-self: stretch; /* self-stretch */
  padding: 12px 30px; /* px-[30px] py-[12px] */
  background-color: white; /* bg-white */
  border-radius: 14px; /* rounded-[14px] */
  border: 1px solid black; /* border border-black */
  display: inline-flex; /* inline-flex */
  justify-content: flex-start; /* justify-start */
  align-items: flex-start; /* items-start */
  gap: 0.625rem; /* gap-2.5 */
  overflow: hidden; /* overflow-hidden */
}



.contact-form textarea {
    align-self: stretch; /* self-stretch */
    height: 120px; /* h-[120px] */
    padding: 18px 30px; /* px-[30px] py-[18px] */
    background-color: white; /* bg-white */
    border-radius: 14px; /* rounded-[14px] */
    border: 1px solid black; /* border border-black */
    display: inline-flex; /* inline-flex */
    justify-content: flex-start; /* justify-start */
    align-items: flex-start; /* items-start */
    gap: 0.625rem; /* gap-2.5 */
    overflow: hidden; /* overflow-hidden */
    color: #898989; /* text-[#898989] */
    font-size: 1.125rem; /* text-lg */
    font-weight: 400; /* font-normal */
    font-family: 'Raleway', sans-serif; /* font-['Raleway'] */
    color: #000000;
}

.contact-form input::placeholder, .contact-form textarea::placeholder {
  color: #898989; 
}

.contact-form label {
    color: black; /* text-black */
    font-size: 1rem; /* text-base */
    font-weight: 400; /* font-normal */
    font-family: 'Raleway', sans-serif; /* font-['Raleway'] */
    line-height: 1.75rem; /* leading-7 */
}

div.invalid-feedback {
	color: red;
  margin: 0;
}

/** swiper carousel styles **/

.swiper-wrapper {
  width: 100%;
  height: max-content !important;
  padding-bottom: 64px !important;
  -webkit-transition-timing-function: linear !important;
  transition-timing-function: linear !important;
  position: relative;
  }
  .swiper-pagination-bullet {
  background: #F4C2FA;
  }
  .swiper-pagination-bullet-active {
  background: #BE00D4 !important;
  }



/** navigation styles **/
.res-trig {
  width: 15px;
  height: 15px;
  position: relative;
  margin: 15px 10px 0 35px;
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  cursor: pointer;
  float: right;
  display: none;
}
.res-trig span {
  display: block;
  position: absolute;
  height: 2px;
  width: 100%;
  background: #8b4f97;
  opacity: 1;
  left: 0;
  -webkit-transition: 0.25s ease transform;
  transition: 0.25s ease transform;
}
.res-trig span:nth-child(1) {
  top: 0px;
  -webkit-transform-origin: left top;
  transform-origin: left top;
}
.res-trig span:nth-child(2) {
  top: 5px;
  -webkit-transform-origin: center center;
  transform-origin: center center;
}
.res-trig span:nth-child(3) {
  top: 10px;
  -webkit-transform-origin: left bottom;
  transform-origin: left bottom;
}
.res-trig.open span {
  width: 15px;
}
.res-trig.open span:nth-child(1) {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
.res-trig.open span:nth-child(2) {
  -webkit-transform: rotate(45deg) translate(-4px,  3px);
  transform: rotate(45deg) translate(-4px,  3px);
  opacity: 0;
}
.res-trig.open span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
@media only screen and (max-width: 768px) {
  .res-trig {
  display: block;
}
}@media only screen and (max-width: 420px) {
  .res-trig {
  margin: 26px 10px 0 25px;
}
}

.main-nav {
  font-family: "Raleway";
}

.header-container {
  z-index: 1;
}

@media only screen and (min-width: 769px) {
  #menu-main {
  list-style: none;
  margin: 0;
}
#menu-main>li {
  position: relative;
  display: inline-block;
  margin-left: 2rem;
}
#menu-main>li:not(.mega-menu) li {
  display: block;
  white-space: nowrap;
}
#menu-main>li>a {
  font-size: 1.25rem;
  font-family: "Raleway";
  font-weight: 400;
  display: block;
  position: relative;
  padding: 0px 5px 0px 5px;
}
#menu-main>li>a:before {
  content: "";
  display: block;
  height: 2px;
  width: 100%;
  background-color: #8b4f97;
  position: absolute;
  left: 0;
  bottom: 0;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transition: 300ms ease all;
  transition: 300ms ease all;
  -webkit-transform-origin: left center;
  transform-origin: left center;
}
#menu-main>li:hover a:before {
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}
#menu-main>li>.sub-menu {
  position: absolute;
  top: 100%;
  left: 0;
  list-style: none;
  margin: 0;
  padding: 20px 10px;
  background-color: rgba(255, 255, 255, 0.95);
  opacity: 0;
  -webkit-transform: translateY(10px);
  transform: translateY(10px);
  visibility: hidden;
  -webkit-transition: none;
  transition: none;
}
#menu-main>li>.sub-menu li {
  margin-bottom: 3px;
}
#menu-main>li>.sub-menu li:last-child {
  margin-bottom: 0;
}
#menu-main>li>.sub-menu a {
  position: relative;
  font-size: 1rem;
  font-family: "Raleway";
  display: block;
  color: #000;
  padding: 5px 0;
  min-width: 170px;
}
#menu-main>li>.sub-menu a:hover {
  color: #8b4f97;
}
#menu-main ul {
  list-style: none;
}
#menu-main>.menu-item-has-children {
  padding-right: 15px;
}
#menu-main>.menu-item-has-children>a:after {
  content: "\f054";
  font-family: "FontAwesome";
  font-weight: 300;
  font-weight: normal;
  font-style: normal;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  line-height: 1;
  position: absolute;
  top: 10px;
  right: -15px;
  font-size: 12px;
  font-weight: 700;
  -webkit-transition: 250ms ease all;
  transition: 250ms ease all;
}
#menu-main>.menu-item-has-children:hover a:after {
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
}
#menu-main>.menu-item-has-children:hover .sub-menu {
  opacity: 1;
  visibility: visible;
  -webkit-transform: translateY(0);
  transform: translateY(0);
  -webkit-transition: 200ms ease-in all;
  transition: 200ms ease-in all;
}
#menu-main .mega-menu {
  position: static;
}
#menu-main .mega-menu>.sub-menu {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: top;
  -ms-flex-align: top;
  align-items: top;
  padding: 20px 40px;
  background-color: #ffffff;
}
#menu-main .mega-menu>.sub-menu li {
  margin-bottom: 0;
}
#menu-main .mega-menu>.sub-menu>li {
  -ms-flex-preferred-size: 33%;
  flex-basis: 33%}
#menu-main .mega-menu>.sub-menu>li>a {
  font-size: 16px;
  color: #8b4f97;
}
#menu-main .mega-menu>.sub-menu>li .sub-menu {
  position: relative;
}
#menu-main .mega-menu>.sub-menu>li .sub-menu a {
  font-size: 16px;
}
#menu-main>.current_page_item>a, #menu-main>.current_page_ancestor>a, #menu-main>.current_page_parent>a {
  font-weight: 700;
}
#menu-main>.current_page_item>a:before, #menu-main>.current_page_ancestor>a:before, #menu-main>.current_page_parent>a:before {
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}
}@media only screen and (max-width: 768px) {

.main-nav {
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  padding: 70px 0 0;
  width: 100%;
  height: 100%;
  height: 100vh;
  overflow: hidden;
  visibility: hidden;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  opacity: .7;
  -webkit-transform-origin: left top;
  transform-origin: left top;
  z-index: -1;
  color: #000;
  text-align: left;
  background-color: #fff;
}
.main-nav ul, .main-nav #menu-main {
  list-style: none;
  padding: 0;
  margin-top: 2rem;
  z-index: 1;
}
}@media only screen and (max-width: 768px) and (max-width: 768px) {
  .main-nav {
  padding-top: 110px;
}
}@media only screen and (max-width: 768px) and (max-width: 420px) {
  .main-nav {
  padding-top: 64px;
}
}@media only screen and (max-width: 768px) {
  #menu-main {
  display: block;
  height: 100%;
  overflow-y: scroll;
  padding-top: 5px;
}
#menu-main>li>a {
  -webkit-transform: translate3d(-30px,  0,  0);
  transform: translate3d(-30px,  0,  0);
  text-transform: uppercase;
}
#menu-main li {
  display: block;
  float: none;
  margin: 0;
  padding: 0;
  border-top: 1px solid rgba(0, 0, 0, 0.3);
}
#menu-main li a {
  display: block;
  color: #000;
  padding: 14px 10px 12px 20px;
  font-size: 14px;
  font-weight: 400;
  margin: 0;
  opacity: 0;
}
#menu-main li a:before {
  display: none;
}
#menu-main li a.active {
  color: #8b4f97;
}
#menu-main>li.animate>a {
  -webkit-animation: mobitem .5s ease .4s forwards;
  animation: mobitem .5s ease .4s forwards;
}
#menu-main>li:nth-child(1)>a {
  -webkit-animation-delay: .15s;
  animation-delay: .15s;
}
#menu-main>li:nth-child(2)>a {
  -webkit-animation-delay: .2s;
  animation-delay: .2s;
}
#menu-main>li:nth-child(3)>a {
  -webkit-animation-delay: .25s;
  animation-delay: .25s;
}
#menu-main>li:nth-child(4)>a {
  -webkit-animation-delay: .3s;
  animation-delay: .3s;
}
#menu-main>li:nth-child(5)>a {
  -webkit-animation-delay: .35s;
  animation-delay: .35s;
}
#menu-main>li:nth-child(6)>a {
  -webkit-animation-delay: .4s;
  animation-delay: .4s;
}
#menu-main>li:nth-child(7)>a {
  -webkit-animation-delay: .45s;
  animation-delay: .45s;
}
#menu-main>li:nth-child(8)>a {
  -webkit-animation-delay: .5s;
  animation-delay: .5s;
}
#menu-main>li:nth-child(9)>a {
  -webkit-animation-delay: .55s;
  animation-delay: .55s;
}
#menu-main>li:nth-child(10)>a {
  -webkit-animation-delay: .6s;
  animation-delay: .6s;
}
#menu-main .menu-item-has-children {
  position: relative;
}
#menu-main .menu-item-has-children>a {
  margin-right: 55px;
}
#menu-main .menu-item-has-children:after {
  content: "\f078";
  display: block;
  font-family: FontAwesome;
  font-weight: 300;
  font-weight: normal;
  font-style: normal;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  line-height: 1;
  font-size: 16px;
  position: absolute;
  right: 0;
  top: 0;
  text-align: center;
  line-height: 48px;
  height: 48px;
  width: 55px;
  opacity: 1;
  background-color: rgba(255, 255, 255, 0.1);
  border-left: 1px solid rgba(0, 0, 0, 0.1);
}
#menu-main .menu-item-has-children.active:after {
  content: "\f077"}
#menu-main .menu-item-has-children .menu-item-has-children:after {
  line-height: 43px;
  height: 43px;
  font-size: 14px;
}
#menu-main .sub-menu {
  position: relative;
  display: none;
  background-color: #ebebeb;
}
#menu-main .sub-menu .sub-menu {
  background-color: #d6d6d6;
}
#menu-main .sub-menu .sub-menu a {
  padding-left: 40px;
}
#menu-main .sub-menu.open {
  display: block;
}
#menu-main .sub-menu ul {
  width: 100%;
  padding: 0;
}
#menu-main .sub-menu a {
  opacity: 1;
  padding-left: 30px;
  font-weight: 300;
  font-size: 14px;
  line-height: 17px;
}
#menu-main .sub-menu .menu-item-has-children {
  display: block;
}
#menu-main .sub-menu .menu-item-has-children>a {
  padding-left: 30px;
}
#menu-main .sub-menu .menu-item-has-children:not(:first-child) {
  margin-top: 0;
}
#menu-main .sub-nav {
  background-color: transparent;
  padding: 0;
}
}@-webkit-keyframes mobitem {
  100% {
  -webkit-transform: translate3d(0,  0,  0);
  transform: translate3d(0,  0,  0);
  opacity: 1;
}
}@keyframes mobitem {
  100% {
  -webkit-transform: translate3d(0,  0,  0);
  transform: translate3d(0,  0,  0);
  opacity: 1;
}


/** media queries for mobile **/
