*{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: sans-serif;
}

body{
  width: 100%;
  height: 100vh;
}

/* header-page */
header{
  width: 100%;
  height: auto;
}

/* logo-box */
header .logo-box{
  padding: 2vmin 10vmin ;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: rgb(255, 91, 36);
}

header .logo-box .img-1 img{

  margin: 0 0vmin 0 0vmin;
  width: 15vmin;
  height: auto;
}

header .logo-box .img-2 img{
  margin: 0;
  width: 25vmin;
  height: auto;
}

header .heading{

  text-align: center;
}

.heading h1{
 
  font-size: 6vmin;
  color: rgb(255, 255, 255);
}


.heading h2{
  font-size: 3vmin;
  color: rgb(255, 255, 255);
}


/*yuva-sapna*/
.yuva{
  padding: 0.5rem 1.5rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: linear-gradient(to right, rgb(255, 64, 0), rgb(236, 146, 110));
}    

.yuva h2{
  font-size: 3vmin;
}

.yuva h2 span{
  color: rgb(249, 255, 82);
}

.yuva button{
  padding: 0.7vmin 2vmin;
  background-color: rgb(255, 255, 255);
  box-shadow: 0.5px 0.5px 5px rgb(103, 101, 101);
  border-radius: 10px;
  border: none;
}

.yuva button a{
color: rgb(62, 63, 64);
  text-decoration: none;
  font-size: 4vmin;
  font-weight: bold;
}

.yuva button:hover{
background-color: rgb(90, 89, 87);
}

.yuva button a:hover{
color: rgb(255, 255, 255);
}

/* navbar-page */
nav{
  padding: 0.5rem 0;
  width: 100%;
  height: auto;
  background: linear-gradient(to right, rgb(255, 64, 0), rgb(236, 146, 110));
}


nav ul{
  display: flex;
  justify-content: space-evenly;
  align-items: center;
}

nav ul li{
  padding: 0.3rem 0;
  width: 20vmin;
  list-style: none;
  background-color: rgb(250, 210, 190);
  box-shadow: 0.5px 0.5px 5px rgb(114, 102, 102);
  display: flex;
  justify-content: center;
  border-radius: 10px;
}

nav ul li:hover{
  background-color: rgb(254, 72, 72);

}

nav ul li a{
  text-decoration: none;
  color: rgb(26, 23, 23);
  font-size: 3.2vmin;

}

nav ul li a:hover{
color: aliceblue;
}





/* media css */


/* 1250px--1150px */
@media only screen and (min-width:1150px) and (max-width:1250px){
  .heading h1{
      font-size: 5.5vmin;
  }

  .heading h2{
      margin-top: 1vmin;
      font-size: 3vmin;
  }

  .marquee .marquee-div-1{
      padding: 0.5vmin;
  }

  .marquee .marquee-div-1 a{
      font-size: 2.7vmin;
  }

  .icon-box {
      margin-top: 0.8rem;
  }

  .icon-box a i{
      font-size: 3.8vmin;
  }

  header .logo-box .img-2 img{
      width: 22vmin;
  }
}

/* 1150px--1000px */
@media only screen and (min-width:1000px) and (max-width:1150px){
  .heading h1{
      font-size: 4.5vmin;
  }

  .heading h2{
      margin-top: 1vmin;
      font-size: 3vmin;
  }

  .marquee .marquee-div-1{
      padding: 0.5vmin;
  }

  .marquee .marquee-div-1 a{
      font-size: 2.4vmin;
  }

  .icon-box {
      margin-top: 1rem;
  }

  .icon-box a i{
      font-size: 3.8vmin;
  }

  header .logo-box .img-2 img{
      width: 20vmin;
  }
}

/* 1000px--900px */
@media only screen and (min-width:900px) and (max-width:1000px){
  header .logo-box{
      padding: 2vmin 5vmin;
  }
  .heading h1{
      font-size: 4.2vmin;
  }

  .heading h2{
      margin-top: 1vmin;
      font-size: 2.7vmin;
  }

  .marquee .marquee-div-1{
      padding: 0.5vmin;
  }

  .marquee .marquee-div-1 a{
      font-size: 2.2vmin;
  }

  .icon-box {
      margin-top: 2rem;
  }

  .icon-box a i{
      font-size: 3.8vmin;
  }
  
  header .logo-box .img-2 img{
      width: 18vmin;
  } 
}


/* 900px--750px */
@media only screen and (min-width:850px) and (max-width:900px){

  header .logo-box{
      padding: 2vmin 3vmin;
  }

  header .logo-box .img-1 img{
      width: 13vmin;
      height: auto;
  }

  header .logo-box .img-2 img{
      width: 17vmin;
  }

  .heading h1{
      font-size: 3.8vmin;
  }

  .heading h2{
      margin-top: 1vmin;
      font-size: 2.6vmin;
  }

  .marquee .marquee-div-1{
      padding: 0.5rem;
  }

  .marquee .marquee-div-1 a{
      font-size: 2vmin;
  }

  .icon-box {
      margin-top: 2rem;
  }

  .icon-box a i{
      font-size: 3.6vmin;
  }

}



/* 850px--750px */
@media only screen and (min-width:750px) and (max-width:850px){

  header .logo-box{
      padding: 2vmin 2vmin;
  }

  header .logo-box .img-1 img{
      width: 12vmin;
      height: auto;
  }

  header .logo-box .img-2 img{
      width: 16vmin;
  }

  .heading h1{
      font-size: 3.6vmin;
  }

  .heading h2{
      margin-top: 1vmin;
      font-size: 2.5vmin;
  }

  .marquee .marquee-div-1{
      padding: 0.5rem ;
  }

  .marquee .marquee-div-1 a{
      font-size: 1.7vmin;
  }

  .icon-box {
      margin-top: 4.2rem;
  }

  .icon-box a i{
      font-size: 3.6vmin;
  }

 
}

/* 750px--650px */
@media only screen and (min-width:650px) and (max-width:750px){

  header .logo-box{
      padding: 2vmin 1vmin;
  }

  header .logo-box .img-1 img{
      width: 13vmin;
      height: auto;
  }

  header .logo-box .img-2 img{
      width: 15vmin;
      height: auto;
  }

  .heading h1{
      font-size: 3.5vmin;
  }

  .heading h2{
      margin-top: 1vmin;
      font-size: 2.5vmin;
  }

  .marquee .marquee-div-1{
      padding: 0.5rem;
  }

  .marquee .marquee-div-1 a{
      font-size: 1.9vmin;
  }

  .icon-box {
      margin-top: 4.4rem;
  }

  .icon-box a i{
      font-size: 3.5vmin;
  }
}


/* 650px--550px */
@media only screen and (min-width:550px) and (max-width:650px){

  header .logo-box{
      padding: 2vmin 1vmin;
  }

  header .logo-box .img-1 img{
      width: 11vmin;
      height: auto;
  }

  header .logo-box .img-2 img{
      width: 13vmin;
      height: auto;
  }

  .heading h1{
      font-size: 3.3vmin;
  }

  .heading h2{
      margin-top: 1vmin;
      font-size: 2.3vmin;
  }

  .marquee .marquee-div-1{
      padding: 0.5rem;
  }

  .marquee .marquee-div-1 a{
      font-size: 2vmin;
  }

  .icon-box {
      margin-top: 4.6rem;
  }

  .icon-box a i{
      font-size: 3.5vmin;
  }
}



/* 550px--450px */
@media only screen and (min-width:450px) and (max-width:550px){

  header .logo-box{
      padding: 2vmin 1vmin;
  }

  header .logo-box .img-1 img{
      width: 10vmin;
      height: auto;
  }

  header .logo-box .img-2 img{
      width: 11vmin;
      height: auto;
  }

  .heading h1{
      font-size: 3.2vmin;
  }

  .heading h2{
      margin-top: 1vmin;
      font-size: 2.1vmin;
  }

  .marquee .marquee-div-1{
      padding: 0.5rem;
  }

  .marquee .marquee-div-1 a{
      font-size: 2vmin;
  }

  .icon-box {
      margin-top: 4.6rem;
  }

  .icon-box a i{
      font-size: 3.5vmin;
  }
}



/* 450px--300px */
@media only screen and (min-width:300px) and (max-width:450px){

  header .logo-box{
      padding: 5vmin 1vmin;
  }

  header .logo-box .img-1 img{
      width: 12vmin;
      height: auto;
  }

  header .logo-box .img-2 img{
      width: 14vmin;
      height: auto;
  }

  .heading h1{
      font-size: 3.5vmin;
  }

  .heading h2{
      margin-top: 1vmin;
      font-size: 2.1vmin;
  }

  .marquee .marquee-div-1{
      padding: 0.2rem 0.5vmin;
  }

  .marquee .marquee-div-1 a{
      font-size: 2vmin;
  }

  .icon-box {
      margin-top: 7.1rem;
  }

  .icon-box a i{
      font-size: 3.8vmin;
  }
}






/* link-box */
.section{
    margin: 2rem 0;
    width: 100%;
    height: auto;
    display: flex;
    justify-content: center;

}

.section .link-box{
    text-align: center;
    width: 60%;
    height: auto;
    border: 2px solid black;
}

.section .link-box .heading h2{
  margin-top: 0;
  text-align: center;
  padding: 0.5vmin;
  font-size: 4vmin;
  background-color: rgb(251, 91, 28);
  
}


.link-box .link-div{
    margin: 1vmin 0;
    padding: 1vmin 0;
    border: none;
}

.link-box .link-div a{
    font-size: 3vmin;
}

.link-box .link-div a:hover{
    color: rgb(255, 53, 53);
}


.link-box .view-more{
  margin: 1vmin 0;
  padding: 0.8vmin 0;
  width: 100%;
  height: auto;
  
}

.view-more a{
  padding: 1vmin 2vmin;
  text-decoration: none;
  color: aliceblue;
  font-size: 3vmin;
  background-color: rgb(255, 81, 0);
  border-radius: 3px;
}

.view-more a:hover{
  color: black;
  background-color: rgb(156, 154, 153);
} 

footer{
    margin-top: 4rem;
}