*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{
    font-family:Arial, Helvetica, sans-serif;
    background:#fff;
    color:#333;
}

/* TITLE */

.site-title{
    text-align:center;
    font-size:42px;
    font-weight:bold;
    color:#1e4e8c;
    margin:25px 0;
    line-height:1.2;
}

.site-title span{
    display:inline;
}

/* PAGE LAYOUT */

.wrapper{
    width:95%;
    max-width:1600px;
    margin:auto;
    display:flex;
    gap:30px;
}

/* MAIN CONTENT */

.main{
    width:70%;
}

/* SIDEBAR */

.sidebar{
    width:30%;
}

.sidebar h3{
    color:#cc6600;
    border-bottom:2px solid #cc6600;
    padding-bottom:8px;
    margin-bottom:15px;
}

.sidebar ul{
    padding-left:20px;
}

.sidebar li{
    margin-bottom:10px;
}

.sidebar a{
    text-decoration:none;
    color:#333;
}

.sidebar a:hover{
    color:#cc6600;
}

/* LESSON */

.lesson{
    display:flex;
    gap:15px;
    padding:15px 0;
    border-bottom:1px solid #ddd;
}

.lesson img{
    width:400px;
    height:auto;
    flex-shrink:0;
    display:block;
}

.lesson-content{
    flex:1;
}

.lesson-content h2{
    font-size:28px;
    margin-bottom:8px;
}

.lesson-content p{
    line-height:1.6;
    margin-bottom:10px;
}

.lesson-content a{
    color:#cc6600;
    text-decoration:none;
    font-weight:bold;
}

/* ADS */

.ad-container{
    margin:15px 0;
    padding:10px 0;
    border-top:1px solid #e5e5e5;
    border-bottom:1px solid #e5e5e5;
}

.ad-label{
    font-size:11px;
    color:#999;
    margin-bottom:5px;
}

/* MOBILE */

@media(max-width:768px){

    .site-title{
        font-size:32px;
        padding:0 10px;
    }

    .site-title span{
        display:block;
    }

    .wrapper{
        display:block;
    }

    .main{
        width:100%;
    }

    .sidebar{
        width:100%;
        margin-top:30px;
    }

    /* IMAGE LEFT, TEXT RIGHT */

    .lesson{
        display:flex;
        flex-direction:row;
        align-items:flex-start;
        gap:12px;
        padding:12px 0;
    }

    .lesson img{
    width:140px;
    height:auto;
    flex-shrink:0;
}

    .lesson-content{
        flex:1;
    }

    .lesson-content h2{
        font-size:18px;
        margin-bottom:5px;
        line-height:1.3;
    }

    .lesson-content p{
        font-size:14px;
        line-height:1.4;
        margin-bottom:6px;
    }

    .lesson-content a{
        font-size:14px;
    }

}