/* Common Css Start */

*{
    margin:0;
    padding:0;
    outline:0;
    box-sizing: border-box;
}

a, a:hover{
    text-decoration: none;
    display: inline-block;
}

ol, ul{
    list-style-type: none;
}

h1, h2, h3, h4, h5, h6, p{
    margin:0;
    padding:0;
    line-height: 0.8;
}
/* Common Css End */

/* Navbar Part Css Start  */

.navbar{
    background:#FFF9F4;
    position:fixed;
    width:100%;
    top:0;
    left:0;
    z-index:50;
}

.nav-link{
    font-family: "Sora", serif;
    font-size:20px;
    font-weight: 400;
    color:#111111;
    margin-right:20px;
}
.nav-link:hover{
    color:#FFDC26;
   
}

.navbar-brand img{
    width: 60%;
}
.navBtnLogin{
    padding:6px 20px;
    border: 1px solid #FFDC26;
}

.navBtnLogin a{
    font-family: "Sora", serif;
    font-size:15px;
    font-weight: 400;
    color:#111111;
}

.navBtnRegister{
    padding:6px 20px;
    background:#FFDC26;
}

.navBtnRegister a{
    font-family: "Sora", serif;
    font-size:15px;
    font-weight: 400;
    color:#111111;
}

.navIcons a{
    font-size:15px;
    color:#111111;
}

.navIcons a i{
   padding-right:15px;
}
/* Navbar Part Css End  */
/* Banner Part Css Start  */
#bannerPart {
	padding: 152px 0px 153px 0px;
	background: url(../images/bannerbg.png) no-repeat;
	background-position: center;
	background-size: cover;
}
.bannImageOne {
	position: absolute;
	top: 41%;
	left: 53%;
	transform: rotate(59deg);
}
.bannImageTwo {
    position: absolute;
    top: 35%;
    left: 70%;
    transform: rotate(79deg);
}
.bannImageThree {
    position: absolute;
    top: 21%;
    left: 63%;
    transform: rotate(67deg);
}
.bannImageFour {
    position: absolute;
    top: 19%;
    left: 75%;
    transform: rotate(63deg);
}
.bannImageFive {
    position: absolute;
    top: 50%;
    left: 61%;
    transform: rotate(74deg);
}

.bannerText h1 {
	font-family: "ADLaM Display", serif;
	font-size: 53px;
	font-weight: 400;
	line-height: 57px;
	color: #111111;
}
.bannerText p {
	font-family: "Sora", serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 22px;
	color: #111111;
	padding: 10px 0 26px 0px;
	width: 372px;
}
.bannerBtn{
    padding:6px 20px;
    background:#FFDC26;
    border:none;
    border-radius:5px;
}
.bannerBtn a{
    font-family: "Sora", serif;
    font-size:15px;
    font-weight: 400;
    color:#111111;
}
/* Banner Part Css End  */
/* Category Part Css Start  */
#categoryPart{
    padding:80px 0px;
}

.categoryTop h2{
    font-family: "ADLaM Display", serif;
    font-size:36px;
    font-weight: 400;
    color:#111111;
    padding-bottom:30px;
}
.categoryItemCard {
    padding: 30px 20px;
    background: #F9DF8A;
    border-radius: 10px;
    position: relative;
}
.categoryItemCard img {
    position: absolute;
    top: 23%;
    left: 50%;
    transform: translate(-50%, -23%);
}

.cardbody {
    margin-top: 140px;
    text-align: center;
}
   
.cardbody h4 {
    font-family: "ADLaM Display", serif;
    font-size: 16px;
    font-weight: 400;
    color: #000000;
    margin-bottom: 10px;
}
.cardbody p{
    font-family: "Sora", serif;
    font-size:16px;
    font-weight: 400;
    color:#000000;
}

/* Category Part Css End  */
/* Tending Part Css Start  */
#tendingPart{
    padding:140px 0px 130px 0;
    background: #FFF9F4;
}

.tendingHeader h2{
    font-family: "ADLaM Display", serif;
    font-size:36px;
    font-weight: 400;
    color:#111111;
    padding-bottom:50px;
}
.tendingleft {
    height: 400px;
    padding: 20px;
    background: #F9DF8A;
    border-radius: 10px;
}
.tendingleft h4 {
    font-family: "ADLaM Display", serif;
    font-size: 20px;
    font-weight: 400;
    color: #111111;
    padding-bottom: 16px;
}
.tendingleft p {
    font-family: "ADLaM Display", serif;
    font-size: 12px;
    font-weight: 400;
    line-height: 17px;
    color: #5e5e5e;
    margin-bottom: 20px;
}
.tendingLeftCard{
    position:relative;
}
.tendingDog img {
    position: absolute;
    top: 20%;
    left: 12%;
    width: 92%;
}
.tendingCardflex{
    display:flex;
    flex-wrap: wrap;
}
.tRating{
    display:flex;
    align-items: center;
    margin-bottom:18px;
}
.tendingCardImg {
    padding: 12px;
    background: #FF8087;
    margin-right: 14px;
}
.tRating h6{
    margin-left:6px;
    font-family: "Sora", serif;
    font-size: 16px;
    font-weight: 400;
    color:#111111;
}
.tendingText h5 {
    font-family: "Sora", serif;
    font-size: 17px;
    font-weight: 500;
    color: #111111;
    margin-bottom: 13px;
}
.tendingText h4{
    font-family: "Sora", serif;
    font-size: 16px;
    font-weight:500;
    color:#111111;
    margin-bottom:10px;
}
.tendingRightCard{
    padding:20px 30px;
    background:#ffff;
    border-radius: 5px;
    border:1px dotted rgb(206, 203, 203);
    margin-bottom:10px;
}
/* Tending Part Css End  */
/* Glooming Part Css Start  */

#gloomingPart{
    padding:60px 0px;
}
.gloomingHeading h4{
    font-family: "ADLaM Display", serif;
    font-size: 36px;
    font-weight: 400;
    color:#111111;
    margin-bottom: 50px;
}

.petGloomingLeft{
    background: linear-gradient(to bottom right, #F8CCFB, #E8CDFB, #ACD2FD);
    padding:40px;
    position:relative;
    height:480px;
    border-radius: 15px;
}
.petGloomingText{
    padding:100px 20px;
}
.petGloomingText p{
    font-family: "Sora", serif;
    font-size: 20px;
    font-weight:400;
    color:#000000;
    margin-bottom:20px;

}
.petGloomingText h4{
    font-family: "ADLaM Display", serif;
    font-size:32px;
    font-weight:400;
    color:#000000;
    margin-bottom:20px;
}
.petGloomingText h5{
    font-family: "ADLaM Display", serif;
    font-size:24px;
    font-weight:400;
    color:#ffff;
    margin-bottom:40px;
}

.petGloomingText h3{
    font-family: "ADLaM Display", serif;
    font-size:56px;
    font-weight:400;
    color:#000000;
}
.petGloomingLeftImg {
    position: absolute;
    right: -66px;
    top: 5px;
}
.petGloomingRight{
    height:480px;
    background: linear-gradient(to bottom right, #FFF9F4, #F9DF8A);
    padding:60px;
    border-radius: 15px;
    position:relative;
}
.petGloomingRight h4{
    font-family: "ADLaM Display", serif;
    font-size:32px;
    font-weight:400;
    color:#000000;
}
.petGloomingRight h5{
    font-family: "ADLaM Display", serif;
    font-size:56px;
    font-weight:400;
    color:#FFDC26;
    margin-top:30px;
}
.petGloomingRightImg{
    position:absolute;
    right:0;
    bottom:0;
}
/* Glooming Part Css End  */
/* Pow News Part Css Start */
#powNewsPart{
    /* height:490px; */
    padding:38px 89px;
    background-image:linear-gradient(to bottom, #fff 0%, #fff 50%, rgba(255, 212, 38, 0.5) 50%, rgba(255, 212, 38, 0.5) 100%);
}

.powNewsBox{
    background:#FFF9F4;
    padding:40px 80px;
    border-radius: 10px;
}
.powNewsText{
    padding:90px 0px;
}
.powNewsText h5{
    font-family: "ADLaM Display", serif;
    font-size:36px;
    font-weight:400;
    color:#111111;
    margin-bottom:30px;
}
.powNewsText p {
    font-family: "Sora", serif;
    font-size: 20px;
    font-weight: 400;
    color: #111111;
    line-height: 30px;
    margin-bottom: 30px;
}
.emailInput{
    padding:15px 30px;
    background:#fff;
    border:none;
    width:100%;
    margin-bottom:30px;
}
/* Pow News Part Css End  */
/* Footer Part Css Start  */
#footerPart{
    padding:90px 0px;
    background:rgba(255, 212, 38, 0.5);
}
.footerPowFlex{
    display:flex;
    align-items: center;
    margin-bottom:50px;
}
.footerPowFlex h6{
    font-family: "Sora", serif;
    font-size: 26px;
    font-weight:400;
    color:#111111;
    margin-left:30px;
}
.footerPowFlex h6 span{
    color:#FFDC26;
}
.footerLeft p{
    font-family: "Sora", serif;
    font-size: 20px;
    font-weight:400;
    color:rgba(17, 17, 17, 0.7);
    line-height: 30px;
}
.footerMiddle h5{
    font-family: "Sora", serif;
    font-size: 20px;
    font-weight:400;
    color:#111111;
    margin-bottom:60px;
}
.footerRight h4{
    font-family: "Sora", serif;
    font-size: 16px;
    font-weight:500;
    color:#111111;
    margin-top:80px;
    margin-bottom:20px;
}
.iconFlex{
    display:flex;
    justify-content: space-between;
}
.iconFlex a{
    font-size:30px;
    color:#111111;
    margin-right:20px;
}





/* Footer Part Css End  */
/* Banner Part Css Start  */
/* Banner Part Css End  */
/* Banner Part Css Start  */
/* Banner Part Css End  */