﻿/* RESET */
@import url("../fonts/new-sans-arabic/new-sans-arabic.css");
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, 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, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block; }

ol, ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, 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, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block; }

body {
  line-height: 1; }

ol, ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

/* END RESET */
/*$menuBackgroundColor: rgba(45,45,45,0.9);*/
/*$linkColor: lighten($mainBackgroundColor, 5%);*/
/*$linkColor: darken($mainBackgroundColor,10%);*/
/* ------------------------- */
body {
  font-size: 1em;
  font-family: sans-serif, Verdana, Geneva, Tahoma;
  background-color: #CCC;
  color: black;
  direction: rtl; }

h1, h2, h3, #top-menu, #right-nav, #welcome-message, table caption {
  font-family: NeoSansArabic, sans-serif, Arial, Helvetica; }

h1 {
  padding: 0 0 15px 0;
  border-bottom: 2px #aaa solid;
  font-size: 1.6em;
  font-weight: bold;
  line-height: 1.2em; }

h2 {
  margin: 20px 0 10px 0;
  padding: 4px 0;
  font-size: 1.1em;
  font-weight: bold;
  border-bottom: 1px #447294 solid;
  color: #ab0000; }

h3 {
  margin: 12px 0 10px 0;
  font-size: 1.05em;
  font-weight: bold;
  line-height: 1.8em;
  color: red; }

h4 {
  padding: 12px 0 10px 0;
  font-size: 1em;
  text-decoration: underline; }

h5 {
  margin: 20px 0 0px 0;
  font-size: 1em;
  font-weight: bold; }

strong {
  font-weight: bold; }

sup {
  vertical-align: super;
  font-size: 0.8em; }

sub {
  vertical-align: sub;
  font-size: 0.8em; }

figure {
  font-size: 0.95em;
  text-align: center; }
  figure figcaption {
    padding: 2px 0 10px 0;
    line-height: 0.9em; }

/* ------------------------- */
#wrapper {
  margin: 0px auto 0px auto;
  width: 900px;
  background-color: #FFF; }

#header {
  height: 120px;
  position: relative;
  background-color: #447294;
  border-top: 5px #2d2d2d solid; }

#logo {
  display: block;
  float: right;
  width: 78px;
  height: 78px;
  background-image: url("../images/logo.png");
  background-repeat: no-repeat;
  margin: 15px 10px; }

#site-name {
  display: block;
  float: right;
  text-indent: -9999px;
  white-space: nowrap;
  width: 276px;
  height: 76px;
  background-image: url("../images/site_name.png");
  background-repeat: no-repeat;
  margin: 15px 10px; }

#social-media {
  float: left;
  text-align: center;
  margin: 15px 10px;
  font-size: 0.7em;
  line-height: 1.2em;
  color: #FFF; }
  #social-media img {
    width: 30px;
    height: auto;
    border: 1px white solid;
    margin: 0 1px;
    transition-duration: 0.5s;
    -moz-transition-duration: 0.9s;
    -webkit-transition-duration: 0.5s;
    -o-transition-duration: 0.5s; }
    #social-media img:hover {
      -webkit-transform: rotate(360deg);
      -moz-transform: rotate(360deg);
      transform: rotate(360deg); }
  #social-media ul {
    padding: 0;
    margin: 0;
    list-style-type: none;
    direction: ltr; }
    #social-media ul li {
      margin: 0;
      padding: 0;
      display: inline-block; }

.top-menu-container {
  clear: both;
  text-align: center;
  position: absolute;
  bottom: -10px;
  width: 100%;
  z-index: 900; }

.top-menu-sticked {
  position: fixed;
  top: 0;
  bottom: auto;
  width: 900px; }
  @media screen and (max-width: 900px) {
    .top-menu-sticked {
      width: 100%; } }
  .top-menu-sticked #top-menu {
    width: 100%;
    border-radius: 0; }

#top-menu {
  display: inline-block;
  border-radius: 5px;
  font-size: 1em;
  background-color: #2d2d2d; }
  #top-menu ul {
    padding: 0 5px;
    margin: 0;
    list-style-type: none;
    display: inline-block; }
    #top-menu ul > li {
      float: right;
      position: relative;
      padding: 0; }
      #top-menu ul > li ul {
        display: none;
        padding: 0;
        min-width: 200px;
        position: absolute;
        text-align: right;
        background-color: #3a3a3a;
        opacity: 0.9;
        border-bottom-right-radius: 5px;
        border-bottom-left-radius: 5px;
        box-shadow: -8px 8px 8px 0px rgba(0, 0, 0, 0.3);
        z-index: 100; }
        #top-menu ul > li ul li {
          width: 100%;
          margin: 0; }
          #top-menu ul > li ul li a {
            display: block;
            white-space: nowrap; }
      #top-menu ul > li:hover {
        background-color: #3a3a3a; }
        #top-menu ul > li:hover ul {
          display: block; }
  #top-menu a {
    display: block;
    text-decoration: none;
    padding: 8px; }
    #top-menu a:link, #top-menu a:visited {
      color: #FFF; }
    #top-menu a:after {
      content: '';
      border: 4px solid transparent;
      border-top: 4px solid #FFF;
      margin-right: 5px;
      margin-bottom: 3px;
      display: inline-block;
      vertical-align: bottom; }
    #top-menu a:only-child:after {
      border: 0; }
    #top-menu a:hover {
      background-color: #FF7878;
      color: black; }
      #top-menu a:hover:after {
        border-top-color: black; }
  #top-menu hr {
    padding: 0;
    margin: 2px 10px; }

#slider {
  clear: both;
  width: 100%;
  height: 195px;
  position: relative;
  border-bottom: 1px #447294 solid; }
  #slider .sliderImage {
    float: left;
    position: relative;
    display: none; }
    #slider .sliderImage span {
      position: absolute;
      padding: 10px;
      width: 300px;
      height: 300px;
      background-color: #000;
      filter: alpha(opacity=0);
      -moz-opacity: 0;
      -khtml-opacity: 0;
      opacity: 0;
      font-family: Arial, Helvetica, sans-serif;
      font-size: 12px;
      line-height: 150%;
      color: #fff;
      display: none; }
  #slider #new-version-icon {
    position: absolute;
    top: 80px;
    right: -6px;
    visibility: visible; }
    #slider #new-version-icon img {
      height: 45px; }
  #slider #special-offer-icon {
    position: absolute;
    top: 80px;
    left: -6px; }
    #slider #special-offer-icon img {
      height: 45px; }

#footer {
  clear: both;
  text-align: center;
  padding: 8px;
  font-size: 0.7em;
  background-color: #447294;
  color: #FFF; }

#right-nav {
  float: right;
  width: 220px;
  padding: 10px;
  text-align: center; }
  #right-nav .right-nav-header {
    background-color: #2d2d2d;
    color: #FFF;
    text-align: center;
    border-radius: 3px;
    margin-bottom: 3px; }
    #right-nav .right-nav-header a {
      color: inherit;
      text-decoration: none;
      display: block;
      padding: 10px 0; }
      #right-nav .right-nav-header a:hover {
        color: black; }
  #right-nav ul li {
    list-style-type: none;
    padding: 0;
    margin: 0;
    line-height: 1.3em; }
    #right-nav ul li a {
      text-decoration: none;
      padding: 6px 5px;
      display: block;
      color: black; }
      #right-nav ul li a:hover {
        background-color: #FF7878;
        border-radius: 3px; }
  #right-nav .current {
    background-color: #c6c6c6;
    border-radius: 5px;
    color: #ab0000; }
    #right-nav .current:before1 {
      content: "("; }
    #right-nav .current:after1 {
      content: ")"; }

#facebook-like {
  display: none;
  position: absolute;
  left: 5px;
  bottom: -8px; }

.youtube-tutorial {
  display: block;
  margin: 20px auto; }

#content {
  margin-right: 230px;
  padding: 10px 10px 20px 20px;
  line-height: 1.4em;
  position: relative;
  text-align: justify;
  /*	border-right: 1px #999 solid;*/ }
  #content p {
    margin: 10px 0;
    z-index: 10; }
    #content p img {
      display: block;
      margin: 0 auto; }
    #content p .new {
      display: inline;
      padding: 0 3px; }
  #content ul {
    list-style-type: disc;
    padding: 0 40px 0 0;
    z-index: 10; }
  #content ol {
    list-style-type: decimal;
    padding: 0 30px 0 0;
    z-index: 10; }
  #content li {
    padding: 3px 0; }
  #content a {
    text-decoration: none;
    color: #345771; }
    #content a:hover {
      color: #ff4545;
      text-decoration: underline; }

/* ------------------------- */
table {
  width: 100%;
  margin: 10px 0 30px 0;
  border: 1px #777 solid; }
  table caption {
    padding: 5px 0 10px 0;
    text-align: right;
    font-weight: bold;
    border-bottom: 1px #777 solid; }
  table tr {
    border-bottom: 1px #777 solid;
    text-align: right; }
  table th {
    padding: 5px 2px;
    background-color: #7ba4c3;
    color: black;
    font-weight: bold;
    vertical-align: middle; }
  table td {
    vertical-align: middle;
    padding: 3px 2px; }
  table .column-center {
    text-align: center; }

.table-lessons {
  /*@extend .table-main;*/ }
  .table-lessons .column-center {
    width: auto; }
  .table-lessons tr th:nth-child(2) {
    width: 30%; }

.table-download {
  /*@extend .table-main;*/ }
  .table-download img {
    height: 25px;
    width: auto; }
  .table-download .column-center {
    width: 20%; }

.table-agents {
  /*@extend .table-main;*/
  text-align: center; }

.table-prices {
  /*@extend .table-main;*/ }
  .table-prices th {
    border-left: 1px white solid; }
  .table-prices .column-center {
    width: 20%; }

.table-algorithm2-sample {
  width: 50%;
  direction: ltr;
  margin: 0 auto; }
  .table-algorithm2-sample th {
    width: 50%;
    text-align: center; }
  .table-algorithm2-sample td {
    text-align: center; }

.table-tutorial {
  width: 50%;
  margin: 0 auto; }
  .table-tutorial th {
    width: 50%;
    text-align: center; }
  .table-tutorial td {
    text-align: center; }

.table-terms {
  width: 70%;
  margin: 0 auto; }
  .table-terms th {
    width: 50%;
    text-align: center; }
  .table-terms td {
    text-align: center; }

.thumbnails {
  text-align: center; }
  .thumbnails .thumbnail {
    text-align: center;
    box-sizing: border-box;
    font-size: 0.9em;
    margin: 10px 0 30px 0; }

.float-image1 {
  padding: 10px 20px 10px 0;
  float: left;
  max-width: 250px;
  height: auto; }

.command, .excel-formula, .expression, .vbcode, code {
  border: 1px solid darkgray;
  border-radius: 2px;
  padding: 5px;
  margin: 15px;
  font-family: "Courier New", Courier, monospace;
  background-color: #ADD8E6;
  direction: ltr;
  text-align: left;
  font-size: 0.95em; }

.excel-formula {
  background-color: #FAFAD2; }

.expression {
  background-color: #CFC;
  overflow: auto;
  overflow-y: hidden;
  white-space: nowrap; }

.vbcode, code {
  background-color: #EEE;
  overflow: auto;
  overflow-y: hidden;
  white-space: nowrap; }
  .vbcode .vbcode-keyword, code .vbcode-keyword {
    color: blue; }
  .vbcode .vbcode-remarks, code .vbcode-remarks {
    color: darkgreen; }
  .vbcode .vbcode-quote, code .vbcode-quote {
    color: darkred; }

.subheader {
  padding: 10px 0;
  color: red; }

.question {
  color: red; }

.mark {
  color: red; }

div.remark {
  padding: 0px 2px;
  margin: 0px; }

.remark {
  padding: 8px 8px 8px 2px;
  background-color: #ffdddd;
  border: 1px solid red;
  border-right-width: 5px;
  border-radius: 2px; }

.info-text {
  font-size: 0.7em; }

.formula {
  text-align: center;
  direction: ltr; }

.formula-inline {
  direction: ltr;
  display: inline-block; }

.center {
  text-align: center; }

#solution-button a {
  color: black;
  background-color: #447294;
  padding: 6px 10px;
  cursor: pointer;
  text-decoration: none; }
  #solution-button a:hover {
    text-decoration: none;
    color: white; }
  #solution-button a:active {
    color: black; }

/*# sourceMappingURL=styles.css.map */
