html,body
{
    height: auto;
	margin:0;	
	user-select: none;
	background-color:#faf9f7;
	font-family: 'Public Sans', sans-serif !important;
	line-height: 1.42;
	overflow-x:hidden;
}
.clearfix{clear:both}
.noPadding
{
    padding:0 !important;
}
@font-face {
	font-family: fonttoapply;
	/* src: url(Fontania-MjXr.ttf); */
	src: url(Schoolrules-R7Ye.ttf);
}

/* Header */
header{
    position: fixed;
	width: 100%;
	background-color: white;
	border-bottom: 2px solid #ffbe00;
	z-index: 1;
	font-size: 15px;
}
#myNavbar
{
   padding-left: 34%;
   top: 86px;
}
.container
{
    width:100%;
}
#socialButtons a{
    font-size: 34px;
	margin-left: 12px;
	color:#f56437;
}
#socialButtons a
{
    text-decoration: none;
}
.navbar-inverse .navbar-nav>li>a {
    color: black;
}
.navbar-nav{
    text-transform: uppercase;
    text-align: left !important;
    list-style: none;
    text-decoration: none;
}
.navbar-inverse .navbar-toggle .icon-bar {
    background-color: black!important;
}
.navbar-inverse .navbar-toggle {
    border-color: #333!important;
    background-color: white!important;
}
.navbar-inverse {
    background-color: transparent;
    border-color: transparent;
}
.navbar-inverse .navbar-nav>.open>a, .navbar-inverse .navbar-nav>.open>a:focus, .navbar-inverse .navbar-nav>.open>a:hover {
    color: #f4bb03!important;
    background-color: transparent!important;
}
.navbar-inverse .navbar-nav .open .dropdown-menu>li>a
{
    color: black!important;
}
.navbar-inverse .navbar-nav .open .dropdown-menu>li>a:hover
{
    color: #f4bb03!important;
}
.navbar-inverse .navbar-nav>li>a:focus, .navbar-inverse .navbar-nav>li>a:hover {
    color: #f4bb03!important;
    background-color: transparent!important;
}
.navbar{
	padding: 1vh 0vw;
	margin-bottom: 0;
}
@media (min-width: 992px){
.navbar-expand-lg .navbar-toggler {
    display: none;
}
}
@media (max-width: 960px) {
    .container
    {
        padding: 3vw !important;
    }
    .navbar-collapse {
      z-index: 9999 !important;
      position: absolute;
      left: 0;
      top: 20vh;
      width: 100%;
      background-color: #faf9f7;
      box-shadow: 2px 2px 7px black;
      text-align: center !important;
    }
    .socialButtonsCls
    {
        padding: 10px;
        position: unset!important;
        right: unset!important;
        
    }
    #socialButtons a {
        font-size: 24px!important;;
    }
    #myNavbar
    {
        padding: 10px 15px!important;
    }
  }
.socialButtonsCls{
    position: fixed;
	right: 25px;
	line-height: 4;
}

/*map and look who wished*/
.section1,.mapDiv
{
	background-color: #fff;
	padding: 20px;
	margin-top:1vh;
	border-top:1px solid #ffbe00;
}
.section1{
	height:85vh;
	top:12vh;
}
.mapAndAssociation
{
	top:12vh;
}
.mapDiv
{
	margin-left:1vw
}
.section1::before {
    content: "";
    position: absolute;
    z-index: -1;
    width: 96%;
    bottom: 0;
    height: 10px;
    left: 2%;
    border-radius: 100px / 5px;
	box-shadow: 0 0 18px rgba(0, 0, 0, 0.6);
}
.mapDiv::before {
    content: "";
    position: absolute;
    z-index: -1;
    width: 96%;
    bottom: 0;
    height: 10px;
    left: 2%;
    border-radius: 100px / 5px;
	box-shadow: 0 0 18px rgba(0, 0, 0, 0.6);
}
.stateIconDiv,.backIconDiv 
{
	font-size: 18px;
	margin:0px 0 10px 0;
	text-align:center;
	color: #214569;
}

#viewAllStateTxt,#backBtnTxt
{
	text-transform: uppercase;
    letter-spacing: .6px;
	color: #214569;
	line-height: 1.5;
    padding: 0;
    margin: 0px 0px 10px 0;
    border: 0!important;
	display: inline-block;
	font-weight: 700;
	font-size: 14px;
	cursor:pointer;
}
.stateList
{
	font-size: 17px;
	line-height: 25px;
	color: #1e456d;
	text-align: center;
	border: 1px solid #ccd4d9;
	padding: 10px 10px 5px 10px!important;
	margin: 0 -5px 10px -5px;
	display: block;
	width: auto;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	-ms-border-radius: 4px;
	border-radius: 4px;
	cursor: pointer;
	font-weight: 700;
}
#text1
{
	font-size: 30px;
    color: black;
	height:fit-content;
	line-height: 1.5;
	/* font-family: fonttoapply; */
}

#text2
{
	font-size: 30px;
    color: black;
/* 	font-weight:bolder; */
	height:fit-content;
	line-height: 1.5;
/* 	font-family: fonttoapply; */
}
/*logo and btns css*/
#lookWhoWishDiv{
    height: 40px;
    border-radius: 4px;
    background-image: linear-gradient(to bottom, #f9754c, #ea4f1f);
    line-height: 20px;
    font-size: 16px;
    color: white;
    text-align: center;
    cursor: pointer !important;
    font-weight: 500;
    padding-left:0px;
    padding-right: 0px;
	margin-top:2vh;
	display: flex;
    align-items: center;
	flex-wrap: wrap;
	justify-content: center;
	font-weight: bold;
}
#wishPrathamDiv
{
	font-size: 25px;
	height: 60px;
	margin-top:2vh;
	border-radius: 4px;
    background-color: #ffbe00;
    line-height: 20px;
    color: white;
    text-align: center;
    cursor: pointer !important;
    font-weight: bold;
    padding-left:0px;
	padding-right: 0px;
	display: flex;
    align-items: center;
	flex-wrap: wrap;
	justify-content: center;
}
#wishPrathamDiv a
{
	width: 100%;
    height: 100%;
    line-height: 2.5;
    color: white;
    text-decoration: none!important;
}
#logoDiv 
{
	box-shadow: 0 10px 11px rgba(0, 0, 0, 0.3);
}

#wishPrathamDiv:hover {
    background-image: linear-gradient(to bottom, #f9754c, #ea4f1f);
    color: #f2f2f2;
}
#lookWhoWishDiv:hover {
    background-image: linear-gradient(to bottom, #f9754c, #ea4f1f);
    color: #f2f2f2;
}
#messageDiv{

    padding: 20px;

}
.stateDropdown
{
	height:70vh;
	overflow-y: scroll;
	overflow-x:hidden;
}
/*logo and btns css end*/

/*map css*/
.leaflet-pane
{
	z-index: 0;
}
#mapId
{
	height:60vh;
	background-color: transparent;
}
#mapList
{
	background-image: linear-gradient(to bottom, #f9754c, #ea4f1f);
	border-radius: 4px;
	padding:0 3px!important;
}

.menuList
{
	list-style:none;
	color:black;
	cursor: pointer; 
	font-size: 20px;
	padding: 10px;
	margin-left: 1vw;
}
.mapDrop
{
	position: absolute;
    right: 5vw;
}

.mapDropdown
{
	list-style: none;
    color: black;
    text-align: left;
    padding: 1vh;
	font-size: 16px;
	text-decoration: none;
	cursor: pointer;
	font-weight:bold;
}
.mapDropdown li
{
	text-decoration: none;
}
.MapDropdownList
{
	text-decoration: none;
	min-width:100px !important;
	position: absolute;
    top: 100%;
    left: 0;
    float: left;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: 4px;
    padding: 5px 0;
	margin: 2px 0 0;
	display: none;
}

li a{text-decoration: none!important;}
#wisheshCount
{
	position:absolute;
	font-family: 'Kaushan Script', cursive;
	font-size:20px;
	top:1vh;
}

#usMapWish
{
	position:absolute;
	bottom:2vh;
	font-family: 'Kaushan Script', cursive;
	font-size:20px;
	background-size: 100% 100%;	
	background-position: center;
	background-repeat: no-repeat;
	height:8vh;
}
.custom-div-icon
{
	width: 28px !important; 
	height: 28px!important;
	z-index: -1 !important;
}

.map-label
{
	border-radius: 50%;
	color: #ffbe00;
/* 	background-image: linear-gradient(to bottom, #f9754c9e, #ea4f1fb3); */
	background-color:#fff;
	width: 100%;
	height: 100%;
	text-align: center;
	padding-top:25%;
	font-weight:bold;
	font-size:9.8px
}
.districtLabels
{
	border-radius: 50%;
	color: white;
	background-color:#ffbe00;
	width: 100%;
	height: 100%;
	text-align: center;
	padding-top:25%;
	font-weight:bold;
	font-size:9.8px
}

.backToMap
{
	color: black;
    font-weight: bold;
    padding: 1vh;
    font-size: 16px;
	position:absolute;
	cursor:pointer;
}
/*association style*/
#associationNo{
	background-color: #fff;
	padding: 5px 0;	
	position: relative;
	left:1vw;
	margin-top:2vh;
	border-top: 1px solid #ffbe00;
	height:16.5vh
}
#associationNo::before {
    content: "";
    position: absolute;
    z-index: -1;
    width: 96%;
    bottom: 0;
    height: 10px;
    left: 2%;
    border-radius: 100px / 5px;
	box-shadow: 0 0 18px rgba(0, 0, 0, 0.6);
}

.associations{
	margin:auto;
	font-family: fonttoapply;
}
#associationNo{
	display:inline-flex;
	padding: 15px;
}
@media screen and (max-width: 800px)
{
	#associationNo
	{
		display:block;
	}
	.associations
	{
		margin-bottom: 20px;
	}
}
#yearDiv
{
	margin-top: 2.5vh;
    /* font-weight: bold; */
	color: black;
/* 	font-family: fonttoapply; */
	font-size: 22px;
	line-height: 1.5;
}
/*map css end*/

/* images style*/
.imageDiv
{
	height:48vh;
	overflow-y:scroll;
	overflow-x: hidden;
	margin-top:1vh;
	
}
.para
{
	transform: rotate(0deg);
	text-overflow: ellipsis;
	direction: ltr;
	white-space: nowrap;
	overflow: hidden;
	background-color:#ffbe00;
/* 	padding:0.5vh; */
/* 	border-radius: 8px; */
	font-weight:800;
	margin-top:0vh;
}
.names 
{
	padding:1vh;
	margin-top: 3vh;
}
.imgCards
{
	margin:0.3vh 0vh 0.3vh 0vh !important;
}
.column{
	padding:0vw 0.2vw 0vw 0.2vw !important;
}
.subDiv{
	
	/* background-image: linear-gradient(to bottom, #f9754cbd, #bc3309); */
	background-color: #f56437;
	color:black;
	font-size:15px;
	padding:2px;
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
	text-align: center;
	font-family: Public Sans, sans-serif;
}
.personImg
{
	border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
/*end*/


/* video div style */
.video
{
	background-color: #fff;
	padding: 20px;
	margin-top:15vh;
	margin-bottom:2vh;
	border-top:2px solid #ffbe00;
}
#videoName
{
	height:9vh;
}

.video::before {
    content: "";
    position: absolute;
    z-index: -1;
    width: 96%;
    bottom: 0;
    height: 10px;
    left: 2%;
    border-radius: 100px / 5px;
	box-shadow: 0 0 18px rgba(0, 0, 0, 0.6);
}
#videoDiv
{
	padding-bottom: 15px;
}

.prev, .next {
    cursor: pointer;
    position: absolute;
    top: 40%;
    width: auto;
    padding: 1vw;
    color: black;
    font-weight: bold;
    font-size: 40px;
    user-select: none;
    box-shadow: none !important;
}
.prev:hover, .next:hover {
    background-color: rgba(0,0,0,0.8);
	color:white;
}
a:hover {
    text-decoration: none;
}
.next {
    right: 0%;
}

/*footer*/
.footer {
	
	width: 100%;
	background-color:#faf9f7;
	color: #646565;
	 padding:2%; 
	text-align:center;
	border-top:1px solid #ffbe00;
 }
 .footer a
 {
	color:#646565;
	text-decoration:none;
 }
 
 p.heading{
	 font-size:15px;
	 font-weight:bold;
 }
  p.headline
  {
	 text-align: left;
	 color: #333333;
	 line-height: 25px;
	 font-size: 14px;
 } 
 .decoration
 {
 margin-top: 10px;
 }
 
 #button 
 {
 /* display: inline-block; */
 background-color: #FF9800;
 width: 40px;
 height: 40px;
 text-align: center;
 border-radius: 4px;
position: absolute;
 bottom: 20px;
 right: 20px; 

 transition: background-color .3s,
 opacity .5s, visibility .5s;
 opacity: 0;
 visibility: hidden;
 z-index: 1000;
  }
  .fasIcon
  {font-size: 25px;
  margin-top: 1vh;
  color: white;
  font-weight: bold;
}
  #button:hover {
 cursor: pointer;
 background-color: #333;
  }
  #button:active {
 background-color: #555;
  }
  #button.show {
 opacity: 1;
 visibility: visible;
  }
/*end footer*/

.font
{font-family: 'Public Sans', sans-serif !important;}

/* media query*/
@media screen and (max-width: 800px)
{
	.logoAndWishPrathamDiv  {display: flex; flex-flow: column;}
	.showStatesDiv{order:2};
	#messageDiv{order:1;}
	.mapDiv
	{
		margin-top:4vh;
	}
	#associationNo
	{
		height:auto;
	}
	.showStatesDiv{
		margin-top:25px;
		margin-left: 12vw;
	}
	.associationText 
	{
		display:block;
	}
}


/* css for scrollbar  */
/* width */
::-webkit-scrollbar {
 width: 0.8vw;
}

/* Track */
::-webkit-scrollbar-track {
 box-shadow: inset 0 0 5px #ffbe00; 
 border-radius: 10px;
}

/* Handle */
::-webkit-scrollbar-thumb {
 background:  #ffbe00; 
 border-radius: 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
 background: #ffbe00; 
}/* css for scrollbar  */

/* width */
::-webkit-scrollbar {
 width: 0.8vw;
}

/* Track */
::-webkit-scrollbar-track {
 box-shadow: inset 0 0 5px #ffbe00; 
 border-radius: 10px;
}

/* Handle */
::-webkit-scrollbar-thumb {
 background:  #ffbe00; 
 border-radius: 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
 background: #ffbe00; 
}