/*
HTML 5 Template Name: Basic 60
File: Layout CSS
Author: OS Templates
Author URI: http://www.os-templates.com/
Licence: <a href="http://www.os-templates.com/template-terms">Website Template Licence</a>
*/

body{margin:0; padding:0; font-size:17px; font-family:"Times New Roman", Times, serif;}

.clear:after{content:"."; display:block; height:0; clear:both; visibility:hidden; line-height:0;}
.clear{display:block; width:100%; clear:both;}
html[xmlns] .clear{display:block;}
* html .clear{height:1%;}

a{outline:none; text-decoration:none;}
p.center { display:block; margin: auto;}
li.metric{ FONT-SIZE: 8pt; FONT-Style: normal; LINE-HEIGHT: 12px;}
dt.pub{ FONT-SIZE: 12pt; FONT-Style: normal; LINE-HEIGHT: 16px;}
td.pub{ FONT-SIZE: 16pt; FONT-Style: normal; FONT-weight: bold; LINE-HEIGHT: 18px; padding: 20px 48px; text-align: center; }
td.lib{ FONT-SIZE: 13pt; FONT-Style: normal; FONT-weight: normal; LINE-HEIGHT: 12px; padding: 8px 6px; text-align: left; }
td.row{ FONT-SIZE: 13pt; FONT-Style: normal; FONT-weight: normal; LINE-HEIGHT: 8px; padding: 8px 6px; text-align: left;  }
th.head{ FONT-SIZE: 11pt; FONT-Style: normal; FONT-weight: normal; LINE-HEIGHT: 12px; padding: 8px 6px; background-color: #A9CCF5; text-align: center;  }
td.inst{ FONT-SIZE: 11pt; FONT-Style: normal; FONT-weight: normal; LINE-HEIGHT: 12px; padding: 8px 6px; text-align: center;  }
code{font-weight:normal; font-style:normal; font-family:Georgia, "Times New Roman", Times, serif;}
DT.staff { FONT-SIZE: 12pt; FONT-Style: normal; FONT-weight: bold; LINE-HEIGHT: 14px }
DD.pub { FONT-SIZE: 12pt; FONT-Style: normal; FONT-weight: bold; LINE-HEIGHT: 14px }
dt.enzyme { FONT-SIZE: 18pt; FONT-Style: normal; LINE-HEIGHT: 24px;}
dl.enzyme { text-align:center;}
u { text-decoration: underline;}
h2.guide { background-color:#E6E6E6 }



.fl_left{float:left;}

.tab-content { overflow: hidden; max-height: 0; transition: max-height 0.8s ease-out; display: none;}
.tab input:checked ~ .tab-content { display: block;}

/* [THE ENTIRE TAB] */
.tab {
  position: relative;
  margin: 2px;
}

/* [THE LABEL] */
.tab input {
  display: none;
}
.tab label {
  display: block;
  background: #CACFD2;
  color: #000000;
  font-weight: Normal;
  font-size:17px; 
  font-family: Times New Roman, Times, serif;
  padding: 8px;
  cursor: pointer;
  border-bottom-style: solid;
  border-color: #979A9A;
}
.tab label::after {
  content: "\25b6";
  position: absolute;
  right: 10px;
  top: 10px;
  display: block;
  transition: all 0.4s ease-in-out;
}
.tab input[type=checkbox]:checked + label::after,
.tab input[type=radio]:checked + label::after {
  transform: rotate(90deg);
}

/* [THE CONTENTS] */
.tab-content {
  overflow: hidden;
  background: white;
  /* CSS animation will not work with auto height */
  /* This is why we use max-height */
  transition: height 0.4s ease-in-out; 
  max-height: 0px;
}
.tab-content p {
  margin: 20px;
  font-size:17px; 
  font-family: Times New Roman, Times, serif;
}
.tab input:checked ~ .tab-content {
  /* Set the max-height to a large number */
  /* Or 100% viewport height */
  transition: height 0.5s ease-in-out;
  max-height: 300vh;
}

img{margin:0; padding:0; border:none; line-height:normal; vertical-align:middle;}
.imgholder, .imgl, .imgr{padding:4px; border:1px solid #D6D6D6; text-align:center;}
.img{style: 1px solid #D6D6D6;}
.imgl{float:left; margin:0 15px 15px 0; clear:left;}
.imgr{float:right; margin:0 0 15px 15px; clear:right;}
.meta {float:right; border:2px solid #D6D6D6;; margin:5px 25px; width:500px; height:275px;}
.scimg {float:left; border:2px solid #D6D6D6;; margin:15px 25px; width:550px; height:275px;}
.spatialimg {float:left; margin:15px 25px; width:65%; height:65%;}
.tier {float:right; border:2px solid #D6D6D6;; margin:15px 25px; width:40%; height:40%;}
.nova {float:right; border:2px solid #D6D6D6;; margin:15px 25px; width:250px; height:360px;}
.imgguide1{border:1px; margin:10px 40px 5px 50px; width:450px; vertical-align:text-bottom;}
.imgguide1border{border:2px solid #D6D6D6; margin:10px 40px 5px 50px; width:450px; vertical-align:text-bottom;}
.imgguide2{border:1px; margin:10px 40px 5px 50px; width:700px; vertical-align:text-bottom;}
.imgguide2short{border:1px; margin:10px 40px 5px 50px; width:700px; height:125px; vertical-align:text-bottom;}
.imgguide3{border:1px; margin:10px 40px 5px 50px; width:350px; vertical-align:text-bottom;}


/*----------------------------------------------HTML 5 Overrides-------------------------------------*/

address, article, #right_column, figcaption, figure, footer, header, nav, section{display:block; margin:0; padding:0;}

q{display:block; padding:0 10px 8px 10px; color:#979797; background-color:#ECECEC; font-style:italic; line-height:normal;}
q:before{content:'“ '; font-size:26px;}
q:after{content:' „'; font-size:26px; line-height:0;}

/*----------------------------------------------Generalise-------------------------------------*/

#header, #footer{display:block; margin:0 auto; width:1300px;}

nav ul{margin:0; padding:0; list-style:none;}

h1{margin:0; padding:0; font-size:28px; font-weight:normal; font-style:normal; line-height:normal;}
h2{margin:0; padding:0; font-size:20px; font-weight:normal; font-style:normal; line-height:normal;}
h2.main {text-align:left; margin:0; padding:0; font-size:18px; font-weight:bold; font-style:normal; line-height:normal;}
h3, h4, h5, h6{margin:0; padding:0; font-size:18px; font-weight:normal; font-style:normal; line-height:normal;}

/*----------------------------------------------Header-------------------------------------*/

#header, #header a{color:#C0BAB6; background-color:#FFFFFF;}

#header #hgroup{float:left; padding:20px;}
#header #hgroup h1, #header #hgroup h2{}
#header #hgroup h1{font-size:36px;}
#header #hgroup h2{font-size:13px;}

#header nav{float:right; padding:20px;font-size:14px;}
#header nav ul{margin-top:50px;}
#header nav li{display:inline; margin-right:15px; text-transform:none;}
#header nav li.last{margin-right:0;}
#header nav a{color:#424242; background-color:#FFFFFF; text-decoration:underline;}
#header nav a:hover{color:#FF9900; background-color:#FFFFFF;}

/*----------------------------------------------Content Area-------------------------------------*/


#container{display:block; margin:0 auto; width:1260px; padding:30px 20px 0 20px; color:#000000; background-color:#FFFFFF; border:1px solid #333333; border-top:5px solid #333333; border-bottom:none;}
#container hr.title {vertical-align:center; width: 100%; border: 1px solid #F39C12;}
#container a{color:#BD4D1F; background-color:#FFFFFF; text-decoration: underline;}
#container a.fees{color:#000000; background-color:#FFFFFF; text-decoration: none;}
#container a.fees:hover{color:#000000; background-color:#FFFFFF; text-decoration: none;}
#container a:hover{color:#FF9900; background-color:#FFFFFF; text-decoration: underline;}
#container p.fig { FONT-SIZE: 12pt; FONT-Style: normal; LINE-HEIGHT: 16px; margin:0px 0px 0px 50px;}
#container p.menubar { FONT-SIZE: 12pt; FONT-Style: normal; LINE-HEIGHT: 16px;}
#container p.enzyme { FONT-SIZE: 16pt; FONT-Style: normal; LINE-HEIGHT: 24px;}
#container p.indent2{ margin-left: 50px }
#container p.faq { margin:25px 50px 15px 30px; padding:0; font-size:17px; font-family:"Times New Roman", Times, serif;}
#container li.faq { margin:25px 50px 0px 50px; padding:0; font-size:17px; font-family:"Times New Roman", Times, serif;}
#container p.q {color:#000000; background-color: white; LINE-HEIGHT: 16px; 17px; font-family:"Times New Roman", Times, serif; border-bottom-style: solid; border-width: 2px; border-color: #C2BFBF; width: 95% }
#container section{margin:0 0 30px 0;}
#container section.last{margin:0;}
#container section.guide{margin:0px 40px 50px 40px;}
#container section.policies{width: 1100px; margin:0px 50px 50px 50px;}
#container section.submission{width: 1100px; margin:0px 50px 50px 50px;}
#container section.metagenomic{width: 1100px; margin:0px 50px 50px 50px;}
#container section.ngs{width: 1100px; margin:0px 50px 50px 50px;}
#container section.frag{width: 1100px; margin:0px 25px 50px 25px;}
#container section.xgen{width: 1100px; margin:0px 50px 50px 50px;}
#container section.qc{width: 1100px; margin:0px 25px 50px 25px;}
#container section.index{width: 800px; margin:25px 50px 50px 50px;}
#container section.sanger{width: 1100px; margin:0px 25px 50px 25px;}
#container section.newsletters{width: 1100px; margin:0px 50px 50px 100px;}
#container .more{text-align:left; text-transform:uppercase; font-size:smaller; font-weight:bold;}

/* ------Main Content-----*/
#container table.priceseq{ FONT-SIZE: 10pt; FONT-Style: normal; LINE-HEIGHT: 24px; border-collapse: collapse; border: 1px solid black; width: 400px; LINE-HEIGHT: 200%;}
#container table.pricelib{ FONT-SIZE: 10pt; FONT-Style: normal; LINE-HEIGHT: 24px; border-collapse: collapse; border: 1px solid black; width: 600px; LINE-HEIGHT: 200%;}
#container table.pricengs{ margin: 10px 5px 15px 20px; FONT-SIZE: 10pt; FONT-Style: normal; LINE-HEIGHT: 24px; border-collapse: collapse; border: 1px solid black; width: 650px; LINE-HEIGHT: 200%;}
#container td.ngs{ vertical-align: top; FONT-SIZE: 13pt; FONT-Style: normal; FONT-weight: normal; LINE-HEIGHT: 20px; font-family:"Times New Roman", Times, serif;  }
#container td.ngs2{ text-align: center; vertical-align: top; FONT-SIZE: 13pt; FONT-Style: normal; FONT-weight: normal; LINE-HEIGHT: 20px; font-family:"Times New Roman", Times, serif;  }
#container tr.priceheader{text-align: left; background-color: #AEB6BF; border-collapse: collapse; border: 1px solid black; padding:3px; FONT-SIZE: 12pt;}
#container tr.price:nth-child(odd){background-color: #E5E7E9; border-collapse: collapse; border: 1px solid black; FONT-SIZE: 12pt;}
#container tr.price{ FONT-SIZE: 12pt;}
#container #content{float:left; width:875px;}
#container #content h4.group { color: black; font-size:18px; FONT-weight: bold;}
#container #content h5.group { color: black; font-size:20px; FONT-weight: bold;}
#container #content p.index { margin:25px 30px 15px 30px; padding:0; font-size:18px; font-family:"Times New Roman", Times, serif;}
#container #content p.index2 { margin:0x 0px 0px 0px; padding:0; font-size:17px; font-family:"Times New Roman", Times, serif;}
#container #content p.index3 { margin:15px 5px 10px 25px; padding:0; font-size:20px; font-family:"Times New Roman", Times, serif; text-align: justify; text-justify: inter-word;}
#container #content p.indent{ FONT-SIZE: 10pt; FONT-Style: normal; LINE-HEIGHT: 12px;}
#container #content p.indent3{ margin-left: 50px; margin-right: 100px; FONT-SIZE: 10pt; FONT-Style: normal; LINE-HEIGHT: 12px;}
#container #content p.mission { margin:25px 30px 15px 30px; padding:0; font-size:20px; font-family:"Times New Roman", Times, serif; text-align: left;}
#container #content li.index { margin:0px 50px 0px 50px; padding:0; font-size:17px; font-family:"Times New Roman", Times, serif;}
#container #content dt.guide { FONT-SIZE: 18px; FONT-Style: normal; FONT-weight: bold; LINE-HEIGHT: 14px; font-family:"Times New Roman", Times, serif; }
#container #content td.staff { FONT-SIZE: 14pt; FONT-Style: normal; FONT-weight: bold; text-align: center; LINE-HEIGHT: 20px; font-family:"Times New Roman", Times, serif;  }
#container #content td.staffsm { FONT-SIZE: 14pt; FONT-Style: normal; FONT-weight: normal; LINE-HEIGHT: 20px; font-family:"Times New Roman", Times, serif;  }
#container #content dd.guide2{ FONT-SIZE: 17px; FONT-Style: normal; FONT-weight: normal; LINE-HEIGHT: 20px; font-family:"Times New Roman", Times, serif;  }
#container #content section.submission {width: 1100px; margin:0px 50px 50px 50px; }
#container #content img.sanger {margin:0px 25px 25px 25px; padding:0px; border:1px solid #666666; }
#container #content img.index {width:200px; height:165px; margin:0px 25px 5px 25px; padding:0px; border:1px solid #666666; }
#container #content img.index2 {width:92%; height:92%; margin:0px 20px 5px 20px; padding:5px; transition: 1s ease;}
#container #content img.index2:hover {-webkit-transform: scale(1.15); -ms-transform: scale(1.15); transform: scale(1.15); transition: 1s ease; }
#container #content img.qc {width:20%; height:20%; margin:0px 50px 25px 25px; padding:0px; border:1px solid #666666;}
#container #content #services{}
#container #content #services ul{margin:0 15px 0 15px; padding:0px; list-style:none;}
#container #content #services ul li{display:block; width:700px;}
#container #content #services ul li.odd{float:left;}
#container #content #services ul li.even{float:right;}
#container #content #services ul li img {width:375px; height:160px; margin:0 0 15px 0px; padding:0px; border:1px solid #666666; }
#container #content #column img {display: block; margin: auto; padding:0px; border:1px solid #666666; }
#container #content #column p.index { FONT-SIZE: 20pt; FONT-Style: normal; LINE-HEIGHT: 16px;}

/* ------Script Table Defenitions-----*/
#container #content table.enzymeso{ FONT-SIZE: 10pt; FONT-Style: normal; LINE-HEIGHT: 24px; border-collapse: collapse; border: 1px solid black; width: 850px; LINE-HEIGHT: 200%;}
#container #content tr.enzymesoheader{text-align: center; background-color: #AEB6BF; border-collapse: collapse; border: 1px solid black; padding:3px; FONT-SIZE: 12pt;}
#container #content tr.enzymeso:nth-child(odd){background-color: #E5E7E9; border-collapse: collapse; border: 1px solid black; }
#container #content table.enzyme { margin: auto; border-collapse: collapse; border: 1px solid black; width: 1000px; FONT-SIZE: 12pt; FONT-Style: normal; LINE-HEIGHT: 200%;}
#container #content table.service { margin: auto; border-collapse: collapse; width: 800px; FONT-SIZE: 12pt; FONT-Style: normal; LINE-HEIGHT: 150%;}
#container #content tr.enzymeheader{text-align: center; background-color: #AEB6BF; border-collapse: collapse; border: 1px solid black; padding:3px; FONT-SIZE: 14pt;}
#container #content tr.enzyme:nth-child(odd){background-color: #E5E7E9; border-collapse: collapse; border: 1px solid black; }
#container #content td.desc{text-align: left; }
#container #content td.catnum{text-align: center; }
#container #content td.units{text-align: center; }
#container #content td.price{text-align: center; }
#container #content td.qty{text-align: center; }
#container #content table.oligo{ FONT-SIZE: 10pt; margin: auto; FONT-Style: normal; LINE-HEIGHT: 24px; border-collapse: collapse; border: 1px solid black; width: 400px; LINE-HEIGHT: 200%;}
#container #content tr.oligoheader{text-align: center; background-color: #AEB6BF; border-collapse: collapse; border: 1px solid black; padding:3px; FONT-SIZE: 12pt;}
#container #content tr.oligo:nth-child(even){text-align: center; background-color: "white"; border-collapse: collapse; border: 1px solid black; }
#container #content tr.oligo:nth-child(odd){text-align: center; background-color: #E5E7E9; border-collapse: collapse; border: 1px solid black; }

/* ------Right Column-----*/

#right_column a{color:black; background-color:#FFFFFF; text-decoration: underline;}
#container #right_column{float:right; width:325px;}
#container #right_column section.ngscolumn{float:right; width:475px;}
#container #right_column dd.shipping { FONT-SIZE: 14pt; FONT-Style: normal; FONT-weight: normal; LINE-HEIGHT: 20px }
#container #right_column dd.staff { FONT-SIZE: 13pt; FONT-Style: normal; FONT-weight: normal; LINE-HEIGHT: 20px }
#container #right_column h2.title{margin-bottom:20px;}
#container #right_column h2.title2{margin-bottom:32px;}
#right_column h2.group { color: black; font-size:22px; FONT-weight: bold; text-align:left;}
#right_column h2.title3 { color: black; font-size:28px; FONT-weight: bold; text-align:center;}
#container #right_column h5.group { color: black; FONT-weight: bold;}
#container #right_column img.index2 {width:50%; height:50%; margin:0px 20px 5px 20px; padding:5px; display: block;
  margin-left: auto;
  margin-right: auto;
  width: 50%;}
#container #right_column blockquote.announce {font-family: Arial, Helvetica, sans-serif; display:inline-block; margin: 0 25px 0 0; padding:0 10px 8px 10px; width:300px; color:#000000; background-color:#FFFFFF; LINE-HEIGHT: 14pt; FONT-SIZE: 10.5pt; border: 1px solid lightgrey; }
#container #right_column p.time {font-family: Arial, Helvetica, sans-serif; color: grey; background-color:#FFFFFF; LINE-HEIGHT: 14pt; FONT-SIZE: 11pt}
#container #right_column p.header {font-family: Arial, Helvetica, sans-serif; color: black; background-color:#FFFFFF; LINE-HEIGHT: 14pt; FONT-SIZE: 12pt}
#container #right_column p.q {color:#000000; background-color:#FFFFFF; LINE-HEIGHT: 16px; FONT-SIZE: 12pt; border: 1px solid grey; }
#container #right_column table.fees { margin: auto; border-collapse: collapse; border: 1px solid black; width: 300px; FONT-SIZE: 12pt; FONT-Style: normal; LINE-HEIGHT: 200%; padding: 3px;}
#container #right_column table.ngsfees { margin: auto; border-collapse: collapse; border: 1px solid black; width: 475px; FONT-SIZE: 12pt; FONT-Style: normal; LINE-HEIGHT: 200%; padding: 3px;}
#container #right_column tr.feesheader{text-align: left; background-color: #AEB6BF; border-collapse: collapse; border: 1px solid black; padding:3px; FONT-SIZE: 14pt;}
#container #right_column tr.fees:nth-child(even){background-color: white; border-collapse: collapse; border: 1px solid black; }
#container #right_column tr.fees:nth-child(odd){background-color: white; border-collapse: collapse; border: 1px solid black; }
#container #right_column td.yeild{text-align: center; }
#container #right_column nav{display:block; width:300px; margin-bottom:30px;}
#container #right_column nav h2{margin:0 0 20px 0; color:#666666; background-color:#F9F9F9;}
#container #right_column nav ul{margin:0; padding:0; list-style:none;font-size:16px;}
#container #right_column nav li{margin:0 0 3px 0; padding:0;}
#container #right_column nav ul ul, #container #right_column nav ul ul ul, #container #right_column nav ul ul ul ul, #container #right_column nav ul ul ul ul ul{border-top:none; padding-top:0;}
#container #right_column nav a{display:block; margin:0; padding:5px 10px 5px 20px; color:#666666; background:url("../images/orange_file.gif") no-repeat 10px center #FFFFFF; text-decoration:none; border-bottom:1px dotted #666666;}
#container #right_column nav a:hover{color:#FF9900; background-color:#FFFFFF;}
#container #right_column nav ul ul a, #container #right_column nav ul ul ul a, #container #right_column nav ul ul ul ul a, #container #right_column nav ul ul ul ul ul a{background:url("../images/black_file.gif") no-repeat #FFFFFF;}
#container #right_column nav ul ul a{padding-left:40px; background-position:30px center;}
#container #right_column nav ul ul ul a{padding-left:50px; background-position:40px center;}
#container #right_column nav ul ul ul ul a{padding-left:60px; background-position:50px center;}
#container #right_column nav ul ul ul ul ul a{padding-left:70px; background-position:60px center;}

#container #right_column section article{}
#container #right_column section article h2{font-size:14px; font-weight:bold; text-transform:uppercase;}
#container #right_column section article address{font-size:10px; font-style:normal;}
#container #right_column section article time{font-size:10px;}

/*----------------------------------------------Footer-------------------------------------*/

#footer, #footer a{color:#FFFFFF; background-color:#1E1E1E;}
#footer p.fl_left{margin-left:210px; padding:0px; text-align:center; font-size:12px;}
#footer p.fl_lefttext1{margin-left:50px; padding:0px; text-align:left; font-size:14px;}
#footer p.fl_lefttext2{margin-left:275px; padding:0px; text-align:left; font-size:14px;}
#footer p.fl_lefttext3{margin-left:375px; padding:0px; text-align:left; font-size:14px;}
#footer p.fl_right{float:right; margin-right:25px; padding:0px; text-align:center; font-size:12px;}
#footer a.cr{outline:none; text-decoration:underline;}