body{
	font-family: Roboto,sans-serif;
}



a{
	transition: 1s;
	color: #fff;
}

a:hover{
	text-decoration: none;
	color: inherit;

}

ul,li{
    list-style: none;
}

.page_title1 {
    position: relative;
    font-size: 60px;
    font-weight: 100;
    color: #fff;
}

h2.page_title1 {
    position: relative;
    font-size: 40px;
    font-weight: 100;
    color: #fff;
}

.inner_page .page_title1{
	text-align: center;
}

.progress_bar_container{
	position: relative;
	margin-top: 40px;
}

.inner_page .fl_progress_bar__indicator {
    padding: 0 6px;
    width: 92%;
}


.fl_home_body{
	background: url('../images/home_body_bg.jpeg');
	background-repeat:no-repeat;
	    background-size: 139% auto;
    background-color: #201d34; 
}


.fl_step_2_bg{
	background: url('../images/step_2_bg.jpeg');
	background-repeat:no-repeat;
	    background-size:105% 344px;
    background-color: #201d34; 
}



.fl_header{
	padding-top: 70px;
}

.fl_logo{
	position: relative;
    display: block;
    background-color: rgba(37,29,58,.7);
    height: 122px;
    width: 300px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 85px;
    box-shadow: 0 15px 20px 0 rgba(9,5,21,.15);
    transition: background-color .35s ease;

}


@media (min-width: 1200px){
.container {
    max-width: 1259px;
}

}




.btn_gender{
	width: 200px;
    height: 200px;
   	border-radius:50%;  

     text-align: center;
    float: left;
    margin-left: 40px;
    margin-right: 40px;
    color: #fff;
    font-size: 26px;
    font-weight: 300;
    transition: 0.6s;
     position: absolute;
        top: 48px;
        left: 25px;


}

.btn_gender i{
	font-size: 100px; 
	padding-top: 33px;

}

.btn_gender_female{
     border: 1px solid #ef5eb9;
    background-image: linear-gradient(90deg,#f53373,#bf51e8);
    box-shadow: 0 20px 30px 0 rgba(76,5,45,.6);
        cursor: pointer;
   

}

.btn_gender_male{
	border: 1px solid #5bd8f0;
	background-image: linear-gradient(90deg,#33f5e0,#5172e8);
    box-shadow: 0 20px 30px 0 rgba(13,38,102,.6);
    cursor: pointer;


}


.btn_gender_background{
	position:relative;
	  width: 300px;
    height: 300px;
    border-radius: 150px;

   -webkit-animation: flickerAnimation 2s infinite;
   -moz-animation: flickerAnimation 2s infinite;
   -o-animation: flickerAnimation 2s infinite;
    animation: flickerAnimation 2s infinite;

}

.btn_gender_background_female{
     border: 1px solid #ef5eb9;
    background-image: linear-gradient(90deg,#f53373,#bf51e8);
    box-shadow: 0 20px 30px 0 rgba(76,5,45,.6);
  

}


.btn_gender_background_male{
     border: 1px solid #5bd8f0;
    background-image: linear-gradient(90deg,#33f5e0,#5172e8);
    box-shadow: 0 20px 30px 0 rgba(76,5,45,.6);
  

}

.text_between_gender{
	line-height: 300px;
	font-size: 22px;
	text-align: center;
}


.btn_gender:hover{
	width:205px;
	height:205px;
}



.food_selecion_container{

}

.food_selecion_container .btn1{
    
}



 


 @keyframes flickerAnimation {
  0%   { opacity:0.3; }
  50%  { opacity:0.1; }
  100% { opacity:0.3; }
}

@-o-keyframes flickerAnimation{
  0%   { opacity:0.3; }
  50%  { opacity:0.1; }
  100% { opacity:0.3; }
}
@-moz-keyframes flickerAnimation{
   0%   { opacity:0.3; }
  50%  { opacity:0.1; }
  100% { opacity:0.3; }
}
@-webkit-keyframes flickerAnimation{
 0%   { opacity:0.3; }
  50%  { opacity:0.1; }
  100% { opacity:0.3; }
}


.progress_bar{
	display: flex;
    justify-content: space-between;
    padding: 30px;
    min-height: 100px;
    background-color: #151226;
    border-radius: 59px;

}


.fl_progress_bar__indicator {
    padding: 0 40px;
    width: 100%;
}



.fl_progress_bar__indicator-inner {
    position: relative;
    display: flex;
    align-items: center;
    height: 100%;
}



.fl_progress_bar__line {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
    height: 2px;
    width: 100%;
    background-color: hsla(0,0%,100%,.3);
}


.fl_progress_bar__dots {
    position: relative;
    display: flex;
    justify-content: space-between;
    width: 100%;
}


 

.fl_progress_bar__dot--active {
    background-color: #91ef31!important;
    pointer-events: none!important;
    border: 3px solid #fff!important;
}

.fl_progress_bar__dot {
    position: relative;
    width: 14px;
    height: 14px;
    background: #151226;
    border: 2px solid #615665;
    border-radius: 50%;
    transition: all .35s ease;
}

.fl_progress_bar__dot:before {
    content: "";
    position: absolute;
    width: 30px;
    height: 30px;
    transform: translate(-50%,-50%);
}


.fl_progress_bar__dot--current_active span {
    opacity: 1!important;
}



.fl_progress_bar__dot span {
    position: absolute;
    width: 100px;
    text-align: center;
    opacity: 0;
    top: -24px;
    transform: translateX(-45%);
    color: hsla(0,0%,100%,.7);
    pointer-events: none;
    transition: all .35s ease;
}

.fl_progress_bar__dot {
    position: relative;
    width: 14px;
    height: 14px;
    background: #151226;
    border: 2px solid #615665;
    border-radius: 50%;
    transition: all .35s ease;
}

.fl_progress_bar__dot:hover {
    background-color: #615665;
}

.fl_progress_bar__dot:hover span {
    opacity: 1;
    color: hsla(0,0%,100%,.5);
}


.fl_progress_bar__line-inner {
    height: 100%;
    width: 0;
    background: #91ef31;
}

 
 .btn_back{
 	border: 1px solid #5c5a68;
 	padding: 12px 17px; 
 	color: #b8b7ba;
 	font-size: 16px;
 	border-radius:28px;
 }

 .btn_back:hover{
  	border: 1px solid #fff;
  	color: #fff;

 }

 .btn_back i{
 	font-size: 16px;
 }
 
 

.btn1 {
    cursor: pointer;
    border: 1px solid #fff;
    padding: 15px 20px;
    border-radius: 30px;
    width: 100%;
    display: block;
    margin: 20px 10px;
    color: #fff;
    font-size: 20px;
    font-weight: 300;
    background: #302e41;
  
}


.item_list {
    cursor: pointer;
    border: 1px solid #fff;
    padding: 15px 20px;
 
    width: 100%;
    display: block;
    margin: 5px 5px;
    color: #fff;
    font-size: 20px;
    font-weight: 300;
    background: #302e41;
  
}



.btn1:hover,.item_list:hover,.btn1_active {
    box-shadow: 0 20px 30px 0 rgba(13,38,102,.6);
    border-color: #5bd8f0;
    background-image: linear-gradient(90deg,#33f5e0,#5172e8);
    color: #fff;
 

}


.footer_container{
    background: #fff;
    color:#333;
}


.footer_container h4,.footer_container i{
    color: #676666;
}

.footer_container a{
    color: #333;
    font-size: 16px;
    line-height: 34px;
}


.footer_container a:hover{
    color: #000; 
}


.footer_social_icons{
    display: flex;
}

.footer_social_icons li{
    flex: 1;
 }


.infobar{
   
     padding: 15px 25px;
    border-radius: 30px;
    width: 100%;
    display: block;
    margin: 20px 10px;
    color: #fff;
    font-size: 18px;
    font-weight: 300;
    background: #151226;  
}


.form-control2{
    background: none;
    border: none;
    padding: 15px 20px;
    border-bottom: 1px solid #6e6a8a;
    width: 100%;
    color:#fff;
}


.form-control2 option{
    background:#201d34;
}

 .btn_continue {
    background-image: linear-gradient(90deg,#33f5e0,#5172e8)!important;
    padding: 12px 86px;
    border-radius: 44px;
    text-align: center;
    font-size: 26px;
    color: #fff;
    cursor: pointer;
    border: none;
    transition:all 1s;
}

 .btn_continue_large {
    background-image: linear-gradient(90deg,#33f5e0,#5172e8)!important;
     padding: 22px 340px;
    border-radius: 44px;
    text-align: center;
    font-size: 26px;
    color: #fff;
    cursor: pointer;
    border: none;
        transition:all 1s;

}


.btn_continue:hover,.btn_continue_large:hover {

    background-image: linear-gradient(90deg,#73b30c,#aaf137)!important;
}



.nav-link:hover{
    color: #fff!important;
}

/*
Hide Arrows From Input Number
*/

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}






.fl_progress_bar__percentage {
    position: absolute;
    top: -48px;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 45px;
    background-repeat: no-repeat;
    padding-top: 7px;
    background-position: 50% 1px;
    background-size: contain;
}

.fl_progress_bar__percent {
    color: #fff;
    display: flex;
    line-height: .7;
}

.fl_progress_bar__percent span:first-child {
    font-size: 26px;
}

.fl_progress_bar__percent span:last-child {
    font-size: 16px;
}


@media screen and (max-width:768px){
	.text_between_gender{
		line-height:normal;
	}


	.fl_home_body {
	   
	    background-size: 124% auto;
 	}


 	.page_title1 {
    	  	font-size: 35px;
	}

	.btn1{
		color: #fff;
    	font-size: 17px;
    	margin: 10px 10px;

	}


	.fl_step_2_bg {
    	   background-size: 105% 310px;
	}


	.inner_page .fl_progress_bar__indicator {
 
	    display: none;
	}

	.btn_gender_background{
		margin: 0px auto;
	}

	.btn_gender{
		    left: 13%;
	}



}