/* reset */

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 */

.text-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*/


/*--start-body--*/

body {
    background: url(../images/bg.jpg)no-repeat;
    position: relative;
    font-family: 'Catamaran', sans-serif;
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
}

h1.title-head {
    text-align: center;
    color: #fff;
    font-size: 2.5em;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 4px;
    word-spacing: 5px;
    margin: 1em 0;
    padding-top: 0.5em;
}

.login-head {
    margin-bottom: 2em;
}

.content {
    -webkit-box-shadow: 0px 15px 19px 0px rgba(48, 55, 102, 0.62);
    -moz-box-shadow: 0px 15px 19px 0px rgba(48, 55, 102, 0.62);
    box-shadow: 0px 15px 19px 0px rgba(48, 55, 102, 0.62);
}


.right-grid-w3ls ::-webkit-input-placeholder {
    color: #fff;
}

.right-grid-w3ls :-moz-placeholder {
    /* Firefox 18- */
    color: #fff;
}

.right-grid-w3ls ::-moz-placeholder {
    /* Firefox 19+ */
    color: #fff;
}

.right-grid-w3ls :-ms-input-placeholder {
    color: #fff;
}

.right-grid-w3ls {
    background: #eb5273;
    background: #b73737;
    background: #3b74ce;
    position: relative;
}

.login-w3l-right {
    width: 48.5%;
    float: left;
    background: #f4e0ae;
    /*background:url(../images/3.jpg) no-repeat center;
	background-size:cover;
	min-height:300px;*/
}

.login-w3l-right h2 {
    color: #a32927;
    font-size: 1.3em;
}

.wthree-left-txt {
    padding: 1.2em 2em 2em;
}

.w3ls-icon {
    border-bottom: 1px solid #fff;
    margin-bottom: 2em;
}

.w3ls-icon i {
    color: #3b74ce;
    width: 30px;
    font-size: 1em;
    height: 30px;
    background: #fff;
    line-height: 1.9;
    border-radius: 50%;
}

.right-grid-w3ls input[type="text"],
.right-grid-w3ls input[type="password"],
.right-grid-w3ls input[type="email"] {
    width: 80%;
    padding: 1em;
    border: none;
    outline: none;
    color: #fff;
    font-size: 1em;
    letter-spacing: 1px;
    background: transparent;
    transition: 0.5s all;
    -webkit-transition: 0.5s all;
    -o-transition: 0.5s all;
    -ms-transition: 0.5s all;
    -moz-transition: 0.5s all;
}

.img-grid {
    padding: 1em;
    margin-bottom: 0.5em;
}

.img-grid1 {
    padding: 1em 1em 0;
}

.img-grid img,
.img-grid1 img {
    border: 5px outset #efefef;
    border-radius: 50%;
    padding: 0.5em;
}

.img-grid h4 {
    text-transform: uppercase;
    font-size: 1em;
    font-weight: 600;
}

ul.list {
    margin: 1.8em 0;
}

ul.list li span {
    display: block;
    color: #000;
    font-size: 1em;
}

ul.list li {
    text-transform: capitalize;
    font-size: 1.1em;
    color: #fff;
    font-weight: 600;
    display: inline-block;
    background: #3b74ce;
    width: 32%;
    padding: 0.2em 0;
}

.agileits-main-grid h3 {
    color: #000;
    font-size: 1.3em;
    text-transform: uppercase;
    font-weight: 600;
    letter-spacing: 0.5px;
    margin-bottom: 0.5em;
}

.right-grid-w3ls h3 {
    color: #fff;
}

.content {
    background: #fff;
}

.agileits-main-grid {
    width: 60%;
    margin: 3em auto;
}
/*-- login --*/

.right-grid-w3ls input[type="submit"] {
    background: #f44b89;
    color: #ffffff;
    font-size: 0.9em;
    text-transform: uppercase;
    border: 2px solid transparent;
    width: 100%;
    outline: none;
    font-weight: 600;
    letter-spacing: 0.5px;
    cursor: pointer;
    -webkit-appearance: none;
    padding: 1em 0;
    margin: 0.2em;
    transition: 0.5s all;
    -webkit-transition: 0.5s all;
    -moz-transition: 0.5s all;
    -o-transition: 0.5s all;
}

input[type="submit"]:hover {
    background: #3b74ce;
}

.right-grid-w3ls input[type="submit"] {
    background: #fff;
    color: #3b74ce;
}

.content.text-center a {
    display: block;
    text-transform: uppercase;
    font-size: 0.9em;
    font-weight: 600;
    color: #fff;
    background: #ca004a;
    padding: 0.8em;
}
.right-grid-w3ls.text-center a {
    display: block;
    text-transform: uppercase;
    font-size: 0.9em;
    font-weight: 600;
    color: #fff;
    background: #0000ab;
    padding: 0.8em;
}


/*--alert-close--*/

.content {
    position: relative;
}

.alert-close {
    background: #f44b89 url(../images/into.png) no-repeat 12px 11px;
    cursor: pointer;
    position: absolute;
    right: 11px;
    top: -20px;
    -webkit-transition: color 0.2s ease-in-out;
    -moz-transition: color 0.2s ease-in-out;
    -o-transition: color 0.2s ease-in-out;
    transition: color 0.2s ease-in-out;
    width: 38px;
    height: 38px;
    border-radius: 50%;
}


/*--//alert-close--*/


/*--/copy-right--*/

.copy-right {
    text-align: center;
    margin: 38px 0;
}

.copy-right p {
    color: #fff;
    font-size: 0.9em;
    font-weight: 400;
    letter-spacing: 1px;
}

.copy-right p a {
    color: #fff;
    -webkit-transition: color 0.2s ease-in-out;
    -moz-transition: color 0.2s ease-in-out;
    -o-transition: color 0.2s ease-in-out;
    transition: color 0.2s ease-in-out;
}

.copy-right p a:hover {
    color: #3b74ce;
    -webkit-transition: color 0.2s ease-in-out;
    -moz-transition: color 0.2s ease-in-out;
    -o-transition: color 0.2s ease-in-out;
    transition: color 0.2s ease-in-out;
}


/* -- Responsive code -- */

@media screen and (max-width: 1600px) {}

@media screen and (max-width: 1440px) {}

@media screen and (max-width: 1366px) {
    .right-grid-w3ls input[type="text"],
    .right-grid-w3ls input[type="password"],
    .right-grid-w3ls input[type="email"] {
        width: 77%;
    }
}

@media screen and (max-width: 1280px) {}

@media screen and (max-width: 1080px) {
    .agileits-main-grid {
        width: 70%;
    }
}

@media screen and (max-width: 1050px) {
    .agileits-main-grid {
        width: 71%;
    }
}

@media screen and (max-width: 1024px) {
    .right-grid-w3ls input[type="text"], .right-grid-w3ls input[type="password"], .right-grid-w3ls input[type="email"] {
        width: 76%;
    }
}

@media screen and (max-width: 991px) {
    .agileits-main-grid {
        width: 76%;
    }
}

@media screen and (max-width: 900px) {
    .agileits-main-grid {
        width: 83%;
    }
}

@media screen and (max-width: 800px) {
    .agileits-main-grid {
        width: 92%;
    }
}

@media screen and (max-width: 768px) {
    .agileits-main-grid {
        width: 96%;
    }
}

@media screen and (max-width: 736px) {
    .right-grid-w3ls input[type="text"], .right-grid-w3ls input[type="password"], .right-grid-w3ls input[type="email"] {
        width: 75%;
    }
}

@media screen and (min-width: 668px) {
    .agileits-main-grid {
        display: -webkit-box;
        /* OLD - iOS 6-, Safari 3.1-6 */
        display: -moz-box;
        /* OLD - Firefox 19- (buggy but mostly works) */
        display: -ms-flexbox;
        /* TWEENER - IE 10 */
        display: -webkit-flex;
        /* NEW - Chrome */
        display: flex;
    }
    .content,
    .right-grid-w3ls {
        -webkit-box-flex: 1;
        -moz-box-flex: 1;
        width: 20%;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
        padding: 2em;
        -webkit-box-shadow: 0px 8px 19px 0px rgba(48, 55, 102, 0.62);
        -moz-box-shadow: 0px 8px 19px 0px rgba(48, 55, 102, 0.62);
        box-shadow: 0px 8px 19px 0px rgba(48, 55, 102, 0.62);
        margin: 0 0.5em;
		transition: 0.5s all;
		-webkit-transition: 0.5s all;
		-o-transition: 0.5s all;
		-ms-transition: 0.5s all;
		-moz-transition: 0.5s all;
    }
	.content:hover,
    .right-grid-w3ls:hover {
		-webkit-box-shadow: 0px 8px 19px 0px rgb(255 255 255 / 62%);
        -moz-box-shadow: 0px 8px 19px 0px rgb(255 255 255 / 62%);
        box-shadow: 0px 8px 19px 0px rgb(255 255 255 / 62%);
		transition: 0.5s all;
		-webkit-transition: 0.5s all;
		-o-transition: 0.5s all;
		-ms-transition: 0.5s all;
		-moz-transition: 0.5s all;
	}
}
@media screen and (max-width: 667px) {

    .content {
        padding: 2em;
    }
    .right-grid-w3ls {
        margin-top: 2em;
        padding: 2em;
    }
    .agileits-main-grid {
        width: 85%;
    }

}
@media screen and (max-width: 568px) {
    h1.title-head {
        margin: 1em 0 0;
    }
    .agileits-main-grid{
        margin:2em auto;
    }
}

@media screen and (max-width: 480px) {
    h1.title-head {
        margin: 1em 0 0;
        font-size: 2.3em;
        letter-spacing: 2px;
    }
    .copy-right p {
        padding: 1em;
    }
}

@media screen and (max-width: 414px) {
    .agileits-main-grid {
        width: 90%;
    }
    h1.title-head {
        margin: 0.5em 0 0;
        font-size: 2.2em;
    }
}

@media screen and (max-width: 375px) {
    h1.title-head {
        font-size: 2.1em;
    }
    .right-grid-w3ls input[type="text"], .right-grid-w3ls input[type="password"], .right-grid-w3ls input[type="email"] {
        width: 74%;
    }
    ul.list li {
        font-size: 1em;
    }
    .content.text-center a {
        padding: 0.5em;
    }
    .right-grid-w3ls input[type="submit"]{
        padding: 0.8em 0;
    }
    .copy-right {
        margin: 0px 0 20px;
    }
    .agileits-main-grid {
        margin: 2em auto 1em;
    }
}

@media screen and (max-width: 320px) {
    h1.title-head {
        font-size: 1.9em;
        letter-spacing: 1px;
    }
    .content {
        padding: 2em 1.2em;
    }
    .right-grid-w3ls input[type="text"], .right-grid-w3ls input[type="password"], .right-grid-w3ls input[type="email"] {
        width: 66%;
    }
}


/* -- //Responsive code -- */