article {
    margin-top: 2em;
    padding: 4em;
    position: relative;
    background: linear-gradient(-135deg, transparent 1.5em, #F1EDE9 0) no-repeat;
    background-repeat: no-repeat;
    border-radius: 5px;
    box-shadow: 1px 6px 5px -5px rgba(0,0,0,1);
}

article::after{
    content: '';
    width: 3.13em;
    height: 3.15em;
    position: absolute;
    top: 0;
    right: 0;
    display: inline-block;
    background: linear-gradient(-145deg, transparent 1.5em, #bebebe 0) no-repeat;
    border-bottom-left-radius: 5px;
    background-repeat: no-repeat;
}

article.curved,
article.non-forty-five {
    background: linear-gradient(-150deg, transparent 1.5em, #F1EDE9 0) no-repeat;
    
}
article.non-forty-five::after{
    content: '';
    height: 4.3em;
    width: 4.3em;
    position: absolute;
    top: 0;
    right: 0;
    display: inline-block;
    background: linear-gradient(to left bottom, transparent 50%, #d8d8d8 0);
    transform: translate(-10px, -10px) rotate(-28.5deg);
    border-bottom-left-radius: 5px;
    box-shadow: -4px 3px 3px #2e5c67;
}

article.curved::after {
    height: 3.2em;
    width: 1.35em;
    transform: translate(-0.8em, -0.73em) rotate(-36.7deg);
    background: linear-gradient(to left bottom, transparent 50%, #F1EDE9 0, #f3f3f3 27px, #888888);
    box-shadow: 0 6px 4px -4px #112429;
}

.person{
    font-family: 'Special Elite', cursive;
    font-size: 1.2em;
    line-height: 2em;
    margin-top: 1.5em;
    margin-bottom: 1.5em;
    text-align: justify;
    color: #1a1f25;
}

article .question{
    color: #5e5e5e;
    text-transform: uppercase;
}

article hr{
    background-color: #fff;
	border-top: 2px dashed #7b7d7d;
    margin-top: 1.2em;
    margin-bottom: 1.2em;
}

.space-info{
    margin-top: -5.5em;
    position: relative;
}

.titletop{
    margin-top: 2em;
    text-align: left;
    color: #5e5e5e;
}

.questiontop{
    margin-top: 1.5em;
}

.nickpicture{
    position: relative;
    top:-6.2em;
}

.iconSizeList{
    width: 2em;
    height: 2em;
    margin-top: 0.2em;
}

.card-title-person {
    font-family: 'Special Elite', cursive;
    font-size: 1.15em;
    line-height: 1.2em;
    margin-top: -2.8em;
    margin-bottom: 0em;
    color: #1d1d1d;
    text-transform: uppercase;
    text-align: center;
}

body.dark article.curved,
body.dark article.non-forty-five {
    background: linear-gradient(-150deg, transparent 1.5em, #191919 0) no-repeat;
    color: #E0E0E0;
}

body.dark article.non-forty-five::after{
    content: '';
    height: 4.3em;
    width: 4.3em;
    position: absolute;
    top: 0;
    right: 0;
    display: inline-block;
    background: linear-gradient(to left bottom, transparent 50%, #191919 0);
    transform: translate(-10px, -10px) rotate(-28.5deg);
    border-bottom-left-radius: 5px;
    box-shadow: -4px 3px 3px #2e5c67;
}

body.dark article.curved::after {
    height: 3.2em;
    width: 1.35em;
    transform: translate(-0.8em, -0.73em) rotate(-36.7deg);
    background: linear-gradient(to left bottom, transparent 50%, #2c2c2c 0, #2e2e2e 27px, #000000);
    box-shadow: 0 6px 4px -4px #112429;
}

body.dark .titletop{
    margin-top: 2em;
    text-align: left;
    color: #616161;
}

body.dark article hr{
    background-color: #616161;
	border-top: 2px dashed #ffffff;
}

body.dark article .question{
    color: #616161;
    text-transform: uppercase;
}

.one {
    order: 1;
}

.two {
    order: 2;
}


@media (max-width: 1199px) {
    .one {
        order: 2;
        margin-top: -8em;
    }

    .two {
        order: 1;
    }

    .space-info{
        margin-top: 1em;
        position: relative;
    }

    .card-title-person {
        font-size: 1em;
        line-height: 1.2em;
        margin-top: -2.5em;
    }

}

@media (max-width: 1480px) {


    .card-title-person {
        font-size: 1em;
        margin-top: -2.35em;
    }

}