.agendamento-online-campo {
    margin-bottom: 10px;
}

.step-control {
    margin-bottom: 10px !important;
}

.xdsoft_datetimepicker {
    display: none !important;
}

.shown {
    display: block !important;
}

.fix {
    padding-left: 2px !important
}

.arrow {
    padding: 3px !important
}

.form-group {
    margin-bottom: 0 !important;
}

body {
    padding-top: 15px!important;
    min-height: 0!important;
    background: white!important;
}

#calendar th, #calendar td{
    vertical-align: top;
}

#quero-saber-mais{
    margin-bottom: 10px;
}

.state-error{
    display: block!important;
    margin-top: 6px;
    margin-bottom: 6px;
    padding: 0 3px;
    font-family: Arial, Helvetica, sans-serif;
    font-style: normal;
    line-height: normal;
    font-size: 0.85em;
    color: #DE888A;
}

.title-color{
    color: #51C4D6;
}

/* Start by setting display:none to make this hidden.
   Then we position it in relation to the viewport window
   with position:fixed. Width, height, top and left speak
   for themselves. Background we set to 80% white with
   our animation centered, and no-repeating */
.modal {
    display:    none;
    position:   fixed;
    z-index:    1000;
    top:        0;
    left:       0;
    height:     100%;
    width:      100%;
    background: rgba( 255, 255, 255, .8 );
    padding-top:200px
}

/* When the body has the loading class, we turn
   the scrollbar off with overflow:hidden */
body.loading {
    overflow: hidden;
}

/* Anytime the body has the loading class, our
   modal element will be visible */
body.loading .modal {
    display: block;
}

#calendar th, #calendar td {
    /*vertical-align: middle;*/
}

.btn-xs, .btn-group-xs > .btn {
    padding: 5px;
    font-size: 18px;
    line-height: 1.5;
    border-radius: 2px;
}
.filter{float:right;margin-right: 25px;}


@media screen and (max-width: 400px){
    .filter{float:none;margin-right: 0px;}
}