your cover

your cover

by pj_js15

HTML

<div class='container'>
    <div class='item'>
        <div class='title'>Sample Title</div>
        <p class='description'>
            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec nec odio dui. In ultrices ultrices tellus a maximus. Vestibulum eget libero ut nibh convallis imperdiet. Cras non diam auctor, suscipit massa a, porta tellus. Ut efficitur tortor sit amet
            facilisis pulvinar. Pellentesque interdum iaculis libero, in iaculis lacus venenatis nec.
        </p>
    </div>
    <div class='item'>
        <div class='title'>Sample Title Two</div>
        <p class='description'>
            Phasellus pellentesque tellus metus, id laoreet magna vestibulum sed. Etiam fringilla velit dolor, at gravida magna consectetur a. Praesent aliquam sagittis augue eu hendrerit. Ut vel odio a lacus gravida imperdiet ut sit amet libero. Vivamus lacus dui,
            pharetra in nunc interdum, laoreet faucibus risus. Mauris nunc diam, tincidunt sed neque eu, malesuada tempus lacus. Vestibulum vitae arcu sed metus ultrices venenatis sit amet in justo.
        </p>
    </div>
</div>

<div class='titleContainer'>
    <div class='pageTitle'><span class='titleBG'>Page Title Sample</span></div>
    <hr class='bgLine' />
</div>

<div class='radiobuttonContainer'>
    <div class='left'>
        <div class='inputGroup'>
            <label><input type='radio' name='test' />Option One</label>
        </div>
        <div class='inputGroup'>
            <label><input type='radio' name='test' />Option Two</label>
        </div>
    </div>
    <div class='right'>
        <div class='inputGroup'>
            <label><input type='radio' name='test' />Option Three</label>
        </div>
    </div>
    
    
</div>

CSS

* {
    font-family: arial;
}

.container {
    background-color: #F1E2F7;
    border-radius: 5px;
    padding: 20px 10px;
}

.item {
    text-align: center;
}

.item .title {
    color: #8D54A1;
    font-size: 18px;
    font-weight: bold;
}

.item .description {
    color: #666666;
    font-size: 16px;
    margin-top: 5px;
}

.pageTitle {
    text-align: center;
    position: relative;
    top: 19px;
}

.titleBG {
    background-color: #FFF;
    padding: 0 6px;
}

.radiobuttonContainer{
    padding: 20px;
    border: 1px solid red;
    display: flex;
}

.radiobuttonContainer > label {
    font-size: 18px;
}
.inputGroup {
    padding: 10px 0;
}
.left{
    flex: 0 0 65%;
}
.right{
    flex: 1;
}