/* @media (prefers-color-scheme: light) { 
    #main-nav div#menu{
		background: none;
	}
} */
@import "https://fonts.googleapis.com/earlyaccess/droidarabickufi.css";
@import "https://fonts.googleapis.com/earlyaccess/droidarabicnaskh.css";
@font-face {
	font-family: "expoSans";
	src: url(fonts/expo-sans/expo-sans300/ExpoSansStd-Light.otf);
	src: url(fonts/expo-sans/expo-sans300/ExpoSansStd-Light.woff2) format("woff2"),
		url(fonts/expo-sans/expo-sans300/ExpoSansStd-Light.woff) format("woff");
	font-weight: 300;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "expoSans";
	src: url(fonts/expo-sans/expo-sans400/ExpoSansStd-Book.otf);
	src: url(fonts/expo-sans/expo-sans400/ExpoSansStd-Book.woff2) format("woff2"),
		url(fonts/expo-sans/expo-sans400/ExpoSansStd-Book.woff) format("woff");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "expoSans";
	src: url(fonts/expo-sans/expo-sans500/ExpoSansStd-Medium.otf);
	src: url(fonts/expo-sans/expo-sans500/ExpoSansStd-Medium.woff2) format("woff2"),
		url(fonts/expo-sans/expo-sans500/ExpoSansStd-Medium.woff) format("woff");
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "expoSans";
	src: url(fonts/expo-sans/expo-sans600/ExpoSansStd-SemiBold.otf);
	src: url(fonts/expo-sans/expo-sans600/ExpoSansStd-SemiBold.woff2) format("woff2"),
		url(fonts/expo-sans/expo-sans600/ExpoSansStd-SemiBold.woff) format("woff");
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "expoSans";
	src: url(fonts/expo-sans/expo-sans700/ExpoSansStd-Bold.otf);
	src: url(fonts/expo-sans/expo-sans700/ExpoSansStd-Bold.woff2) format("woff2"),
		url(fonts/expo-sans/expo-sans700/ExpoSansStd-Bold.woff) format("woff");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}



@font-face {
	font-family: "expoArabic";
	src: url(fonts/expo-arabic/expo-arabic300/expo-arabic-light.eot);
	src: url(fonts/expo-arabic/expo-arabic300/ExpoArabic-Light.otf);
	src: url(fonts/expo-arabic/expo-arabic300/ExpoArabic-Light.woff2) format("woff2"),
		url(fonts/expo-arabic/expo-arabic300/ExpoArabic-Light.woff) format("woff");
	font-weight: 300;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "expoArabic";
	src: url(fonts/expo-arabic/expo-arabic400/expo-sans-book.eot);
	src: url(fonts/expo-arabic/expo-arabic400/ExpoArabic-Book.otf);
	src: url(fonts/expo-arabic/expo-arabic400/ExpoArabic-Book.woff2) format("woff2"),
		url(fonts/expo-arabic/expo-arabic400/ExpoArabic-Book.woff) format("woff");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "expoArabic";
	src: url(fonts/expo-arabic/expo-arabic500/ExpoArabic-Medium.otf);
	src: url(fonts/expo-arabic/expo-arabic500/ExpoArabic-Medium.woff2) format("woff2"),
		url(fonts/expo-arabic/expo-arabic500/ExpoArabic-Medium.woff) format("woff");
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "expoArabic";
	src: url(fonts/expo-arabic/expo-arabic600/expo-sans-semi-bold.eot);
	src: url(fonts/expo-arabic/expo-arabic600/ExpoArabic-SemiBold.otf);
	src: url(fonts/expo-arabic/expo-arabic600/ExpoArabic-SemiBold.woff2) format("woff2"),
		url(fonts/expo-arabic/expo-arabic600/ExpoArabic-SemiBold.woff) format("woff");
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "expoArabic";
	src: url(fonts/expo-arabic/expo-arabic700/expo-sans-bold.eot);
	src: url(fonts/expo-arabic/expo-arabic700/ExpoArabic-Bold.otf);
	src: url(fonts/expo-arabic/expo-arabic700/ExpoArabic-Bold.woff2) format("woff2"),
		url(fonts/expo-arabic/expo-arabic700/ExpoArabic-Bold.woff) format("woff");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}



body{
	margin : 0;
	font-family: "expoArabic", "Tahoma";
	font-weight: 300;
	font-size: 13px;
	
	background: url("img/inside-bg.png") repeat-x fixed;
	background-size: 600px;
}
body.fixed-head{
	background: url("img/inside-bg.png") repeat-x fixed;
	background-size: 600px;
	padding-top:200px;
}
strong {
    font-weight: bold;
}
a{
	text-decoration : none;
}
.width{
	width : 1600px;
	max-width : 93%;
	margin : 0 auto;
	direction : rtl;
}
#head{
	/* position: relative;
	background-image : url('img/head-bg.png'), url('img/markaz-najaf-pic.jpg');
	background-size : cover, cover;
	background-position : center, center;
	min-height: 580px;
	height : 100vh; */
	text-align: center;
	border-bottom: 1px solid #d9d9d9;
	padding:0 0 20px 0;
}
body.fixed-head #head{
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	background: url("img/inside-bg.png") repeat-x;
	background-size: 600px;
	padding:20px 0 20px 0;
	z-index: +900000;
}
#head .social{
	direction : ltr;
	float : left;
	white-space : nowrap;
	margin : 40px 0 0 0;
}
body.fixed-head #head .social{
	display: none;
}
#head .social a{
	font-size : 21px;
	color : #48677a;
	margin : 0 9px 0 0;
	transition : color 450ms;
}
#head .social a:hover{
	color : #b44dc6;
}
#head #main-nav .social{
	border-top:1px solid rgba(204, 204, 255, 0.15);
	float :none;
	margin : 0 0 5px 0;

	display: none;
}
#head #main-nav .social a{
	display: inline-block;
	font-size : 15px;
	width: 14.28571429%;
	text-align: center;
	margin: 0;
	padding: 10px 0 0 0;
	color:rgba(135, 255, 219, 0.70);
}
#head #main-nav .social a:hover{
	color:rgba(255, 235, 59, 0.80);
}
#head img.head-logo{
	float : right;
	width : 285px;
	margin : 25px 0 25px 0;
}
body.fixed-head #head img.head-logo{
	display: none;
}
@media screen and (max-width:555px){
	#head .social{
		display: none;
	}
}






#main-nav {
	position: relative;
	white-space: nowrap;
	margin: 0;
	padding: 8px 8px;
	clear: both;
	background: rgba(89, 144, 165, 0.19);
	border-radius: 10px;
	text-align: right;
	z-index: 999999999;
	transition: background 2000ms ease-out;
}
#main-nav.search-mode{
	background: rgba(89, 144, 165, 0.06);
}
#main-nav .menu-icon{
	display: none;
	padding: 11px 9px 11px 7px;
    color: #48677a;
    position: absolute;
    right: 8px;
    top: 6px;
    font-size: 21px;
    cursor: pointer;
	transition: opacity 1200ms ease-in-out, color 450ms;
}
#main-nav.search-mode .menu-icon{
	opacity: 0.08;
}
#main-nav .menu-icon:hover{
	color: #1c9e80;
}




body #main-nav img.fixed-head-logo{
	display: none;
	width : 230px;
	margin: 2px 5px 0 0;
}
body.fixed-head #main-nav img.fixed-head-logo{
	display: inline-block;
	transition: opacity 1200ms ease-in-out;
}
body.fixed-head #main-nav.search-mode img.fixed-head-logo{
	opacity: 0.08;
}


#main-nav div#menu {
	display: inline-block;
	list-style: none;
	margin: 0;
	padding: 0;
	font-size: 0;
	vertical-align: top;
	white-space: nowrap;
	opacity: 0.99;
	transition: opacity 1200ms ease-in-out;
}
#main-nav.search-mode div#menu{
	opacity: 0.08;
}
#main-nav #menu .markaz-logo{
	display: none;
	width: 90%;
	margin: 13px auto;
}
#main-nav div#menu ul{
	list-style: none;
	margin: 0;
	padding: 0;
}
#main-nav div#menu li {
	display: inline-block;
}

#main-nav div#menu li a {
	display: block;
	height: 41px;
	padding: 0 8px;
	color: #000000;
	font-size: 21px
}

#main-nav div#menu li a span.text {
	line-height: 41px;
	font-weight: 300;
	font-size: 13.5px;
	display: inline-block;
	color: #060f26;
	vertical-align: middle;
	transition: color 450ms;
}
#main-nav div#menu li:hover a span.text {
	color: #00695c;
}
#main-nav div#menu.opened li:hover a span.text {
	color: #c1cfa0;
}

#main-nav div#menu li a span.have_drop {
	display: inline-block;
	font-size: 11px;
	color: #000000;
	text-indent: 4px;
	font-weight:normal;
	vertical-align:middle;
	transition: color 450ms;
}
#main-nav div#menu li:hover a span.have_drop {
	color: #00695c;
}
#main-nav div#menu.opened li:hover a span.have_drop {
	color: #c1cfa0;
}

#main-nav div#menu li a span.have_drop_left {
	display: inline-block;
	display: none;
	font-size: 11px;
	color: #b7b7b7;
	text-indent: 4px;
	font-weight: bold;
	vertical-align: middle;
	float: left;
	margin:16px 0 0 0;
	transition: color 450ms;
}
#main-nav div#menu li:hover a span.have_drop_left {
	color: #c1cfa0;
}

#main-nav div#menu li:hover{

}

#main-nav div#menu li .drop{
	position: absolute;
	margin: 0px 0 0 0;
	background: rgba(180, 189, 149, 0.90);
	border: 1px solid #c1cfa0;
	border-radius:10px;
	display: none;
}

#main-nav div#menu li .drop .top-cursor{
	font-size: 16px;
	position: absolute;
	top: -13px;
	right: 15px;
	color: #c1cfa0;
}

#main-nav div#menu li .drop .right-cursor{
	font-size: 16px;
	position: absolute;
	top: -13px;
	right: 15px;
	color: #c1cfa0;
	display: none
}

#main-nav div#menu li:hover .drop{
	display: block
}

#main-nav div#menu li .drop ul{
	margin: 0;
	padding: 0
}

#main-nav div#menu li .drop ul li {
	display: block;
	border-bottom: 1px solid #97a582;
	transition: background 450ms;
}

#main-nav div#menu li .drop ul li:last-child {
	border-bottom: none;
}

#main-nav div#menu li .drop ul li:hover {
	background: rgba(120, 131, 95, 0.23)
}

#main-nav div#menu li .drop ul li a {
	height: auto;
	padding: 0 10px 0 10px
}

#main-nav div#menu li .drop ul li a span {
	color: #fff7dd;
	font-size: 14.5px
}

#main-nav div#menu li .drop ul li a span.text {
	color: #fff7dd;
	line-height: 38px;
	display: inline-block;
	text-indent: 0;
	min-width: 120px;
	font-size: 13.5px;
	font-weight: 300;
	padding: 0
}
#main-nav div#menu.opened li .drop ul li a span.text {
	color: #fff7dd;
}

#main-nav .search-icon{
	padding:11px 9px 11px 7px;
	color: #48677a;
	position: absolute;
	left:8px;
	top:8px;
	font-size: 21px;
	cursor: pointer;
	transition: color 450ms;
}
#main-nav.search-mode .search-icon{
	display: none;
}
#main-nav .search-icon:hover{
	color: #1c9e80;
}
#main-nav .search-button{
	display: none;
	padding:11px 9px 11px 7px;
	color: #48677a;
	position: absolute;
	left:8px;
	top:8px;
	font-size: 21px;
	cursor: pointer;
	transition: color 450ms;
}
#main-nav.search-mode .search-button{
	display:inline-block;
}
#main-nav .search-button:hover{
	color: #1c9e80;
}

#main-nav .search-text-box{
	background: rgba(89, 144, 165, 0.40);
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:100%;
    width:100%;
    height:100%;
	opacity:0;
	border-radius: 10px;
	outline:none;
	border:none;
	font-family: "expoArabic", "Tahoma";
	font-weight: 400;
	color:#48677a;
	padding: 0;
	max-width:0px;
	text-indent: 16px;
	transition:
		background 1200ms ease-in-out,
		max-width 1600ms ease-in-out,
		right 1600ms ease-in-out,
		opacity 1400ms;
}
#main-nav.search-mode .search-text-box{
	max-width:100%;
	background: rgba(89, 144, 165, 0.17);
	right:0;
	opacity:1;
}
#main-nav .search-text-box::-webkit-input-placeholder { /* Chrome/Opera/Safari */
	font-family: "expoArabic", "Tahoma";
	font-weight: 400;
	color:#48677a;
}
#main-nav .search-text-box::-moz-placeholder { /* Firefox 19+ */
	font-family: "expoArabic", "Tahoma";
	font-weight: 400;
	color:#48677a;
}
#main-nav .search-text-box:-ms-input-placeholder { /* IE 10+ */
	font-family: "expoArabic", "Tahoma";
	font-weight: 400;
	color:#48677a;
}
#main-nav .search-text-box:-moz-placeholder { /* Firefox 18- */
	font-family: "expoArabic", "Tahoma";
	font-weight: 400;
	color:#48677a;
}
@media screen and (max-width:1250px){
	body.fixed-head #main-nav{
		height:41px;
	}
	body.fixed-head #main-nav .menu-icon{
		display: inline-block;
	}
	body.fixed-head #main-nav img.fixed-head-logo{
		margin: 2px 45px 0 0;
	}
	body.fixed-head #main-nav div#menu{
		position:fixed;
		top: 0;
		bottom: 0;
		right: -250px;
		z-index:+1000000;
		background: rgba(18, 16, 29, 0.88);
		width: 250px;
		box-shadow: 0px 0px 0px 0px rgb(0 0 0 / 30%);
		transition:right 750ms, box-shadow 1000ms;
		backdrop-filter: blur(5px);
	}
	body.fixed-head #main-nav.search-mode img.fixed-head-logo{
		opacity: 0.08;
	}
	body.fixed-head #main-nav.search-mode div#menu{
		opacity: 1;
	}
	body.fixed-head #main-nav div#menu.opened{
		box-shadow: -13px 0px 34px 1px rgba(0, 0, 0, 0.30);
		right: 0;
	}
	body.fixed-head #main-nav div#menu .markaz-logo{
		display: block;
	}
	body.fixed-head #head #main-nav .social{
		display:block;
	}
	body.fixed-head #main-nav div#menu ul{
		border-top: 1px solid rgba(204, 204, 255, 0.15);
	}
	body.fixed-head #main-nav div#menu li{
		position: relative;
		display: block;
		border-bottom:1px solid rgba(255, 255, 255, 0.05);
	}
	body.fixed-head #main-nav div#menu li a span.have_drop{
		display: none;
	}
	body.fixed-head #main-nav div#menu li a span.have_drop_left{
		display: inline-block;
	}
	body.fixed-head #main-nav div#menu li a span.text{
		color: rgba(255, 255, 255, 0.90);
	}
	body.fixed-head #main-nav div#menu li .drop{
		top:0;
		right: 250px;
		border-top-right-radius: 0;
		border-bottom-right-radius: 0;
	}
	body.fixed-head #main-nav div#menu li .drop .top-cursor {
		display: none;
	}
	body.fixed-head #main-nav div#menu li .drop .right-cursor {
		display: inline-block;

		font-size: 16px;
		position: absolute;
		top: 12px;
		right: -13px;
		color: #c1cfa0;
	}
}
@media screen and (max-width:1005px){
	#main-nav{
		height:41px;
	}
	#main-nav .menu-icon{
		display: inline-block;
	}
	body #main-nav img.fixed-head-logo{
		margin: 2px 45px 0 0;
	}
	#main-nav div#menu{
		position:fixed;
		top: 0;
		bottom: 0;
		right: -250px;
		z-index:+1000000;
		background: rgba(18, 16, 29, 0.88);
		width: 250px;
		box-shadow: 0px 0px 0px 0px rgb(0 0 0 / 30%);
		transition:right 750ms, box-shadow 1000ms;
		backdrop-filter: blur(5px);
	}
	body.fixed-head #main-nav.search-mode img.fixed-head-logo{
		opacity: 0.08;
	}
	#main-nav.search-mode div#menu{
		opacity: 1;
	}
	#main-nav div#menu.opened{
		box-shadow: -13px 0px 34px 1px rgba(0, 0, 0, 0.30);
		right: 0;
	}
	#main-nav div#menu .markaz-logo{
		display: block;
	}
	#head #main-nav .social{
		display:block;
	}
	#main-nav div#menu ul{
		border-top: 1px solid rgba(204, 204, 255, 0.15);
	}
	#main-nav div#menu li{
		position: relative;
		display: block;
		border-bottom:1px solid rgba(255, 255, 255, 0.05);
	}
	#main-nav div#menu li a span.have_drop{
		display: none;
	}
	#main-nav div#menu li a span.have_drop_left{
		display: inline-block;
	}
	#main-nav div#menu li a span.text{
		color: rgba(255, 255, 255, 0.90);
	}
	#main-nav div#menu li .drop{
		top:0;
		right: 250px;
		border-top-right-radius: 0;
		border-bottom-right-radius: 0;
	}
	#main-nav div#menu li .drop .top-cursor {
		display: none;
	}
	#main-nav div#menu li .drop .right-cursor {
		display: inline-block;

		font-size: 16px;
		position: absolute;
		top: 12px;
		right: -13px;
		color: #c1cfa0;
	}
}








section.row{
	padding: 50px 0;
}
section.row.dark{
	background:url("img/row-bg.gif");
	background-position: right top;
	background-size: 600px;
}
section.row.dark-b{
	background:url("img/row-bg-b.gif");
	background-position: right top;
	background-size: 600px;
}
section.row .row-title{
	position: relative;
	text-align: center;
	font-size: 30px;
	font-weight: 500;
	color: #f2f2f2;
}
section.row .row-title h2{
	margin:0;
	padding: 8px 0 0 0;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	font-weight: 400;
	font-size: 19.5px;
	color: #484848;
}
section.row .row-title h2 a{
	color: #6c6a74;
	transition: color 650ms;
}
section.row .row-title h2 a::before{
	content: "{ ";
	color: #c0597c;
	opacity: 0;
	transition: opacity 650ms;
}
section.row .row-title h2 a::after{
	content: " }";
	color: #c0597c;
	opacity: 0;
	transition: opacity 650ms;
}
section.row .row-title h2 a:hover{
	color: #484848;
}
section.row .row-title h2 a:hover::before{
	opacity: 1;
}
section.row .row-title h2 a:hover::after{
	opacity: 1;
}
section.row .row-title span{
	display:block;
	font-size:14px;
	font-weight: 300;
	line-height: 23px;
	color: #8d8d8d;
}
section.row.dark .row-title{
	color: #e4e4e4;
}
section.row.dark .row-title h2{
	color: #515151;
}
section.row.dark .row-title h2 a{
	color: #6c6a74;
	transition: color 650ms;
}
section.row.dark .row-title h2 a::before{
	content: "{ ";
	color: #c0597c;
	opacity: 0;
	transition: opacity 650ms;
}
section.row.dark .row-title h2 a::after{
	content: " }";
	color: #c0597c;
	opacity: 0;
	transition: opacity 650ms;
}
section.row.dark .row-title h2 a:hover{
	color: #484848;
}
section.row.dark  .row-title h2 a:hover::before{
	opacity: 1;
}
section.row.dark .row-title h2 a:hover::after{
	opacity: 1;
}
section.row.dark .row-title span{
	color: #606060;
}













.hiwarat{
	margin:27px 0 0 0;
	font-size: 0;
}
.hiwarat .item{
	display: inline-block;
	width:25%;
	padding:23px 0.80% 12px 0.80%;
	padding:23px 13px 12px 13px;
	box-sizing:border-box;
	vertical-align: top;
}
.hiwarat .owl-carousel-hiwarat .item{
	width:100%;
	padding:23px 3.20% 12px 3.20%;
	padding:23px 13px 12px 13px;

}
.hiwarat .item img.pic{
	width: 100%;
}
.hiwarat .item .con{
	margin: 0;
	text-align: justify;
}
.hiwarat .item .con .person{
	font-weight: 500;
	font-size: 12px;
	color: #797979;
	margin: 17px 0 15px 0;
}
.hiwarat .item .con .person span{
	display: inline-block;
	margin:0 0 0 4px;
	color: #d75656;
	font-size: 17px;
	vertical-align: text-bottom;
	font-weight: bold;
}
.hiwarat .item .con h3.title{
	margin: 0 0 10px 0;
	color: #4f4f4f;
	font-weight: 500;
	font-size: 14px;
	line-height: 25px;
}
.hiwarat .item .con h3.title a{
	color: #3b3b3b;
	transition: color 600ms;
}
.hiwarat .item .con h3.title a:hover{
	color: #009688;
}
.hiwarat .item .con .text{
	line-height: 26px;
	font-size: 13px;
	color: #666464;
}
.hiwarat .item .con .text a{
	display: inline-block;
	color: #009688;
	font-size: smaller;
	transition: color 600ms;
}
.hiwarat .item .con .text a:hover{
	color: #e91e63;
}
.hiwarat .item .footer{
	border-top: 1px solid #dcdcdc;
	margin:10px 0 0 0;
	padding: 13px 0 0 0;
	font-size: 12px;
	color: #666464;
}
.hiwarat .item .footer .date{
	
}
.hiwarat .item .footer .views{
	float: left;
}
.hiwarat .item .footer span > span{
	font-size: 15px;
	vertical-align: middle;
	color: #959494;
}














.branches{
	display: flex;
	flex-direction: row;/* column */
	justify-content:space-between;

	margin: 45px 0 0 0;
}
.branches .item{
	flex-basis: 100%;
}
.branches .item.tab{
	order: 3;
	/* flex-grow: 2; */
	flex-basis: 37%;

	/* background:red; */
}
.branches .item.tab .tab-buttons{
	display: flex;
	justify-content: space-evenly;
}
.branches .item.tab .tab-buttons button{
	background:#fefdfd;
	border:1px solid #c9c7c7;
	border-radius:100px;
	font-family: "expoArabic", "Tahoma";
	font-weight: 300;
	padding:12px;
	color:#757575;
	cursor:pointer;
	transition:background 650ms, border 650ms, color 650ms;
}
.branches .item.tab .tab-buttons button.active{
	background:#e1f8fa;
	border:1px solid #6fc4d1;
	color: #518e91;
}
.branches .item.tab .tab-buttons button:not(.active):hover{
	background: #f7f7f7;
	border: 1px solid #cccbcb;
	color: #707070;
}
.branches .item.tab .tab-con{
	min-height: 250px;
	padding:0 5px 0 0;
}
.branches .item.tab .tab-con ul{
	list-style: none;
	padding:0;
	margin:0;
}
.branches .item.tab .tab-con ul li{
	position: relative;
	padding:0 35px 0 0;
	margin:40px 0 0 0;
	font-size: 14px;
}
.branches .item.tab .tab-con ul li h4{
	padding:0;
	margin:0 0 3px 0;
	color:#3e3e3e;
	font-weight: 400;
	font-size: 15px;
}
.branches .item.tab .tab-con ul li address{
	color:#777777;
	font-style:normal;
	line-height: 25px;
}
.branches .item.tab .tab-con ul li address a[href]{
	color:#0c8c9d;
	font-size: 15px;
	transition: color 400ms;
}
.branches .item.tab .tab-con ul li address a[href]:hover{
	color: #f57c00;
}
.branches .item.tab .tab-con ul li  span.icon{
	position: absolute;
	top: 0;
	right: 0;
	font-size: 25px;
	color:#8d8d8d;
}
.branches .item.tab .tab-con ul li:first-child span.icon{
	color:#f36448;
}




.branches .item.map{
	order: 2;
	/* flex-grow: 2.2; */
	flex-basis: 37%;

	position: relative;
	border-radius: 20px;
	overflow:hidden;
	border:2px solid #fff;
	box-sizing: border-box;
}
.branches .item.pic{
	background-image: url("img/branche-pic-najaf.jpg");
	background-size: cover;
	background-position: center center;
	order: 1;
	/* flex-grow: 1.2; */
	flex-basis: 24%;
	border-radius: 20px;
}
.branches .item.pic img{
	display:none;
}

@media screen and (max-width: 1030px){
	.branches{
		flex-wrap: wrap;
	}
	.branches .item.tab{
		order: 1;
		flex-basis: 60%;
		padding: 0 0 0 10px;
		box-sizing: border-box;
	}
	.branches .item.map{
		order: 3;
		flex-basis: 100%;
		height: 300px;
		margin: 30px 0 0 0;
	}
	.branches .item.pic{
		order: 2;
		flex-basis: 40%;
	}
}
@media screen and (max-width: 670px){
	.branches .item.tab{
		flex-basis: 100%;
		padding:0;
		
	}
	.branches .item.tab .tab-con{
		min-height:auto;
	}
	.branches .item.map{
		order: 2;
	}
	.branches .item.pic{
		order: 3;
		flex-basis: 100%;
		height: 300px;
		margin: 30px 0 0 0;
	}
}





footer#footer{

}
footer#footer .footer{
	background: #333f48;	
	color: #ffffff;
	font-size: 13px;
	text-align: right;
	height: 60px;
	line-height: 60px;
	direction: rtl;
	overflow: hidden;
}
footer#footer .footer.white{
    background: #ffffff;
	color: #24272c;
}

footer#footer a.app-link{
	display: inline-block;
	float: left;
	margin: 11px 0 0 9px;
}

footer#footer div.text{
	direction: rtl;
	display: inline-block
}
footer#footer div.text span{
	vertical-align: middle;
}
footer#footer div.text span:first-child{
	font-size: 33px;
	font-weight: 500;
	position: relative;
	top:6.5px;
}

@media screen and (max-width: 700px){
	footer#footer .footer{
		text-align:center;
		height: auto;
		line-height: 20px;
		padding: 12px 0
	}

	footer#footer a.app-link{
		float: none
	}

	footer#footer div.text{
		display: block;
		margin: 5px 0 2px
	}
}