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,
footer,
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,
footer,
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%;*/
    width: 100%;
    max-width: 40%;
    position: relative;
    left: 30%;
    right: 50%;
}
/*--end reset--*/

body {
    font-family: sans-serif;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    background: url(../Login/images/bg-banner.jpeg)no-repeat 0px 0px;
    background-size: cover;
    background-attachment: fixed;
}
/*-- main --*/

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
    color: #fff;
}

::-moz-placeholder { /* Firefox 19+ */
    color: #fff;
}

:-ms-input-placeholder { /* IE 10+ */
    color: #fff;
}

:-moz-placeholder { /* Firefox 18- */
    color: #fff;
}

.main {
    margin: 8em auto 0;
    width: 23%;
    background-color: #fff;
    padding: 3em;
    background-color: rgba(89, 103, 55, 0.36);
    box-shadow: #000 0 12px 41px 1px;
    border-radius: 10px;
    float: right;
    margin-right: 65px !important;
}

h1 {
    color: #fff;
    font-weight: 600;
    font-size: 24px;
    text-align: center;
    font-family: sans-serif;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}

.signin-form {
    padding-top: 3em;
}

    .signin-form input[type="text"],
    .signin-form input[type="password"] {
        width: 85%;
        padding: .8em 3em .8em 1em;
        font-size: 0.8em;
        margin: 1em 0;
        outline: none;
        color: #fff;
        border: 2px solid #e3e3e3;
        border-radius: 3px;
    }

    .signin-form input[type="text"] {
        background: url(../images/1.png)no-repeat 97% center;
        display: block;
    }

    .signin-form input[type="password"] {
        background: url(../images/2.png)no-repeat 97% center;
        display: block;
    }

    .signin-form input[type="submit"] {
        outline: none;
        padding: 0.8em 0;
        width: 100%;
        text-align: center;
        font-size: 1em;
        margin-top: 1em;
        border: none;
        color: #fff;
        cursor: pointer;
        background: rgb(255, 168, 76);
        background: -moz-linear-gradient(-45deg, rgba(255, 168, 76, 1) 31%, rgba(255, 123, 13, 1) 60%);
        background: -webkit-linear-gradient(-45deg, rgba(255, 168, 76, 1) 31%, rgba(255, 123, 13, 1) 60%);
        /*background: linear-gradient(135deg, rgba(255, 168, 76, 1) 31%, rgba(255, 123, 13, 1) 60%);*/
        background: linear-gradient(135deg, rgb(151, 149, 19) 31%, rgb(155, 151, 17) 60%);
        filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#ffa84c', endColorstr='#ff7b0d', GradientType=1);
    }

        .signin-form input[type="submit"]:hover {
            color: #000000;
            background: rgb(245, 246, 246);
            background: -moz-linear-gradient(-45deg, rgba(245, 246, 246, 1) 0%, rgba(219, 220, 226, 1) 21%, rgba(184, 186, 198, 1) 49%, rgba(221, 223, 227, 1) 80%, rgba(245, 246, 246, 1) 100%);
            background: -webkit-linear-gradient(-45deg, rgba(245, 246, 246, 1) 0%, rgba(219, 220, 226, 1) 21%, rgba(184, 186, 198, 1) 49%, rgba(221, 223, 227, 1) 80%, rgba(245, 246, 246, 1) 100%);
            background: linear-gradient(135deg, rgba(245, 246, 246, 1) 0%, rgba(219, 220, 226, 1) 21%, rgba(184, 186, 198, 1) 49%, rgba(221, 223, 227, 1) 80%, rgba(245, 246, 246, 1) 100%);
            filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#f5f6f6', endColorstr='#f5f6f6', GradientType=1);
            transition: .5s all;
            -webkit-transition: .5s all;
            -moz-transition: .5s all;
            -o-transition: .5s all;
            -ms-transition: .5s all;
        }

.text-left {
    float: left;
    width: 55%;
    text-align: center;
}

.text-right {
    float: right;
    width: 45%;
}

.signin-text {
    margin-top: 1.5em;
}

    .signin-text p {
        font-size: .9em;
    }

        .signin-text p a {
            color: #999;
        }

            .signin-text p a:hover {
                color: #000;
                transition: 0.5s all;
                -webkit-transition: 0.5s all;
                -moz-transition: 0.5s all;
                -o-transition: 0.5s all;
                -ms-transition: 0.5s all;
            }

h5 {
    text-align: center;
    font-size: 1em;
    margin: 0.5em auto;
    color: #fff;
}

.social-icons {
    display: block;
    text-align: center;
}

    .social-icons ul li {
        display: inline-block;
        margin-right: 5px;
    }

    .social-icons a {
        background: url(../images/sprite.png)no-repeat 0px 0px;
        display: block;
        width: 33px;
        height: 30px;
        transition: 0.5s all;
        -webkit-transition: 0.5s all;
        -moz-transition: 0.5s all;
        -o-transition: 0.5s all;
        -ms-transition: 0.5s all;
    }

        .social-icons a:hover {
            transform: rotatey(360deg);
        }

        .social-icons a.fb {
            background: url(../images/sprite.png)no-repeat 0px -35px;
        }

        .social-icons a.be {
            background: url(../images/sprite.png)no-repeat 0px -69px;
        }

        .social-icons a.gg {
            background: url(../images/sprite.png)no-repeat 0px -105px;
        }

.copyright {
    /*margin: 3em 0 2em;
    text-align: center;*/
    position: fixed;
    bottom: 0px;
    width: 100%;
    overflow: visible;
    z-index: 99;
    clear: both;
    background-color: rgba(0,0,0,.6);
    text-align: center;
    font-size: 13px;
}

    .copyright p {
        color: #fff;
    }

        .copyright p a {
            color: #fff;
        }

            .copyright p a:hover {
                color: #EF781F;
            }
/*---- responsive-design -----*/

@media(max-width:1440px) {
    body {
        background-position: center;
    }

    .signin-form input[type="text"],
    .signin-form input[type="password"] {
        width: 83%;
    }
}

@media(max-width:1366px) {
    .main {
        margin: 6em auto 0;
        padding: 2.5em 2em;
        background-color: rgba(89, 103, 55, 0.36);
        box-shadow: #000 0 12px 41px 1px;
    }

    .signin-form {
        padding-top: 1em;
    }
}

@media(max-width:1080px) {
    .main {
        padding: 2.5em 2em 2em;
        width: 30%;
    }
}

@media(max-width:1024px) {
    .main {
        padding: 2em;
        margin: 5em auto 0;
    }

    h5 {
        margin: 2em auto;
    }
}

@media(max-width:768px) {
    .main {
        padding: 2em;
        margin: 4em auto 0;
        width: 40%;
    }

    .signin-form {
        padding-top: 1em;
    }

    .copyright p {
        font-size: 1em;
    }

    .signin-form input[type="submit"] {
        padding: 0.6em 0;
        font-size: 0.9em;
        margin-top: 0.6em;
    }

    h5 {
        margin: 1.5em auto 2em;
    }

    .copyright {
        margin: 3em 0;
    }
}

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

    .main {
        margin: 5em auto 0;
        width: 47%;
    }
}

@media(max-width:480px) {
    .main {
        margin: 4em auto 0;
        width: 54%;
    }

    .signin-form input[type="text"],
    .signin-form input[type="password"] {
        width: 79%;
    }
}

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

    .main {
        margin: 2.5em auto 0;
        width: 73%;
        padding: 2em 1.5em 1.5em;
    }

    .signin-form input[type="text"],
    .signin-form input[type="password"] {
        width: 78%;
        font-size: 0.7em;
    }

    .signin-form input[type="submit"] {
        font-size: 0.8em;
        margin-top: 0.5em;
    }

    .signin-text p {
        font-size: .85em;
    }

    .text-left {
        width: 45%;
    }

    .text-right {
        width: 47%;
    }

    .copyright {
        margin: 2em 1em;
        line-height: 1.5em;
    }

        .copyright p {
            font-size: 0.9em;
        }
}
/*--//responsive-design---*/


.logo img {
    width: 100%;
}