html,body{
    width: 100%;
    padding: 0;
    margin: 0 auto;
    font-family: Arial, Helvetica, sans-serif;
    color: #C8D3D0;
    background-color: #161715;
}

a{
    color: #C8D3D0;
}
.header{
    width: 80%;
    height: 80px;
    position: relative;
    margin: 0 auto;
}
.agreement{
    width: 80%;
    margin: 0 auto;
}
.updated-date{
    float: right;
    padding: 0;
    margin: 0;
}
.terms-title{
    float: left;
    padding: 0;
    margin: 0;
}
.term-top{
    clear: both;
    height: 90px;
    line-height: 90px;
    padding-top: 20px;
}
.logo,.logoblack{
    height: 50px;
    position: absolute;
    left: 0px;
    bottom: 15px;
}
.term-links{
    width: 100%;
    text-align: right;
    line-height: 85px;
    font-size: 11pt;
}
.term-links a,.term-links strong {
    margin-right:8px;
}

.extrainfo {
	background: #555;
}

.logoblack {display:none;}
@media (max-width: 720px) {
	.logo {display: none;}
	.logoblack {display:block;}

	html,body{
		background-color: black !important;
		color: white;
		width: 100%;
		height: 100%;
	}
	.agreement {
		margin: 10px 5%;
		width: 90% !important
	}
	a{
		color: white;
	}
	.header {
		height: 100px;
	}
	.logo,.logoblack {
		position: static;
		margin-top: 20px;
		margin-bottom: 20px;
	}
	.term-links {
	    text-align: left;
		line-height: 26px;
		margin-top: 10px;
	}
	.term-top {
		height: auto;
		padding-top: 50px;
	}
	.term-top * {
		float: none;
		line-height: 30px;
	}
	.extrainfo {
		background: rgba(0,0,0,0.2);
	}
}