/* reset */
@import url('https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,700|Open+Sans:300,400,600,700');
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
dl,
dt,
dd,
ol,
nav ul,
nav li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
copyright,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

article,
aside,
details,
figcaption,
figure,
copyright,
header,
hgroup,
menu,
nav,
section {
    display: block;
}

ol,
ul {
    list-style: none;
    margin: 0px;
    padding: 0px;
}

blockquote,
q {
    quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
    content: '';
    content: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

/* start editing from here */
a {
    text-decoration: none;
}

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

/* text align right */
.txt-lt {
    text-align: left;
}

/* text align left */
.txt-center {
    text-align: center;
}

/* text align center */
.float-rt {
    float: right;
}

/* float right */
.float-lt {
    float: left;
}

/* float left */
.clear {
    clear: both;
}

/* clear float */
.pos-relative {
    position: relative;
}

/* Position Relative */
.pos-absolute {
    position: absolute;
}

/* Position Absolute */
.vertical-base {
    vertical-align: baseline;
}

/* vertical align baseline */
.vertical-top {
    vertical-align: top;
}

/* vertical align top */
nav.vertical ul li {
    display: block;
}

/* vertical menu */
nav.horizontal ul li {
    display: inline-block;
}

/* horizontal menu */
img {
    max-width: 100%;
}

/* //end reset */
body {
    font-size: 100%;
    font-family: "Open Sans", sans-serif;
    background: #161b5e8a;
}

.main-bg {
   /*  background: url(../images/bg2.jpg) no-repeat center; 
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    -ms-background-size: cover;
    min-height: 100vh; */ position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
	 background:#ffffff;   font-family: "Open Sans", sans-serif;
}

/* title */
h1 {
    font-size: 2.8vw;
    color: #fff;
    text-align: center;
    padding: 1.5vw 1vw 2vw;
    letter-spacing: 3px;
    text-transform: uppercase;
}

/* //title */

/* content */
.sub-main-w3 {
    margin: 0;
}

.bg-content-w3pvt {
    max-width: 450px; width: 450px;
    margin: 0 auto;
    text-align: center; background:#161b5f;
}
.bg-content-w3pvt p { font-size:13px;}
.top-content-style {
    padding:2vw 1vw 0px 1vw;
	background:#ff685c ;     border: 1px solid #ff685c;
}

.top-content-style img {
    -webkit-border-radius: 50%;
    -o-border-radius: 50%;
    -ms-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}

.sub-main-w3 form {
    background: #ffff;
    padding: 1.3em;
    -webkit-box-shadow: 2px 5px 16px 2px rgba(16, 16, 16, 0.18);
    -moz-box-shadow: 2px 5px 16px 2px rgba(16, 16, 16, 0.18);
    box-shadow: 2px 5px 16px 2px rgba(16, 16, 16, 0.18);
    margin: -2.5em 2.5em 2em;
    -webkit-border-radius: 4px;
    -o-border-radius: 4px;
    -ms-border-radius: 4px;
    -moz-border-radius: 4px;    
    border-radius: 4px;
}

.loginform h5 {
    color: #161b5e;     margin-top: 20px;
    font-size: 20px; font-weight:600;
    text-align: center;  margin-bottom: 10px;
}
.loginform p {  font-size: 13px; color: #161b5e;  line-height:25px; font-weight:500;}

p.legend span {
    color: #000;
    margin-left: 10px;
}

.input {
    position: relative;
    margin: 20px auto;
    width: 100%
}

.input span {
    position: absolute;
    display: block;
    color: #161b5e7a;
    right: 10px;
    top: 7px;
    font-size: 18px;
    text-align: right;
}

.input input  {
    width: 100%;
    padding: 0.6rem 0.75rem;
    display: block;
    border: none;
    border: 1px solid #e1e1e1;
    color: #000; line-height: 1.6;
    box-sizing: border-box;
    outline: none; font-family: "Open Sans", sans-serif;
    background: #fff; font-size:13px; font-weight:400;
    border: 1px solid #e3ebf3;
    border-radius: 3px;
}
 .input-group  { width:100%;}
  .input-group input span { }
   .input-group button 
  { padding: 0.375rem 0.75rem; width: 10%;  display: inline-block;
	  background: #fff; font-size:14px; font-weight:400; border: 1px solid #e1e1e1;
    outline: none; 
  }
 .input-group input { 
        width: 88%;
  line-height: 1.6; padding: 0.375rem 0.75rem;
    display: inline-block;
    border: none;
    border: 1px solid #e1e1e1;
    color: #000;
    box-sizing: border-box;
    outline: none; font-family: "Open Sans", sans-serif;
    background: #fff; font-size:14px; font-weight:400;     border: 1px solid #e3ebf3;
    border-radius: 3px;
   
}
.input button { cursor:pointer;     font-size: 15px;  color: #161b5e7a; outline:none;  border: none;
background: #fff;}
.input button:focus{ background: #fff;outline:none;  border: none; }
.submit {
color:#fff;
    display: block;
    margin: 1em auto 0;
    cursor: pointer; 
	font-weight: 600; 
	background:#2196F3;
    letter-spacing: .03em; 
    min-width: 2.375rem; font-family: "Open Sans", sans-serif;
	border: 1px solid transparent;
    padding: 0.375rem 2rem;
    font-size: 14px;
    line-height: 1.84615385;
    border-radius: 3px; 
	box-shadow: 0 4px 6px rgba(50, 50, 93, .11), 0 1px 3px rgba(0, 0, 0, .08);
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
   .submit:hover{ color: #fff;
    background-color: #161b5e;
    border-color: #161b5e;
   }
.submit span {
    color: #fff;
    font-size: 20px;
}

.submit:hover {
   
    -webkit-transition: 0.5s all;
    -o-transition: 0.5s all;
    -moz-transition: 0.5s all;
    -ms-transition: 0.5s all;
    transition: 0.5s all;
}

a.bottom-text-w3ls {
    color: #fff;
    font-size: 13px; 
    display: inline-block;
    margin: 0em 1em 2em 1em;
	font-family: "Open Sans", sans-serif; text-decoration: none;
}

/* //content */

/* copyright */
.copyright {
    margin-top: 3.08vw;
    padding-bottom: 1.5vw;
}

.copyright h2 {
    font-size: 16px;
    color: #fff;
    letter-spacing: 1px;
    text-align: center;
    line-height: 1.8;
}

.copyright h2 a {
    color: #1cc7d0;
    -webkit-transition: 0.5s all;
    -o-transition: 0.5s all;
    -moz-transition: 0.5s all;
    -ms-transition: 0.5s all;
    transition: 0.5s all;
}

.copyright h2 a:hover {
    opacity:.8;
    -webkit-transition: 0.5s all;
    -o-transition: 0.5s all;
    -moz-transition: 0.5s all;
    -ms-transition: 0.5s all;
    transition: 0.5s all;
}

/* //copyright */

/* responsive */
@media(max-width:1280px) {
    .top-content-style {
        
    }
}

@media(max-width:1080px) {
    h1 {
        font-size: 3.5vw;
    }
}

@media(max-width:991px) {
    h1 {
        font-size: 4vw;
    }

 /*   .top-content-style {
        padding: 3vw 4vw 6vw;
    } */
}

@media(max-width:800px) {
    h1 {
        font-size: 5vw;
        padding: 2.5vw 1vw 3vw;
    }

   /* .top-content-style {
        padding: 4vw 4vw 9vw;
    } */

    .copyright {
        margin-top: 3em;
        padding-bottom: 1.5em;
    }
}

@media(max-width:640px) {
    h1 {
        font-size: 6vw;
        padding: 3vw 1vw 4vw;
    }
}

@media(max-width:600px) {
    .copyright h2 {
        letter-spacing: 1px;
    }
}

@media(max-width:480px) {
    h1 {
        font-size: 2em;
        letter-spacing: 1px;
    }

   /* .top-content-style {
        padding: 2em 1em 4em;
    } */

    .copyright h2 {
        font-size: 15px;
    }

    .copyright {
        margin-top: 2em;
        padding-bottom: 1em;
    }

    p.legend {
        font-size: 23px;
    }

    a.bottom-text-w3ls {
        font-size: 15px;
    }
}

@media(max-width:384px) {
    .sub-main-w3 form {
        margin: -2.5em 2em 2em;
    }

    h1 {
        padding: 5vw 1vw 6vw;
    }
}

@media(max-width:320px) {
    h1 {
        font-size: 1.7em;
    }

    .sub-main-w3 form {
        margin: -2em 1em 1.5em;
        padding: 1.5em;
    }

   /* .top-content-style {
        padding: 1.5em 1em 3em;
    } */

    .copyright h2 {
        font-size: 14px;
    }
}

/* //responsive */

.text-white { color:#fff;     font-size: 14px;}
.ml-0 { margin-left:0px!important;}