@import url('https://fonts.googleapis.com/css?family=Lato:300,400,700,900|Sofia&display=swap');
:root {
    --bodyfont: 'Lato', sans-serif;
    --primary: #0095ca;
    --secondary: #fc02be;
    --lightgray: #f5f5f5;
    --textcolor: #202020;
    --headingcolor: #202020;
    --black: #202020;
    --graycolor: #9b9b9b;
    --white: #ffffff;
    --primaryrgb: 236,33,39;
    --secondaryrgb: 91,160,215;
    --lightprimaryrgb: 254,242,242;
    --lightsecondaryrgb: 238,245,251;
    --lightgrayrgb: 245,245,245;
    --whitergb: 255,255,255;
    --blackrgb: 32,32,32;
    --transiction: all 0.25s ease-out;
}
body#login {
    background-color: rgb(255, 255, 255);
    background-size: cover;
    height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
	font-family: var(--bodyfont);
    color: var(--textcolor);
    background: linear-gradient(90deg,rgba(0, 149, 202, 1) 0%, #fc02be 100%);
}
.login-logo {
    color: rgb(255, 255, 255);
    display: inline-block;
    font-size: 18px;
    margin-bottom: 0;
    margin-left: 0;
    margin-right: 0;
    margin-top: 0;
    padding-bottom: 10px;
    padding-left: 0;
    padding-right: 0;
    text-align: center;
    text-transform: uppercase;
    width: 100%;
}
img {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    border-bottom-color: -moz-use-text-color;
    border-bottom-style: none;
    border-bottom-width: 0;
    border-image-outset: 0 0 0 0;
    border-image-repeat: stretch stretch;
    border-image-slice: 100% 100% 100% 100%;
    border-image-source: none;
    border-image-width: 1 1 1 1;
    border-left-color: -moz-use-text-color;
    border-left-style: none;
    border-left-width: 0;
    border-right-color: -moz-use-text-color;
    border-right-style: none;
    border-right-width: 0;
    border-top-color: -moz-use-text-color;
    border-top-style: none;
    border-top-width: 0;
}
.app-cam input[type="password"] {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background-attachment: scroll;
    background-clip: border-box;
    background-color: rgb(255, 255, 255);
    background-image: none;
    background-origin: padding-box;
    background-position: 0 0;
    background-repeat: repeat;
    background-size: auto auto;
    border-bottom-color: rgb(204, 204, 204);
    border-bottom-left-radius: 2px;
    border-bottom-right-radius: 2px;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-image-outset: 0 0 0 0;
    border-image-repeat: stretch stretch;
    border-image-slice: 100% 100% 100% 100%;
    border-image-source: none;
    border-image-width: 1 1 1 1;
    border-left-color: rgb(204, 204, 204);
    border-left-style: solid;
    border-left-width: 1px;
    border-right-color: rgb(204, 204, 204);
    border-right-style: solid;
    border-right-width: 1px;
    border-top-color: rgb(204, 204, 204);
    border-top-left-radius: 2px;
    border-top-right-radius: 2px;
    border-top-style: solid;
    border-top-width: 1px;
    color: rgb(0, 0, 0);
    font-size: 0.85em;
    font-weight: 400;
    margin-bottom: 1em;
    margin-left: 0;
    margin-right: 0;
    margin-top: 0;
    outline-color: -moz-use-text-color;
    outline-style: none;
    outline-width: medium;
    padding-bottom: 15px;
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 15px;
    width: 100%;
}
.app-cam {
    margin-left: auto;
    margin-right: auto;
    margin-top: 3em;
    width:100%;
	max-width:410px;
	margin:0 auto;
	display:block;
    background-color: var(--white);
    padding: 50px 50px;
    box-shadow: 0 0 50px rgba(0, 0, 0, 0.15);
}
.app-cam h2 {
    text-align: center;
    font-size: 30px;
    text-transform: uppercase;
    margin: 0 0 35px 0;
    line-height: 1;
}
.app-cam input[type="text"] {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background-attachment: scroll;
    background-clip: border-box;
    background-color: rgb(255, 255, 255);
    background-image: none;
    background-origin: padding-box;
    background-position: 0 0;
    background-repeat: repeat;
    background-size: auto auto;
    border-bottom-color: rgb(204, 204, 204);
    border-bottom-left-radius: 2px;
    border-bottom-right-radius: 2px;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-image-outset: 0 0 0 0;
    border-image-repeat: stretch stretch;
    border-image-slice: 100% 100% 100% 100%;
    border-image-source: none;
    border-image-width: 1 1 1 1;
    border-left-color: rgb(204, 204, 204);
    border-left-style: solid;
    border-left-width: 1px;
    border-right-color: rgb(204, 204, 204);
    border-right-style: solid;
    border-right-width: 1px;
    border-top-color: rgb(204, 204, 204);
    border-top-left-radius: 2px;
    border-top-right-radius: 2px;
    border-top-style: solid;
    border-top-width: 1px;
    color: rgb(0, 0, 0);
    font-size: 0.85em;
    font-weight: 400;
    margin-bottom: 1em;
    margin-left: 0;
    margin-right: 0;
    margin-top: 0;
    outline-color: -moz-use-text-color;
    outline-style: none;
    outline-width: medium;
    padding-bottom: 15px;
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 15px;
    width: 100%;
}

.app-cam input[type="submit"], .btn-success1 {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background-attachment: scroll;
    background-clip: border-box;
    background-color: rgb(6, 217, 149);
    background-image: none;
    background-origin: padding-box;
    background-position: 0 0;
    background-repeat: repeat;
    background-size: auto auto;
    border-bottom-color: -moz-use-text-color;
    border-bottom-left-radius: 2px;
    border-bottom-right-radius: 2px;
    border-bottom-style: none;
    border-bottom-width: medium;
    border-image-outset: 0 0 0 0;
    border-image-repeat: stretch stretch;
    border-image-slice: 100% 100% 100% 100%;
    border-image-source: none;
    border-image-width: 1 1 1 1;
    border-left-color: -moz-use-text-color;
    border-left-style: none;
    border-left-width: medium;
    border-right-color: -moz-use-text-color;
    border-right-style: none;
    border-right-width: medium;
    border-top-color: -moz-use-text-color;
    border-top-left-radius: 2px;
    border-top-right-radius: 2px;
    border-top-style: none;
    border-top-width: medium;
    color: rgb(255, 255, 255);
    cursor: pointer;
    font-size: 16px;
    font-weight: 400 !important;
    outline-color: -moz-use-text-color;
    outline-style: none;
    outline-width: medium;
    padding: 17px 20px;
    text-transform: uppercase;
    width: 100%;
}
.app-cam input[type="submit"] {
    background-color: var(--primary);
    color: var(--white) !important;
}
.app-cam input[type="submit"]:hover {
    background-color: var(--secondary);
    color: var(--white) !important;
}
#login .login-logo img{
	max-width:100%;
}
#login input[type="text"],
#login input[type="password"]{
	font-size:16px;
	width:100%;
	padding:15px;
}
.app-cam .submit,
.app-cam .submit[input="submit"]{
	width:100%;
}
@media(max-width:767px){
.app-cam{
	width:90%;
}

#login .login-logo img {
    max-width: 80%;
}
}

.login_bottom a:hover{
    color:var(--secondary);
}