body {
  overflow-x: hidden;
  font-family: 'ir-sans-normal', 'raleway-semibold', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  background-color: #E5E5E5;

}
::-webkit-scrollbar {
			width: 8px;
		}

		/* Track */
		::-webkit-scrollbar-track {
			background: #f1f1f1; 
			border-radius: 4px;
		}

		/* Handle */
		::-webkit-scrollbar-thumb {
			background: #888; 
			border-radius: 4px;
		}

		/* Handle on hover */
		::-webkit-scrollbar-thumb:hover {
			background: #555; 
		}
.slide__link {
	display: none;
}
.slide_text_position {
	transform: translateY(20vh);
}
p {
  line-height: 1.75;
}

a {
  color: #fed136;
}

a:hover {
  color: #fec503;
}

.text-primary {
  color: #fed136 !important;
}

.current ~ hr {
	transform: translateX(0);t
}

.welcomeToSite {
	position: fixed;
	font-family: 'raleway-semibold';
	top: 50%;
	left: 50%;
	width: auto;
	transform: translateX(-50%);
	list-style: none;
	text-align: center;
	padding: 0;
	color: #2B2B2B;
	/*color: #FFF;*/
	font-weight: bold;
	/*text-shadow: 0 2px 10px rgba(53,53,53,0.4), 2px 0 10px rgba(53,53,53,0.4);*/
}
.Azar {
	font-family: 'azar';
	font-style: italic;
	font-size: 2.51vw;
	border-bottom: 0.2vw #9a9a9a solid;
	margin-top: -12vh;
	margin-top: -6vw;
}
.professional {
	margin-top: 4vh;
	margin-top: 2vw;
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	border: none;
	color: #A1A1A1;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
	.professional {
		font-size: 2.6vh;
		font-size: 1.3vw;
	}
}

@supports (-moz-appearance:none) {
	.professional {
		font-size: 2.62vh;
		font-size: 1.31vw;
	}
}

@supports (-ms-ime-align: auto) {
	.professional {
		font-size: 2.62vh;
		font-size: 1.31vw;
	}
}

.welcomeToSite.welcomeHidden {
	opacity: 0;
	transition: all 1.2s ease-in-out;
}

.welcomeToSite li {
	display: inline-block;
	float: left;
	font-weight: 700;
	font-size: 2em;
	opacity: 1;
	transition: all 1.2s ease-in-out;
	max-width: 2em;
}
.welcomeToSite.welcomeHidden li.spaced {
  padding-left: 0;
}
.welcomeToSite li.spaced {
  padding-left: 0.5em;
}

.welcomeToSite.welcomeHidden li.ghost {
  opacity: 0;
  max-width: 0;
}


/*.welcomeToSite {
  display:inline-block;
  overflow:hidden;
  white-space:nowrap;
  text-align:center;
  color:#555;
  font-family:'Roboto';
  font-weight:300;
  font-size:32px;
  padding-top:40vh;


  overflow:hidden;
  -webkit-backface-visibility: hidden;
  -webkit-perspective: 1000;
  -webkit-transform: translate3d(0,0,0);
}

.welcomeToSite:first-of-type {    /* For increasing performance 
                       ID/Class should've been used. 
                       For a small demo 
                       it's okaish for now 
  animation: showup 7s infinite;
}

.welcomeToSite:last-of-type {
  width:0px;
  animation: reveal 7s infinite;
}

.welcomeToSite:last-of-type span {
  margin-left:-355px;
  animation: slidein 7s infinite;
}

@keyframes showup {
    0% {opacity:0;}
    20% {opacity:1;}
    80% {opacity:1;}
    100% {opacity:0;}
}

@keyframes slidein {
    0% { margin-left:-800px; }
    20% { margin-left:-800px; }
    35% { margin-left:0px; }
    100% { margin-left:0px; }
}

@keyframes reveal {
    0% {opacity:0;width:0px;}
    20% {opacity:1;width:0px;}
    30% {width:355px;}
    80% {opacity:1;}
    100% {opacity:0;width:355px;}
}*/

/* PreLoader Start */
#preloader {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	/*background: #D9D9D9;*/
	z-index: 99999999999999999;
	height: 100%;
	width: 100%;
}

.no-js #preloader,
.oldie #preloader {
	display: none;
}

.loaderHidden {
	opacity: 0;
}

.blackBackdrop {
	background: #000;
	background-image: url('../images/bg-01.png');
}

.whiteBackdrop {
	background: #FFFFFF;
	transition: all 1.2s ease-in-out;
}
.AzarLoader {
	position: fixed;
	width: 60%;
	height: 60%;
	left: 20%;
	top: 20%;
	
	/*font-family: 'raleway-semibold';
	font-size: 12px;
	line-height: 20px;
	text-align: center;
	
	
	 background-color: #FFFFFF;
	-webkit-box-shadow: 0px 0px 15px 1px rgba(0,0,0,0.2);
	-moz-box-shadow: 0px 0px 30px 1px rgba(0,0,0,0.2);
	box-shadow: 0px 0px 15px 1px rgba(0,0,0,0.2);*/
	background-image: url(../images/icon512.png);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center; 
	opacity: 1;
	-webkit-animation: sk-rotateplane 2.2s infinite cubic-bezier(0.680, 0, 0.265, 1);
	animation: sk-rotateplane 2.2s infinite cubic-bezier(0.680, 0, 0.265, 1);
	-webkit-transition: all 600ms cubic-bezier(0.86, 0, 0.07, 1);
	transition: all 600ms cubic-bezier(0.86, 0, 0.07, 1);
}

.hidePreloader {
	opacity: 0;
	transition: all 1.2s ease-in-out;
}

.littleLoader {
	opacity: 0;
	font-size: 6.5px;
	line-height: 30px;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background-size: contain;
	animation: none;
	-webkit-transition: all 800ms ease-out;
	transition: all 800ms ease-out;
}

	
.modal-backdrop.show {
  opacity: 0.9;
	z-index: 99999999;
}



@-webkit-keyframes sk-rotateplane {
	0% {
		-webkit-transform: perspective(1024px);
	}

	50% {
		-webkit-transform: perspective(1024px) rotateY(180deg);
	}

	100% {
		-webkit-transform: perspective(1024px)  rotateY(360deg);
	}

}

@keyframes sk-rotateplane {
	0% {
		-webkit-transform: perspective(1024px) rotateX(0deg) rotateY(0deg);
		transform: perspective(1024px) rotateX(0deg) rotateY(0deg);
	}

	50% {
		-webkit-transform: perspective(1024px) rotateX(0.1deg) rotateY(180deg);
		transform: perspective(1024px) rotateX(0.1deg) rotateY(180deg);
	}

	100% {
		-webkit-transform: perspective(1024px) rotateX(0deg) rotateY(360deg);
		transform: perspective(1024px) rotateX(0deg) rotateY(360deg);
	}

}

@keyframes shake {
  10%, 90% {
    transform: translate3d(-1px, 0, 0);
  }
  
  20%, 80% {
    transform: translate3d(2px, 0, 0);
  }

  30%, 50%, 70% {
    transform: translate3d(-4px, 0, 0);
  }

  40%, 60% {
    transform: translate3d(4px, 0, 0);
  }
}

@keyframes fade {
	0% {
		opacity: 0.8;
	}
	20% {
		opacity: 1;
	}
	40% {
		opacity: 0.8;
	}
	60% {
		opacity: 1;
	}
	80% {
		opacity: 0.8;
	}
	100% {
		opacity: 1;
	}
}

/* PreLoader End */

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 700;
}

section {
  padding: 0 0;
	height: auto;
	overflow: hidden;
}

section h2.section-heading {
  font-size: 40px;
  margin-top: 0;
  margin-bottom: 15px;

}

section h3.section-subheading {
  font-size: 16px;
  font-weight: 400;
  font-style: italic;
  margin-bottom: 75px;
  text-transform: none;
}

@media (min-width: 768px) {
  section {
    padding: 150px 0;
  }
}

.btn {
  font-weight: 700;
}

.btn-xl {
  font-size: 18px;
  padding: 20px 40px;
}

.btn-primary {
  background-color: #E5E5E5;
  border-color: #686868;
	color: #686868;
}

.btn-primary:active, .btn-primary:focus, .btn-primary:hover {
  background-color: #fec810 !important;
  border-color: #fec810 !important;
  color: white;
}

.btn-primary:active, .btn-primary:focus {
  box-shadow: 0 0 0 0.2rem rgba(254, 209, 55, 0.5) !important;
}

.btn-default {
  background-color: #0277BD;
  border-color: #0091EA;
	color: #FFFFFF;
	font-family: 'raleway-semibold';
}

.btn-default:active, .btn-default:focus, .btn-default:hover {
  background-color: #0091EA !important;
  border-color: #0277BD !important;
  color: #FFFFFF;
}

.btn-default:active, .btn-default:focus {
  box-shadow: 0 0 10px rgba(120,144,156,0.8) !important;
}

::-moz-selection {
  background: #FF004F;
	color: #FFFFFF;
  text-shadow: none;
}

::selection {
  background: #FF004F;
	color: #FFFFFF;
  text-shadow: none;
}

img::selection {
  background: transparent;
}

img::-moz-selection {
  background: transparent;
}

#mainNav {
  background-color: #E5E5E5;
}

#mainNav .navbar-toggler {
  font-size: 12px;
  right: 0;
  padding: 13px;
  text-transform: uppercase;
  color: #454545;
  border: 0;
  background-color: #FFF;
  font-family: 'raleway-semibold', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

#mainNav .navbar-brand {
  color: #313131;
  position: absolute;
}

#mainNav .navbar-brand.active, #mainNav .navbar-brand:active, #mainNav .navbar-brand:focus, #mainNav .navbar-brand:hover {
  color: #fec503;
  border: none;
  
}

#mainNav .navbar-nav .nav-item .nav-link {
	font-size: 80%;
	font-weight: 400;
	padding: 0.75em 0;
	color: #454545;
	margin-left: 1px;
	margin-bottom: 0;
	border-bottom: 3px rgba(0,0,0,0) solid;
	font-family: 'raleway-bold', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	text-shadow: 2px 2px #FFF;
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	transition: 0.6s ease-in-out;

}

#mainNav ul li:first-child {
	margin-left: 9px;
}

#mainNav .navbar-nav .nav-item .nav-link.active, #mainNav .navbar-nav .nav-item .nav-link:hover {
	color: #78909C;
	border-bottom: 3px #78909C solid;
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
	text-shadow: 0px 2px 2px #FFF, 2px 0px 2px #FFF;
	
}

#mainNav .navbar-nav .nav-item .nav-link:hover {
	border-bottom: 3px rgba(0,0,0,0) solid;
}

#mainNav .navbar-nav .nav-item .nav-link.active:hover {
	border-bottom: 3px #78909C solid;
	cursor: no-drop
}

@media (min-width: 992px) {

	.radius-menu {
		background: none;
		border-radius: 10px;
		margin-right: auto;
		-webkit-transition: margin-top 0.5s, background 0.5s;
		-moz-transition: margin-top 0.5s, background 0.5s;
    	transition: margin-top 0.5s, background 0.5s;	
	}
	.radius-menu-white {
		background-color: #E5E5E5;
		border-radius: 10px;
		margin-right: auto;
		margin-top: 130px;
		padding-right: 10px;
		-webkit-transition: margin-top 0.5s, background 0.5s, box-shadow 0.3s;
		-moz-transition: margin-top 0.5s, background 0.5s, box-shadow 0.3s;
    	transition: margin-top 0.5s, background 0.5s, box-shadow 0.3s;
		box-shadow: 1px 1px 12px rgba(0,0,0,0.25), 0px 0px 12px rgba(0,0,0,0.25);
		z-index: 100;
	}
	#mainNav {
		padding-top: 25px;
		padding-bottom: 25px;
		-webkit-transition: padding-top 0.3s, padding-bottom 0.3s;
		-moz-transition: padding-top 0.3s, padding-bottom 0.3s;
		transition: padding-top 0.3s, padding-bottom 0.3s;
		-webkit-transition: background-color 0.3s;
		-moz-transition: background-color 0.3s;
		transition: background-color 0.3s;
		border: none;
		background-color: rgba(255,255,255, 0);

	}
	#mainNav .navbar-brand {
		font-size: 1.75em;
		-webkit-transition: all 0.3s;
		-moz-transition: all 0.3s;
		transition: all 0.3s;
	}
  #mainNav .navbar-nav .nav-item .nav-link {
    padding: 1.1em 1em !important;
  }
  #mainNav.navbar-shrink {
    padding-top: 5vh;
    padding-bottom: 0;
	-webkit-transition: padding-top 0.3s, padding-bottom 0.3s, box-shadow 0.6s;
    -moz-transition: padding-top 0.3s, padding-bottom 0.3s, box-shadow 0.6s;
    transition: padding-top 0.3s, padding-bottom 0.3s, box-shadow 0.6s;
	-webkit-transition: background-color 0.5s;
	-moz-transition: background-color 0.5s;
    transition: background-color 0.5s;
    background-color: #E5E5E5;
	border-bottom: 2px solid #78909C;
	box-shadow: 1px 1px 12px rgba(0,0,0,0.25), 0px 0px 12px rgba(0,0,0,0.25);
  }
	.brandImg {
		margin-top: 9vh;
		margin-left: -11vh;

		width: 26vh;
		-webkit-transition: width 0.3s, height 0.3s;
		-moz-transition: width 0.3s, height 0.3s;
    	transition: width 0.3s, height 0.3s;
	}
	.brandImgShrink {
		margin-top: -5vh;
		margin-left: -11vh;

		width: 8vh;
		-webkit-transition: width 0.3s, height 0.3s;
		-moz-transition: width 0.3s, height 0.3s;
    	transition: width 0.3s, height 0.3s;
	}
	.brandImgFix {
		margin-top: -5vh;
		margin-left: -11vh;
	}
  #mainNav.navbar-shrink .navbar-brand {
	  margin-left: 3.5vw;
    font-size: 1.25em;
    padding: 12px 0;
  }
  .azarTextLogo {
		position: fixed;
		width: 300px;
	  	top: 0;
		height: 9vh;
		left: 50%;
		transform: translateX(-50%);
		background-image: url(../images/text-logo.png);
		background-size: auto 100%;
		background-position: center;
		background-repeat: no-repeat;
		background-color: #E5E5E5;  
		z-index: 99999;
		border-bottom-left-radius: 10px;
		border-bottom-right-radius: 10px;
		-webkit-transition: width 0.3s, height 0.3s, background 0.3s, box-shadow 0.3s;
		-moz-transition: width 0.3s, height 0.3s, background 0.3s, box-shadow 0.3s;
    	transition: width 0.3s, height 0.3s, background 0.3s, box-shadow 0.3s;
		box-shadow: 1px 1px 12px rgba(0,0,0,0.25), 0px 0px 12px rgba(0,0,0,0.25);
  }
 	.azarTextLogoShrink {
		height: 6vh;
		-webkit-transition: width 0.3s, height 0.3s, background 0.3s, box-shadow 0.3s;
		-moz-transition: width 0.3s, height 0.3s, background 0.3s, box-shadow 0.3s;
    	transition: width 0.3s, height 0.3s, background 0.3s, box-shadow 0.3s;
		box-shadow: none;
		z-index: 99999999;
	}
}
@media (max-width: 991px) {
	
	#mainNav .navbar-nav .nav-item .nav-link.active, #mainNav .navbar-nav .nav-item .nav-link:hover, #mainNav .navbar-nav .nav-item .nav-link { 
		border: none;
	}
	
	.brandImg {
		width: 48px;
		-webkit-transition: width 0.3s, height 0.3s;
		-moz-transition: width 0.3s, height 0.3s;
    	transition: width 0.3s, height 0.3s;
		z-index: 0;
	}
	.brandImgShrink {

		width: 48px;
		-webkit-transition: width 0.3s, height 0.3s;
		-moz-transition: width 0.3s, height 0.3s;
    	transition: width 0.3s, height 0.3s;
	}
	.navbar-brand {
		margin-left: 70vw;
		width: 48px;
		top: 0;
	}
}

#mainNav.shrinknav-transparent {
	background-color: rgba(255,255,255, 0.8);
}
.azarTextLogoShrinkTransparent {
	background-color: none;
}
.slidenav__item, .slidenav__item:focus {
	position: absolute;
	text-align: center;
	border-radius: 50%;
	font-size: 50px;
	border: 2px solid rgba(255,255,255,0.5);
	width: 60px;
	height: 60px;
	font-weight: 100;
	color: rgba(255,255,255,0.5);
	text-decoration: none;
	z-index: 1;
	top: 50%;
	transform: translateY(-50%);
	box-shadow: 0 1px 20px rgba(0,0,0,0.2), 1px 0 20px rgba(0,0,0,0.2);
	background: rgba(0,0,0,0.44);
}

.slidenav__item--next {
	right: 2vw;
}

.slidenav__item--prev {
	left: 2vw;
}
.slidenav__item:hover, .slidenav__item:active {
	border: 2px solid rgba(255,255,255,1);
	text-decoration: none;
	color: rgba(255,255,255,1);
}

header.masthead {
  text-align: center;
  color: white;
  background-image: url("../img/header-bg.jpg");
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-position: center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

header.masthead .intro-text {
  padding-top: 150px;
  padding-bottom: 100px;
}

header.masthead .intro-text .intro-lead-in {
  font-size: 22px;
  font-style: italic;
  line-height: 22px;
  margin-bottom: 25px;
  font-family: 'Droid Serif', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

header.masthead .intro-text .intro-heading {
  font-size: 50px;
  font-weight: 700;
  line-height: 50px;
  margin-bottom: 25px;
  font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

@media (min-width: 768px) {
  header.masthead .intro-text {
    padding-top: 300px;
    padding-bottom: 200px;
  }
  header.masthead .intro-text .intro-lead-in {
    font-size: 40px;
    font-style: italic;
    line-height: 40px;
    margin-bottom: 25px;
    font-family: 'Droid Serif', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  }
  header.masthead .intro-text .intro-heading {
    font-size: 75px;
    font-weight: 700;
    line-height: 75px;
    margin-bottom: 50px;
    font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  }
  
}

.service-heading {
  margin: 15px 0;
  text-transform: none;
}

.portfolio-item {
  right: 0;
  margin: 0 0 15px;
}

#portfolio .portfolio-item .portfolio-link {
  position: relative;
  display: block;
  max-width: 400px;
  margin: 0 auto;
  cursor: pointer;
}

#resume .portfolio-item .portfolio-link {
  position: relative;
  display: block;
  max-width: 400px;
  margin: 0 auto;
  cursor: pointer;
	z-index: 999;
	-webkit-clip-path: circle(40% at 50% 50%);
	clip-path: circle(40% at 50% 50%);
}
	

#portfolio .portfolio-item .portfolio-link .portfolio-hover {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-transition: all ease 0.5s;
  -moz-transition: all ease 0.5s;
  transition: all ease 0.5s;
  opacity: 0;
  background: rgba(254, 209, 54, 0.9);
}
#resume {
	direction: rtl;
}
#resume .portfolio-item .portfolio-link .portfolio-hover {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-transition: all ease 0.5s;
  -moz-transition: all ease 0.5s;
  transition: all ease 0.5s;
  opacity: 0;
  background: rgba(254, 209, 54, 0.9);
	z-index:  999;
}

#portfolio .portfolio-item .portfolio-link .portfolio-hover:hover {
  opacity: 1;
}
#resume .portfolio-item .portfolio-link .portfolio-hover:hover {
  opacity: 1;
}

#portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content {
  font-size: 20px;
  position: absolute;
  top: 50%;
  width: 100%;
  height: 20px;
  margin-top: -12px;
  text-align: center;
  color: white;
}
#resume .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content {
  font-size: 20px;
  position: absolute;
  top: 50%;
  width: 100%;
  height: 20px;
  margin-top: -12px;
  text-align: center;
  color: white;
}

#portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content i {
  margin-top: -12px;
}
#resume .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content i {
  margin-top: -12px;
}

#portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content h3,
#portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content h4 {
  margin: 0;
}

#portfolio .portfolio-item .portfolio-caption {
  max-width: 400px;
  margin: 0 auto;
  padding: 25px;
  text-align: center;
  background-color: #fff;
}

#portfolio .portfolio-continue {
	max-width: 100%;
	margin: 0 auto;
	padding: 25px;
	text-align: center;
	background-color: #fff;
}

.portfolio-continue {
	background: #FFFFFF;
	max-width: 100%;
	margin: 0 auto;
	padding: 25px;
}

.round-corner-5 {
	border-radius: 5px;
}

.round-corner-10 {
	border-radius: 10px;
}

.box-shadow-soft {
	box-shadow: 0 0 15px rgba(0,0,0,0.4);
}

.box-shadow-hard {
	box-shadow: 0 0 15px rgba(0,0,0,0.8);
}

#portfolio .portfolio-item .portfolio-caption h4 {
  margin: 0;
  text-transform: none;
}

#portfolio .portfolio-item .portfolio-caption p {
  font-size: 16px;
  font-style: italic;
  margin: 0;
}

#portfolio * {
  z-index: 2;
}

@media (min-width: 767px) {
  .portfolio-item {
    margin: 0 0 30px;
  }
}

.portfolio-modal {
  padding-right: 0px !important;
}

.portfolio-modal .modal-dialog {
	margin: auto;
	margin-top: 60px;
	max-width: 1280px;

}

.portfolio-modal .modal-content {
  padding: 20px 0;
  text-align: center;
}

.portfolio-modal .modal-content h2 {
  font-size: 3em;
  margin-bottom: 15px;
}

.portfolio-modal .modal-content p {
  margin-bottom: 30px;
}

.portfolio-modal .modal-content p.item-intro {
  font-size: 16px;
  font-style: italic;
  margin: 20px 0 30px;
  font-family: 'Droid Serif', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

.portfolio-modal .modal-content ul.list-inline {
  margin-top: 0;
  margin-bottom: 30px;
}

.portfolio-modal .modal-content img {
  margin-bottom: 30px;
}

.portfolio-modal .modal-content button {
  cursor: pointer;
}

.portfolio-modal .close-modal {
  cursor: pointer;
  background-color: transparent;
overflow: hidden;
	border-radius: 50%;
	padding: 0;
}


.portfolio-modal .close-modal:hover {
  opacity: 0.3;
}

.portfolio-modal .close-modal .lr {
  /* Safari and Chrome */
  z-index: 1051;
  width: 2px;
  height: 40px;
  margin-left: 25px;
  /* IE 9 */
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
  background-color: #212529;
}

.portfolio-modal .close-modal .lr .rl {
  /* Safari and Chrome */
  z-index: 1052;
  width: 2px;
  height: 40px;
  /* IE 9 */
  -webkit-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
  background-color: #212529;
}

.portfolio-caption h4 {
	font-size: 90%;
}

.portfolio-caption p {
	font-size: 70%;
}

.timeline {
  position: relative;
  padding: 0;
  list-style: none;
}

.timeline:before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 40px;
  width: 2px;
  margin-left: -1.5px;
  content: '';
  background-color: #e9ecef;
}

.timeline > li {
  position: relative;
  min-height: 50px;
  margin-bottom: 50px;
}

.timeline > li:after, .timeline > li:before {
  display: table;
  content: ' ';
}

.timeline > li:after {
  clear: both;
}

.timeline > li .timeline-panel {
  position: relative;
  float: right;
  width: 100%;
  padding: 0 20px 0 100px;
  text-align: left;
}

.timeline > li .timeline-panel:before {
  right: auto;
  left: -15px;
  border-right-width: 15px;
  border-left-width: 0;
}

.timeline > li .timeline-panel:after {
  right: auto;
  left: -14px;
  border-right-width: 14px;
  border-left-width: 0;
}

.timeline > li .timeline-image {
  position: absolute;
  z-index: 100;
  left: 0;
  width: 80px;
  height: 80px;
  margin-left: 0;
  text-align: center;
  color: white;
  border: 7px solid #e9ecef;
  border-radius: 100%;
  background-color: #fed136;
}

.timeline > li .timeline-image h4 {
  font-size: 10px;
  line-height: 14px;
  margin-top: 12px;
}

.timeline > li.timeline-inverted > .timeline-panel {
  float: right;
  padding: 0 20px 0 100px;
  text-align: left;
}

.timeline > li.timeline-inverted > .timeline-panel:before {
  right: auto;
  left: -15px;
  border-right-width: 15px;
  border-left-width: 0;
}

.timeline > li.timeline-inverted > .timeline-panel:after {
  right: auto;
  left: -14px;
  border-right-width: 14px;
  border-left-width: 0;
}

.timeline > li:last-child {
  margin-bottom: 0;
}

.timeline .timeline-heading h4 {
  margin-top: 0;
  color: inherit;
}

.timeline .timeline-heading h4.subheading {
  text-transform: none;
}

.timeline .timeline-body > ul,
.timeline .timeline-body > p {
  margin-bottom: 0;
}

@media (min-width: 768px) {
  .timeline:before {
    left: 50%;
  }
  .timeline > li {
    min-height: 100px;
    margin-bottom: 100px;
  }
  .timeline > li .timeline-panel {
    float: left;
    width: 41%;
    padding: 0 20px 20px 30px;
    text-align: right;
  }
  .timeline > li .timeline-image {
    left: 50%;
    width: 100px;
    height: 100px;
    margin-left: -50px;
  }
  .timeline > li .timeline-image h4 {
    font-size: 13px;
    line-height: 18px;
    margin-top: 16px;
  }
  .timeline > li.timeline-inverted > .timeline-panel {
    float: right;
    padding: 0 30px 20px 20px;
    text-align: left;
  }
}

@media (min-width: 992px) {
  .timeline > li {
    min-height: 150px;
  }
  .timeline > li .timeline-panel {
    padding: 0 20px 20px;
  }
  .timeline > li .timeline-image {
    width: 150px;
    height: 150px;
    margin-left: -75px;
  }
  .timeline > li .timeline-image h4 {
    font-size: 18px;
    line-height: 26px;
    margin-top: 30px;
  }
  .timeline > li.timeline-inverted > .timeline-panel {
    padding: 0 20px 20px;
  }
}

@media (min-width: 1200px) {
  .timeline > li {
    min-height: 170px;
  }
  .timeline > li .timeline-panel {
    padding: 0 20px 20px 100px;
  }
  .timeline > li .timeline-image {
    width: 170px;
    height: 170px;
    margin-left: -85px;
  }
  .timeline > li .timeline-image h4 {
    margin-top: 40px;
  }
  .timeline > li.timeline-inverted > .timeline-panel {
    padding: 0 100px 20px 20px;
  }
}

.team-member {
  margin-bottom: 50px;
  text-align: center;
}

.team-member img {
  width: 225px;
  height: 225px;
  border: 7px solid #fff;
}

.team-member h4 {
  margin-top: 25px;
  margin-bottom: 0;
  text-transform: none;
}

.team-member p {
  margin-top: 0;
}





section#contact .section-heading {
  color: #fff;
}

section#contact .form-group {
  margin-bottom: 25px;
}

section#contact .form-group input,
section#contact .form-group textarea {
  padding: 20px;
}

section#contact .form-group input.form-control {
  height: auto;
}

section#contact .form-group textarea.form-control {
  height: 248px;
}

section#contact .form-control:focus {
  border-color: #fed136;
  box-shadow: none;
}

section#contact ::-webkit-input-placeholder {
  font-weight: 700;
  color: #ced4da;
  font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

section#contact :-moz-placeholder {
  font-weight: 700;
  color: #ced4da;
  /* Firefox 18- */
  font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

section#contact ::-moz-placeholder {
  font-weight: 700;
  color: #ced4da;
  /* Firefox 19+ */
  font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

section#contact :-ms-input-placeholder {
  font-weight: 700;
  color: #ced4da;
  font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

footer {
  padding: 25px 0;
  text-align: center;
  background: #000;
}

footer div.copyright {
  font-size: 90%;
  line-height: 25px;
  text-transform: none;
  font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	color: #838383;
	text-align: left;
	width: 100%;
}

footer div.footer-nav {
	text-align:center;
	text-decoration: none;
}

footer ul.quicklinks {
  font-size: 90%;
  line-height: 40px;
  margin-bottom: 0;
  text-transform: none;
  font-family: 'Montserrat', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

ul.social-buttons {
  margin-bottom: 0;
}

ul.social-buttons li a {
  font-size: 20px;
  line-height: 40px;
  display: block;
  width: 40px;
  height: 40px;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
  color: white;
  border-radius: 100%;
  outline: none;
  background-color: #212529;
}

ul.social-buttons li a:active, ul.social-buttons li a:focus, ul.social-buttons li a:hover {
  background-color: #fed136;
}
.azar-footer {
	width: 100%;
	height: 40px;
	padding-top: 10px;
	padding-bottom: 10px;
	background-color: #E5E5E5;
	text-align: center;
	font-family: arial;
	color: #454545;
	text-shadow: 0px 2px 2px #FFF, 2px 0px 2px #FFF;
}


/* Fonts */
.homa-font {
	font-family: 'homa';
}
.ir-sans-normal {
	font-family: 'ir-sans-normal';
	line-height: 250%;
}

.ir-sans-slim {
	font-family: 'ir-sans-slim';
	line-height: 250%;
}

.ir-sans-bold {
	font-family: 'ir-sans-bold';
	line-height: 250%;
}

.rtl-right-align {
	direction: rtl;
	text-align: right;
}
.rtl-left-align {
	direction: rtl;
	text-align: left;
}
.rtl-center-align {
	direction: rtl;
	text-align: center;
}
.rtl-justify-align {
	direction: rtl;
	text-align: justify;
	text-align-last: right;
}

.ltr-justify-align {
	direction: ltr;
	text-align: justify;
	text-align-last: left;
}

.font-color-250 {
	color: rgb(240,240,250);
}

.font-color-230 {
	color: rgb(230,230,240);
}

.font-color-210 {
	color: rgb(210,210,220);
}

.font-color-190 {
	color: rgb(190,190,200);
}

.font-color-170 {
	color: rgb(170,170,180);
}

.font-color-150 {
	color: rgb(150,150,160);
}

.font-color-130 {
	color: rgb(130,130,140);
}

.font-color-110 {
	color: rgb(110,110,120);
}

.font-color-90 {
	color: rgb(90,90,100);
}

.font-color-70 {
	color: rgb(70,70,80);
}

.font-color-50 {
	color: rgb(50,50,60);
}

.font-color-30 {
	color: rgb(30,30,40);
}

.font-color-10 {
	color: rgb(10,10,20);
}
/* Background Settings */

.bg-lightdark {
	background-color: #D7D7DC;
}

.dashed-list {
	list-style-type: none;
	margin-top: 30px;
	margin-bottom: 25px;
}

.dashed-list li {
	margin-left: 50px;
	margin-right: 30px;
	margin-bottom: 15px;
}
.dashed-list li:before {
	content: '-';
	position: absolute;
	margin-right: -20px;
}

.modal-hidden {
	display: none;
}

.resume-table tbody tr td {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

@media (max-width: 1200px) {
	.resume-table .spyrow1 {
		display: none;
	}
}
@media (max-width: 1000px) {
	.resume-table .spyrow2 {
		display: none;
	}
}
@media (max-width: 800px) {
	.resume-table .spyrow3 {
		display: none;
	}
}

.resume-table thead, .resume-table tbody {
	width: 100%;
	margin: auto;
}

@media (max-resolution: 1dppx) {
    /* ... */
}
.resume-link img {
	object-fit: none;
	width: auto;
	height: 100%;
	/*-webkit-clip-path: circle(40% at 50% 50%);
	clip-path: circle(40% at 50% 50%);*/
}

#resume h4 {
	overflow: hidden;
	font-family: 'ir-sans-bold';
	font-size: 14px;
	white-space: nowrap;
	text-overflow: ellipsis;
}

#resume .list-group-item {
	overflow: hidden;
	font-family: 'ir-sans-normal';
	font-size: 14px;
	padding: 0;
	padding-top: 10px;
	padding-bottom: 10px;
	border-right: none;
	border-left: none;
	border-bottom: none;
	white-space: nowrap;
	text-overflow: ellipsis;
}
#resume .list-group-item:first-child {
	border-top: none;
}

#resume .list-group-item:last-child {
	border-bottom: none;
}

#resume a {
	font-family: 'ir-sans-normal';
}

.text-limited {
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}

.google-map {
	width: 100%;
	height: 100%;
	min-height: 350px;
}

#contact #ltr {
	direction: ltr;
}

#contact .list-group .list-group-item #phone-icon {
	color: forestgreen;
}

#contact .list-group .list-group-item #fax-icon {
	color: red;
}

#contact .list-group .list-group-item #telegram-icon {
	color: #0059F5;
}

#contact .list-group .list-group-item #address-icon {
	color: orange;
}

#contact .list-group .list-group-item #email-icon {
	color: purple;
}

.about-parallax {
	background-image: url(../images/parallax1.jpg);
	background-position: center;
	background-attachment: fixed;
	background-size: cover;
}
.services-parallax {
	background-image: url(../images/parallax2.jpg);
	background-position: center;
	background-attachment: fixed;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: 0 400px;
}

/* TimeLine */

#projects {
  display: flex;
  background-color: #031625;
}
#projects:hover .tl-item {
  width: 23.3333%;
}

.tl-item {
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  position: relative;
  width: 50%;
  height: 90vh;
  min-height: 600px;
  color: #fff;
  overflow: hidden;
  transition: width 0.5s ease;
}
.tl-item:before, .tl-item:after {
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.tl-item:after {
  background: rgba(3, 22, 37, 0.75);
  opacity: 1;
  transition: opacity 0.5s ease;
}
.tl-item:before {
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, black 90%);
  z-index: 1;
  opacity: 0;
  -webkit-transform: translate3d(0, 0, 0) translateY(50%);
          transform: translate3d(0, 0, 0) translateY(50%);
  transition: opacity 0.5s ease, -webkit-transform 0.5s ease;
  transition: opacity 0.5s ease, transform 0.5s ease;
  transition: opacity 0.5s ease, transform 0.5s ease, -webkit-transform 0.5s ease;
}
.tl-item:hover  {
  width: 100% !important;
}
.tl-item:hover:after {
  opacity: 0;
}
.tl-item:hover:before {
  opacity: 1;
  -webkit-transform: translate3d(0, 0, 0) translateY(0);
          transform: translate3d(0, 0, 0) translateY(0);
  transition: opacity 1s ease, -webkit-transform 1s ease 0.25s;
  transition: opacity 1s ease, transform 1s ease 0.25s;
  transition: opacity 1s ease, transform 1s ease 0.25s, -webkit-transform 1s ease 0.25s;
}
.tl-item:hover .tl-content {
  opacity: 1;
  -webkit-transform: translateY(0);
          transform: translateY(0);
  transition: all 0.75s ease 0.5s;
}

.btn-transparent, .btn-transparent:active {
  background-color: rgba(0,0,0,0.25);
  border-color: rgba(255,255,255,0.3);
	color: #FFFFFF;
	font-family: 'ir-sans-bold';
	padding: 10px;
}

.btn-transparent:hover {
  background-color: rgba(0,0,0,0.50) !important;
  border-color: rgba(255,255,255,0.6) !important;
  color: #FFFFFF;
}



.tl-item:hover .tl-bg {
  -webkit-filter: grayscale(0);
          filter: grayscale(0);
}
/* ---------- for Mobile -------*/

/* --------- Mobile End ---------*/

.tl-content {
  -webkit-transform: translate3d(0, 0, 0) translateY(25px);
          transform: translate3d(0, 0, 0) translateY(25px);
  position: relative;
  z-index: 1;
  text-align: center;
  margin: 0 1.618em;
  top: 75%;
  opacity: 0;
}
.tl-content h1 {
  font-family: 'ir-sans-bold';
  text-transform: uppercase;
  color: #FF9E00;
  font-size: 1.44rem;
	direction: rtl
}
.tl-content p {
	font-family: 'ir-sans-bold';
	direction: rtl;
}
.tl-year {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translateX(-50%) translateY(-50%);
          transform: translateX(-50%) translateY(-50%);
  z-index: 1;

}
.tl-year p {
  font-family: 'ir-sans-normal';
  font-size: 2.5rem;
  line-height: 0;
	white-space: nowrap;
	text-overflow: ellipsis;
	color: rgba(255,255,255,0.5);
}

.tl-bg {
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-size: cover;
  background-position: center center;
  transition: -webkit-filter 0.5s ease;
  transition: filter 0.5s ease;
  transition: filter 0.5s ease, -webkit-filter 0.5s ease;
  -webkit-filter: grayscale(100%);
          filter: grayscale(100%);
}

.media-container-row {
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
}

.media-container-row {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-content: center;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-align-items: start;
    -ms-flex-align: start;
    align-items: start;
}