/* 
    Document   : mittel
    Created on : 23.06.2015, 10:57:00
    Author     : mac
    Description:
        Purpose of the stylesheet follows.
*/

@media only screen and (min-width: 641px) and (max-width: 1024px){
    
    .buchung-warenkorb-01{
        float:left;
        width: 30%;        
    }
    
    .buchung-warenkorb-02{
        float:left;
        width: 45%; 
        margin-left: 3%;
    }
    
    .buchung-warenkorb-03{
        float:left;
        width: 15%;  
        margin-left: 3%;
        text-align: right;
    }
    
    .buchung-button-01{
        float:left;
        width: 40%;
        margin-left: 5%;
        margin-right: 5%;
    }
    
    .buchung-button-02{
        float:left;
        width: 40%;
        margin-left: 5%;
        margin-right: 5%;
    }
    
    .buchung-zimmer-spalte-01{
        float: left;
        width: 30%;
    }
    
    .buchung-zimmer-spalte-02{
        float: left;
        width: 30%;
        margin-left: 3%;
    }
    
    .buchung-zimmer-spalte-03{
        float: left;
        width: 30%;
        margin-left: 3%;
    }
    
    .buchung-zimmer-spalte-04{
        float: left;
        width: 100%         
    }
    
    .buchung-zimmer-spalte-05{
        float: left;
        width: 100%         
    }
    
    .buchung-gastdaten-inner{
        float: left;
        width: 80%;
        margin-left: 10%;
        margin-right: 10%;
    }
    
    .buchung-gastdaten-zeile-01{
        float: left;
        width: 30%;
    }
    
    .buchung-gastdaten-zeile-02{
        float: left;
        margin-left: 5%;
        width: 65%;
    }
    
    .abstand10{
        margin-top: 10px;
    }
    
    .buchung-gastdaten-weiter{
        float: left;
        width: 30%;
        margin-left: 70%;
    }
    
    .buchung-zimmer-spalte-03-01{
        float:left;
        width: 100%;
    }
    
    .buchung-zimmer-multi-gespreis-zeile-button{
        float: left;
        width: 40%;
        margin-left: 30%;
        margin-right: 30%;
    }
    
    .buchung-zimmer-multi-gespreis-zeile-preis{
        margin-left: 66%;
        width: 30%;
        float: left;
    }
    
    .buchung-datenpruefung-zeile-01{
        float: left;
        width: 30%;
    }
    
    .buchung-datenpruefung-zeile-02{
        float: left;
        width: 70%;
    }
    
    .buchung-datenpruefen-buchenbutton{
        float: left;
        margin-left: 60%;
        width: 40%;
    }
    
    .mywintop-buchung-grid{
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        grid-gap: 10px;            
        padding: 10px 10px 10px 10px;        
        
    }
    
    .mywintop-buchung-grid-bild{
        grid-column-start: 1;
        grid-column-end: 2;       
                
    }
    
    .mywintop-buchung-grid-betrieb{
        grid-column-start: 2;
        grid-column-end: 4;
    }
    
    .mywintop-buchung-grid-zeile{         
        grid-column-start: 1;
        grid-column-end: 4;  
    }
    
    .mywintop-buchung-grid-zimmertext{
        grid-column-start: 1;
        grid-column-end: 3;
    }
    
    .mywintop-buchung-grid-gesamtpreis{         
        grid-column-start: 3;
        grid-column-end: 4;          
    }  
    
    .mywintop-buchung-grid-textfeld-gastdaten{
        grid-column-start: 2;
        grid-column-end: 4;    
    }
    
    .mywintop-buchung-schritte-grid{         
        display: grid;
        grid-template-columns: 1fr 1fr 1fr 1fr;
        grid-gap: 10px;            
        padding: 10px 10px 10px 10px;         
    }
    
    .mywintop-buchung-schritte-grid{
        text-align: center;
        line-height: 30px;
    }    
    
    .mywintop-buchung-hauptbild{
        width: 100%;
        background-position: left center;
        background-repeat: no-repeat;
        background-size: contain;
    }
    
    .mywintop-buchung-hauptbild:after{
       padding-top: 56.25%;
        display: block;
        content: ''
    }
    
    .mywintop-buchung-reisedaten{
        margin-top: 20px;
    }
    
    .mywintop-zimmer-grid{
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        grid-gap: 10px;            
        padding: 10px 10px 10px 10px;       
    }
    
    .mywintop-buchung-grid-zimmer-1{
        grid-column-start: 1;
        grid-column-end: 2;
    }
    
    .mywintop-buchung-grid-zimmer-2{
        grid-column-start: 2;
        grid-column-end: 3;
    }
    
    .mywintop-buchung-grid-zimmer-3{
        grid-column-start: 3;
        grid-column-end: 4;
    }
    
    .mywintop-buchung-grid-zimmer-4{
        grid-column-start: 1;
        grid-column-end: 3;
    }
    
    
    
}