@import url(https://fonts.googleapis.com/css?family=Open+Sans);
@font-face {
        font-family: 'Proxima-Nova-Extrabold';
        src: url('font/Proxima-Nova-Extrabold.eot');
        src: url('font/Proxima-Nova-Extrabold.woff') format('woff'), 
                 url('font/Proxima-Nova-Extrabold.ttf') format('truetype'),
                 url('font/Proxima-Nova-Extrabold.svg') format('svg');
        font-weight: normal;
        font-style: normal;
}
@font-face {
        font-family: 'raleway-regular';
        src: url('font/raleway-regular.eot');
        src: url('font/raleway-regular.woff') format('woff'), 
                 url('font/raleway-regular.ttf') format('truetype'), 
                 url('font/raleway-regular.svg') format('svg');
        font-weight: normal;
        font-style: normal;
}



* {
  margin:0;
  padding:0;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
*:before,
*:after {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
input[type="submit"] {
    -webkit-appearance: none;
    border-radius: 0;
}
textarea:focus, input:focus{
    outline: none;
}
body, h1, h2, h3, h4, h5, h6, p, ul, ol, li{
        margin:0;
        padding:0;
}
body{
        font-size:18px;
}
.clearfix:after,
.clearfix:after{
        display:block;
        width:100%;
        content:'';
        clear:both;
}
p{
        font-size:24px;
}
.container{
        max-width:1300px;
        margin:0 auto;
}
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
        color:#000000;
        font-size:22px;
        font-family: 'raleway-regular';
}
::-moz-placeholder { /* Firefox 19+ */
        color:#000000;
        font-size:22px;
        font-family: 'raleway-regular';
}
:-ms-input-placeholder { /* IE 10+ */
        color:#000000;
        font-size:22px;
        font-family: 'raleway-regular';
}
:-moz-placeholder { /* Firefox 18- */
        color:#000000;
        font-size:22px;
        font-family: 'raleway-regular';
}


.header-banner{
        background-size:cover;
        background-position:center;
        padding:11.5% 0%;
}
.header-banner.login{
        background:url(/webspeed/images/login-header.jpg)  no-repeat;
        background-size:100%;
}
.form-section{
        padding:40px 0px 79px;
        }
.section-title h2{
        color: #b3d334;
    font-family: 'Proxima-Nova-Extrabold';
        font-size: 70px;
    line-height: 80px;
    text-transform: uppercase;
        text-align:center;
}
.sepline{
        background: #b3d334;
        height: 1px;
        margin:20px auto 82px;
        width: 196px;
        border:none;
}
footer{
        padding-bottom:140px;
        }

.logo-content > img {
    max-width: 718px;
        margin:0px auto;
        display:block;
}

.login-form input {
        background:transparent;
    border: 1px solid #000000;
    margin-bottom: 20px;
    max-width: 100%;
    padding: 11px 20px;
    text-transform: uppercase;
    width: 100%;
        font-family: 'raleway-regular';
        font-size:22px;
        line-height:27px;
        text-align:center;
        color:#000000;
}
.login-form {
        max-width:410px;
    width: 100%;
        margin:0px auto;
}
.login-form input[type="submit"]{
        width:auto;
        transition:0.3s ease;
        -webkit-transition:0.3s ease;
        font-size:22px;
        line-height:27px;
        padding: 11px 61px;
        margin:0px auto;
        display:block;
}
.login-form input[type="submit"]:hover{
        background:#b3d334;
        color:#fff;
}
/**
        Resposnive CSS
**/

@media only screen and (max-width:1400){
        .container {
                max-width: 1024px;
        }
        .logo-content > img {
                max-width: 600px;
        }
        .section-title h2 {
                font-size: 60px;
                line-height: 70px;
        }
}
@media only screen and (max-width:1220px){
        .container {
                max-width: 900px;
        }
        .section-title h2 {
                font-size: 52px;
                line-height: 62px;
        }
        .logo-content > img {
                max-width: 500px;
        }
        
}
@media only screen and (max-width:1024px){
        .container{
                width:90%;
                }
        .logo-content > img {
                max-width: 450px;
        }
}
@media only screen and (max-width:768px){
        .section-title h2 {
                font-size: 40px;
                line-height: 41px;
        }
        .form-section {
                padding: 50px 0px 90px;
        }
        
}
@media only screen and (max-width:604px){
        .header-banner.login{
                min-height:160px;
                background-size:cover;
                }
        .logo-content > img {
                max-width: 400px;
        }
        .sepline {
                margin-bottom:50px;
        }
        footer {
                padding-bottom: 100px;
        }
}
@media only screen and (max-width:480px){
        .section-title h2 {
                font-size: 32px;
                line-height: 40px;
        }
        .form-section {
                padding: 35px 0px 60px;
        }
        .logo-content > img {
                max-width: 330px;
        }
        .login-form input {
                padding: 10px 20px;
                font-size: 18px;
        }
        .login-form input[type="submit"] {
                font-size: 18px;
                padding: 10px 61px;
        }
        ::-webkit-input-placeholder { /* Chrome/Opera/Safari */
                font-size:18px;
        }
        ::-moz-placeholder { /* Firefox 19+ */
                font-size:18px;
        }
        :-ms-input-placeholder { /* IE 10+ */
                font-size:18px;
        }
        :-moz-placeholder { /* Firefox 18- */
                font-size:18px;
        }
        .header-banner.login{
                min-height:140px;
                }
}
@media only screen and (max-width:360px){
        .header-banner.login{
                min-height:120px;
                }
        .section-title h2 {
                font-size: 30px;
                line-height: 38px;
        }
        .logo-content > img {
                max-width: 250px;
        }
        .login-form input {
                font-size: 16px;
        }
        .login-form input[type="submit"] {
                font-size: 16px;
                padding: 10px 50px;
        }
        ::-webkit-input-placeholder { /* Chrome/Opera/Safari */
                font-size:16px;
        }
        ::-moz-placeholder { /* Firefox 19+ */
                font-size:16px;
        }
        :-ms-input-placeholder { /* IE 10+ */
                font-size:16px;
        }
        :-moz-placeholder { /* Firefox 18- */
                font-size:16px;
        }
        footer {
                padding-bottom: 60px;
        }
}