/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : Nov 16, 2020, 9:22:46 PM
    Author     : cguttikonda
*/
input, textArea{
    caret-color:  #a81f31 !important; 
}
.cb-slideshow {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	z-index: 0;
	content: '';
	background: url(../Images/ihp_Banner.jpg) round; 
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}


.input-group-text {
    background: #0062cc !important;

}


.cb-slideshow li span {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    color: transparent;
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: none;
    opacity: 0;
    z-index: 0;
    -webkit-backface-visibility: hidden;
    -webkit-animation: imageAnimation 36s linear infinite 0s;
    -moz-animation: imageAnimation 36s linear infinite 0s;
    -o-animation: imageAnimation 36s linear infinite 0s;
    -ms-animation: imageAnimation 36s linear infinite 0s;
    animation: imageAnimation 36s linear infinite 0s;
}

.cb-slideshow li div {
    z-index: 1000;
    position: absolute;
    bottom: 30px;
    left: 0px;
    width: 100%;
    text-align: center;
    opacity: 0;
    color: #fff;
    -webkit-animation: titleAnimation 36s linear infinite 0s;
    -moz-animation: titleAnimation 36s linear infinite 0s;
    -o-animation: titleAnimation 36s linear infinite 0s;
    -ms-animation: titleAnimation 36s linear infinite 0s;
    animation: titleAnimation 36s linear infinite 0s;
}

.cb-slideshow li div h3 {
    font-family: 'BebasNeueRegular', 'Arial Narrow', Arial, sans-serif;
    font-size: 240px;
    padding: 0;
    line-height: 200px;
}

.cb-slideshow li:nth-child(1) span {
    background-image: url(resources/images/New-Project.png)
}

.cb-slideshow li:nth-child(2) span {
    background-image: url(resources/images/IMG_5772.jpg);
    -webkit-animation-delay: 6s;
    -moz-animation-delay: 6s;
    -o-animation-delay: 6s;
    -ms-animation-delay: 6s;
    animation-delay: 6s;
}

.cb-slideshow li:nth-child(3) span {
    background-image: url(resources/images/6B5B5336.jpg);
    -webkit-animation-delay: 12s;
    -moz-animation-delay: 12s;
    -o-animation-delay: 12s;
    -ms-animation-delay: 12s;
    animation-delay: 12s;
}

.cb-slideshow li:nth-child(4) span {
    background-image: url(resources/images/New-Project-1.png);
    -webkit-animation-delay: 18s;
    -moz-animation-delay: 18s;
    -o-animation-delay: 18s;
    -ms-animation-delay: 18s;
    animation-delay: 18s;
}

.cb-slideshow li:nth-child(2) div {
    -webkit-animation-delay: 6s;
    -moz-animation-delay: 6s;
    -o-animation-delay: 6s;
    -ms-animation-delay: 6s;
    animation-delay: 6s;
}

.cb-slideshow li:nth-child(3) div {
    -webkit-animation-delay: 12s;
    -moz-animation-delay: 12s;
    -o-animation-delay: 12s;
    -ms-animation-delay: 12s;
    animation-delay: 12s;
}

.cb-slideshow li:nth-child(4) div {
    -webkit-animation-delay: 18s;
    -moz-animation-delay: 18s;
    -o-animation-delay: 18s;
    -ms-animation-delay: 18s;
    animation-delay: 18s;
}

/* Animation for the slideshow images */
@-webkit-keyframes imageAnimation {
    0% {
        opacity: 0;
        -webkit-animation-timing-function: ease-in;
    }

    8% {
        opacity: 1;
        -webkit-animation-timing-function: ease-out;
    }

    17% {
        opacity: 1
    }

    25% {
        opacity: 0
    }

    100% {
        opacity: 0
    }
}

@-moz-keyframes imageAnimation {
    0% {
        opacity: 0;
        -moz-animation-timing-function: ease-in;
    }

    8% {
        opacity: 1;
        -moz-animation-timing-function: ease-out;
    }

    17% {
        opacity: 1
    }

    25% {
        opacity: 0
    }

    100% {
        opacity: 0
    }
}

@-o-keyframes imageAnimation {
    0% {
        opacity: 0;
        -o-animation-timing-function: ease-in;
    }

    8% {
        opacity: 1;
        -o-animation-timing-function: ease-out;
    }

    17% {
        opacity: 1
    }

    25% {
        opacity: 0
    }

    100% {
        opacity: 0
    }
}

@-ms-keyframes imageAnimation {
    0% {
        opacity: 0;
        -ms-animation-timing-function: ease-in;
    }

    8% {
        opacity: 1;
        -ms-animation-timing-function: ease-out;
    }

    17% {
        opacity: 1
    }

    25% {
        opacity: 0
    }

    100% {
        opacity: 0
    }
}

@keyframes imageAnimation {
    0% {
        opacity: 0;
        animation-timing-function: ease-in;
    }

    8% {
        opacity: 1;
        animation-timing-function: ease-out;
    }

    17% {
        opacity: 1
    }

    25% {
        opacity: 0
    }

    100% {
        opacity: 0
    }
}

/* Animation for the title */
@-webkit-keyframes titleAnimation {
    0% {
        opacity: 0
    }

    8% {
        opacity: 1
    }

    17% {
        opacity: 1
    }

    19% {
        opacity: 0
    }

    100% {
        opacity: 0
    }
}

@-moz-keyframes titleAnimation {
    0% {
        opacity: 0
    }

    8% {
        opacity: 1
    }

    17% {
        opacity: 1
    }

    19% {
        opacity: 0
    }

    100% {
        opacity: 0
    }
}

@-o-keyframes titleAnimation {
    0% {
        opacity: 0
    }

    8% {
        opacity: 1
    }

    17% {
        opacity: 1
    }

    19% {
        opacity: 0
    }

    100% {
        opacity: 0
    }
}

@-ms-keyframes titleAnimation {
    0% {
        opacity: 0
    }

    8% {
        opacity: 1
    }

    17% {
        opacity: 1
    }

    19% {
        opacity: 0
    }

    100% {
        opacity: 0
    }
}

@keyframes titleAnimation {
    0% {
        opacity: 0
    }

    8% {
        opacity: 1
    }

    17% {
        opacity: 1
    }

    19% {
        opacity: 0
    }

    100% {
        opacity: 0
    }
}

/* Show at least something when animations not supported */
.no-cssanimations .cb-slideshow li span {
    opacity: 1;
}

@media screen and (max-width: 1140px) {
    .cb-slideshow li div h3 {
        font-size: 140px
    }
}

@media screen and (max-width: 600px) {
    .cb-slideshow li div h3 {
        font-size: 80px
    }
}

body,
html {
    margin: 0;
    padding: 0;
    height: 100%;
    background: #ffffff !important;
}

.user_card {
    height: 370px;
    width: 350px;
    margin-top: 10%;
    margin-bottom: auto;
    background-color: rgb(0, 0, 0, 0.3);
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 10px;
    border-radius: 5px;

}

.headerText
{
	text-align: center;
	font-size: large;
	color: #fff;
	background: #2d4a92;
}

.form_container {
    margin-top: 30px;
}

.login_btn {
    width: 90%;
    background: #2d4a92 !important;
    color: white !important;
}

.login_btn:focus {
    box-shadow: none !important;
    outline: 0px !important;
    opacity:0.5;
}

.login_container {
    padding: 0 2rem;
}

.input-group-text {
    background: #2d4a92 !important;
    color: white !important;
    border: 0 !important;
    border-radius: 0.25rem 0 0 0.25rem !important;
}

.input_user,
.input_pass:focus {
    box-shadow: none !important;
    outline: 0px !important;
    color: #b3b3b3;
}

.custom-checkbox .custom-control-input:checked~.custom-control-label::before {
    background-color: #132b5d !important;
}

a {
    color: #fff;
}

a:hover {
    color: #fff;
}

h6 {
    color: #b3b3b3;
}

.custom-control-label {
    color: #b3b3b3;
}

.headerImg {
    border: 0;
    height: 90px;
    position: absolute;
    top: 10px;
    left: 5px;
    bottom: 0;
    background: none;
}

.flip {
    -webkit-perspective: 800;

    position: relative;
}

.flip .card.flipped {
    -webkit-transform: rotatey(-180deg);
}

.flip .card.flippedX {
    -webkit-transform: rotatex(-180deg);
}

.flip .card {
    width: 100%;
    height: 100%;
    -webkit-transform-style: preserve-3d;
    -webkit-transition: 0.2s;
}

.flip .card .face {
    width: 100%;
    height: 100%;
    position: absolute;
    -webkit-backface-visibility: hidden;
    z-index: 2;

}

.flip .card .front {
    position: absolute;
    z-index: 1;

}

.flip .card .back {
    -webkit-transform: rotatey(-180deg);

}

.flip .card .up {
    -webkit-transform: rotatex(-180deg);

}

.card {
    border: 0px;
}

ol,
ul {
    list-style: none;
}

.main-body {
    height: 100% !important;
}

.input-user-envelop {
    margin-bottom: 1rem !important;
}

.input-key {
    margin-bottom: .5rem !important;
}

.butDiv {
    margin-top: 1rem !important;
}

.bodyDiv
{
    display: flex;
    height: 100%;

}
.imageDiv{

    width: 55%;
}
.login-body{
    width: 100%;
}

@media screen and (max-device-width: 640px) {
    body {
        background: #000;
    }

    .main-body {
        height: 100% !important;
        min-height: 100%;
        margin: 0;
        padding: 0;
        position: relative;
        z-index: 0;
        background-color: #000;
        color: #fff;
    }

    .cb-slideshow {
        display: none;
    }

    .headerImg {
        width: 100%;
        height: 200px;
        position: relative;
    }

    .logoDiv {

        padding-top: 25px;
        padding-left: 20px;
        width: 55%;
        height: 100%;
    }

    .login-body {
        color: #333;
        margin: 0 auto;
        padding: 10% 5%;
    }

    .user_card {
        min-height: 700px;
        margin: 0;
        padding: 20px 5% 30px;
        width: 100%;
        background-color: #000;
    }

    .login-form {
        width: 100%;
    }

    .input-group .form-control {

        height: 120px;
        font-size: 3rem;

    }

    .input-group-text {
        padding: 0.375rem 2.75rem;
        font-size: 3rem;
    }

    .input-user-envelop {
        margin-bottom: 5rem !important;
    }

    .input-key {
        margin-bottom: 4rem !important;
    }

    .form-group {
        margin-bottom: 4rem;
        /*transform: scale(3);*/
        padding-left: 8.2%;
    }

    .butDiv {
        margin-top: 2rem !important;
    }

    .login_container {
        padding: 0;
        height: 100px;
    }

    .login_btn {
        font-size: 50px;
        font-weight: bold;
    }

    .remCheck {
        display: none;
    }

    .registerLinks {
        font-size: 3rem;
        margin-top: 10rem !important;
    }

    .forgPassLink {
        font-size: 2rem;
        justify-content: flex-end !important;

    }

    .forgPassLink>a {
        text-decoration: none !important;

    } 

    a {
        color: #fff;
    }

    a:hover {
        color: #fff;
    }

    .registLabel {
        color: #b3b3b3;
    }


    .bodyDiv
    {
        display: block;

    }
    .imageDiv{

        display: none;
    }


}
#toast-container > div {
    width: auto;
    white-space: nowrap;
}


.has-spinner.active {
    cursor: progress;
}

.has-spinner.active .spinner {
    opacity: 1;
    width: auto;
}

.has-spinner.btn.active .spinner {
    min-width: 200px;
}	

@media screen and (min-device-width: 768px) and (max-device-width: 1024px) {}

.toast-message
{
    padding: 8px;
}
#toast-container>div {
    -moz-box-shadow: 0 0 12px #000;
    -webkit-box-shadow: 0 0 12px #000;
    box-shadow: 0 0 12px #000;
    opacity:1
    }