/* fonts */
    @font-face {
        font-family: 'dinregular';
        src: url('/fonts/din-regular-webfont.woff2') format('woff2'),
             url('/fonts/din-regular-webfont.woff') format('woff');
        font-weight: normal;
        font-style: normal;
    }

	html, body {
	    margin: 0px;
	    padding: 0px;
	}

	body {
        background-color: #404042;	
        min-width: 300px;
		font-family: dinregular;
        color: #404042;
        font-size: 14px;
    }

    /* Color styles */

    .yellow-background {
        background-color: #FCB913;
    }

    .yellow-text {
        color: #FCB913;
    }

    a {
    	color: #0000DE;
    	text-decoration: none;
    }

    h1 {
        margin-top: 0px;
        padding: 0px 0px 5px 0px;
        border-bottom: 2px solid #404042;
        font-size: 21px;
    }

    h2 {
        font-size: 16px;
        margin: 0px 0px 5px 0px;
    }

    h4 {
    	margin: 0px 0px 5px 0px;
        font-size: 14px;
    }

    h5 {
        margin: 0px;
        font-size: 12px;
    }

    .selectable {
        cursor: pointer;
    }

/* float classes */

	.left {
	    float: left;
	}
	
	.right {
	    float: right;
	}

	.clear {
	    clear: both;
	}

/* table classes */
    
    .table {
        display: table;
    }
    
    .table.full {
        width: 100%;
    }
    
    .table .row {
        display: table-row;
    }
    
    .table .cell {
        display: table-cell;
    	vertical-align: top;
    }

    .table .cell.align-bottom {
    	vertical-align: bottom;
    }

/* alignment classes */
    
    .centered {
        margin: 0px auto;
    }

    .text-left {
        text-align: left;
    }

    .text-center {
        text-align: center;
    }

    .text-right {
        text-align: right;
    }

    .desktop {
        display: block;
    }

    .mobile {
        display: none;
    }

@media only screen and (max-width: 560px) {
    .desktop { 
        display: none;
    }

    .mobile { 
        display: block;
    }
}