@import url(css/main.css);

*{
    box-sizing: border-box;
}

.mytop-sprints {
    display: flex;
    flex-direction: row;
    padding-left: 10vw;
    padding-right: 5vw;
    padding-top: 20vh;
    padding-bottom: 10vh;
    column-gap: 5vw;
    background-color: var(--purple);
}

.mytop-left {
    display: flex;
    flex-direction: column;
    max-width: 50%;
    padding-top: 0vh;

}

.mytop-left h1 {
    font-family: 'poppins';
    font-weight: 700;
    font-size: 5vw;
    line-height: 1.2;
    color: var(--white);

}

.mytop-left h2 {
    font-family: 'poppins';
    font-weight: 400;
    font-size: 2vw;
    line-height: 1.2;
    padding-top: 7vh;
    padding-bottom: 2vh;
    color: var(--white);
    letter-spacing: 1.3px;
    opacity: 0.8;


}


.mytop-right {
    display: flex;
    width: 40vw;
}

.mytop-right img {
    display: flex;
    width: 40vw;
    height: 40vw;
}

.mytop-right-todo img {
    display: flex;
    width: 40vw;
    height: auto;
}


#btn-readmore-ds {
    display: flex;
    justify-content: left;
}

#btn-readmore-ds a {
    text-decoration: none;
    font-family: 'poppins';
    font-size: 1rem;
    font-weight: 400;
    color: var(--pink);
}

#btn-readmore-ds h4 {
    text-decoration: none;
    color: var(--pink);
    background-color: transparent;
    transition: 0.2s;
    padding: 6px 36px;
    font-size: 1rem;
}

#btn-readmore-ds h4:hover {
    text-decoration: none;
    color: var(--white);
    background-color: var(--pink);
    transition: 0.2s;
    padding: 6px 36px;
    font-size: 1rem;

}
 

#btn-readmore-ds .mainbutton:hover a {
    text-decoration: none;
    color: var(--white);
    transition: 0.2s;
}

.mytop-sprints-2 {
    display: flex;
    flex-direction: row;
    padding-left: 10vw;
    padding-right: 10vw;
    padding-top: 10vh;
    padding-bottom: 10vh;
    column-gap: 5vw;
    background-color: transparent;
}

.pro-box-points-ds {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-items: flex-start;
    margin-top: 4vh;
    margin-left: 30px;
}

.c-p-inner-ds {
    flex-direction: row;
    display: flex;
    padding-bottom: 2vh;
}

.c-p-inner-ds h2 {
    font-family: 'poppins';
    font-size: 0.9rem;
    font-weight: 400;
    flex-direction: row;
    display: flex;
    padding-top: 0.1vh;
    padding-bottom: 0.1vh;
    color: var(--mid-black);
}

.c-p-inner-ds img {
    width: 20px;
    height: 20px;
    padding: 4px;
    margin-right: 24px;
    margin-bottom: 2px;
    background-color: var(--mid-purple);
    border-radius: 50px;
}

.mytop-sprints-2 .mytop-right img {
    display: flex;
    width: 35vw;
    height: auto;
    object-fit: scale-down;
}
.livenbrathe-trans {
	padding-left: 14vw;
	padding-right: 14vw;
	background-color: transparent;
	color: var(--dark-grey);
	font-size: 2.25vw;
	text-align: center;
	font-weight: 800;
	line-height: 1.2;
	display: flex;
	margin-top: 0px;
    padding-top: 48px;
    padding-bottom: 24px;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.livenbrathe-trans h1 {
	font-family: 'Poppins', sans-serif;
}

.livenbrathe-trans h3 {
	color: var(--light-purple);
	font-size: max(1.7vw,26px);
	font-weight: 500;
	line-height: 1.4;
	padding-top: 16px;
	font-family: 'Poppins', sans-serif;
	text-align: center;
	padding-left: 8vw;
	padding-right: 8vw;
}
 

.grey-gradient {
    background: radial-gradient(at center top, var(--light-grey), var(--white));
}

.des-container {
    margin-left: 12vw;
    margin-right: 12vw;
    margin-top: 1vh;
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.des-item {
    display: flex;
    padding: 6px;

}

.des-left {
    background-color: transparent;
}

.des-left img {
    margin-right: 12px;
    padding: 16px;
    width: 60px;
    height: 60px;
    border-color: var(--purple);
    background-color: transparent;
    border-width: 1px;
    border-style: solid;
    border-radius: 16px;
    box-shadow: 0px 0px 50px var(--light-purple-trans), 0px 0px 50px var(--light-purple-trans) inset;
}

.des-right h3 {
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 1.2;
    padding-left: 18px;
    font-family: 'poppins';
    color: var(--light-black);
}

.des-right h2 {
    font-size: 0.9rem;
    padding-left: 18px;
    letter-spacing: 0.8px;
    margin-top: 4px;
    line-height: 1.7;
    color: var(--black);
    font-weight: 280;
    font-family: 'poppins';

}

.des-right h2 a {
    font-size: 1rem;
    line-height: 1.4;
    font-weight: normal;
    text-decoration: none;
    color: var(--pink);
    font-family: 'Poppins', sans-serif;

}


.ds-do-dont {
    display: grid;
    flex-direction: row;
    padding-left: 8vw;
    padding-right: 10vw;
    grid-template-columns: 1fr 1fr;
    padding-bottom: 8vh;
}

.ds-do {
    margin-right: 2vw;
}

.ds-dont {
    padding-left: 8vw;
}

.ds-do,
.ds-dont {}

.ds-do h1 {
    font-size: 3rem;
    line-height: 1.2;
    padding-left: 2vw;
    margin-bottom: 5vh;
    font-weight: 700;
    font-family: 'poppins';
}

.ds-do h1 span {
    font-family: 'poppins';
    color: var(--pink);
}

.ds-dont h1 {
    font-size: 3rem;
    line-height: 1.2;
    margin-bottom: 5vh;
    font-weight: 700;
    font-family: 'poppins';
}

.ds-dont h1 span {
    font-family: 'poppins';
    color: var(--purple);
}

.c-p-inner-ds-pic,
.c-p-inner-ds-puc {
    flex-direction: row;
    display: flex;
    padding-bottom: 2vh;
}

.c-p-inner-ds-pic h2,
.c-p-inner-ds-puc h2 {
    font-family: 'poppins';
    font-size: 0.9rem;
    font-weight: 400;
    flex-direction: row;
    display: flex;
    padding-top: 0.1vh;
    padding-bottom: 0.1vh;
    color: var(--mid-black);
}

.c-p-inner-ds-pic img {
    width: 8px;
    height: 8px;
    padding: 4px;
    margin-right: 24px;
    margin-top: 5px;
    background-color: var(--white);
    border-radius: 50px;
    border: 1px solid var(--pink);
}

.c-p-inner-ds-puc img {
    width: 8px;
    height: 8px;
    padding: 4px;
    margin-right: 24px;
    margin-top: 5px;
    background-color: var(--white);
    border-radius: 50px;
    border: 1px solid var(--purple);
}

.livenbrathe-purple {
    padding-left: 6vw;
    padding-right: 6vw;
    background: radial-gradient(at center top, #4c1356, #290b4d);
    padding-top: 15vh;
    padding-bottom: 15vh;
    font-size: 2.0rem;
    text-align: center;
    font-weight: 600;
    line-height: 1.2;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.livenbrathe-purple h1 {
    color: var(--white);
    font-size: 2rem;
    font-weight: 0;
    line-height: 1.4;
    padding-top: 16px;
    font-family: 'poppins';
    text-align: center;
}

.livenbrathe-purple h2 {
    color: var(--white);
    font-size: 2.5rem;
    font-weight: 0;
    line-height: 1.4;
    padding-top: 16px;
    font-family: 'poppins';
    text-align: center;
}

.livenbrathe-purple h3 {
    color: var(--white);
    font-size: 1.6rem;
    font-weight: 0;
    line-height: 1.4;
    padding-top: 16px;
    font-family: 'poppins';
    text-align: center;
}

.livenbrathe-purple img {
    width: 20vw;
}

#btn-readmore-ds-invert {
    display: flex;
    justify-content: left;
    margin-top: 16px;
}

#btn-readmore-ds-invert a {
    text-decoration: none;
    font-family: 'poppins';
    font-size: 1.3rem;
    font-weight: 500;
    color: var(--pink);
}



#btn-readmore-ds-invert h4:hover {
    text-decoration: none;
    color: var(--pink);
    background-color: transparent;
    transition: 0.2s;
    padding: 14px 42px;
    font-size: 1.3rem;
    font-weight: 500;

}

#btn-readmore-ds-invert h4 {
    text-decoration: none;
    color: var(--white);
    background-color: var(--pink);
    transition: 0.2s;
    padding: 14px 42px;
    font-size: 1.3rem;
    font-weight: 500;

}




#btn-readmore-ds-invert .mainbutton a {
    text-decoration: none;
    transition: 0.2s;
    color: var(--white);

}


#btn-readmore-ds-invert .mainbutton a:hover {
    text-decoration: none;
    transition: 0.2s;
    color: var(--pink);

}

.ds-organise{
    display: flex;
    flex-direction: column;
    padding-left: 4vw;
    padding-right: 4vw;
}

.organise-item{
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    padding-left: 4vw;
    padding-right: 2vw;
    padding-top: 5vh;
    padding-bottom: 5vh;
    margin-top: 8px;
    margin-bottom: 8px;
}

.organise-item-rev{
    display: grid;
    grid-template-columns: 0.8fr 1fr;
    padding-left: 4vw;
    padding-right: 2vw;
    padding-top: 5vh;
    padding-bottom: 5vh;
}


.o-i-left {
    display: flex;
    flex-direction: column;
    row-gap: 3vh;
}

.o-i-left ol.a{
    display: list-item;
    list-style-type: decimal;
   
     

}
.o-i-left li {
    font-size: min(2.2rem,3.3vw);
    font-weight: 600;
    font-family: 'poppins';
    color: var(--light-black); 
}

.o-i-left h1 {
    font-size: 0.9rem;
    font-weight: 280;
    font-family: 'poppins';
    color: var(--black);
}

.o-i-left h2 {
    font-size: 0.9rem;
    font-weight: 350;
    font-family: 'poppins';
    color: var(--black);
}

.organise-item-rev .o-i-left h2 {
    font-size: 0.9rem;
    font-weight: 350;
    font-family: 'poppins';
    color: var(--black);
    margin-top: -12px;
    margin-bottom: 12px;
}

.o-i-left h3 {
    font-size: 1.5rem;
    font-weight: 400;
    line-height: 1.2;
    font-family: 'poppins';
    color: var(--light-black);
}

#inner-ds{
    display: flex;
    flex-direction: column;
}


.c-p-inner-ds-2 {
    flex-direction: row;
    display: flex;
    padding-bottom: 0.5vh;
}
 

.c-p-inner-ds-2 img {
    width: 20px;
    height: 20px;
    padding: 4px;
    margin-right: 18px;
    margin-bottom: 2px;
    background-color: var(--mid-purple);
    border-radius: 50px;
}

.c-p-inner-ds-2 h2 {
    font-family: 'poppins';
    font-size: 0.9rem;
    font-weight: 300;
    flex-direction: row;
    display: flex;
    padding-bottom: 0.1vh;
    color: var(--mid-black);
}

.inner-ds-item{
    display: flex;
    flex-direction:row;
    margin-bottom: 0.2vh;
}
#inner-ds #inner-inner-ds{
    display: flex;
    flex-direction: row;
    padding-left: 4vw;
}

.c-p-inner-i-ds-puc img {
    width: 8px;
    height: 8px;
    padding: 4px;
    margin-right: 8px;
    margin-top: 5px;
    background-color: var(--white);
    border-radius: 50px;
    border: 1px solid var(--purple);
}

.o-i-right{
    display: flex;
    flex-direction: column;
    margin: 8px;
    justify-content: center;

}

.o-i-right-smaller{
    display: flex;
    flex-direction: column;
    justify-content: center;

}
.o-i-right img,.o-i-right-smaller img{
    width: 45vw;
    height: auto;
    object-fit: contain;
}

.o-i-right .img,.o-i-right-smaller img{
    width: 45vw;
    height: auto;
    padding-right: 5vw;
    object-fit: contain;
}

.ds-heading{
    font-family: 'poppins';
    font-size: 1.1rem;
    line-height: 1.1;
    text-align: center;
    padding: 6vh;
    margin-top: 12px;
    font-weight: 500;
    color: var(--light-black);
}
.text-row{
    display: grid;
    grid-template-columns: 1fr 1fr;
    padding-left: 8vw;
    padding-right: 8vw;
    padding-bottom: 10vh;
    column-gap: 5vw;
}

.text-row .text-item h2{
    font-size: 1rem;
    padding-left: 18px;
    letter-spacing: 0.8px;
    margin-top: 4px;
    line-height: 1.7;
    color: var(--black);
    font-weight: 280;
    font-family: 'poppins';
}

.grey-qoute {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 10vh;
    justify-content: center;
    background-color: var(--light-grey);
    /* background: radial-gradient(at center top, var(--light-grey), var(--white)); */
}

.grey-qoute .q-img{
    display: flex;
    width: 96px;
    height: 96px;
    background-color: var(--light-grey);
    border: 1px solid var(--light-grey);
    border-radius: 150px;
    padding: 20px;
    box-shadow: 0px 0px 40px #bebebe;
}

.q-img img{
    object-fit: contain;
}

.q-negmargin{
    margin-top: -48px;
}


/* contact page */

.mymargin {
    height: 4vh;
}

.contact-container {
    background: radial-gradient(at center top, #4c1356, #290b4d);

}

.contact-top {
    display: flex;
    flex-direction: row-reverse;
}

.contact-left {
    flex: 1.2;
    padding-bottom: 5vh;
}

.contact-left-inner {
    padding-top: 20vh;
    padding-left: 4vw;
    padding-right: 4vw;
}

.contact-left h1 {
    font-family: 'poppins';
    font-weight: 300;
    font-size: 1.1rem;
    color: var(--white);

}

.contact-left h2 {
    margin-top: 2vh;
    margin-bottom: 4vh;
    font-family: 'poppins';
    font-weight: 300;
    font-size: 1.1rem;
    color: var(--white);
}

.contact-left textarea {
    margin-top: 2vh;
    margin-bottom: 4vh;
    font-family: 'poppins';
    text-align: left;
    font-weight: 300;
    font-size: 1.1rem;
    border: 2px solid var(--white);
    margin-top: 1.5vh;
    margin-bottom: 1.5vh;
    padding: 8px;
    border-radius: 4px;
    width: 100%;
    resize: none;
}



.contact-left textarea:focus,
select {
    border: 2px solid var(--light-purple);
    outline-color: var(--light-purple);
}

.form-inner-horizontal {
    display: flex;
    flex-direction: column;
}

.f-i-vertical {
    display: flex;
    flex-direction: row;
}

.contact-right {
    flex: 1.2;
}

.i-i-f {
    flex: 1;
}

.i-i-f-s {
    flex: 0.2;
}

.form-main * {
    font-family: 'poppins';
    font-weight: 300;

}


.form-main input[type="text"] {
    border: 2px solid var(--white);
    margin-top: 1.5vh;
    margin-bottom: 3.5vh;
    padding: 12px;
    border-radius: 4px;
    width: 100%;
}

.form-main input[type="text"]:focus {
    border: 2px solid var(--light-purple);
    margin-top: 1.5vh;
    margin-bottom: 3.5vh;
    padding: 12px;
    border-radius: 4px;
    width: 100%;
    outline-color: var(--light-purple);

}

.form-main input[type="email"] {
    border: 2px solid var(--white);
    margin-top: 1.5vh;
    margin-bottom: 3.5vh;
    padding: 12px;
    border-radius: 4px;
    width: 100%;
}

.form-main input[type="email"]:focus {
    border: 2px solid var(--white);
    margin-top: 1.5vh;
    margin-bottom: 3.5vh;
    padding: 12px;
    border-radius: 4px;
    width: 100%;
    outline-color: var(--light-purple);

}


.form-main input[type="number"] {
    border: 2px solid var(--white);
    margin-top: 1.5vh;
    margin-bottom: 3.5vh;
    padding: 12px;
    border-radius: 4px;
    width: 100%;
}

.form-main input[type="number"]:focus {
    border: 2px solid var(--white);
    margin-top: 1.5vh;
    margin-bottom: 3.5vh;
    padding: 12px;
    border-radius: 4px;
    width: 100%;
    outline-color: var(--white);

}
 

.infotext {
    font-size: 10px;
    font-weight: 300;
    color: var(--white);
}

.check-inner {
    display: flex;
    flex-direction: row;
    line-height: 1.2;
    font-size: 1.1rem;
}

label{
    color: var(--white);
}
.check-inner label {
    flex: 7;
    line-height: 1.5;
    margin-top: -2px;
    font-size: 1rem;
    color: var(--white);
}

.check-inner span {
    cursor: pointer;
    flex: 7;
    line-height: 1.5;
    margin-top: -2px;
    color: var(--pink);
}

.check-inner input[type="checkbox"] {
    flex: 1;
    appearance: none;
    max-width: 20px;

    width: 20px;
    height: 20px;
    border: 2px solid #a1a1a1;
    background-clip: content-box;
    padding: 3px;
    justify-content: center;
    margin: 0px;
    border-radius: 4px;
    margin-right: 1.5vw;
    transition: 0.4s;
}

.check-inner input[type="checkbox"]:checked {
    appearance: none;
    flex: 1;
    max-width: 20px;
    width: 20px;
    height: 20px;
    border: 2px solid var(--white);
    background-color: var(--pink);
    background-clip: content-box;
    border-radius: 4px;
    padding: 3px;
    transition: 0.4s;
}

.mybuttoncontainer {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.contact-left input[type="submit"] {
    align-items: center;
    font-size: 1.2rem;
    width: fit-content;
    font-weight: 600px;
    background-color: var(--pink);
    border-color: var(--pink);
    color: var(--white);
    border-width: 2px;
    border-style: solid;
    border-radius: 26px;
    margin-top: 24px;
    padding: 16px 6vw;
    font-family: 'Poppins', sans-serif;
    transition: 0.4s;
}

.contact-left input[type="submit"]:hover {
    display: flex;
    font-size: 1.2rem;
    width: fit-content;
    font-weight: 600px;
    color: var(--pink);
    background-color: var(--white);
    border-color: var(--pink);
    border-width: 2px;
    border-style: solid;
    border-radius: 26px;
    margin-top: 24px;
    padding: 16px 6vw;
    font-family: 'Poppins', sans-serif;
    transition: 0.2s;
}

/* contact-right */

.contact-right-inner {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    padding-top: 20vh;
    padding-left: 8vw;
}

.contact-right-inner h1 {
    color: var(--white);
    font-family: 'poppins';
    font-weight: 500;
    margin-top: -8px;
    margin-bottom: 2vh;
}

.contact-right-inner h2 {
    color: var(--white);
    font-family: 'poppins';
    font-weight: 300;
    font-size: 1rem;
    margin-bottom: 2vh;
}


.contact-right-inner img {
    margin-bottom: 8vh;
    object-fit: scale-down;
    width: 100%;
    height: auto;
}


/* animation reveal */
.reveal-left{
    position: relative;
    transform: translateX(-150px);
    opacity: 0;
    transition: 1s all ease;
  }
  .reveal-left.active{
    transform: translateY(0);
    opacity: 1;
  }

  .reveal-right{
    position: relative;
    transform: translateX(150px);
    opacity: 0;
    transition: 1s all ease;
  }
  .reveal-right.active{
    transform: translateY(0);
    opacity: 1;
  }

  .reveal-top{
    position: relative;
    transform: translateY(150px);
    opacity: 0;
    transition: 1s all ease;
  }
  .reveal-top.active{
    transform: translateY(0);
    opacity: 1;
  }


  @media only screen and (max-width: 1097px){

    .livenbrathe-trans {
        height: auto;
        padding-left: 8vw;
        padding-right: 8vw;
        background-color: transparent;
        color: var(--dark-grey);
        font-size: 1.7rem;
        text-align: center;
        font-weight: 600;
        line-height: 1.2;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .abc{

    }
  .mytop-sprints-2 {
    display: flex;
    flex-direction: row;
    padding-left: 5vw;
    padding-right: 5vw;
    padding-top: 7vh;
    padding-bottom: 7vh;
    column-gap: 3vw;
    background-color: transparent;
}



.ds-do-dont {
    display: grid;
    flex-direction: row;
    padding-left: 5vw;
    padding-right: 5vw;
    grid-template-columns: 1fr 1fr;
    padding-bottom: 8vh;
}

.ds-do {
    margin-right: 2vw;
}

.ds-dont {
    padding-left: 8vw;
}

.ds-do,
.ds-dont {}

.ds-do h1 {
    font-size: 2.5rem;
    line-height: 1.2;
    padding-left: 2vw;
    margin-bottom: 5vh;
    font-weight: 700;
    font-family: 'poppins';
}

.ds-do h1 span {
    font-family: 'poppins';
    color: var(--pink);
}

.ds-dont h1 {
    font-size: 2.5rem;
    line-height: 1.2;
    margin-bottom: 5vh;
    font-weight: 700;
    font-family: 'poppins';
}

.ds-dont h1 span {
    font-family: 'poppins';
    color: var(--purple);
}


.des-container {
    margin-left: 3vw;
    margin-right: 3vw;
    margin-top: 1vh;
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.des-item {
    display: flex;
    padding: 16px;

}

.des-left {
    background-color: transparent;
}

.des-left img {
    margin-right: 12px;
    padding: 16px;
    border-color: var(--purple);
    background-color: transparent;
    border-width: 1px;
    border-style: solid;
    border-radius: 16px;
    box-shadow: 0px 0px 50px var(--light-purple-trans), 0px 0px 50px var(--light-purple-trans) inset;
}

.des-right h3 {
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 1.2;
    padding-left: 18px;
    font-family: 'poppins';
    color: var(--light-black);
}

.des-right h2 {
    font-size: 0.9rem;
    padding-left: 18px;
    letter-spacing: 0.8px;
    margin-top: 4px;
    line-height: 1.7;
    color: var(--black);
    font-weight: 280;
    font-family: 'poppins';

}

.des-right h2 a {
    font-size: 1rem;
    line-height: 1.4;
    font-weight: normal;
    text-decoration: none;
    color: var(--pink);
    font-family: 'Poppins', sans-serif;

}

  }

  @media only screen and (max-width: 750px){

    .abc{

    }
    *{
        box-sizing: border-box;
    }
    .mytop-sprints {
        display: flex;
        flex-direction: column-reverse;
        padding-left: 4vw;
        padding-right: 4vw;
        padding-top: 20vh;
        padding-bottom: 2vh;
        column-gap: 0vw;
        background-color: var(--purple);
    }
    
    .mytop-left {
        display: flex;
        flex-direction: column;
        max-width: 100%;
        padding-top: 2vh;
    
    }
    
    .mytop-left h1 {
        font-family: 'poppins';
        font-weight: 700;
        font-size: 8vw;
        line-height: 1.2;
        text-align: center;
        color: var(--white);
    
    }
    
    .mytop-left h2 {
        font-family: 'poppins';
        font-weight: 400;
        font-size: 4vw;
        line-height: 1.1;
        padding-top: 2vh;
        padding-bottom: 2vh;
        text-align: center;
        color: var(--white);
        letter-spacing: 1.1px;
        opacity: 0.8;
    
    
    }
    
    
    .mytop-right {
        display: flex;
        width: 100%;
        margin-left: 0;
        align-items: center;
        justify-content: center;

    }
    
    .mytop-right img {
        display: flex;
        width: 40vw;
        height: 40vw;
    }
    
    .mytop-right-todo{
        display: flex;
        flex-direction: column;
        align-items: center;

    }
    .mytop-right-todo img {
        display: flex;
        width: 60vw;
        height: auto;
    }
    
    
    #btn-readmore-ds {
        display: flex;
        justify-content: center;
    }
    
    #btn-readmore-ds a {
        text-decoration: none;
        font-family: 'poppins';
        font-size: 0.8rem;
        font-weight: 400;
        color: var(--pink);
    }
    
    #btn-readmore-ds h4 {
        text-decoration: none;
        color: var(--pink);
        background-color: transparent;
        transition: 0.2s;
        padding: 6px 16px;
        font-size: 0.8rem;
    }
    
    #btn-readmore-ds h4:hover {
        text-decoration: none;
        color: var(--white);
        background-color: var(--pink);
        transition: 0.2s;
        padding: 6px 16px;
        font-size: 0.8rem;
    
    }
     
    
    #btn-readmore-ds .mainbutton:hover a {
        text-decoration: none;
        color: var(--white);
        transition: 0.2s;
    }
    
    .mytop-sprints-2 {
        display: flex;
        flex-direction: column-reverse;
        padding-left: 4vw;
        padding-right: 4vw;
        padding-top: 2vh;
        padding-bottom: 2vh;
        column-gap: 3vw;
        background-color: transparent;
    }
    
    .pro-box-points-ds {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-items: flex-start;
        margin-top: 2vh;
        margin-left: 12px;
    }
    
    .c-p-inner-ds {
        flex-direction: row;
        display: flex;
        padding-bottom: 2vh;
    }
    
    .c-p-inner-ds h2 {
        font-family: 'poppins';
        font-size: 1rem;
        font-weight: 400;
        flex-direction: row;
        text-align: left;
        display: flex;
        padding-top: 0.1vh;
        padding-bottom: 0.1vh;
        color: var(--mid-black);
    }
    
    .c-p-inner-ds img {
        width: 12px;
        height: 12px;
        padding: 4px;
        margin-right: 8px;
        margin-bottom: 0px;
        margin-top: 4px;
        background-color: var(--mid-purple);
        border-radius: 50px;
    }
    
    .mytop-sprints-2 .mytop-right img {
        display: flex;
        width: 90vw;
        height: auto;
        object-fit: scale-down;
    }
    
    .livenbrathe-trans {
        height: auto;
        padding-left: 0vw;
        padding-right: 0vw;
        margin: 4px;
        background-color: transparent;
        color: var(--dark-grey);
        font-size: 5vw;
        text-align: center;
        font-weight: 600;
        line-height: 1.1;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    
    .livenbrathe-trans h3 {
        color: var(--light-purple);
        font-size: 5vw;
        font-weight: 0;
        line-height: 1.2;
        padding-top: 8px;
        font-family: Arial, Helvetica, sans-serif;
        text-align: center;
    }
    
    .grey-gradient {
        background: radial-gradient(at center top, var(--light-grey), var(--white));
    }
    
    .des-container {
        margin-left: 6vw;
        margin-right: 6vw;
        margin-top: 1vh;
        display: grid;
        grid-template-columns: 1fr;
    }
    
    .des-item {
        display: flex;
        flex-direction: row;
        padding: 6px;
        justify-content: start;
        align-items: start; 
    }
    
    .des-left {
        background-color: transparent;
    }
    
    .des-left img {
        padding: 16px;
        border-color: var(--purple);
        background-color: transparent;
        border-width: 1px;
        border-style: solid;
        border-radius: 16px;
        margin: 0px;
        box-shadow: 0px 0px 50px var(--light-purple-trans), 0px 0px 50px var(--light-purple-trans) inset;
    }
    
    .des-right{
        display: flex;
        flex-direction: column;
        text-align: start;
        padding-left: 24px;
        justify-content: center;
    }


    .des-right h3 {
        font-size: 1.2rem;
        font-weight: 400;
        line-height: 1.1;
        padding-left: 0px;
        font-family: 'poppins';
        color: var(--light-black);
    }
    
    .des-right h2 {
        font-size: 0.8rem;
        padding-left: 0px;
        letter-spacing: 0.8px;
        margin-top: 4px;
        line-height: 1.7;
        color: var(--black);
        font-weight: 280;
        font-family: 'poppins';
    
    }
    
    .des-right h2 a {
        font-size: 0.8rem;
        line-height: 1.2;
        font-weight: normal;
        text-decoration: none;
        color: var(--pink);
        font-family: 'Poppins', sans-serif;
    
    }
    
    
    .ds-do-dont {
        display: grid;
        flex-direction: column;
        padding-left: 6vw;
        padding-right: 6vw;
        grid-template-columns: 1fr;
        padding-bottom: 2vh;
    }
    
    .ds-do {
        margin-right: 0vw;
        margin-bottom: 24px;
    }
    
    .ds-dont {
        padding-left: 0vw;
    }
    
    .ds-do,
    .ds-dont {}
    
    .ds-do h1 {
        font-size: 1.4rem;
        line-height: 1.2;
        padding-left: 2vw;
        margin-bottom: 3vh;
        font-weight: 700;
        text-align: center;
        font-family: 'poppins';
    }
    
    .ds-do h1 span {
        font-family: 'poppins';
        color: var(--pink);
    }
    
    .ds-dont h1 {
        font-size: 1.4rem;
        line-height: 1.2;
        margin-bottom: 3vh;
        font-weight: 700;
        text-align: center;
        font-family: 'poppins';
    }
    
    .ds-dont h1 span {
        font-family: 'poppins';
        color: var(--purple);
    }
    
    .c-p-inner-ds-pic,
    .c-p-inner-ds-puc {
        flex-direction: row;
        display: flex;
        padding-bottom: 0vh;
    }
    
    .c-p-inner-ds-pic h2,
    .c-p-inner-ds-puc h2 {
        font-family: 'poppins';
        font-size: 1rem;
        font-weight: 400;
        flex-direction: row;
        display: flex;
        padding-top: 0.1vh;
        padding-bottom: 0.1vh;
        color: var(--mid-black);
    }
    
    .c-p-inner-ds-pic img {
        width: 8px;
        height: 8px;
        padding: 4px;
        margin-right: 24px;
        margin-top: 9px;
        background-color: var(--white);
        border-radius: 50px;
        border: 1px solid var(--pink);
    }
    
    .c-p-inner-ds-puc img {
        width: 8px;
        height: 8px;
        padding: 4px;
        margin-right: 24px;
        margin-top: 5px;
        background-color: var(--white);
        border-radius: 50px;
        border: 1px solid var(--purple);
    }
    
    .livenbrathe-purple {
        padding-left: 4vw;
        padding-right: 4vw;
        background: radial-gradient(at center top, #4c1356, #290b4d);
        padding-top: 3vh;
        padding-bottom: 3vh;
        font-size: 1.3rem;
        text-align: center;
        font-weight: 600;
        line-height: 1.2;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    
    .livenbrathe-purple h1 {
        color: var(--white);
        font-size: 2rem;
        font-weight: 0;
        line-height: 1.4;
        padding-top: 16px;
        font-family: 'poppins';
        text-align: center;
    }
    
    .livenbrathe-purple h2 {
        color: var(--white);
        font-size: 2.5rem;
        font-weight: 0;
        line-height: 1.4;
        padding-top: 16px;
        font-family: 'poppins';
        text-align: center;
    }
    
    .livenbrathe-purple h3 {
        color: var(--white);
        font-size: 1.6rem;
        font-weight: 0;
        line-height: 1.4;
        padding-top: 16px;
        font-family: 'poppins';
        text-align: center;
    }
    
    .livenbrathe-purple img {
        width: 20vw;
    }
    
    #btn-readmore-ds-invert {
        display: flex;
        justify-content: left;
        margin-top: 16px;
    }
    
    #btn-readmore-ds-invert a {
        text-decoration: none;
        font-family: 'poppins';
        font-size: 1.3rem;
        font-weight: 500;
        color: var(--pink);
    }
    
    
    
    #btn-readmore-ds-invert h4:hover {
        text-decoration: none;
        color: var(--pink);
        background-color: transparent;
        transition: 0.2s;
        padding: 14px 42px;
        font-size: 1.3rem;
        font-weight: 500;
    
    }
    
    #btn-readmore-ds-invert h4 {
        text-decoration: none;
        color: var(--white);
        background-color: var(--pink);
        transition: 0.2s;
        padding: 14px 42px;
        font-size: 1.3rem;
        font-weight: 500;
    
    }
    
    
    
    
    #btn-readmore-ds-invert .mainbutton a {
        text-decoration: none;
        transition: 0.2s;
        color: var(--white);
    
    }
    
    
    #btn-readmore-ds-invert .mainbutton a:hover {
        text-decoration: none;
        transition: 0.2s;
        color: var(--pink);
    
    }
    
    .ds-organise{
        display: flex;
        flex-direction: column;
    }
    
    .organise-item{
        display: flex;
        flex-direction: column-reverse;
        padding-left: 6vw;
        padding-right: 6vw;
        padding-top: 5vh;
        padding-bottom: 5vh;
    }
    
    .organise-item-rev{
        display: flex;
        flex-direction: column;
        padding-left: 6vw;
        padding-right: 6vw;
        padding-top: 5vh;
        padding-bottom: 5vh;
    }
    
    
    .o-i-left {
        display: flex;
        flex-direction: column;
        row-gap: 3vh;
    }
    
    .o-i-left ol.a{
        display: list-item;
        list-style-type: decimal;
       
         
    
    }
    .o-i-left li {
        font-size: 2rem;
        font-weight: 600;
        font-family: 'poppins';
        color: var(--light-black); 
    }
    
    .o-i-left h1 {
        font-size: 1rem;
        font-weight: 280;
        font-family: 'poppins';
        color: var(--black);
    }
    
    .o-i-left h2 {
        font-size: 1rem;
        font-weight: 350;
        font-family: 'poppins';
        color: var(--black);
    }
    
    .organise-item-rev .o-i-left h2 {
        font-size: 1rem;
        font-weight: 350;
        font-family: 'poppins';
        color: var(--black);
        margin-top: -12px;
        margin-bottom: 12px;
    }
    
    .o-i-left h3 {
        font-size: 1.5rem;
        font-weight: 400;
        line-height: 1.2;
        font-family: 'poppins';
        color: var(--light-black);
    }
    
    #inner-ds{
        display: flex;
        flex-direction: column;
    }
    
    
    .c-p-inner-ds-2 {
        flex-direction: row;
        display: flex;
        padding-bottom: 0.5vh;
    }
     
    
    .c-p-inner-ds-2 img {
        width: 12px;
        height: 12px;
        padding: 4px;
        margin-right: 8px;
        margin-bottom: 0px;
        margin-top: 4px;
        background-color: var(--mid-purple);
        border-radius: 50px;
    }
    
    .c-p-inner-ds-2 h2 {
        font-family: 'poppins';
        font-size: 0.9rem;
        font-weight: 300;
        flex-direction: row;
        display: flex;
        padding-bottom: 0.1vh;
        color: var(--mid-black);
    }
    
    .inner-ds-item{
        display: flex;
        flex-direction:row;
        margin-bottom: 0.2vh;
    }
    #inner-ds #inner-inner-ds{
        display: flex;
        flex-direction: row;
        padding-left: 4vw;
    }
    
    .c-p-inner-i-ds-puc img {
        width: 4px;
        height: 4px;
        padding: 4px;
        margin-right: 4px;
        margin-top: 5px;
        background-color: var(--white);
        border-radius: 50px;
        border: 1px solid var(--purple);
    }
    
    .o-i-right{
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        margin-bottom: 16px;
    
    }
    
    .o-i-right-smaller{
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        margin-bottom: 16px;
    
    }
    .o-i-right img,.o-i-right-smaller img{
        width: 60vw;
        height: auto;
        object-fit: contain;
    }
    
    .o-i-right .img,.o-i-right-smaller img{
        width: 60vw;
        height: auto;
        padding-right: 0vw;
        object-fit: contain;
    }
    
    .ds-heading{
        font-family: 'poppins';
        font-size: 1.2rem;
        text-align: center;
        padding: 0vh;
        font-weight: 500;
        color: var(--light-black);
    }
    .text-row{
        display: grid;
        grid-template-columns: 1fr;
        padding-left: 8vw;
        padding-right: 8vw;
        padding-bottom: 4vh;
        column-gap: 5vw;
    }
    
    .text-row .text-item h2{
        font-size: 1rem;
        padding-left: 0px;
        letter-spacing: 0.8px;
        margin-top: 4px;
        line-height: 1.7;
        color: var(--black);
        font-weight: 280;
        font-family: 'poppins';
    }
    
    .grey-qoute {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding-top: 10vh;
        justify-content: center;
        background-color: var(--light-grey);
        /* background: radial-gradient(at center top, var(--light-grey), var(--white)); */
    }
    
    .grey-qoute .q-img{
        display: flex;
        width: 96px;
        height: 96px;
        align-items: center;
        justify-content: center;
        background-color: var(--light-grey);
        border: 1px solid var(--light-grey);
        border-radius: 150px;
        padding: 00px;
        box-shadow: 0px 0px 40px #bebebe;
    }
    
    .q-img img{
        object-fit: contain;
    }
    
    .q-negmargin{
        margin-top: -48px;
    }
    
    
    /* contact page */
    
    .mymargin {
        height: 4vh;
    }
    
    .contact-container {
        background: radial-gradient(at center top, #4c1356, #290b4d);
    
    }
    
    .contact-top {
        display: flex;
        flex-direction: column;
    }
    
    .contact-left {
        flex: 1.2;
        padding-bottom: 5vh;
    }
    
    .contact-left-inner {
        padding-top: 4vh;
        padding-left: 4vw;
        padding-right: 4vw;
    }
    
    .contact-left h1 {
        font-family: 'poppins';
        font-weight: 300;
        font-size: 1rem;
        color: var(--white);
    
    }
    
    .contact-left h2 {
        margin-top: 2vh;
        margin-bottom: 4vh;
        font-family: 'poppins';
        font-weight: 300;
        font-size: 1rem;
        color: var(--white);
    }
    
    .contact-left textarea {
        margin-top: 2vh;
        margin-bottom: 4vh;
        font-family: 'poppins';
        text-align: left;
        font-weight: 300;
        font-size: 1rem;
        border: 2px solid var(--white);
        margin-top: 1.5vh;
        margin-bottom: 1.5vh;
        padding: 8px;
        border-radius: 4px;
        width: 100%;
        resize: none;
    }
    
    
    
    .contact-left textarea:focus,
    select {
        border: 2px solid var(--light-purple);
        outline-color: var(--light-purple);
    }
    
    .form-inner-horizontal {
        display: flex;
        flex-direction: column;
    }
    
    .f-i-vertical {
        display: flex;
        flex-direction: column;
    }
    
    .contact-right {
        flex: 1;
    }
    
    .i-i-f {
        flex: 1;
    }
    
    .i-i-f-s {
        flex: 0.2;
    }
    
    .form-main * {
        font-family: 'poppins';
        font-weight: 300;
    
    }
    
    
    .form-main input[type="text"] {
        border: 2px solid var(--white);
        margin-top: 1.5vh;
        margin-bottom: 3.5vh;
        padding: 12px;
        border-radius: 4px;
        width: 100%;
    }
    
    .form-main input[type="text"]:focus {
        border: 2px solid var(--light-purple);
        margin-top: 1.5vh;
        margin-bottom: 3.5vh;
        padding: 12px;
        border-radius: 4px;
        width: 100%;
        outline-color: var(--light-purple);
    
    }
    
    .form-main input[type="email"] {
        border: 2px solid var(--white);
        margin-top: 1.5vh;
        margin-bottom: 3.5vh;
        padding: 12px;
        border-radius: 4px;
        width: 100%;
    }
    
    .form-main input[type="email"]:focus {
        border: 2px solid var(--white);
        margin-top: 1.5vh;
        margin-bottom: 3.5vh;
        padding: 12px;
        border-radius: 4px;
        width: 100%;
        outline-color: var(--light-purple);
    
    }
    
    
    .form-main input[type="number"] {
        border: 2px solid var(--white);
        margin-top: 1.5vh;
        margin-bottom: 3.5vh;
        padding: 12px;
        border-radius: 4px;
        width: 100%;
    }
    
    .form-main input[type="number"]:focus {
        border: 2px solid var(--white);
        margin-top: 1.5vh;
        margin-bottom: 3.5vh;
        padding: 12px;
        border-radius: 4px;
        width: 100%;
        outline-color: var(--white);
    
    }
     
    
    .infotext {
        font-size: 10px;
        font-weight: 300;
        color: var(--white);
    }
    
    .check-inner {
        display: flex;
        flex-direction: row;
        line-height: 1.2;
        font-size: 1.1rem;
    }
    
    label{
        color: var(--white);
    }
    .check-inner label {
        flex: 7;
        line-height: 1.5;
        margin-top: -2px;
        font-size: 1rem;
        color: var(--white);
    }
    
    .check-inner span {
        cursor: pointer;
        flex: 7;
        line-height: 1.5;
        margin-top: -2px;
        color: var(--pink);
    }
    
    .check-inner input[type="checkbox"] {
        flex: 1;
        appearance: none;
        max-width: 20px;
    
        width: 20px;
        height: 20px;
        border: 2px solid #a1a1a1;
        background-clip: content-box;
        padding: 3px;
        justify-content: center;
        margin: 0px;
        border-radius: 4px;
        margin-right: 1.5vw;
        transition: 0.4s;
    }
    
    .check-inner input[type="checkbox"]:checked {
        appearance: none;
        flex: 1;
        max-width: 20px;
        width: 20px;
        height: 20px;
        border: 2px solid var(--white);
        background-color: var(--pink);
        background-clip: content-box;
        border-radius: 4px;
        padding: 3px;
        transition: 0.4s;
    }
    
    .mybuttoncontainer {
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    
    .contact-left input[type="submit"] {
        align-items: center;
        font-size: 1.2rem;
        width: fit-content;
        font-weight: 600px;
        background-color: var(--pink);
        border-color: var(--pink);
        color: var(--white);
        border-width: 2px;
        border-style: solid;
        border-radius: 26px;
        margin-top: 24px;
        padding: 16px 6vw;
        font-family: 'Poppins', sans-serif;
        transition: 0.4s;
    }
    
    .contact-left input[type="submit"]:hover {
        display: flex;
        font-size: 1.2rem;
        width: fit-content;
        font-weight: 600px;
        color: var(--pink);
        background-color: var(--white);
        border-color: var(--pink);
        border-width: 2px;
        border-style: solid;
        border-radius: 26px;
        margin-top: 24px;
        padding: 16px 6vw;
        font-family: 'Poppins', sans-serif;
        transition: 0.2s;
    }
    
    /* contact-right */
    
    

    .contact-right-inner {
        display: flex;
        flex-direction: column-reverse;
        justify-content: center;
        align-items: center;
        padding-top: 4vh;
        padding-left: 4vw;
        padding-right: 4vw;
    }
    
    .contact-right-inner h1 {
        color: var(--white);
        font-family: 'poppins';
        font-weight: 500;
        margin-top: -8px;
        margin-bottom: 2vh;
    }
    
    .contact-right-inner h2 {
        color: var(--white);
        font-family: 'poppins';
        font-weight: 300;
        font-size: 1rem;
        margin-bottom: 2vh;
    }
    
    
    .contact-right-inner img {
        margin-bottom: 8vh;
        object-fit: scale-down;
        width: 100%;
        height: auto;
    }
    
    
    /* animation reveal */
    .reveal-left{
        position: relative;
        transform: translateX(-150px);
        opacity: 0;
        transition: 1s all ease;
      }
      .reveal-left.active{
        transform: translateY(0);
        opacity: 1;
      }
    
      .reveal-right{
        position: relative;
        transform: translateX(150px);
        opacity: 0;
        transition: 1s all ease;
      }
      .reveal-right.active{
        transform: translateY(0);
        opacity: 1;
      }
    
      .reveal-top{
        position: relative;
        transform: translateY(150px);
        opacity: 0;
        transition: 1s all ease;
      }
      .reveal-top.active{
        transform: translateY(0);
        opacity: 1;
      }

  }