@charset "UTF-8";
/* CSS Document */

/*** TEDx Beirut Website CSS Document ***/


/*** START CSS Reset ***/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, a:link, a:visited, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, a:link, a:visited, img, a:link img, a:visited img {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	text-rendering: optimizeLegibility;
	vertical-align: baseline;
	background: transparent;
	line-height: 1em;
	quotes: none;
  list-style: none;
}
body {
	background: #fff;
	color:black;
	text-align: left;
  font-size: 96%;
  /* font-family: myriad-pro-semiextended, sans-serif; */
	text-rendering: optimizeLegibility;
	margin: 0 auto;
}
a {
	color: black;
  border-bottom: solid black 2px !important;
  font-weight: 600;
  text-decoration: none;
}
a:visited {
  color: black;
  border-bottom: solid black 4px !important;
  font-weight: 600;
  text-decoration: none;  
}
p {
  font-size: 16px;
  line-height: 22px;
  /* font-family: myriad-pro-semiextended, sans-serif; */
  text-rendering: optimizeLegibility;
  color:black;
}
h1 {
  font-size: 1.8em;
  font-weight: 500;
  text-rendering: optimizeLegibility;
  line-height: 127%;
  color: #ed1818;
}
h2 {
  font-size: 21px;
  line-height: 28px;
  font-weight: 900;
  text-rendering: optimizeLegibility;
  /*margin-top: 20px;*/
  line-height: 125%;
}
h3 {
  font-size: 1.2em;
  font-weight: 100;
  text-rendering: optimizeLegibility;
}
h4 {
  font-size: 21px;
  line-height: 28px;
  /* font-family: myriad-pro-semiextended, sans-serif; */
  text-rendering: optimizeLegibility;
  color:black;
  font-weight: 400 !important;
  margin-top: 20px;
}
h5 {
  font-size: 0.8em;
  font-weight: 100;
  text-rendering: optimizeLegibility;
}
input[type="text"] {
	border-top: 1px solid #656565;
	border-right: 1px solid #AFAFAF;
	border-bottom:  1px solid #C3C3C3;
	border-left:  1px solid #999999;
	width: 94%;
	font-size: 1em;
	/* font-family: "Lucida Grande", Verdana, Arial, sans-serif; */
	text-rendering: optimizeLegibility;
	color: black;
	font-weight: 100;
	line-height: 120%;
	padding: 10px 10px 14px 10px;
	vertical-align: middle;
	white-space: nowrap;
}
/*** END CSS Reset ***/

/** START Generic classes **/
.hidden {
	display: none;
}
.right {
	float: right;
}
.left {
	float: left;
}
.clear {
	clear: both;
}
/** END Generic classes **/

/* START Page */
#wrapper {
  background-color: #FFFFFF;
  height: auto !important;
  height: 100%;
  min-height: 100vh;
  position: absolute;
  width: 100%;
  overflow: hidden;
}
/* END Page */

/* START Menu */
#header {
  height: 50px;
  width: 100vw;
  padding: 35px 0;
  position: fixed;
  z-index: 20;
  background: white;
}
  .logo {
    float: right;
    margin-right: 70px;
    margin-bottom: 46px;
    position: absolute;
    right: 0;
    bottom: 0;
  }
  .logo div {
    cursor: pointer;
    border: 0;
    margin: 1px 15px 4px;
    /* font-family: myriad-pro-semiextended, sans-serif; */
    font-weight: 400;
    font-style: swap;
    font-size: 18px;
    color: black;
  }
  .bold-header {
    font-weight: 900 !important;
  }
  #header .navigation {
    float: left;
    margin-left: 70px;
    margin-bottom: 30px;
    position: absolute;
    left: 0;
    bottom: 0;
  }
    #header .navigation div {
      display: inline-block;
      margin-right: 45px;
      vertical-align: middle;
    }
    #header .navigation div span {
      cursor: pointer;
      margin: 1px 1px 4px;
      /* font-family: myriad-pro-semiextended, sans-serif; */
      font-weight: 400;
      font-style: swap;
      font-size: 16px;
      line-height: 18px;
      letter-spacing: 0.32px;
      color: black;
      text-transform: capitalize;
    }

    #header .navigation div.selected span {
      font-weight: 900;
    }

    *+html #header .navigation div span { /* IE7 only */
	    /* font-family: myriad-pro, sans-serif; */
      font-weight: 700;
      font-style: swap;
      font-size: 16px;
      behavior: url(css/PIE.htc);
	  }

    .clickable:hover span{
      /* font-weight: 900 !important;  */
      /* text-shadow: -0.06ex 0 black, 0.06ex 0 black; */
    }
    .clickable {
      border-bottom: 3px solid transparent;
    }
    .clickable:hover {
      border-bottom: solid 3px black;
    }

    #header .navigation .selected {
      border-bottom: solid 3px black;
    }
    .no-borders {
      border: 0 !important;
    }
    .underline {
      border-bottom: solid 3px black !important;
    }
/* If you want the selected menu item to be diabled, uncomment the commented section below. Also uncomment (4. Generate the HTML of the menu item.) in en/index.php, and comment the same uncommented version. */

/*
    #header .navigation div.selected span:hover {
      color: #555555;
      cursor: pointer;
      text-shadow: 0 1px 1px #1C1C1C;
      border: 0;
      padding: 1px 15px 4px;
      background: black;
      cursor: default;
    }
*/
    *+html #header .navigation div.selected span:hover { /* IE7 only */
    }
    #header #updateMeBTN {
      position: relative;
      text-decoration: none;
      cursor: pointer;
      margin: 0 0 13px 1px;
      background: #FF2B06;
      color: white;
      text-align: center;
      border: 0;
      padding: 1px 20px 2px 15px;
      font-weight: 100;
	    padding /*\**/: 3px 20px 3px 15px\9; /* IE8 only */
      -webkit-border-radius: 11px;
      -moz-border-radius: 11px;
      border-radius: 11px;
      behavior: url(css/PIE.htc);
    }
    *+html #header #updateMeBTN { /* IE7 only */
	  display: block;
	  padding: 4px 20px 4px 15px;
    }
    #header #updateMeBTN:hover {
      background: #EEEEEE;
      color: #555555;
    }
    /** START Search **/
    #header #searchFLD {
      position: relative;
      margin: -3px 0 13px 0;
      width: 128px;
      padding: 0;
      background: #E4E4E4;
      color: #787878;
      text-align: left;
      height: 23px;
      -webkit-border-radius: 11px;
      -moz-border-radius: 11px;
      border-radius: 11px;
      behavior: url(css/PIE.htc);
    }
    *+html #header #searchFLD { /* IE7 only */
      margin: 0px 0 13px 0;
    }
      #header #searchFLD form {
        background: url(../images/Button-Search-Icon.png) center right no-repeat;
        margin: 0 3px 0 0;
        padding: 0;
      }
      #header #searchFLD .text-input {
        font-size: 1em;
        /* font-family: "Lucida Grande", Verdana, Arial, sans-serif; */
        text-rendering: optimizeLegibility;
        font-weight: lighter;
        background: none;
        border: none;
        color: #666;
        width: 85px;
        outline: 0;
        height: 23px;
        padding: 0 0 0 10px;
        padding /*\**/: 3px 0 0 10px\9; /* IE8 only */
        height /*\**/: 20px\9; /* IE8 only */
      }
      *+html #header #searchFLD .text-input { /* IE7 only */
        height /*\**/: 18px\9;
      }
    /** END Search **/

.redBTN {
  color: white;
  text-shadow: 0 1px 1px #2B0205;
}
.smallParagraph {
  font-size: 0.85em;
}
/* END Menu */

/* START Pop Up Window */
#fancybox-outer {
  padding: 0;
}
#popUpWrapper {
	display: inline-block;
	background: #444444;
	padding: 10px;
	margin: auto;
}
#popUpContent {
	background: #F5F5F5;
	padding: 45px;
}
#popUpContent h1 {
	color: #FF2B06;
}
#popUpContent h3 {
	color: #FF2B06;
}
#popUpContent h5 {
	color: #787878;
}
	#popUpContent input[type="submit"] {
		cursor: pointer;
		background: #FF2B06;
		border: 1px solid #BA5F60;
		-webkit-border-radius: 11px;
		-moz-border-radius: 11px;
		border-radius: 11px;
		-webkit-box-shadow: #BFBFBF 0px 1px 0px;
		-moz-box-shadow: #BFBFBF 0px 1px 0px;
		box-shadow: #BFBFBF 0px 1px 0px;
		behavior: url(css/PIE.htc);
		padding: 1px 12px;

		font-size: 1em;
		/* font-family: "Lucida Grande", Verdana, Arial, sans-serif; */
		text-rendering: optimizeLegibility;
		color: white;
		font-weight: 100;
		line-height: 120%;
		text-align: center;
		vertical-align: middle;
		white-space: nowrap;
	}
	#popUpContent input[type="submit"].disabled {
		background: #EEEEEE;
		color: #CCCCCC;
		cursor: default;
		border: none;
	}
	#popUpContent .red {
		background: #FFDCDC;
	}
	#popUpContent .green {
		background: #DCFFDC;
	}
/* END Pop Up Window */

/* START Content */
#contentContainer {
  background-color: none;
  margin-top: 120px;
  margin-bottom:100px;
}
#content {
  min-height: 365px;
  margin: 0 auto;
  width: 975px;
  display: grid;
}
#content.non-homepage-margins {
  width: 1157px;
  max-width: calc(100vw - 120px);
  padding-top: 65px;
}
  a.backToPrimaryPageLink {
    color: #542491;
    text-shadow: 0 1px 0 #FFFFFF;
    font-size: 0.8em;
    margin-top: 55px;
    visibility: hidden;
    /*position: absolute;
    padding-top: 10px;*/
  }
  .section {
    position: relative;
    display: inline-block;
    width: 100%;
  }
    .section td {
      vertical-align: middle;
    }
    .section h1 {
      /*padding: 0 0 6px 0;*/
      color: black;
      /* font-family: myriad-pro-semiextended, sans-serif; */
      font-size: 26px;
      line-height: 30.32px;
      letter-spacing: 0.52px;
      font-weight: bold;
      margin-bottom: 40px;
    }
    .section h2, .section h3, .section h4, .section h5 {
      color: black;
      /* font-family: myriad-pro-semiextended, sans-serif; */
    }
    .section p {
      margin-top:9px;
    }
    .section p:first-child {
      margin-top: 0;
    }
    *+html section input[type="button"] {  /* IE7 only */
      width /*\**/: auto;
      overflow /*\**/: visible;
    }
    .section input[type="button"] {
      position: relative;
      font-size: 1em;
      border: 0;
      background: #EEE url('../images/Button-Arrow-Icon.png') no-repeat right center;
      padding: 2px 25px 3px 15px;
      text-align: left;
      color: #555555;
      text-shadow: 0 1px 0 #FFF;
      cursor: pointer;
      margin: 0 0 0 1px;
      white-space: normal;
      -webkit-border-radius: 11px;
      -moz-border-radius: 11px;
      border-radius: 11px;
      -webkit-box-shadow: #BFBFBF 0px 1px 0px;
      -moz-box-shadow: #BFBFBF 0px 1px 0px;
      box-shadow: #BFBFBF 0px 1px 0px;
      behavior: url(css/PIE.htc);
    }
    .section input[type="button"]:hover {
      background: #FF2B06 url('../images/Button-Arrow-Icon_mouse-over.png') no-repeat right center;
      color: white;
      text-shadow: none;
      border: 0;
      padding: 2px 25px 3px 15px;
      -webkit-border-radius: 11px;
      -moz-border-radius: 11px;
      border-radius: 11px;
    }
    .section input[type="button"].file {
      background: #EEE url('../images/Button-Download-Icon.png') no-repeat right center;
    }
    .section input[type="button"].file:hover {
      background: #FF2B06 url('../images/Button-Download-Icon_mouse-over.png') no-repeat right center;
    }
    .section .button {
      padding: 10px 0 0 0;
      margin: 0 0 0 0;
    }
  /* START horizontalImageRight layout */
  .horizontalImageRight {
    padding: 0;
    margin-left: calc(calc(calc(975px - 100vw)/2) + 20px);
  }
    .horizontalImageRight video {
      padding: 0;
    }
    .horizontalImageRight a.imageLink video {
      padding: 0;
      width: 25vw;
    }
    .horizontalImageRight {
      vertical-align: top;
    }
  /* END horizontalImageRight layout */
  /* START horizontalImageLeft layout */
  .horizontalImageLeft {
    padding: 0;
    margin: 4px;
  }
    .horizontalImageLeft video {
      padding: 0;
    }
    .horizontalImageLeft a.imageLink video {
      padding: 0;
    }
    .horizontalImageLeft td {
      vertical-align: top;

    }
  /* add a top border to the left section */
  .border-top{
    border-top: solid 3px black; 
    padding-top: 15px; /*TODO*/
  }
.display-mobile {
display:none;
}
  @media only screen and (orientation: portrait) {
    .display-mobile {
display:block;
}
    .border-top {
      border-top: unset;
    }
    .row-content {
      border-top: solid 3px black;
      padding-top:20px;
      border-bottom: solid 3px black; 
      padding-bottom: 20px;
      margin-top: 40px;
      margin-bottom: 40px;
      width: calc(100vw - 130px);
    }
    td {
      display: block;
    }
  }
  /* END horizontalImageLeft layout */
  /* START verticalImageTop layout */
  .verticalImageTop {
    width: 25vw;
    float: left;
    overflow: hidden;
  }
    .verticalImageTop video {
      padding: 0;
    }
    .verticalImageTop a.imageLink video {
      padding: 0;
      height: 101%;
    }
    .verticalImageTop {
      vertical-align: top;
      width: 25vw;
      height: calc(calc(25vw * 400)/435);
    }
      .verticalImageTop div.button {
        width: 25vw;
      }
      .verticalImageTop div.button a {
        width: 25vw;
        /* font-family: "Lucida Grande", Verdana, Arial, sans-serif; */
        font-weight: bold;
        font-size: 9pt;
        color: #686160;
        text-shadow: 0 1px 0 #FFF;
      }
        .verticalImageTop td div.button a:hover {
          color: #4F348E;
        }
    .display-on-hover center{
      /* font-family: myriad-pro-semiextended, sans-serif; */
      color: white;
      font-weight: 400 !important;
      font-size: 16px;
    }
    .verticalImageTop h2 {
      padding: 0;
      margin: auto;
      color: white;
      text-shadow: unset;
      font-weight: 900 !important;
      font-size: 18px !important;
      padding: 8px;
    }
    .verticalImageTop p {
      /* font-family: myriad-pro-semiextended, sans-serif; */
      color: white;
      font-size: 18px !important;
      padding: 0;
      margin: auto;
      color: white;
      text-shadow: unset;
      font-weight: 400 !important;
      padding-right: 7px;
      padding-left: 7px;
    }
  .verticalImageTopContainer {
    padding: 0;
    display: inline-block;
    width: 100vw;
    margin: 0;
    margin-left: calc(calc(975px - 100vw)/2);
    /*margin-bottom: -2px;
    margin-top: -2px;*/
    overflow: hidden;
  }
  .verticalImageTopSeparator {
    width: 75px;
    float: left;
  }
  /* END verticalImageTop layout */
  /* START smallHorizontalImageLeft layout */
  .smallHorizontalImageLeft {
    width: 25vw; /* This was originally 275px, but we decreased it by 1px because it was breaking on Firefox for Patricia Zougheib. Note that making this 274px means that these sections do not align with the 975px width of the design :( .*/
    float: left;
  }
  .smallHorizontalImageLeft:hover {
    text-decoration: none;
    margin: -10px;
    padding: 10px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    -webkit-box-shadow: #E3E3E3 0px 1px 0px;
    -moz-box-shadow: #E3E3E3 0px 1px 0px;
    box-shadow: #E3E3E3 0px 1px 0px;
    background: #FFFFFF;
    behavior: url(css/PIE.htc);
  }
    .smallHorizontalImageLeft video.left {
      padding: 0;
    }
  .smallHorizontalImageLeftContainer {
    padding: 0;
    display: inline-block;
    width: 25vw;
  }
  .smallHorizontalImageLeftContainer p {
    font-size: 0.8em;
  }
  .smallHorizontalImageLeftSeparatorContainer {
    float: left;
    height: 100px;
  }
  .smallHorizontalImageLeftFirstSeparator {
    width: 37px;
    float: left;
    height: 100px;
    border-right: 1px solid #D2D2D2;
  }
  .smallHorizontalImageLeftSecondSeparator {
    width: 37px;
    float: left;
    height: 100px;
  }

  .overlay-front {
    cursor: pointer;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 10;
  }

  .overlay-back {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 5;
  }

  .display-on-hover {
    opacity: 0;
    transition: all .25s ease-in-out;
    -moz-transition: all .25s ease-in-out;
    -webkit-transition: all .25s ease-in-out;
    -o-transition: all .25s ease-in-out;
  }

  .display-on-hover.opacity-1 {
    /*background-color: rgba(0, 0, 0, 0.7) !important;*/
    opacity: 1 !important;
  }

  /* .display-on-hover:hover {
    background-color: rgba(0, 0, 0, 0.7);
    opacity: 1;
  } */

  .display-on-hover:before {      /* create a full-height inline block pseudo-element */
    content: ' ';
    display: inline-block;
    vertical-align: middle; /* vertical alignment of the inline element */
    height: 100%;
  }

  .display-on-hover center{
    display: inline-block;
    vertical-align: bottom;
    text-align: left;
    padding-left: 40px;
    padding-right: 40px;
    padding-bottom: 35px;
    max-width: 99%;
  }

  /*TODO*/
  /*This is added to make grey images invisible*/
  /*They were added as transperant when the background was grey*/
  /*table img{
    opacity: 0;
  }*/

  @media only screen and (orientation: portrait) {
    #header {
      height: 120px;
      padding: 50px 0;
    }
    #contentContainer {
      margin-top: 240px;
    }
    .logo {
      margin-bottom: 125px;
    }
    .logo img {
      width: 350px !important;
      height: 70px !important;
    }
    #header .navigation div span {
      font-size: 28px;
      line-height: 25px;
    }
    .logo div {
      font-size: 26px;
    }
    .smallHorizontalImageLeftContainer{
      width: 50vw !important;
    }
    .verticalImageTop {
      width: 50vw !important;
      height: 50vw !important;
      margin: 0 !important;
    }
    .verticalImageTop td {
      width: 50vw !important;
      height: 50vw !important;
    }
    .verticalImageTop td div.button {
      width: 50vw !important;
      height: 50vw !important;
    }
    .verticalImageTop td div.button a {
      width: 50vw !important;
      height: 50vw !important;
    }
    .horizontalImageRight a.imageLink video {
      width: 50vw;
      height: 50vw;
    }
    .verticalImageTop a.imageLink video {
      width: 50vw;
      height: 50vw;
      object-fit: cover;
    }
  }
  /* END verticalImageTop layout */
/* END Content */

/* START Social bar */

#socialBar {
background: #ECEAE2 url(../images/footer-Shadow.png) top left repeat-x;
overflow: hidden;
margin: auto;
}

#socialBar div {
display: block;
}

#socialBar h1, #socialBar h2, #socialBar h3, #socialBar h4 {
color: #171942;
padding: 0 0 20px 0;
/* font-family: "Myriad Pro", Verdana, Arial, sans-serif; */
font-size: 10pt;
font-weight: bold;
text-shadow: 0 1px 0 #FFFFFF;
}

#socialBar .contentContainer {
margin: 25px auto;
width: 975px;
}

#socialBar .contentArea {
width: 625px;
}

#socialBar .sidebar {
width: 275px;
}

/* END Social bar */

/* START Footer */
#footer {
    padding: 40px 0;
    position: absolute;
    width: 100vw;
    bottom: 0;
    /*margin: 40px 70px;
    overflow: hidden;
    width: 975px;
    padding-bottom: 10px; */
}
.instagram-icon {
  margin-left: 110px !important;  
}

#footer a {
  position: absolute;
  margin-left: 70px;
  border-bottom: none !important;
  bottom: 32px;
}

#footer div span {
  /* font-family: myriad-pro-semiextended, sans-serif; */
  font-size: 12px;
  line-height: 13.59px;
  letter-spacing: 0.24px;
  color: #000000;
}

  #credits {
    float: left;
    font-weight: 100;
  }
  #credits .creditsLogo {
    margin-bottom: 35px;
  }
  #credits .developerLink {
    color: #555555;
    float: left;
    padding-bottom: 2px;
  }
  #credits .developerLink a:hover {
    color: #FFFFFF;
    text-decoration: underline;
  }
  .userAccessibility {
    float: right;
    width: 275px;
  }
     .userAccessibility .updateMeBTN {
      position: relative;
      text-decoration: none;
      font-weight: 100;
      float: right;
      cursor: pointer;
      margin: 0 0 13px 1px;
      background: #FF2B06;
      color: white;
      text-align: center;
      border: 0;
      padding: 2px 20px 4px 15px;
      -webkit-border-radius: 11px;
      -moz-border-radius: 11px;
      border-radius: 11px;
      behavior: url(css/PIE.htc);
    }
    *+html .userAccessibility .updateMeBTN { /* IE7 only */
      display: block;
    }
    .userAccessibility .updateMeBTN:hover {
      background: #EEEEEE;
      color: #555555;
    }
    /** START Search **/
    .userAccessibility .searchFLD {
      position: relative;
      float: right;
      margin: 0 12px 13px 0;
      width: 150px;
      padding: 0;
      background: #E4E4E4;
      color: #787878;
      text-align: left;
      -webkit-border-radius: 11px;
      -moz-border-radius: 11px;
      border-radius: 11px;
      behavior: url(css/PIE.htc);
    }
      .userAccessibility .searchFLD form {
        background: url(../images/Button-Search-Icon.png) center right no-repeat;
        margin: 0 3px 0 0;
        padding: 0;
      }
      .userAccessibility .searchFLD .text-input {
        font-size: 1em;
        /* font-family: "Lucida Grande", Verdana, Arial, sans-serif; */
        text-rendering: optimizeLegibility;
        font-weight: lighter;
        background: none;
        border: none;
        color: #666;
        width: 110px;
        outline: 0;
        height: 21px;
        padding: 0 0 0 10px;
        padding /*\**/: 3px 0 0 10px\9; /* IE8 only */
        height /*\**/: 20px\9; /* IE8 only */
      }
      *+html .userAccessibility .searchFLD .text-input { /* IE7 only */
        height /*\**/: 18px\9;
      }
    /** END Search **/
    /** START Social links **/
    .userAccessibility .socialLinks {
      text-align: left;
      margin-top: 40px;
    }
      .userAccessibility .socialLinks div {
        margin-bottom: 10px;
      }
      .userAccessibility .socialLinks a {
        border: 0;
        width: 45px;
        height: 44px;
        text-decoration: none;
        text-indent: -9999px;
        display: inline-block;
        margin-right: 6px;
        *display: block;
        *float: left;
      }
      *+html .userAccessibility .socialLinks a { /* IE7 only */
        padding-right /*\**/: 3px;
      }
      .userAccessibility .socialLinks .facebookLink {
        background: url(../images/Social-Icon-FACEBOOK.png) no-repeat scroll 0 0 transparent;
      }
      .userAccessibility .socialLinks .facebookLink:hover {
        background: url(../images/Social-Icon-FACEBOOK_mouse-over.png) no-repeat scroll 0 0 transparent;
      }
      .userAccessibility .socialLinks .flickrLink {
        background: url(../images/Social-Icon-FLICKR.png) no-repeat scroll 0 0 transparent;
      }
      .userAccessibility .socialLinks .flickrLink:hover {
        background: url(../images/Social-Icon-FLICKR_mouse-over.png) no-repeat scroll 0 0 transparent;
      }
      .userAccessibility .socialLinks .linkedInLink {
        background: url(../images/Social-Icon-LINKEDIN.png) no-repeat scroll 0 0 transparent;
      }
      .userAccessibility .socialLinks .linkedInLink:hover {
        background: url(../images/Social-Icon-LINKEDIN_mouse-over.png) no-repeat scroll 0 0 transparent;
      }
      .userAccessibility .socialLinks .twitterLink {
        background: url(../images/Social-Icon-TWITTER.png) no-repeat scroll 0 0 transparent;
      }
      .userAccessibility .socialLinks .twitterLink:hover {
        background: url(../images/Social-Icon-TWITTER_mouse-over.png) no-repeat scroll 0 0 transparent;
      }
      .userAccessibility .socialLinks .youTubeLink {
        background: url(../images/Social-Icon-YOUTUBE.png) no-repeat scroll 0 0 transparent;
        padding-right: 0;
      }
      .userAccessibility .socialLinks .youTubeLink:hover {
        background: url(../images/Social-Icon-YOUTUBE_mouse-over.png) no-repeat scroll 0 0 transparent;
      }
    /** END Social links **/
.developperLink {
	font-size: 9pt;
}

/* END Footer */

.slash {
  /* font-family: myriad-pro-semiextended, sans-serif; */
  font-weight: 900;
  text-shadow: 1px 0px 0;
}
.arabic-type {
  /* font-family: adelle-sans-arabic, sans-serif !important; */
}

/*header animation*/
.collapsed-banner {
  padding: 0 !important;
  box-shadow: #0000006b 0px 2px 20px 0px;
  /* overflow: hidden !important; */
}

@media only screen and (orientation: landscape) {
  .collapsed-banner {
    padding: 16px 0 !important;
    /* overflow: hidden !important; */
  }
  .collapsed-banner .logo {
    margin-bottom: 21px !important;
  }
  .collapsed-banner .navigation {
    margin-bottom: 24px !important;
  }
}

 .transition-animation {
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  transition: all 0.2s ease;
}


.transition-animation * {
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  transition: all 0.2s ease;
} 

.overlay-color-1 {
  background-color: #FFC641 !important; /*Yellow*/
}
.overlay-color-2 {
  background-color: #004846 !important; /*Green*/
}
.overlay-color-3 {
  background-color: #2E98A8 !important; /*Ligh Blue*/
}
.overlay-color-4 {
  background-color: #EA5464 !important; /*Pink*/
}
.overlay-color-5 {
  background-color: #2A2A29 !important; /*Black*/
}
.overlay-color-6 {
  background-color: #4FE0A4 !important; /*Blue Green*/
}
.overlay-color-7 {
  background-color: #1A417A !important; /*Blue*/
}

.horizontalImageLeft img {
  margin-right: 27px;
  width: 900px;
  max-width: 65vw;
  height: auto;
}

td.fixed-width-equal-image {
  width: 900px;
  max-width: 65vw;
}

@media only screen and (orientation: portrait) {
  .horizontalImageLeft img {
    width: 100vw;
    max-width: unset;
    margin-left: -65px;
  }

  td.fixed-width-equal-image {
    width: calc(100vw - 130px);
    max-width: unset;
  }


  /*TYPOGRAPHY ON MOBILE*/
  .section h1 {
    font-size: 32px;
    line-height: 38px;
  }

  h2 {
    font-size: 27px;
  }

  h4 {
    font-size: 27px;
    line-height: 36px;
  }

  p {
    font-size: 20px;
    line-height: 28px;
  }

  #footer div span {
    font-size: 23px;
    line-height: 26px;
  }

  img.facebook-icon, .instagram-icon img{
    width: 60px !important;
    height: 60px !important;
  }

  .instagram-icon {
    margin-left: 150px !important;
  }

  #footer {
    padding: 52px 0 !important;
  }

}