/*!
  * Item: Willy Wonka Theme
  * Description: Personal Portfolio Website Template
  * Author/Developer: Sujal
  * Version: v1
  */
@import url('https://fonts.googleapis.com/css?family=Raleway:300&display=swap');
@import url('https://fonts.googleapis.com/css?family=Monoton&display=swap');
@import url('https://fonts.googleapis.com/css?family=Poppins:500&display=swap');
*{
    padding: 0%;
    margin: 0%;
    box-sizing: border-box;
}
/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}
body{
    user-select: none;
    height: auto;
    overflow-x: hidden;
    width: 100%;
    background: #FFFFFF;
}
#header{
	background-image: url('../images/main-slider/home-elderly-care.webp');
	background-repeat: no-repeat;
background-position: center center;
background-attachment: fixed;
background-size: cover;
    height: 100vh;
    width: 100%;;
    overflow: hidden;
    animation: scale 1.5s ease;
    position:relative;
    display: block;
}
#particles{
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100vw;
    background-size: cover;
    background-position: 50% 50%;
    display: block;
}
#navigation-bar img{
    height: 80px;
    position: absolute;
    ;
    top: 15%;
    left: 2.5%;
    opacity: .8;
    transition: all .4s ease;
}
.header-content{
    height: 100vh;
    width: 100%;
    float: left;
    display: flex;
    position: absolute;
    align-items: center;
    justify-content: center;
    color: whitesmoke;
    font-family: raleway;
    font-weight: 400;
    letter-spacing: 1px;
    flex-direction: column;
    font-size: 50px;
    z-index: 1;
}
.header-content-box{
    z-index: 2;
    text-align: center;
    height: auto;
    padding-right: -20px;
    width: auto;

}
.header-content .firstline{
    z-index: 2;
    font-weight:700;
    font-family: poppins;
    font-size: 65px;
}
.header-content .secondline{
    z-index: 2;
    font-size: 30px;
    padding-top:20px ;
    font-weight:500;
    color: rgb(255, 255, 255,.8);
}
.color{
    color: #2E6AB2;
    transition: all .4s ease;
}
.cursor{
    height: 50px;
    width: 50px;
    display: block;
    border-radius: 50%;
    border: 1px solid whitesmoke;
    background: transparent;
    pointer-events: none;
    position: fixed;
    top: -25px;
    left: -25px;
    z-index: 10;
    opacity: .6;
    transition:  scale .5s ease;
}
.cursor-small{
    height: 50px;
    width: 50px;
    display: block;
    border-radius: 50%;
    border: 1px solid whitesmoke;
    background: transparent;
    pointer-events: none;
    position: fixed;
    top: -25px;
    left: -25px;
    z-index: 10;
    opacity: .6;
    transition:  scale .4s ease;
}

