/**
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any Css/Less files within this directory, lib/assets/javascripts, vendor/assets/javascripts,
 * can be referenced here using a relative path.
 *
 * It's not advisable to add code directly here, but if you do, it'll appear in whatever order it 
 * gets included (e.g. say you have require_tree . then the code will appear after all the directories 
 * but before any files alphabetically greater than 'application.css' 
 *
 *= require_self
 *= require definitions
 *= require standard
 *= require menu
 *= require submenu
 *
 *= require desktop
 */




@import "menu";
h1, h2, h3, h4, h5 {
  /*text-transform: uppercase;*/
  font-family: 'Varela Round';
  font-weight: normal; }

.two-columns {
  /* chrome, safari, opera */
  -webkit-column-count: 2;
  /* chrome, safari, opera */
  -webkit-column-width: 200px;
  /* firefox */
  -moz-column-count: 2;
  /* firefox */
  -moz-column-width: 200px;
  column-count: 2;
  column-gap: 30px; }

p {
  margin-top: 0px; }

h3 {
  color: #8b0000;
  font-weight: normal;
  margin: 0px;
  border-bottom: thin #888 solid; }

hr {
  margin-bottom: 50px; }

a {
  color: #8b0000;
  text-decoration: none; }

a.click-here {
  font-style: italic; }

.address-first-line {
  color: #8b0000; }

@font-face {
  font-family: OstrichSans;
  src: url('http://www.numa.oan/assets/fonts/ostrich-sans-bold.eot');
  src: url('http://www.numa.oan/assets/fonts/ostrich-sans-bold.woff') format('woff'), url('http://www.numa.oan/assets/fonts/ostrich-sans-bold.ttf') format('truetype');
  font-weight: bold;
  font-style: normal; }

@font-face {
  font-family: OstrichSans;
  src: url('http://www.numa.oan/assets/fonts/ostrich-sans-black.eot');
  src: url('http://www.numa.oan/assets/fonts/ostrich-sans-black.woff') format('woff'), url('http://www.numa.oan/assets/fonts/ostrich-sans-black.ttf') format('truetype');
  font-weight: normal;
  font-style: normal; }

body {
  font-family: 'Open Sans', sans; }

ul {
  margin-top: 2px;
  list-style-type: none; }
  ul li {
    padding-bottom: 4px; }

#header {
  margin: 0 auto; }
  #header #logo {
    margin: 0 auto;
    max-width: 200px; }
    #header #logo img {
      max-width: 200px; }

#logo-separator {
  height: 2px;
  width: 90%;
  margin: 0 auto;
  background-color: #eee; }

#container {
  max-width: 400px;
  margin: 0 auto;
  position: relative; }

div.image-interstitial {
  padding-top: 10px;
  padding-bottom: 10px;
  text-align: center; }
  div.image-interstitial.project img {
    max-width: 350px; }
  div.image-interstitial img {
    width: 100%; }

#contact {
  display: table;
  width: 100%; }
  #contact div {
    display: table-cell; }
  #contact #contact-middle {
    display: none;
    vertical-align: middle; }
    #contact #contact-middle img {
      max-width: 25px; }
  #contact #contact-right img {
    max-width: 200px; }
  #contact #contact-internet {
    margin: 0 auto; }

#services {
  text-align: center; }
  #services h1 {
    clear: both;
    margin-bottom: 10px;
    margin-top: 25px; }
  #services div {
    display: inline-block; }
  #services #services-image {
    text-align: center;
    float: left; }
    #services #services-image img {
      max-width: 200px;
      padding: 5px 15px 5px 5px; }
  #services #services-top {
    text-align: left; }
  #services #services-middle {
    position: relative;
    height: 300px; }
    #services #services-middle #services-box {
      display: none;
      position: absolute;
      z-index: -1;
      margin-left: -510px;
      left: 50%;
      width: 1011px;
      top: 0px; }
      #services #services-middle #services-box img {
        display: block;
        margin: 0 auto; }
    #services #services-middle #services-second {
      /* padding: 80px 180px 80px 180px; */
      text-align: left; }
  #services #services-bottom img {
    max-height: 300px; }

#content-body {
  margin-top: 10px; }

.paragraphs {
  position: relative;
  clear: both; }
  .paragraphs div, .paragraphs h1, .paragraphs h2, .paragraphs hr {
    clear: both; }
  .paragraphs div img {
    margin-left: 10px;
    margin-right: 10px; }

p.with-permission {
  font-size: xx-small; }

strong {
  color: #8b0000;
  font-weight: normal; }

h2.header {
  width: 100%;
  text-align: left;
  display: table;
  vertical-align: middle; }
  h2.header strong {
    display: table-cell;
    width: 50%;
    color: #d78;
    padding: 0px 5px 0px 5px; }
  h2.header div {
    width: 10%;
    display: table-cell;
    vertical-align: middle; }
    h2.header div hr {
      color: #888;
      background-color: #888;
      margin: 0px;
      border: thin #dcc solid; }

.ringed-video {
  border: medium #8b0000 solid;
  border-radius: 20px;
  padding: 5px; }

#list-experience {
  list-style: none; }
  #list-experience li:before {
    content: "●   ";
    color: #8b0000;
    font-size: 5pt;
    vertical-align: top;
    padding: 3px 5px 0px 0px;
    display: inline-block; }

#menu {
  padding-top: 10px;
  padding-bottom: 10px; }
  #menu .menu-entry {
    margin: 0px auto;
    width: 80px;
    display: inline-block; }
  #menu ul {
    display: table;
    width: 100%;
    padding-left: 0px;
    margin: 0px; }
    #menu ul li {
      display: table-cell;
      min-width: 100px; }
  #menu h1 {
    font-size: x-large;
    display: inline; }
  #menu a {
    text-decoration: none;
    color: #500;
    font-weight: normal; }
  #menu .current a {
    color: #8b0000; }
  #menu #menu-separator {
    height: 1px;
    width: 100%;
    background-color: #8b0000; }

/* #d8043c; */
#submenu {
  margin: 0 auto;
  width: 100%;
  padding-top: 10px;
  padding-bottom: 10px;
  text-transform: uppercase; }
  #submenu a {
    text-decoration: none;
    color: #000; }
  #submenu a.current {
    color: #8b0000; }
  #submenu .submenu-arrow {
    font-size: xx-large;
    color: #cfb9bf; }
  #submenu ul {
    display: block;
    text-align: justify;
    width: 100%;
    margin: 0px;
    margin-top: 20px;
    padding: 0px; }
    #submenu ul li {
      display: inline-block; }
      #submenu ul li.submenu-entry {
        line-height: 1.2;
        text-align: center;
        font-size: large;
        min-width: 50px; }
      #submenu ul li.submenu-entry-separator div {
        width: 8px;
        height: 8px;
        margin-top: 2px;
        margin-bottom: 2px;
        background-color: #cfb9bf; }
    #submenu ul a {
      color: #000; }
  #submenu ul:after {
    display: inline-block;
    width: 100%;
    content: ''; }
  #submenu #submenu-header {
    margin: 0 auto;
    position: relative;
    min-width: 200px;
    text-align: center;
    padding-top: 20px; }
    #submenu #submenu-header #submenu-header-image {
      display: none;
      position: absolute;
      top: 0px;
      left: 0px; }
      #submenu #submenu-header #submenu-header-image img {
        width: 580px; }
    #submenu #submenu-header h1 {
      display: inline;
      margin: 0px;
      font-size: xx-large;
      position: relative;
      z-index: 1;
      font-weight: normal;
      color: #8b0000; }
      #submenu #submenu-header h1 a {
        color: inherit; }
  #submenu #submenu-separator-bar {
    height: 1px;
    width: 100%;
    background-color: #8b0000; }

@media only screen and (min-width: 1024px) {
  body {
    background: #aaa url('/assets/sand-tile.png') repeat;
    font-size: small; }

  #container {
    max-width: 640px;
    background-color: #fff;
    padding: 10px 30px 10px 30px;
    margin-top: 30px;
    border-radius: 50px;
    -moz-border-radius: 50px;
    box-shadow: 0px 0px 50px 0px #888; }

  #logo, #menu {
    display: inline-block; }

  #logo {
    padding-right: 50px; }

  #content {
    width: 90%;
    margin: 0 auto; }

  #menu ul li {
    min-width: 120px; }
    #menu h1 {
      font-size: x-large; }

  #submenu ul li.submenu-entry {
    font-size: x-large; }
    #submenu #submenu-header h1 {
      font-size: 35px;
      position: relative;
      left: 130px;
      top: 5px; }
      #submenu #submenu-header #submenu-header-image {
        display: inline; }

  #services-rotor {
    float: left; }

  #services-first {
    float: right;
    width: 60%; }

  #services #services-middle #services-box {
    display: block;
    z-index: 1; }
    #services #services-middle #services-box img {
      max-height: 300px; }
    #services #services-middle #services-second {
      position: relative;
      z-index: 2;
      top: 60px;
      font-size: 97%; }

  #contact {
    border-collapse: collapse; }
    #contact #contact-left, #contact #contact-right {
      width: 45%;
      vertical-align: middle;
      padding: 10px; }
    #contact #contact-right {
      text-align: center; }
    #contact #contact-middle {
      text-align: center;
      display: table-cell;
      width: 10%; }
    #contact #contact-internet {
      margin-left: 40px;
      text-align: left; } }