/* skin icon image url          = ../../img/logo.png   = ../../img/logo.png */
/* skin background color        = rgb(255, 255, 255)      = rgb(255, 255, 255) */
/* skin background color darker = rgb(231, 230, 230)  = rgb(231, 230, 230) */
/* skin declaration color       = #1C7CC3     = rgb(224, 153, 241) */
/* skin declaration color darker= #1C7CC3 = rgb(200, 75, 231)  */
/* skin foreground color        = rgb(0, 0, 0)      = rgb(0, 0, 0)       */

/*#region Korah Widget html & body style*/
html, body {
    width: 100%;
    height: 100%;
    margin: 0px !important;
    padding: 0px !important;
    background: transparent;
	overflow: hidden;
}
/*#endregion Korah Widget html & body style*/

/*#region Korah ccR Notice Msg Style*/
#korahCcrNoticeMsg {
    width: 220px;
    background-color: #D9EDF7; /* Canada.ca blue */
    float: left;
    margin-right: 10px;
    padding: 10px 5px 2px 5px;
    border-radius: 8px;
    position: absolute;
    bottom: 15px;
}

#closeKorahCcrNotice {
    cursor: pointer;
    float: right;
    display: inline-block;
    padding: 2px 8px;
    background: #e0e0e0; /* Canada.ca grey */
    margin: 0 1px 0 4px;
    text-decoration: none;
    color: black;
}
/*#endregion Korah ccR Notice Msg Style*/

/* alert notice style */
#alertNotice {
    width: 100%;
    position: absolute;
    z-index: 1040;
}

    #alertNotice .alert {
        padding: 5px;
        margin: auto;
        max-width: 300px;
        text-align: center;
        display: none;
    }

@keyframes shine {
    0% {
        transform: translate(-50%);
    }
    5% {
        transform: translate(100%);
    }
    5.1% {
        transform: translate(-50%);
    }
    8%, 100% {
        transform: translate(100%);
    }
}
.korahCcrButton::before {
    display: block;
    content: '';
    width: 100%;
    height:100%;
    background-image: linear-gradient(to right, transparent 15%, rgba(255, 255, 255, 0.95) 50%, transparent 85%);
    transform: translate(100%);
    animation-name: shine;
    animation-duration: 8s;
    animation-timing-function: linear;
    /* animation-timing-function: cubic-bezier(0.75, 0.075, 0.075, 0.75); */
    animation-iteration-count: infinite;
    animation-delay: 3s;
}				  
/*#region Korah ccR Buton Style*/
.korahCcrButton {
    border: 1px solid #ddd;
    border-color: #eee;
    border-radius: 15%;
    box-shadow: inset 0 0 5px #999;
    background: url("../../img/govcanada flag chat.jpg");
    background-repeat: no-repeat;
    background-position: center;
	background-size: 90%;
    background-color:#FFFFFF;
    z-index: 1000;
    margin: 0px;
    padding: 0px;
    width: 100%;
    height: 100%;
    position: absolute;
    bottom: 0px;
    right: 0px;
}

    .korahCcrButton.en, .korahCcrButton.default {
        background: url("../../img/govcanada flag chat.jpg");
        background-repeat: no-repeat;
        background-position: center;
        background-color: #FFFFFF;
        background-size: 90%;
    }

    .korahCcrButton.fr {
        background: url("../../img/govcanada flag chat FR.jpg");
        background-repeat: no-repeat;
        background-position: center;
        background-color: #FFFFFF;
        background-size: 90%;
    }

    .korahCcrButton:focus {
        border-radius: 15%;
        border: 2px solid #5589E2;
    }

    .korahCcrButton:hover {
        box-shadow: inset 0 0 6px #000000;
    }
/*#endregion Korah ccR Buton Style*/

/*#region Korah ccR Modal Style*/
#korahCcrModal {
    overflow: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    outline: 0 !important;
    padding: 0px !important;
    border: 0 !important;
}

    #korahCcrModal .modal-dialog {
        width: 100% !important;
        height: 100% !important;
        margin: 0px auto !important;
    }

#korahCcrModalImg {
    margin: 0px 5px 0px 5px;
    height: 30px;
    width: 30px;
    content: url("../../img/govcanada logo.jpg");
}

#korahCcrModal #alertNotice .btn-warning, #korahCcrModal #alertNotice .btn-success {
    background-color: #335075; /* Canada.ca blue */
    border-color: #335075;
    font-size: 14px;
    height: 32px;
    border-radius: 20px;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

#korahCcrModal #alertNotice .alert-warning {
    background-color: #FFFFFF;
    border: 1px solid rgba(0,0,0,.2);
}

#korahCcrModal .modal-content {
    box-shadow: 0px 0px 0px 2px rgba(0, 0, 0, .20) inset !important;
    background: rgba(255,255,255,1.00) !important;
    position: absolute;
    bottom: 0px;
    right: 0px;
    left: 0px;
    height: 100% !important;
    background-clip: padding-box !important;
    outline: 0 !important;
    border: 0px !important;
    border-radius: 8px !important;
}

#korahCcrModal .modal-header {
    background: linear-gradient(180deg, rgba(255,255,255,1.00) 0, transparent) !important;
    filter: alpha(opacity=80) !important; /* For IE8 and earlier */
    border-bottom: 1px solid #D2D2D2 !important; /* color_gray-light */
    border-radius: 8px 8px 0px 0px !important;
    padding: 11px !important;
    display: flex;
    align-items: center;
}

#toolbarRegion {
    display:flex;
}

#korahCcrModal .headerBtn:hover {
    background-color: darkgray;
}

*:focus {
    outline: 2px solid #5589E2 !important;
}

#korahCcrModal .headerBtnIcon {
    opacity: 1;
    fill: #333;
    height: 100%;
    width: 100%;
}

#korahCcrModal img.headerBtnIcon.img {
    height: 100%;
}

#korahCcrModal .modal-header #closeBtn img {
    background-image: url("../img/open-iconic/png/x-3x.png");
    background-repeat: no-repeat;
    background-size: cover;
}

#korahCcrModal .modal-header #maxBtn img.fullscreen {
    background-image: url("../img/open-iconic/png/fullscreen-enter-3x.png");
    background-repeat: no-repeat;
    background-size: cover;
}

#korahCcrModal .modal-header #maxBtn img.normal {
    background-image: url("../img/open-iconic/png/fullscreen-exit-3x.png");
    background-repeat: no-repeat;
    background-size: cover;
}

#korahCcrModal .modal-header #minBtn img {
    background-image: url("../img/open-iconic/png/minus-3x.png");
    background-repeat: no-repeat;
    background-size: cover;
}

#korahCcrModal .modal-header button:not([id='goToInput']) {
    height: 30px;
    width: 30px;
    color: #444444;
    opacity: 1;
    font-weight: inherit;
    font-size: 20px;
    background: transparent;
    margin: 0px 5px 0px 5px;
}

#goToInput {
    background: #335075;
    color: #fff;
    /*padding: 5px;*/
    font-size: 16px;
    z-index: -1;
    width: 0px;
    height: 0px;
}

    #goToInput:focus {
        width: auto;
        height: auto;
        z-index: inherit;
    }

#korahCcrModal .modal-header button:hover {
    opacity: .6 !important;
}

#korahCcrModal .modal-title {
    min-width: 50%;
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #444444 !important;
    font-size: 20px !important;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: bold;
}

    #korahCcrModal .modal-title > span {
        margin-right: 8px !important;
    }

#korahCcrModal .modal-body {
    filter: alpha(opacity=80) !important; /* For IE8 and earlier */
    background: transparent !important;
    height: calc(100% - 53px);
    padding:0 5px;
}

#korahCcrModal .modal-footer {
    height: 0px;
    text-align: left;
    display: none;
    padding: 5px;
    font-size: 12px;
}


@media screen and (min-height: 768px) {
    #korahCcrModal,
    #korahCcrModal .modal-content {
        height: 100% !important;
        top: 0 !important;
        bottom: 0 !important;
        right: 0 !important;
        left: 0 !important;
    }

        #korahCcrModal .modal-body {
            height: calc(100% - 53px) !important;
            padding-bottom: 5px !important;
        }
}
/*#endregion Korah ccR Modal Style*/

/*#region Korah ccR Chat Window Style*/
#korahCcrChat {
    width: 100% !important;
    height: 100% !important;
    border: none;
}
/*#endregion Korah ccR Chat Window Style*/