@CHARSET "UTF-8";
html, body { height: 100%; }
body { padding: 0; margin: 0; overflow-y: scroll; }

.centered { margin: 0 auto; position: relative; width: 1000px; }

#root { position: relative; }
 #head_wrapper { background: #fff; border-bottom: 5px solid #dedede; }
  #head { position: relative; }
  #head:after { content: ''; display: block; clear: both; }
   #head_navigation { position: absolute; top: 0; right: 0; font-size: 10px; color: #6b6a6a; }
   #head_navigation:after { content: ''; display: block; clear: both; }
   #head_navigation span { display: block; float: left; padding: 0 5px; position: relative; line-height: 30px; }
   #head_navigation span:after { content: ''; height: 10px; width: 1px; background: #6b6a6a; position: absolute; right: 0; top: 50%; 
                                 -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%);}
   #head_navigation span:last-child { padding: 0 0 0 15px; }
   #head_navigation span:last-child:after { display: none; }
   #head_navigation a:link,
   #head_navigation a:visited { font-size: 10px; color: #6b6a6a; padding: 0 10px; }
   #head_navigation a:hover,
   #head_navigation a:active,
   #head_navigation a.active { background: #3f9ddd; color: #fff; line-height: 30px; }
   #logo { width: 260px; display: block; float: left; }
 #googlemap { }
 #googlemap:after { content: ''; display: block; clear: both; }
  #about { position: relative; z-index: 2; height: 280px; width: 340px; float: left; background: #3f9ddd; color: #fff; padding: 20px; margin-left: 12px;
           -webkit-border-radius: 6px; -moz-border-radius: 6px; -ms-border-radius: 6px; -o-border-radius: 6px; border-radius: 6px; }
  #about p { margin: 0 0 16px 0; }
  #about p.last { margin: 0; }
  #about .title { font-size: 16px; font-weight: bold; margin: 0; }
  #about img { display: block; float: right; padding: 0 0 10px 10px; }
 #customers { margin-top: 40px; margin-bottom: 80px; }
  #customers .title { text-align: center; margin: 10px 0 0 0; position: relative; }
  #customers .title span { display: inline-block; padding: 0 10px; color: #747474; background: #fff; font-size: 16px; line-height: 20px; }
  #customers .title:after { content: ''; display: block; margin-top: -10px; height: 1px; border-top: 1px dashed #747474; }
  #customers .links { text-align: center; }
  #customers a { padding: 5px 10px 10px 10px; display: inline-block; }
  #customers img { vertical-align: middle; max-height: 80px; }
 #content_area { margin-top: 35px; background: #fff url(../img/layout/content_bg.png) repeat-y 0 0; }
 #content_area:after { content: ''; display: block; clear: both; }
  #subnav { width: 260px; min-height: 1px; float: left; margin-right: 20px; background: #e0edf1; }
  #main-content { float: left; width: 720px; }
   #content:after { content: ''; display: block; clear: both; }
#footer { padding: 30px 0 10px; background: #3f9ddd; color: #fff; }
#footer:after { content: ''; display: block; clear: both; }

#navigation { z-index: 5; float: right; position: absolute; border-bottom: 5px solid #3a90cb; right: 0; bottom: -5px; font-size: 0; }
#navigation ul { list-style: none; padding: 0; margin: 0; }
#navigation ul li { display: inline-block; position: relative; padding: 0; margin: 0; }
#navigation > ul > li:after { content: ''; width: 1px; height: 56px; background: #dedede; display: block; position: absolute; top: 0; right: 0; }
#navigation > ul > li:last-child:after { content: ''; display: none; }
#navigation ul li a:link,
#navigation ul li a:visited { background: #fff; font-size: 18px; margin: 0; padding: 0 30px; font-weight: 400; display: inline-block; color: #2c2c2c; line-height: 56px; }
#navigation ul li a:hover,
#navigation ul li a:active,
#navigation ul li a.active { background: #3f9ddd; color: #fff; }
#navigation ul li.has-children > a:hover,
#navigation ul li.has-children > a:active,
#navigation ul li.has-children > a.active { background: #3f9ddd url(../img/layout/nav_active.png) no-repeat center bottom; color: #fff; }
#navigation ul ul { display: none; left: 0; top: 56px; position: absolute; background: #398fc9; }
#navigation ul li:last-child ul { right: 0; left: auto; }
#navigation ul ul li { width: 200px; }
#navigation ul ul li:first-child:before { display: none; }
#navigation ul ul li:before { content: ''; height: 1px; width: 90%; background: #7fcbff; display: block; position: absolute; top: 0; left: 50%;
                              -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); }
#navigation ul ul li a:before { content: '>'; padding: 0 5px 0 10px; }
#navigation ul ul li a:link,
#navigation ul ul li a:visited { float: none; padding: 0 12px; font-size: 16px !important; box-sizing: border-box; display: block; background: #398fc9; color: #fff; line-height: 40px; }
#navigation ul ul li a:hover,
#navigation ul ul li a:active,
#navigation ul ul li a.active { background: #3f9ddd; }
#navigation table { position: absolute; border-collapse: collapse; left: -1px; top: 25px; }
#navigation ul li:hover ul,
#navigation ul a:hover ul { display: inline-block; }

/** SUBNAV */
#subnav ul { padding: 0; margin: 0; list-style: none; background: #398fc9; }
#subnav ul li { width: 260px; position: relative; margin: 0; padding: 0; }
#subnav ul li:first-child:before { display: none; }
#subnav ul li:before { content: ''; height: 1px; width: 90%; background: #7fcbff; display: block; position: absolute; top: 0; left: 50%;
                       -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); }
#subnav ul li a:before { content: '>'; padding: 0 5px 0 10px; }
#subnav ul li a:link,
#subnav ul li a:visited { float: none; padding: 0 12px; font-size: 16px !important; box-sizing: border-box; display: block; background: #398fc9; color: #fff; line-height: 40px; }
#subnav ul li a:hover,
#subnav ul li a:active,
#subnav ul li a.active { background: #3f9ddd; }
#subnav ul li:hover ul,
#subnav ul a:hover ul { display: inline-block; }