/* >> HEADER << */

.home-header {
    background-color: #F6F6F6;
    width: 100%;
    height: 100%;
    padding: 1% 8%;
    display: flex;

    align-items: center;
   
}

.home-header > div:first-child {
    display: flex;
    width: 20%;
}

.home-header > div:nth-child(2) {
    display: flex;
    width: 60%;
    justify-content: flex-end;
    align-items: center;
    gap: 1rem;
}

.home-header > div:nth-child(2) p {
    color: #8F1D90;
    margin: 0;
    font-size: 17px;
}

.home-header > div:last-child {
    display: flex;
    width: 20%;
    padding-left: 1rem;

}

.create-map-btn{
     background-color:#8F1D90;
     border-radius: 20px;
     width: 200px;
     border: none;
     color: white!important;
     padding: 15px;
     font-size: 18px;
     font-weight: 600;
}

.create-map-btn:hover{
    color: #8F1D90!important;
    border: 1px solid #8F1D90;
    background-color: #fff;
}

.btn-logout{
    width: 100px;
    border-radius: 20px;
    border: 1px solid #8F1D90;
}

.btn-logout:hover{
    background-color: #8F1D90;
    color: #fff!important;
}

.home-head-nav > ul{
list-style-type: none;
margin: 0;
padding: 0;
}

.home-head-nav > ul > li{
    display: inline;
}

.home-head-nav > ul > li > a{
    padding: 8px;
    color: #8F1D90;
}

/*# ------------------------------------------------------------------------------------------ */

/* HEADER */
/* >> FOOTER << */


footer {
    width: 100%;
    height: 100%;
}

.footer-copyright{
    width: 100%;
    background-color: #8F1D90;
    text-align: center;
    color: #fff;
    height: 60px;
    padding: 20px;
}

.footer-main{
    background-color: #730375;
    color: #fff;
    padding: 10px;
    margin: auto;
    display: flex;
    flex-direction: row;
    justify-content: center;
    flex-wrap: wrap;
}

.footer-img, .footer-about, .footer-privacy, .footer-social{
    width: 330px;
    padding: 20px;
    text-align: left;
}

.footer-img > img{
    width: 150px;
    margin-bottom: 20px;
}

.footer-about > p > a, .footer-privacy > p > a{
    color: #fff;
}

.footer-about > p > a:hover, .footer-privacy > p > a:hover{
    text-decoration: underline;
}

.footer-social-icons{
    display: flex;
    flex-direction: row;
}

.footer-social-icon{
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: #8F1D90;
    display: flex;
    align-items: center;
    justify-content: center;
}

.footer-social-icon > a{
    color: #fff;
}

/*
footer div p {
    color: white;
    margin-bottom: 0px;
 }

footer > div:first-child {
    width: 100%;
    height: 100%;
    background-color: #730375;
}

footer > div:first-child >div {
    display: flex;
    width: 100%;
    height: 100%;
    padding: 2% 14%;
    gap: 2rem;
    margin-top: 200px;
}

footer > div:first-child > div > div {
    display: flex;
    width: 25%;
    height: 100%;
    flex-direction: column;
    justify-content: center;

}

footer > div:first-child > div > div > img {
    width: 50%;
    margin-bottom: 6%;
}

footer > div:last-child {
    width: 100%;
    height: 100%;
    background-color: #8F1D90;
    display: flex;
    justify-content: center;
    padding: 1%;
}

footer > div:last-child div {
    width: 100%;
    display: flex;
    justify-content: center;
} */

/*# ------------------------------------------------------------------------------------------ */

/* HEADER */
/* FOOTER  */
/* >> MAIN - SECTION 1 << */

main {
    width: 100%;
    height: 100%;
}

main .firstSection {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    padding: 8% 10% 10% 10%;
    background-image: url('../img/content/bg-section1-homepage.png');
    background-size: cover;
}

main .firstSection > div {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 60%;
    gap: 2rem;
}

main .firstSection > div > div {
   
}

main .firstSection > div > div p, h2 {
   /* color: white; */
   text-align: center;
}

main .firstSection > div > div button {
     width: 100%;
     background-color:#8F1D90;
     border-radius: 20px;
     border: none;
     color: white;
     padding: 10px 20px;
     font-size: 18px;
     font-weight: 600;
}

/*# ------------------------------------------------------------------------------------------ */

/* HEADER */
/* FOOTER  */
/*  MAIN - SECTION 1  */
/* >> MAIN - SECTION 2 << */

main .secondSection{
    width: 100%;
    height: 100%;
    display: flex;
    padding: 4% 0;
    background-color: white;
}

main .secondSection > div:first-child {

}

main .secondSection > div:last-child  {
    padding: 0 10%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
}

main .secondSection > div:last-child > div  {
 
}

.secondSection > div:last-child > div h2, .secondSection > div:last-child > div  p  {
    color: #370D73;
    text-align: start;
    font-size: 1.2rem;
}

main .secondSection > div:last-child > div h2  {
    text-transform: uppercase;
    font-size: 2.2rem;
    font-weight: 700;
}

main .secondSection > div:last-child > div button {
    
    width: 100%;
    background-color:#8F1D90;
    border-radius: 20px;
    border: none;
    color: white;
    padding: 10px 20px;
    font-size: 18px;
    font-weight: 600;

}

/*# ------------------------------------------------------------------------------------------ */

/* HEADER */
/* FOOTER  */
/*  MAIN - SECTION 1  */
/*  MAIN - SECTION 2  */
/* >> MAIN - SECTION 3 << */

main .thirdSection {
    width: 100%;
    height: 100%;
    display: flex;
    padding: 6% 12%;
    background-color: #f3f3f3;
}

main .thirdSection > div{
    width: 100%;
    height: 100%;
}

main .thirdSection > div > div {
    display: flex;
    margin-bottom: 6%;
}

main .thirdSection > div > div:first-child {

}

main .thirdSection > div > div:first-child > div:first-child {
    border: 1px solid #F28D8D;
    padding: 10px;
}

main .thirdSection > div > div:first-child > div:last-child {
    padding: 0 0 0 8%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-around;
}

main .thirdSection > div > div:first-child > div:last-child h2, main .thirdSection > div > div:first-child > div:last-child  p  {
    color: #370D73;
    text-align: start;
    font-size: 1.2rem;
}

main .thirdSection > div > div:first-child > div:last-child h2{
    text-transform: uppercase;
    font-size: 2.2rem;
    font-weight: 700;
}

main .thirdSection > div > div:first-child > div:last-child p{
    color: #370D73;
    margin-top: -6%;
}

main .thirdSection > div > div:first-child > div:last-child button {
    width: 100%;
    background-color:#8F1D90;
    border-radius: 20px;
    border: none;
    color: white;
    padding: 10px 20px;
    font-size: 18px;
    font-weight: 600;
}

main .thirdSection > div > div:last-child {
    margin-top: 1rem;
    background-color: #8F1D90;
    border-radius: 20px;
    margin-bottom: 0;
}

main .thirdSection > div > div:last-child > div:last-child {
    padding: 4% 6% 0 6%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

main .thirdSection > div > div:last-child > div:last-child h2, main .thirdSection > div > div:last-child > div:last-child p  {
    color: white;
    text-align: start;
    font-size: 1.2rem;
}

main .thirdSection > div > div:last-child > div:last-child h2{

    font-size: 2.2rem;
    font-weight: 700;
}

main .thirdSection > div > div:last-child > div:last-child >div:last-child {
    width: 100%;
    display: flex;
    flex-direction: column;
}

main .thirdSection > div > div:last-child > div:last-child input {
    background-color: #fff;
    border: none;
    border-radius: 20px;
    color: #8f1d90;
    padding: 0 4%;
    height: 60px;
}

main .thirdSection > div > div:last-child > div:last-child input:last-child  {
    margin-top: 1rem;
}

main .thirdSection > div > div:last-child > div:last-child input::placeholder {
    color:#8F1D90;
    font-size: 1.4rem;
    font-weight: 500;
}

/*# ------------------------------------------------------------------------------------------ */

/* HEADER */
/* FOOTER  */
/*  MAIN - SECTION 1  */
/*  MAIN - SECTION 2  */
/* MAIN - SECTION 3*/
/* >> MAIN - SECTION 4 <<*/

main .fourthSection {
    width: 100%;
    height: 100%;
    display: flex;
    padding: 6% 12%;
    background-color: #531554;
}

main .fourthSection > div{
    width: 100%;
    height: 100%;
    display: flex;
    gap: 2rem;
}

main .fourthSection > div > div {
   display: flex;
   flex-direction: column;
   align-items: flex-start;
}

main .fourthSection > div > div:last-child {
    border: 1px solid #F28D8D;
     padding: 10px;
 }

main .fourthSection > div > div p, 
main .fourthSection > div > div h2 {
   color: white;
}

main .fourthSection > div > div p  {
    font-size: 1.2rem;
}

main .fourthSection > div > div h2 {
    font-size: 2.2rem;
    font-weight: 700;
    text-align: start;
}

main .fourthSection > div > div button {
     background-color:#8F1D90;
     border-radius: 20px;
     border: none;
     color: white;
     padding: 10px 20px;
     font-size: 18px;
     font-weight: 600;
}

/*# ------------------------------------------------------------------------------------------ */

/* HEADER */
/* FOOTER  */
/*  MAIN - SECTION 1  */
/*  MAIN - SECTION 2  */
/* MAIN - SECTION 3*/
/* MAIN - SECTION 4 */
/* >> MAIN - SECTION 5 <<*/

main .fifthSection {
    width: 100%;
    height: 100%;
    display: flex;
    padding: 6% 12%;
    background-color: #f3f3f3;
}

main .fifthSection > div{
    width: 100%;
    height: 100%;
    display: flex;
    gap: 16rem;
}

main .fifthSection > div > div {
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   justify-content: space-around;
}

main .fifthSection > div > div p, 
main .fifthSection > div > div h2 {
   color: #8F1D90;
}

main .fifthSection > div > div p  {
    font-size: 1.2rem;
    margin-top: -12%;
}

main .fifthSection > div > div h2 {
    font-size: 2.2rem;
    font-weight: 700;
    text-transform: uppercase;

}

main .fifthSection > div > div button {
     background-color:#8F1D90;
     border-radius: 20px;
     border: none;
     color: white;
     padding: 10px 20px;
     font-size: 18px;
     font-weight: 600;
}

/*# ------------------------------------------------------------------------------------------ */

/* HEADER */
/* FOOTER  */
/*  MAIN - SECTION 1  */
/*  MAIN - SECTION 2  */
/* MAIN - SECTION 3*/
/* MAIN - SECTION 4 */
/* MAIN - SECTION 5*/
/* >> MAIN - SECTION 6 <<*/

main .sixthSection {
    width: 100%;
    height: 100%;
    display: flex;
    padding: 6% 22%;
    background-color: white;
}

main .sixthSection > div{
    width: 100%;
    height: 100%;
    display: flex;
    gap: 4rem;
}

main .sixthSection > div > div {
   display: flex;
   flex-direction: column;
   align-items: flex-start;
}

main .sixthSection > div > div p, 
main .sixthSection > div > div h2 {
   color: #370D73;
}

main .sixthSection > div > div p  {
    font-size: 1.2rem;
}

main .sixthSection > div > div h2 {
    font-size: 2.2rem;
    font-weight: 700;
    text-transform: uppercase;
}

main .sixthSection > div > div button {
     background-color:#8F1D90;
     border-radius: 20px;
     border: none;
     color: white;
     padding: 10px 20px;
     font-size: 18px;
     font-weight: 600;
}

/*# ------------------------------------------------------------------------------------------ */

/* HEADER */
/* FOOTER  */
/*  MAIN - SECTION 1  */
/*  MAIN - SECTION 2  */
/* MAIN - SECTION 3*/
/* MAIN - SECTION 4 */
/* MAIN - SECTION 5*/
/* MAIN - SECTION 6 */
/* >> MAIN - SECTION 7 <<*/


main .seventhSection {
    width: 100%;
    height: 100%;
    display: flex;
    padding: 4% 12%;
    background-color: #f3f3f3;
}

main .seventhSection > div{
    width: 100%;
    height: 100%;
    display: flex;
    gap: 2rem;
}

main .seventhSection > div > div {
   display: flex;
   flex-direction: column;
   align-items: flex-start;
}

main .seventhSection > div > div p, 
main .seventhSection > div > div h2 {
   color: #370D73;
}

main .seventhSection > div > div p  {
    font-size: 1.2rem;
    width: 84%;

}

main .seventhSection > div > div h2 {
    font-size: 2.2rem;
    font-weight: 700;
    margin-bottom: 1rem;
    text-transform: uppercase;
}

main .seventhSection > div > div button {
     background-color:#8F1D90;
     border-radius: 20px;
     border: none;
     color: white;
     padding: 10px 20px;
     font-size: 18px;
     font-weight: 600;
}


main .seventhSection > div > div:first-child {
    padding-top: 2%;
}

main .seventhSection > div > div:last-child {
    width: 198rem;
    height: 24rem;
}

main .seventhSection > div > div:last-child > div {
    width: 100%;
    height: 100%;
    display: flex;
    gap: 2rem;
}

main .seventhSection > div > div:last-child > div > div {
    background-color: #F28D8D;
    border-radius: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-around;
}

main .seventhSection > div > div:last-child > div > div > div {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

main .seventhSection > div > div:last-child > div > div > div img {
        border-radius: 50%;
}

main .seventhSection > div > div:last-child > div > div > div p {
    color: #E5E5E5;
}

main .seventhSection > div > div:last-child > div > div > div h5 {
    color: white;
    text-align: center;
}

/*# ------------------------------------------------------------------------------------------ */

/* HEADER */
/* FOOTER  */
/*  MAIN - SECTION 1  */
/*  MAIN - SECTION 2  */
/* MAIN - SECTION 3*/
/* MAIN - SECTION 4 */
/* MAIN - SECTION 5*/
/* MAIN - SECTION 6 */
/* MAIN - SECTION 7 */
/* >> MAIN - SECTION 8 <<*/

main .eighthSection {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    background-color: #f3f3f3;
    flex-direction: column;
}

main .eighthSection > div {
    position: relative;
    height: 28rem;
}

main .eighthSection > div > div:first-child {
    width: 100%;
    height: 4rem;

}

main .eighthSection > div > div:nth-child(2) {
    width: 100%;
    position: absolute;
}

main .eighthSection > div > div:nth-child(2) > div {
    background-image: url('../img/content/bg-section9-homepage.png');
    background-size: cover;
    height: 29rem;
    padding: 8% 30%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

main .eighthSection > div >  div:last-child {
    width: 100%;
    height: 4rem;
}

main .eighthSection > div > div:nth-child(2) > div > div:first-child {
    
}

main .eighthSection > div > div:nth-child(2) > div > div:first-child h2{
    font-size: 2.2rem;
}

main .eighthSection > div > div:nth-child(2) > div > div:nth-child(2) {
    margin-bottom: 2rem;
}

main .eighthSection > div > div:nth-child(2) > div > div:nth-child(2) p {
    color: white;
}

main .eighthSection > div > div:nth-child(2) > div > div:last-child {

}

main .eighthSection > div > div:nth-child(2) > div > div:last-child button {
    background-color: #F28D8D;
    border: none;
    border-radius: 20px;
     color: white;
     padding: 8px;
     font-size: 18px;
     font-weight: 600;
}



/*# ------------------------------------------------------------------------------------------ */

/* HEADER */
/* FOOTER  */
/*  MAIN - SECTION 1  */
/*  MAIN - SECTION 2  */
/* MAIN - SECTION 3*/
/* MAIN - SECTION 4 */
/* MAIN - SECTION 5*/
/* MAIN - SECTION 6 */
/* MAIN - SECTION 7 */
/* MAIN - SECTION 8 */
/* >> MAIN - SECTION 9 <<*/

main .ninethSection {
    width: 100%;
    height: 100%;
    display: flex;
    padding: 10% 12%;
    background-color: white;
}

main .ninethSection > div{
    width: 100%;
    height: 100%;
    display: flex;
    gap: 2rem;
}

main .ninethSection > div > div {
   display: flex;
   flex-direction: column;
   align-items: flex-start;
}

main .ninethSection > div > div:last-child {
    border: 1px solid #F28D8D;
     padding: 10px;
 }

main .ninethSection > div > div p, 
main .ninethSection > div > div h2 {
   color: #8F1D90;
}

main .ninethSection > div > div p  {
    font-size: 1.2rem;
}

main .ninethSection > div > div h2 {
    font-size: 2.2rem;
    font-weight: 700;
    text-align: start;
    text-transform: uppercase;
}

main .ninethSection > div > div button {
     background-color:#8F1D90;
     border-radius: 20px;
     border: none;
     color: white;
     padding: 10px 20px;
     font-size: 18px;
     font-weight: 600;
}

/*# ------------------------------------------------------------------------------------------ */

/* HEADER */
/* FOOTER  */
/*  MAIN - SECTION 1  */
/*  MAIN - SECTION 2  */
/* MAIN - SECTION 3*/
/* MAIN - SECTION 4 */
/* MAIN - SECTION 5*/
/* MAIN - SECTION 6 */
/* MAIN - SECTION 7 */
/* MAIN - SECTION 8 */
/* MAIN - SECTION 9 */
/* >> MAIN - SECTION 10 << */

main .tenthSection {
    width: 100%;
    height: 100%;
    display: flex;
    padding: 8% 12%;
    background-color: #f3f3f3;
}

main .tenthSection > div{
    width: 100%;
    height: 100%;
    display: flex;
    gap: 6rem;
}

main .tenthSection > div > div {
   display: flex;
   flex-direction: column;
   align-items: flex-start;
}

main .tenthSection > div > div:first-child {
    border: 1px solid #F28D8D;
    padding: 10px;
}

main .tenthSection > div > div p, 
main .tenthSection > div > div h2 {
   color: #8F1D90;
}

main .tenthSection > div > div p  {
    font-size: 1.2rem;
}

main .tenthSection > div > div h2 {
    font-size: 2.2rem;
    font-weight: 700;
    text-transform: uppercase;
    text-align: start;
}

main .tenthSection > div > div button {
     background-color:#8F1D90;
     border-radius: 20px;
     border: none;
     color: white;
     padding: 10px 20px;
     font-size: 18px;
     font-weight: 600;
}


/*# ------------------------------------------------------------------------------------------ */

/* HEADER */
/* FOOTER  */
/*  MAIN - SECTION 1  */
/*  MAIN - SECTION 2  */
/* MAIN - SECTION 3*/
/* MAIN - SECTION 4 */
/* MAIN - SECTION 5*/
/* MAIN - SECTION 6 */
/* MAIN - SECTION 7 */
/* MAIN - SECTION 8 */
/* MAIN - SECTION 9 */
/* MAIN - SECTION 10 */
/* >> MAIN - SECTION 11 << */


main .eleventhSection {
    width: 100%;
    height: 100%;
    display: flex;
}

main .eleventhSection > div{
    width: 50%;
    display: flex;
    gap: 2rem;
}

main .eleventhSection > div:first-child{
    background-color:#730375;
}

main .eleventhSection > div:last-child{
    background-color:#531554;
}

main .eleventhSection > div > div {
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   padding: 12% 20%;
}

main .eleventhSection > div:last-child > div:first-child > div {
    border: 1px solid  #F28D8D;
    border-radius: 50%;
    padding: 4%;
}

main .eleventhSection > div:last-child > div:first-child > div img {
    border-radius: 50%;
}

main .eleventhSection > div > div p, 
main .eleventhSection > div > div h2 {
   color: white;
}

main .eleventhSection > div > div p  {
    font-size: 1.2rem;
}

main .eleventhSection > div > div h2 {
    font-size: 2.2rem;
    font-weight: 700;
    text-transform: uppercase;
    text-align:start
}

main .eleventhSection > div > div button {
     background-color:#8F1D90;
     border-radius: 20px;
     border: none;
     color: white;
     padding: 10px 20px;
     font-size: 18px;
     font-weight: 600;
}

/*# ------------------------------------------------------------------------------------------ */

/* HEADER */
/* FOOTER  */
/*  MAIN - SECTION 1  */
/*  MAIN - SECTION 2  */
/* MAIN - SECTION 3*/
/* MAIN - SECTION 4 */
/* MAIN - SECTION 5*/
/* MAIN - SECTION 6 */
/* MAIN - SECTION 7 */
/* MAIN - SECTION 8 */
/* MAIN - SECTION 9 */
/* MAIN - SECTION 10 */
/* MAIN - SECTION 11 */
/* >> MAIN - SECTION 12 << */


main .twelfthSection {
    width: 100%;
    height: 100%;
    display: flex;
    padding: 6% 12%;
    background-color: #E5E5E5;
}


main .twelfthSection > div {
    width: 100%;
    height: 100%;
}


main .twelfthSection > div > div {
    display: flex;
    margin-bottom: 6%;
}

main .twelfthSection > div > div:first-child {
    display: flex;
    width: 100%;
    position: relative;
}

main .twelfthSection > div > div:first-child > div:first-child {
    display: flex;
    position: absolute;
    top: 55%;
    left: -4%;
}

main .twelfthSection > div > div:first-child > div:nth-child(2)  {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

main .twelfthSection > div > div:first-child > div:last-child {
    display: flex;
    position: absolute;
    top: 55%;
    right: -4%;
}

main .twelfthSection > div > div > div > div:first-child h3 {
    color:#370D73;
    margin-bottom: 3rem;
    font-weight: 700;
}

main .twelfthSection > div > div > div > div:last-child {
    width: 100%;
    height: 24rem;
    display: flex;
    gap: 1rem;
}

main .twelfthSection > div > div > div > div:last-child > div {
    padding: 2% 2%;
    background-color: #A55DA6;
    border-radius: 20px;
}

main .twelfthSection > div > div > div > div:last-child > div > div:first-child {
    display: flex;
    gap: 1rem;
}

main .twelfthSection > div > div > div > div:last-child > div > div:first-child img {
    border-radius: 20px;
}

main .twelfthSection > div > div > div > div:last-child > div > div:first-child > div {
    margin-top: 1rem;
}

main .twelfthSection > div > div > div > div:last-child > div > div:last-child {
    height: 56%;
    width: 100%;
    overflow: scroll;
    margin-top: 1rem;
}

main .twelfthSection > div > div > div > div:last-child > div > div p, 
main .twelfthSection > div > div > div > div:last-child > div > div h6 {
    color: white;
}

main .twelfthSection > div > div:last-child {
    gap: 6rem;
    margin-top: 12%;
}

main .twelfthSection > div > div:last-child > div:first-child {
    margin-top: 2%;
}

main .twelfthSection > div > div:last-child > section {
    width: 100%;
}

main .twelfthSection > div > div:last-child > section h4{
    color: #8F1D90;
    font-size: 2.2rem;
    font-weight: 700;
}

main .twelfthSection > div > div:last-child > section .faq {
    background-color: white;
    border-radius: 20px;
}

main .twelfthSection  .faq .modalFaq {
    color: #8F1D90;
    border-top: 1px solid rgb(219 219 219);
}

main .twelfthSection  .faq .modalFaq:first-child {
    border-top: none;
}

main .twelfthSection .faq .modalFaq .questions {
    display: flex;
    justify-content: space-between;
    padding: 2% 4% 0% 4%;
}

main .twelfthSection .faq .modalFaq .questions p {
    font-weight: 700;
}

main .twelfthSection .faq .modalFaq .answers {
    
    padding: 0% 4% 2% 4%;
}


main .twelfthSection .faq .modalFaq .answers p {
    width: 86%;
}

/*# ------------------------------------------------------------------------------------------ */

/* HEADER */
/* FOOTER  */
/*  MAIN - SECTION 1  */
/*  MAIN - SECTION 2  */
/* MAIN - SECTION 3*/
/* MAIN - SECTION 4 */
/* MAIN - SECTION 5*/
/* MAIN - SECTION 6 */
/* MAIN - SECTION 7 */
/* MAIN - SECTION 8 */
/* MAIN - SECTION 9 */
/* MAIN - SECTION 10 */
/*  MAIN - SECTION 11  */
/*  MAIN - SECTION 12 */
/* >> MAIN - SECTION 13 << */

main .thirteenthSection {
    width: 100%;
    height: 100%;
    display: flex;
    padding: 6% 12%;
    background-color: #f3f3f3;
}

main .thirteenthSection > div{
    width: 100%;
    height: 100%;
    display: flex;
    gap: 2rem;
    flex-direction: column;
    align-items: center;
}

main .thirteenthSection > div section {
    display: flex;
    width: 100%;
    height: 100%;
}
main .thirteenthSection > div > section:last-child {
    justify-content: center;
}

main .thirteenthSection > div > section:first-child h2 {
    color: #8F1D90;
    font-weight: 700;
    width: 100%;
    margin-bottom: 2rem;
}


main .thirteenthSection > div > section:last-child {
    justify-content: space-between;
}

main .thirteenthSection > div > section:last-child > div {
    background-color: 
    #FFFFFF;
    border-radius: 16px;
    width: 28%;
    height: 100%;
}

main .thirteenthSection > div > section:last-child > div > div:first-child {
    background-color: #730375;
    color: white;
    border-top-left-radius: 16px;
    border-top-right-radius: 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 10% 10%;
}

main .thirteenthSection > div > section:last-child > div > div:first-child h4, 
main .thirteenthSection > div > section:last-child > div > div:first-child h3 {
    font-size: 3rem;
}

main .thirteenthSection > div > section:last-child > div > div:first-child p {
    margin-bottom: 0;
    font-size: 2rem;
    font-weight: 500;
}

main .thirteenthSection > div > section:last-child > div > div:first-child > div:first-child{
    display: flex;
    flex-direction: column;
    margin-bottom: 0;
}

main .thirteenthSection > div > section:last-child > div > div:last-child > div:first-child p {
    margin-bottom: 0;
    color: #8F1D90;
    font-size: 1.125rem;
    width: 80%;
}

main .thirteenthSection > div > section:last-child > div > div:last-child > div:first-child .line::before {
    content: '';
    width: 80%;
    height: 2px;
    background: currentColor;
    display: block;
    margin: 14px auto;
    position: absolute;
    background-color: #8F1D90;
}

main .thirteenthSection > div > section:last-child > div > div:last-child {
    border: 1px solid #730375;
    border-bottom-right-radius: 16px;
    border-bottom-left-radius: 16px;
    display: flex;
    flex-direction: column;
    gap: 6rem;
    align-items: center;
    padding: 10%;
    width: 100%;
}

main .thirteenthSection > div > section:last-child > div > div:last-child > div:first-child {
    width: 100%;
    text-align: center;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
}

main .thirteenthSection > div > section:last-child > div > div:last-child > div:last-child {
    width: 100%;
    display: flex;
    justify-content: center;
}


main .thirteenthSection > div > section:last-child > div > div:last-child > div:last-child button {
    width: 60%;
    background-color:#8F1D90;
    border-radius: 20px;
    border: none;
    color: white;
    padding: 8px;
    font-size: 18px;
    font-weight: 600;
}

.bg-dualita{
    background-color: #fff;
}

.nav-link-dualita{
    color: #8F1D90!important;
    transition: ease-in 0.5s;
}

.nav-link-dualita:hover{
   text-decoration: underline;
}

  
  @media only screen and (max-width: 1095px) {
    .navbar-landing{
        display: flex;
        flex-direction: column;
    }
  }

  @media only screen and (max-width: 1310px) {
    .auth-buttons{
        display: flex;
        flex-direction: column;
        padding: 10px;
    }

    .create-map-btn{
        margin-bottom: 10px!important;
    }
  }

  .section-01{
    width: 100%;
    height: 600px;
    
    background-size: cover;
    padding: 50px;
  }

  .section-01 > p{
      color: #fff;
      text-align: center;
      max-width: 800px;
      margin: auto;
      padding: 20px;
  }

  .section-01-main-title{
      font-weight: 700;
      font-size: 42px;
      line-height: 42px;

  }

  .section-01-secondary-title{
    font-weight: 400;
    font-size: 18px;
    line-height: 25px;
}

.create-your-map{
    background-color:#8F1D90;
    border-radius: 20px;
    max-width: 400px;
    border: none;
    color: white!important;
    padding: 20px;
    font-size: 18px;
    font-weight: 600;
    text-align: center;
}

.create-your-map:hover{
   color: #8F1D90!important;
   border: 1px solid #8F1D90;
   background-color: #fff;
}

@media only screen and (max-width: 880px) {
    .section-01{
        height: 100%;
    }

    .section-01-main-title{
        font-size: 22px;
    }
  
    .section-01-secondary-title{
        font-size: 16px;
    }

}


.section-02-right{
    float:right;
    width:60%;
    height:650px;
  }

.section-02-right-card{
      padding: 50px;
      max-width: 600px;
  }

.section-02-right-card > h1{
    font-weight: 700;
    font-size: 36px;
    line-height: 38px;
    color: #370D73;
}

.section-02-right-card > p{
    font-weight: 400;
    font-size: 18px;
    line-height: 28px;
    color: #370D73;
}

.section-2-img{
    margin-top: 50px;
}

.section-2-img > img{
    max-width: 600px;
    max-height: 533px;
    width: 100%;
}

.section-03{
    height: 100%;
    padding: 50px;
    background-color: #d5d5d5;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}


.section-3-img{
    border: 1px solid #F28D8D;
    max-width: 450px;
    width: 100%;
    padding: 10px;
    float: right;
}

.section-3-img > img{
    max-width: 445px;
    max-height: 428px;
    width: 100%;
}


.section-03-text > h1{
    font-weight: 700;
    font-size: 36px;
    line-height: 36px;
    color: #370D73;
    max-width: 530px;
}

.section-03-text > p{
    margin-top: 50px;
    max-width: 500px;
    font-weight: 400;
    font-size: 18px;
    line-height: 29px;
    color: #370D73;
}

@media only screen and (max-width: 993px) {
    .section-3-img{
        float: left;
        margin-bottom: 30px;
    }
}

@media only screen and (max-width: 770px) {
    .section-03{
        height: 100%;
    }

    .section-03-text {
        padding: 20px;
    }

}

.section-03-email{
    background-color: #8F1D90;
    border-radius: 21.5px;
    width: 1110px;
    margin-top: 100px;
}

.section-03-email-form{
    padding: 40px;
}

.section-03-email-form > h1{
    font-weight: 700;
    font-size: 36px;
    line-height: 42px;
    color: #fff;
}

.section-03-email-form > p{
    font-weight: 400;
    font-size: 18px;
    line-height: 29px;
    color: #fff;
}

.section-03-email-img > img{
    max-width: 540px;
    max-height: 390px;
    width: 100%;
    object-fit: contain;
    border-radius: 20px;
}

.section-3-input{
    height: 40px;
    width: 100%;
    border-radius: 20px;
    background: #fff;
    color: #8F1D90;
    padding: 15px;
    font-size: 19px;
    font-weight: 400;
    line-height: 20px;
    border: none;
}

.section-3-acions{
    text-align: right;
}

.btn-section-3{
    background-color: #D63DFC;
    color: #fff;
    font-size: 18px;
    font-weight: 600;
    width: 200px;
    border-radius: 20px;
}

.btn-section-3:hover{
    background-color: #fff;
    border: 1px solid #D63DFC;
    color: #D63DFC;
}

@media only screen and (max-width: 600px) {
    .btn-section-3{
        width: 100%;
    }
}

.section-3-input-btn{
    height: 60px;
    /* width: 73%; */
    background: #fff;
    color: #8F1D90;
    padding: 20px;
    font-size: 25px;
    font-weight: 400;
    line-height: 28px;
    border: none;
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
}

.section-3-btn{
    background-color: #D63DFC;
    color: #fff;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
    font-weight: 400;
    font-size: 24px;
    line-height: 28px;
}

.section-3-input-btn:focus{
    background-color: #fff;
}

.section-3-input::placeholder, .section-3-input-btn::placeholder{
    color: #8F1D90;
}

@media only screen and (max-width: 1150px) {
    .section-03-email{
        background-color: #8F1D90;
        border-radius: 21.5px;
        width: auto;
        margin-top: 100px;
    }

    .section-3-input{
        width: 100%;
    }
}

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

    .section-03-email-img > img{
        max-width: 100%;
        object-fit: cover;
    }
}

@media only screen and (max-width: 880px) {
    .section-3-input, .section-3-input-btn{
        font-size: 16px;
    }
}


.section-04{
    height: 700px;
    
    background-size: cover;
}

.section-04-cover{
    height: 700px;
    width: 100%;
    background-image: url('../img/content/bg-section4-homepage.png');
    background-size: cover;

}

.section-04-container{
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.section-04-content{
    padding: 40px;
}

.section-04-text{
    width: 550px;
    text-align: center;
    /* margin-right: 100px; */
}

.section-04-text > h1{
    font-family: Open Sans;
    color: #fff;
    font-weight: 700;
    font-size: 36px;
    line-height: 38px;
    text-transform: uppercase;
}

.section-04-text > p{
    color: #fff;
    font-weight: 400;
    font-size: 18px;
    line-height: 29px;
    margin-top: 30px;
}

.section-04-img{
    border: 1px solid #F28D8D;
    padding: 10px;
    width: 445px;
    margin-left: 100px;
}

.section-04-img > img{
    max-width: 423px;
    max-height: 350px;
    width: 100%;
}

@media only screen and (max-width: 1175px) {
    .section-04-img{
        width: auto;
    }
    .section-04-text{
        width: auto;
    }
}

@media only screen and (max-width: 992px) {
    .section-04, .section-04-cover{
        height: 100%;
    }

    .section-04-text{
        margin-right: 0px;
        width: auto;
    }

    .section-04-img{
        width: auto;
        margin-bottom: 100px;
        margin-top: 50px;
        margin-left: 0px;
    }
}





.section-05{
    height: 700px;
    background-color: #F2F2F2;
}

.section-05-cover{
    height: 700px;
    width: 100%;
}

.section-05-content{
    padding-top: 180px;
}

.section-05-text{
    width: 550px;
    text-align: center;
    margin-right: 100px;
}

.section-05-text > h1{
    font-family: Open Sans;
    color: #8F1D90;
    font-weight: 700;
    font-size: 36px;
    line-height: 38px;
    text-transform: uppercase;
}

.section-05-text > p{
    color: #8F1D90;
    font-weight: 400;
    font-size: 18px;
    line-height: 29px;
    margin-top: 30px;
}

.section-05-img{
    padding: 10px;
    width: 445px;
    margin-left: 100px;
}

.section-05-img > img{
    max-width: 412px;
    max-height: 412px;
    width: 100%;
}

@media only screen and (max-width: 1175px) {
    .section-05-img{
        width: auto;
    }
    .section-05-text{
        width: auto;
    }
}

@media only screen and (max-width: 950px) {
    .section-05, .section-05-cover{
        height: auto;
    }

    .section-05-text{
        margin-right: 0px;
        width: auto;
    }

    .section-05-img{
        width: auto;
        margin-bottom: 100px;
        margin-top: 50px;
        margin-left: 0px;
    }
}

.section-06{
    height: 700px;
}

.section-06, .section-06-content{
    margin: auto;
}

.section-06-content{
    padding: 50px;
}

.section-06-img > img{
    max-width: 401px;
    max-height: 420px;
    width: 100%;
}

.section-06-text > h1{
    font-weight: 700;
    font-size: 36px;
    line-height: 49px;
    text-transform: uppercase;
    color: #370D73;
}

.section-06-text > p{
    font-weight: 400;
    font-size: 18px;
    line-height: 29px;
    color: #370D73;
    padding-top: 20px;
}

@media only screen and (max-width: 820px) {
    .section-06{
        height: auto;
    }
}

.section-07-bg{
    /* background-color: #F2F2F2; */
    background: rgb(242,242,242);
background: linear-gradient(180deg, rgba(242,242,242,1) 85%, rgba(255,255,255,1) 91%);
}

.section-07{
   height: 100%;
   padding: 150px 50px 50px 50px;
}

.section-07-cards{
    display: flex;
    flex-direction: row;
}

.section-07-card{
    width: 220px;
    height: 415px;
    background-color: #F28D8D;
    border-radius: 23px;
    text-align: center;
    padding-top: 20px;
}

.section-07-card-head > img{
    width: 150px;
    height: 150px;
    border-radius: 50%;
    object-fit: cover;
}

.section-07-card-content{
    text-align: center;
    margin-top: 20px;
}

.section-07-card-content > span{
    font-weight: 700;
    font-size: 18px;
    line-height: 21px;
    color: #E5E5E5;
}

.section-07-card-content > p{
    font-weight: 700;
    font-size: 22px;
    line-height: 26px;
    color: #fff;
    margin-top: 20px;
}

.btn-card-section-07{
    background-color:#8F1D90;
    border-radius: 20px;
    max-width: 200px;
    border: none;
    color: white!important;
    padding: 15px;
    font-size: 18px;
    font-weight: 600;
    text-align: center;
}

.btn-card-section-07:hover{
   color: #8F1D90!important;
   border: 1px solid #8F1D90;
   background-color: #fff;
}

.section-07-text{
    max-width: 400px;
}

.section-07-text > h1{
    font-weight: 700;
    font-size: 36px; 
    line-height: 49px;
    text-transform: uppercase;
    color: #370D73;
}

.section-07-text > p{
    font-weight: 400;
    font-size: 18px;
    line-height: 29px;
    
    color: #370D73;
}

@media only screen and (max-width: 1220px) {
    .section-07-card-content > span{
        font-size: 16px;
    }
    
    .section-07-card-content > p{
        font-size: 18px;
    }

    .btn-card-section-07{
        max-width: 150px;
    }
}

@media only screen and (max-width: 995px) {
    .section-07-card-content > span{
        font-size: 12px;
    }
    
    .section-07-card-content > p{
        font-size: 12px;
    }

    .btn-card-section-07{
        max-width: 100px;
        width: 100%;
        font-size: 16px;
    }

    .section-07-card-head > img{
        width: 100px;
        height: 100px;
        border-radius: 50%;
    }
}

@media only screen and (max-width: 600px) {
    .section-07-cards{
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

    .section-07-card{
        margin-left: 0px!important;
        margin-top: 20px;
    }

    .section-07-card-content > span{
        font-size: 14px;
    }
    
    .section-07-card-content > p{
        font-size: 16px;
    }

    .btn-card-section-07{
        max-width: 120px;
    }

    .section-07-card-head > img{
        width: 150px;
        height: 150px;
        border-radius: 50%;
    }
}

.section-07-b{
    height: 600px;
    width: 100%;
    /* background-image: url('../img/content/bg-section9-homepage.png'); */
    background-size: cover;

    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

.shap-border-top{
    background-color: #F2F2F2;
    /* background-color: #fff; */
    width: 100%;
    height: 100px;
    position: absolute;
    border-bottom-left-radius: 50%;
    border-bottom-right-radius: 50%;
    margin-top: -10px;
}

.shap-border-bottom{
    /* background-color: #F2F2F2; */
    background-color: #fff;
    width: 100%;
    height: 100px;
    position: absolute;
    border-top-left-radius: 50%;
    border-top-right-radius: 50%;
    margin-top: 505px;
}


.shap-border-top-cms{
    background-color: #fff;
    width: 100%;
    height: 100px;
    position: relative;
    border-bottom-left-radius: 50%;
    border-bottom-right-radius: 50%;
    margin-bottom: -100px;
}

.shap-border-bottom-cms{
    background-color: #fff;
    width: 100%;
    height: 100px;
    /* position: absolute; */
    border-top-left-radius: 50%;
    border-top-right-radius: 50%;
    margin-top: -100px;
}

.section-07-b-text{
    text-align: center;
    max-width: 490px;
}

.section-07-b-text > h1{
    font-weight: 700;
    font-size: 36px;
    line-height: 42px;
    color: #fff;
}

.section-07-b-text > p{
    font-weight: 400;
    font-size: 18px;
    line-height: 21px;
    color: #fff;
}

.section-07-c{
    padding-top: 0px;
    background-color: #fff!important;
}

.btn-card-section-07-c{
    background-color:#F28D8D;
    border-radius: 20px;
    max-width: 250px;
    border: none;
    color: white!important;
    padding: 15px;
    font-size: 16px;
    font-weight: 600;
    text-align: center;
}

.btn-card-section-07-c:hover{
   color: #F28D8D!important;
   border: 1px solid #F28D8D;
   background-color: #fff;
}

.section-07-c{
    height: 700px;
    background-color: #F2F2F2;
}

.section-07-c-cover{
    height: 700px;
    width: 100%;
}

.section-07-c-content{
    padding-top: 30px;
}

.section-07-c-text{
    width: 550px;
    text-align: left;
    margin-right: 100px;
}

.section-07-c-text > h1{
    font-family: Open Sans;
    color: #8F1D90;
    font-weight: 700;
    font-size: 36px;
    line-height: 38px;
    text-transform: uppercase;
}

.section-07-c-text > p{
    color: #8F1D90;
    font-weight: 400;
    font-size: 18px;
    line-height: 29px;
    margin-top: 30px;
}

.section-07-c-img{
    border: 1px solid #F28D8D;
    padding: 10px;
    width: 445px;
    margin-left: 100px;
}

.section-07-c-img > img{
    
}

@media only screen and (max-width: 1175px) {
    .section-07-c-img{
        width: auto;
    }
    .section-07-c-text{
        width: auto;
    }
}

@media only screen and (max-width: 950px) {
    .section-07-c, .section-07-c-cover{
        height: auto;
    }

    .section-07-c-text{
        margin-right: 0px;
        width: auto;
    }

    .section-07-c-img{
        width: auto;
        margin-bottom: 100px;
        margin-top: 50px;
        margin-left: 0px;
    }
}



.section-08{
    height: 700px;
    background-color: #F2F2F2;
}

.section-08-cover{
    height: 700px;
    width: 100%;
}

.section-08-content{
    padding-top: 180px;
}

.section-08-text{
    width: 550px;
    text-align: left;
    /* margin-left: 100px; */
}

.section-08-text > h1{
    font-family: Open Sans;
    color: #8F1D90;
    font-weight: 700;
    font-size: 36px;
    line-height: 38px;
    text-transform: uppercase;
}

.section-08-text > p{
    color: #8F1D90;
    font-weight: 400;
    font-size: 18px;
    line-height: 29px;
    margin-top: 30px;
}

.section-08-img{
    padding: 10px;
    width: 445px;
    /* margin-right: 100px; */
    border: 1px solid #F28D8D;
}

.section-08-img > img{
    
}

@media only screen and (max-width: 1175px) {
    .section-08-img{
        width: auto;
    }
    .section-08-text{
        width: auto;
    }
}

@media only screen and (max-width: 950px) {
    .section-08, .section-08-cover{
        height: auto;
    }

    .section-08-text{
        margin-right: 0px;
        width: auto;
    }

    .section-08-img{
        width: auto;
        margin-bottom: 100px;
        margin-top: 50px;
        margin-left: 0px;
    }
}


.section-09{
    height: 700px;
    background-color: #730375;
}

.section-09-left{
    background-color: #730375;
    height: 700px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.section-09-left-text{
    width: 500px;
    padding: 20px;
}

.section-09-left-text > h1{
    font-weight: 700;
    font-size: 36px;
    line-height: 38px;
    text-transform: uppercase;
    color: #fff;
}

.section-09-left-text > p{
    color: #fff;
    font-weight: 400;
    font-size: 18px;
    line-height: 29px;
}

.section-09-right{
    background-color: #531554;
    height: 700px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.section-09-right-img{
    border: 1px solid #F28D8D;
    border-radius: 50%;
    padding: 10px; 
}

.section-09-right-img > img{
    border-radius: 50%;
    max-width: 345px;
    width: 100%; 
    height: 345px;
    object-fit: cover;
}

@media only screen and (max-width: 1090px) {
    .section-09-left-text{
        width: auto;
    }

    .section-09-left-text > h1{
        font-size: 25px;
    }
    
    .section-09-left-text > p{
        font-size: 16px;
    }

    .section-09{
        height: auto;
    }
}


.section-10{
    height: auto;
    background-color: #E5E5E5;
}

.section-10-depositions{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding-top: 50px;
}

.section-10-depositions-head > h1{
    font-weight: 700;
    font-size: 36px;
    line-height: 42px;
    text-align: center;
    color: #370D73;
}


.depositions-card{
    background-color: #A55DA6;
    border-radius: 20px;
    max-width: 350px;
    width: 100%;
    height: 377px;
    max-height: 377px;
}

.depositions-card-head{
    padding: 20px;
    display: flex;
    flex-direction: row;
}

.depositions-card-head > img{
    border-radius: 20px;
}

.depositions-card-head-text{
    padding-left: 20px;
    padding-top: 20px;
}

.section-10-depositions-content{
    width: 60%;
    /* display: flex;
    flex-direction: row;
    justify-content: center;
    align-content: center; */
}

.card-head-text-main{
    font-family: Roboto;
    font-size: 20px;
    font-weight: 700;
    line-height: 23px;
    letter-spacing: 0em;
    text-align: center;
    color: #fff;

}

.card-head-text-secondary{
    font-family: Roboto;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    letter-spacing: 0em;
    text-align: center;
    color: #fff;
}

.depositions-card-content{
    padding: 10px;
}

.depositions-card-content-text{
    padding: 10px;
    max-height: 180px;
    overflow-x: auto;
    text-overflow: ellipsis;
    color: #fff;
}

/* width */
.depositions-card-content-text::-webkit-scrollbar {
    width: 6px;
  }
  
/* Track */
  .depositions-card-content-text::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px grey; 
    background-color: #8F1D90;
    border-radius: 10px;
}
   
  /* Handle */
.depositions-card-content-text::-webkit-scrollbar-thumb {
    background: #fff; 
    border-radius: 10px;
}
  
  /* Handle on hover */
.depositions-card-content-text::-webkit-scrollbar-thumb:hover {
    background: #fff; 
}

.section-10-faq{
    padding-top: 100px;
    padding-bottom: 100px;
}

.section-10-faq-title{
    display: flex;
    justify-content: center;
    align-items: center;
}

.section-10-faq-title > h1{
    font-family: Roboto;
    font-size: 36px;
    font-style: normal;
    font-weight: 700;
    line-height: 42px;
    letter-spacing: 0em;
    text-align: left;
    color: #8F1D90;

}

.ui-accordion .ui-accordion-header {
    width: 600px;
    background-color: #fff!important;
    color: #8F1D90!important;
    text-align: left;
    /* display: flex!important; */
    /* flex-direction: row-reverse!important; */
    /* justify-content: flex-end!important; */
    /* align-items: center; */
    font-size: 18px;
    line-height: 21px;
    font-weight: 700;
}

.ui-accordion .ui-accordion-content{
    width: 600px;
}

@media only screen and (max-width: 1265px) {
    .ui-accordion .ui-accordion-content{
        width: auto;
    }

    .ui-accordion .ui-accordion-header {
        width: auto;
    }
}


.ui-accordion-header{
    height: 50px!important;
}

.ui-accordion-header-active{
    color: #8F1D90!important;
}

.ui-state-active .ui-icon, .ui-button:active .ui-icon {
    background-image: url('../img/icons/arrow-top-homepage.svg')!important;
}

.ui-icon, .ui-widget-content .ui-icon {
    background-image: url('../img/icons/arrow-bottom-homepage.svg')!important;
}

.ui-icon-triangle-1-e{
    background-position: 0px!important;
    /* padding-left: 40px; */
}

.ui-icon-triangle-1-s{
    background-position: 0px!important;
    /* padding-left: 40px; */
}

.ui-first-acordian{
    border-top-left-radius: 25px!important;
    border-top-right-radius: 25px!important;
}

.ui-last-acordian{
    border-bottom-left-radius: 25px!important;
    border-bottom-right-radius: 25px!important; 
}

.ui-last-acordian-content{
    border-bottom-left-radius: 25px!important;
    border-bottom-right-radius: 25px!important; 
}


.ui-last-acordian-content{
    margin-top: -16px!important;
}

.ui-acordian-text{
    font-family: Roboto;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 21px;
    letter-spacing: 0em;
    text-align: left;
    color: #8F1D90;

}

.ui-accordion .ui-accordion-header .ui-icon { position: absolute; left: 100%; margin-left: -30px; top: 50%; margin-top: -8px; }
.ui-accordion-icons .ui-accordion-header a { padding-left: 1em; }


.section-11{
    padding: 50px;
    background-color: #B1B1B1;
    margin: auto;
}

.contract-plan-card{
    width: 330px;
    border: 1px solid #730375;
    border-radius: 20px;
    margin-bottom: 50px;
}

.contract-plan-card-head{
    background-color: #730375;
    border-top-right-radius: 20px;
    border-top-left-radius: 20px;
    text-align: center;
    padding: 20px;
}

.contract-plan-card-head > h1{
    font-family: Roboto;
    font-size: 48px;
    font-style: normal;
    font-weight: 700;
    line-height: 56px;
    letter-spacing: 0em;
    color: #fff;
}

.contract-plan-card-head > p{
    font-family: Roboto;
    font-size: 48px;
    font-style: normal;
    font-weight: 500;
    line-height: 56px;
    letter-spacing: 0em;
    text-align: center;
    color: #fff;
    
}

.contract-plan-card-head > span{
    font-family: Roboto;
    font-size: 36px;
    font-style: normal;
    font-weight: 500;
    line-height: 42px;
    letter-spacing: 0em;
    text-align: center;
    color: #fff;
    
}

.contract-plan-card-content{
    border-bottom-right-radius: 20px;
    border-bottom-left-radius: 20px;
    border: 1px solid green;
    background-color: #fff;
    padding: 20px;
    color: #8F1D90;
    text-align: center;
}

.contract-plan-remove{
    text-decoration: line-through 1px#730375;
    color: #b3b3b3;
}

.contract-plan-card-content > ul{
    list-style-type: none;
    padding: 0;
}

.contract-plan-card-content-v2{
    border-bottom-right-radius: 20px;
    border-bottom-left-radius: 20px;
    border: 1px solid green;
    background-color: #fff;
    padding: 20px;
    color: #8F1D90;
    text-align: center;
}

.permissions-list{
    height: 300px;
    overflow-y: auto;
}

/* width */
.permissions-list::-webkit-scrollbar {
    width: 5px;
  }
  
  /* Track */
  .permissions-list::-webkit-scrollbar-track {
    background: #d7d7d7;
    border-radius: 8px;
  }
  
  /* Handle */
  .permissions-list::-webkit-scrollbar-thumb {
    background: #8F1D90;
    border-radius: 8px;
  }

  

.contract-plan-card-content-v2 > .permissions-list > ul{
    list-style-type: none;
    padding: 0;
}

.section-11-title > h1{
    font-family: Roboto;
    font-size: 36px;
    font-style: normal;
    font-weight: 700;
    line-height: 42px;
    letter-spacing: 0em;
    text-align: center;
    color: #8F1D90;
}

@media only screen and (max-width: 766px) {
    .contract-plan-card{
        width: auto;
    }
}

.map-payment{
    background-color: #fff;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    max-width: 900px;
    margin: 100px auto;
}

.map-payment-head{
    background-color: #8F1D90;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    text-align: center;
    padding: 20px;
    font-size: 21px;
    line-height: 25px;
    font-weight: 700;
    text-transform: uppercase;
}

.map-payment-head > h1{
    color: #fff;
}

.map-payment-section{
    padding: 20px;
}

.map-payment-section-head > h1{
    font-size: 21px;
    line-height: 25px;
    font-weight: 700;
    text-transform: uppercase;
    color: #370D73;
}

.map-payment-section-head > p{
    text-align: left;
    line-height: 25px;
    font-weight: 700;
    text-transform: uppercase;
    color: #370D73;
}

.map-plan{
    border: 2px solid #370D73;
    max-width: 250px;
    height: auto;
    padding: 20px;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.map-plan-head > h1{
    font-size: 25px;
    color: #370D73;
    text-align: center;
}

.map-plan-name{
    text-align: center;
    margin-bottom: 20px;
    color: #370D73;
    font-weight: 600;
}

.map-plan-actions{
    text-align: center;
}

.user-maps{
    padding: 20px;
}

.user-maps > h1{
    font-size: 25px;
    margin-bottom: 50px;
}

.plan-card{
    background-color: #fff;
    border: 1px solid #370D73;
    border-radius: 8px;
    width: 300px;
}

.plan-card-head{
    background-color: #8F1D90;
    padding: 20px;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
}

.plan-card-head > h2{
    font-weight: 500;
}

.plan-card-head > p{
    text-align: center;
    font-size: 25px;
    color: #fff;
}

.btn-sign-map-div{
    text-align: center;
    padding: 20px;
}

.btn-sign-map{
    background-color: #fff;
    border: 1px solid #8F1D90!important;
    border-radius: 8px;
    color: #8F1D90;
    font-size: 18px;
    font-weight: 700;
    padding: 10px;
    text-transform: uppercase;
    border: none;
    cursor: pointer;
    width: 100%;
}

.btn-sign-map:hover{
    color: #fff;
    background-color: #8F1D90;
}

.user-maps-divs{
    display: flex;
    flex-wrap: wrap;
}

.nav-auth-buttons{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: baseline;
}

.auth-btn-map{
    background-color: #8F1D90;
    border-color: #8F1D90;
    color: #fff;
    border-radius: 20px;
    width: 200px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.auth-btn-map:hover{
    background-color: #fff;
    border-color: #8F1D90;
    color: #8F1D90;
}

.auth-btn-logout{
    background-color: #fff;
    border: 1px solid #8F1D90;
    color: #8F1D90;
    border-radius: 20px;
    width: 100px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.auth-btn-logout:hover{
    background-color: #8F1D90;
    border: 1px solid #8F1D90;
    color: #fff;
}

@media only screen and (max-width: 600px) {
    .nav-auth-buttons{
        margin-top: 50px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

    .auth-btn-logout, .auth-btn-map{
        margin-right: 0px!important;
    }

}


.numerologist-register{
    /* height: 500px; */
    /* overflow-y: auto; */
}

.section-11-cards{
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    flex-wrap: wrap;
}

/* comments card */

.comments-card{
    background-color: #A55DA6;
    border-radius: 20px;
    height: 400px;
    max-width: 400px;
    width: 100%;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
}

.comments-card-head{
    padding: 20px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
}

.comments-card-head > .comments-image > img{
    width: 100px;
    height: 100px;
    border-radius: 20px;
}

.comments-card-head > .comments-user {
    color: #fff;
}

.comments-card-body{
    padding: 20px;

}

.comments-card-body > .comments-card-body-text{
    height: 200px;
    overflow-y: auto;
    padding: 10px;
    color: #fff;
}

.comments-card-body-text::-webkit-scrollbar {
    width: 6px;
  }
  
/* Track */
  .comments-card-body-text::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px grey; 
    background-color: #8F1D90;
    border-radius: 10px;
}
   
  /* Handle */
.comments-card-body-text::-webkit-scrollbar-thumb {
    background: #fff; 
    border-radius: 10px;
}
  
  /* Handle on hover */
.comments-card-body-text::-webkit-scrollbar-thumb:hover {
    background: #fff; 
}

.plans-info{
    padding: 30px;
}

.plans-info-head > h1{
    margin-top: 30px;
    margin-bottom: 50px;
    text-align: center;
}

.plans-info-body{
    padding: 20px;
    display: flex;
    justify-content: space-around;
    flex-direction: row;
    flex-wrap: wrap;
}

.plans-info-img{
    max-width: 600px;
    height: 400px;
    width: 100%;
}

.plans-info-img > img{
    max-width: 600px;
    height: 500px;
    width: 100%;
}

.plans-info-text{
    max-width: 700px;
    width: 100%;
    height: 500px;
    overflow-x: auto;
    text-align: justify;
    padding: 10px;
}

.plans-info-body-preview{
    padding: 20px;
    display: flex;
    justify-content: space-between;
    flex-direction: row;
    flex-wrap: wrap;
}


.plans-info-img-preview{
    max-width: 400px;
    height: 300px;
    width: 100%;
}

.plans-info-img-preview > img{
    max-width: 400px;
    height: 300px;
    width: 100%;
}

.plans-info-text-preview{
    max-width: 400px;
    width: 100%;
    height: 300px;
    overflow-x: auto;
    text-align: justify;
    padding: 10px;
}

@media only screen and (max-width: 1415px) {
    .plans-info-body{
        padding: 0px;
    }

    .plans-info-text{
        /* margin-top: 130px; */
    }
}

.pricing-card{
    background-color: #fff;
    border: 1px solid #8F1D90;
    max-width: 300px;
    width: 100%;
    height: 400px;
    border-radius: 16px;
    box-shadow: rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px;
}

.pricing-card-head{
    background-color: #8F1D90;
    padding: 20px;
    text-align: center;
    border-top-left-radius: 16px;
    border-top-right-radius: 16px;
}

.pricing-card-head > h1{
    color: #fff;
    text-transform: uppercase;
    font-size: 30px;
}

.pricing-card-head > h2{
    font-size: 25px;
}

.pricing-card-body{
    height: 300px;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.pricing-button{
    background-color: #8F1D90;
    color: #fff;
    border-radius: 16px;
    width: 250px;
    height: 50px;
}

.pricing-button:hover{
    background-color: #fff;
    border: 1px solid #8F1D90;
    color: #8F1D90;
}

/* width */
.plans-info-text::-webkit-scrollbar {
    width: 6px;
  }
  
/* Track */
  .plans-info-text::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px grey; 
    background-color: #fff;
    border-radius: 10px;
}
   
  /* Handle */
.plans-info-text::-webkit-scrollbar-thumb {
    background: #8F1D90; 
    border-radius: 10px;
}
  
  /* Handle on hover */
.plans-info-text::-webkit-scrollbar-thumb:hover {
    background: #8F1D90; 
}

.page-banner-div > .page-banner{
    width: 100%;
    height: 500px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    box-shadow: inset 0 0 0 2000px rgb(89 27 90 / 70%);
    display: flex;
    justify-content: center;
    align-items: center;
}

.page-banner > p{
    /* max-width: 1200px; */
    padding: 20px;
    width: 100%;
    text-align: center;
    font-size: 25px;
    color: #fff;

}

.page-head{
    text-align: center;
    margin-top: 60px;
}

.page-side-image{
    width: 100%;
    height: 410px;
    padding: 10px;
    border: 1px solid #F28D8D;
}

.page-side-image > img{
    width: 100%;
    max-height: 390px;
    height: 100%;
    object-fit: cover;

}

.page-side-text{
    width: 100%;
    height: 410px;
    overflow-y: auto;
    padding: 10px;
}

/* width */
.page-side-text::-webkit-scrollbar {
    width: 6px;
  }
  
/* Track */
  .page-side-text::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px grey; 
    background-color: #dedede;
    border-radius: 10px;
}
   
  /* Handle */
.page-side-text::-webkit-scrollbar-thumb {
    background: #8F1D90; 
    border-radius: 10px;
}
  

.page-body-content{
    margin-top: 100px;
}