/*********************** Header **************************/
@font-face {
	font-family: 'Montserrat-Bold';
	src: url('../fonts/main/Montserrat-Bold.eot');
	src: url('../fonts/main/Montserrat-Bold.woff2') format('woff2'),  url('../fonts/main/Montserrat-Bold.woff') format('woff'),  url('../fonts/main/Montserrat-Bold.ttf') format('truetype'),  url('../fonts/main/Montserrat-Bold.svg#Montserrat-Bold') format('svg'),  url('../fonts/main/Montserrat-Bold.eot?#iefix') format('embedded-opentype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Montserrat-Light';
	src: url('../fonts/main/Montserrat-Light.eot');
	src: url('../fonts/main/Montserrat-Light.woff2') format('woff2'),  url('../fonts/main/Montserrat-Light.woff') format('woff'),  url('../fonts/main/Montserrat-Light.ttf') format('truetype'),  url('../fonts/main/Montserrat-Light.svg#Montserrat-Light') format('svg'),  url('../fonts/main/Montserrat-Light.eot?#iefix') format('embedded-opentype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Montserrat-Medium';
	src: url('../fonts/main/Montserrat-Medium.eot');
	src: url('../fonts/main/Montserrat-Medium.woff2') format('woff2'),  url('../fonts/main/Montserrat-Medium.woff') format('woff'),  url('../fonts/main/Montserrat-Medium.ttf') format('truetype'),  url('../fonts/main/Montserrat-Medium.svg#Montserrat-Medium') format('svg'),  url('../fonts/main/Montserrat-Medium.eot?#iefix') format('embedded-opentype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Montserrat-Regular';
	src: url('../fonts/main/Montserrat-Regular.eot');
	src: url('../fonts/main/Montserrat-Regular.woff2') format('woff2'),  url('../fonts/main/Montserrat-Regular.woff') format('woff'),  url('../fonts/main/Montserrat-Regular.ttf') format('truetype'),  url('../fonts/main/Montserrat-Regular.svg#Montserrat-Regular') format('svg'),  url('../fonts/main/Montserrat-Regular.eot?#iefix') format('embedded-opentype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Montserrat-SemiBold';
	src: url('../fonts/main/Montserrat-SemiBold.eot');
	src: url('../fonts/main/Montserrat-SemiBold.woff2') format('woff2'),  url('../fonts/main/Montserrat-SemiBold.woff') format('woff'),  url('../fonts/main/Montserrat-SemiBold.ttf') format('truetype'),  url('../fonts/main/Montserrat-SemiBold.svg#Montserrat-SemiBold') format('svg'),  url('../fonts/main/Montserrat-SemiBold.eot?#iefix') format('embedded-opentype');
	font-weight: normal;
	font-style: normal;
}
.header {
	background: #76102b;
	text-transform: none;
	padding-left: 0;
	padding-right: 0;
}
.logo {
	margin-top: 4%;
}
.header, .header a {
	color: #fff;
}
.header nav {
	border-left: 1px solid #540b21;
}
.truncate {
	width: 200px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.top-strip {
	background-color: #7e1e37;
	font-family: 'Montserrat-Light';
	border: 1px solid #540b21;
	padding: 7px 0;
	font-family: 'Montserrat-Light';
}
.top-strip a:hover {
	color: #CCC;
}
.text-size {
	border-right: 1px solid #4c1221;
	width: 10%;
	float: left;
	font-size: 1.083em;
	padding: 2px 0;
}
.text-size a, .text-size .pipe {
	text-decoration: none;
}
.text-size a:hover {
	background-color: #8b354b
}
.text-size a {
	display: inline-block;
	padding: 0 1px;
	font-size: 0.833em;
}
.pipe {
	color: #9c4e63
}
.top-strip li {
	border-right: 0px solid #4c1221;
}
/*.top-strip .icon-color_blindness {
	font-size: 2.25em;
	line-height: 18px;
}*/
.top-strip li:nth-child(5), .top-strip li:nth-child(6), .top-strip li:nth-child(7) {
	border-right: none;
}
.top-strip li:last-child {
	border : none;
}
.top-strip ul {
	text-align: center;
}
.accesibility-icon {
	font-size: 1.583em;
	line-height: 18px;
}
.accesibility-nav li:first-child .accesibility-icon {
	font-size: 2.333em;
}
.top-strip a:hover {
	text-decoration: none;
}
.header nav ul {
	text-align: center;
}

#topnav li:last-child {
	border: none;
}
.navigation ul {
	margin-bottom: 0;
	padding: 0;
}
.nav-icon {
	font-size: 2.57em;
}
.navigation li:hover, .navigation li.selected {
	background-color: #8b354b;
	color: #fff !important;
}
.navigation li:hover a {color: #fff !important;}
.navigation li {
	float: left;
	width: 14%;
	padding: 10px 0 20px;
	font-size: 1.167em;
}
.navigation span {
    display: block;
    text-transform: none;
    font-weight: normal;
    margin-top: 10px;
}
.navigation li a {
	text-decoration: none;
	border-right: 1px solid #914055;
	display: block;
}
.navigation li:last-child a {
	border-right: 0;
}
.accesibility-nav li {
	width: 10%;
	float: left;
}
.accesibility-nav li a {
	text-decoration: none;
}
.login-signup {
	padding: 2px 0 3px;
	border-left: 1px solid #4c1221 !important;
	border-right: none !important;       /*added 22-11-2017*/
}
.login-signup, .arab, .logged-in {
	font-size: 1.083em !important
}
/************* Drop down - *************/
li.dropdown {
	width: 20%;
}
.user-login {
	background: none;
	text-transform: none;
	font-size: 1em;
	outline: none;
	color: #fff;
	font-family: 'Montserrat-Light';
	outline: none;
	border-right: 1px solid #4c1221;
	border-radius: 0 !important
}
.btn.user-login {
	padding: 0 10px
}
.user-login .caret {
	margin-top: 7px !important;
}
.user-login span:first-child {
	padding-right: 15px;
}
.login-user {
	display: inline-block;
	width: 100px;
}
.user-login:hover {
	background-color: #8b354b;
	border-radius: 0;
	outline: none;
}
.user-login:active, .user-login:hover, .user-login:focus, .user-login:visited {
	color: #fff !important;
}
.user-icon {
	font-size: 1.3em;
	margin-right: 10px;
}
.user-dropdown li {
	width: 100%;
	color: black;
	text-transform: none;
	text-align: left;
	font-size: 0.833em;
	border-right: none;
	margin-bottom: 5px;
}
.user-dropdown:after {
	display: none;
}
.responsive-menu .user-login:focus {
	background: none;
}
.login-success span:first-child {
	color: #000;
}
.user-dropdown li:first-child, .user-dropdown li:last-child {
	color: #76102b;
	text-transform: none;
	font-size: 1.000em;
}
.user-dropdown li:last-child {
	margin-bottom: 0;
}
.user-dropdown>li>a:first-child {
	color: #76102b;
	padding: 0;
}
.user-dropdown li:nth-child(2) {
	font-weight: bold;
}
.user-dropdown li, .user-dropdown li span {
	color: #9a9a9a;
	display: block;
}
.user-dropdown li span:first-child {
	margin-right: 30px;
}
.user-dropdown:after {
	content: "";
	position: absolute;
	right: 40%;
	top: -22px;
	border-style: solid;
	border-width: 0 17px 17px 17px;
	border-color: transparent transparent #ffffff transparent;
}
.user-dropdown {
	border: 8px solid #fffefe;
	margin: 15px auto;
	width: 210px;
	border-radius: 0;
	padding: 10px;
	min-width: 160px;
}
.vertical-nav li.active:before {
	content: "";
	position: absolute;
	right: -2%;
	margin-top: 30px;
	border-style: solid;
	border-width: 9px 0 10px 9px;
	border-color: transparent transparent transparent #fff;
	z-index: 900000;
}
.header nav li ul li {
	border: none;
}
.header nav li ul {
	text-align: left;
}
.display-on {
	display: block;
	transition-duration: 0.9s;
}
.animated {
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
}
@-webkit-keyframes fadeIn {
 0% {
 opacity: 0;
}
 100% {
 opacity: 1;
}
}
 @keyframes fadeIn {
 0% {
 opacity: 0;
}
 100% {
 opacity: 1;
}
}
.fadeIn {
	-webkit-animation-name: fadeIn;
	animation-name: fadeIn;
}
/**********************header end***************/

/****************** Responsive *******************/

.responsive-navbar {
	background: #76102b;
	border: none;
	margin-bottom: 0;
}
.btn-responsive-open, .btn-responsive-close {
	border: none;
	float: left;
}
.btn-responsive-close a {
	top: 0;
}
.topnav .active {
	background: red;
}
.btn-responsive-open span {
	background: red;
}
.btn-responsive-open a, .btn-responsive-close a {
	color: #fff;
	opacity: 1;
	font-size: 50px;
}
.responsive-menu {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 1000;
	width: 100%;
	height: 100%;
	overflow-x: hidden;
	float: left;
}
.responsive-outer {
	width: 15%;
	height: 135%;
	position: absolute;
	top: 0;
	right: 0;
}
.responsive-outer button {
	height: 100%;
	width: 100%;
}
.responsive-menu li {
	text-align: left;
}
.responsive-items li {
	line-height: 5;
}
.navbar-default .navbar-toggle .icon-bar {
	background: #fff;
}
.navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover {
	background: none;
}
.responsive-logo {
	margin-top: 10px;
}
.responsive-logo-inner {
	margin-top: 10px;
	text-align: left;
}
.navbar-header {
	padding-left: 0;
}
.responsive-login {
	margin-top: 15px;
	font-family: 'Montserrat-Light';
}
.responsive-login a:hover { color:#CCC;}
.eng-arab img {
	margin-top: -3px;
}
.responsive-login a:first-child {
	margin-right: 10px;
}
.responsive-login a {
	font-size: 1.250em;
}
.responsive-login a.eng-arab { border-left:1px solid #914055; padding-left:10px;}
.navbar-elements {
	margin: 0;
}
.resp-menu {
	font-size: 3em;
	display: inline-block;
	line-height: 24px;
	cursor: pointer;
	margin: 1px 10px 0 5px;
		font-family: 'Montserrat-Light';
}
.sidenav {
	height: 100%;
	width: 0;
	position: fixed;
	z-index: 1;
	top: 0;
	left: 0;
	background-color: #76102b;
	overflow: hidden;
	transition: 0.5s;
	padding-top: 60px;
}
.sidenav li {
	padding: 8px 8px 8px 25px;
}
.sidenav a {
	text-decoration: none;
	font-size: 1.167em;
	color: #fff;
	display: block;
	transition: 0.3s
}
.sidenav a:hover, .offcanvas a:focus {
	color: #efefef;
}
.sidenav .closebtn {
	position: absolute;
	top: 0;
	right: 15px;
	font-size: 3em;
}
.sidenav ul li {
	float: left;
	font-size: 1em;
}
.side-nav-primary {
	border-bottom: 1px solid #914055;
	width: 100%
}
.side-nav-primary li {
	width: 25%;
	padding-bottom: 10px;
}
.side-nav-primary li:first-child {
	padding-left: 10px;
}
.side-nav-primary li:first-child .accesibility-icon {
	font-size: 2em;
}
.side-nav-second li {
	width: 100%;
	border-bottom: 1px solid #914055;
	text-align: left;
	padding: 15px 0
}
.logged-in {
	position: relative;
	width: 20% !important
}
.nav-logo {
	position: absolute;
	top: 15px;
	left: 15px;
}

/* added by karim - readspeaker start*/
.top-strip li:nth-child(5) {
    width: 28%;
}
.top-strip li:nth-child(6) {
    width: 27%;
}
.top-strip li:nth-child(7) {
    width: 12%;
}
.top-strip li:nth-child(5){ width: 30%; padding:1px;}
.top-strip li:nth-child(6){ display: block;}

.accesibility-nav li {
    width: 5%;
}
.rsbtn {width:100% !important ; margin-left:10px}
.rsbtn.rsexpanded .rsbtn_exp{ margin-top: 0px; margin-left: 0px;}
.rsbtn .rsbtn_powered .rsbtn_btnlabel {display:none !important}
.login-signup {text-align:right; }
.readSpeakerMob { display:none;}
ul.dropdown-menu.user-dropdown li {width:100% !important}
.rsbtn.rspopup{width: auto !important;}

.rsbtn {
    width: 100% !important;
    margin-left: 10px;
    margin-bottom: 0!important;
    margin-top: -6px;
}

@media only screen and (max-width : 1024px)
{
.readSpeakerMob 
{ 
	position:absolute !important;
	left:4px ;
	top:40px;
}
.rsbtn .rsbtn_left .rsbtn_text span {text-indent:-9999px;}
.rsbtn { width:200% !important}

.arabic .rsbtn {width: 100% !important}
.arabic .readSpeakerMob {left:auto; right:0}

}
/* added by karim - readspeaker end*/

.responsive-navbar .responsive-login a {
    font-family: 'GESSTwoMedium-Medium' !important;
}

/* 16Jan2019 e-accesibility fix by kamal start*/
.linecontent li a:hover, .linecontent li a:focus {
	 text-decoration : underline;
}
/* 16Jan2019 e-accesibility fix by kamal end*/
