﻿.hr { background-color: rgb(128, 128, 128); height: 4px }
.hr1 { background-color: #00AFFF; height: 4px }
.container, .container-xl { background-color: white }
.cfaLogo { margin-top: 15px; }
.itemP { max-width: 175px; }
form { padding: 0 30px; }
.padSec { padding: 75px 15px; }
.alignCenter { text-align: center }
.signInMessage { color: forestgreen; font-size: 20px; }
    .signInMessage i { line-height: 45px; display: inline-block; margin-right: 10px }
.grpUserID { margin-top: 15px; }
.gbMessage { font-size: 30px; line-height: 38px; margin-top: 40px; color: #666 }

.cfaWc { color: #FF1A0B; font-size: 25px; }

.link { color: #007bff !important; cursor: pointer }
    .link:hover { color: #007bff !important; text-decoration: underline }

.fp { margin-top: 25px; display: inline-block }
.su { margin-top: 5px; }


@media (max-width: 575.98px) {
    .hideSmall { display: none }
}

@media (min-width: 576px) and (max-width: 767.98px) {
    .hideSmall { display: none }
}

@media (min-width: 768px) and (max-width: 991.98px) {
    .hideSmall { display: none }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
    html, body { background-color: #f1f1f1 }
    form { border-right: 1px solid #eee; }
}

@media (min-width: 1200px) {
    html, body { background-color: #f1f1f1 }
    form { border-right: 1px solid #eee; }
}

.validation-summary-errors li { list-style-type: none }

.link { color: blue; cursor: pointer }
    .link:hover { text-decoration: underline }


.field-validation-error { color: red }

.webinarTable { }

/*Responsive grig created by s_ --> surendra*/
.s_headerRow, .s_headerRow *, .s_bodyRow, .s_bodyRow * { color: #999 }
.s_bodyHeader { color: #333; line-height: 13.6px; margin-top: 10px; }
.s_headerRow { line-height: 35px; border-bottom: 1px solid #cdcdcd }
.s_bodyRow { border-bottom: 1px dashed #cdcdcd; padding: 10px 0 }
.s_headerRow div { padding: 0 5px; color: #232323 }
.s_headerRow div, .s_bodyRow div { padding: 0 10px  0 0}

.s_bodyRow .textbox { width: 100%; line-height: 32px; border: 1px solid #cdcdcd; padding: 0 5px; border-radius: 3px; outline: none }

.s_bodyRow input[type="text"]:hover { border: 1px solid skyblue !important; box-shadow: 0 0 1px 1px skyblue; -webkit-box-shadow: 0 0 1px 1px skyblue; -moz-box-shadow: 0 0 1px 1px skyblue }
.s_bodyRow input[type="text"]:focus { border: 1px solid skyblue !important; box-shadow: 0 0 1px 1px skyblue; -webkit-box-shadow: 0 0 1px 1px skyblue; -moz-box-shadow: 0 0 1px 1px skyblue }

@media (max-width: 575.98px) {
    .s_headerRow { display: none }
    .s_bodyRow { padding: 0 20px 20px; padding-top: 10px; }
        .s_bodyRow:nth-child(2n+1) { background-color: #F8F9FC }
}

@media (min-width: 576px) and (max-width: 767.98px) {
    .s_headerRow { display: none }
    .s_bodyRow { padding: 0 20px 20px; padding-top: 10px; }
        .s_bodyRow:nth-child(2n+1) { background-color: #F8F9FC }
}

@media (min-width: 768px) and (max-width: 991.98px) {
    .s_headerRow { display: none; }
    .s_bodyRow { padding: 0 20px 20px; padding-top: 10px; }
        .s_bodyRow:nth-child(2n+1) { background-color: #F8F9FC }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
    .s_bodyHeader { display: none }
    .s_headerRow { display: flex }
    .s_bodyRow { display: flex }
        .s_bodyRow:nth-child(2n+1) { background-color: #F8F9FC }
            .s_bodyRow:nth-child(2n+1):hover { background-color: #F7FBE3 }
        .s_bodyRow:hover { background-color: #F7FBE3 }

    .webinarTable .webinar { width: 17%; max-width: 17% }
    .webinarTable .description { width: 33%; max-width: 33% }
    .webinarTable .webinarDate { width: 15%; max-width: 15% }
    .webinarTable .audianceLink { width: 35%; max-width: 35%; overflow: hidden; text-overflow: ellipsis }
}

@media (min-width: 1200px) {
    .s_bodyHeader { display: none }
    .s_headerRow { display: flex }
    .s_bodyRow { display: flex }
        .s_bodyRow:nth-child(2n+1) { background-color: #F8F9FC }
            .s_bodyRow:nth-child(2n+1):hover { background-color: #F7FBE3 }
        .s_bodyRow:hover { background-color: #F7FBE3 }

    .webinarTable .webinar { width: 17%; max-width: 17% }
    .webinarTable .description { width: 33%; max-width: 33% }
    .webinarTable .webinarDate { width: 15%; max-width: 15% }
    .webinarTable .audianceLink { width: 35%; max-width: 35%; overflow: hidden; text-overflow: ellipsis }
}

.webinarTable { margin-top: 20px; }
