
html {padding:0px; margin:0px;}

body {
  background-color: #30313a;
  padding:0px; margin:0px;
}

div {
  color:#898ca2;

  border: 0;
  margin: 0;
  padding: 0;
  vertical-align: baseline;
}


hr.main {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid rgba(137,140,162,0.1);
  margin: 0px;
  padding: 5px 0px;
  clear: both;
}

hr.second {
border: 0px;
border-top: 1px dashed rgba(137,140,162,0.5);
}

div.header {
}

div.left-subheader {
  float: left;
  align-items: center;
}

div.right-subheader {
  float: right;
  position:relative;
}

div.navigation-main {
  float: left;
  padding-right: 20px;
}

div.navigation-main ul {
  padding: 0.5em;
  margin: 0px 15px;
  list-style: none;

  font-family: "Open Sans", Helvetica, Verdana, sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 28px;
  letter-spacing: inherit;
}

div.navigation-header ul {
  padding: 0.5em;
  margin: 0px 15px;
  list-style: square;
  position: relative;
  display: inline;

  font-family: "Open Sans", Helvetica, Verdana, sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 28px;
  letter-spacing: inherit;
}

div.navigation-header ul li {
  display: inline;
}

div.navigation-header ul form {
  display: inline;
}


div.content {
  overflow:hidden;
}

div.footer {
  clear: both;
  padding-top: 10px;
}

/*
 *  language box thanks to https://codepen.io/axel1998/pen/RWOpXq
 */

div.navigation-header div {
   display: inline-block;
}

.languagepicker  {
	color: #fff;
	display: block;
	padding: 0;
	height: 28px;
	overflow: hidden;
	transition: all .3s ease;
	margin: 0 5px 10px 0;
	vertical-align: top;
}
#div_languagepicker {
margin: -22px 5px 10px 0;
width:70px;
padding: 1px;
position:absolute;
}
#div_languagepicker2 {
width: 85px;
}
#ul_languagepicker  {
	position: absolute;
    padding: 1px;
    margin: 0px;
    display:block;
    float:none;
}

.languagepicker:hover {
	/* =28*countOfLang -1 */
	height: 93px;
}

.languagepicker a{
	color: #eee;
	text-decoration: none;
}

.languagepicker ul li {
	display: block;
	padding: 4px 5px;
	height: 27px;
	border-top: 1px solid #555;
}

.languagepicker li:hover{
    background-color: #33343d
}

.languagepicker a:first-child li {
	border: none;
	background: #30313a !important;
}

.languagepicker li img {
	margin: -2px 2px;
	vertical-align: middle;
}


.loginpicker  {
	color: #fff;
	display: block;
	padding: 0;
	height: 28px;
	overflow: hidden;
	transition: all .3s ease;
	margin: 0 5px 10px 0;
	vertical-align: top;
}
#div_loginpicker {
margin: -22px 5px 10px -140px;
width:230px;
padding: 1px;
position:absolute;
}
#div_loginpicker2 {
width: 85px;
}
#ul_loginpicker  {
	position: absolute;
    padding: 1px;
    margin: 0px;
    display:block;
    float:none;
}

.div_loginpicker2:hover {
	/* =28*countOfLang -1 */
	/*height: 200px;*/
}

.loginpicker a{
	color: #eee;
	text-decoration: none;
}

#ul_loginpicker li  {
	display: block;
	text-align: right
    /*float:none;*/
}


.roundborders {
	border-radius: 5px;
}


/*
 * text
 */

h1, h2, h3, h4, p {
    margin: 0;
    padding-bottom: 10px;
}

p, .paragraph, ul, ol, li, blockquote, div {
    font-family: "Open Sans", Helvetica, Verdana, sans-serif;
    font-size: 15px;
    font-weight: 400;
    line-height: 28px;
    letter-spacing: inherit;
}
td {
    vertical-align: top;
}

a {
    color: #fff;
    text-decoration: none;
}

div.header {
    padding: 2px 2px;
}


div.footer {
    padding: 10px 2px 2px 5px;
}

div.company {
    text-transform: uppercase;
    font-family: "Ubuntu", Candara, Futura, sans-serif;
    font-size: 15px;
    font-weight: 700;
    line-height: 28px;
    letter-spacing: 4px;
    color: #fff;
    hyphens: none;

}

div.content {
    padding: 0px 1em;
}

div.content hr.main {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid rgba(137,140,162,0.1);
  margin: 0px  -1em;
  padding: 5px 0px;
  clear: both;
}

#result_field {
    color: black;
    background-color: #eee;
    padding: 2em 2em;
    margin: 0px -1em;
}

#one_question_field {
    color: black;
    background-color: #eee;
    padding: 2em 2em;
    margin: 0px -1em;
}

#one_question_field table {
border-spacing: 10px 0px;
max-width: 900px;
}

#one_question_field h3 {
max-width: 900px;
}

#one_question_field td {
color: black;
padding-bottom: 1em;
}

form table {
  border-collapse: collapse;
}
form table tr td {
  padding: 4px;
}


/*
 *  go
 */

input.radio {
transform:scale(1.5);
margin-top: 10px;
}

td.radio {
text-align:center;
}

.answer_button {
   display: block;
   height: 100%;
   border-color:#cccccc;
   border-width:1px;
   border-radius: 5px;
   border-style:solid;
   color: #898ca2;
   text-align:left;
   text-decoration: none;
   cursor: default;
}

.answer_button:hover {
   background-color: #c6c6c6;
}


.slider_rubber {width:400px}

@media screen and (min-width: 100px) and (max-width: 200px) {
  .markert_table {
    zoom: .5 !important; /* Old IE only */
    -moz-transform: scale(0.5);
    -webkit-transform: scale(0.5);
    transform: scale(0.5);
  }
  #one_question_field table {border-spacing: 1px 0px}
  .slider_rubber {width:80px}
}
@media screen and (min-width: 201px) and (max-width: 300px) {
  .markert_table {
    zoom: .6 !important; /* Old IE only */
    -moz-transform: scale(0.6);
    -webkit-transform: scale(0.6);
    transform: scale(0.6);
  }
  #one_question_field table {border-spacing: 3px 0px}
  .slider_rubber {width:120px}
}
@media screen and (min-width: 301px) and (max-width: 350px) {
  .markert_table {
    zoom: .7 !important; /* Old IE only */
    -moz-transform: scale(0.7);
    -webkit-transform: scale(0.7);
    transform: scale(0.7);
  }
  #one_question_field table {border-spacing: 4px 0px}
  .slider_rubber {width:200px}
}
@media screen and (min-width: 351px) and (max-width: 400px) {
  .markert_table {
    zoom: .7 !important; /* Old IE only */
    -moz-transform: scale(0.7);
    -webkit-transform: scale(0.7);
    transform: scale(0.7);
  }
  #one_question_field table {border-spacing: 4px 0px}
  .slider_rubber {width:250px}
}
@media screen and (min-width: 401px) and (max-width: 430px) {
  .markert_table {
    zoom: .8 !important; /* Old IE only */
    -moz-transform: scale(0.8);
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
  }
  #one_question_field table {border-spacing: 5px 0px}
  .slider_rubber {width:300px}
}
@media screen and (min-width: 431px) and (max-width: 500px) {
  .markert_table {
    zoom: .85 !important; /* Old IE only */
    -moz-transform: scale(0.85);
    -webkit-transform: scale(0.85);
    transform: scale(0.85);
  }
  #one_question_field table {border-spacing: 7px 0px}
  .slider_rubber {width:330px}
}
@media screen and (min-width: 501px) and (max-width: 600px) {
  .markert_table {
    zoom: 0.9 !important; /* Old IE only */
    -moz-transform: scale(0.9);
    -webkit-transform: scale(0.9);
    transform: scale(0.9);
  }
  .slider_rubber {width:400px}
}

@font-face {
    font-family: "outlined-iconset";
    src:url("fonts/outlined-iconset.eot");
    src:url("fonts/outlined-iconset.eot?#iefix") format("embedded-opentype"),
    url("fonts/outlined-iconset.woff") format("woff"),
    url("fonts/outlined-iconset.ttf") format("truetype"),
    url("fonts/outlined-iconset.svg#outlined-iconset") format("svg");
    font-weight: normal;
    font-style: normal;

}

.icon-style {
    font-family: "outlined-iconset" !important;
    content: attr(data-icon);
    font-style: normal !important;
    font-weight: normal !important;
    font-variant: normal !important;
    text-transform: none !important;
    speak: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
