/* Use different (or no) background image depending on block placement
#destination option{
    display:none;
}
*/
#destination-options { display: none; }

#destination option.label{
    display:block;
}
@media (max-width: 400px) {
    .region-content #tripselector {
        background-image:none;
        margin-right: 5px;
        padding: 0 0 15px 0;
        border-bottom: 1px dotted #444444;
        margin-bottom: 15px;
    }
    .region-content #tripselector h2 {
        text-transform: none;
        color: #777788;
        font-size: 16px;
        font-weight: normal;
        padding-bottom: 15px;
    }
    .region-content #tripselector label {
        display: inline-block;
        width: 18%;
    }
    .region-content #tripselector select {
        width: 80%;
    }
    .region-content #tripselector select#depart,
    .region-content #tripselector #dest-elements {
        margin-bottom: 6px;
    }
    .region-content #tripselector #gobt {
        position: relative;
        margin-right: 0px;
        text-align: right;
    }
    .region-content #tripselector #gobt input {
        background-image:none;
        background-color: transparent;
        border: 1px solid #b5b5b5;
        border-radius: 5px;
        padding: 3px 12px 2px 12px;
        font-family: Arial, Helvetica, sans-serif;
        font-weight: 600;
        color: #686868;
    }
}
#block-tripselector-2 {
    padding: 0;
}
.sidebar #tripselector {
    margin-right: 5px;
    padding: 0 0 15px 0;
    border-bottom: 1px dotted #444444;
}
.sidebar #tripselector h2 {
    text-transform: none;
    color: #777788;
    font-size: 16px;
    font-weight: normal;
    padding-bottom: 15px;
}
.sidebar #tripselector label {
    display: inline-block;
    width: 18%;
}
.sidebar #tripselector select {
    width: 80%;
}
.sidebar #tripselector select#depart,
.sidebar #tripselector #dest-elements {
    margin-bottom: 6px;
}
.sidebar #tripselector #gobt {
    position: relative;
    margin-right: 0px;
    text-align: right;
}
.sidebar #tripselector #gobt input {
    background-color: transparent;
    border: 1px solid #b5b5b5;
    border-radius: 5px;
    padding: 3px 12px 2px 12px;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: 600;
    color: #686868;
}
@media (min-width: 401px) {
    .region-content #tripselector {
        display: block;
        background-image: url('/modules/custom/weta_trip_selector/images/tripbox.svg');
        background-repeat: no-repeat;
        background-size: contain;
        margin: 0;
        position: relative;
    }
    .region-content #tripselector h2 {
        display:none;
    }
    .region-content #tripselector form {
        padding: 35% 10% 15% 10%;
    }
    .region-content #tripselector label {
        display: inline-block;
        color: white;
        font-weight: bold;
        font-size: 16px;
        width: 40px;
    }
    .region-content #tripselector select#depart,
    .region-content #tripselector select#destination {
        position: relative;
        left: 8px;
        margin-bottom: 5px;
        width: 65%;
        padding-top: 2px;
        padding-bottom: 2px;
    }
    .region-content #tripselector #gobt {
        left: 290px;
    }
    .region-content #tripselector #dest-elements {
        margin: 5px 0;
        padding-top: 5px;
    }
    .region-content #tripselector .button {
        margin:0;
        padding:0;
        float: right;
    }
    .region-content #tripselector .button:after {
        clear:both;
    }
    .region-content #tripselector #gobt {
        width:70px;
        position: absolute;
        bottom: 75px;
        left: 79%;
        background-color:transparent;
    }
    .region-content #tripselector input.gobt {
        background: transparent url("/modules/custom/weta_trip_selector/images/gobt4.png");
        border:none;
        padding:0;
        width: 70px;
        height: 70px;
        display: block;
        text-indent: -9000px;
    }
    .region-content #tripselector input.gobt:disabled {
        background-position: 0 -70px;
    }
}
