@viewport {
    width: device-width ;
    zoom: 1.0 ;
}

:root
{
    --color1: #040301; 
    --color2: #141C0D;
    --color3: #FC9B0C;
    --color4: #FAFA23; /* FDD110 */
    --color5: #817C5E;
    --color6: #FFFFFF;
}

body
{
	direction:rtl;
	margin: 0;
    font-family: Vazir,Tahoma;
    font-size: 10px;
	background: var(--color1);
    color: var(--color1);
    height: 100%;
}

input
{
	font-family: Vazir;
	border-radius: 5px;
	padding: 10px;
	border: 2px solid var(--color1);
	background-color: var(--color4);
	width: 95%;
}

button
{
	font-family: Vazir;
    font-weight:bold;
    width:auto;
    cursor: pointer; 
	border-radius: 5px;	
	border: 2px solid var(--color1);
	background-color: var(--color3);
	color: #040301;
}

.main
{
    height: 100%;
    display: flex;
    flex-direction: column;
}

.main_header
{
    background-color: var(--color2);
    color: var(--color4);
    text-align: center;
    width: 100%;
    font-size: 20px;
    height: 60px;
}

.main_header a
{
    color: var(--color4);
}

.main_header a:hover
{
    color: var(--color4);
}

.main_middle
{
    flex: 1;
    overflow: auto;
}

.main_footer
{
    background-color: var(--color2);
    color: var(--color4);
    text-align: center;
    width: 100%;
    font-size: 10px;
    height: 60px;
}

.main_footer a
{
    color: var(--color4);
    text-decoration: none;
}

.main_footer a:hover
{
    color: var(--color4);
    text-decoration: none;
}

.menu_links
{
    text-align:center;
    color: var(--color4);
    padding-top: 10px;
	display: flex;
    justify-content: space-between;
	
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 20px;
	padding-right: 20px;
}

.menu_links a
{
    color: var(--color4);
}

.menu_links a:hover
{
    color: var(--color3);
}

.menu_links_link
{
	justify-content:center;
	display:inline-block;
	float: left;
	width: 33.33%;
    text-align: center;
}

.home_buttons
{
    border-radius: 25px;
    background-color: var(--color4);
    font-size: 15px;
    color: var(--color1);
    padding: 20px;
    margin: 10px;
    text-align: center;
}

.home_buttons a
{
	color: var(--color1);
	text-decoration:none;
}

.home_buttons a:hover
{
	color: var(--color1);
	text-decoration:none;
}

.home_status
{
    border-radius: 25px;
    background-color:#fafa23;
    font-size: 15px;
    color:#000000;
    padding: 20px;
    margin: 10px;
}

.home_warning
{
    border-radius: 25px;
    background-color:#ff9800;
    font-size: 15px;
    color:#FFFFFF;
    padding: 20px;
    margin: 10px;
    text-align: center;
}

.help_message
{
    border-radius: 25px;
    background-color:#fafa23;
    font-size: 12px;
    color:#000000;
    border: 4px solid #1c8d9b;
    padding: 20px;
    margin: 10px;

}

.programs_workouts_list_items
{
    border-radius: 25px;
    background-color: var(--color3);
    font-size: 12px;
    color: var(--color1);
    border: 2px solid var(--color4);
    padding: 10px;
    margin: 10px;
}

.programs_workouts_list_items_super
{
	border-radius: 25px;
    background-color: var(--color4);
    font-size: 12px;
    color: var(--color1);
    border: 2px solid var(--color3);
    padding: 10px;
    margin: 10px;
}

.programs_workouts_list_items_workout_title
{
    display: inline-block;
    width: 100%;
    text-align: right;
    font-weight: bolder;
    font-size: 14px;
}

.programs_workouts_list_items_category_title
{
    display: inline-block;
    width: 100%;
    text-align: right;
    font-size: 13px;
}

.programs_navigator
{
	background: var(--color2);
	color: var(--color4);
	
}
.programs_navigator a
{
	text-decoration:none;
	color: var(--color4);
}

.programs_navigator a:hover
{
	text-decoration:none;
	color: var(--color4);
}