/* ===========================
   RESET
=========================== */

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

/* ===========================
   PAGE
=========================== */

body{
    background:#FFFFF2;
    font-family:"Times New Roman", serif;
}

#body_wrapper{
    width:96%;
    max-width:1000px;
    margin:20px auto;
}

/* ===========================
   MAIN PANEL
=========================== */

#main_section{

    background:#FFFFB0;

    border:4px solid red;

    padding:25px;

}

/* ===========================
   HEADING
=========================== */

h1{

    text-align:center;

    font:italic bold 40px Tahoma, Arial, sans-serif;

    color:#1A22CC;

    margin-bottom:25px;

}

/* ===========================
   INTRO
=========================== */

.intro{

    width:92%;

    margin:0 auto 30px auto;

    font-size:18px;

    line-height:1.6;

}

/* ===========================
   TRACT LIST
=========================== */

.tract-list{

    width:85%;

    margin:0 auto;

    padding-left:35px;

}

.tract-list li{

    margin-bottom:14px;

}

.tract-list a{

    font-size:30px;

    color:#003399;

    text-decoration:none;

}

.tract-list a:hover{

    color:red;

    text-decoration:underline;

}

/* ===========================
   NAVIGATION
=========================== */

#navigation{

    margin:30px 0;

    text-align:center;

}

#navigation ul{

    list-style:none;

}

#navigation li{

    display:inline;

}

#navigation a{

    margin:0 18px;

    color:#003399;

    text-decoration:none;

    font:bold 14px Tahoma, Arial, sans-serif;

}

#navigation a:hover{

    color:red;

    text-decoration:underline;

}

/* ===========================
   FOOTER
=========================== */

#page_footer{

    margin-top:25px;

    border-top:3px solid blue;

    padding:20px;

    text-align:center;

    font:10px Tahoma, Arial, sans-serif;

}

#page_footer a{

    color:#003399;

    text-decoration:none;

}

/* ===========================
   MOBILE
=========================== */

@media screen and (max-width:768px){

h1{

    font-size:28px;

}

.intro{

    width:100%;

}

.tract-list{

    width:100%;

    padding-left:22px;

}

.tract-list a{

    font-size:22px;

}

#navigation li{

    display:block;

    margin:12px 0;

}

#navigation a{

    margin:0;

}

}