@font-face {
	font-family: ArFont1;
	src: url('fonts/GE_SS_Two_Medium.otf');
}

@font-face {
	font-family: ArFont2;
	src: url('fonts/GE_SS_Two_Medium.otf');
}

@font-face {
	font-family: ArFont3;
	src: url('fonts/Cairo-Bold.ttf');
}

body {
	direction: rtl;
	margin: 0px;
	padding: 0px;
	font-size: 15px;
	line-height: 25px;
	font-family: ArFont2;
	letter-spacing: 0.5px;
	text-align: right !important;
}

* {
	margin: 0px;
	padding: 0px;
}

/* =================================================== Menubar ======================================================= */
.menubar {
	background: #3b3b3c url('../../businesshome/ar/images/upper-menu-bar-bg.jpg');
	min-height: 62px;
}

	.menubar .navbar {
		padding-top: 1rem;
	}
	.menubar .social-part .fa {
		padding-right: 25px;
		color: #ffffff;
	}

.social-link {
	background-color: white;
	width: 33px;
	height: 33px;
	border-radius: 50%;
	padding-top: .33rem;
	margin-left: .6rem;
	margin-right: .6rem;
	margin-bottom: .5rem;
}

.logo {
	width:120px;
}

.shopping-cart{
	font-size:3rem;
	margin-right:1.5rem;
	color:#222;
}
	.shopping-cart span {
		font-size: 1rem;
		color: #222;
	}
	.shopping-cart a {
		text-decoration:none;
		color: #222;
	}
.custom-search-input {
	margin-right: 30px;
}

	.custom-search-input .search-query {
		width: 100%;
		border-radius: 0;
		border: transparent;
	}

	.custom-search-input button {
		border: 0;
		background: none;
		padding: 5px;
		margin-top: 2px;
		position: absolute;
		right: 0;
	}

.navbar-toggler-icon {
	background-image: url("images/nav-toggle-icon.png");
	width: 25px;
	height: 21px;
}
/*---Menubar End----*/

/*---Banner Start----*/
.banner {
	position: relative;
	border-top: 1px solid #EEEEEE;
	border-bottom: 3px solid #DDDDDD;
}

	.banner h2 {
		font-family: ArFont1;
		font-size: 4vw;
	}

	.banner .b-icon-heading {
		position: absolute;
		margin-top: -235px;
		float: right;
		right: 15px;
	}

		.banner .b-icon-heading h3 {
			color: #c2dfeb;
			font-family: ArFont1;
			font-size: 40px;
			font-weight: 600;
			margin-bottom: 20px;
		}
/*---Banner End----*/


/* ==================== Main Content ============================================ */
.section-title {
	color:black;
}
/* ==================== End of - Main Content ================================== */
/* =============================== Footer ============================= */
.footer {
	background-color: #EDEDED;
	/*background-image: url('../../../publicresources/images/Sidebar/footerbg.jpg');*/
	background-size: cover;
	background-repeat: no-repeat;
	padding: 0px 0px;
	margin: 0px;
}

	.footer h2 {
		margin: 0px;
		font-size: 0.95rem;
		color: #222222;
		font-family: ArFont1;
		letter-spacing: 1px;
		border-bottom: 2px solid #CCCCCC;
		padding-bottom: 12px;
	}

	.footer ul {
		margin: 15px 0px 0px;
	}

		.footer li {
			list-style-type: none;
			padding-bottom:.3rem;
			/*border-bottom:solid 1px #393330;*/
		}

			.footer li a {
				color: #222222;
				line-height: 32px;
				font-family:ArFont3;
			}

				.footer li a:hover {
					text-decoration: none;
					color: #E46401;
				}

	.footer .fa-angle-right {
		color: #2882bd;
		padding-right: 8px;
	}

	.footer .fa-square {
		color: #2882bd;
		padding-right: 8px;
		font-size: 10px;
	}

	.footer .f-para {
		color: #ffffff;
		margin: 0px;
	}

.copyright-bar {
	background-color: black;
	padding: 10px 0 20px;
}
	.copyright-bar .small-line {
		color: #949291;
		font-size: 0.8rem;
		padding: 0.8rem 0 0.5rem;
		text-align:center;
	}

.copyright-links {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}
	.copyright-links div {
		margin-right: 0.7rem;
		margin-left: 0.7rem;
		color: white;
		white-space: nowrap;
	}
	.copyright-links a {
		text-decoration: none;
		color: white;
		font-size: 0.7rem;
		white-space: nowrap;
	}
/* =============================== End of Footer ========================= */
/*---Media Query Start----*/


@media screen and (min-width:320px) and (max-width:480px) {
	.content-headline-strip .banner-d-btn {
		margin: 5px 0px;
		display: inline-block;
	}

	.content-headline-strip .banner-d-section-btn {
		padding: 0px 0px 30px;
		float: left;
	}

	.footer {
		padding: 40px 0px 60px;
	}

		.footer h2 {
			font-size: 16px;
			display: block;
			margin-top: 10px;
		}

	.banner h2 {
		font-family: ArFont1;
		font-size: 4vw;
	}

	.banner .b-icon-heading {
		display: none;
	}

	.content-headline-strip h2 {
		font-size: 18px;
	}

	.custom-search-input {
		margin-right: 0px;
		width: 100%;
		margin: 15px 0px;
	}

	.navbar-toggler {
		margin: 0px;
		padding: 0px;
	}
}

@media screen and (min-width:481px) and (max-width:767px) {
	.content-headline-strip .banner-d-btn {
		margin: 5px 0px;
		display: inline-block;
	}

	.content-headline-strip .banner-d-section-btn {
		float: left;
	}

	.content-headline-strip h2 {
		padding: 25px 0px 0px;
	}

	.footer h2 {
		font-size: 16px;
		display: block;
		margin-top: 10px;
	}

	.footer {
		padding: 40px 0px 60px;
	}

	.footer-bottom .footer-bottom-right {
		text-align: left;
	}

	.banner h2 {
		font-family: ArFont1;
		font-size: 4vw;
	}

	.banner .b-icon-heading {
		display: none;
	}

	.content-headline-strip h2 {
		font-size: 18px;
	}

	.custom-search-input {
		margin-right: 0px;
		width: 100%;
		margin: 15px 0px;
	}

	.navbar-toggler {
		margin: 0px;
		padding: 0px;
	}
}

@media screen and (min-width:768px) and (max-width:991px) {
	.banner h2 {
		font-family: ArFont1;
		font-size: 4vw;
	}

	.banner .b-icon-heading {
		margin-top: -200px;
	}

		.banner .b-icon-heading h3 {
			font-size: 35px;
			margin-bottom: 10px;
			text-shadow: 1px 1px 1px #000;
		}

	.navbar-toggler {
		margin: 0px;
		padding: 0px;
	}

	.custom-search-input {
		margin-right: 0px;
		width: 100%;
		margin: 15px 0px;
	}
}

@media screen and (min-width:992px) and (max-width:1199px) {
	.banner h2 {
		font-family: ArFont1;
		font-size: 4vw;
	}

	.banner .b-icon-heading {
		margin-top: -210px;
	}

		.banner .b-icon-heading h3 {
			font-size: 40px;
			margin-bottom: 10px;
			text-shadow: 1px 1px 1px #000;
		}
}

/* ====================== Slider ==================================== */
.swiper-slide {
	background-position: center;
	width: 420px;
	height: 430px;
	margin: 10px 0;
	border: 1px solid gray;
}

	.swiper-slide .ImageBox {
		display: inline-block;
		width: 418px;
		height: 388px;
		overflow: hidden;
		vertical-align: middle;
	}

		.swiper-slide .ImageBox img {
			width: 100%;
			height: 400px;
		}

	.swiper-slide .SliderDescription {
		cursor: pointer;
		width: 100%;
	}

		.swiper-slide .SliderDescription h3 {
			text-align: right;
			color: white;
			padding: 10px;
			font-size: 12pt;
			background: #555555;
			border: 1px solid #555555;
		}
/* ====================== End of Slider ================================ */

.search-bar {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	min-height:3.5rem;
	padding-top:0.8rem;
}

	.search-bar i {
		font-size:1.1rem;
		color:black !important;
	}
	.search-bar .search-box {
		font-family: Tahoma;
		border: 1px solid #999999;
		font-size:0.9rem;
		padding-top: 0.2rem;
		width: 100%;
		border-radius: 2rem 2rem 2rem 2rem !important;
		height: 2.6rem;
	}
/* ========================== Main Wrapper and Side Bar ================================ */

.main-content {
	color: white;
	padding-bottom: 60px;
	min-width: 100vw;
}

#sidebar-logo {
	width: 14rem;
	margin-top: 60px;
	border-top: 3px solid #4b4946;
	border-bottom: 3px solid #4b4946;
	padding-top: 20px;
	padding-bottom: 20px;
}

.list-group {
	color: white;
	margin-top: 60px;
}

#sidebar-wrapper {
	min-height: 100vh;
	margin-right: -15rem;
	-webkit-transition: margin .25s ease-out;
	-moz-transition: margin .25s ease-out;
	-o-transition: margin .25s ease-out;
	transition: margin .25s ease-out;
}

	#sidebar-wrapper .list-group {
		width: 15rem;
	}
	#sidebar-wrapper .list-group-item {
		margin-right: 20px;
		border: 0 !important;
	}
		#sidebar-wrapper .list-group-item a {
			color: #555555;
			text-decoration:none;			
		}
			#sidebar-wrapper .list-group-item a:hover {
				color: black;
			}


@media (min-width: 768px) {
	.main-content {
		min-width: 0;
		width: 100%;
	}

	#sidebar-wrapper {
		margin-right: 0;
	}
}

@media (min-width: 1500px) {
	.main-content {
		padding-left: 120px;
		padding-right: 40px;
	}

	#sidebar-wrapper {
		padding-right: 120px;
	}
}

.image-boxes-with-text img {
	width: 96%;
}

.image-boxes-with-text h3 {
	width: 96%;
	font-family: ArFont3;
	color: gray;
	font-size: .9rem;
	padding-top: 1rem;
}

.image-boxes-with-text p {
	width: 96%;
	color: white;
	font-size: 0.8rem;
}

/**************** MultiLevelMenu *************************/
.MultiLevelMenu {
	list-style-type: none;
	border-radius: 2px;
	color: #FFFFFF;
	cursor: pointer;
	float: right;
	font-family: Tahoma;
	font-size: 11px;
	font-weight: bold;
	min-height: 30px;
	margin: 0;
	padding: 0;
	position: relative;
	text-decoration: none;
	/*width: 100%;*/
}

	.MultiLevelMenu a {
		text-decoration: none;
		color: #999999;
		font-family: ArFont2;
		font-size: 10pt;
	}

	.MultiLevelMenu ul {
		list-style: none;
		padding: 0;
		margin: 0;
		float: right;
		position: absolute;
		right: 0px; /* set to left on en style*/
		top: 100%;
		display: none;
	}

	.MultiLevelMenu li {
		list-style: none;
		padding: 5px 10px 5px 5px;
		float: right;
		display: inline-block;
		position: relative;
		min-width: 100px;
		cursor: pointer;
		white-space: nowrap;
		color: #999999;
		font-family: ArFont2;
		font-size: 10pt;
	}

		.MultiLevelMenu li:hover {
			/*background: #444444;*/
			color: white;
			font-family: ArFont2;
			font-size: 10pt;
		}

	.MultiLevelMenu ul ul {
		right: 100%; /* set to left on en style*/
		top: 0;
	}

	.MultiLevelMenu li:hover > ul {
		display: block;
		color: white;
		background: #444444;
	}

	.MultiLevelMenu li ul li:hover {
		background: #000;
		color: white;
	}
/**************** MultiLevelMenu End **********************/