@charset "utf-8";

/* CSS Document */


/*Image hover Overlay*/


.container {
  position: relative;
  width: 100%;
}
.container:hover .overlay {
  opacity: .5;
}
.image {
  display: block;
  width: auto;
  height: auto;
}
.support-img{
display: table-cell;
vertical-align: middle;
padding-right: 45px;
padding-bottom: 25px;
width: 100%;
height: auto;
}

.overlay {
  position: absolute;
  top: 2px;
  bottom: 0;
  left: 2px;
  right: 0;
  height: 96%;
  width: 100%;
  opacity: 0;
  transition: .5s ease;
  border-radius: 10px;
 /*background-color: #008CBA;*/
  background-color: #959391;
}


.support-text {
  color: white;
  text-shadow: #000 1px 0 10px;
  font-size: 36px;
  position: absolute;
  top: 50%;
  left: 50%;
  font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, "sans-serif";
  /*font-style:italic;*/
  font-weight: 500;	
  line-height: 36px;
 /* text-shadow: 1px 1px #ffffff;*/
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}
.hover-text {
 /*color: white !important;*/
 /*text-shadow: #000 1px 0 10px;*/
  font-size: 36px;
  position: absolute;
  top: 51%;
  left: 49%;
  font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, "sans-serif";
 /* font-style:italic;*/
  font-weight: 500;	
  line-height: 36px;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
  opacity: 0;
  }

a.hover-text:link { 
color: white!important;
text-decoration: none!important;
}
a.hover-text:visited { 
color: white!important;
text-decoration: none!important;
}
a.hover-text:hover { 
color: white!important; 
text-decoration: none!important;
} 


/*landing page */
   .tech-table-s

    {

        display: table;

		table-layout: fixed;

		/*height:425px;*/

		position: relative; 

		overflow-y: scroll;

		padding-left: 65px;



	}

#myDIV 

{

	-moz-transform: rotate(-60deg);

	-webkit-transform: rotate(-60deg);

	-o-transform: rotate(-60deg);

	-ms-transform: rotate(-60deg);

	transform: rotate(-60deg);

	position:absolute;

	margin-left: 5px;

    padding:35px 20px 10px 55px;

	/*without rollover image text

	margin-left: 55px;

    padding:35px 20px 10px 75px;*/

	white-space: nowrap;

    width: 5px;

    height: 4px;

    color: black;

	z-index:1;

		

}

#myDIV2

{

	-moz-transform: rotate(-60deg);

	-webkit-transform: rotate(-60deg);

	-o-transform: rotate(-60deg);

	-ms-transform: rotate(-60deg);

	transform: rotate(-70deg);

	position:absolute;

	margin-left: 180px;

    padding: 1px 5px 10px 55px;

	white-space: nowrap;

    width: 10px;

    height: 1px;

    color: black;

	z-index:1;

} 

.myDIV 

{

	-moz-transform: rotate(-60deg);

	-webkit-transform: rotate(-60deg);

	-o-transform: rotate(-60deg);

	-ms-transform: rotate(-60deg);

	transform: rotate(-60deg);

	position:absolute;

	margin-left: 5px;

    padding:25px 20px 10px 55px;

	/*without rollover image text

	margin-left: 55px;

    padding:35px 20px 10px 75px;*/

	white-space: nowrap;

    width: 5px;

    height: 4px;

    color: black;

	z-index:1;

		

}

.myDIV2

{

	-moz-transform: rotate(-60deg);

	-webkit-transform: rotate(-60deg);

	-o-transform: rotate(-60deg);

	-ms-transform: rotate(-60deg);

	transform: rotate(-70deg);

	position:absolute;

	margin-left: 180px;

    padding: 1px 5px 10px 55px;

	white-space: nowrap;

    width: 10px;

    height: 1px;

    color: black;

	z-index:1;

} 

    .TableB

    {

       	display: table;

		overflow-y: scroll;

		-webkit-overflow-scrolling: touch;

		/*Remove table border around image column

		border: 1px solid #202020;*/

       	-webkit-box-shadow: 10px 10px 5px rgba(50, 50, 50, 0.75);

    	-moz-box-shadow:    10px 10px 5px rgba(50, 50, 50, 0.75);

    	box-shadow:         10px 10px 5px rgba(50, 50, 50, 0.75);

	}



    .Table 

    {

		overflow: visible;

	      

    }



    .Table1

    {

      	display: table;

		overflow-y: scroll;

		-webkit-overflow-scrolling: touch;

		-ms-overflow-scrolling: touch;

	    padding-top:75px;

		

	}



    .Table1

    {

		 overflow: visible;

	      

    }

    .Title

    {



		display: table-caption;

        text-align: center;

        font-weight: bold;

        font-size: larger;

    }

    .Heading

    {

        display: table-row;

        font-weight: bold;

        text-align: center;

    }

    .Row

    {

        display: table-row;

        border-collapse:collapse;

    }

    .Cell

    {

        display: table-cell;

        border: solid;

        border-width: thin;

        padding-left: 5px;

        padding-right: 5px;

		width: 40px;

		vertical-align:middle;

        font-size:10px;

        font-weight:bold;

        border-collapse:collapse;

      

    }

	    .CellP

    {

   	    display: table-cell;

		vertical-align:middle;

        padding-left: 10px;

        padding-right: 25px;

		width: 40px;

		/*Remove border lines around images

		border: solid;

      	border-width: thin;*/

       	border-collapse:collapse;

  }

	    .Cell1

    {

        display: table-cell;

        padding-left: 10px;

        padding-right: 5px;

		vertical-align:middle;

        font-size:11px;

		width: 40px;

  		

    }

	 .Cellc

    {

        display: table-cell;

        border: solid;

        border-width: thin;

        padding-left: 5px;

        padding-right: 5px;

		width: 40px;

		vertical-align:middle;

        font-size:10px;

        font-weight:bold;

		background-color: rgba(46,182,238,0.7);

		background-color: rgba(46,182,238);

        border-collapse:collapse;

  		

    }

	

	.Cell-Head

	{

	 	display: table-cell;

    	vertical-align:bottom;

	}

	

	   .tech-table

    {

        display: table;

		table-layout: fixed;

		/*height:425px;*/

		position: relative; 

		overflow-y: scroll;

		padding-left: 65px;

		-webkit-overflow-scrolling: touch;

		-ms-overflow-scrolling: touch;

	}

	@media screen and (min-width: 900px){

    .tech-table 

    {

		 overflow: visible;

	      

    }

	

	.data

	{

        display: table-cell;

        width:275px;

		padding-right:15px;

          		

    }

		.app-data

	{

        display: table-cell;

      /*  width:275px;

		/*padding-right:15px;

		padding-left: 35px;*/

          		

    }

		.data-img

    {

        display: table-cell;

        vertical-align: middle;

		padding-right: 45px;
		padding-bottom: 25px;    		

    }

		.note

	{

        display: table-cell;

       /*width:25px;*/

		padding: 5px 5px 5px 0;		

		text-align:center;

		overflow:auto;

          		

    }

		.note-img

    {

        display: table-cell;

	    /*vertical-align: middle;*/

		/*padding: 25px 5px 5px 0;*/	    		

    }



/*Tool Tip*/

		.tooltip {

		position:relative; /* make span relative to anchor */

		text-decoration:none; /* no underline */

		cursor:pointer; /* make cursor point */

}

		.tooltip span { /* main body of tooltip */

		position:absolute; /* AP it */

		bottom:66px; /* FADE IN/OUT BEGIN */

		left:50%; /* CENTER TOOLTIP */

		margin-left:-72px; /* CENTER TOOLTIP */

		width:130px; /* tootip width */

		opacity:0; /* HIDE TOOLTIP in modern browsers */

		visibility:hidden; /* HIDE TOOLTIP in IE */

		padding:10px 5px; /* padding */

		color:#fff; /* text color */

		font:bold 95%/1.5 Arial, Helvetica, sans-serif; /* font */

		text-align:center; /* center text */

		pointer-events:none; /* no unintended tooltip popup for modern browsers */

		border-radius:6px; /* round corners */

		text-shadow:1px 1px 2px rgba(0, 0, 0, 0.6); /* text shadow */

		background:rgb(46,182,238); /* IE6/7/8 */

		background:rgba(46,182,238,.8); /* modern browsers */

		border:2px solid rgb(255,255,255); /* IE6/7/8 */

		border:2px solid rgba(255,255,255,.8); /* modern browsers */

		box-shadow:0px 2px 4px rgba(0,0,0,0.5); /* shadow */

		-webkit-transition:all 0.3s ease-in-out; /* animate tooltip */

		-moz-transition:all 0.3s ease-in-out; /* animate tooltip */

		-o-transition:all 0.3s ease-in-out; /* animate tooltip */

		-ms-transition:all 0.3s ease-in-out; /* animate tooltip */

		transition:all 0.3s ease-in-out; /* animate tooltip */

}

		.tooltip span.dif { /* different width tooltip */

		width:190px; /* width */

		margin-left:-102px; /* center it */

		}

		.tooltip span:before, .tooltip span:after { /* bottom triangle - the white border */

		content:''; /* add html content */

		position:absolute; /* AP bottom triangle */

		bottom:-13px; /* position bottom triangle */

		left:50%; /* center bottom triangle */

		margin-left:-12px; /* center bottom triangle */

		border-left:12px solid transparent; /* build bottom triangle */

		border-right:12px solid transparent; /* build bottom triangle */

		border-top:12px solid rgb(255,255,255); /* build bottom triangle IE6/7/8 */

		border-top:12px solid rgba(255,255,255,.8); /* build bottom triangle modern browsers */

		}

		.tooltip span:after { /* top triangle - the blue background */

		display: block;

		bottom:-10px; /* position top triangle */

		margin-left:-10px; /* center top triangle */

		border-width:10px; /* build top triangle */

		border-top:10px solid rgb(46,182,238); /* build top triangle IE6/7/8 */

		border-top:10px solid rgba(46,182,238,.8); /* build top triangle modern browsers */

		}

		.tooltip:hover span { /* reveal tooltip */

		opacity:1; /* REVEAL TOOLTIP in modern browsers */

		bottom:44px; /* FADE IN/OUT END */

		visibility:visible; /* REVEAL TOOLTIP in IE */

		}

		.tooltip span:hover {

		visibility:hidden; /* hide tooltip when moving from link to span in IE */

		}

/*html tooltip*/

div.htmltooltip{

position: absolute; /*leave this and next 3 values alone*/

z-index: 1000;

left: -1000px;

top: -1000px;

background: #003F69;

border-right: 4px solid #eeeeee;

border-bottom: 4px solid #eeeeee;

/*border-width:thin;*/

border-radius:6px; /* round corners */

color: white;

padding: 3px 3px 5px 10px;

width: 250px; /*width of tooltip*/

font-family:Arial, Helvetica, sans-serif;

font-size:13px;

}

	}



@media screen and (min-device-width:320px) and (max-device-width:768px) {.tooltip span{display:none;}.tooltip:hover span{display:block;}  /* iPad & iPhone simulate :hover */



	/*html tool tip on rollover / click for touch devices */

}

abbr

{

    border-bottom: 1px dotted #666;

	cursor: help;

}



.tooltip

{

	position:absolute;

	background-color:#eeeefe;

	border: 1px solid #aaaaca;

	font-size: smaller;

	padding:4px;

	width: 160px;

	box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);

	-moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);

	-webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);	

}

/*Manuals table*/

.mTable 

{   	

  display: table;   	

  width: 100%; 

}

.mTableRow

{

	display: table-row;

}

.mTableHeading

{

	display: table-header-group;

	background-color: #ddd;

}

.mTableCell, .mTableHead

{

	display: table-cell;

	padding: 3px 10px;

	border: 1 px solid #999999;

}

.mTableHeading

{

	display: table-header-group;

	background-color: #ddd;

	font-weight:bold;

}

.mTableFoot

{

	display: table-footer-group;

	font-weight: bold;

	background-color: #ddd;

}

.mTableBody

{

	display: table-row-group;

}

/*Specs Table*/



.spTable 

{   	

  display: table;   	

  width: 100%; 

}

.spTableRow

{

	display: table-row;



}





.spTableCell, .spTableHead

{

	display: table-cell;

	padding: 3px 10px;

	width: 35%;





}

.spTableCellb

{

	display: table-cell;

	padding: 3px 10px;

	width: 35%;

	background-color: #F7F9FA;



}

.spTableHeading

{

	display: table-header-group;

	font-weight:bold;

}

.spTableFoot

{

	display: table-footer-group;

	font-weight: bold;

	background-color: #ddd;

}

.spTableBody

{

	display: table-row-group;

}

hr.half-width{

  width:50%;

  margin: 0 auto;

}
