
/*
  Detaily's Cascading style Sheets documentation
  Work in progress since 2009... 
  Copyright protected.  It can be used with permission.
*/
* {
    box-sizing: border-box;
}

body {
    background-color: #ffffff;
	width: 99%;
    font-family: Arial, Veranda, Helvetica, sans-serif;
    font-size: 14px;
    
}

a:link {font: Veranda, Arial, Times Roman, Asoon; color: #ffffff; text-decoration: none}
a:visited {font: Veranda, arial, Times Roman, Asoon; color: #ffffff; text-decoration: none}
a:hover {font: Veranda, Arial, Times Roman, Asoon; color: #F7E82B; text-decoration: none}

p {
	color: #cecece;
	font-size: 80%;
	margin-top: -5px;
	margin-bottom: 2px;
	text-align: center;
}
   
h1 {
  font-size: 18px;
  text-align: center;
  color: #f7e82b;
  margin-top: 2px;
  margin-bottom: 5px;
  font-weight: 700;
}

/* css-grid container for downloadleft */


.grid-dloadcontainer {
  display: grid;
  display: -ms-grid;
  grid-gap: 2px;
  padding: 5px;
}
.grid-dload {
  text-align: left;
  padding: 1px;
}

.filedxfa {
  grid-column: 1;
  -ms-grid-column: 1;
  grid-row: 1;
  -ms-grid-row: 1;
  
}
.dxfa:before {
 	content: "DXF";
 	color: #cecece;
 	font-size: 10px;
}
.filedwfa {
  grid-column: 2;
  -ms-grid-column: 2;
  grid-row: 1;
  -ms-grid-row: 1;
}
.dwfa:before {
 	content: "DWF";
 	color: #cecece;
 	font-size: 10px;
}
.filedwga {
  grid-column: 3;
  -ms-grid-column: 3;
  -ms-grid-row: 1;
  grid-row: 1;
}
.dwga:before {
 	content: "DWG";
 	color: #cecece;
 	font-size: 10px;
}
.fileawsa {
  grid-column: 4;
  -ms-grid-column: 4;
  grid-row: 1;
  -ms-grid-row: 1;
}
.awsa:before {
 	content: "AWS";
 	color: #cecece;
 	font-size: 10px;
}
.filerfaa {
  grid-column: 5;
  -ms-grid-column: 5;
  grid-row: 1;
  -ms-grid-row: 1;
}
.rfaa:before {
 	content: "RFA";
 	color: #cecece;
 	font-size: 10px;
}
.filervta {
  grid-column: 6;
  -ms-grid-column: 6;
  -ms-grid-row: 1;
  grid-row: 1;
}
.rvta:before {
 	content: "RVT";
 	color: #cecece;
 	font-size: 10px;
}
.filepina {
  grid-column: 7;
  -ms-grid-column: 7;
  grid-row: 1;
  -ms-grid-row: 1;
}
.pina:before {
 	content: "PLN";
 	color: #cecece;
 	font-size: 10px;
}
.filedtya {
  grid-column: 8;
  -ms-grid-column: 8;
  -ms-grid-row: 1;
  grid-row: 1;
}
.dtya:before {
 	content: "DTY";
 	color: #cecece;
 	font-size: 10px;
}
.filedxfb {
  grid-column: 1;
  -ms-grid-column: 1;
  grid-row: 2;
  -ms-grid-row: 2;

}
.tooltipdxf {
    position: relative;
    display: inline-block;
}

#dxfb {
	width: 19px;
	height: 15px;
  background-image: url('//detaily.com/IMG/d-dxf-b.gif')
    
}
#dxfb:hover {
	width: 19px;
	height: 15px;
	background-image: url('//detaily.com/IMG/d-dxf.gif')
	
}
.tooltipdxf .tooltiptextdxf {
    visibility: hidden;
    background-color: #33cc33;
    color: #000000;
    font-family: Arial, Veranda, Helvetica, sans-serif;
    font-size: 11px;
    text-align: center;
    border-radius: 4px;
    padding: 3px;
/* Position the tooltip */
    position: absolute;
    z-index: 1;
    bottom: 130%;
    left: 100%;
    margin-left: -10px;
}

.tooltipdxf:hover .tooltiptextdxf {
    visibility: visible;
}
.tooltiptextdxf:before {
	content: "AutCAD_DXF_File";
}


.filedwfb {
  grid-column: 2;
  -ms-grid-column: 2;
  grid-row: 2;
  -ms-grid-row: 2;
}
.tooltipdwf {
    position: relative;
    display: inline-block;
}

#dwfb {
  width: 19px;
  height: 15px;
  background-image: url('//detaily.com/IMG/d-dwf-b.gif');  
}
#dwfb:hover {
	width: 19px;
	height: 15px;
	background-image: url('//detaily.com/IMG/d-dwf.gif');
}
.tooltipdwf .tooltiptextdwf {
    visibility: hidden;
    background-color: #33cc33;
    color: #000000;
    font-family: Arial, Veranda, Helvetica, sans-serif;
    font-size: 11px;
    text-align: center;
    border-radius: 4px;
    padding: 3px;
/* Position the tooltip */
    position: absolute;
    z-index: 1;
    bottom: 130%;
    left: 100%;
    margin-left: -20px;
}

.tooltipdwf:hover .tooltiptextdwf {
    visibility: visible;
}
.tooltiptextdwf:before {
	content: "AutCAD_DWF_File";
}
.filedwgb {
  grid-column: 3;
  -ms-grid-column: 3;
  -ms-grid-row: 2;
  grid-row: 2;
}
.tooltipdwg {
    position: relative;
    display: inline-block;
}

#dwgb {
  width: 19px;
  height: 15px;
  background-image: url('//detaily.com/IMG/d-dwg06-b.gif');  
}
#dwgb:hover {
	width: 19px;
	height: 15px;
	background-image: url('//detaily.com/IMG/d-dwg06.gif');
}
.tooltipdwg .tooltiptextdwg {
    visibility: hidden;
    background-color: #33cc33;
    color: #000000;
    font-family: Arial, Veranda, Helvetica, sans-serif;
    font-size: 11px;
    text-align: center;
    border-radius: 4px;
    padding: 3px;
/* Position the tooltip */
    position: absolute;
    z-index: 1;
    bottom: 130%;
    left: 100%;
    margin-left: -30px;
}

.tooltipdwg:hover .tooltiptextdwg {
    visibility: visible;
}
.tooltiptextdwg:before {
	content: "AutCAD_DWG_File";
}
.fileawsb {
  grid-column: 4;
  -ms-grid-column: 4;
  grid-row: 2;
  -ms-grid-row: 2;
}
.tooltipaws {
    position: relative;
    display: inline-block;
}

#awsb {
  width: 19px;
  height: 15px;
  background-image: url('//detaily.com/IMG/d-aws-b.gif');  
}
#awsb:hover {
	width: 19px;
	height: 15px;
	background-image: url('//detaily.com/IMG/d-aws.gif');
}
.tooltipaws .tooltiptextaws {
    visibility: hidden;
    background-color: #33cc33;
    color: #000000;
    font-family: Arial, Veranda, Helvetica, sans-serif;
    font-size: 11px;
    text-align: center;
    border-radius: 4px;
    padding: 3px;
/* Position the tooltip */
    position: absolute;
    z-index: 1;
    bottom: 130%;
    left: 100%;
    margin-left: -40px;
}

.tooltipaws:hover .tooltiptextaws {
    visibility: visible;
}
.tooltiptextaws:before {
	content: "AutCAD_AWS_File";
}

.filerfab {
  grid-column: 5;
  -ms-grid-column: 5;
  grid-row: 2;
  -ms-grid-row: 2;
}
.tooltiprfa {
    position: relative;
    display: inline-block;
}

#rfab {
  width: 19px;
  height: 15px;
  background-image: url('//detaily.com/IMG/d-rfa-b.gif');  
}
#rfab:hover {
	width: 19px;
	height: 15px;
	background-image: url('//detaily.com/IMG/d-rfa.gif');
}
.tooltiprfa .tooltiptextrfa {
    visibility: hidden;
    background-color: #33cc33;
    color: #000000;
    font-family: Arial, Veranda, Helvetica, sans-serif;
    font-size: 11px;
    text-align: center;
    border-radius: 4px;
    padding: 3px;
/* Position the tooltip */
    position: absolute;
    z-index: 1;
    bottom: 130%;
    left: 100%;
    margin-left: -40px;
}

.tooltiprfa:hover .tooltiptextrfa {
    visibility: visible;
}
.tooltiptextrfa:before {
	content: "Revit_Family_RFA_File";
}
.filervtb {
  grid-column: 6;
  -ms-grid-column: 6;
  -ms-grid-row: 2;
  grid-row: 2;
}
.tooltiprvt {
    position: relative;
    display: inline-block;
}

#rvtb {
  width: 19px;
  height: 15px;
  background-image: url('//detaily.com/IMG/d-rvt-b.gif');  
}
#rvtb:hover {
	width: 19px;
	height: 15px;
	background-image: url('//detaily.com/IMG/d-rvt.gif');
}
.tooltiprvt .tooltiptextrvt {
    visibility: hidden;
    background-color: #33cc33;
    color: #000000;
    font-family: Arial, Veranda, Helvetica, sans-serif;
    font-size: 11px;
    text-align: center;
    border-radius: 4px;
    padding: 3px;
/* Position the tooltip */
    position: absolute;
    z-index: 1;
    bottom: 130%;
    left: 100%;
    margin-left: -40px;
}

.tooltiprvt:hover .tooltiptextrvt {
    visibility: visible;
}
.tooltiptextrvt:before {
	content: "Revit_RVT_File";
}
.filepinb {
  grid-column: 7;
  -ms-grid-column: 7;
  grid-row: 2;
  -ms-grid-row: 2;
}
.tooltippin {
    position: relative;
    display: inline-block;
}

#pinb {
  width: 19px;
  height: 15px;
  background-image: url('//detaily.com/IMG/d-pin-b.gif');  
}
#pinb:hover {
	width: 19px;
	height: 15px;
	background-image: url('//detaily.com/IMG/d-pin.gif');
}
.tooltippin .tooltiptextpin {
    visibility: hidden;
    background-color: #33cc33;
    color: #000000;
    font-family: Arial, Veranda, Helvetica, sans-serif;
    font-size: 11px;
    text-align: center;
    border-radius: 4px;
    padding: 3px;
/* Position the tooltip */
    position: absolute;
    z-index: 1;
    bottom: 130%;
    left: 100%;
    margin-left: -40px;
}

.tooltippin:hover .tooltiptextpin {
    visibility: visible;
}
.tooltiptextpin:before {
	content: "ArchiCAD_PLN_File";
}
.filedtyb {
  grid-column: 8;
  -ms-grid-column: 8;
  -ms-grid-row: 2;
  grid-row: 2;
}
.tooltipdty {
    position: relative;
    display: inline-block;
}

#dtyb {
  width: 19px;
  height: 15px;
  background-image: url('//detaily.com/IMG/d-drw-b.gif');  
}
#dtyb:hover {
	width: 19px;
	height: 15px;
	background-image: url('//detaily.com/IMG/d-drw.gif');
}
.tooltipdty .tooltiptextdty {
    visibility: hidden;
    background-color: #33cc33;
    color: #000000;
    font-family: Arial, Veranda, Helvetica, sans-serif;
    font-size: 11px;
    text-align: center;
    border-radius: 4px;
    padding: 3px;
/* Position the tooltip */
    position: absolute;
    z-index: 1;
    bottom: 130%;
    left: 100%;
    margin-left: -40px;
}

.tooltipdty:hover .tooltiptextdty {
    visibility: visible;
}
.tooltiptextdty:before {
	content: "Detaily_DTY_File";
}
.filedxfc {
  grid-column: 1;
  -ms-grid-column: 1;
  grid-row: 3;
  -ms-grid-row: 3;
}
.dxfc:before {
 	content: "0 K";
 	color: #cecece;
 	font-size: 10px;
}
.filedwfc {
  grid-column: 2;
  -ms-grid-column: 2;
  grid-row: 3;
  -ms-grid-row: 3;
}
.dwfc:before {
 	content: "0 K";
 	color: #cecece;
 	font-size: 10px;
}
.filedwgc {
  grid-column: 3;
  -ms-grid-column: 3;
  -ms-grid-row: 3;
  grid-row: 3;
}
.dwgc:before {
 	content: "0 K";
 	color: #cecece;
 	font-size: 10px;
}
.fileawsc {
  grid-column: 4;
  -ms-grid-column: 4;
  grid-row: 3;
  -ms-grid-row: 3;
}
.awsc:before {
 	content: "0 K";
 	color: #cecece;
 	font-size: 10px;
}
.filerfac {
  grid-column: 5;
  -ms-grid-column: 5;
  grid-row: 3;
  -ms-grid-row: 3;
}
.rfac:before {
 	content: "0 K";
 	color: #cecece;
 	font-size: 10px;
}
.filervtc {
  grid-column: 6;
  -ms-grid-column: 6;
  -ms-grid-row: 3;
  grid-row: 3;
}
.rvtc:before {
 	content: "0 K";
 	color: #cecece;
 	font-size: 10px;
}
.filepinc {
  grid-column: 7;
  -ms-grid-column: 7;
  grid-row: 3;
  -ms-grid-row: 3;
}
.pinc:before {
 	content: "0 K";
 	color: #cecece;
 	font-size: 10px;
}
.filedtyc {
  grid-column: 8;
  -ms-grid-column: 8;
  -ms-grid-row: 3;
  grid-row: 3;
}
.dtyc:before {
 	content: "0 K";
 	color: #cecece;
 	font-size: 10px;
}


/* css-grid container for downloadmid */

.grid-dloadcontainer {
  display: grid;
  display: -ms-grid;
  grid-gap: 2px;
  padding: 5px;
}
.grid-dload {
  text-align: left;
  padding: 1px;
}

.filepdfa {
  grid-column: 1;
  -ms-grid-column: 1;
  grid-row: 1;
  -ms-grid-row: 1;
  
}
.pdfa:before {
 	content: "PDF";
 	color: #cecece;
 	font-size: 10px;
}
.filetxta {
  grid-column: 2;
  -ms-grid-column: 2;
  grid-row: 1;
  -ms-grid-row: 1;
}
.txta:before {
 	content: "TXT";
 	color: #cecece;
 	font-size: 10px;
}
.filewmva {
  grid-column: 3;
  -ms-grid-column: 3;
  -ms-grid-row: 1;
  grid-row: 1;
}
.wmva:before {
 	content: "WMA";
 	color: #cecece;
 	font-size: 10px;
}
.fileslda {
  grid-column: 4;
  -ms-grid-column: 4;
  grid-row: 1;
  -ms-grid-row: 1;
}
.slda:before {
 	content: "SLD";
 	color: #cecece;
 	font-size: 10px;
}
.fileedra {
  grid-column: 5;
  -ms-grid-column: 5;
  grid-row: 1;
  -ms-grid-row: 1;
}
.edra:before {
 	content: "EDR";
 	color: #cecece;
 	font-size: 10px;
}
.filejtsa {
  grid-column: 6;
  -ms-grid-column: 6;
  grid-row: 1;
  -ms-grid-row: 1;
}
.jtsa:before {
 	content: "JTS";
 	color: #cecece;
 	font-size: 10px;
}
.filedgna {
  grid-column: 7;
  -ms-grid-column: 7;
  grid-row: 1;
  -ms-grid-row: 1;
}
.dgna:before {
 	content: "DGN";
 	color: #cecece;
 	font-size: 10px;
}
.fileskpa {
  grid-column: 8;
  -ms-grid-column: 8;
  -ms-grid-row: 1;
  grid-row: 1;
}
.skpa:before {
 	content: "SKP";
 	color: #cecece;
 	font-size: 10px;
}
.filepdfb {
  grid-column: 1;
  -ms-grid-column: 1;
  grid-row: 2;
  -ms-grid-row: 2;

}
.tooltippdf {
    position: relative;
    display: inline-block;
}

#pdfb {
	width: 19px;
	height: 15px;
  background-image: url('//detaily.com/IMG/d-pdf-b.gif')
    
}
#pdfb:hover {
	width: 19px;
	height: 15px;
	background-image: url('//detaily.com/IMG/d-pdf.gif')
	
}
.tooltippdf .tooltiptextpdf {
    visibility: hidden;
    background-color: #33cc33;
    color: #000000;
    font-family: Arial, Veranda, Helvetica, sans-serif;
    font-size: 11px;
    text-align: center;
    border-radius: 4px;
    padding: 3px;
/* Position the tooltip */
    position: absolute;
    z-index: 1;
    bottom: 130%;
    left: 100%;
    margin-left: -10px;
}

.tooltippdf:hover .tooltiptextpdf {
    visibility: visible;
}
.tooltiptextpdf:before {
	content: "Adobe_PDF_File";
}


.filetxtb {
  grid-column: 2;
  -ms-grid-column: 2;
  grid-row: 2;
  -ms-grid-row: 2;
}
.tooltiptxt {
    position: relative;
    display: inline-block;
}

#txtb {
  width: 19px;
  height: 15px;
  background-image: url('//detaily.com/IMG/d-txt-b.gif');  
}
#txtb:hover {
	width: 19px;
	height: 15px;
	background-image: url('//detaily.com/IMG/d-txt.gif');
}
.tooltiptxt .tooltiptexttxt {
    visibility: hidden;
    background-color: #33cc33;
    color: #000000;
    font-family: Arial, Veranda, Helvetica, sans-serif;
    font-size: 11px;
    text-align: center;
    border-radius: 4px;
    padding: 3px;
/* Position the tooltip */
    position: absolute;
    z-index: 1;
    bottom: 130%;
    left: 100%;
    margin-left: -20px;
}

.tooltiptxt:hover .tooltiptexttxt {
    visibility: visible;
}
.tooltiptexttxt:before {
	content: "Simple_TXT_File";
}
.filewmvb {
  grid-column: 3;
  -ms-grid-column: 3;
  -ms-grid-row: 2;
  grid-row: 2;
}
.tooltipwmv {
    position: relative;
    display: inline-block;
}

#wmvb {
  width: 19px;
  height: 15px;
  background-image: url('//detaily.com/IMG/d-wmv-b.gif');  
}
#wmvb:hover {
	width: 19px;
	height: 15px;
	background-image: url('//detaily.com/IMG/d-wmv.gif');
}
.tooltipwmv .tooltiptextwmv {
    visibility: hidden;
    background-color: #33cc33;
    color: #000000;
    font-family: Arial, Veranda, Helvetica, sans-serif;
    font-size: 11px;
    text-align: center;
    border-radius: 4px;
    padding: 3px;
/* Position the tooltip */
    position: absolute;
    z-index: 1;
    bottom: 130%;
    left: 100%;
    margin-left: -60px;
}

.tooltipwmv:hover .tooltiptextwmv {
    visibility: visible;
}
.tooltiptextwmv:before {
	content: "Windows_Media_WMV_File";
}
.filesldb {
  grid-column: 4;
  -ms-grid-column: 4;
  grid-row: 2;
  -ms-grid-row: 2;
}
.tooltipsld {
    position: relative;
    display: inline-block;
}

#sldb {
  width: 19px;
  height: 15px;
  background-image: url('//detaily.com/IMG/d-sld-b.gif');  
}
#sldb:hover {
	width: 19px;
	height: 15px;
	background-image: url('//detaily.com/IMG/d-sld.gif');
}
.tooltipsld .tooltiptextsld {
    visibility: hidden;
    background-color: #33cc33;
    color: #000000;
    font-family: Arial, Veranda, Helvetica, sans-serif;
    font-size: 11px;
    text-align: center;
    border-radius: 4px;
    padding: 3px;
/* Position the tooltip */
    position: absolute;
    z-index: 1;
    bottom: 130%;
    left: 100%;
    margin-left: -60px;
}

.tooltipsld:hover .tooltiptextsld {
    visibility: visible;
}
.tooltiptextsld:before {
	content: "Dassult_SLD_File";
}

.fileedrb {
  grid-column: 5;
  -ms-grid-column: 5;
  grid-row: 2;
  -ms-grid-row: 2;
}
.tooltipedr {
    position: relative;
    display: inline-block;
}

#edrb {
  width: 19px;
  height: 15px;
  background-image: url('//detaily.com/IMG/d-edr-b.gif');  
}
#edrb:hover {
	width: 19px;
	height: 15px;
	background-image: url('//detaily.com/IMG/d-edr.gif');
}
.tooltipedr .tooltiptextedr{
    visibility: hidden;
    background-color: #33cc33;
    color: #000000;
    font-family: Arial, Veranda, Helvetica, sans-serif;
    font-size: 11px;
    text-align: center;
    border-radius: 4px;
    padding: 3px;
/* Position the tooltip */
    position: absolute;
    z-index: 1;
    bottom: 130%;
    left: 100%;
    margin-left: -60px;
}

.tooltipedr:hover .tooltiptextedr {
    visibility: visible;
}
.tooltiptextedr:before {
	content: "SolidWorks_EDR_File";
}
.filejtsb {
  grid-column: 6;
  -ms-grid-column: 6;
  -ms-grid-row: 2;
  grid-row: 2;
}
.tooltipjts {
    position: relative;
    display: inline-block;
}

#jtsb {
  width: 19px;
  height: 15px;
  background-image: url('//detaily.com/IMG/d-jts-b.gif');  
}
#jtsb:hover {
	width: 19px;
	height: 15px;
	background-image: url('//detaily.com/IMG/d-jts.gif');
}
.tooltipjts .tooltiptextjts {
    visibility: hidden;
    background-color: #33cc33;
    color: #000000;
    font-family: Arial, Veranda, Helvetica, sans-serif;
    font-size: 11px;
    text-align: center;
    border-radius: 4px;
    padding: 3px;
/* Position the tooltip */
    position: absolute;
    z-index: 1;
    bottom: 130%;
    left: 100%;
    margin-left: -60px;
}

.tooltipjts:hover .tooltiptextjts {
    visibility: visible;
}
.tooltiptextjts:before {
	content: "Siemens_PLM_JT_File";
}
.filedgnb {
  grid-column: 7;
  -ms-grid-column: 7;
  grid-row: 2;
  -ms-grid-row: 2;
}
.tooltipdgn {
    position: relative;
    display: inline-block;
}

#dgnb {
  width: 19px;
  height: 15px;
  background-image: url('//detaily.com/IMG/d-dgn-b.gif');  
}
#dgnb:hover {
	width: 19px;
	height: 15px;
	background-image: url('//detaily.com/IMG/d-dgn.gif');
}
.tooltipdgn .tooltiptextdgn {
    visibility: hidden;
    background-color: #33cc33;
    color: #000000;
    font-family: Arial, Veranda, Helvetica, sans-serif;
    font-size: 11px;
    text-align: center;
    border-radius: 4px;
    padding: 3px;
/* Position the tooltip */
    position: absolute;
    z-index: 1;
    bottom: 130%;
    left: 100%;
    margin-left: -60px;
}

.tooltipdgn:hover .tooltiptextdgn {
    visibility: visible;
}
.tooltiptextdgn:before {
	content: "Bentley_DGN_File";
}
.fileskpb {
  grid-column: 8;
  -ms-grid-column: 8;
  -ms-grid-row: 2;
  grid-row: 2;
}
.tooltipskp {
    position: relative;
    display: inline-block;
}

#skpb {
  width: 19px;
  height: 15px;
  background-image: url('//detaily.com/IMG/d-skp-b.gif');  
}
#skpb:hover {
	width: 19px;
	height: 15px;
	background-image: url('//detaily.com/IMG/d-skp.gif');
}
.tooltipskp .tooltiptextskp {
    visibility: hidden;
    background-color: #33cc33;
    color: #000000;
    font-family: Arial, Veranda, Helvetica, sans-serif;
    font-size: 11px;
    text-align: center;
    border-radius: 4px;
    padding: 3px;
/* Position the tooltip */
    position: absolute;
    z-index: 1;
    bottom: 130%;
    left: 100%;
    margin-left: -60px;
}

.tooltipskp:hover .tooltiptextskp {
    visibility: visible;
}
.tooltiptextskp:before {
	content: "SketchUP-SKP_File";
}

.filepdfc {
  grid-column: 1;
  -ms-grid-column: 1;
  grid-row: 3;
  -ms-grid-row: 3;
}
.pdfc:before {
 	content: "0 K";
 	color: #cecece;
 	font-size: 10px;
}
.filetxtc {
  grid-column: 2;
  -ms-grid-column: 2;
  grid-row: 3;
  -ms-grid-row: 3;
}
.txtc:before {
 	content: "0 K";
 	color: #cecece;
 	font-size: 10px;
}
.filewmvc {
  grid-column: 3;
  -ms-grid-column: 3;
  -ms-grid-row: 3;
  grid-row: 3;
}
.wmvc:before {
 	content: "0 K";
 	color: #cecece;
 	font-size: 10px;
}
.filesldc {
  grid-column: 4;
  -ms-grid-column: 4;
  grid-row: 3;
  -ms-grid-row: 3;
}
.sldc:before {
 	content: "0 K";
 	color: #cecece;
 	font-size: 10px;
}
.fileedrc {
  grid-column: 5;
  -ms-grid-column: 5;
  grid-row: 3;
  -ms-grid-row: 3;
}
.edrc:before {
 	content: "0 K";
 	color: #cecece;
 	font-size: 10px;
}
.filejtsc {
  grid-column: 6;
  -ms-grid-column: 6;
  -ms-grid-row: 3;
  grid-row: 3;
}
.jtsc:before {
 	content: "0 K";
 	color: #cecece;
 	font-size: 10px;
}
.filedgnc {
  grid-column: 7;
  -ms-grid-column: 7;
  grid-row: 3;
  -ms-grid-row: 3;
}
.dgnc:before {
 	content: "0 K";
 	color: #cecece;
 	font-size: 10px;
}
.fileskpc {
  grid-column: 8;
  -ms-grid-column: 8;
  -ms-grid-row: 3;
  grid-row: 3;
}
.skpc:before {
 	content: "0 K";
 	color: #cecece;
 	font-size: 10px;
}

/* css-grid container for downloadright */


.grid-dloadcontainer {
  display: grid;
  display: -ms-grid;
  grid-gap: 2px;
  padding: 5px;
}
.grid-dload {
  text-align: left;
  padding: 1px;
}

.filedoca {
  grid-column: 1;
  -ms-grid-column: 1;
  grid-row: 1;
  -ms-grid-row: 1;
  
}
.doca:before {
 	content: "DOC";
 	color: #cecece;
 	font-size: 10px;
}
.filexlsa {
  grid-column: 2;
  -ms-grid-column: 2;
  grid-row: 1;
  -ms-grid-row: 1;
}
.xlsa:before {
 	content: "XLS";
 	color: #cecece;
 	font-size: 10px;
}
.fileppta {
  grid-column: 3;
  -ms-grid-column: 3;
  -ms-grid-row: 1;
  grid-row: 1;
}
.ppta:before {
 	content: "PPT";
 	color: #cecece;
 	font-size: 10px;
}
.filetifa {
  grid-column: 4;
  -ms-grid-column: 4;
  grid-row: 1;
  -ms-grid-row: 1;
}
.tifa:before {
 	content: "TIF";
 	color: #cecece;
 	font-size: 10px;
}
.filerara {
  grid-column: 5;
  -ms-grid-column: 5;
  grid-row: 1;
  -ms-grid-row: 1;
}
.rara:before {
 	content: "RAR";
 	color: #cecece;
 	font-size: 10px;
}
.filezipa {
  grid-column: 6;
  -ms-grid-column: 6;
  -ms-grid-row: 1;
  grid-row: 1;
}
.zipa:before {
 	content: "ZIP";
 	color: #cecece;
 	font-size: 10px;
}
.filejpga {
  grid-column: 7;
  -ms-grid-column: 7;
  grid-row: 1;
  -ms-grid-row: 1;
}
.jpga:before {
 	content: "JPG";
 	color: #cecece;
 	font-size: 10px;
}
.filedeta {
  grid-column: 8;
  -ms-grid-column: 8;
  -ms-grid-row: 1;
  grid-row: 1;
}
.deta:before {
 	content: "DET";
 	color: #cecece;
 	font-size: 10px;
}
.filedocb {
  grid-column: 1;
  -ms-grid-column: 1;
  grid-row: 2;
  -ms-grid-row: 2;

}
.tooltipdoc {
    position: relative;
    display: inline-block;
}

#docb {
	width: 19px;
	height: 15px;
  background-image: url('//detaily.com/IMG/d-doc-b.gif')
    
}
#docb:hover {
	width: 19px;
	height: 15px;
	background-image: url('//detaily.com/IMG/d-doc.gif')
	
}
.tooltipdoc .tooltiptextdoc {
    visibility: hidden;
    background-color: #33cc33;
    color: #000000;
    font-family: Arial, Veranda, Helvetica, sans-serif;
    font-size: 11px;
    text-align: center;
    border-radius: 4px;
    padding: 3px;
/* Position the tooltip */
    position: absolute;
    z-index: 1;
    bottom: 130%;
    left: 100%;
    margin-left: -10px;
}

.tooltipdoc:hover .tooltiptextdoc{
    visibility: visible;
}
.tooltiptextdoc:before {
	content: "MS_DOC_File";
}


.filexlsb {
  grid-column: 2;
  -ms-grid-column: 2;
  grid-row: 2;
  -ms-grid-row: 2;
}
.tooltipxls {
    position: relative;
    display: inline-block;
}

#xlsb {
  width: 19px;
  height: 15px;
  background-image: url('//detaily.com/IMG/d-xls-b.gif');  
}
#xlsb:hover {
	width: 19px;
	height: 15px;
	background-image: url('//detaily.com/IMG/d-xls.gif');
}
.tooltipxls .tooltiptextxls {
    visibility: hidden;
    background-color: #33cc33;
    color: #000000;
    font-family: Arial, Veranda, Helvetica, sans-serif;
    font-size: 11px;
    text-align: center;
    border-radius: 4px;
    padding: 3px;
/* Position the tooltip */
    position: absolute;
    z-index: 1;
    bottom: 130%;
    left: 100%;
    margin-left: -20px;
}

.tooltipxls:hover .tooltiptextxls{
    visibility: visible;
}
.tooltiptextxls:before {
	content: "MS_XLS_File";
}
.filepptb {
  grid-column: 3;
  -ms-grid-column: 3;
  -ms-grid-row: 2;
  grid-row: 2;
}
.tooltipppt{
    position: relative;
    display: inline-block;
}

#pptb {
  width: 19px;
  height: 15px;
  background-image: url('//detaily.com/IMG/d-ppt-b.gif');  
}
#pptb:hover {
	width: 19px;
	height: 15px;
	background-image: url('//detaily.com/IMG/d-ppt.gif');
}
.tooltipppt .tooltiptextppt {
    visibility: hidden;
    background-color: #33cc33;
    color: #000000;
    font-family: Arial, Veranda, Helvetica, sans-serif;
    font-size: 11px;
    text-align: center;
    border-radius: 4px;
    padding: 3px;
/* Position the tooltip */
    position: absolute;
    z-index: 1;
    bottom: 130%;
    left: 100%;
    margin-left: -60px;
}

.tooltipppt:hover .tooltiptextppt {
    visibility: visible;
}
.tooltiptextppt:before {
	content: "MS_PPT_File";
}
.filetifb {
  grid-column: 4;
  -ms-grid-column: 4;
  grid-row: 2;
  -ms-grid-row: 2;
}
.tooltiptif {
    position: relative;
    display: inline-block;
}

#tifb {
  width: 19px;
  height: 15px;
  background-image: url('//detaily.com/IMG/d-tif-b.gif');  
}
#tifb:hover {
	width: 19px;
	height: 15px;
	background-image: url('//detaily.com/IMG/d-tif.gif');
}
.tooltiptif .tooltiptexttif {
    visibility: hidden;
    background-color: #33cc33;
    color: #000000;
    font-family: Arial, Veranda, Helvetica, sans-serif;
    font-size: 11px;
    text-align: center;
    border-radius: 4px;
    padding: 3px;
/* Position the tooltip */
    position: absolute;
    z-index: 1;
    bottom: 130%;
    left: 100%;
    margin-left: -60px;
}

.tooltiptif:hover .tooltiptexttif {
    visibility: visible;
}
.tooltiptexttif:before {
	content: "TIFF_File";
}

.filerarb {
  grid-column: 5;
  -ms-grid-column: 5;
  grid-row: 2;
  -ms-grid-row: 2;
}
.tooltiprar {
    position: relative;
    display: inline-block;
}

#rarb {
  width: 19px;
  height: 15px;
  background-image: url('//detaily.com/IMG/d-rar-b.gif');  
}
#rarb:hover {
	width: 19px;
	height: 15px;
	background-image: url('//detaily.com/IMG/d-rar.gif');
}
.tooltiprar .tooltiptextrar {
    visibility: hidden;
    background-color: #33cc33;
    color: #000000;
    font-family: Arial, Veranda, Helvetica, sans-serif;
    font-size: 11px;
    text-align: center;
    border-radius: 4px;
    padding: 3px;
/* Position the tooltip */
    position: absolute;
    z-index: 1;
    bottom: 130%;
    left: 100%;
    margin-left: -60px;
}

.tooltiprar:hover .tooltiptextrar {
    visibility: visible;
}
.tooltiptextrar:before {
	content: "Compressed_RAR_File";
}
.filezipb {
  grid-column: 6;
  -ms-grid-column: 6;
  -ms-grid-row: 2;
  grid-row: 2;
}
.tooltipzip {
    position: relative;
    display: inline-block;
}

#zipb {
  width: 19px;
  height: 15px;
  background-image: url('//detaily.com/IMG/d-zip-b.gif');  
}
#zipb:hover {
	width: 19px;
	height: 15px;
	background-image: url('//detaily.com/IMG/d-zip.gif');
}
.tooltipzip .tooltiptextzip {
    visibility: hidden;
    background-color: #33cc33;
    color: #000000;
    font-family: Arial, Veranda, Helvetica, sans-serif;
    font-size: 11px;
    text-align: center;
    border-radius: 4px;
    padding: 3px;
/* Position the tooltip */
    position: absolute;
    z-index: 1;
    bottom: 130%;
    left: 100%;
    margin-left: -60px;
}

.tooltipzip:hover .tooltiptextzip {
    visibility: visible;
}
.tooltiptextzip:before {
	content: "ZIP_File";
}
.filejpgb {
  grid-column: 7;
  -ms-grid-column: 7;
  grid-row: 2;
  -ms-grid-row: 2;
}
.tooltipjpg {
    position: relative;
    display: inline-block;
}

#jpgb {
  width: 19px;
  height: 15px;
  background-image: url('//detaily.com/IMG/d-jpg-b.gif');  
}
#jpgb:hover {
	width: 19px;
	height: 15px;
	background-image: url('//detaily.com/IMG/d-jpg.gif');
}
.tooltipjpg .tooltiptextjpg {
    visibility: hidden;
    background-color: #33cc33;
    color: #000000;
    font-family: Arial, Veranda, Helvetica, sans-serif;
    font-size: 11px;
    text-align: center;
    border-radius: 4px;
    padding: 3px;
/* Position the tooltip */
    position: absolute;
    z-index: 1;
    bottom: 130%;
    left: 100%;
    margin-left: -60px;
}

.tooltipjpg:hover .tooltiptextjpg {
    visibility: visible;
}
.tooltiptextjpg:before {
	content: "JPG_Image_File";
}
.filedetb {
  grid-column: 8;
  -ms-grid-column: 8;
  -ms-grid-row: 2;
  grid-row: 2;
}
.tooltipdet {
    position: relative;
    display: inline-block;
}

#detb {
  width: 19px;
  height: 15px;
  background-image: url('//detaily.com/IMG/d-det-b.gif');  
}
#detb:hover {
	width: 19px;
	height: 15px;
	background-image: url('//detaily.com/IMG/d-det.gif');
}
.tooltipdet .tooltiptextdet {
    visibility: hidden;
    background-color: #33cc33;
    color: #000000;
    font-family: Arial, Veranda, Helvetica, sans-serif;
    font-size: 11px;
    text-align: center;
    border-radius: 4px;
    padding: 3px;
/* Position the tooltip */
    position: absolute;
    z-index: 1;
    bottom: 130%;
    left: 100%;
    margin-left: -60px;
}

.tooltipdet:hover .tooltiptextdet {
    visibility: visible;
}
.tooltiptextdet:before {
	content: "Detaily_DET_File";
}
.filedocc {
  grid-column: 1;
  -ms-grid-column: 1;
  grid-row: 3;
  -ms-grid-row: 3;
}
.docc:before {
 	content: "0 K";
 	color: #cecece;
 	font-size: 10px;
}
.filexlsc {
  grid-column: 2;
  -ms-grid-column: 2;
  grid-row: 3;
  -ms-grid-row: 3;
}
.xlsc:before {
 	content: "0 K";
 	color: #cecece;
 	font-size: 10px;
}
.filepptc {
  grid-column: 3;
  -ms-grid-column: 3;
  -ms-grid-row: 3;
  grid-row: 3;
}
.pptc:before {
 	content: "0 K";
 	color: #cecece;
 	font-size: 10px;
}
.filetifc {
  grid-column: 4;
  -ms-grid-column: 4;
  grid-row: 3;
  -ms-grid-row: 3;
}
.tifc:before {
 	content: "0 K";
 	color: #cecece;
 	font-size: 10px;
}
.filerarc {
  grid-column: 5;
  -ms-grid-column: 5;
  grid-row: 3;
  -ms-grid-row: 3;
}
.rarc:before {
 	content: "0 K";
 	color: #cecece;
 	font-size: 10px;
}
.filezipc {
  grid-column: 6;
  -ms-grid-column: 6;
  -ms-grid-row: 3;
  grid-row: 3;
}
.zipc:before {
 	content: "0 K";
 	color: #cecece;
 	font-size: 10px;
}
.filejpgc {
  grid-column: 7;
  -ms-grid-column: 7;
  grid-row: 3;
  -ms-grid-row: 3;
}
.jpgc:before {
 	content: "0 K";
 	color: #cecece;
 	font-size: 10px;
}
.filedetc {
  grid-column: 8;
  -ms-grid-column: 8;
  -ms-grid-row: 3;
  grid-row: 3;
}
.detc:before {
 	content: "0 K";
 	color: #cecece;
 	font-size: 10px;
}

/* grid container for detail information */


.grid-detcontainer {
  display: grid;
  display: -ms-grid;
  grid-template-columns: 14% 85%;
  grid-gap: 1px;
  padding: 5px;
}
.grid-det {
  text-align: left;
  padding: 1px;

}
.detinfo {
  grid-column: 1 / span 2;
  -ms-grid-column: 1 / span 2;
  grid-row: 1;
  -ms-grid-row: 1;
  color: #cecece;

}
.information:before {
  Content: "Detail Information:";
  font-family: Arial, Veranda, Helvetica, sans-serif;
  color: #f7e82b;
  font-weight: bold;
  font-size: 14px;
}
.pageinformation:before {
  Content: "External page Information:";
  font-family: Arial, Veranda, Helvetica, sans-serif;
  color: #f7e82b;
  font-weight: bold;
  font-size: 14px;
}
.detname {
  grid-column: 1;
  -ms-grid-column: 1;
  -ms-grid-row: 2;
  grid-row: 2;
}
.name:before {
Content: "Title:";
  font-family: Arial, Veranda, Helvetica, sans-serif;
  color: #33cc33;
  font-weight: bold;
  font-size: 14px;
}
.detname1 {
  grid-column: 2;
   -ms-grid-column: 2;
  -ms-grid-row: 2;
  grid-row: 2;
  color: #cecece;
}
.dettype {
  grid-column: 1;
   -ms-grid-column: 1;
	-ms-grid-row: 3;
	grid-row: 3;
}
.type:before {
Content: "File Type:";
  font-family: Arial, Veranda, Helvetica, sans-serif;
  color: #33cc33;
  font-weight: bold;
  font-size: 14px;
}
.dettype1 {
  grid-column: 2;
  -ms-grid-column: 2;
  -ms-grid-row: 3;
  grid-row: 3;
  color: #cecece;
}
.detscale {
  grid-column: 1;
  -ms-grid-column: 1;
  -ms-grid-row: 4;
  grid-row: 4;
}
.scale:before {
 Content: "Scale:";
  font-family: Arial, Veranda, Helvetica, sans-serif;
  color: #33cc33;
  font-weight: bold;
  font-size: 14px;
}

.detscale1 {
  grid-column: 2;
  -ms-grid-column: 2;
  -ms-grid-row: 4;
  grid-row: 4;
  color: #cecece;
}

.detagency {
  grid-column: 1;
  -ms-grid-column: 1;
  -ms-grid-row: 5;
  grid-row: 5;
}
.agency:before {
  Content: "Agency:";
  font-family: Arial, Veranda, Helvetica, sans-serif;
  color: #33cc33;
  font-weight: bold;
  font-size: 14px;
}
.detagency1 {
  grid-column: 2;
  -ms-grid-column: 2;
  -ms-grid-row: 5;
  grid-row: 5;
  color: #cecece;
}  

.detstate {
  grid-column: 1;
  -ms-grid-column: 1;
  -ms-grid-row: 6;
  grid-row: 6;
}
.state:before {
  Content: "State:";
  font-family: Arial, Veranda, Helvetica, sans-serif;
  color: #33cc33;
  font-weight: bold;
  font-size: 14px;
}
.detstate1 {
  grid-column: 2;
  -ms-grid-column: 2;
  -ms-grid-row: 6;
  grid-row: 6;
  color: #cecece;

}
.detcompany {
  grid-column: 1;
  -ms-grid-column: 1;
  -ms-grid-row: 5;
  grid-row: 5;
}
.company:before {
  Content: "Company:";
  font-family: Arial, Veranda, Helvetica, sans-serif;
  color: #33cc33;
  font-weight: bold;
  font-size: 14px;
}
.detcompany1 {
  grid-column: 2;
  -ms-grid-column: 2;
  -ms-grid-row: 5;
  grid-row: 5;
  color: #cecece;
}
.detmfg {
  grid-column: 1;
  -ms-grid-column: 1;
  -ms-grid-row: 6;
  grid-row:6;
}
.mfg:before {
  Content: "Manufacturer:";
  font-family: Arial, Veranda, Helvetica, sans-serif;
  color: #33cc33;
  font-weight: bold;
  font-size: 14px;
}

.detmfg1 {
  grid-column: 2;
  -ms-grid-column: 2;
  -ms-grid-row: 6;
  grid-row: 6;
  color: #cecece;
}
.detmisc {
  grid-column: 1;
  -ms-grid-column: 1;
  -ms-grid-row: 7;
  grid-row:7;
}
.misc:before {
  Content: "Miscellaneous:";
  font-family: Arial, Veranda, Helvetica, sans-serif;
  color: #33cc33;
  font-weight: bold;
  font-size: 14px;
}

.detmisc1 {
  grid-column: 2;
  -ms-grid-column: 2;
  -ms-grid-row: 7;
  grid-row: 7;
  color: #cecece;
}


.detdescrip {
  grid-column: 1 / span 2;
  -ms-grid-column: 1 / span 2;
  -ms-grid-row: 8;
  grid-row: 8;
  color: #cecece;
  
}
.description:before {
  Content: "Detail Description:";
  font-family: Arial, Veranda, Helvetica, sans-serif;
  color: #f7e82b;
  font-weight: bold;
  font-size: 14px;
}
.pagedescription:before {
  Content: "External Page Description:";
  font-family: Arial, Veranda, Helvetica, sans-serif;
  color: #f7e82b;
  font-weight: bold;
  font-size: 14px;
}
/* style detail sheet information 
-------------------------------------------------- */
/* 1 percent smaller than body */

.detailpage {
	display: table;
	width: 99%;
    border-collapse: collapse;
    border: 1px solid #33cc33;
	background-image: url('../IMG/bg-g.gif');
}

/* Style the detaildwg */
.detaildwg {
	padding: 5px;
	background-color: white;
}

/* Style the ads middle */
.adsdetmiddle {
	padding: 5px;
	
}
/* Style the Asoon ads middle */
.adsdetmiddleasoon {
	padding: 5px;
	margin-left: 15px;
}


/* Style the ads bottom */
.adsdetbottom {
	padding: 5px;
}

/* Style the ads bottom */
.adsdetbottomasoon {
	padding: 5px;
	margin-left: 15px;
}

/* Create three unequal columns that floats next to each other */
.column {
    float: left;
    padding: 5px;  
}

.columna {
    float: left;
    padding: 5px;
    background-color: #000000;
}
.columnb {
    float: left;
    padding: 5px;
    background-color: #cecece;
}
.rowempty {
display: table;
width: 100%;
}

.rowhoriz {
	height: 1px;
	width: 100%;
	background-color: #33cc33;
}
.column.policy {
    width: 70%;
    border-right: 1px solid #f7e82b;
}

.column.policylink {
    width: 100%;
}

.column.info {
    width: 74%;
}    
.addnote:before {    
  Content: "Additional Notes:";
  font-family: Arial, Veranda, Helvetica, sans-serif;
  color: #33cc33;
  font-weight: bold;
  font-size: 14px;
}   

.column.notes {
    width: 65%;
    color: #cecece;  
}
.column.filename {
    width: 30%;
    color: #cecece;
}   
.detname0:before {
  Content: "File_Name:";
  font-family: Arial, Veranda, Helvetica, sans-serif;
  color: #33cc33;
  font-weight: bold;
  font-size: 14px;
}  

.column.adsdetright {
    width: 26%; 
}

.column.share {
    width: 35%;
    border-left: 1px solid #f7e82b; 
}
.sharethis:before {
  Content: "Share This Detail:";
  font-family: Arial, Veranda, Helvetica, sans-serif;
  color: #f7e82b;
  font-weight: bold;
  font-size: 14px;
}

.columna.downloadleft {
    width: 33%;     
}
.columna.downloadmid {
    width: 34%;     
}
.columna.downloadright {
    width: 33%;     
}


/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
@media (max-width: 800px) {
    .columna.downloadleft, .columna.downloadmid, .columna.downloadright {
        width: 100%;
    }
}
/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
@media (max-width: 480px) {
    .columna.downloadleft, .columna.downloadmid, .columna.downloadright {
        width: 100%;
    }
}
/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
@media (max-width: 320px) {
    .columna.downloadleft, .columna.downloadmid, .columna.downloadright {
        width: 100%;
    }
}
/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
@media (max-width: 800px) {
    .column.notes, .column.share {
        width: 99%;
    }
}

/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
@media (max-width: 800px) {
    .column.info, .column.adsdetright {
        width: 99%;
    }
}
/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
@media (max-width: 800px) {
    .column.policy, .column.filename {
        width: 99%;
    }
}
/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
@media (max-width: 800px) {
    .column.adsdetmiddle, .column.adsdetmiddleasoon {
        width: 99%;
    }
}
/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
@media (max-width: 800px) {
    .column.adsdetbottom, .column.adsdetbottomasoon {
        width: 99%;
    }
}
/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
@media (max-width: 480px) {
    .column.adsdetmiddleasoon, .column.adsdetmiddleasoon {
        width: 99%;
    }
}
/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
@media (max-width: 480px) {
    .column.adsdetbottom, .column.adsdetbottomasoon {
        width: 99%;
    }
}
/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
@media (max-width: 320px) {
    .column.adsdetmiddleasoon, .column.adsdetmiddleasoon {
        width: 99%;
    }
}
/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
@media (max-width: 320px) {
    .column.adsdetbottom, .column.adsdetbottomasoon {
        width: 99%;
    }
}


.columna.term {
    width: 100%;     
}

.columna.detdownload {
    width: 100%;     
}

.detdown:before {
  Content: "Available files for download:";
  font-family: Arial, Veranda, Helvetica, sans-serif;
  color: #f7e82b;
  font-weight: bold;
  font-size: 14px;
}

/* Clear floats after the columns */
.row:after {
    content: "";
    display: table;
    clear: both;
}

/* This is top external pages */

/* table setting */


.htable {
display: table;
background: #D4D0C8;
width: 100%;
border-collapse: collapse;
}
.hrow {
display: table-row;
width: auto;
clear: both;
}

.hcell {
display: table-cell;
width: auto;
}

.hfolder {
background: #EAE8E4;
width: 280px;
white-space: nowrap;
padding: 3px;
border: 1px;
border-top-right-radius: 10px;
}
.hlogo {	
background-image: url('../IMG/h-htm-tab.png');
background-position: center;	
width: 20px;
height: 22px;
line-height: 20px;
border: 1px;
border-top-left-radius: 10px;
}
.hfolder:before {    
  Content: "Link address to this external webpage:";
  font-family: Arial, Veranda, Helvetica, sans-serif;
  margin-left: 5px;
  color: #C40000;
  font-weight: bold;
  font-size: 14px;
}
.hfoldertop {
background: #D4D0C8;	
height: 5px;
}
.hfolderbefore { 	
width: 5%;
border: 1px;
border-bottom-right-radius: 10px;
}
.hfolderafter {	
width: auto;
border: 1px;
border-bottom-left-radius: 10px;
}

/* bot li setting */

#hcontainbot {
 text-align: left; 
 margin: 0px;
 }
#hlink {
 width: 100%;
 background: #EAE8E4;
 height: 34px;
 padding: 0px;
 border: 1px solid #EAE8E4;
 }
#hlink ul {
 list-style-type: none;
 padding: 0px;
 margin: 3px;
 }
#hlink ul li{
 float: left;
 border: 1px solid #EAE8E4;
 } 
 
#hreload a{
 font-family: Arial, Veranda, Helvetica, sans-serif;
 font-size: 1em;
 color: grey;
 text-decoration: none;
 display: block;
 width: 24px;
 height: 24px;
 line-height: 24px;
 margin-left: 10px;
  margin-right: 14px;
 background-image: url('../IMG/h-reload.png');
 -webkit-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;	
 }
#hreload a:hover { 
 background-image: url('../IMG/h-reload-hov.png');
 transform: scale(1);
 font-weight: bold;
 color: black;
 }	
#hhome a{
 font-family: Arial, Veranda, Helvetica, sans-serif;
 font-size: 1em;
 color: grey;
 text-decoration: none;
 display: block;
 width: 24px;
 height: 24px;
 line-height: 24px;
 margin-left: 50px;
  margin-right: 10px;
 background-image: url('../IMG/h-home.png');
 -webkit-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;	
	
 }
#hhome a:hover { 
 background-image: url('../IMG/h-home-hov.png');
 transform: scale(1);
 font-weight: bold;
 color: black;
 }	
#hpage a{
background: #ffffff;
width: 140%;
white-space: nowrap;
font-family: Arial, Veranda, Helvetica, sans-serif;
margin-left: 5px;
color: #B0B0B0;
font-size: 14px;
text-decoration: none;
display: block;
padding: 3px;
border: 1px solid green;
box-shadow: 3px 3px 3px #888888;
}	

#hpage a:hover { 
  background: #f3f3f3;
  color: #979797;
}

/* top li setting */ 
 #hcontaintop {
 text-align: left; 
 margin: 0px;
 }
#htitle {
 width: 100%;
background-image: url('../IMG/dtlbg-link1600.gif');	
 height: 30px;
 padding: 0px;
border-top: 1px solid white; 
border-bottom: 1px solid white; 
 }
 #htitle ul {
 list-style-type: none;
 padding: 0px;
 margin: 1px;
 }
#htitle ul li{
 float: left;
 } 
#hname {
 font-family: Arial, Veranda, Helvetica, sans-serif;
 font-size: 16px;
  width: auto;
 white-space: nowrap;
 color: yellow;
 display: block;
  padding: 2px;
  margin-left: 20px;
  margin-right: 2px;	
}
 #hname:before {
	Content: "Link title:";  
color: yellow;
 }   
  
 #hheading {
 font-family: Arial, Veranda, Helvetica, sans-serif;
 font-size: 16px;
 white-space: nowrap;
 color: #ffffff;
 display: block;
 padding: 2px;
 margin-right: 20px;
 } 
#hul {
 float: right;
}
 #hdirect a{
 font-family: Arial, Veranda, Helvetica, sans-serif;
 font-size: 1em;
 color: grey;
 text-decoration: none;
 display: block;
 width: 22px;
 height: 22px;
 line-height: 22px;
 margin: 1px 4px 3px 8px;
 background-image: url('../IMG/h-newtab.png');
 -webkit-transition: all 0.4s ease-in-out;
 transition: all 0.4s ease-in-out;	
	
 }
#hdirect a:hover { 
 background-image: url('../IMG/h-newtab-hov.png');
 transform: scale(1);
 color: black;
 }
#hfront a{
 font-family: Arial, Veranda, Helvetica, sans-serif;
 font-size: 1em;
 color: grey;
 text-decoration: none;
 display: block;
 width: 22px;
 height: 22px;
 line-height: 22px;
 margin: 1px 4px 3px 2px;
 background-image: url('../IMG/h-dethome.png');
 -webkit-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;	
	
 }
#hfront a:hover { 
 background-image: url('../IMG/h-dethome-hov.png');
 transform: scale(1);
 color: black;
 }
 #hterm a{
 font-family: Arial, Veranda, Helvetica, sans-serif;
 font-size: 1em;
 color: grey;
 text-decoration: none;
 display: block;
 width: 22px;
 height: 22px;
 line-height: 22px;
 margin: 1px 8px 3px 2px;
 background-image: url('../IMG/h-detterm.png');
 -webkit-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;	
	
 }
#hterm a:hover { 
 background-image: url('../IMG/h-detterm-hov.png');
 transform: scale(1);
 color: black;
 }
 @media screen and (max-width: 700px) {
#hhome a{
 display: none;
 }	
 #hreload a{
 display: none;
 }	
#hname {
 display: none;
 }
 #hheading{
 display: none;
 }
 #hul {
float: left;	 
 }
 }
/* End of top external pages */


/* JPG responsive
-------------------------------------------------- */
.fill {object-fit: fill;}
.contain {object-fit: contain;}   /* use this */
.cover {object-fit: cover;}
.scale-down {object-fit: scale-down;}
.none {object-fit: none;}

.responsive {
    width: 100%;
    height: auto;
}

/*
  Detaily's iframe responsive heights

*/

.framefit { width: 100%; height: auto; border: 0px;
} 

@media screen and (min-width: 100px) {
  .framefit {
    height: 62px;
  }
  .detaildwg {
	padding: 3px;
  }  
}
@media screen and (min-width: 140px) {
  .framefit {
    height: 87px;
  }
  .detaildwg {
	padding: 3px;
  }  
}

@media screen and (min-width: 180px) {
  .framefit {
    height: 112px;
  }
  .detaildwg {
	padding: 3px;
  }  
}
@media screen and (min-width: 220px) {
  .framefit {
    height: 137px;
  }
  .detaildwg {
	padding: 3px;
  }  
}
@media screen and (min-width: 260px) {
  .framefit {
    height: 162px;
  }
  .detaildwg {
	padding: 3px;
  }  
}
@media screen and (min-width: 300px) {
  .framefit {
    height: 187px;
  }
  .detaildwg {
	padding: 3px;
  }  
}
@media screen and (min-width: 340px) {
  .framefit {
    height: 212px;
  }
  .detaildwg {
	padding: 3px;
  }  
}
@media screen and (min-width: 380px) {
  .framefit {
    height: 237px;
  }
  .detaildwg {
	padding: 3px;
  }  
}
@media screen and (min-width: 420px) {
  .framefit {
    height: 262px;
  }
  .detaildwg {
	padding: 3px;
  }  
}
@media screen and (min-width: 460px) {
  .framefit {
    height: 347px;
  }
  .detaildwg {
	padding: 3px;
  }  
}
@media screen and (min-width: 500px) {
  .framefit {
    height: 372px;
  }
  .detaildwg {
	padding: 3px;
  }  
}
@media screen and (min-width: 540px) {
  .framefit {
    height: 397px;
  }
  .detaildwg {
	padding: 3px;
  }  
}
@media screen and (min-width: 580px) {
  .framefit {
    height: 522px;
  }
  .detaildwg {
	padding: 3px;
  }  
}
@media screen and (min-width: 620px) {
  .framefit {
    height: 547px;
  }
  .detaildwg {
	padding: 3px;
  }  
}
@media screen and (min-width: 660px) {
  .framefit {
    height: 472px;
  }
  .detaildwg {
	padding: 3px;
  }  
}
@media screen and (min-width: 700px) {
  .framefit {
    height: 497px;
  }
  .detaildwg {
	padding: 4px;
  }  
}
@media screen and (min-width: 740px) {
  .framefit {
    height: 522px;
  }
  .detaildwg {
	padding: 4px;
  }  
}
@media screen and (min-width: 780px) {
  .framefit {
    height: 547px;
  }
  .detaildwg {
	padding: 4px;
  }  
}
@media screen and (min-width: 820px) {
  .framefit {
    height: 572px;
  }
  .detaildwg {
	padding: 4px;
  }  
}
@media screen and (min-width: 860px) {
  .framefit {
    height: 537px;
  }
  .detaildwg {
	padding: 4px;
  }  
}
@media screen and (min-width: 900px) {
  .framefit {
    height: 622px;
  }
  .detaildwg {
	padding: 4px;
  }  
}
@media screen and (min-width: 940px) {
  .framefit {
    height: 647px;
  }
  .detaildwg {
	padding: 4px;
  }  
}
@media screen and (min-width: 980px) {
  .framefit {
    height: 672px;
  }
  .detaildwg {
	padding: 4px;
  }  
}
@media screen and (min-width: 1020px) {
  .framefit {
    height: 697px;
  }
  .detaildwg {
	padding: 4px;
  }  
}
@media screen and (min-width: 1060px) {
  .framefit {
    height: 722px;
  }
  .detaildwg {
	padding: 4px;
  }  
}
@media screen and (min-width: 1110px) {
  .framefit {
    height: 747px;
  }
  .detaildwg {
	padding: 4px;
  }  
}
@media screen and (min-width: 1140px) {
  .framefit {
    height: 772px;
 }
  .detaildwg {
	padding: 4px;
  }  
}
@media screen and (min-width: 1180px) {
  .framefit {
    height: 797px;
  }
  .detaildwg {
	padding: 4px;
  }  
}
@media screen and (min-width: 1220px) {
  .framefit {
    height: 822px;
 }
  .detaildwg {
	padding: 5px;
  }  
}
@media screen and (min-width: 1260px) {
  .framefit {
    height: 847px;
  }
  .detaildwg {
	padding: 5px;
  }  
}
@media screen and (min-width: 1300px) {
  .framefit {
    height: 872px;
  }
  .detaildwg {
	padding: 5px;
  }  
}
@media screen and (min-width: 1340px) {
  .framefit {
    height: 897px;
  }
  .detaildwg {
	padding: 5px;
  }  
}
@media screen and (min-width: 1380px) {
  .framefit {
    height: 922px;
  }
  .detaildwg {
	padding: 5px;
  }  
}
@media screen and (min-width: 1420px) {
  .framefit {
    height: 947px;
  }
  .detaildwg {
	padding: 5px;
  }
  .detaildwg {
	padding: 5px;
  }  
}
@media screen and (min-width: 1460px) {
  .framefit {
    height: 972px;
  }
  .detaildwg {
	padding: 5px;
  }  
}
@media screen and (min-width: 1500px) {
  .framefit {
    height: 997px;
  }
  .detaildwg {
	padding: 5px;
  }  
}
@media screen and (min-width: 1540px) {
  .framefit {
    height: 1022px;
  }
  .detaildwg {
	padding: 5px;
  }  
}
@media screen and (min-width: 1580px) {
  .framefit {
    height: 1047px;
  }
  .detaildwg {
	padding: 5px;
  }  
}
@media screen and (min-width: 1620px) {
  .framefit {
    height: 1072px;
  }
  .detaildwg {
	padding: 5px;
  }

@media screen and (min-width: 1660px) {
  .framefit {
    height: 1097px;
  }
  .detaildwg {
	padding: 5px;
  }  
}
@media screen and (min-width: 1700px) {
  .framefit {
    height: 1122px;
  }
  .detaildwg {
	padding: 7px;
  }  
}
@media screen and (min-width: 1740px) {
  .framefit {
    height: 1147px;
  }
  .detaildwg {
	padding: 7px;
  }  
}
@media screen and (min-width: 1780px) {
  .framefit {
    height: 1172px;
  }
  .detaildwg {
	padding: 7px;
  }  
}
@media screen and (min-width: 1820px) {
  .framefit {
    height: 1197px;
  }
  .detaildwg {
	padding: 7px;
  }  
}
@media screen and (min-width: 1860px) {
  .framefit {
    height: 1222px;
  }
  .detaildwg {
	padding: 7px;
  }  
}
@media screen and (min-width: 1900px) {
  .framefit {
    height: 1247px;
  }
  .detaildwg {
	padding: 7px;
  }  
}

@media screen and (min-width: 1940px) {
  .framefit {
    height: 1262px;
  }
  .detaildwg {
	padding: 7px;
  }  
}
@media screen and (min-width: 1980px) {
  .framefit {
    height: 1297px;
  }
  .detaildwg {
	padding: 7px;
  }  
}
@media screen and (min-width: 2020px) {
  .framefit {
    height: 1322px;
  }
  .detaildwg {
	padding: 7px;
  }  
}
@media screen and (min-width: 2060px) {
  .framefit {
    height: 1347px;
  }
  .detaildwg {
	padding: 7px;
  }  
}
@media screen and (min-width: 2100px) {
  .framefit {
    height: 1372px;
  }
  .detaildwg {
	padding: 7px;
  }  
}
@media screen and (min-width: 2180px) {
  .framefit {
    height: 1422px;
  }
  .detaildwg {
	padding: 9px;
  }  
}
@media screen and (min-width: 2260px) {
  .framefit {
    height: 1472px;
  }
  .detaildwg {
	padding: 9px;
  }  
}
@media screen and (min-width: 2340px) {
  .framefit {
    height: 1522px;
  }
  .detaildwg {
	padding: 9px;
  }  
}
@media screen and (min-width: 2420px) {
  .framefit {
    height: 1572px;
  }
  .detaildwg {
	padding: 9px;
  }  
}
@media screen and (min-width: 2500px) {
  .framefit {
    height: 1622px;
  }
  .detaildwg {
	padding: 9px;
  }  
}
@media screen and (min-width: 2600px) {
  .framefit {
    height: 1685px;
  }
  .detaildwg {
	padding: 9px;
  }  
}
@media screen and (min-width: 2720px) {
  .framefit {
    height: 1760x;
  }
  .detaildwg {
	padding: 9px;
  }  
}
@media screen and (min-width: 2860px) {
  .framefit {
    height: 1847px;
  }
  .detaildwg {
	padding: 9px;
  }  
}
@media screen and (min-width: 3020px) {
  .framefit {
    height: 1947px;
  }
  .detaildwg {
	padding: 9px;
  }  
}
@media screen and (min-width: 3200px) {
  .framefit {
    height: 2060px;
  }
  .detaildwg {
	padding: 9px;
  }  
}
@media screen and (min-width: 3400px) {
  .framefit {
    height: 2185px;
  }
  .detaildwg {
	padding: 9px;
  }  
}
@media screen and (min-width: 3620px) {
  .framefit {
    height: 2302px;
  }
  .detaildwg {
	padding: 9px;
  }  
}
