.alert-yellow{
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    background-color: #FDF6E5;
    margin-bottom: 24px;
    padding: 16px;
    border-left: 1px solid #EEEEEE;
    border-right: 1px solid #EEEEEE;
    border-bottom: 1px solid #EEEEEE;
}

.txt-alert-yellow {
    color: #FAAA14;
}

.padding-top-alert-txt{
    padding-top: 2px;
}

.phone .padding-top-alert-txt{
    padding-top: 0px;
}

.padding-desc-bottle{
    padding: 33px 0px 0px 0px;
}

.phone .padding-desc-bottle{
    padding: 20px 0px 0px 0px;
}

.separator-vertical {
    height: 120px;
}

.card-box-troca{
    background-color: #FFFFFF;    
    margin-top: 8px;
    padding: 24px 0px;
}

.phone .card-box-troca{
    background-color: #FFFFFF;
    border-left: 1px solid #EEEEEE;
    border-right: 1px solid #EEEEEE;
    border-top: 1px solid #EEEEEE;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    box-sizing: border-box;
    margin-top: 8px;
    padding: 24px 9px;
}


.boxBottleName{
    width: 30%;
    margin-right: 1%;
}

.boxTroca{
    width: 68%;
    background-color: #F4F4F4;
    border: 1px solid #EEEEEE;
    border-radius: 8px;
    box-sizing: border-box;
    margin-top: 15px;
    padding: 32px;
}
.phone .boxBottleName{
    width: 100%;
    margin-right: 0px;
}
.phone .boxTroca{
    width: 100%;
    background-color: #F4F4F4;
    border: 1px solid #EEEEEE;
    border-radius: 8px;
    box-sizing: border-box;
    margin-top: 15px;
    padding: 32px;
}

.label-garrafa-troca{
    width: 190px;
    margin-right: 15px;
}

.phone .label-garrafa-troca{
    width: 100%; 
    margin-right: 0px;
}
.radiotroca{
    margin-top: 0px;
}

.phone .radiotroca{
    margin-top: 8px;
}

.desktop .modal-wrapper.card-modal-recom .modal-content {
    padding: 15px 90px;
}

.desktop .modal-wrapper.card-modal-recom {
    max-width: 1200px;
}

@media (max-width: 400px) {
    .modal-acc .modal {
        left: -28px;
        width: 418px;
    }
}

.backcard-util{
    background-color: #FAFAFA;
}

.modal-close-recom a {
    background: url(/GalpThemeOutsystemsUIResources_Lib/img/modalClose.svg);
    background-size: contain;
    background-repeat: no-repeat;
}

.modal-close-recom .fa-fw{
    display: table-column-group;
}
.card-modal-recom .modal-top{
    display: none;
}

.phone .content-middle {
    margin-bottom: 24px;
}

/*TABLET*/

.tablet .step-1-background {
    background: url(/GasOnline_FE/HomepageImage.aspx);
    background-repeat: no-repeat;
    background-position-x: right;
    background-position-y: 150px;
}

/* Phones with tablet behavior */

@media (max-width: 500px) {
    .tablet .step-1-background {
        background: url(/GasOnline_FE/HomepageImage.aspx);
        background-repeat: no-repeat;
        background-position-x: center;
        background-position-y: 150px;
    }  
}

/**/

.tablet .padding-desc-bottle {
    padding: 17px 0px 0px 0px;
}
.tablet.portrait .boxBottleName{
    width: 44%;
    margin-right: 1%;
}
.tablet.portrait .boxTroca{
    width: 55%;
}
.tablet.portrait .label-garrafa-troca {
    width: 100%;
}
.tablet.portrait .radiotroca {
    margin-top: 8px;
}

.tablet.landscape .boxBottleName{
    width: 49%;
}
.tablet.landscape .boxTroca{
    width: 50%;
}

.step-1-background {
    background: url(/GasOnline_FE/HomepageImage.aspx);
    background-repeat: no-repeat;
    background-position-x: center;
}

.other-steps-background {
    background: linear-gradient(180deg, #FFFFFF 0%, #FFFFFF 100%);
}

.step-1-header-class-title {
  /*height: 92px;*/
  color: #FA551E;
  font-family: Canaro;
  font-size: 36px;
  font-weight: bold;
  letter-spacing: 0;
  line-height: 46px;
  word-break: keep-all;
}

.step-1-header-class-subtitle {
    /*height: 18px;*/
    color: #616771;
    font-family: Canaro;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 25px;
    margin-top: 24px;
}

.layout .main {
    background: none;
}

.card-order{
    background: none;
}

.phone .step-1-header-class-title  {
    /*height: 80px;*/
    width: 280px;
    color: #FA551E;
    font-family: Canaro;
    font-size: 24px;
    font-weight: bold;
    letter-spacing: 0;
    line-height: 32px;
    text-align: center;
    word-break: keep-all;
}
  
.phone .step-1-header-class-subtitle  {
    height: 16px;
    width: 308px;
    color: #353C47;
    font-family: Canaro;
    font-size: 16px;
    font-weight: 300;
    letter-spacing: 0;
    line-height: 22px;
    text-align: center;
}

.phone .content {
    background-color: rgba(0, 0, 0, 0)
}

.phone .step-1-background {
    background: url(/GasOnline_FE/HomepageImage.aspx);
    background-repeat: no-repeat;
    background-position-x: center;
    height: 1000px;
    margin-top: 76px;
}

.phone .layout .main {
    background: none;
}