/*  General Style Sheet for
    mortimedia.com
    4th August 2011   
*/ 

/*  Default Dimensions:
    Total page width: 862px
    Left Pad: 0px, Right Pad: 38px
    Content: 862px (802px padding)
    Col1: 520px
    Col2of2: 262px
    Col1of1: 824px
*/


/*---------------------------------------------------------------------------- GENERAL */


   * {
     margin: 0px;
     padding: 0px;
   }


   a img { border:none; } 
   a { outline: none; }


   html,body {
      color: #3c3c3c;
   }


   body {
      /* background: url('images/backg_body.png') repeat-x top left; */
   }


   blockquote {
      margin: 25px 0px;
      padding-left: 50px;
      padding-right: 35px;
      background: url('images/blockquote.png') no-repeat top left;
      color: #4a4a4a;

      /* padding-left: 15px; */
      /* margin-left: 15px; */
      /* border-left: 1px dotted #808080; */
   }


   blockquote p {
      margin: 0px;
   }


/*------------------------------------------------------------ FOOTER ALWAYS AT BOTTOM */
/* With grateful assistance from www.pmob.co.uk */


   html,body {
      height: 100%;
   }


   #header_container {
      height: 140px;											
      position:relative;
      z-index:2;
      background: url('images/backg_header.png') no-repeat top center;
   }


   #footer_container {
      position: relative;
      height: 130px;											
      clear:both;
      background: url('images/backg_footer.png') repeat-x top;
   }



   #header, #footer {
      width: 870px;											
      margin: 0 auto;
   }


    .footer_col_l {
      float: left;
      width: 350px;
      margin-left: 111px;
      margin-top: 90px;
    }


    .footer_col_r {
      float: right;
      width: 300px;
      margin-right: 45px;
      text-align: right;
      margin-top: 90px;
    }


   #content_container {
      background: #ffffff;
      width: 862px;											
      margin: 0 auto;
      min-height: 100%;
      margin-top: -270px;                                  
   }


   #content {
      border-top: 270px solid transparent;               
      width: 824px;											
      /*padding-left: 22px;*/
      padding-right: 38px;
   }


   *html #content {
      /* IE6 Fix */
      border-color: pink;
      filter: chroma(color=pink);
   }


   .bottom_of_page {
      /* To give bottom margin between footer and content */
      height: 30px;											
      width: 100%;
      clear: both;
   }

   /* Browser fixes follow */


   /* IE6 Fix */
   * html #content_container {   
      height: 100%;
   }

   
   /*Opera Fix*/
   body:before {   
      content:"";
      height:100%;
      float:left;
      width:0;
      margin-top:-32767px;   /* negate effect of float */
   }


   /* thank you Erik J - instead of using display table for ie8 */
   #content_container:after {
      clear:both;
      display:block;
      height:1%;
      content:" ";
   }


/*---------------------------------------------------------------------------- COLUMNS */


/* Don't set right margin divider on 2nd to last column - float:right the last column (for IE6) */


   .col1 {
      width: 520px;
      margin-right: 42px; 
      float: left;
   }


   .col2of2 {
      width: 262px;											
      margin-top: 40px;
      float: right;
   }


   .col1of1 {
      width: 824px;											
      float: left;
   }


/*--------------------------------------------------------- SIMPLE HORIZONTAL NAV MENU */


   #menu_wrapper {
     width: 100%;
     clear: both;
     padding-top: 108px;
   }


   ul#menubar {
     list-style-type: none;
   }


   ul#menubar li {
     display: inline;
     margin-right: 25px;
   }


   ul#menubar li a {
     text-decoration: none;
     position: relative;
     padding-left: 6px;
     padding-right: 6px;
     line-height: 1.7em;
     outline: none;
     color: #1f3652;
     font-size: 1.25em;
     font-family: arial, helvetica, sans-serif;
   }


   ul#menubar li a:hover {
     color: #ea0000;
   }


   ul#menubar li a.selected {
     background-color: #ea0000;
     color: white;
     padding: 2px 6px 3px 6px;
   }


   ul#menubar li a span {
     display: none;
     text-align: left;
   }


   ul#menubar li a:hover span.tooltip {
     display: block;
     position: absolute;
     text-align: left;
     color: #808080;
     top: 31px;
     left: 6px;
     width: 250px;
     background-color: white;
   }



/*---------------------------------------------- HORIZONTAL NAV DROP DOWN MENU NOT-IE6 */


   ul#dropdown {
      list-style: none;
   }


   ul#dropdown li {
      position: relative;
      float: left;
      width: 125px;
      padding-bottom: 5px;
   }

	
   #dropdown li div {
      position: absolute;
      visibility: hidden;
      width: 125px;
      left: 0px;
      top: 20px;
      background-color: red;
   }


   ul#dropdown li a {
      /* style for menu title text */
      display: block;
      text-decoration: none;
      color: white;
      font-size: 0.90em;
      text-align: left;
      font-weight: bold;
      text-align: left;
      text-decoration: none;
   }


   #dropdown li:hover a {
      /* hover colour for menu title text */
      color: #ffff00;

   }


   #dropdown li:hover div a:hover {
      /* hover colour for menu items text */
      color: #ffff00;

   }


   #dropdown li:hover div a {
      /* menu items colour and style */
      font-size: 1.2em;
      color: #ffffff;
   }


   #dropdown li:hover div p {
      margin-bottom: 0px;
      border-bottom: 1px solid #ffffff;
      padding: 5px;
   }


   #dropdown li:hover div {
      /* show the drop down menu */
      visibility: visible;
   }


/*------------------------------------------------------------------------- TEXT BASIC */


   p, li, h4, h6 {
      font-family: verdana, arial, helvetica, sans-serif;
      font-size: 0.85em;
      line-height: 1.6em;
   }


   p {
      margin-bottom: 20px;
   }


   p b {
      color: #525252;
   }


   .col2of2 p {
      font-size: 0.7em;
      margin-bottom: 0px;
   }


   .blog-main, .blog-main1 {
      /* normal text for notebook and techlab pages */
      font-family: verdana, arial, helvetica, sans-serif;
      font-size: 0.85em;
      line-height: 1.5em;      
      margin-bottom: 30px; */
/*      font-family: arial, helvetica, sans-serif; */
/*      font-size: 1em; */
/*      line-height: 1.4em;      */
      color: #3c3c3c;
   }


   .blog .blog-title {
      font-size: 0.95em;
      color: #0362cb;
      margin-bottom: 0px;
      font-weight: bold;
   }


   .blog-main1:first-line {
      font-weight: bold;
      color: #6a6a6a;
   }

   .blog .dateline {
      /* date text for notebook and techlab pages */
      font-family: verdana, arial, helvetica, sans-serif;
      font-size: 0.7em;
      color: #6e6e6e;
      margin-top: 40px;
      margin-bottom: 5px;
   }


   .blog .rule {
      margin-top: 45px;
      padding-top: 5px;
      border-top: 1px solid #e5e5e5;
   }


   .blog .readmore, .readmore {
      /* readmore text for notebook and techlab pages */
      font-family: verdana, arial, helvetica, sans-serif;
      font-size: 0.7em;
      color: #6e6e6e;
      margin-top: 10px;
      padding-left: 12px;
      background: url('images/block.png') no-repeat top left;
   }


   .blog p img {
      /* picture within a blog entry */
      float: right;
      border: 1px solid #a4a4a4;
      padding: 10px;
      margin-left: 15px;
      margin-bottom: 10px;
      margin-top: 4px;
   }


   h1, h2, h3 {
      font-family: arial, helvetica, sans-serif;
   }


   .small, h5 {
      font-size: 0.75em;
      line-height: 1.5em;
   }


   .smallest, h6, .popupcapt {
      font-size: 0.7em;
      line-height: 1.6em;

   }


   h1, h2, h3 {
      /* Headlines, Subheads */
      font-size: 1.35em;
      font-weight: normal;
      color: #0362cb;
      padding-bottom: 5px;
   }


   h1 {
      font-size: 1.75em;
   }


   h3 {
      font-size: 1.05em;
      font-weight: bold;
      margin-top: 5px;
   }


   h4, h5, h6, .popupcapt {
      /* Bold version of p, small and smallest in headline colour */
      font-weight: bold;
   }


   .caps {
      text-transform: uppercase;
   }


/*---------------------------------------------------------------------- TEXT SPECIALS */


   em {
      /* Highlight function for latest, new etc. Default is yellow, override with bg_color */
      background-color: #ffff00; 
      padding: 2px 4px 2px 4px; 
      font-style: normal;
  }


   .shaded {
      /* all-round padding for a shaded paragraph (use with .rev_) */
      padding: 10px;
   }


/*------------------------------------------------------------------------- CONTAINERS */


   .box200top {
      background: url('images/box200top.png') no-repeat top left; 
      height: 13px;
      font-size: 1px; /* IE6 Fix */
   }


   .box200mid {
      background: url('images/box200mid.png') repeat-y top left;
      padding: 0px 10px;
      overflow: hidden;
   }


   .box200bot {
      background: url('images/box200bot.png') no-repeat top left; 
      height: 12px;
      font-size: 1px; /* IE6 Fix */
   }


   .box200top2 {
      background: url('images/box200top2.png') no-repeat top left; 
      height: 13px;
      font-size: 1px; /* IE6 Fix */
   }


   .box200mid2 {
      background: url('images/box200mid2.png') no-repeat top left;
      padding: 0px 10px;
      overflow: hidden;
   }


   .box200bot2 {
      background: url('images/box200bot2.png') no-repeat top left; 
      height: 12px;
      font-size: 1px; /* IE6 Fix */
   }


   .divider {
      margin-top: 20px;
      border-top: 1px #c0c0c0 dotted;
      padding-top: 15px;
   }


   .divider p {
      margin-bottom: 15px;
   }


   .backg_web {
      background: url('images/backg_web-design.jpg') no-repeat top left;
   }


   .backg_print {
      background: url('images/backg_print-design.jpg') no-repeat top left;
   }


   .backg_contact {
      background: url('images/backg_contact.jpg') no-repeat top left;
   }


/*--------------------------------------------------------------------- PICTURE FRAMES */


   .picframe01 {
      /* used on index */
      background: url('images/picframe01.png') no-repeat top left;
      padding: 11px;
      padding-bottom: 0px;
      float: left;
      margin-top: 5px;
      height: 197px;
   }


   .picframe03 {
      /* small portfolio pictures on index */
      background: url('images/picframe03.png') no-repeat top left;
      padding: 6px;
      float: left;
      margin-top: 10px;
      height: 47px;
      width: 45px;
   }


   .picframe03_wrapper {
     /* crop settings for picframe03 */
     float: left;
     margin-top: 0px;
     width: 45px;
     height: 45px;
     overflow: hidden;
   }


   .picframe03_wrapper img {
     width: 120px;
   }


   .port_pic_bg {
     /* background for all col2 picture frames - portfolio, notebook and techlab */
     width: 260px;
     padding: 1px;
     float: right;
     background-color: #a7a7a7;
   }


   .port_pic_outer {
     /* outer setting for all col2 picture + white padding */
     width: 240px;
     float: right;
     padding: 10px;
     background-color: white;
   }


   .port_pic_wrapper {
     /* crop settings for col2 pictures in portfolio index */
     width: 240px;
     float: right;
     margin-top: 0px;
     height: 160px;
     overflow: hidden;
   }


   .picpad {
     /* padding for pictures */
     margin: 0px 11px 10px 11px;
   }


   .testibg {
     /* Testimonials box */
     background: url('images/backg_testi.png') no-repeat top left;
     padding-bottom: 20px;
   }


   .testibg p {
     margin-left: 35px;
     margin-right: 15px;
   }


   /*----------------------------------------------- 9px rounded corners */
      .rounded9_wrapper { position: relative; }
      .rounded9_wrapper div { height: 9px; width: 9px; position: absolute; z-index: 999; }
      .tl9 { top: 0px; left: 0px; background: url('images/pic_corner9tl.png') no-repeat top left; }
      .tr9 { top: 0px; right: 0px; background: url('images/pic_corner9tr.png') no-repeat top left; }
      .bl9 { bottom: 0px; left: 0px; background: url('images/pic_corner9bl.png') no-repeat bottom left; }
      .br9 { bottom: 0px; right: 0px; background: url('images/pic_corner9br.png') no-repeat bottom left; }
      .rounded9_wrapper h6 { margin: 0px;  padding: 5px 9px; }


      /* IE6 fixes */
      * html .rounded9_wrapper { float: left; }
      * html .bl9, * html .br9 { bottom: 2px; }
      * html .capt, * html .capt { bottom: -1px; } /* if using a caption, set to -1px */

      /* IE7 fixes */
      *:first-child+html .bl9, *:first-child+html .br9 { bottom: 3px; }
      *:first-child+html .capt, *:first-child+html .capt { bottom: 0px; }  /* if using a caption, set to 0px; */
   /*end 9px rounded corners */


/*------------------------------------------------------------------------ POSITIONING */


   .floatr { float: right; }
   .floatl { float: left; }
   .clearb { clear: both; }


/* If using a picture caption then add a width class to
   relevant container (see examples). Width is either total width
   image or width less any padding                                                     */
   .w50 { width: 50px; }
   .w100 { width: 100px; }
   .w130 { width: 130px; }
   .w150 { width: 150px; }
   .w182 { width: 182px; }
   .w200 { width: 200px; }
   .w250 { width: 250px; }
   .w260 { width: 260px; }
   .w300 { width: 300px; }
   .w100pc { width: 100%; }

   .h50 { height: 50px; }
   .h100 { height: 100px; }
   .h150 { height: 150px; }
   .h200 { height: 200px; }
   .h250 { height: 250px; }

   .bot { bottom: 0px; }
   .top { top: 0px; }
   .left { left: 0px; }
   .right { right: 0px; }


   .mt0  {   margin-top:  0px;  }
   .mt5  {   margin-top:  5px;  }
   .mt10 {   margin-top: 10px;  }
   .mt15 {   margin-top: 15px;  }
   .mt20 {   margin-top: 20px;  }
   .mt25 {   margin-top: 25px;  }
   .mt30 {   margin-top: 30px;  }
   .mt35 {   margin-top: 35px;  }
   .mt40 {   margin-top: 40px;  }
   .mt50 {   margin-top: 50px;  }
   .mt60 {   margin-top: 60px;  }

   .mb0  {   margin-bottom:  0px;  }
   .mb5  {   margin-bottom:  5px;  }
   .mb10 {   margin-bottom: 10px;  }
   .mb15 {   margin-bottom: 15px;  }
   .mb20 {   margin-bottom: 20px;  }
   .mb25 {   margin-bottom: 25px;  }
   .mb30 {   margin-bottom: 30px;  }
   .mb35 {   margin-bottom: 35px;  }
   .mb40 {   margin-bottom: 40px;  }

   .ml0  {   margin-left:  0px;  }
   .ml5  {   margin-left:  5px;  }
   .ml10 {   margin-left: 10px;  }
   .ml15 {   margin-left: 15px;  }
   .ml20 {   margin-left: 20px;  }
   .ml25 {   margin-left: 25px;  }
   .ml30 {   margin-left: 30px;  }
   .ml35 {   margin-left: 35px;  }

   .mr0  {   margin-right:  0px;  }
   .mr5  {   margin-right:  5px;  }
   .mr10 {   margin-right: 10px;  }
   .mr11 {   margin-right: 11px;  }
   .mr15 {   margin-right: 15px;  }
   .mr20 {   margin-right: 20px;  }
   .mr23 {   margin-right: 23px;  }
   .mr25 {   margin-right: 25px;  }
   .mr30 {   margin-right: 30px;  }
   .mr35 {   margin-right: 35px;  }


   .bigpiccapt, .smallpiccapt { padding: 5px; }
   .smallpiccapt { padding-bottom: 0px; }

   .pad10 { padding: 10px; }


  .overlay_wrapper {
   position: relative;
   overflow: hidden; /* remove to let content spill underneath */
  }


  .overlay_layer {
   /* by default will always start top left */
   position: absolute;
  }


/*------------------------------------------------------------------------------ LISTS */


   .ul_main {
      /* Standard bullet list */
      list-style-type: disc;
      padding-bottom: 20px;
   }


   .ul_alt1 {
      list-style-type: none;
      padding-bottom: 20px;
   }


   .ol_main {
      /* Standard numbered list */
      padding-bottom: 20px;
   }


   .ul_main li {
      padding-left: 5px;
      margin-left: 15px;
   }


   .ul_alt1 li {
      background: url('images/bullet1.png') no-repeat top left;
      padding-left: 20px;
   }


   * html .ul_alt1 li {
      /* center the graphic bullet in IE6 (single lines, multi lines centres on middle line */
      background: url('images/bullet1.png') no-repeat center left;
   }


   .ol_main li {
      padding-left: 5px;
      margin-left: 30px;
   }


/*----------------------------------------------------------------------------- TABLES */


   table p {
      margin-bottom: 0px;
   }


 
   /* Table1: Standard Table, with row hover effect, optional picture background */
   .table1 {
      text-align: left;
      border-collapse: collapse;
      background: url('images/table1_bg.jpg') no-repeat top left;
   }


   .table1 thead {
      border-bottom: 1px solid #000000;
   }


   .table1 th {
      padding: 10px;
   }


   .table1 td {
      background: #e8edff; /* solid background to table cells, comment next line */
      background: url('images/table1_cell.png') repeat top left; /* 50% transparent png, not ie6 */
      border-bottom: 1px solid #cccccc;
      border-right: 1px solid #cccccc;
      padding: 10px;
      vertical-align: top;
   }


   .table1 tfoot td {
      background: #000000;
      color: #ffffff;
      border-bottom: 0px;
   }

   .table1 tbody tr:hover td {
      background: #d0dafd; /* Solid background on hover, comment next line */
      background: url('') repeat top left; /* no bg, or use solid or a different trans. png */
      color: #ffffff;
   }


/*---------------------------------------------------------------------------- BUTTONS */


   .button100 {
      /* container for generic button 100px wide */
      width: 100px;
      height: 23px;
      margin-top: 4px;
   }


   .button100 a:link, .button100 a:visited, .button100 a:active {
      background: url('images/button100.png') no-repeat top left;
      width: 100px;
      height: 19px;
      float: left;
      color: white;
      font-size: 0.70em;
      text-align: center;
      font-weight: bold;
      text-decoration: none;
      padding-top: 4px;
   }


  .button100 a:hover {
     background-position: 0px -23px;
     color: #ffff80;
  }


/*-------------------------------------------------------------------- LINKS & COLOURS */


   a:link, a:visited, a:hover, a:active {
     color: #00a6dd;
     text-decoration: none;
   }


   a:hover {
     color: #ea0000;
   }


  /* alternative colour links */
  a.link2 { color: #ffffff; }
  a.link2:link { text-decoration: none; }
  a.link2:visited { text-decoration: none; }
  a.link2:hover { text-decoration: underline; color: #ffff00; }
  a.link2:active { text-decoration: none; color: #ffff00; }


  .black {color: #000000; }
  .white {color: #ffffff; }
  .red1 {color: #ea0000; }
  .navy {color: #0362cb; }

  .bg_black { background-color: #000000; }
  .bg_white { background-color: #ffffff; }
  .bg_red1 { background-color: #ea0000; }
  .bg_navy { background-color: #0362cb; }
  .bg_lightg { background-color: #e9ebed; }


/* ------------------------------------------------------------------------ SEARCH BOX */


   #form_search {
      position: relative;
      height: 27px;
      border: 1px solid #bbbbbb;
      background-color: #e9ebed;
      /* background: url('images/backg_formsearch.png') no-repeat top left; */
   }


   #form_search .searchinput {
      position: absolute;
      left: 4px;
      top: 5px;
      border: 0;
      width: 77%;
      font-size: 0.8em;
      font-family: verdana, arial, helvetica, sans-serif;
   }


   #form_search .searchbutton {
      position: absolute;
      top: 0px;
      right: 2px;
      background: url('images/search.png') no-repeat top left;
      height: 25px;
      width: 25px;
      cursor: pointer;
      border: 0;
   }


/* ---------------------------------------------------------------------- CONTACT FORM */


   #form_contact {
      margin-bottom: 15px;
   }


   #form_contact p {
      margin-bottom: 3px;
   }

   
   #form_contact input[type="text"], #form_contact textarea {
      padding: 4px;
      font-family: courier, "courier new", "lucida mono", fixed;
      font-size: 0.95em;
      margin-bottom: 10px;
      color: #585858;
      width: 66%;
   }


   #form_contact input[type="submit"] {
     color: #585858;
     margin-top: 15px;
     display: block;
   }


   .input_ok {
      border: 1px dotted #00a6dd;
   }


   .input_error {
      border: 1px dotted #ea0000;
   }


/* --------------------------------------------------------- Portfolio */


   .portfolio_row {
     float: left;
     width: 824px;
     margin-top: 20px;
     padding-bottom: 20px;
     border-bottom: 1px dotted #a7a7a7; 
   }


   .portfolio_col {
     float: left;
     width: 258px;
   }


/* ---------------------------------------------- Notebook and Techlab */
/*                               Some settings also in portfolio above */


   #notebook_header {
     width: 824px;
     float: left;
     margin-top: 50px;
     background: url('/images/notebook_header.png') no-repeat top left;
   }


   #notebook_intro {
     /* intro line over header - for notebook and techlab */
     margin-top: 17px;
     margin-left: 230px;
     margin-bottom: 30px;
   }


   .note_pic_bg {
     /* background for all large notebook picture frames */
     width: 816px;
     padding: 1px;
     float: left;
     /* background: #1f3652 url('/images/picture_bg.gif') repeat top left; */
     background-color: #a7a7a7;
     margin-top: 10px;
     margin-bottom: 15px;
   }


   .note_pic_wrapper {
      /* overall container for large picture to get bottom padding */
      margin-bottom: 10px;
      width: 100%;
      float: left;
    }


   .note_pic_outer {
     /* outer setting for all large notebook picture + white padding */
     width: 786px;
     float: left;
     margin-top: 0px;
     padding: 15px;
     background-color: white;
   }


/* ---------------------------------------------------------- Tech Lab */
/*                  Some settings also in portfolio and notebook above */


   #techlab_header {
     width: 824px;
     float: left;
     margin-top: 50px;
     background: url('/images/techlab_header.png') no-repeat top left;
   }


/* ----------------------------------------------------------------------------- ADMIN */


  .admin_edit {
     /* wrapper for edit form */
     width: 440px;
     float: left;
     margin-right: 30px;
  }


  #edit_form {
     float: left;
     width: 100%;
  }


  .edit_form_row {
     float: left;
     width: 100%;
     border-bottom: 1px solid #c0c0c0;
     padding: 15px 0px;
  }


  #edit_form p, #edit_form span {
     margin: 0px;
     padding: 0px;
     font-weight: bold;
     color: red;
  }


  #edit_form span {
     font-size: 0.75em;
  }


  #edit_form input[type="text"], #edit_form textarea {
     padding: 2px;
     color: #000000;
     font-family: verdana, arial, helvetica, sans-serif;
  }


  .coleditcol1or2 {
     width: 140px;
     float: left;
     margin-right: 10px;
  }


  .coleditcol3 {
     width: 140px;
     float: right;
  }


  .admintablerow {
     float: left;
     width: 100%;
     border-bottom: 1px solid #c0c0c0;
     /* overflow:hidden; */
  }


  .admintablecol {
     float: left;
     /* padding-bottom:9015px;  */
     /* margin-bottom:-9005px; */
     /* padding-top: 5px; */
     padding: 10px 0px;
  }


  .admintablecol p {
     margin: 0px;
  }


  .rtborder {
     /* border-right: 1px solid #c0c0c0; */
     margin-right: 5px;
  }


  .admintablecol input, .admintablecol select {
     font-size: 0.7em;
     padding: 0px;
  }


  .admintablecol span {
     font-size: 0.75em;
     padding: 0px;
  }


  .blogtexta {
     font-size: 0.85em; 
     width: 100%; 
     height: 60px;
     margin-bottom: 20px;
  }


/*-------------------------------------------------------------------------------- END */


