including files*/
@import url("https://fonts.googleapis.com/css?family=Raleway:100,300,400");
/*colors*/
/*general*/
body {
  min-width: 320px;
  font-family: "Raleway", sans-serif;
  font-weight: 300;
  background-color: #000b60;
}

a {
  color: #000;
}

a:hover {
  text-decoration: none;
}

ul {
  padding: 0;
  margin: 0;
}

.container-fluid {
  padding-top: 100px;
  padding-bottom: 100px;
}

/*top-menu*/
#top-menu {
  min-width: 320px;
  background-color: #fff;
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.5);
          box-shadow: 0 5px 10px rgba(0, 0, 0, 0.5);
  padding: 15px 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 999;
}

#top-menu ul li {
  float: left;
  list-style-type: none;
  padding: 8px 0;

}

#top-menu .logo {
  float: left;
  max-width: 150px;
}
#top-menu .logo img{
  max-width: 100%;
}

#top-menu .menu {
  margin-left: 75px;
  margin-top: 7px;
}

#top-menu .menu li:not(:last-child) {

}

#top-menu .menu li a {
  padding: 9px 20px;
  font-weight: 100;
  font-family: Helvetica, Arial, sans-serif;
  font-size: 18px;
  color: #333;
}
#top-menu .menu li a:hover{
  color: #FC7A21;
}
#top-menu .menu li a.active {
  -webkit-transition: 0.5s;
  transition: 0.5s;
  color: #FC7A21;
}

#top-menu .links {
  float: right;
}

#top-menu .links li:not(:last-child) {
  margin-right: 16px;
}

#top-menu .links li a {
  padding: 8px 20px;
  font-size: 18px;
}

#top-menu .links .link-1 a {
  border: 2px solid #FC7A21;
  background-color: #FC7A21;
  color: #fff;
  font-weight: 300;
}

#top-menu .links .link-1 a:hover {
  background-color: #FFA351;
  border-color: #FFA351;
}

#top-menu .links .link-2 a {
  border: 2px solid #53AAF9;
  color: #53AAF9;
  background-color: #fff;
  font-weight: 300;
}

#top-menu .links .link-2 a:hover {
  border-color: #87C7FB;
}

#top-menu #sandwich {
  display: none;
}

/*block-1*/
#angebot {
  background-image: url(../images/background.jpg);
  background-size: cover;
  background-position: 100% 0%;
  color: #fff;
  padding-top: 210px;
  padding-bottom: 185px;
}

#angebot h1 {
  font-size: 48px;
  margin-bottom: 37px;
}

#angebot p {
  font-size: 26px;
  margin-bottom: 25px;
}

#angebot .for-input {
  float: left;
  width: 61%;
  background-color: #fff;
}

#angebot .for-input span {
  float: left;
  width: 0%;
  color: #858893;
  padding: 12px 0 12px 12px;
}

#angebot input {
  width: 100%;
  margin-right: 4%;
  float: left;
  font-size: 16px;
  background-color: transparent;
  border: none;
  padding-left: 15px;
  color: #000;
  height: 45px;
  margin-left: -30px;
  padding-left: 55px;
  outline: none;
}

#angebot a {
  width: 35%;
  text-align: center;
  background-color: #FC7A21;
  color: #fff;
  display: block;
  float: left;
  font-size: 16px;
  height: 45px;
  padding: 12px;
  margin-left: 10px;
  text-decoration: none;
}

#angebot a:hover {
  background-color: #FFA351;
}

/*vorteile*/
#vorteile {
  background-color: #fff;
  color: #000;
}

#vorteile h2 {
  margin-top: 0;
  text-transform: uppercase;
  font-size: 60px;
}

#vorteile h3 {
  color: #8e8c8c;
  font-size: 30px;
}

#vorteile p {
  font-size: 18px;
}

/*tarife*/
#tarife {
  background-color: #616575;
  color: #ffffff;
}

#tarife h2 {
  margin-top: 0;
  text-transform: uppercase;
  font-size: 60px;
}

#tarife h3 {
  color: #b7b7b7;
  font-size: 30px;
}

#tarife p {
  font-size: 18px;
}

/*faq*/
#faq {
  background-color: #fff;
  color: #000;
}

#faq h2 {
  margin-top: 0;
  text-transform: uppercase;
  font-size: 60px;
}

#faq h3 {
  color: #8e8c8c;
  font-size: 30px;
}

#faq p {
  font-size: 18px;
}

/*kontakt*/
#kontakt {
  background-color: #616575;
  color: #ffffff;
}

#kontakt h2 {
  margin-top: 0;
  text-transform: uppercase;
  font-size: 60px;
}

#kontakt h3 {
  color: #b7b7b7;
  font-size: 30px;
}

#kontakt p {
  font-size: 18px;
}


/*blockdiv*/
#blockdiv {
  background-color: #fff;
  color: #000;
}
#blockdiv h2 {
  margin-top: 0;
  text-transform: uppercase;
  font-size: 60px;
}
#blockdiv h3 {
  color: #8e8c8c;
  font-size: 30px;
}
#blockdiv p {
  font-size: 18px;
}

/*footer(top)*/
#footer {
  background-color: #1E233A;
  color: #fff;
}

#footer a {
  font-size: 14px;
  color: #fff;
}

#footer a:hover {
  text-decoration: underline;
}

#footer li {
  list-style-type: none;
  margin-bottom: 10px;
}

#footer li i {
  margin-right: 10px;
}

#footer .too-big {
  white-space: nowrap;
  margin-left: -20px;
}

#footer .security-images p:last-child {
  margin-top: 15px;
}

#footer .security-images p span {
  width: 100px;
  height: 45px;
  display: inline-block;
  overflow: hidden;
  margin-left: 48px;
}

#footer .security-images p span:last-child:hover img {
  margin-left: -100px;
}

#footer .security-images .never-sell {
  width: 100%;
  height: 30px;
  background: url(../images/img_never_sell.svg) no-repeat right;
  margin-right: -25px;
  display: block;
}

/*footer(bottom)*/
footer {
  padding: 10px 10px;
  background-color: #616575;
  color: #fff;
}


/*re 14.07.2017 + 15.07.2017*/
.block-1__list{
  list-style-type: none;
  font-size: 26px;
  margin-bottom: 20px;
}
.block-1__list li{
  padding-left: 40px;
  position: relative;
  margin-bottom: 10px;
}
.block-1__list li::before{
  font-family: FontAwesome;
   content: "\f00c";
   position: absolute;
   top: 0;
   left: 0;
   opacity: 0.9;
}
.vorteile-items{
  margin-top: 50px;
}
.vorteile-item{
  text-align: center;
  margin-top: 20px;
}
.vorteile-item-icon{
  display: inline-block;
  width: 100px;
}
.vorteile-item-icon img{
  max-width: 100%;
}
.vorteile-item-title{
  font-weight: bold;
  margin: 20px 0 10px 0;
}


.table{
  width: 100%;
  margin-top: 40px;
  min-width: 767px;
  overflow: auto;
}
.table-container{
  width: 100%;
  overflow: auto;
}
.table tr{
  border-bottom: 1px solid #fefefe;
}
.table td{
  padding: 10px 5px;
}
.table .table-title{
  font-size: 24px;
  font-weight: 700;
  color: #FC7A21;
}
.table .accent{
  color: #FC7A21;
  font-weight: bold;
}
.table .desc{
  font-size: 18px;
}
.table .bgc-tr{
  background-color: rgba(0,0,0,.1);
}
.table-button{
  width: 100%;
  display: inline-block;
  text-align: center;
  background-color: #fc7a21;
  line-height: 2.5;
  color: #fff;
  font-size: 18px;
}
.table-button .fa{
  margin-right: 10px;
}
.table-button:visited{
  color: #fff;
  text-decoration: none;
}
.table-button:hover{
  background-color: #FFA351;
  color: #fff;
}
.table-header td{
  text-align: center;
  padding-bottom: 0;
}
.table-header td span{
  display: inline-block;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,.3);
  line-height: 2.5;
  font-size: 18px;
  font-weight: bold;
  border-top-right-radius: 10px;
  border-top-left-radius: 10px;
}
/*color table header*/
.table-header td:nth-child(2){
  color: #39E639;
}
.table-header td:nth-child(3){
  color: #FFDE40;
}
.table-header td:nth-child(4){
  color: #FF9640;
}
.table-header td:nth-child(5){
  color: #FF4540;
}
/*color table header end*/
#form{}
#form > .group{
  margin: 20px 0;
  color: #000;
}
#form > .group:last-child{
  text-align: center;
}
#form input{
  width: 100%;
  height: 45px;
  border-radius: 2px;
  border: none;
  box-shadow: inset 0 0 8px 0 #888;
  outline-color: #fc7a21;
  padding: 0 15px;
  color: #000;
}
#form input:focus{
  background-color: #c0dcc0;
}
#form select{
  height: 45px;
  width: 100%;
  border-radius: 2px;
  border: none;
  box-shadow: inset 0 0 10px 0 #888;
  outline-color: #fc7a21;
  padding: 0 15px;
}
#form select:focus{
  background-color: #c0dcc0;
}
#form textarea{
  border-radius: 2px;
  border: none;
  box-shadow: inset 0 0 10px 0 #888;
  outline-color: #fc7a21;
  padding: 15px;
  width: 100%;
  resize: none;
}
#form label{
  display: block;
  color: #fff;
  font-size: 18px;
}
#form button{
  display: inline-block;
  max-width: 300px;
  width: 100%;
  height: 50px;
  font-size: 18px;
  color: #fff;
  background-color: #fc7a21;
  border: 0;
}
#form button:hover{
  background-color: #FFA351;
  outline: none;
}
.tabdiv {
	width:100%;
}
.tabdiv .col1{
	width:40%;
	text-align: right;
	padding-top: 5px;
}
.tabdiv .col2{
	width:50%;
	padding-left: 10px;
	padding-top: 5px;
}

#kabinet{background-color:#f2f2f2}
#blockdiv .login-h,.login-h{display:inline-block;position:relative;color:#333;font-size:45px;margin-bottom:40px;text-align:left;}
.login-h{margin-top:0}
.login-h:after{display:block;content:"";position:absolute;left:0;top:100%;width:30%;height:4px;background-color:#FC7A21}
.col-lg-6.col-xs-12.margin-auto{margin:0 auto;float:none;}
.autorize-container{display:flex;flex-direction:column;align-items:flex-start;padding:40px 40px 40px 240px;margin-top:80px;background:url(../img/lock.png) left 40px center no-repeat #efefef;border-radius:8px;box-shadow:0 0 40px rgba(0,0,0,.05)}
.input-box{width:100%;margin-bottom:20px;display:flex;flex-direction:row;justify-content:flex-start;}
.input-box:nth-last-child(1){margin-bottom:0;}
.input-icon{display:flex;justify-content:center;align-items:center;background-color:#cdcdcd;height:40px;width:60px;border-radius:4px 0 0 4px;}
.input-icon .fa{font-size:18px;text-shadow:2px 2px 2px rgba(0,0,0,.2)}
.login-input{padding:8px;border:solid 1px #cdcdcd;border-left:none;outline:none;height:40px;width:calc(100% - 60px);box-sizing:border-box;border-radius:0 4px 4px 0}
.login-input:focus{background-color:rgb(192 220 192 / 50%);box-shadow: inset 0 0 8px 0 #00000024;}
.login-button{background-color:#FC7A21;border:none;border-radius:4px;cursor:pointer;color:#fff;height:40px;padding:0 20px;box-shadow:none;transition:box-shadow .5s linear}
.login-button:hover{box-shadow:0 0 15px rgba(0,0,0,.35)}
.table-box{padding:30px;border-radius:8px;border:solid 1px #f3f4f9;margin-top:80px;background:#fff;box-shadow:0 0 8px rgba(0,0,0,.25)}
.user-nav{display:flex;flex-direction:row;justify-content:flex-start;list-style:none;margin-bottom:30px;}
.user-nav li{padding:0 5px;}
.user-nav a{display:block;padding:10px 14px;font-size:14px;line-height:14px;background-color:#EFEFEF;border-radius:8px;transition:.5s linear}
.user-nav a:hover,.user-nav a.active{background-color:#E7F1FE;color:#1871ED}
.user-nav a.active{font-weight:700}
#post-table{width:auto;min-width:100%;counter-reset:number;}
#post-table thead{font-weight:700}
#post-table thead tr{background-color:#e7f1fe;color:#1871ED;font-size:16px}
#post-table tbody tr:nth-child(even){background-color:#f3f4f9}
#post-table tbody tr{transition:background-color .5s linear;counter-increment: number;}
/*#post-table tbody tr:before{content:counter(number);display:table-cell;width:70px;padding:10px;box-sizing:border-box;vertical-align:middle;text-align:left;font-weight:700}*/
#post-table tbody tr:hover{background-color:#fbfbfb}
#post-table tbody tr:nth-child(even) td:nth-last-child(1),#post-table tbody tr:nth-child(odd) td:nth-last-child(1){border-color:transparent;}
#post-table tr td{width:20%;padding:10px;box-sizing:border-box;border-right:solid 1px #fff}
#post-table tbody tr:nth-child(odd) td{border-color:#f3f4f9;}
#post-table tr td:nth-child(1){width:calc(40% - 70px)}
.pager{width:100%}
.pager-content{display:flex;flex-direction:row;justify-content:flex-end;align-items:center;}
.pager-counter{color:#cdcdcd;}
.pager-nav{padding-left:20px;}
.before,.next{font-size:24px;color:#cdcdcd;display:inline-block;padding:10px;}
.before:hover,.next:hover{color:#333}
.flex{display:flex;flex-direction:row;justify-content:flex-start;flex-wrap:wrap;}
.width-50,.width-100{padding:0 15px;}
.width-25{width:25%;margin-right:15px}
.width-50{width:50%}
.width-75{width:calc(75% - 15px)}
.width-100{width:100%}
.form-item-box{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;margin-bottom:15px;}
.form-item-box.automat{padding-left:25%;}
.form-item-box.automat label{text-align:left;margin-left:15px;display:inline-block;max-width:213px}
.form-item-box.end{justify-content:flex-end;}
.radiogroup{margin-right:10px;margin-bottom:15px}
.form-item-box label{display:block;vertical-align:middle;width:25%;margin-right:15px;text-align:right;font-size:14px}
.form-item-box input,.form-item-box textarea,.form-item-box select{width:calc(75% - 15px);display:block;box-sizing:border-box;outline:none;padding:8px;border:solid 1px #cdcdcd;border-radius:4px}
.form-item-box textarea{height:120px}
.form-item-box input,.form-item-box select{height:40px;background-color:#fff}
.form-item-box input#plz,.form-item-box input#ort{width:97px}
.form-item-box input:focus{border-color:#1871ED;background-color:#E7F1FE}
.form-item-box input[type="checkbox"],.radiogroup input[type="radio"]{display:block;position:fixed;top:-9999px;left:-9999px;}
.form-item-box input[type="checkbox"] + label{width:100%;margin-right:0;cursor:pointer;padding-right:40px;background-image:url(../img/uncheck.png);background-position:right center;background-repeat:no-repeat;}
.form-item-box input[type="checkbox"]:checked + label{background-image:url(../img/check.png);}
.radiogroup input[type="radio"]:checked + label,.form-item-box input[type="checkbox"]:checked + label{color:#1871ED;}
.radiogroup label{cursor:pointer;font-size:14px;display:inline-block;padding:8px 12px 8px 27px;background-color:#f2f2f2;border-radius:8px;background-image:url(../img/radiouncheck.png);background-position:8px center;background-repeat:no-repeat;}
.radiogroup input[type="radio"]:checked + label{background-image:url(../img/radiocheck.png);background-color:#E7F1FE}
span.label{display:block;margin-bottom:15px;font-size:14px;color:#333;text-align:right;}
.flex.end{justify-content:flex-end;}
.img-center{display:block;margin:0 auto;}


#okk {
transition: 2s;
}











.input__check label::before {
  margin-right: 10px;
  display: block;
}
input[type="checkbox"]:checked,
input[type="checkbox"]:not(:checked),
input[type="radio"]:checked,
input[type="radio"]:not(:checked) {
  position: absolute;
  left: -9999px;
}
input[type="checkbox"]:checked + label,
input[type="checkbox"]:not(:checked) + label,
input[type="radio"]:checked + label,
input[type="radio"]:not(:checked) + label {
  display: inline-block;
  position: relative;
  padding-left: 35px;
  line-height: 20px;
  cursor: pointer;
}
input[type="checkbox"]:checked + label:before,
input[type="checkbox"]:not(:checked) + label:before,
input[type="radio"]:checked + label:before,
input[type="radio"]:not(:checked) + label:before {
  content: "";
  position: absolute;
  left: 0px;
  top: -1px;
  width: 20px;
  height: 20px;
  background-color: #fff;
}
input[type="checkbox"]:checked + label:before,
input[type="radio"]:checked + label:before,
input[type="radio"]:not(:checked) + label:before {
  content: "";
  position: absolute;
  left: 0px;
  top: -1px;
  width: 20px;
  height: 20px;
  background-color: #FC7A21;
}
input[type="checkbox"]:checked + label:before,
input[type="checkbox"]:not(:checked) + label:before {
  border-radius: 3px;
}
input[type="radio"]:checked + label:before,
input[type="radio"]:not(:checked) + label:before {
  border-radius: 100%;
}
input[type="checkbox"]:checked + label:after,
input[type="checkbox"]:not(:checked) + label:after,
input[type="radio"]:checked + label:after,
input[type="radio"]:not(:checked) + label:after {
  content: "";
  position: absolute;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
}
input[type="checkbox"]:checked + label:after,
input[type="checkbox"]:not(:checked) + label:after {
  left: 5px;
  top: 5px;
  width: 10px;
  height: 6px;
  border-radius: 2px;
  border-left: 3px solid #ffffff;
  border-bottom: 3px solid #ffffff;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
input[type="radio"]:checked + label:after,
input[type="radio"]:not(:checked) + label:after {
  left: 5px;
  top: 5px;
  width: 10px;
  height: 10px;
  border-radius: 100%;
  background-color: #FC7A21;
}
input[type="checkbox"]:not(:checked) + label:after,
input[type="radio"]:not(:checked) + label:after {
  opacity: 0;
}
input[type="checkbox"]:checked + label:after,
input[type="radio"]:checked + label:after {
  opacity: 1;
}

.input__check {
  border: 1px solid #ccc;
  border-radius: 5px;
  padding: 10px;
  margin: 25px 0px;
  background: #f2f2f2;
}

@media screen and (max-width: 600px) {

  input[type="checkbox"]:checked + label,
input[type="checkbox"]:not(:checked) + label,
input[type="radio"]:checked + label,
input[type="radio"]:not(:checked) + label {
  display: inline-block;
  position: relative;
  padding-left: 35px;
  line-height: 20px;
  cursor: pointer;
  font-size: 10px;
}

}
