@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');


:root {
    --blue: #55C1FF;
    --pink: #EB00FF;
}


body {
    margin: 0;
    padding: 0;
    font-family: 'Montserrat', sans-serif;
}

a { text-decoration: none; }

a:hover, a:focus { text-decoration: none; }

:focus { outline: none; }

.btn { padding: 10px 30px; }

.section { padding: 100px 0; }

.login-wrapper {
    position: relative;
    width: 100%;
    height: 90vh;
    background-image: url(../images/bg-login.jpg);
    background-repeat: no-repeat;
    background-size: cover;
}

.userIcon { width: 70px; }

.loginForm ::placeholder { color: #ddd; }

.loginForm .form-group { margin-bottom: 20px; }

.loginForm .form-control {
    background: transparent;
    color: #FFF;
    border: solid 1px #fff;
    height: 50px;
}

.loginForm p {
    font-size: 13px;
    color: #FFF;
}

.loginForm p a { color: var(--blue); }


/* LOGIN RIGHT SIDE */

.login-right h3, .login-right h5 {
    color: #FFF;
    font-weight: 400;
}

.login-right p {
    color: #FFF;
    font-weight: 400;
}

.login-right .icons { margin-top: 40px; }

.login-right .icons .circleImg {
    width: 150px;
    height: 150px;
    border-radius: 50px;
    object-fit: cover;
    margin-bottom: 20px;
}

.login-right .icons p { text-transform: uppercase }

.login-right .contactDetails p { font-weight: 600 }

.login-right .contactDetails p i { color: var(--blue); }


/* SLIDER */

.slider .slick-slide { margin: 0 10px; }

.slick-slide .drop-shadow {
    box-shadow: none;
    /
    /
    no shadow
    for a
    hidden slide
    transition: box-shadow 0.1s ease-in-out;
    /
    /
    little effect
    to fade
    the shadow
}

.slick-slide.slick-active .drop-shadow {
    box-shadow: 0px 0px 43px 0px rgba(0, 0, 0, 0.35);
    /
    /
    only the
    active slides
    have the
    shadow
}

.slider .slick-slide:focus { border: none; }

.slider div:focus { border: none; }

.slider .card { margin: 10px auto; }

.slider .card-img-top {
    width: 100%;
    height: 150px;
    object-fit: cover;
}

.slider .card-title {
    text-transform: capitalize;
    color: #000;
    font-weight: 700;
    line-height: 1.5;
    color: #243561;
    height: 134px;
    font-size: 0.95rem
}

.slider .card-body .date {
    font-size: 0.8rem;
    color: #707070;
}

.slider .card-body p {
    color: #707070;
    font-size: 0.8rem;
}

.slider .card-text {
    height: 265px;
    text-overflow: ellipsis
}

.slider .link {
    color: var(--blue);
    font-size: 0.8rem;
}

.slider .link:hover { color: #243561; }


.slick-prev:before, .slick-next:before { color: #000; }