/***Basis-Anweisungen
********************************************/


/** Schriften einbinden
/*********************************************************/

 /* @font-face { font-family: 'Jost'; font-display: auto; src: url('fonts/Roboto/Roboto-Regular.ttf') format('truetype'); }
 /* @font-face { font-family: 'Jost'; font-weight: 600; font-display: auto; src: url('fonts/Roboto/Roboto-Regular.ttf') format('truetype'); }


 /* a-Behavior */
 a{
  text-decoration: none; outline: none; color: #737F8C;
 }


  table td a:hover { color: #262861; }

 /* Listen */
/* Bullets von Listen weg */
 ul, ul li.leaf{  list-style-image: none; list-style-type: none;}

/*Listen im textfeld */
 .textfeld li, .text li, .fahrzeugdaten li{ line-height: 2; margin-bottom: 8px; }
 .textfeld ol, .text ol{ padding-left: 12px; margin: 20px 0px; }

 /* .text li bullets geben */
 .text li{ position: relative; padding-left: 16px; }
 .text li::before {
     content: "";
     position: absolute;
     top: 12px;
     left: 0px;
     width: 8px;
     height: 8px;
     background: #262861;
   }

 .textfeld ul em{ padding: 40px 0px; }

/* strong */
strong {
    font-weight: 600;
}

/* Tabelle */
table, caption, tbody, tfoot, thead, tr {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    width: 100%;
    vertical-align: baseline;
    background: transparent;
}

/* BODY    color: #597a96; */
body {
   position: relative;
   font-family: 'Jost';
   font-weight: normal;
   color: #737F8C;
   font-size: 100%;
   height: 100%;
   font-weight: 300;
   line-height: 1.2;
   -moz-osx-font-smoothing: grayscale;
   width: 100%;
   overflow-x:hidden;

}

#superfish-main { display: block; }
.mobilemenu { display: none; position: relative; width: 100%; }

/* Paragraph */
p, li{ line-height: 1.5em; font-size: 0.9em; margin-bottom: 20px; letter-spacing: 0.02em; font-family: 'Jost'; font-weight: normal; color: #737F8C; }


/* Footer Alter Stick */
  main{ position: relative; height: 100%; margin: 0; min-height: 400px;  }

/* Ueberschriften */
h1 { font-family: 'Jost'; font-weight: 600; font-size: 1.5em; font-weight: normal; margin-bottom: 30px; text-transform: uppercase; }
h1 span.big { font-size: 2em; }

/* H2  color: #737f8d; */
h2{ font-family: 'Jost'; font-weight: 600; letter-spacing: 0.005em; font-size: 1.8em;  font-weight: normal;
 margin: 40px 0px 8px 0px; text-transform: uppercase; }
 h2.subline { font-size: 1.4em; color: #000;  margin: 0px 0px 20px 0px;  font-family: 'Jost'; font-weight: 600; }
.popup h2 { margin-top: 0px; }

/* H3 */
h3, .views-field.views-field-name{  font-family: 'Jost'; font-weight: 600; font-weight: normal; font-size: 1.2em;
text-transform: uppercase; margin: 0px 0px 10px 0px; }
.h3-headline{width: 30%; height: 50px; }
h4, .auto-leasing-kasten h2 {  font-family: 'Jost'; font-weight: normal; font-size: 1em; color: #737f8d; margin: 12px 0px 0px 0px;  }
.auto-leasing-kasten h2 { font-family: 'Jost'; font-size: 1em; }
.auto-leasing-kasten h2 { margin: 10px 0px 10px 0px; }
small { font-size: 0.8em; }
.inner-teaserbox h4 { margin-top: 0px; }

.text { max-width: 1444px; }

.rows { position: relative; width: 100%; overflow: hidden; }

.firstcolumn { text-align: right; width: 49%; margin-right: 1%;}

.graubox .views-element-container {  text-align: left; }
.graubox { position: relative; background: #f4f4f4; padding: 20px; display: inline-block;  margin: 10px; }
.whitebox { padding: 20px; display: inline-block; margin: 10px; }
.graubox h3 a { display: block; }

#superfish-main ul { z-index: 100!important; background: #FFF!important; }
#superfish-main a.sf-depth-1 { padding: 16px 0px 0px 30px!important; font-weight: 600; }
#superfish-main ul a:hover { color: #000; cursor: pointer; }
ul.sf-menu .sf-sub-indicator  { height: 6px; width: 0px; display: inline-block; display: none; }

.views-field-view-node a { background: url('../images/eye.svg') no-repeat; background-size: 34px; }
.views-field-edit-node a, .views-field-edit-node-1 a, .views-field-edit-taxonomy-term a { background: url('../images/edit.svg') no-repeat; background-size: 36px 26px; width: 36px; }
.page-node-121 .views-field-nothing a { background: url('../images/pdf-2.svg') no-repeat; background-size: 34px 34px; }
.page-node-121 .views-field-nothing-2 a, .page-node-124 .views-field-nothing-2 a, .page-node-122 .views-field-nothing a { background: url('../images/pdf-1.svg') no-repeat; background-size: 34px 34px; }
.views-field-view-node a, .views-field-edit-node a, .views-field-edit-taxonomy-term a,
.page-node-121 .views-field-nothing-2 a, .page-node-121 .views-field-nothing a, .page-node-124 .views-field-nothing-2 a,
.views-field-edit-node-1 a, .page-node-122 .views-field-nothing a { display: block; text-indent: -999999999px; }
.views-field-edit-node a, .views-field-edit-node, .views-field-edit-node-1.views-field-edit-node-1 a, .views-field-edit-taxonomy-term a { height: 32px; }
.views-field-view-node a, .views-field-view-node { width: 34px; height: 30px; }
.page-node-121 .views-field-nothing-2, .page-node-121 .views-field-nothing-2 a, .page-node-124 .views-field-nothing-2 a,
 .page-node-124 .views-field-nothing-2, .page-node-122 .views-field-nothing, .page-node-122 .views-field-nothing a { width: 34px; height: 34px; }
.page-node-121 .views-field-nothing, .page-node-121 .views-field-nothing a { width: 34px; height: 34px; }
.page-node-121 td.views-field-nothing { padding: 22px 7px 22px 14px; }

td.views-field-view-node, td.views-field-edit-node, .page-node-121 td.views-field-nothing-2, td.views-field-edit-taxonomy-term { padding: 22px 14px!important; }

.views-field-field-nachname, .page-node-121 .views-field-view-node a, .views-field-title a, .views-field-title-9 a, .title-row a { font-size: 1em; color: #000; }

.page-node-124 .views-field-nothing-1 { display: none; }
    td.views-field-edit-node, td.views-field-edit-node-1, .page-node-124 .views-field-nothing-2 { padding: 22px 10px 22px 0px!important; }


.event-row div { float: left; }
.event-row { position: relative; width: 100%; overflow: hidden; padding: 16px 0px; border-bottom: 1px solid #f4f4f4;}
.event-row .title-row, .event-row .date-row { width: 210px; text-align: left; padding-right: 20px; }

/* Tabellen */
 table {
 	display: inline-block;
  width: auto;
        overflow-x: auto;
        white-space: nowrap;
    background: white;
    border-collapse: collapse;
    border-radius: 0px;
    padding: 5px;
margin: 50px auto;
    font-size: 90%;
 }

 .node--unpublished {
    background-color: transparent!important;
}

.views-element-container {
  position: relative;
  width: auto;
 }


 tr:last-child {
    border-bottom: medium none;
}
tr:first-child {
    border-top: medium none;
}
tr {
    border-bottom: 1px solid #f4f4f4;
    font-weight: normal;
    text-shadow: none;
}

th.text-left {
    text-align: left;
}
th:first-child {
    border-top-left-radius: 3px;
}
th {

    border-bottom: 1px solid #737F8C;
    border-right: none;
    color: #737F8C;
    font-size: 0.85em;
    font-weight: normal;
    padding: 14px 24px;
    line-height: 19px;
    text-align: left;
    text-transform: lowercase;
    text-shadow: none;
    vertical-align: middle;
    font-family: 'Jost';
}
th a { color: #737F8C; }
th a:after {
    content: '';
    position: relative;
    float: right;
    width: 0;
    height: 0;
    margin-top: 9px; margin-left: 4px;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 4px solid #737F8C;
  }
/*tr:nth-child(2n+1) td {
    background: #ebebeb none repeat scroll 0 0;
}*/
td.text-left {
    text-align: left;
}
td {
    background: #ffffff none repeat scroll 0 0;

    font-size: 0.85em;
    font-weight: normal;
    padding: 22px 28px;
    text-align: left;
    text-shadow: none;
    vertical-align: middle;
    font-family: 'Jost';
}

table td a { text-transform: none; color: #737F8C;  }

/* ANIMATIONEN */
/* Drehungen */
.rotate{ transition: all 0.3s; }
.rotate:hover img{ transform: rotate(2deg); }

/* fuer die Post-Animation */
.post.hidden{  opacity:0;  display: block; }
.post.visible{  opacity:1; }

/***************** Drupal *******************************/

#block-alex-theme-local-tasks.contextual-region{
  position: absolute; right: 0px;
  padding: 20px;
  background-color: rgba(0, 0, 0, 0.8);
  z-index: 100;
}
#block-alex-theme-local-tasks.contextual-region a{ color: #fff; }
#block-alex-theme-local-tasks.contextual-region ul.contextual-links a{ color: #354c54; }

/** User-Login
 /*******************************************************/

 .path-user main{ padding-top: 50px; padding-bottom: 10px; }
 .layout-container{ position: relative; }

 #block-alex-theme-login, .user-logged-in.path-user .js-form-item,#user-register-form, #user-pass, .path-user #block-alex-theme-local-tasks{
    border: medium none;
    margin: 0px auto 40px auto;
    max-width: 550px;
    padding: 30px;
    width: 55%;
 }

.user-logged-in.path-user #block-alex-theme-local-tasks{ margin: 0px; padding: 20px; width: auto;/* max-width: auto;*/ }

 #user-login-form input{
    border: 1px solid #737F8C;
    color: #737F8C;
    font-family: 'Jost';
    font-size: 1.2em;
    margin: 8px 0;
    padding: 2% 3%;
    width: 94%;
    text-align: center;
 }

#block-alex-theme-login h2 { display: none;}
 #user-login-form input.form-submit { background: #737F8C; margin-top: 20px; font-family: 'Jost'; font-weight: 600; color: #FFF; width: 100%; font-size: 1em; padding: 16px;  }
 #user-login-form input.form-submit:hover { background: #000; }
 #user-profile-form { padding: 10px 0px; }

 .page-user.logged-in  .user-picture { margin: 0px auto; float: none; width: 200px; }


 /* ----------------------------------------------------------------------------------------------------
Super Form Reset
A couple of things to watch out for:
- IE8: If a text input doesn't have padding on all sides or none the text won't be centered.
- The default border sizes on text inputs in all UAs seem to be slightly different. You're better off using custom borders.
- You NEED to set the font-size and family on all form elements
- Search inputs need to have their appearance reset and the box-sizing set to content-box to match other UAs
- You can style the upload button in webkit using ::-webkit-file-upload-button
- ::-webkit-file-upload-button selectors can't be used in the same selector as normal ones. FF and IE freak out.
- IE: You don't need to fake inline-block with labels and form controls in IE. They function as inline-block.
- By turning off ::-webkit-search-decoration, it removes the extra whitespace on the left on search inputs
----------------------------------------------------------------------------------------------------*/

input,
label,
select,
button,
textarea
{
        margin:0;
        border:0;
        padding:0;
        display:inline-block;
        vertical-align:middle;
        white-space:normal;
        background:none;
        line-height:1;

        /* Browsers have different default form fonts */
        font-size:1em;
        font-family:'Roboto';
        color: #737F8C;
}

/* Remove the stupid outer glow in Webkit */
input:focus
{
        outline:0;
}

/* Box Sizing Reset
-----------------------------------------------*/

/* All of our custom controls should be what we expect them to be */
input,
textarea
{
        -webkit-box-sizing:content-box;
        -moz-box-sizing:content-box;
        box-sizing:content-box;
}

/* These elements are usually rendered a certain way by the browser */
button,
input[type=reset],
input[type=button],
input[type=submit],
input[type=checkbox],
input[type=radio],
select
{
        -webkit-box-sizing:border-box;
        -moz-box-sizing:border-box;
        box-sizing:border-box;
}

/* Text Inputs
-----------------------------------------------*/

input[type=date],
input[type=datetime],
input[type=datetime-local],
input[type=email],
input[type=month],
input[type=number],
input[type=password],
input[type=range],
input[type=search],
input[type=tel],
input[type=text],
input[type=time],
input[type=url],
input[type=week]
{
}

/* Button Controls
-----------------------------------------------*/

input[type=checkbox],
input[type=radio]
{
        width:13px;
        height:13px;
  border-radius: 50%;
}

/* File Uploads
-----------------------------------------------*/

input[type=file]
{

}

/* Search Input
-----------------------------------------------*/

/* Make webkit render the search input like a normal text field */
input[type=search]
{
        -webkit-appearance:textfield;
        -webkit-box-sizing:content-box;
}

/* Turn off the recent search for webkit. It adds about 15px padding on the left */
::-webkit-search-decoration
{
        display:none;
}

/* Buttons
-----------------------------------------------*/

button,
input[type="reset"],
input[type="button"],
input[type="submit"]
{
        /* Fix IE7 display bug */
        overflow:visible;
        width:auto;
}

/* IE8 and FF freak out if this rule is within another selector */
::-webkit-file-upload-button
{
        padding:0;
        border:0;
        background:none;
}

/* Textarea
-----------------------------------------------*/

textarea
{
        /* Move the label to the top */
        vertical-align:top;

        /* Turn off scroll bars in IE unless needed */
        overflow:auto;
}

/* Selects
-----------------------------------------------*/

select
{

}

select[multiple]
{
        /* Move the label to the top */
        vertical-align:top;
}

.flexbox-container {
  display: flex;
}

/* Extra Select Button */
select, .js-form-type-textfield input, textarea, input, .intl-tel-input input {
    font-size: 1.1em;
   font-family: 'Jost';
    color: #000;
    border-radius: 4px;
     padding: 11px 14px;
     margin: 10px 12px 10px 0px;
      background: #fff;
}

select{
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: #f4f4f4 url('../images/arrow_down.svg') no-repeat 94% center;
  background-size: 45px 40px;
padding: 24px 60px 24px 60px;
border: none;
border-radius: 0px;
font-size: 1em;
line-height: 1.2em;
color: #000;
}

select:hover { background-color: #FFF; cursor: pointer; }

select:hover, input:hover { color: #262861; }

/* Filter Checkboxen */
input[type=checkbox].form-checkbox, .form-radio {
     position:absolute; z-index:-1000; left:-1000px;
     overflow: hidden;
     clip: rect(0 0 0 0);
     height:1px; width:1px;
     margin:-1px; padding:0; border:0;
}

.fieldset-legend { padding-left: 0px!important; }
input[type=checkbox].form-checkbox, label.option, .fieldset-legend {
      padding-left:25px;
      margin-right: 4px;

      display:inline-block;
      line-height: 16px;
      font-size: 16px;
      vertical-align:middle;
      cursor:pointer;
      color: #000;
      font-family: 'Jost';
           font-size: 1.1em;

       }

input[type=checkbox].form-checkbox:checked + label.option, input[type="radio"]:checked+label {
      background: url('../images/new/radiobutton_activ.svg') no-repeat;
      background-size: 18px 18px;
}
label.option {
      background:url('../images/new/radiobutton.svg') no-repeat;
      background-size: 16px 16px;
      -webkit-touch-callout: none;
      -webkit-user-select: none;
      -khtml-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
}

.js-form-type-radio:hover { cursor: pointer; }


.webform-readonly label { display: block!important; }

 @media only screen and (min-width: 0px) and (max-width: 800px) {
    #superfish-main, #block-hauptnavigation-2 { display: none; }
    .mobilemenu { display: block; width: 100%; background: #FFF; }
}

 @media only screen and (min-width: 0px) and (max-width: 768px) {
   h1 { font-size: 1.6em;  }
   h2 { font-size: 1.5em; margin: 40px 0px 0px 0px; }
   p { line-height: 1.2em; }

.flexbox-container { display: block; }
.firstcolumn, .column { width: 100%; margin: 0px; }
.firstcolumn { text-align: left; }
td, th { padding: 10px 14px; font-size: 0.8em; }

#block-alex-theme-login, .user-logged-in.path-user .js-form-item,#user-register-form, #user-pass, .path-user #block-alex-theme-local-tasks{
   border: medium none;
   margin: 0px;
   padding: 30px 0px;
   width: 350px;
   max-width: 350px;
}
    }

 @media only screen and (min-width: 0px) and (max-width: 480px) {


    h1 { font-size: 1.4em; }

      td.views-field-edit-node, td.views-field-edit-node-1 { padding: 22px 8px 22px 0px!important; }
      td.views-field-view-node, td.views-field-edit-node, .page-node-121 td.views-field-nothing-2, .page-node-121 .views-field-nothing, .page-node-122 .views-field-nothing { padding: 22px 8px !important; }
      .page-node-122 .views-field-nothing { padding-right: 0px!important; }
     .paragraph--type--formular-leasingautosuche #edit-suchkategorie--wrapper,
  .paragraph--type--formular-leasingautosuche .form-item-marken,
  .paragraph--type--formular-leasingautosuche .form-item-typ,
   .paragraph--type--formular-leasingautosuche .form-item-gewerblich,
   .paragraph--type--formular-leasingautosuche #edit-zustand--wrapper,
    .paragraph--type--formular-leasingautosuche #edit-actions { width: 100%!important; padding: 0px; margin: 2px 0px!important; float: none; clear: both; }
}