﻿/*
Theme Name: ondiet_2025theme
Description: ondiet_2025theme
Version: 1.5
Author: Mr.Soleimani
Author URI: m.soleimanimajd@gmail.com
@mrz_majd
*/


@font-face {
	font-family: bkoodak;
	font-style: normal;
	font-weight: 900;
	src: url('../nikitech/assets/font/farsi/BKoodakBold.eot?#') format('eot'),  /* IE6–8 */
		 url('../nikitech/assets/font/farsi/BKoodakBold.woff') format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
		 url('../nikitech/assets/font/farsi/BKoodakBold.ttf') format('truetype');  /* Saf3—5, Chrome4+, FF3.5, Opera 10+ */
  }
  
  
  /********** =Reset CSS **********/
  html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	  margin: 0;
	  padding: 0;
	  border: 0;
	  outline: 0;
	  font-size: 100%;
	  vertical-align: baseline;
	  background: transparent;
  }

@font-face {
	font-family: IRANSans;
	font-style: normal;
	font-weight: 900;
	src: url('../ondiet/assets/font/iransans/eot/IRANSansWeb(FaNum)_Black.eot');
	src: url('../ondiet/assets/font/iransans/eot/IRANSansWeb(FaNum)_Black.eot?#iefix') format('embedded-opentype'),  /* IE6-8 */
		 url('../ondiet/assets/font/iransans/woff2/IRANSansWeb(FaNum)_Black.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
		 url('../ondiet/assets/font/iransans/woff/IRANSansWeb(FaNum)_Black.woff') format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
		 url('../ondiet/assets/font/iransans/ttf/IRANSansWeb(FaNum)_Black.ttf') format('truetype');
}
@font-face {
	font-family: IRANSans;
	font-style: normal;
	font-weight: bold;
	src: url('../ondiet/assets/font/iransans/eot/IRANSansWeb(FaNum)_Bold.eot');
	src: url('../ondiet/assets/font/iransans/eot/IRANSansWeb(FaNum)_Bold.eot?#iefix') format('embedded-opentype'),  /* IE6-8 */
		 url('../ondiet/assets/font/iransans/woff2/IRANSansWeb(FaNum)_Bold.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
		 url('../ondiet/assets/font/iransans/woff/IRANSansWeb(FaNum)_Bold.woff') format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
		 url('../ondiet/assets/font/iransans/ttf/IRANSansWeb(FaNum)_Bold.ttf') format('truetype');
}
@font-face {
	font-family: IRANSans;
	font-style: normal;
	font-weight: 500;
	src: url('../ondiet/assets/font/iransans/eot/IRANSansWeb(FaNum)_Medium.eot');
	src: url('../ondiet/assets/font/iransans/eot/IRANSansWeb(FaNum)_Medium.eot?#iefix') format('embedded-opentype'),  /* IE6-8 */
		 url('../ondiet/assets/font/iransans/woff2/IRANSansWeb(FaNum)_Medium.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
		 url('../ondiet/assets/font/iransans/woff/IRANSansWeb(FaNum)_Medium.woff') format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
		 url('../ondiet/assets/font/iransans/ttf/IRANSansWeb(FaNum)_Medium.ttf') format('truetype');
}
@font-face {
	font-family: IRANSans;
	font-style: normal;
	font-weight: 300;
	src: url('../ondiet/assets/font/iransans/eot/IRANSansWeb(FaNum)_Medium.eot');
	src: url('../ondiet/assets/font/iransans/eot/IRANSansWeb(FaNum)_Medium.eot?#iefix') format('embedded-opentype'),  /* IE6-8 */
		 url('../ondiet/assets/font/iransans/woff2/IRANSansWeb(FaNum)_Medium.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
		 url('../ondiet/assets/font/iransans/woff/IRANSansWeb(FaNum)_Medium.woff') format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
		 url('../ondiet/assets/font/iransans/ttf/IRANSansWeb(FaNum)_Medium.ttf') format('truetype');
}
@font-face {
	font-family: IRANSans;
	font-style: normal;
	font-weight: 200;
	src: url('../ondiet/assets/font/iransans/eot/IRANSansWeb(FaNum)_Medium.eot');
	src: url('../ondiet/assets/font/iransans/eot/IRANSansWeb(FaNum)_Medium.eot?#iefix') format('embedded-opentype'),  /* IE6-8 */
		 url('../ondiet/assets/font/iransans/woff2/IRANSansWeb(FaNum)_Medium.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
		 url('../ondiet/assets/font/iransans/woff/IRANSansWeb(FaNum)_Medium.woff') format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
		 url('../ondiet/assets/font/iransans/ttf/IRANSansWeb(FaNum)_Medium.ttf') format('truetype');
}
@font-face {
	font-family: IRANSans;
	font-style: normal;
	font-weight: normal;
	src: url('../ondiet/assets/font/iransans/eot/IRANSansWeb(FaNum)_Medium.eot');
	src: url('../ondiet/assets/font/iransans/eot/IRANSansWeb(FaNum)_Medium.eot?#iefix') format('embedded-opentype'),  /* IE6-8 */
		 url('../ondiet/assets/font/iransans/woff2/IRANSansWeb(FaNum)_Medium.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
		 url('../ondiet/assets/font/iransans/woff/IRANSansWeb(FaNum)_Medium.woff') format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
		 url('../ondiet/assets/font/iransans/ttf/IRANSansWeb(FaNum)_Medium.ttf') format('truetype');
}

:root {
    --blue-color: rgba(4, 45, 99, 255);
	--lightblue-color: rgba(18, 130, 178, 255);
	--afra-second-green-color: rgba(188,214,45,1);
    --burnt-sienna-color: rgba(226, 135, 67, 1);
	--burnt-sienna-color2: rgba(218, 247, 166, 1);
    --afra-gray-color: rgba(102, 102, 102, 1);
    --afra-darkgray-color: rgba(87, 87, 87, 1);
}

h4 {
	font-size: 1.3rem;
}
h5, h6, p {
	line-height: 1.8;
}

main p {
	line-height: 2.3;
}

body {
	direction: rtl;
	font-family: IRANSans;

}

p {
	font-family: IRANSans;
	font-weight: normal;
}

a {
    text-decoration: none;
    color: #494949;
}

a:hover {
    text-decoration: none;
    color: var(--lightblue-color);
}

main a {
    text-decoration: none;
    color: var(--lightblue-color);
}

main a:hover {
    text-decoration: none;
    color: var(--afra-green-color);
}

main ul {
	line-height: 1.8;
	list-style: square;
}

small {
	font-family: IRANSans;
	font-weight: 500;
}

*::selection {
    background-color: gray;
    color: var(--blue-color);
}

.body {
	background-color: #f4f4f4;
    background-repeat: no-repeat;
    background-attachment: fixed;
	background-size: cover;	
}

body.page-id-299 {
    background-color: white;
}
.bg-afra-green {
	background-color: var(--afra-green-color);
}

.bg-afra-light-green {
	background-color: var(--lightblue-color)
}

.bg-afra-second-green {
	background-color: var(--afra-second-green-color);
}

.bg-afra-light-gray {
	background-color: var(---burnt-sienna-color);
}

.text-afra-green {
	color: var(--afra-green-color);
}

.text-afra-lightgreen {
	color: var(--lightblue-color)
}

.text-afra-second-green {
	color: var(--afra-second-green-color);
}

.afra-shadow {
    box-shadow: 0px 2px 4px 0 #d1d1d1;
}

.afra-shadow2 {
    box-shadow: inset 0px -1px 2px 0 #d1d1d1;
}

.btn-afra {
	background-color: var(--blue-color);
	color: rgba(226,135,67,1);
}

.btn-afra:hover {
	background-color: var(--lightblue-color);
	color: white;
}

.btn-afra:active, .btn-afra:focus, .btn-afra2:active, .btn-afra2:focus {
	box-shadow: none;
}

.btn-afra a {
	color: whitesmoke;
}

.btn-afra2 {
	background-color: var(--lightblue-color);
	color: whitesmoke;
}

.btn-afra2:hover {
	background-color: var(--lightblue-color);
	color: black;
}

.btn-afra2 a {
	color: whitesmoke;
}

.badge-afra {
	font-weight: normal;
	background-color: var(--lightblue-color);
	color: white;
}

.row-icon {
    width: 100%;
    max-height: 80px;
    text-align: center;
}

.row-icon img {
    /* width: auto; */
    height: 100%;
    margin-top: -27px;
}

.section-item img{
    min-width: 80px;
    max-width: 15%;
    height: auto;
    align-content: center;
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
    transform: scale(1);
    transition: transform .5s;
    -webkit-transition-delay: .1s;
    transition-delay: .1s; 
}

.section-item:hover img {
    filter: none;
    -webkit-filter: grayscale(0%);
    transform: scale(1.05);
    transition: transform .5s;
    -webkit-transition-delay: .1s;
    transition-delay: .1s; 
}

.lastarticle-thumbnail {
    width: 100%;
    min-height: 250px;
}

.prev-next-article-thumbnail {
    width: 100%;
    min-height: 75px;
}

.projects-thumbnail {
    width: auto;
	height: 200px;
	max-width: 100%;
}

.owl-carousel .owl-stage{display: flex;}
.item {
    display: flex;
    flex: 1 0 auto;
    height: 100%;
}

/* Shine */

.articles-carousel figure {
	overflow: hidden;
}

.articles-carousel figure {
	position: relative;
}
.articles-carousel figure::before {
	position: absolute;
	top: 0;
	left: -75%;
	z-index: 2;
	display: block;
	content: '';
	width: 50%;
	height: 100%;
	background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);
	background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);
	-webkit-transform: skewX(-25deg);
	transform: skewX(-25deg);
}

.articles-carousel figure:hover::before {
	-webkit-animation: shine .75s;
	animation: shine .75s;
}
@-webkit-keyframes shine {
	100% {
		left: 125%;
	}
}
@keyframes shine {
	100% {
		left: 125%;
	}
}

.profile-thumbnail {
    max-width: 130px;
    max-height: 130px;
	box-shadow: 0 0 0 3px #bbb ;
	transform: scale(1);
	transition: transform .5s;
	animation:bounceOut-out .5s linear;
}

.profile-thumbnail:hover {
    animation:bounceOut-in .5s linear;
    cursor: pointer;
    -webkit-filter: none;
	filter: none;
	transform: scale(1.07);
	transition: transform .5s;
	box-shadow: 0 0 0 3px var(--afra-green-color);
}

@keyframes bounceOut-in {
    0%{ box-shadow: 0 0 0 3px var(--afra-green-color); filter: grayscale(100%); -webkit-filter: grayscale(100%);}
    25%{ box-shadow: 0 0 0 1px var(--afra-green-color); filter: grayscale(75%); -webkit-filter: grayscale(75%);}
    50%{ box-shadow: 0 0 0 6px var(--afra-green-color); filter: grayscale(50%); -webkit-filter: grayscale(50%);}
    75%{ box-shadow: 0 0 0 3px var(--afra-green-color); filter: grayscale(25%); -webkit-filter: grayscale(25%);}
    100%{ box-shadow: 0 0 0 4px #bbb; filter: none; -webkit-filter: none;}
}

@keyframes bounceOut-out {
    0%{ filter: none; -webkit-filter: none;}
    25%{ filter: grayscale(25%); -webkit-filter: grayscale(25%);}
    50%{ filter: grayscale(55%); -webkit-filter: grayscale(50%);}
    75%{ filter: grayscale(75%); -webkit-filter: grayscale(75%);}
    100%{ filter: grayscale(100%); -webkit-filter: grayscale(100%);}
}

.profile-thumbnail2 {
    max-width: 130px;
    max-height: 130px;
	box-shadow: 0 0 0 3px #bbb ;
    -webkit-filter: none;
	filter: none;
	box-shadow: 0 0 0 3px #bbb ;
}



/* Footer */

footer a.text-secondary:hover {
    color: var(--afra-green-color)!important
}

footer span {
    font-size: .8rem;
}

footer ul {
	font-size: .8rem;
	list-style: none;
}

input.form-control:focus {
    border-color: var(--afra-green-color);
    box-shadow: 0 1px 1px rgba(161, 136, 136, 0.075) inset, 0 0 8px rgba(126, 239, 104, 0.6);
    outline: 0 none;
}

.social-icon {
    font-size: 2rem;
}

/* Main Menu */

.nav-item {
	line-height: 60px;
	font-weight: bold;	
}

.nav-item:hover {
	box-shadow: inset 0 -3px var(--blue-color);
}

.afra-cheveron-down {
	vertical-align: middle;
	margin-right: 3px;
}

.topnav-centered a {
	float: none;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}


.navbar {
	align-items:center;
	/* transition: top .5s;
	-webkit-transition: top .5s;
	-moz-transition: top .5s; */
}

.navbar-nav {
	align-self:stretch;
	display:flex;
	align-items:center;
}

.has-submenu:hover .sub-menu {
	display: block;
}

.menu {
	display: none;
	line-height: initial;
	position: absolute;
	top: auto;
	animation-name: fade2In;
	animation-duration: .2s;
	z-index: 5;
}

@keyframes fade2In {
    0% {
        top:130%;
    } 
    100% {
        top: 100%;
    }
}

.menu li {
	list-style: none;
	font-weight: normal;
	padding: .3rem 0;
}

.menu li::before {
    content: "\2022";
	color: var(--afra-second-green-color);
	font-size: 1.3rem;
	font-weight: bold;
    display: inline-block;
	width: 1em;
	vertical-align: sub;
}

.has-megamenu:hover .mega-menu {
	display: block;
}

.mega-menu {
	background: rgba(76, 175, 80, 0);
	right: 0;
	left: 0;
}

.mega-menu .card-body:hover img {
	-moz-animation: spinHorizontal .8s linear;
    -o-animation: spinHorizontal .8s linear;    
    -webkit-animation: spinHorizontal .8s  linear;
    animation: spinHorizontal .8s linear;
}

@keyframes spinHorizontal {
    0% { transform: rotateY(0deg); }
    100% { transform: rotateY(360deg); }
}

.mega-menu li {
	list-style: none;
	font-weight: normal;
	padding: .3rem 0;
}

.mega-menu li::before{
    content: "\2022";
	color: var(--afra-second-green-color);
	font-size: 1.3rem;
	font-weight: bold;
    display: inline-block;
	width: 1em;
	vertical-align: sub;
}

#navbarMobileMenu {
	width: -webkit-fill-available;
}

#navbarMobileMenu li {
	list-style: none;
	font-weight: normal;
	padding: .2rem 0;
}

.icon-set {
	list-style: none;
	display: contents;	
}

.icon-set li {
	display: inline-block;
	padding: .2rem;
}

.jumbotron p, .accordion p {
	margin: 0;
}

.page-item.active .page-link {
	background-color: var(--afra-green-color);
	border-color: var(--lightblue-color);
}

.page-link {
	color: var(--lightblue-color);
}

.page-link:hover {
	color: var(--afra-green-color);
}

.page-link:focus {
    box-shadow: 0 1px 1px rgba(161, 136, 136, 0.075) inset, 0 0 4px rgba(126, 239, 104, 0.6);
}

.pinned {
	background-color: rgba(147, 147, 147, .6);
	font-size: 2rem;
	top: 70%;
	left: 0;
	z-index: 10;
}

.pinned a {
	color: white;
}

.pinned a:hover {
	color: var(--afra-green-color);
}

.pinned ul {
	list-style: none;
}

#breadcrumbs {
	padding: 0;
	margin: 0;
	list-style: none;
	display: inline-flex;
}

#breadcrumbs li {
	margin-right: .2rem;
}

#notificationIconWrapper {
	font-size: 2rem;
}

/* ********************* */
/* *** Gravity Forms *** */
/* ********************* */

.gfield_checkbox li {
    height: 30px;
}

.gfield_checkbox li label {
    padding-right: 20px!important;
}

.gfield_checkbox li input[type="checkbox"] {
    opacity:0;
}

.gfield_checkbox label:after{
    content: "";
    background-color: #c0c0c0;
    width:20px;
	height:20px;
	display:block;
	top:0;
	right:0;
	border-radius:3px;
	position: absolute;
	z-index: 0;
}

.gfield_checkbox label:before{
    content:"";
	display:block;
    position: absolute;
    width:20px;
	height:20px;
    border: solid var(--afra-green-color);
	top:0;
	right:0;
	background: var(--afra-green-color);
	z-index: 1;
	opacity: 0;
	border-radius:3px;
}

.gfield_checkbox input[type="checkbox"] {
	opacity:5;
	outline:none;
	z-index:100;
	width:20;
	height:20px;
	top:0;
	right:0;
	position: absolute;
	appearance: none;
	cursor: pointer;
}

.gfield_checkbox input[type="checkbox"]:checked +label:before {
    opacity:1;
	top: 0px;
}

.ginput_container_fileupload {
    position: relative;
    /* height: 50px;
    width: 50%; */
    /* border: 1px solid #c0c0c0; */
}

.ginput_container_fileupload input[type="file"]{
    opacity:1;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 99;
    /* height: 50px; */
    margin: 0;
    margin-top:0!important;
    padding: 0;
    display: block;
    cursor: pointer;
    width: 100%!important;
}

.ginput_container_fileupload input[type="file"]:focus {
    outline: none;
}

.ginput_container_fileupload input[type="file"]:after{
    content: attr(data-filetitle);
    position: absolute;
    top: 0;
    right: 0;
    background: #fff;
    color: #aaa9a9;
    display: block;
    width: calc(100% - 80px);
    z-index: 20;
    height: 47px;
    padding: 5px 10px 5px 10px;
    cursor: pointer;
    direction: ltr;
    text-align: left;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    font-size: 14px;
}

.ginput_container_fileupload input[type="file"]:before{
    content: 'بارگذاری';
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    height: 48px;
    background: var(--afra-green-color);
    color: #fff;
    text-align: center;
    z-index: 25;
    /* padding: 5px 10px 5px 10px; */
    width:80px;
    cursor: pointer;
    padding-top: 5px;
}


.banner-highlight-block {
	margin-top: 1.2rem;
	margin-bottom: 1.2rem;
	padding: 1.2rem;
	border-right: 5px solid var(--afra-green-color);
	background-color: var(--burnt-sienna-color2);
}

.banner-highlight-block p {
	margin: 0;
}

.afra-download {
	padding: 1.2rem;
	border-right: 5px solid var(--afra-green-color);
	background-color: var(--burnt-sienna-color);
}

@media (min-width: 768px) {
	.body {
		margin-top: 76px;
	}
	.border-md-left-none {
		border-left: none !important; }
	.border-md-right-none {
		border-right: none !important; }
	.border-md-top-block {
		border-top: 1px solid #dee2e6!important; }
	.border-md-bottom-block {
		border-bottom: 1px solid #dee2e6!important }
	.profile-thumbnail {
		-webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
		filter: grayscale(100%);	
	}	
	.projects-thumbnail {
		width: auto;
		height: 200px;
	}	
}

@media print {
	.col-md-8 {
		flex: 0 0 100%;
		max-width: 100%;
	}
	.comment-respond {
		display: none;
	}
}

footer a {
	color: #494949;
}

footer a:hover {
	color: var(--burnt-sienna-color);
}



:root {
	--dark-blue-master-color:rgba(1, 58, 84, 1);
	--dark-blue-second-color:rgba(2, 80, 115, 1);
	--shine-green-master-color: rgb(104, 61, 183);
	--shine-green-second-color: rgb(170, 56, 71);
}

a.btn-shine-green {
	color: white;
	background-color: var(--shine-green-master-color);
}

a.btn-shine-green:hover {
	color: white;
	background-color: var(--shine-green-second-color);
}




  .con img {
	width: 100%;
	height: auto;
  }
  
  .con .btn {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	background-color: #555;
	color: white;
	font-size: 16px;
	padding: 12px 24px;
	border: none;
	cursor: pointer;
	border-radius: 5px;
	text-align: center;
  }
  
  .con .btn:hover {
	background-color: black;
  }

  span.standard-img {
	font-size: 6rem;
}


  .radius {
	 border-radius: 25px;
 }





 .hoverbtn{
	cursor:pointer;
		position:relative;
		padding:10px 20px;
		background:white;
		font-size:15px;
		border-top-right-radius:10px;
		border-bottom-left-radius:10px;
		transition:all 1s;
		&:after,&:before{
			content:" ";
			width:10px;
			height:10px;
			position:absolute;
			border :0px solid #fff;
			transition:all 1s;
			}
		&:after{
			top:-1px;
			left:-1px;
			border-top:5px solid black;
			border-left:5px solid black;
		}
		&:before{
			bottom:-1px;
			right:-1px;
			border-bottom:5px solid black;
			border-right:5px solid black;
		}
		&:hover{
			border-top-right-radius:0px;
		border-bottom-left-radius:0px;
			 background:whitesmoke;
			 color:white;
			&:before,&:after{
				width:100%;
				height:100%;
				 border-color:white;
			}
		}
	}
	.data-hover{
		background:#ffebee;
		height:100vh;
		display:flex;
		justify-content:center;
		align-items:center;
	}







	.slideshow-container {
		max-width: 1400px;
		position: relative;
		margin: 16px  auto;
	  }
	  
	  .mySlides {
		display: none;
	  }
	  
	  .prev, .next {
		cursor: pointer;
		position: absolute;
		top: 50%;
		width: auto;
		margin-top: -22px;
		padding: 16px;
		color: red;
		font-weight: bold;
		font-size: 18px;
		transition: 0.6s ease;
		border-radius: 0 3px 3px 0;
		user-select: none;
	  }
	  
	  .next {
		left: 0;
		color: white;
		border-radius: 3px 0 0 3px;
	  }

	  .prev {
		right: 0;
		color: red;
		border-radius: 3px 0 0 3px;
	  }

	  .prev:hover, .next:hover {
		color: blue;
	}
	  
	  .text {
		color: #f2f2f2;
		font-size: 15px;
		padding: 8px 12px;
		position: absolute;
		bottom: 8px;
		width: 100%;
		text-align: center;
	  }
	  
	  .dot {
		cursor: pointer;
		height: 10px;
		width: 10px;
		margin: 0 2px;
		background-color: #bbb;
		border-radius: 50%;
		display: inline-block;
		transition: background-color 0.6s ease;
	  }
	  
	  .dot.active, .dot:hover {
		background-color: #717171;
	  }
	  
	  .fade {
		animation-name: fade;
		animation-duration: 5s;
	  }
	  
	  @keyframes fade {
		from {opacity: .4}
		to {opacity: 1}
	  }










	

	
	  /* body {
		font-family: Arial, sans-serif;
		background-color: #f4f4f4;
		margin: 0;
		padding: 0;
		display: flex;
		justify-content: center;
		align-items: center;
		height: 100vh;
	} */
	
	.container-ruller {
		max-width: 400px;
		margin: 50px auto;
		padding: 20px;
		background-color: #fff;
		border-radius: 8px;
		box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
		text-align: right;
	}
	
	h4 {
		text-align: center;
		color: #333;
	}
	
	form {
		display: flex;
		flex-direction: column;
	}
	
	label {
		margin-bottom: 5px;
		font-weight: bold;
	}
	
	input, select {
		margin-bottom: 15px;
		padding: 10px;
		border: 1px solid #ccc;
		border-radius: 4px;
		text-align: right;
	}
	
	button {
		padding: 10px;
		background-color: #28a745;
		color: #fff;
		border: none;
		border-radius: 4px;
		cursor: pointer;
	}
	
	button:hover {
		background-color: #218838;
	}
	
	#result {
		margin-top: 20px;
		font-size: 18px;
		text-align: right;
	}
	
	#result p {
		margin: 10px 0;
	}
	
	#result a {
		color: #28a745;
		text-decoration: none;
	}
	
	#result a:hover {
		text-decoration: underline;
	}














/* 
	body {
		font-family: Arial, sans-serif;
		background-color: #f4f4f4;
		color: #333;
		direction: rtl;
		text-align: right;
	} */
	
	.container-bmr {
		max-width: 600px;
		margin: 50px auto;
		padding: 20px;
		background-color: #fff;
		border-radius: 8px;
		box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
		text-align: right;
	}
	
	h1 {
		text-align: center;
		color: #444;
	}
	
	form {
		display: flex;
		flex-direction: column;
	}
	
	label {
		margin-bottom: 5px;
		font-weight: bold;
	}
	
	input, select {
		margin-bottom: 15px;
		padding: 10px;
		border: 1px solid #ccc;
		border-radius: 4px;
	}
	
	button {
		padding: 10px;
		border: none;
		border-radius: 4px;
		cursor: pointer;
		margin-bottom: 10px;
	}
	
	button[type="submit"] {
		background-color: #28a745;
		color: #fff;
	}
	
	button[type="submit"]:hover {
		background-color: #218838;
	}
	
	button#resetButton {
		background-color: #dc3545;
		color: #fff;
	}
	
	button#resetButton:hover {
		background-color: #c82333;
	}
	
	.result, .recommendation {
		margin-top: 20px;
		padding: 15px;
		background-color: #e9ecef;
		border-radius: 4px;
	}
	
	.contact {
		margin-top: 30px;
		text-align: center;
	}
	
	.contact a {
		color: #007bff;
		text-decoration: none;
	}
	
	.contact a:hover {
		text-decoration: underline;
	}




	/* body {
		font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
		background-color: #f4f4f4;
		display: flex;
		justify-content: center;
		align-items: center;
		height: 100vh;
		margin: 0;
	} */
	
	/* .container-tyde {
		text-align: center;
	}
	
	h1 {
		font-size: 2.5rem;
		color: #333;
	}
	
	#typed-text {
		font-size: 1.5rem;
		color: #555;
		margin-top: 20px;
		white-space: pre-wrap; 

	} */



