@import url("lib/reset.css");
@import url("lib/960_24_col.css");

/* commented backslash hack \*/ 
html, body{height:100%;} 
/* end hack */

body {
      background:#f3f5f4 url('../images/bk.jpg') repeat-x;
      font-family: "Trebuchet MS", Helvetica, Jamrul ,sans-serif;
}

a {
      color:#00b7e3;
      text-decoration:none;
}

a:hover {
      text-decoration:underline;
}

a.button {
      display:block;
      background: url('../images/button_bk.jpg') repeat-x;
      padding:17px;
      padding-top:16px;
      text-align:center;
      font-size:1.1em;
      color:#000;
      border: 1px solid #ccc;
      border-radius:5px;
      -moz-border-radius:5px;
      -webkit-border-radius:5px;
}

a.button:hover {
      background: url('../images/button_bk_hover.jpg') repeat-x;
      text-decoration:none;
      color:#fff;
      border: 1px solid #19a8d2;
}


/*===================  HEADER*/

/*HEADER - LOGO */

#logo img {
      margin:12px 15px;
      margin-bottom:9px;
      border:none;
}

/*HEADER - SUBMENU */

#submenu ul{
      float:right;
      margin-top:17px;
      margin-right:12px;
}

#submenu li{
      float:left;
      font-size: 0.8em;
      padding:3px;
}

#submenu li a{
      display:block;
      border-right:1px solid #ccc;
      padding-right:7px;
}


/*HEADER - MENU */
#menu {
      background:#19a8d2 url('../images/menu-bk.jpg') repeat-x;
      margin:0px;
      border-radius:5px;
      -moz-border-radius:5px;
      -webkit-border-radius:5px;
}

#menu ul{
}

#menu li{
      float:left;
      border-left:1px solid #49c3e1;
}

#menu li a{
      color:#fff;
      font-size:0.9em;
      display:block;
      padding:10px 15px;
      border-right:1px solid #1ba8cd;
}

#menu li a:hover {
      text-decoration:none;
      background-color:#4ac8e7;
}

#menu ul.left li:first-child {
      border-left:none;
}

#menu ul.left li:first-child a {
      border-top-left-radius:5px;
      -moz-border-radius-topleft:5px;	
      -webkit-border-top-left-radius:5px;
      border-bottom-left-radius:5px;
      -moz-border-radius-bottomleft:5px;
      -webkit-border-bottom-left-radius:5px;
}

#menu ul.right li{
      float:right;
}

#menu ul.right li a{
      background-color:#4ac8e7;
      border-right:none;

      border-top-right-radius:5px;
      -moz-border-radius-topright:5px;	
      -webkit-border-top-right-radius:5px;
      border-bottom-right-radius:5px;
      -moz-border-radius-bottomright:5px;
      -webkit-border-bottom-right-radius:5px;
}

#menu ul.right li a:hover {
      background-color:#87dbf0;
}

/*===================  CONTENT*/

.breadcrumbs {
      margin:9px;
      display:block;
      margin-bottom:0px;
      margin-left:5px;
}

.breadcrumbs a{
      color:#666;
      font-size:0.8em;
}

.breadcrumbs a.selected{
      color:#000;

}

/* --- header_section*/

.homepage_area {
      background:white;
      border:1px solid #ccc;
      position:relative;
      padding-bottom:10px;
}

.homepage_area .overlay {
      display:none;
}

.homepage_area:hover .overlay {
      background:rgba(0,0,0,0.1);
      position:absolute;
      top:0px;
      left:0px;
      width:100%;
      height:100%;
      display:block;
}

.homepage_area:hover .overlay a {
      width:220px;
      position:absolute;
      top:50%;
      left:50%;
      margin-left:-117px;
      margin-top:-25px;
}

.homepage_area h1, .homepage_area h2, .homepage_area p {
      padding:7px 22px;
}

.homepage_area h1 {
      font-size:1.3em;
      margin:1px;
      margin-bottom:0px;
      margin-top:13px;
      font-weight:lighter;
      color: #19a8d2;
}

.homepage_area h2 {
      font-size:1.1em;
      margin:0px;
      padding:4px 22px;
      font-weight:lighter;
}

.homepage_area p {font-size:0.9em; line-height:1.3em;}

.header_section {
      background:white;
      border:1px solid #ccc;
      margin:10px 0px;
      border-radius:5px;
      -moz-border-radius:5px;
      -webkit-border-radius:5px;
      background: #fff url('../images/product_bk.jpg') repeat-x;
      background-position:0px 118px;
      padding-bottom:15px;
      height:310px;
}


.header_section #sections {
      width: 950px;
      display: inline;
      height:280px;
      float: left;
      position: relative;
      /*clear:both;*/
}

.header_section .sections .standard {
      background: #fff url('../images/header/stopford.jpg') no-repeat;
      width:948px;
      height:280px;
      -moz-border-radius-topleft:5px;
      -webkit-border-top-left-radius:5px;
      -moz-border-radius-topright:5px;
      -webkit-border-top-right-radius:5px;
      position:absolute;
      top:0;
      left:0;
}

.header_section .sections .standard h1 { 
      font-size:1.4em;
      left:370px;
      top:40px;
      color:white;
      position:absolute;
}
.header_section .sections .standard div { 
      top:65px;
      left:365px;
      right:5px;
      color:white;
      position:absolute;
}
.header_section .sections .standard h2 {
      font-size:1.2em;
      font-weight:lighter;
      padding:10px 5px;
      line-height:1.4em;
}
.header_section .sections .standard a {
      width:160px;
      left:700px;
      position:absolute;
      top:200px;
}

.header_section .sections .standard p , .header_section .sections .standard h2 {
      padding:5px;
}

/* Stopford */
.header_section .sections  .stopford { 
      background: #fff url('../images/header/stopford.jpg') no-repeat;
      color:white;
}
.header_section .sections  .stopford h1 { 
      display:none;
}
.header_section .sections  .stopford div { 
      top:20px;
      left:365px;
      right:5px;
      position:absolute;
}
.header_section .sections .stopford h2 {
      font-size:1.2em;
      font-weight:lighter;
      padding:10px 5px;
      line-height:1.4em;
}
.header_section .sections .stopford a {
      width:160px;
      left:700px;
      position:absolute;
      top:200px;
}

/* Rafts */
.header_section .sections  .rafts { 
      background: #fff url('../images/header/rafts.jpg') no-repeat;
      color:#585858;
}
.header_section .sections  .rafts h1 { 
      display:none;
}
.header_section .sections  .rafts div { 
      top:110px;
      left:33px;
      right:450px;
      color:#585858;
      position:absolute;
}
.header_section .sections .rafts p {
      font-weight:lighter;
      font-size:0.9em;
      line-height:1.4em;
}
.header_section .sections .rafts a {
      width:90px;
      left:0px;
      right:600px;
      position:absolute;
      top:216px;
      border-radius:0px;
      -moz-border-radius:0px;
      -webkit-border-radius:0px;

      margin-top:10px;
      display:inline-block;
      margin-right:445px;
      margin-left:40px;
      padding:5px 10px;
      color:#fff;
      text-decoration:none;
      font-size:0.8em;
      border:1px solid #c68663;
      border-bottom:1px solid #9a4718;

      background: #e07f33 url('http://www.recordfiletracking.com/assets/rafts_mini/images/large_button_background.jpg') repeat-x;
}

/* Rafts_for_reg */
.header_section .sections  .rafts_for_reg { 
      background: #fff url('../images/header/rafts_for_reg.jpg') no-repeat;
}

.header_section .sections  .rafts_for_reg h1 { 
      top:40px;
      left:445px;
      color:#224765;
      font-size:1.4em;
      position:absolute;
}

.header_section .sections  .rafts_for_reg div { 
      top:80px;
      left:440px;
      right:30px;
      color:#224765;
      position:absolute;
}
.header_section .sections .rafts_for_reg p {
      font-weight:lighter;
      font-size:0.9em;
      color:#224765;
      line-height:1.4em;
}
.header_section .sections .rafts_for_reg a {
      width:150px;
      right:30px;
      position:absolute;
      top:190px;
      padding:7px;
}

.header_section #section_menu {
      width: 948px;
      height:45px;
      display: inline;
      float: left;
      position: relative;
      background: #353535 url('../images/header_bottom.jpg') repeat-x;
}

.header_section #section_menu ul {
      background:black;
}

.header_section #section_menu ul li {
      float:left;
      padding:14px;
      color:#fff;
}

.header_section #section_menu ul li:hover , .section_selected {
      background:black;
      cursor:pointer;
}


/* --- header_section*/
.list {
      background:white;
      border:1px solid #ccc;
      margin:10px 0px;
      border-radius:5px;
      -moz-border-radius:5px;
      -webkit-border-radius:5px;
      background: #fff url('../images/product_bk.jpg') repeat-x;
      background-position:0px 57px;
}

.list .title {
      width: 630px; width: 950px;
      display: inline;
      float: left;
      position: relative;
}

.list .title .button{
      width:100px;
      position:absolute;
      right:15px;
      top:15px;
      padding:6px;
      font-size:0.9em;

}

.list .title h1{
      color:#0f5d73;
      font-size: 1.4em;
      font-weight: lighter;
      border-bottom:1px solid #e7e7e7;
      margin:0px ;
      padding:18px;
      display:block;
}

.list .title {
      margin-bottom:5px;
}
.list .body {
      width: 630px; width: 950px;
      display: inline;
      float: left;
      position: relative;
      color:#333;
      padding-bottom:5px;
}

.list .body p {
      padding:10px 20px;
      line-height:1.4em;
      font-size:0.8em;
}

.blog {
      background:white;
      border:1px solid #ccc;
      margin:10px 0px;
      border-radius:5px;
      -moz-border-radius:5px;
      -webkit-border-radius:5px;
      /*background: #fff url('../images/product_bk.jpg') repeat-x;*/
      background-color:white;
      background-position:0px 57px;
}

.blog .title {
      width: 630px;width:950px;
      display: inline;
      float: left;
      position: relative;
}

.blog .body .button{
      width:60px;
      position:absolute;
      left:15px;
      top:15px;
      padding:6px;
      font-size:0.9em;

}

.blog .body {
      width: 630px;width:710px;
      padding-top:55px;
      display: inline;
      float: left;
      position: relative;
      color:#333;
      padding-bottom:5px;
}

.blog .body img {
      float:left;
      margin:15px 20px;
      border:1px solid #ccc;
}

.blog .body h1 {
      padding:10px 20px;
      line-height:1.4em;
      font-size:1.7em;
}

.blog .body h2 {
      padding:10px 20px;
      line-height:1.4em;
      font-size:1.4em;
}

.blog .body h3 {
      padding:10px 20px;
      line-height:1.4em;
      font-size:1.1em;
}

.blog .body p {
      padding:10px 20px;
      line-height:1.4em;
      font-size:0.8em;
}

.blog .body_list {
      width: 630px;width:710px;
      padding-top:5px;
      display: inline;
      float: left;
      position: relative;
      color:#333;
}

.blog .body_list .button{
      width:120px;
      padding:6px;
      margin:15px;
      font-size:0.9em;

}

.blog .body_list img {
      float:left;
      margin:15px 20px;
      border:1px solid #ccc;
}

.blog .body_list a {
      color:#0f5d73;
}

.blog .body_list h1 {
      padding:10px 20px;
      line-height:1.4em;
      font-size:1.5em;
      font-weight: lighter;
}

.blog .body_list h1 a:hover{
      text-decoration:none;
}
.blog .body_list h1 small{
      font-size:0.5em;
      padding:0px 7px;
      background-color:#00b7e3;
      color:#fff;
      visibility:hidden;
}

.blog .body_list h1 a:hover small{
      visibility:visible;
}

.blog .body_list h2 {
      padding:5px 20px;
      padding-top:15px;
      border-bottom:1px solid #eee;
      padding-bottom:15px;
      line-height:1.2em;
      font-size:1.1em;
      font-weight: lighter;
}

.blog .body_list h2 a:hover{
      text-decoration:none;
}
.blog .body_list h2 small{
      font-size:0.6em;
      padding:0px 7px;
      background-color:#00b7e3;
      color:#fff;
      visibility:hidden;
}

.blog .body_list h2 a:hover small{
      visibility:visible;
}

.blog .body_list h3 {
      padding:5px 20px;
      padding-top:15px;
      line-height:1.2em;
      font-size:1.1em;
      font-weight: lighter;
}

.blog .body_list h3 a:hover{
      text-decoration:none;
}
.blog .body_list h3 small{
      font-size:0.6em;
      padding:0px 7px;
      background-color:#00b7e3;
      color:#fff;
      visibility:hidden;
}

.blog .body_list h3 a:hover small{
      visibility:visible;
}

.blog .body_list p {
      padding:5px 20px;
      padding-bottom:15px;
      line-height:1.4em;
      font-size:0.8em;
      border-bottom:1px solid #eee;
}

.blog .body_list p:last-child {
      border-bottom:none;
}

.blog .side {
      width: 317px;width:237px;
      display: inline;
      float: left;
      position: relative;
      color:#333;
      margin-right:0px;
      background: #fbfdfc url('../images/side_line.jpg') repeat-y;
}

.blog .side h1{
      color:#0f5d73;
      font-size: 1.6em;
      background-color:white;
      font-weight: lighter;
      border-bottom:1px solid #e7e7e7;
      margin:0px;
      padding:18px;
      display:block;
}

.blog .side h2{
      color:#0f5d73;
      padding:5px 20px;
      font-weight: lighter;
      line-height:1.2em;
      font-size:1.2em;
}

.blog .side p{
      padding:5px 30px;
}

.blog .side ul{
      padding:5px 35px;
}

.blog .side li{
      padding:3px 5px;
      font-size:0.8em;
      color:#333;
}

.blog .side li a{
      display:block;
      padding:3px 0px;
      color:#333;
      font-size:1.1em;
}



/* --- Product*/
.product {
      background:white;
      border:1px solid #ccc;
      margin:10px 0px;
      border-radius:5px;
      -moz-border-radius:5px;
      -webkit-border-radius:5px;
      background: #fff url('../images/product_bk.jpg') repeat-x;
      background-position:0px 118px;
      padding-bottom:15px;
}


.product .title {
      width: 950px;
      display: inline;
      float: left;
      position: relative;
}

.product .title h1{
      color:#0f5d73;
      font-size: 2em;
      font-weight: lighter;
      border-bottom:1px solid #e7e7e7;
      margin:0px 7px;
      padding:18px;
      display:block;
}

.product .title ul{
      border-bottom:1px solid #ccc;
      display:block;
      margin:0px 0px;
      padding-left:10px;
}
.product .title li {
      float:left;
}

.product .title li a{
      text-transform: uppercase;
      color:#0f5d73;
      padding:5px 20px;
      margin: 13px 0px;
      border-left:1px solid #e7e7e7;
      font-size: 0.9em;
      display:block;
}

.product .title li:first-child a{
      border-left:none;
}

.product .title li a.selected{
      color:#000;
}

.product .title {
      margin-bottom:15px;
}

.product .body {
      width: 630px;
      display: inline;
      float: left;
      position: relative;
      color:#333;
}

.product .body_large{
      width: 950px;
      display: inline;
      float: left;
      position: relative;
      color:#333;
}

.product .side {
      width: 310px;
      display: inline;
      float: left;
      position: relative;
      color:#333;
      background: url('../images/side_line.jpg') repeat-y;
}

.product .body p, .product .side p , .product .body_large p{
      padding:10px 20px;
      line-height:1.4em;
      font-size:0.8em;
}

.product .body h1, .product .side h1 , .product .body_large h1{
      padding:5px 20px;
      font-weight: lighter;
      line-height:1.3em;
      font-size:1.2em;
      color:#0f5d73;
}

.product .body h2, .product .side h2 , .product .body_large h2{
      padding:5px 20px;
      font-weight: lighter;
      line-height:1.3em;
      font-size:1.2em;
}

.product .body h3, .product .side h3 , .product .body_large h3{
      padding:5px 20px;
      font-weight: lighter;
      line-height:1.3em;
      font-size:1.1em;
}

.product .body ul{
      padding:5px 25px;
}

.product .body li{
      padding:3px 2px;
      margin-left:20px;
      font-size:0.8em;
      list-style:circle;
      color:#333;
}

.product .side h2{
      color:#0f5d73;
}

.product .side p{
      padding:5px 30px;
}

.product .side ul{
      padding:5px 25px;
}

.product .side li{
      padding:3px 5px;
      font-size:0.8em;
      color:#333;
}

.product .side li a{
      display:block;
      padding:3px 0px;
      color:#333;
      font-size:1.1em;
}

.product a.button{
      margin:10px;
      margin-left:20px;
}



/*===================  FOOTER*/

#footer {
      margin-top:15px;
}

#footer .grid_24 {
      border-top:1px solid #ccc;
      height:1px;
}

#footer span {
      margin:5px;
      padding-top:10px;
      color:#b5b5b5;
      font-size: 0.7em;
}

#footer img {
      margin:5px;
      float:right;
}