/* STRAPI RICH TEXT */
.richtext--wrap{
    padding: 10px;
}

/* LINK COLLECTION */
.linkcollection{
    width: 100%;
}

.linkcollection--wrap{
     display: flex;
     flex-direction: row;
     flex-wrap: wrap;
     justify-content: flex-start;
}

.linkcollection--card{
    width: 300px;
    height: 200px;
    border: 1px solid #000; 
    margin: 10px;
    padding: 10px;
}

/* SIMPLE ROW: Text layout */
.simplerow--text{
    margin: 5px;
}

/* SIMPLE ROW: Table layout */
.simplerow--table{
    display: flex;
    flex-direction: row;
    width: 100%;
}

.simplerow--left{
    width: 20%;
    background: #3ca29e80;
    margin: 5px;
    padding: 5px;
}

.simplerow--right{
    margin: 5px;
    padding: 5px;
    width: 80%;
    background: white;
}

/* Table */
.strapi--table{
    width: 100%;
}

.strapi--tablerow{
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.strapi--tablecolumn{
    padding: 10px;
    flex-grow: 1;
}

/* STEP */
/* STEP */
.step{
    /* This class is JUST to make the 'flex' elements respond to 'float' of infobox */
    display: table;
    border: 0px solid blue;
    /*margin-bottom: 1%;*/
}
.step--wrap{
    /*display: flex;
    flex-direction: row;*/
    margin-bottom: 0px;
    margin-top: calc(6px + 1vw);
    
    display: inline-grid;
    grid-template-columns: calc(min(15vw, 120px)) auto;
}

.step--right{
    /*width: 74vw;*/
    margin-left: 0;
    margin-top: -8px; /* THIS IS HACKY */
    /*margin-top: calc(4px + 0.8vw);*/
    
    margin-right: 1vw;
    /*display: table-cell;
    /*flex-grow: 1;*/
}

.step--left{
    width: 98px;
    box-sizing: border-box;
    margin-left: 0;
}

.step--circle > div{
    text-align: center;
}

.step--circle-container {
    width: 100%;
    max-width: 86px;
    min-width: 30px;
    margin-left: 10px;
}

.step--circle {
    width: 100%;
    padding-top: 100%; /* This maintains the 1:1 aspect ratio */
    position: relative;
    border-radius: 50%;
    border: 0px solid #000;
    background-color: var(--praksis-color);
    box-sizing: border-box;
    height: 100%;
}

.step--circle-ctn{
    display: flex;
    flex-direction: column;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    justify-content: center;
    align-items: center;
}

.step--circle-top{
    height: 50%;
    margin-top: 5%;
}

.step--circle-top > img{
    height: 100%;
}

.step--circle-bottom{
    /*height: 5%;*/
    margin-bottom: 30%;
    margin-left: 10px;
    text-align: center;
    font-size: calc(8px + 0.5vw);
}

/* Collapsible */
.au-collapsible{
    width: 100%;
    /*position: relative;
    margin-bottom: 11px;*/
    /*border-top: 2px solid var(--praksis-color);
    border-bottom: 2px solid var(--praksis-color);*/
    /*margin-top: -2px;*/
    margin-top: 15px;
    padding: 11px;
    display: flex;
    flex-direction: column;
    background: #3ca29e33; /* rgba(60, 162, 158, 0.2 ); */
}

.csc-header{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 100%;
    cursor: pointer;
}
.csc-heading{
    font-size: 22px;
    width: 95%;
    cursor: pointer;
}
.csc-heading > h3{
    margin: 0;
}
.au-collapse-toggle{
    width: 3%;
    font-family: "au_icons";
    font-size: 32px;
    right: 3.3px;
    /*line-height: 48px;
    margin-top: 1.65px;*/
}