/*
font-family: 'Source Sans Pro', sans-serif; font-family: 'Roboto', sans-serif; */
body {background: #7347ab;font-size: 14px;line-height: 20px;font-family: 'Roboto', sans-serif;}

img { max-width: 100%; }
.container {max-width: 1070px;width: 100%;padding: 0;}

.cp { cursor:pointer;}

header {display: table;width: auto;padding: 20px 30px;}
header .logo {padding: 0;display: table-cell;vertical-align: middle;font-family: 'Caveat', cursive;font-size: 60px;line-height: normal;font-weight: bold;color: #a994c1;text-shadow: 3px 3px 4px rgba(0, 0, 0, 0.05);padding: 0 0 0 65px;background: url(../images/ed-logo.svg) no-repeat left center;background-size: 55px auto;}
header .logo img { height: auto; width: 440px; }
header .number {display: table-cell;vertical-align: middle;font-size: 25px;color: #a994c1;padding-left: 25px;font-weight: 400;}

.body {background: #fff;margin: 20px 0;border-radius: 10px;box-shadow: 0 2px 4px 0 rgba(0,0,0,0.6);background-image: url(en-US/images/loginpic.jpg);background-repeat: no-repeat;background: url(../images/pattern-bg.png) repeat;background-color: #B3B2B1;position: relative;display: table;width: 100%;}

.sidebar {/* background-image: url(en-US/images/loginpic.jpg); *//* background-repeat: no-repeat; *//* background: url(../images/pattern-bg.png) repeat; *//* background-color: #B3B2B1; *//* border-radius: 0 10px 10px 0; */padding: 20px;}

.content {background: url(../images/banner.jpg) no-repeat 30% 40%;background-size: 120% auto;min-height: 570px;margin-bottom: 96px;border-radius: 10px 0 0 0;}

.form { background-color: #9A9998; background-image: -moz-linear-gradient(top, #9A9998 0%, #9A9998 100%); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #9A9998), color-stop(100%, #9A9998)); background-image: -webkit-linear-gradient(top, #9A9998 0%, #9A9998 100%); background-image: -o-linear-gradient(top, #9A9998 0%, #9A9998 100%); background-image: -ms-linear-gradient(top, #9A9998 0%, #9A9998 100%); background-image: linear-gradient(to bottom, #9A9998 0%, #9A9998 100%); border: 1px solid transparent; border: 1px solid rgba(255,255,255,0.1); border-bottom: 1px solid rgba(255,255,255,0.8); border-top: 1px solid rgba(0,0,0,0.15); box-shadow: 0 1px 2px -1px rgba(0,0,0,0.3) inset; border-radius: 4px; padding: 20px; margin:0; }
.form label {font-weight: bold;margin: 0 0 4px 0;}
.form .form-control {border: 0;height: auto;padding: 4px 10px;border-radius: 3px;}

.form .form-text {text-align: right;font-size: 12px;}

.form .form-text a { color: #1A1A1A; text-decoration: none; }
.form .form-text a:hover { text-decoration: underline; }

.form-buttons {text-align: center;margin: 0 -10px;}
.form-buttons .btn {}
.form-buttons .btn.btn-primary { min-width: 170px;  margin: 11px 10px 0 10px;  }

.form h3 {text-align: center;font-size: 20px;font-weight: bold;margin: 0 0 5px 0;}
.form .form-control:focus { box-shadow: none; }

.btn {text-shadow: 0 -1px #666;padding: 3px 13px;line-height: normal;font-weight: bold;background-color: #02255B;background-image: url(../images/btn-bg.png);background-position: top;background-repeat: repeat-x;border: 0;color: #fff;font-size: 15px;box-shadow: none;min-width: 120px;margin: 0 3px;outline: none;}
.btn:hover, .btn:focus, .btn:active {background-color: #2E688B;color:#fff;box-shadow: none;}


.btn-primary {background-color: #F05323;}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show>.btn-primary.dropdown-toggle {background-color: #F58F70;}


.b-logo {background: #a994c1;padding: 10px 15px 15px 15px;display: inline-block;margin: 0 0 0 30px;position: absolute;left: 0;bottom: 95px;max-width: 330px;}
.b-logo img {height: auto;}

.body .left-box {width: 70%;display: table-cell;position: relative;vertical-align: top;} 
.body .right-box {width: 30%;display: table-cell;vertical-align: top;}



.slider {background-color: rgba(255,255,255,0.7);border-radius: 0 0 0 10px;position: absolute;width: 100%;left: 0;bottom: 0;padding: 10px 0;}

#features {left: 0;bottom: 0;width: 650px;margin: 0;padding: 0;overflow: hidden;border-radius: 0 0 0 10px;cursor: default;}
#features li {float: left;padding: 0;border-right: 1px solid #e8e8e8;border-left: 1px solid #ccc;overflow: hidden;min-height: 76px;width: 80px;-webkit-transition: width 0.5s;transition: width 0.5s;}
#features li:first-child { border-left: none; margin-left: 5px; }
#features li.last { border-right: none; }
#features li img {position: absolute;margin: 10px 10px 0 10px;height: 50px;width: 50px;}
#features li img + span {font-weight: bold;text-shadow: 0 1px 0 #fff;font-size: 16px;line-height: 16px;}
#features li span { display: inline-block; padding-left: 90px; width: 230px; opacity: 0; -webkit-transition: opacity 0.5s; transition: opacity 0.5s; }
#features li.show { width: 320px; }
#features li.show img + span {font-weight: bold;}
#features li.show span { opacity: 1.0; }
#features li {width: 65px;}
#features li span {padding-left: 75px;width: 290px;font-size: 12px;line-height: normal; margin-top: 5px;}
#features li.show { width: 302px; }

.cp { cursor: pointer; }

.copy-right {text-align:center;color:#fff;padding: 0 0 20px 0;font-size:13px;}

@media (max-width: 1024px) { 
.body .left-box,
.body .right-box { width: 100%; display: block; }
.body {display: block;width: auto;}
.content { margin: 0; background-size:cover; background-position:center top; }
}


@media (max-width: 768px) { 
#features {width: 100%;}
#features li { width: 100%; display:block; }
.slider { position:static;}
.b-logo { position:static;} 
#features li span { opacity: 1; display: block;}
header  { margin-bottom:30px;}

header .logo { font-size: 46px; height: 75px; }
header .number { font-size: 18px; }
}

@media (max-width: 640px) {  
header .logo {font-size: 36px;}
header .number { font-size: 18px; }
}
@media (max-width: 550px) {  
header { 
padding: 10px 19px;
width: 100%;
}
header .logo {font-size: 31px;line-height:normal;background-size: auto 35px;padding-left: 40px;}
header .number {font-size: 14px;padding-left: 0;width: 80px;text-align: right;}
}
@media (max-width: 410px) {  
header .logo {font-size: 26px;}
header .number {
width: 66px;
font-size: 12px;
}
}
@media (max-width: 350px) {
header .logo {font-size: 20px;}
}

.error {
    color: #F00;
    border-color: #f1bdbd;
    background-color: #ffdddd;
}