@import url("httypo.css");
* {
  font-family: "Noto Sans", Verdana, Arial, Helvetica, sans-serif
}
html {
	border-width: 0; outline: 0;
	padding: 0; margin: 0px; 
	font-size: 100%; font-family: inherit;	 
	vertical-align: baseline
}
body { 
	margin: 0;
	background-color: #dbdbdb
}
div {
	border-width: 0;
	padding: 0;
	font-size: 100%; 
	margin: 0px; 
	vertical-align: baseline; 
	outline: 0
}
#page {
	display: flex; flex-direction: column; min-height: 100vh;
	padding: 0;
	/*background-color: white;*/
	background-image: url("img/css/bkgr.gif"); background-repeat: repeat-y;
	margin-right: auto; margin-left: auto; 
	width: 970px
}
#top {
	padding: 4px 10px; margin: 0px 7px; height: 80px;
	background-color: white
}
div#top p {
	display: inline; float: left; margin-left: 32px; margin-top: 21px; width: 233px
}
div#top p a {
	display: block; width: 233px; height: 41px; background: url("img/css/htoolsv7.png") no-repeat; background-size: contain;
}
div#top p a span {
	display: none
}
#topmenu {
	float: right; margin-right: 25px; margin-top: 3px; width: 270px; height: 12px; display: inline; 
	font-style: normal; font-size: 12px; color: rgb(90,90,90); text-align: right;
	background-color: #fff
}
#topmenu a {
	color: rgb(90,90,90); text-decoration: none;
	-webkit-transition: color 0.3s;
	transition: color 0.3s;
}
#topmenu a:hover {
	text-decoration: underline; color: #F58120
}
#langselect-txt {
	width: 300px; height: 12px;
	clear: right; float: right; display: inline; margin-right: 26px; margin-top: 20px;  
	font-style: normal; font-weight: bold; font-size: 14px; color: #F58120; text-align: right;
	background-color: #fff
}
#langselect-txt a {
	color: #3177a7;
	-webkit-transition: color 0.3s;
	transition: color 0.3s
}
#langselect-txt a:hover {
	color: #F58120
}
#langselect-txt img {
	padding-bottom: 3px;
}
#banner {
	padding-right: 10px; background-image: url("img/css/htheadbkg.png"); margin: 0px 7px; background-repeat: repeat-x; height: 127px; background-color: #336E93
}
#hthead {
	 float: left; display: inline; background-image: url("img/css/hthead.png"); background-repeat: no-repeat;
	 margin-left: 50px; 
	 width: 469px;  height: 127px 
}
#pexlogo {
	 float: left; background-image: url("img/css/pex_icon.png"); background-repeat: no-repeat;
	 width: 444px;  height: 127px	 
}
#rtlogo {
	 float: left; background-image: url("img/css/rt_icon.png"); background-repeat: no-repeat;
	 width: 476px;  height: 127px	 
}
#rtclogo {
	 float: left; background-image: url("img/css/rtc_icon.png"); background-repeat: no-repeat;
	 width: 476px; height: 127px 
}
#flexlogo {
	 float: left; background-image: url("img/css/flex_icon.png"); background-repeat: no-repeat;
	 width: 444px;  height: 127px	 
}
#banner_px {
	float: left; margin-left: 80px; width: 322px; height: 127px; background-repeat: no-repeat
}
.px3 {background-image: url("img/css/surmrx.png")}
.px4 {background-image: url("img/css/ord.png")}
#banner_btn {
	float: left; display: inline; margin-top: 30px; margin-left: 30px; width: 460px; height: 71px
}
#banner_btn_rt {
	float: left; display: inline; margin-top: 30px; margin-left: 10px; width: 460px; height: 71px
}
.download {
	float: left; display: block; margin-left: 5px; background-image: url("img/css/btn-download2.png"); width: 219px; height: 71px; background-repeat: no-repeat
}
.download_rt {
	float: left; display: block; margin-left: 5px; background-image: url("img/css/btn-download-rt2.png"); width: 219px; height: 71px; background-repeat: no-repeat
}
.download_rtc {
	float: left; display: block; margin-left: 5px; background-image: url("img/css/btn-download-rtc2.png"); width: 219px; height: 71px; background-repeat: no-repeat
}
.download_flex {
	float: left; display: block; margin-left: 5px; background-image: url("img/css/btn-download-flex2.png"); width: 219px; height: 71px; background-repeat: no-repeat
}
.buynow {
	float: left; display: block; margin-left: 12px; background-image: url("img/css/btn-buy_en.png"); width: 219px; height: 71px; background-repeat: no-repeat
}
.buynow_de {
	float: left; display: block; margin-left: 12px; background-image: url("img/css/btn-buy_de.png"); width: 219px; height: 71px; background-repeat: no-repeat
}
#menu {
  background: url("img/css/menubkg.gif") no-repeat left top; margin-left: 7px; margin-bottom: 0px; height: 30px;
  list-style: none; padding: 0
}
#menu ul {
  list-style: none;
  margin-top: 0px; /* this bs  */
  padding: 0;
  border: 1px solid #BDBDBD;
  border-radius: 4px;
  background: white; /*#EFEEEE;*/
  float: left;
  width: 100%
  -moz-box-shadow:
  	0px 0.8px 0.9px hsl(0deg 0% 0% / 0.05),
    0px 2.4px 2.8px hsl(0deg 0% 0% / 0.05),
 -0.1px 5.5px 6.5px hsl(0deg 0% 0% / 0.05),
 -0.2px 12.8px 15.1px hsl(0deg 0% 0% / 0.05);  
  box-shadow:
    0px 0.8px 0.9px hsl(0deg 0% 0% / 0.05),
    0px 2.4px 2.8px hsl(0deg 0% 0% / 0.05),
 -0.1px 5.5px 6.5px hsl(0deg 0% 0% / 0.05),
 -0.2px 12.8px 15.1px hsl(0deg 0% 0% / 0.05);
}
#menu li {
  float: left;
  position: relative
}
#menu li ul {
  display: none; 
  position: absolute;
  text-align: left; line-height: 1.2em;
  padding: 3px 0px 9px 0px;
  width: 168px
}
#menu li li a {
  width: 128px;
  background: none
}
#menu li li a:hover {
  color: #F58024
}
#menu li:hover ul, #menu li.jshover ul {
  display: block
}
#menubkg {
	padding-left: 112px; text-align: center
}
#menubkg div {
	background: url("img/css/menusepr.gif") no-repeat right top; float: left; height: 30px
}
#menubkg div#selected {
	background: url("img/css/menubkg_sel.gif") no-repeat right top
}
#menubkg div a, #menubkg div p {
	padding: 4px 20px 1px 20px; display: block; margin-top: 0; 
	font-style: normal; font-weight: bold; font-size: 0.8em; color: rgb(90,90,90);  text-decoration: none
}
#menubkg div a:hover {
	/* background: url("img/css/menuhover.gif") no-repeat right top */ color: #F58024
}
#menubkg div#selected a:hover {
	cursor: hand
}
#main {
	flex: 1;
	float: left; 
	background-position: left 1%; 
	background-image: url("img/css/sidebarbg.gif"); background-repeat: repeat-y; 
	width: 963px
}
#sidemenucolumn {
	float: left; width: 180px;
	padding-left: 20px; margin-top: 15px	
}
.sidemenu ul {	
	float: left; list-style: none; 
	width: 165px; 
	margin: 0px; padding: 0px; border-bottom: solid 1px rgb(200,200,200)	
}	
.sidemenu li {
	margin: 0px; padding: 0px
}
.sidemenu li.title {
	vertical-align: top; 
	margin: 0px; padding: 12px 7px 10px 5px; 
	text-transform: uppercase; color: rgb(175,175,175); 
	font-style: normal; font-weight: bold; font-size: 13pt; text-decoration: none
}
.sidemenu li.group a, li.group p {
	display: block; min-height: 1.5em; 
	margin: 0px; padding: 3px 7px 2px 10px; 
	border-top: solid 1px rgb(200,200,200); border-left: solid 5px rgb(235,235,235); 
	text-decoration: none; text-transform: uppercase; 
	font-style: normal; font-weight: bold; font-size: 1.2em;
	-webkit-transition: background-color 0.3s;
	transition: background-color 0.3s
}
* html .sidemenu li.group a {
	height: 1.5em
}
.sidemenu li a, li p {
	display: block; min-height: 1.5em; 
	margin: 0px; padding: 3px 7px 2px 10px; 
	border-left: solid 5px rgb(235,235,235); 
	color: rgb(110,110,110); text-decoration: none; font-size: 11pt
}
* html .sidemenu li a {
	height: 1.5em
}
.sidemenu li.group a:hover {
	border-left: solid 5px rgb(175,175,175); background-color: rgb(225,225,225); text-decoration: none
}
.sidemenu li.group .selected {
	border-left: solid 5px rgb(175,175,175); color: #034C79; background-color: #EFEEEE; text-decoration: none
}
.sidemenu a:hover {
	border-left: solid 5px #F58120; color: #413E3E; background-color: #EFEEEE; text-decoration: none
}
.sidemenu .selected {
	border-left: solid 5px #F58120; 
	font-style: normal; font-weight: bold; text-decoration: none
}
.sidemenu li.space {
	display: block; min-height: 2.0em; 
	margin: 0px; padding: 13px 7px 2px 10px; 
	border-top: solid 1px rgb(200,200,200);
	font-style: normal; font-weight: bold; font-size: 11pt; color: #F58024; text-decoration: none 
}
.sidemenu-align {
	text-align: left;
}
.sidemenu-font {	
	font-style: normal; font-weight: normal; color: #333000; font-size: 10pt; text-decoration: none
}
.sidebarbox-font { 
	font-style: normal; font-weight: normal; color: rgb(90,90,90); font-size: 9pt;
	text-decoration: none; text-align: justify
}
.sidebarbox-font a { 
	color: rgb(90,90,90)
}
#sidebarbox {
	clear: both; width: 160px; padding: 30px 4px 4px 4px
}
#content {
	width: 690px;
	float: left;
	padding: 10px 10px 10px 25px; 
	margin: 10px;
	background-color: #fff
}
#content_fm {
	width: 910px;
	float: left; 
	padding: 10px 10px 10px 20px; 
	margin: 10px
}
#content h1, #content_hp h1 {
	margin: 0px 0px 8px 0px; padding: 0px; 
	font-size: 18pt; font-style: normal; font-weight: 600; color: #000; text-align: left; text-decoration: none
}
#content h1 img {
	margin: 0px 3px 0px 0px
}
#content h2 {
	font-size: 14pt; padding-bottom: 0.5em; margin: 0; color: #3177a7; padding-top: 1em
}
#content p {
	font-size: 95%; text-align: justify; color: #585858
}
#content p a {
	font-weight: bold; color: #3177a7; text-decoration: none;
	-webkit-transition: color 0.3s;
	transition: color 0.3s
}
#content p a:hover {
	color: #fe7d00
}
#content p a:active, #content p a:focus {
	color: #D86719
}
#content p img {
	margin-bottom: 2px
}
#content .rite {
	text-align: right !important; white-space:nowrap
}
#content .large {
	font-size: 110%
}
#content .low {
	line-height: 1.2em
}
#content .left {
	text-align: left !important; white-space:nowrap
}
#content .center {
	text-align: center !important; 
}
#content .small {
	padding: 15px 0px 5px 1px; margin: 0px; 
	font-size: 80%; color: #585858; line-height: 1.3em
}
#content .small a {
	color: #3177a7
}
#content .small a:hover {
	color: #fe7d00
}
#content .petite {
	font-size: 70%; text-align: center
}
#content .faqtopic {
	font-weight: bold; color: #990000; text-decoration: none
}
#content .showprice {
	font-weight: bold; color: #fe7d00; font-size: 170%; text-decoration: none
}
/*#content ul {
	padding: 5px 25px 10px 43px;
	font-size: 95%; color: #585858;
}
#content li {
	text-align: justify;
} 
#content li a {
	font-weight: bold; color: #3177a7; text-decoration: none
}
#content li a:hover {
	font-weight: bold; color: #fe7d00; text-decoration: none
}*/
.u-list ul {
	padding: 5px 25px 10px 43px;
	font-size: 95%; color: #585858
}
.u-list li {
	text-align: justify
} 
.u-list li a {
	font-weight: bold; color: #3177a7; text-decoration: none;
	-webkit-transition: color 0.3s;
	transition: color 0.3s
}
.u-list li a:hover {
	font-weight: bold; color: #fe7d00; text-decoration: none
}
#content ol {
	margin-top: 0px; font-size: 80%; margin-bottom: 0px; padding-bottom: 0.5ex; color: #585858; padding-top: 0.5ex
}
#content td {
	font-size: 95%; padding-bottom: 0.5ex; padding-top: 0.3ex; margin: 0px; color: #585858; text-align: justify
}
#content td a {
	font-weight: bold; color: #3177a7; text-decoration: none
}
#content td a:hover {
	font-weight: bold; color: #fe7d00; text-decoration: none
}
.content-link {
	margin-left: 25px; margin-top: 15px; padding: 0.5em 0em 0.2em 0em; line-height: 25px
}
.content-link img {
	margin-bottom: 2px; margin-right: 2px
}
.content-space {
	margin-left: 20px
}
.content-space img {
	padding-top: 2px; margin-right: 2px
}
.content-title2 {
	margin: 0em 0em 0.5em 0em; padding: 0.2em 0em 0.2em 0em; border-bottom: solid 2px #3177a7
}
.pagetitle {
	margin: 6px 0px 10px 0px; padding: 0px; vertical-align: top
}
.nextbox {
	float: right; margin-left: 0em; padding-right: 0em;
	width: 11.0em; 
	font-size: 11pt; font-style: normal; color: #585858; text-decoration: none; text-align: right
}
.nextbox a {
	color: #3177a7; text-decoration: none;
	-webkit-transition: color 0.3s;
	transition: color 0.3s
}
.nextbox a:hover {
	color: #fe7d00; text-decoration: none
}
.pricelist, .info
{
	border-collapse: collapse; width:100%
}
.pricelist tr td, .pricelist tr th
{
	padding: 5px 10px; border-bottom: 1px solid #d8d8d8;
	text-align: left
}
.pricelist tr th
{
	background: #fff
}
.pricelist tr th.type, .info tr th
{
	background: none; 
	font-size: 1.2em; color: #3177a7; /* type */
}
.info tr td, .info tr th
{
	margin: 3px;
	padding: 5px 10px; 
	border-bottom: 1px solid #d8d8d8;
	text-align: center !important;
}
.doc
{
	border: 1px solid #d8d8d8;
	border-collapse: collapse
}
.doc tr th
{
	padding: 5px 10px; 
	font-weight: bold;
	text-align: center;
	text-transform: uppercase;
	color: #585858
}
.doc tr td
{
	padding: 5px 10px; border: 1px solid #d8d8d8
}
.doc p
{
text-align: left !important;	
}
#attn {
	margin: 20px auto;   
	width: 614px;
	padding: 3px 30px 12px 0px;
	background: #E7F6FA;
	border: 0px solid #d8d8d8;   
	border-radius: 10px;
	vertical-align: middle
}
#attn img {   
	padding: 0px 20px
}
#spotlight {
	margin: 5px auto;   
	width: 610px;
	min-height: 30px;
	padding: 35px;
	background: #E7F6FA;
	border-radius: 18px	
}
#spotlight img {   
	padding-right: 20px
}
#quote {
	margin: 5px auto;   
	width: 570px;
	min-height: 50px;
	padding: 25px 40px;   
	border-radius: 18px	
}
.color1 {background: #F4F4F5}
.color2 {background: #ebf3fe}
.color3 {background: #f6ebfe}
.color4 {background: #fef6eb}
#footer {
	clear: both; background-color: #1E5F87; 
	background-image: url("img/css/footerbg.gif"); background-position: 50% bottom; background-repeat: repeat-x; 
	margin: 0px 7px; padding: 4px 0px 0px 0px; 
	text-align: center
}
#footer p {
	padding: 4px; margin: 0px;
	font-size: 12px; color: #fff	
}
#footer a {
	color: #fff; text-decoration: none
}
#footer a:hover {
	color: #fff; text-decoration: underline
}
#base {	
	background-position: left bottom; background-image: url("img/css/basement.gif"); background-repeat: no-repeat;	 
	width: 970px; height: 16px
}
input[type=submit] {
  appearance:none;
  -webkit-appearance:none;
  padding: 10px;
  border: 0;
  background-color:#3177a7; 
  -webkit-transition: background-color 0.3s;
  transition: background-color 0.3s;
  color:#fff;
  font-size: 0.95em;
  font-weight:600;
  border-radius:5px;
  width:90%
}
input[type=submit].buyinchoice {
  width:55%;
  background-color:#F98637;
}
input[type=submit]:hover {
  background-color:#256895;
  cursor: pointer;
}
input[type=submit]:active, input[type=submit]:focus {
  background-color:#15517A
}
#order td a, #order td a:hover {
	font-weight: bold; color: #fff; text-decoration: none
}
#order_all {
	padding-top: 15px; padding-left: 15px
}
#order_all td a, #order_all td a:hover {
	font-weight: bold; color: #fff; text-decoration: none
}
#order_all tr td {
	font-size: 16px; line-height: 2em
}
.pricelist_all
{
	width:100%
}
.pricelist_all tr td
{
	padding: 10px 10px; border: 0
}

code {
    background-color: #eee;
    border-radius: 3px;
	font-style: normal;
    font-family: "Courier New", courier, monospace;
    padding: 2px 4px 1px 3px;
	margin: 2px 4px 1px 3px
}
#look p {
	text-align: center
}
#look p img {
	margin: 0px 5px 3px 0px;
	padding: 25px;
	background: #fff;
	border: 0 solid #d8d8d8;   
	border-radius: 18px;
 	-moz-box-shadow:
  	0.2px -0.3px 0.5px hsl(0deg 0% 63% / 0.36),
    -0.2px -0.1px 1.7px -0.8px hsl(0deg 0% 63% / 0.36),
    2.5px 2.8px 4.2px -1.7px hsl(0deg 0% 63% / 0.36),
    2.4px 5.5px 7.4px -2.5px hsl(0deg 0% 63% / 0.36); 
  	box-shadow:
	0.2px -0.3px 0.5px hsl(0deg 0% 63% / 0.36),
    -0.2px -0.1px 1.7px -0.8px hsl(0deg 0% 63% / 0.36),
    2.5px 2.8px 4.2px -1.7px hsl(0deg 0% 63% / 0.36),
    2.4px 5.5px 7.4px -2.5px hsl(0deg 0% 63% / 0.36)		
}
#content-action p {
	text-align: left;
	margin-left: 15px
}
#content-action p a {
	margin: 15px 15px 0 0;
	padding: 5px 25px;
	background-color:#3177a7;   
  	color:#fff;
	border-radius: 5px;
	-webkit-transition: background-color 0.3s;
  	transition: background-color 0.3s
}
#content-action p a:hover {
  	background-color:#256895;
  	color:#fff
}
#content-action p a:active, #content-action p a:focus {
  	background-color:#15517A;
	color:#fff
}
#showcase, #showcase2 {
	margin: 5px auto;   
	width: 610px;
	min-height: 30px;
	padding: 35px;
	background: #F3F6FC;
	border-radius: 18px	
}
#showcase img, #showcase2 img {   
	padding-right: 20px
}
#showcase p img {
	margin: 4px 32px 7px 0px;
	padding: 10px;
	background: #fff;
	border: 0 solid #d8d8d8;   
	border-radius: 18px;
 	-moz-box-shadow:
  	0.2px -0.3px 0.5px hsl(0deg 0% 63% / 0.36),
    -0.2px -0.1px 1.7px -0.8px hsl(0deg 0% 63% / 0.36),
    2.5px 2.8px 4.2px -1.7px hsl(0deg 0% 63% / 0.36),
    2.4px 5.5px 7.4px -2.5px hsl(0deg 0% 63% / 0.36); 
  	box-shadow:
	0.2px -0.3px 0.5px hsl(0deg 0% 63% / 0.36),
    -0.2px -0.1px 1.7px -0.8px hsl(0deg 0% 63% / 0.36),
    2.5px 2.8px 4.2px -1.7px hsl(0deg 0% 63% / 0.36),
    2.4px 5.5px 7.4px -2.5px hsl(0deg 0% 63% / 0.36)
}
#rtc-ad {
	display: flex; flex-direction: row;
	width: 70%; min-height: 100px;
	padding: 0;
	margin-top: 30px;
	margin-right: auto; margin-left: auto;
	text-align: center; 
	justify-content: center;
	font-size: 95%; color: #3177A7;
	font-weight: bold;
	user-select: none
}
.pictobox {
	margin-right: auto; margin-left: auto
}