@charset 'utf-8';
@import url(reset.css);

html, body {
    background-color: #e1e1e1;
    margin: 0;
    padding: 0;
}

body {
    font: 12pt "Segoe UI",Frutiger,"Frutiger Linotype","Dejavu Sans","Helvetica Neue",Geneva,Helvetica,Arial,sans-serif;
    color: #616265;
    background-color: #fff;
    margin: 0 auto;
    padding: 5px;
}

header {
    margin-bottom: 5px;
}

h1, h2, h3, h4 {
    margin: 0;
    padding: 0;
    font-weight: bold;
    color: #000;
}


h1 {
    font-size: 25pt;
}

h2 {
    font-size: 20pt;
    padding-bottom: 5px;
}

h3, h4 {
    font-weight: normal;
    font-style: normal;
}

h3 {
    padding-top: 5px;
    font-size: 15pt;
}

h3:before {
    position: relative;
    bottom: .1em;
    color: #666;
}

h4 {
    font-size: 12pt;
}

a {
    cursor: pointer;
    color: #000;
}

main {
    display: block;
}

main h2 {
    margin-top: 25px;
    padding-top: 5px;
    border-top: 2px solid #e1e1e1;
}

.collateral li: {
   padding-top: 20pt; 
}

.collateral li:before {
   content: '▼ ';
}

@media only screen and (min-width : 800px) {

    body {
        padding-left: 75px;
	width: 80%;
    }

    header {
        margin-bottom: 15px;
    }

    a {
        text-decoration: none;
    }

    nav ul {
        font-size: 12pt;
    }

    nav li, .collateral li {
        display: inline-block;
    }

    nav li:after, .collateral li:after {
        content: ' |';
    }

    nav li:last-child:after {
        content: '';
    }

    .collateral li:before {
        content: '';        
    }

    .collateral li:first-child:before {
        content: '[ ';
    }

    .collateral li:last-child:after {
        content: ' ]';
    }
}