
/*------------------------------------ General ------------------------------------*/
*
{
	box-sizing:border-box;
}
html
{
	direction:ltr;
}
body
{
	margin:0;
	background:#fff;
	font:400 13px 'Tajawal','Gilroy';
	color:#000;
}
a:link
{
	text-decoration:none;
	transition:all 0.2s;
}
a:link,a:visited,a:active
{
	color:#000;
}
a:hover,a:focus
{}
h1
{
	font:400 18px 'Tajawal','Gilroy';
	margin:0 0 5px 0;
	display:inline-block;
}
h2
{
	font:400 14px 'Tajawal','Gilroy';
	margin:0;
}
hr
{
	height:1px;
	border:none;
	background:#392e24;
	color:#392e24;
}
img
{
	max-width:100%;
	height:auto;
}
img.border
{
	border:1px solid #ccc;
}
div.boxed
{
	max-width:800px;
	position:relative;
	margin:auto;
	background:#fff;
}
div.divright,div.divleft
{}
div.divhidden
{
	display:none;
}
div.clearfix
{
	content:"";
	clear:both;
	display:table;
}
video
{
	width:100%;
	height:auto;
}
@media only screen and (min-width:768px)
{
	div.divright	{ float:right; }
	div.divleft		{ float:left; }
	div.divhidden	{ display:block; }
}
/*------------------------------------ Header ------------------------------------*/
div.header
{
	display:none;
	padding:10px 0 5px 0;
	position:relative;
}
div.language
{
	float:right;
	text-align:right;
	margin:5px 10px 0 0;
}
div.language a
{
	display:inline-block;
	line-height:1;
	padding:0 7px 0 3px;
}
div.language a:hover
{
	text-decoration:underline;
}
div.language a:not(:last-child)
{
	border-right:1px solid #ccc;
}
div.minimenulink
{
	float:left;
	margin:0 0 0 10px;
	font:900 18px 'FontAwesome';
	padding:6px 10px;
	display:block;
	cursor:pointer;
	display:none;
}
div.minimenulink:hover
{
	color:#fff;
	background:#666;
}
div.minimenulink::after
{
	content:"\f0c9";
}
div.logo
{
	max-width:140px;
	height:auto;
	position:relative;
	margin:10px 0 0 0;
}
@media only screen and (min-width:992px)
{
	div.header		{ padding:5px 0 0 0; }
	div.language	{ margin:5px 0 0 0; }
}
/*------------------------------------ Menu ------------------------------------*/
div.menu
{
	display:none;
	margin:20px 0 30px 0;
}
div.menu ul
{
	list-style-type:none;
	margin:0;
	padding:0;
}
div.menu li
{
	position:relative;
	display:inline-block;
}
div.menu a
{
	color:#000;
	display:block;
	font-weight:600;
}
div.menu ul li > div
{
	display:none;
	position:absolute;
	background:#fff;
	z-index:1;
	border:1px solid #eee;
	width:100%;
	text-align:right;
	padding:5px 10px 5px 0;
}
div.menu ul li > div a
{
	padding:1px 0;
}
div.minimenu
{
	display:none;
	position:absolute;
	left:0;
	top:0;
	background:#fff;
	width:100%;
	height:100%;
	z-index:2;
	text-align:right;
	font-size:13px;
}
div.minimenu ul
{
	list-style-type:none;
	margin:0;
	padding:0;
}
div.minimenu ul div
{
	display:none;
	position:absolute;
	left:0;
	top:0;
	background:#fff;
	width:100%;
	height:100%;
	z-index:1;
	text-align:right;
}
div.minimenu ul a
{
	display:block;
	font-weight:600;
	padding:15px 20px;
	text-align:left;
	color:#000;
}
div.minimenu ul a:hover
{
	color:#fff;
	background:#777;
}
div.minimenu span.close
{
	font:900 22px 'FontAwesome';
	padding:10px 15px;
	color:#000;
	display:inline-block;
	cursor:pointer;
}
/*------------------------------------ SubFooter ------------------------------------*/
div.subfooter
{
	display:none;
	padding:20px 0;
	width:100%;
}
div.subfooter a
{
	color:#000;
}
div.footermenu
{}
div.footermenu a
{
	display:inline-block;
	line-height:1;
	margin-bottom:5px;
}
div.footermenu a:hover
{
	text-decoration:underline;
}
div.footermenu a:not(:last-child)
{
	border-right:1px solid #ccc;
	padding:0 7px 0 3px;
}
div.socialmedia
{
	margin:10px 0 0 0;
}
div.socialmedia a
{
	font:400 18px 'FontAwesome';
	display:inline-block;
	margin:0 2px;
}
@media only screen and (min-width:992px)
{
	div.footermenu	{ float:right; margin:5px 0 0 0; }
	div.socialmedia	{ float:left; margin:0; }
}
/*------------------------------------ Footer ------------------------------------*/
div.footer
{
	display:none;
	margin:10px 0 30px 0;
}
div.footer span
{
	letter-spacing:1px;
}
div.footer div.copyright
{}
/*------------------------------------ Social Buttons ------------------------------------*/
div.socialbuttons
{
	margin:5px 5px 0 0;
	float:right;
}
div.socialbuttons a
{
	font:400 18px 'FontAwesome';
	display:inline-block;
	padding:7px;
	border-radius:25px;
	color:#948368;
	border-left:1px solid #948368;
}
div.socialbuttons a:hover
{
	color:#fff;
	background:#948368;
}
a.facebook::after
{
	content:"\f39e";
}
a.facebook:hover
{
	color:#3F71C1;
}
a.twitter::after
{
	content:"\f099";
}
a.twitter:hover
{
	color:#1EC7FF;
}
a.youtube::after
{
	content:"\f167";
}
a.youtube:hover
{
	color:#CD1717;
}
a.instagram::after
{
	content:"\f16d";
}
a.instagram:hover
{
	color:#C02994;
}
a.linkedin::after
{
	content:"\f0e1";
}
a.linkedin:hover
{
	color:#0177B5;
}
a.snapchat::after
{
	content:"\f2ac";
}
a.snapchat:hover
{
	color:#F7F400;
}
a.tiktok::after
{
	content:"\e07b";
}
a.tiktok:hover
{
	color:#F7F400;
}
@media only screen and (min-width:992px)
{
	div.socialbuttons	{ margin:15px 15px 0 0; }
}
/*------------------------------------ Content ------------------------------------*/
div.content
{
	position:relative;
	display:none;
	margin:20px;
}
@media only screen and (min-width:992px)
{
	div.content	{ margin:20px 0; }
}
/*------------------------------------ Form ------------------------------------*/
form
{
	margin:35px 0;
	direction:rtl;
}
form div
{
	margin:10px 0;
}
input,textarea,select
{
	font:400 13px 'Tajawal','Gilroy';
	background:#eee;
	width:100%;
	max-width:600px;
	padding:10px;
	margin:0;
	color:#000;
	border:none;
	transition:all 0.4s;
	outline:#fff;
}
input:hover,textarea:hover,select:hover,input:focus,textarea:focus,select:focus
{
	background:#ddd;
	color:#000;
}
select
{}
textarea
{
	height:150px;
}
input::placeholder,textarea::placeholder
{
	color:#000;
}
input[type=radio]
{
	width:auto;
	background:transparent;
	border:none;
}
input[type=submit],button
{
	font:400 13px 'Tajawal','Gilroy';
	background:#888;
	width:auto;
	padding:7px 10px;
	margin:0;
	color:#fff;
	border:none;
	transition:all 0.4s;
	outline:#fff;
	cursor:pointer;
}
input[type=submit]:hover,button:hover
{
	background:#262C31;
}
div.success
{
	height:40px;
	margin:10px 0;
	background:#eee;
	color:#000;
	border-left:5px solid #ccc;
	display:none;
}
div.success div
{
	float:left;
	margin:7px 0 0 15px;
}
div.success button
{
	float:right;
	height:40px;
	background:#ccc;
	color:#000;
	padding:0 14px;
	border:none;
	cursor:pointer;
	transition:all 0.3s;
}
div.success button:hover
{
	color:#000;
	background:#ddd;
}
div.success button::before
{
	font:900 15px 'FontAwesome';
	content:"\f00d";
}
div.error
{
	height:40px;
	margin:10px 0;
	background:#eee;
	color:#000;
	border-left:5px solid #ccc;
	display:none;
}
div.error div
{
	float:left;
	margin:7px 0 0 15px;
}
div.error button
{
	float:right;
	height:40px;
	background:#ccc;
	color:#000;
	padding:0 14px;
	border:none;
	cursor:pointer;
	transition:all 0.3s;
}
div.error button:hover
{
	color:#000;
	background:#ddd;
}
div.error button::before
{
	font:900 15px 'FontAwesome';
	content:"\f00d";
}
/*------------------------------------ Photos ------------------------------------*/
div.photo
{
	position:relative;
	overflow:hidden;
}
div.photo img
{
	transition:all 0.4s;
	cursor:pointer;
}
div.photo img:hover
{
	transform:scale(1.1);
}
div.modal
{
	display:none;
	position:fixed;
	z-index:1;
	padding-top:75px;
	left:0;
	top:0;
	width:100%;
	height:100%;
	overflow:auto;
	background-color:rgba(0,0,0,0.85);
}
video.videomodal
{
	width:100%;
	display:block;
	margin:auto;
	animation:zoom 0.6s;
}
@keyframes zoom
{
	from { transform:scale(0.1); } 
	to { transform:scale(1); }
}
span.closemodal
{
	color:#fff;
	position:absolute;
	top:5px;
	right:20px;
	font-size:60px;
	font-weight:bold;
	transition:color 0.4s;
	cursor:pointer;
}
span.closemodal:hover,span.closemodal:focus
{
	color:#999;
}
@media only screen and (min-width:992px)
{
	video.videomodal	{ width:800px; height:450px; }
	span.closemodal		{ top:15px; right:35px; }
}
/*------------------------------------ Google Map ------------------------------------*/
div.infomap
{
	padding:15px;
	max-width:290px;
	display:none;
}
div.googlemap
{
	min-width:290px;
	min-height:350px;
	width:100%;
	margin:0;
}
/*------------------------------------ Colors ------------------------------------*/
.green
{
	color:#080;
}
.blue
{
	color:#00f;
}
.red
{
	color:#f00;
}
.magenta
{
	color:#f0f;
}
.navy
{
	color:#008;
}
.gray
{
	color:#999;
}
.white
{
	color:#fff;
}
/*------------------------------------ Directions ------------------------------------*/
.center		{ text-align:center; }
.right		{ text-align:right; }
.left		{ text-align:left; }
.justify	{ text-align:justify; }
/*------------------------------------ Sizes ------------------------------------*/
.width100
{
	max-width:100px;
}
.width200
{
	max-width:200px;
}
.width300
{
	max-width:300px;
}
.width400
{
	max-width:400px;
}
.width500
{
	max-width:500px;
}
.height100
{
	min-height:100px;
}
.height200
{
	min-height:200px;
}
/*------------------------------------ Margins ------------------------------------*/
.marginy2	{ margin:2px 0; }
.marginy5	{ margin:5px 0; }
.marginy10	{ margin:10px 0; }
.marginy15	{ margin:15px 0; }
.marginy20	{ margin:20px 0; }
.marginy25	{ margin:25px 0; }
.marginy50	{ margin:50px 0; }
.marginx5	{ margin:0 5px; }
.marginx10	{ margin:0 10px; }
/*------------------------------------ Sizes ------------------------------------*/
.small		{ font-size:13px; }
.medium		{ font-size:15px; }
.big		{ font-size:24px; }
.number		{ font-family:'Tahoma'; font-weight:700; }
/*------------------------------------ Blocks ------------------------------------*/
div.row
{
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
}
div.col5,div.col10,div.col15,div.col20,div.col25,div.col30,div.col35,div.col40,div.col45,div.col50,div.col55,div.col60,div.col65,div.col70,div.col75,div.col80,div.col85,div.col90,div.col95,div.col100
{
	flex:100%;
}
@media only screen and (min-width:992px)
{
	div.col5		{ flex:5%; max-width:5%; }
	div.col10		{ flex:10%; max-width:10%; }
	div.col15		{ flex:15%; max-width:15%; }
	div.col20		{ flex:20%; max-width:20%; }
	div.col25		{ flex:25%; max-width:25%; }
	div.col30		{ flex:30%; max-width:30%; }
	div.col35		{ flex:35%; max-width:35%; }
	div.col40		{ flex:40%; max-width:40%; }
	div.col45		{ flex:45%; max-width:45%; }
	div.col50		{ flex:50%; max-width:50%; }
	div.col55		{ flex:55%; max-width:55%; }
	div.col60		{ flex:60%; max-width:60%; }
	div.col65		{ flex:65%; max-width:65%; }
	div.col70		{ flex:70%; max-width:70%; }
	div.col75		{ flex:75%; max-width:75%; }
	div.col80		{ flex:80%; max-width:80%; }
	div.col85		{ flex:85%; max-width:85%; }
	div.col90		{ flex:90%; max-width:90%; }
	div.col95		{ flex:95%; max-width:95%; }
	div.col100		{ flex:100%; max-width:100%; }
}
/*------------------------------------ Animations ------------------------------------*/
.light
{
	opacity:1;
	transition:opacity 0.3s;
}
.light:hover
{
	opacity:0.7;
}
.dark
{
	opacity:0.7;
	transition:opacity 0.3s;
}
.dark:hover
{
	opacity:1;
}
.enlarge
{
	transition:transform 0.3s;
}
.enlarge:hover
{
	transform:scale(1.06);
}
.enlarge2
{
	transition:transform 0.3s;
}
.enlarge2:hover
{
	transform:scale(1.2);
}
.rotate
{
	transition:transform 0.5s;
}
.rotate:hover
{
	transform:rotate(15deg);
}
.rotatex
{
	transition:transform 0.5s;
}
.rotatex:hover
{
	transform:rotateX(360deg);
}
.rotatey
{
	transition:transform 0.5s;
}
.rotatey:hover
{
	transform:rotateY(360deg);
}
.fade
{
	animation:fade 2s;
}
@keyframes fade
{
	from	{ opacity:0.4; }
	to		{ opacity:1; }
}
.totop
{
	animation:totop 2s;
}
@keyframes totop
{
	from	{ top:50px; opacity:0; }
	to		{ top:0px; opacity:1; }
}
.tobottom
{
	animation:tobottom 1.5s;
}
@keyframes tobottom
{
	from	{ bottom:150px; opacity:0; }
	to		{ bottom:0px; opacity:1; }
}
.toright
{
	animation:toright 1.5s;
}
@keyframes toright
{
	from	{ right:100px; opacity:0; }
	to		{ right:0px; opacity:1; }
}
.toleft
{
	animation:toleft 1.5s;
}
@keyframes toleft
{
	from	{ left:100px; opacity:0; }
	to		{ left:0px; opacity:1; }
}
.zoom
{
	animation:zoom 1s;
}
@keyframes zoom
{
	from	{ transform:scale(0.1); } 
	to		{ transform:scale(1); }
}
/*------------------------------------ Fonts ------------------------------------*/
@font-face
{
	font-family:'Tajawal';
	font-weight:400;
	src:url('../fonts/tajawalregular.ttf') format("truetype");
}
@font-face
{
	font-family:'Tajawal';
	font-weight:600;
	src:url('../fonts/tajawalmedium.ttf') format("truetype");
}
@font-face
{
	font-family:'Tajawal';
	font-weight:900;
	src:url('../fonts/tajawalbold.ttf') format("truetype");
}
@font-face
{
	font-family:'Tajawal','Gilroy';
	font-weight:400;
	src:url('../fonts/gilroyregular.ttf') format("truetype");
}
@font-face
{
	font-family:'Tajawal','Gilroy';
	font-weight:600;
	src:url('../fonts/gilroysemibold.ttf') format("truetype");
}
@font-face
{
	font-family:'Tajawal','Gilroy';
	font-weight:900;
	src:url('../fonts/gilroybold.ttf') format("truetype");
}
@font-face
{
	font-family:'FontAwesome';
	font-weight:400;
	src:url("../fonts/fontawesomeregular400.woff") format("woff");
}
@font-face
{
	font-family:'FontAwesome';
	font-weight:900;
	src:url("../fonts/fontawesomesolid900.woff") format("woff");
}
@font-face
{
	font-family:'FontAwesome';
	font-weight:400;
	src:url("../fonts/fontawesomebrands400.woff") format("woff");
}