@import url('https://fonts.googleapis.com/css?family=Montserrat:100,200,300,400,500,600,700,800,900|Open+Sans+Condensed:300,700|Open+Sans:300,400,600,700,800|Oswald:200,300,400,500,600,700|Roboto+Condensed:300,400,700|Roboto:100,300,400,500,700,900&display=swap');
/*
font-family: 'Roboto', sans-serif;
font-family: 'Open Sans', sans-serif;
font-family: 'Montserrat', sans-serif;
font-family: 'Oswald', sans-serif;
font-family: 'Open Sans Condensed', sans-serif;
font-family: 'Roboto Condensed', sans-serif;
*/
*{outline:none !important;}
.login-page{/*background-image: linear-gradient(to right, var(--gradientColor01), var(--gradientColor02));color: var(--secondaryColor);*/ background-color: #fff; width: 100vw;height: 100vh;display: flex; font-family: 'Montserrat', sans-serif; font-size: 14px; font-weight: 300; line-height: 1.5;background-size: cover;background-repeat: no-repeat;background-position: center;background-attachment: fixed;position: relative;z-index: 0;flex-direction: column;justify-content: center;}
.login-page:before{content: '';position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: #000;z-index: -1;opacity: 0.2;}
.login-page .login-wrap{margin: 0 auto;position: relative;background: inherit;overflow: hidden;z-index: 3;border-radius: 16px;box-shadow: rgba(0,0,0,0.3) 0 5px 20px;}
.login-page .login-wrap:before{content: '';width: calc(100% + 50px);height: calc(100% + 50px);position: absolute;top: -25px;left: -25px;bottom: -25px;right: -25px;background: inherit;box-shadow: inset 0 0 0 300px rgba(255,255,255,0.5);filter: blur(5px);z-index: -1;}
.login-page .login-wrap .login-content{background: transparent;padding: 30px;width: calc(100% - 20px);margin: auto;min-width: 340px;max-width: 400px;}
.login-page .login-wrap .login-content .login-display-content{}
.login-page .login-wrap .login-content .login-display-content .sec-title{font-size: 20px;font-weight: 600;color: var(--secondaryColor);margin: 0 0 10px;line-height: 1.5;text-transform: uppercase; position: relative; z-index: 0;}
.login-page .login-wrap .login-content .login-display-content .sec-title span{border-bottom: 4px solid #f20808;}
.login-page .login-wrap .login-content .login-display-content .sec-title:before{content: '';position: absolute;bottom: 0;left: 0;width: 100%;border-top: 1px solid rgba(0, 0, 0, 0.1);z-index: -1;}
.login-page .login-wrap .login-content .login-display-content .sec-text{font-size: 12px;font-weight: 500;color: var(--secondaryColor);margin: 0;}
.login-page .login-wrap .login-content .login-display-content .input-wrap{position: relative;display: flex;background: rgba(255, 255, 255, 0.3);border-radius: 6px;overflow: hidden;}
.login-page .login-wrap .login-content .login-display-content .input-wrap .icon{font-size: 16px;display: flex;width: 50px;height: 40px;margin: auto 0;border-right: 1px solid rgba(255, 255, 255, 0.2);color: #777777;background: rgba(255, 255, 255, 0.2);}
.login-page .login-wrap .login-content .login-display-content .input-wrap .icon i{margin: auto;}
.login-page .login-wrap .login-content .login-display-content .input-wrap .form-control{height: 40px;padding: 6px 12px;font-size: 13px;font-weight: 500;border-radius: 0;border: 0;outline: none !important;box-shadow: none !important;background-color: transparent;margin: auto 0; color: var(--secondaryColor);}
.login-page .login-wrap .login-content .login-display-content .btn-login{background-color: #f20808;border: 0;font-size: 14px;text-transform: uppercase;font-weight: 500;display: block;width: 100%;height: 40px;box-shadow: none !important;outline: none !important;border-radius: 6px;padding: 10px;}
.login-page .login-wrap .login-content .login-display-content .btn-alt{background-color: var(--secondaryColor);border: 0;font-size: 14px;text-transform: uppercase;font-weight: 500;display: block;width: 100%;height: 40px;box-shadow: none !important;outline: none !important;border-radius: 2px;padding: 10px;}
.login-page .login-wrap .login-content .login-display-content .or-separator{position: relative;display: flex;justify-content: center;padding: 0;margin: 20px 0;z-index: 0;}
.login-page .login-wrap .login-content .login-display-content .or-separator .or{background-color: #ffffff;color: #999;width: 30px;height: 30px;text-align: center;line-height: 30px;border-radius: 50%;text-transform: uppercase;font-size: 12px;font-weight: 400;font-family: 'Roboto', sans-serif;}
.login-page .login-wrap .login-content .login-display-content .or-separator::before{content: '';position: absolute;top: 50%;left: 0;width: 100%;border-top: 1px solid rgba(0, 0, 0, 0.1);z-index: -1;}

.login-page .login-wrap .login-content .login-display-content .social-login{margin: 0 0 20px;}
.login-page .login-wrap .login-content .login-display-content .social-login .login-facebook{display: flex;background-color: #4267b2;color: #fff;padding: 8px 10px;justify-content: center;font-size: 16px;margin: 0 0 10px;border-radius: 6px;text-decoration: none !important;}
.login-page .login-wrap .login-content .login-display-content .social-login .login-facebook i{margin:auto 0;}
.login-page .login-wrap .login-content .login-display-content .social-login .login-facebook span{margin: auto 0;display: block;font-size: 12px;font-weight: 400;margin-left: 10px;}
.login-page .login-wrap .login-content .login-display-content .social-login .login-google{display: flex;background-color: #ffffff;color: #666;padding: 8px 10px;justify-content: center;font-size: 16px;box-shadow: rgba(0,0,0,0.05) 0 2px 10px;border-radius: 6px;border: 1px solid #e6e6e6;text-decoration: none !important;}
.login-page .login-wrap .login-content .login-display-content .social-login .login-google i{margin:auto 0;}
.login-page .login-wrap .login-content .login-display-content .social-login .login-google span{margin: auto 0;display: block;font-size: 12px;font-weight: 400;margin-left: 10px;}
.login-page .login-wrap .login-content .login-display-content .login-options{display: flex;justify-content: space-between;}
.login-page .login-wrap .login-content .login-display-content .login-options .btn-links{font-size: 11px;line-height: 1.2;text-decoration: none !important;color: var(--secondaryColor);font-weight: 500;letter-spacing: -0.3px;}
.login-page .page-navigation{display: flex;justify-content: center;}
.login-page .page-navigation .btn-home{font-size: 18px;display: flex;background: inherit;position: relative;overflow: hidden;padding: 10px 15px 5px;border-radius: 0 0 16px 16px;margin-top: -5px;color: var(--secondaryColor);text-decoration: none;box-shadow: rgba(0,0,0,0.2) 0 2px 5px;}
.login-page .page-navigation .btn-home:before{content: '';width: calc(100% + 50px);height: calc(100% + 50px);position: absolute;top: -25px;left: -25px;bottom: -25px;right: -25px;background: inherit;box-shadow: inset 0 0 0 300px rgba(255,255,255,0.5);filter: blur(5px);z-index: -1;}
.login-page .page-navigation .btn-home i{margin: auto 0;}
.login-page .page-navigation .btn-home span{font-size: 10px;display: block;margin: auto 0;margin-left: 5px;font-weight: 600;text-transform: uppercase;}


.custom-checkbox{position: relative;padding-left: 24px;margin: 5px 0;}
.custom-checkbox .custom-input{position: absolute;z-index: 1;top: 0;left: 0;width: 100%;height: 100%;opacity: 0; cursor: pointer;}
.custom-checkbox .custom-label{position: relative;margin: 0;line-height: 16px;font-size: 12px;font-weight: 500;color: var(--secondaryColor);letter-spacing: -0.3px;}
.custom-checkbox .custom-label:before{content:'';position:absolute;width: 16px;height: 16px;background: #fff;border: 1px solid #ddd;top: 50%;left: -24px; transform: translateY(-50%);border-radius: 2px;}
.custom-checkbox .custom-label:after{content: "\f00c";position: absolute;font-family: "Font Awesome 5 Pro";width: 16px;height: 16px;top: 50%;left: -24px;transform: translateY(-50%); font-weight: 500;font-size: 10px;display: none;color: #fff;text-align: center;}
.custom-checkbox .custom-input:checked ~ .custom-label:after{display:block;}
.custom-checkbox .custom-input:checked ~ .custom-label:before{background: #f20808;border: 1px solid #f20808;}

