#index-example {
    height: 850px;
    display: none;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}
.index-example-close{
    color: #dad0e7;
    font-size: 30px;
    font-weight: 900;
    display: flex;
    flex-direction: row-reverse;
    z-index: 10;
    
}
.index-example-close-icon{
    cursor: pointer;
}
.index-truths-icon,
.index-essentials-icon,
.index-merits-icon,
.index-pursuits-icon{
    cursor: pointer;
    margin-top: 50px !important;
}
#index-structure{
    display: block; 
    height: inherit;
    padding-top: 15% !important;
}
#index-truths{
    display: none;
    height: inherit;
    padding-top: 15% !important;
}
#index-essentials{
    display: none;
    height: inherit;
    padding-top: 15% !important;
}
#index-merits{
    display: none;
    height: inherit;
    padding-top: 15% !important;
}
#index-pursuits{
    display: none;
    height: inherit;
    padding-top: 15% !important;
}
#index-pursuits h2{
    text-decoration: underline;
    cursor: pointer;
}

.index-title{
    font-size: 28px;
    font-weight: 500;
}
.index-description{
    font-size: 16px;
    font-weight: 200;
    text-align: left;
}
#pursuit-map{
    display: none;
    cursor: pointer;
    height: 852px;
    padding: 70px !important;
}
.index-cycle-controler{
    display: flex;
    justify-content: flex-end;
    padding: 20px;
}
.index-cycle-controler-item{
    width: 100px;
    /* padding: 20px; */
    margin: 10px;
    cursor: pointer;
    display: flex;
    justify-content: center;
}
.index-cycle-controler-item-img{
    margin-bottom: 10px;
    width: 80px;
}
.index-cycle-controler-item-title{
    text-align: center;
}
.index-cycle-container{
    display: flex;
    justify-content: center;
    margin-bottom: 200px;
}
.circle-container {
    position: relative;
    width: 500px;
    height: 500px;
    padding: 112px;
    /*112px = 80px*1.4 (80px = half the width of circle-container, 1.4 = sqrt(2))*/
    /* border: dashed 1px; */
    border-radius: 50%;
}
.index-cycle-item {
    display: block;
    position: absolute;
    top: 50%; left: 50%;
    width: 160px; height: 160px;
    margin: -80px;
    cursor: pointer;
}
.index-cycle-item-title{
    text-align: center;
}
.index-cycle-item img { display: block; width: 100%; }
.deg0 { transform: translate(250px); } /* 250px = half the width of the wrapper */
.deg45 { transform: rotate(45deg) translate(250px) rotate(-45deg); }
.deg54 { transform: rotate(54deg) translate(250px) rotate(-54deg); }
.deg72 { transform: rotate(72deg) translate(250px) rotate(-72deg); }
.deg126 { transform: rotate(126deg) translate(250px) rotate(-126deg); }
.deg144 { transform: rotate(144deg) translate(250px) rotate(-144deg); }
.deg198 { transform: rotate(198deg) translate(250px) rotate(-198deg); }
.deg216 { transform: rotate(216deg) translate(250px) rotate(-216deg); }
.deg288 { transform: rotate(288deg) translate(250px) rotate(-288deg); }
.deg135 { transform: rotate(135deg) translate(250px) rotate(-135deg); }
.deg180 { transform: translate(-250px); }
.deg225 { transform: rotate(225deg) translate(250px) rotate(-225deg); }
.deg315 { transform: rotate(315deg) translate(250px) rotate(-315deg); }
.deg-18 { transform: rotate(-18deg) translate(250px) rotate(18deg); }
.deg-90 { transform: rotate(-90deg) translate(250px) rotate(90deg); }
.index-cycle-core{
    height: 240px;
    width: 240px;
    border-radius: 50%;
    position: absolute;
    z-index: 10;
    top: calc(50% - 120px);
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 5px;
    font-size: 15px;
    text-align: justify;
}
.index-cycle-core-content-truth{
    display: block;
}
.index-cycle-core-content-essentials,
.index-cycle-core-content-merits,
.index-cycle-core-content-truth-meaning,
.index-cycle-core-content-truth-vitality,
.index-cycle-core-content-truth-delight,
.index-cycle-core-content-truth-engagement,
.index-cycle-core-content-truth-freedom,
.index-sub-cycle-core-content{
    display: none;
}

.index-cycle-core-content-essentials div,
.index-cycle-core-content-merits div,
.index-cycle-core-content-truth-meaning div,
.index-cycle-core-content-truth-vitality div,
.index-cycle-core-content-truth-delight div,
.index-cycle-core-content-truth-engagement div,
.index-cycle-core-content-truth-freedom div,
.index-sub-cycle-core-content div{
    padding: 10px;
}

.index-cycle-core-content-truth-img,
.index-cycle-core-content-essentials-img,
.index-cycle-core-content-merits-img{
    width: 100%;
}
.index-cycle-core-content-truth img,
.index-cycle-core-content-essentials img,
.index-cycle-core-content-merits img{
    width: 60px;
}
.index-cycle-core-content-truth div,
.index-cycle-core-content-essentials div,
.index-cycle-core-content-merits div,
.index-cycle-core-content-truth-meaning div,
.index-cycle-core-content-truth-vitality div,
.index-cycle-core-content-truth-delight,
.index-cycle-core-content-truth-engagement,
.index-cycle-core-content-truth-freedom,
.index-sub-cycle-core-content{
    text-align: center;
    color: white;
    width: 100%;
}
.index-cycle-item-img {
    cursor: pointer;
}
.essentials-circle-container {
    width: 300px;
    height: 300px;
    padding: 49px;
    /* 49px = 35px*1.4 (35px = half the width of circle-container, 1.4 = sqrt(2)) */
    /* border: dashed 1px; */
    border-radius: 50%;
}
.index-cycle-item-circle{
    position: absolute;
    /* display: none; */
    z-index: 10;
    width: 300px;
    height: 300px;
    /* border: dashed 1px; */
    border-radius: 50%;
    padding: 49px;
    /* 49px = 35px*1.4 (35px = half the width of circle-container, 1.4 = sqrt(2)) */
}
.essiential-circle-deg-18 { transform: rotate(-16deg) translate(240px) rotate(16deg); }
.essiential-circle-deg-90 { transform: rotate(-92.5deg) translate(245px) rotate(92.5deg); }
.essiential-circle-deg54 { transform: rotate(54deg) translate(235px) rotate(-54deg); }
.essiential-circle-deg126 { transform: rotate(129deg) translate(250px) rotate(-129deg); }
.essiential-circle-deg198 { transform: rotate(195deg) translate(255px) rotate(-195deg); }
.index-cycle-item-circle-content{
    position: relative;
}
.essiential-circle-item-deg-40 { transform: rotate(-42deg) translate(260px) rotate(42deg); }
.essiential-circle-item-deg-55 {transform: rotate(-60deg) translate(240px) rotate(60deg);}
.essiential-circle-item-deg-135 {transform: rotate(-135deg) translate(190px) rotate(135deg);}
.essiential-circle-item-deg-190 {transform: rotate(-190deg) translate(220px) rotate(190deg);}

.essiential-circle-item-deg-190-2 {transform: rotate(-190deg) translate(150px) rotate(190deg);}
.essiential-circle-item-deg-135-2 {transform: rotate(-135deg) translate(120px) rotate(135deg);}
.essiential-circle-item-deg-55-2 {transform: rotate(-60deg) translate(150px) rotate(60deg);}
.essiential-circle-item-deg-40-2 { transform: rotate(-42deg) translate(150px) rotate(42deg); }





.essiential-circle-item-deg-45 { transform: rotate(-45deg) translate(110px) rotate(45deg); }
.essiential-circle-item-deg-25 { transform: rotate(-20deg) translate(210px) rotate(20deg); }
.essiential-circle-item-deg-5 { transform: rotate(-5deg) translate(200px) rotate(5deg); }
.essiential-circle-item-deg5 { transform: rotate(5deg) translate(80px) rotate(-5deg); }

.essiential-circle-item-deg-45-2 { transform: rotate(-45deg) translate(80px) rotate(45deg); }
.essiential-circle-item-deg-25-2 { transform: rotate(-20deg) translate(140px) rotate(20deg); }
.essiential-circle-item-deg-5-2 { transform: rotate(-5deg) translate(150px) rotate(5deg); }
.essiential-circle-item-deg5-2 { transform: rotate(5deg) translate(120px) rotate(-5deg); }





.essiential-circle-item-deg20 { transform: rotate(20deg) translate(220px) rotate(-20deg); }
.essiential-circle-item-deg40 { transform: rotate(40deg) translate(180px) rotate(-40deg); }
.essiential-circle-item-deg80 { transform: rotate(80deg) translate(70px) rotate(-80deg); }

.essiential-circle-item-deg10-2 { transform: rotate(10deg) translate(120px) rotate(-10deg); }
.essiential-circle-item-deg20-2 { transform: rotate(20deg) translate(140px) rotate(-20deg); }
.essiential-circle-item-deg25-2 { transform: rotate(25deg) translate(180px) rotate(-25deg); }






.essiential-circle-item-deg-7 { transform: rotate(-5deg) translate(130px) rotate( 5deg); }
.essiential-circle-item-deg140 { transform: rotate(155deg) translate(140px) rotate(-155deg); }
.essiential-circle-item-deg170 { transform: rotate(170deg) translate(225px) rotate(-170deg); }
.essiential-circle-item-deg180 { transform: rotate(180deg) translate(205px) rotate(-180deg); }

.essiential-circle-item-deg-7-2 { transform: rotate(125deg) translate(60px) rotate( -125deg); }
.essiential-circle-item-deg140-2 { transform: rotate(165deg) translate(150px) rotate(-165deg); }
.essiential-circle-item-deg170-2 { transform: rotate(175deg) translate(190px) rotate(-175deg); }
.essiential-circle-item-deg180-2 { transform: rotate(180deg) translate(140px) rotate(-180deg); }






.essiential-circle-item-deg210 { transform: rotate(220deg) translate(130px) rotate(-220deg); }
.essiential-circle-item-deg195 { transform: rotate(205deg) translate(210px) rotate(-205deg); }
.essiential-circle-item-deg185 { transform: rotate(195deg) translate(240px) rotate(-195deg); }
.essiential-circle-item-deg175 { transform: rotate(195deg) translate(170px) rotate(-195deg); }

.essiential-circle-item-deg210-2 { transform: rotate(220deg) translate(90px) rotate(-220deg); }
.essiential-circle-item-deg195-2 { transform: rotate(190deg) translate(150px) rotate(-190deg); }
.essiential-circle-item-deg185-2 { transform: rotate(180deg) translate(160px) rotate(-180deg); }
.essiential-circle-item-deg175-2 { transform: rotate(170deg) translate(120px) rotate(-170deg); }

.index-cycle-item-circle-content-item{
    width: 210px;
    display: flex;
    justify-content: space-around
}
.index-cycle-item-circle-content-item-title{
    font-size: 20px;
    margin-top: 15px;
    margin-right: 10px;
}
.index-cycle-item-circle-content-item-img{
    /* cursor: pointer; */
}
.index-cycle-merits-circles{
    display: none;

}
.index-cycle-merits-small-circle{
    margin-top: 10px;
    /* cursor: pointer; */
}