:root {
	--fade_in_time: 700;
	--fade_left_time: 300;
	--fade_right_time: 300;
  }

.navbar-brand  span{
	color: #fed136;
	font-size:25px;font-weight:700;letter-spacing:0.1em;
    font-family: 'Kaushan Script','Helvetica Neue',Helvetica,Arial,cursive;
}
.navbar-brand {
	color: #fff;
	font-size:25px;
    font-family: 'Kaushan Script','Helvetica Neue',Helvetica,Arial,cursive;
	font-weight:700;
	letter-spacing:0.1em;
}

.navbar-nav .nav-item .nav-link{
	padding: 1.1em 1em!important;
	font-size: 120%;
    font-weight: 500;
    letter-spacing: 1px;
    color: var(--bs-heading-color)!important;
    font-family: 'Gothic A1', sans-serif;
}
.navbar-nav .nav-item .nav-link:hover{color:#fed136;}
.navbar-expand-md .navbar-nav .dropdown-menu{
	border-top:3px solid #fed136;
}
.dropdown-item:hover{background-color:#fed136;color:#fff;}
nav{-webkit-transition: padding-top .3s,padding-bottom .3s;
    -moz-transition: padding-top .3s,padding-bottom .3s;
    transition: padding-top .3s,padding-bottom .3s;
    border: none;
	}
	
 .shrink {
    padding-top: 0;
    padding-bottom: 0;
    background-color: #212529;
	box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2);
}
#main-menu hr {
	margin: 0 1em!important;
	color: rgba(var(--bs-body-color-rgb), 0.5)!important;
}
.navbar-toggler {
	color: #fff !important;
	border: 1px solid #fff !important;
	line-height: inherit!important;
}
.only-mobile {
	display: none;
}
.banner{
	background-image:url("../img/app/hero-image.jpg");
	text-align: center;
    color: #fff;   
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
.banner-text{
	padding:200px 0 150px 0;
}
.banner-heading{
	font-family: 'Lobster', cursive;
	font-size: 75px;
    font-weight: 700;
    line-height: 100px;
    margin-bottom: 30px;
	color:#fff;
}
.banner-sub-heading{
	/*font-family: 'Libre Baskerville', serif;*/
	font-size: 28px;
    font-weight: 400;
    line-height: 30px;
    margin-bottom: 50px;
	color:#fff;
}

.btn-banner{
	padding:5px 20px;
	border-radius:10px;
	font-weight:700;
	line-height:1.5;
	text-align:center;
	color:#fff;
	text-transform:uppercase;
}
.text-intro{
	width:90%;
	margin:auto;
	text-align:center;
	padding-top:30px;
}

/* Feature Section*/
.feature-content-block {	
	padding-top: 0.5rem;
	transition: all 0.3s;
}
.clear-top {
	margin-top: 0px !important;
}
.feature-icon {
	width: 4rem;
	height: 4rem;
	border-radius: .75rem;
  }
  
  .icon-square {
	width: 3rem;
	height: 3rem;
	border-radius: .75rem;
  }
  
  .text-shadow-1 { text-shadow: 0 .125rem .25rem rgba(0, 0, 0, .25); }
  .text-shadow-2 { text-shadow: 0 .25rem .5rem rgba(0, 0, 0, .25); }
  .text-shadow-3 { text-shadow: 0 .5rem 1.5rem rgba(0, 0, 0, .25); }
  
  .card-cover {
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
  }
  
  .feature-icon-small {
	width: 3rem;
	height: 3rem;
  }
  /* End Feature Section */

  /* How it work timeline*/
  .top-separator-3 {
	margin-top: 3rem !important;
  }
  .timeline-with-icons {
	border-left: 1px solid hsl(0, 0%, 90%);
	margin-left: 26px;
	position: relative;
	list-style: none;
  }
  
  .timeline-with-icons .timeline-item {
	position: relative;
  }
  
  .timeline-with-icons .timeline-item:after {
	position: absolute;
	display: block;
	top: 0;
  }
  
  .timeline-with-icons .timeline-icon {
	position: absolute;
	left: -52px;
	border-radius: 50%;
	height: 40px;
	width: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
  }
  /* End How it work timeline*/

  /* Footer */
  footer {
	box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2);
	padding-top: 40px;
	padding-bottom: 20px;
}

footer .copyright {
	text-align: center;
	padding-top: 20px;
}

footer .dev-by {
	text-align: center;
}
.dev-by > a {
	text-decoration: none;
	color: unset;
}

.social-icons {
	margin-top: 1rem;
}

.social-icons>li:first-child {
	margin-left: 0px !important;
}
  /* End Footer*/
  .py-container {
    padding-top: 3rem !important;
    padding-bottom: 0 !important;
}
  /* mobile view */
@media (max-width:500px)
{	
	.navbar-nav .nav-item .nav-link{
		padding: 0.7em 1em!important;
		font-size: 100%;
		font-weight: 500;
    }	
	.banner-heading{
		font-size: 30px;
		line-height: 30px;
		margin-bottom: 20px;
	}
	.banner-sub-heading{
		font-size: 10px;
		font-weight: 200;
		line-height: 10px;
		margin-bottom: 40px;
	}
}

@media (max-width:767px){
	.banner-text{
		padding:150px 0 150px 0;
	}
	.banner-sub-heading{
		font-size: 23px;
		font-weight: 200;
		line-height: 23px;
		margin-bottom: 40px;
	}
	.home-action-btn {
		display: none;
	}
	.only-mobile {
		display:block;
	}
	.navbar-nav {
		background-color: var(--background-fill);
		border-top: 3px solid #fff;
		z-index: 1;
		margin-top: 5px;
	}	
	.first-element-list {
		margin-top: 1.5rem!important;
	}
	.not-top-mobile {
		margin-top:0!important;
	}
}

@media (min-width:767px){
	/* Feature Section*/
	.ft-cb-1 {
		width: 49% !important;
		margin-right: 1%;		
	}
	.ft-cb-2 {
		width: 49% !important;
		margin-left: 1%;		
	}
}

@media (prefers-color-scheme: light) {
	:root {
		--background-fill: #F4F3F8;
		--nav_logo: url("../img/app/my-free-menu-dark.png");
	  }
  
	  .background-fill {
		  background-color: var(--background-fill);
	  }
	  .footer-logo {
		content: var(--nav_logo);
	}
	.feature-content-block:hover {
		box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2);
	}
}
@media (prefers-color-scheme: dark) {
	:root {
	  --background-fill: #212529;
	  --nav_logo: url("../img/app/my-free-menu-light.png");
	}

	.background-fill {
		background-color: var(--background-fill);
	}
	.footer-logo {
		content: var(--nav_logo);
	}
	.feature-content-block:hover {
		box-shadow: 0 0 10px 0 rgba(255, 255, 255, 0.2);
	}
  }