@charset "utf-8";
/* CSS Document */
main{
    display:flex;
    flex-direction: row;
    box-sizing:border-box;
    width:100%;
}
main header{
    height:fit-content;
}
.smartImg{
    position:absolute;
    display:block;
    width:100%;
    overflow: hidden;
}
#sideImgLeft{
    display:none;
}
#tabletImg{
    display:none;
}
article{
    min-width:300px;
    background-color:white;
    margin-bottom:2rem;
}
#sideImgRight{
    display:none;
}
article header{
    box-sizing:border-box;
    text-align:right;
    margin-top:30px;
    padding-right:10px;
    color:white;
}
.manaColumn_strong{
    font-weight:bold;
    font-size:1.2rem;
}
.manaColumn_space{
    margin-left:1rem;
    margin-right:1rem;
}
article p{
    text-indent:0rem;
    line-height:1.75rem;
    padding-left:1rem;
    padding-right:1rem;
    margin-bottom:1rem;
}
#articlespace{
    display: flex;
    flex-direction:column;
}
@media screen and (min-width:600px){
    main{
        box-sizing:border-box;
        padding:10px;
    }
    article header{
        text-align:center;
        margin-top:0px;
        color:black;
        display:flex;
        flex-direction:column;
    }
    .smartImg{
        display:none;
    }
    #sideImgLeft{
        display:flex;
        flex-direction:column;
    }
    #tabletImg{
        display:block;
        width:100%;
    }
    article{
        min-width:400px;
        max-width:540px;    
        padding-left:10px;
    }
    article p{
        padding-left:0;
        padding-right:0;
    }
    #sideImgRight{
        display:none;
    }
    #articlespace{
        height:800px;
        overflow-y: scroll;
        overflow-x: hidden;
    }
}
@media screen and (min-width:1024px){
    main{
        align-content: center;
    }
    .smartImg{
        display:none;
    }
    #sideImgLeft{
        display:block;
    }
    #sideImgLeft img{
        max-width:100%;
        height:auto;   
    }
    #tabletImg{
        display:none;
    }
    article{
        box-sizing:border-box;
        padding-left:10px;
        padding-right:10px;
        max-width:550px;
    }
    #sideImgRight{
        display:block;
    }
    #sideImgRight img{
        max-width:100%;
        height:auto;
    }
}
