﻿
@font-face {
    font-family: ProximaNova;
    src: url("../fonts/ProximaNova-Regular.otf") format("opentype");
}

@font-face {
    font-family: ProximaNova;
    font-weight: bold;
    src: url("../fonts/ProximaNova-Bold.otf") format("opentype");
}

@font-face {
    font-family: ATTAleckSans_W_Bd;
    src: url('../fonts/ATTAleckSans_W_Bd.woff2') format('woff2'),url('../fonts/ATTAleckSans_W_Bd.ttf') format('truetype');
}

@font-face {
    font-family: ATTAleckSans_W_Blk;
    src: url('../fonts/ATTAleckSans_W_Blk.woff2') format('woff2');
}

@font-face {
    font-family: ATTAleckSans_W_Md;
    src: url('../fonts/ATTAleckSans_W_Md.woff2') format('woff2');
}

@font-face {
    font-family: ATTAleckSans_W_Rg;
    src: url('../fonts/ATTAleckSans_W_Rg.woff2') format('woff2'), url('../fonts/ATTAleckSans_W_Rg.ttf') format('truetype');
}

html {
    font-size: 14px;
    font-family: ATTAleckSans_W_Rg;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
        font-family: ATTAleckSans_W_Rg;
    }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
    height: 100%;
    background: #000 url('../images/background.png') no-repeat center center fixed;    
    color: #000;    
    padding-top: 0 !important;
    font-family: ATTAleckSans_W_Rg;
    font-size: 13px;
    background-size: cover;
}


/*====== Custom CSS*/
.cssInnerPanel {
    min-height: 200px;
    /*max-width: 370px;*/
    background-color: #fff;
    margin: 0 auto;
    z-index: 2;
    padding: 5px;
}



@media only screen and (min-width: 768px) {
    .cssInnerPanel {
        min-height: 150px;
        width: 400px;
    }
}

@media only screen and (min-width: 1px) and (max-width: 767px) {
    .cssInnerPanel {
        min-height: 200px;
        max-width: 370px;
        /*width: 93%;*/
        background-color: #fff;
        margin: 0 auto;
        /*border-top: 10px solid #00275A;*/
        z-index: 2;
        padding:10px;
    }

}


.strike {
    display: block;
    text-align: center;
    overflow: hidden;
    white-space: nowrap;
    color: #19AEEF;
    font-weight: bold;
    padding: 15px 0px 15px 0px;
    letter-spacing: 1px;
    font-size:18px !important;
}

    .strike > span {
        position: relative;
        display: inline-block;
    }

        .strike > span:before,
        .strike > span:after {
            content: "";
            position: absolute;
            top: 50%;
            width: 9999px;
            height: 1px;
            background: #ddd;
        }

        .strike > span:before {
            right: 100%;
            margin-right: 15px;
        }

        .strike > span:after {
            left: 100%;
            margin-left: 15px;
        }


.page-header {
    display: block;
    text-align: center;
    overflow: hidden;
    white-space: nowrap;
    font-weight: bold;
    /*font-size: 18px !important;*/
    /*margin-top: 10px;*/
    color:#000000;
}
hr{
    margin:5px 0;
}
.message-div{
    text-align:center;
}
.message {
    font-family: ProximaNova;
    font-size: 15px;
    color: #000;
    text-align: center;  
}
.success-message {
    font-family: ProximaNova;
    font-size: 15px;
    color: green;
    text-align: center;
}
.error-message {
    font-family: ProximaNova;
    font-size: 15px;
    color: red;
    text-align: center;
}
.logout-message {
    font-family: ATTAleckSans_W_Rg;
    font-size: 13px;
}
.custom-row{
    height:60px;
}

.footer-image {
    /*max-height: 36px;*/
    max-width: 100%;
    content: url("../images/WBDLogo.png?v6") !important;
}
.footer{
    bottom:unset !important;
}

.container {
    /* margin-top: 10px;*/
    position: relative;
    /*height: 100vh;*/ /* Or a defined height */
}

.footer-center {
    position: relative;
    width: 270px;
    height: 100px;
}

.main-panel {
    margin: 50px auto 0px auto;    
    word-spacing: 1px;
    letter-spacing: 0.1px !important;
    height: auto !important;
    position: relative;
}

    .main-panel div.form-group {
        margin-bottom: 5px !important;
    }

    .main-panel label {
        font-weight: normal;
        /*text-transform: uppercase;*/
        margin-top: 3px;
        /*font-size: 0.751042em;*/
        /*letter-spacing: 0.1em;*/
        margin-bottom: auto;
    }



    .main-panel ol {
        margin: 0;
        padding: 10px 0;
        list-style-type: none;
    }

        .main-panel ol li {
            /*font-size: 0.75em;*/
            margin: 5px 0;
            padding: 0;
        }

        .main-panel ol .numbers {
            width: 5%;
            border-right: 1px solid #000;
            padding: 0px 5px 0px 0px;
            vertical-align: top;
            display: inline-block;
            margin-right: 8px;
        }

        .main-panel ol .li-text {
            width: 90%;
            display: inline-block;
            vertical-align: top;
        }

    .main-panel h5 {
        margin-bottom: 10px;
        text-transform: uppercase;
        font-size: 1em;
    }

    .main-panel h4 {
        color: #b3b3b3;
    }

    .main-panel h3 {
        color: #59595B;
        font-size: 0.875em;
    }

    .main-panel h6 {
        font-size: 1em;
    }

    .main-panel div.login-form,
    .main-panel div.verify-form,
    .main-panel .reset-form,
    .main-panel .enroll-form,
    .main-panel .message-form,
    .main-panel .successForm {
        padding-top: 0px;
        /*min-height: 185px;*/
        height: auto;
        display: block;
        position: relative;
        padding-bottom: 5px;
    }



.message-form {
    min-height: 235px !important;
}

.enroll-form label {
    text-transform: none;
}


.btn-custom {
    background-color: #007dc1 !important;
    background: linear-gradient(#0087d0, #007dc1) !important;
    border-color: #004b75 #004b75 #00456a !important;
    border-radius: 0px !important;
    -moz-border-radius: 0px !important;
    -webkit-border-radius: 0px !important;
    text-transform: none;
    height: 45px !important;
    margin: 0 auto;
    line-height: 45px;
    vertical-align: middle;
    font-family: ATTAleckSans_W_Bd;
    font-weight: bold;
    /*color: #1e1e1e;*/
    color: #fff;
    font-size: 14px;
    min-width: 120px;
    padding: 0px;
}
.btn-custom {
    width: auto;
    padding: 0px;
    min-width: 100px;
}
.btn-custom:hover {
        color: #fff;
}

.bottom-div {
    text-align:center;
    width: 100%;
    margin-left:1px;
}
.Title{
    color:#fff;
}
.divAppLogo {
    overflow: hidden;
}

.cssImage {
    max-height: 100%;
    max-width: 100%;
}


.cssAppName {
    /*color: #52A6DE;*/
    color: #000000;
    font-weight: bold;
    font-size: 30px;
    padding: 15px;
    font-family: ATTAleckSans_W_Rg;
    overflow-x: hidden;
    text-align: center;
    overflow-wrap: break-word;
}

a {
    color:#000;
    text-decoration: none;
    background-color:transparent;
}

.form-control {
    font-size: 0.90rem !important;
    height: 45px !important;
}
.text-danger {
    font-family: ProximaNova;
    font-size:15px !important;
}
.text-success {
    font-family: ProximaNova;
    font-size: 15px !important;
}

.pb-3{
    padding-bottom:5px !important;
}
.row{
    padding:3px !important;
}
.CookieSecurityText {
    font-size: 1em;
    font-family: ATTAleckSans_W_Rg;
    color: #fff;
    padding-top: 5px; 
    text-align:center;
}

img {
    vertical-align: middle;
    border-style: none;
}

.access-denied {
    color: #52A6DE;
}

input {
    background-color: #E6E6E6 !important;
}
p {
    letter-spacing: 0.5px;
}

