*{margin:0; padding:0}
body{ background-image: url("//cdn.oakland.k12.mi.us/img/static/cc_home.jpg");font-family: 'Lato', sans-serif}
.form{width:400px; margin:0 auto; background:#6f859b; margin-top: 40px; border: 2px solid #E8EBEF; border-radius: 4px; -webkit-border-radius: 4px;
-moz-border-radius: 4px;}
.header{height:55px; background:#0e1f30; margin-top: -20px}
.header h2{height:55px; line-height:55px; color:#fff; text-align:center; font-size: 1.6em;}
.login{padding:10px 30px}
.login span.un{width:10%; text-align:center; color:#18BC9C; border-radius:3px 0 0 3px}
.text{background:#0e1f30; width:90%; border-radius:0 3px 3px 0; border:none; outline:none; padding-left: 8px; color:#999; font-family: 'Source Sans Pro', sans-serif} 
.text,.login span.un{display:inline-block; vertical-align:top; height:40px; outline:none; font-family: 'Lato', sans-serif; line-height:40px; background:#E8EBEF;}
.btn{height:50px; border:none; background:#18BC9C; width:100%; outline:none; font-family: 'Lato', sans-serif; font-size:20px; font-weight:bold; color:#eee; border-bottom:solid 4px #0d967b; border-radius:3px; cursor:pointer}
ul li{height:40px; margin:15px 0; list-style:none}
.span{display:table; width:100%; font-size:14px;}
.ch{display:inline-block; width:50%; color:#CCC}
.ch a{color:#CCC; text-decoration:none}
.ch:nth-child(2){text-align:right}

@media(max-width:480px){ .form{width:100%}}
.h2title {
  text-align: center;
  color: #fff;
  margin-top: 0px;
}
p.login-error {
    padding: 15px 15px 15px 0px; 
    text-align: center; 
    width: 300px; 
    display: block; 
    margin-left: auto; 
    margin-right: auto; 
    margin-bottom: -15px;
}

#duo_iframe {
    width: 100%;
    min-width: 304px;
    max-width: 620px;
    height: 330px;
    border: none;
    display: block;
    margin: 0 auto;
}