/* ================================ BENEFITS ================================ */

#wrapper-benefits {
    width: 100%;
    margin: 0 auto;
    /*margin-bottom: 61px;*/
    background-color: #edf1f2;
    padding: 114px 0px 141px;
    margin-top: 91px;
}

#wrapper-benefits .wrapper-benefits-title{
    text-align: center;
}

#wrapper-benefits .benefits-title {
    text-align: center;
    font-size: 46px; 
    color: #0299B4;
    font-family: 'Metrocity-Bold';
    padding-bottom: 98px;
    line-height: 120%;
    padding-left: 15px;
    padding-right: 15px;
}

#wrapper-benefits .wrapper-left,
#wrapper-benefits .wrapper-right{display: inline-block;vertical-align: top;}

#wrapper-benefits .wrapper-left{width: 37.5%;}

#wrapper-benefits .wrapper-right{width: 61.5%;padding-left: 79px;}

#wrapper-benefits .wrapper-right .row{margin: 0 0 0 -15px;}

#wrapper-benefits .wrapper-left .vantagens-info-image{
    text-align: right;
}

#wrapper-benefits .wrapper-left .vantagens-info-image img{
    max-width: 368px;
    width: 100%;
    max-height: 734px;
}

#wrapper-benefits .benefit-wrapper {
    box-sizing: border-box;
    width: 100%;
}

#wrapper-benefits .benefit-wrapper .benefit-container {
    padding: 0 ;
    text-align: left;
    margin-bottom: 12px;
    /*height: 324px;*/
}

#wrapper-benefits .benefit-wrapper .benefit-container .benefit-image {
    text-align: left;
    /*padding-bottom: 44px;*/
    display: inline-block;
    vertical-align: middle;
    line-height: 0;
}

#wrapper-benefits .benefit-wrapper .benefit-container .benefit-image img {
    max-width: 150px;
    width: 100%;
}

#wrapper-benefits .benefit-wrapper .benefit-container .content-benefit{
    display: inline-block;
    vertical-align: middle;
    width: calc(100% - 179px);
    margin-left: 9px;
}

#wrapper-benefits .benefit-wrapper .benefit-container .benefit-title {
    font-family: 'Metrocity-Book';
    color: #1B3149;
    text-transform: uppercase;
    font-size: 28px;
    padding-bottom: 10px;
    line-height: 30px;
}

#wrapper-benefits .benefit-wrapper:nth-child(1) .benefit-container .benefit-title{padding-bottom: 0;}

#wrapper-benefits .benefit-wrapper .benefit-container b{
    font-family: 'Metrocity-Bold';
    color: #1B3149;
    font-size: 28px;
    line-height: 40px;
    text-transform: uppercase;
}

#wrapper-benefits .benefit-wrapper:nth-child(2) .benefit-title,
#wrapper-benefits .benefit-wrapper:nth-child(5) .benefit-title{
    font-family: 'Metrocity-Bold';
    color: #1B3149;
    font-size: 28px;
    line-height: 30px;
}

#wrapper-benefits .benefit-wrapper:not(:nth-child(3)) .benefit-container .benefit-description{
    font-family: 'Metrocity-Book';
    color: #1B3149;
    font-size: 28px;
    line-height: 40px;
}

#wrapper-benefits .benefit-wrapper .benefit-container .benefit-description {
    font-family: 'Metrocity-Bold';
    color: #1B3149;
    font-size: 28px;
    line-height: 30px;
    text-transform: uppercase;
    /*padding: 0 90px;*/
}
/* ================================ BENEFITS ================================ */

/* ================================ BLOCO_CUSTOM ================================ */
    #bloco-custom{
        padding-top: 44px;
        padding-bottom: 66px;
    }

    #bloco-custom .wrapper-global{
        max-width: 1536px;
        margin: auto;
        padding-bottom: 60px;
    }

    #bloco-custom .wrapper-global .content-desc{
        position: absolute;
        top: 50%;
        left: 50%;
        width: 100%;
        text-align: center;
        transform: translate(-50%, -50%);
        max-width: 708px;
        margin: auto;
    }

    #bloco-custom .wrapper-top{
        position: relative;
    }

    #bloco-custom .imagem img{
        display: block;
        width: 100%;
    }

    #bloco-custom .content-desc .contentTitles_subtitle{
        color: #fff;
        text-shadow: 1px 1px 4px #000000;
        padding: 0 15px 7px;
    }

    #bloco-custom .content-desc .contentTitles_button{
        color: #ffffff;
        border-color: #ffffff;
        background-color: #3c5e7a;
    }

    #bloco-custom .wrapper-global a:not(.contentTitles_button){
        display: block;
    }

    #bloco-custom .wrapper-global .wrapper-top:hover .contentTitles_button{
        opacity: 0.8;
    }

    #bloco-custom .wrapper-global .content-desc a:hover{
        text-decoration: none;
    }

    #bloco-custom .wrapper-bottom{
        text-align: center;
        padding-top: 65px;
        max-width: 1302px;
        margin: auto;
        padding-bottom: 60px;
    }

    #bloco-custom .wrapper-bottom .tit_H1{
        padding-bottom: 20px;
    }



/* ================================ BLOCO_CUSTOM ================================ */

/* =============================== STEPS INFO ================================= */

#wrapper-steps{
    width: 100%;
    background-color: #0299b4;
    padding: 126px 0 134px;
}

#wrapper-steps .steps-title-wrapper{text-align: center;}

#wrapper-steps .wrapper-steps-title{
    font-size: 46px;
    padding-bottom: 73px;
    font-family: 'Metrocity-Bold';
    color: #FFF;
    text-align: center;
    line-height: 120%;
    padding-left: 15px;
    padding-right: 15px;
}

#wrapper-steps .row{text-align: center;margin: auto;max-width: 1695px;}
#wrapper-steps .steps-wrapper{display: inline-block;vertical-align: top;float: none;}

#wrapper-steps .steps-wrapper .steps-image{max-width: 215px;margin: auto;}
#wrapper-steps .steps-wrapper .steps-image img{width: 100%;}
#wrapper-steps .steps-wrapper .content-steps{margin-top: 4px;}

#wrapper-steps .steps-wrapper .content-steps .steps-title,
#wrapper-steps .steps-wrapper .content-steps .steps-description{
    font-family: 'Metrocity-Light';
    color: #fff;
    font-size: 24px;
    line-height: 30px;
    text-transform: uppercase;
}

#wrapper-steps .steps-wrapper .content-steps .steps-title{
    padding: 0 18px 0;
    font-weight: normal;
}

#wrapper-steps .steps-wrapper .content-steps .steps-title span{
    font-size: 15px;
    line-height: 25px;
    padding: 7px 5px 0;
    display: block;
}

#wrapper-steps .wrapper-button.wrapper-button-list{
    text-align: center;
    margin-top: 51px;
}

#wrapper-steps .wrapper-button.wrapper-button-list .button {
    font-family: 'Metrocity-Bold';
    border-radius: 45px 0px;
    background: #DC0A63;
    color: #FFF !important;
    border: 0;
    padding: 24px 59px;
    font-size: 24px;
    text-transform: uppercase;
    box-shadow: 3px 3px 6px #00000029;
}

/* =============================== STEPS INFO ================================= */

/* =============================== GAS INFO ================================= */

#wrapper-gas-info {
    width: 100%;
    background-color: #1B3149;
    padding: 129px 104px;
}

#wrapper-gas-info .gas-info-container {
    max-width: 1440px;
    margin: 0 auto;
}

#wrapper-gas-info .gas-info-container .gas-info-image {
    float: left;
    width: 39%;
    padding-left: 10px;
}

#wrapper-gas-info .gas-info-container .gas-info-image img {
    max-width: 480px;
    margin: auto;
    width: 100%;
}

#wrapper-gas-info .gas-info-container .gas-info-text {
    float: right;
    width: 60%;
    color: #FFF;
    padding-top: 0px;
    margin-top: -10px;
}

#wrapper-gas-info .gas-info-container .gas-info-text .gas-info-title {
    font-size: 46px;
    padding-bottom: 60px;
    font-family: 'Metrocity-Bold';
    line-height: 120%;
}

#wrapper-gas-info .gas-info-container .gas-info-text .gas-info-description {
    font-family: 'Metrocity-Light';
    font-size: 22px;
    padding-bottom: 0;
    line-height: 30px;
    font-weight: 100;
}

#wrapper-gas-info .gas-info-container .gas-info-text .gas-info-description b {
    font-family: 'Metrocity-Bold';
}

#wrapper-gas-info .gas-info-container .gas-info-text .gas-info-button button {
    border-radius: 45px 0px;
    background: #DC0A63 0% 0% no-repeat padding-box;
    color: #FFF !important;
    border: 0;
    padding: 24px 56px;
    font-size: 24px;
    text-transform: uppercase;
    box-shadow: 3px 3px 6px #00000029;
}

#wrapper-gas-info .wrapper-gas-content .info-first,
#wrapper-gas-info .wrapper-gas-content .info-second{display: inline-block;vertical-align: top;width: 45%;}
#wrapper-gas-info .wrapper-gas-content .info-image,
#wrapper-gas-info .gas-info-text .wrapper-gas-content .gas-info-description{display: inline-block;vertical-align: middle;padding-bottom: 0;}
#wrapper-gas-info .wrapper-gas-content .info-image {max-width: 114px;vertical-align: top;}
#wrapper-gas-info .gas-info-text .wrapper-gas-content .gas-info-description {width: calc(100% - 104px);padding-top: 24px;padding-left: 6px;}

#wrapper-gas-info .gas-info-text .wrapper-gas-content .gas-info-description .info-title{text-transform: uppercase;font-size: 21px;}
#wrapper-gas-info .gas-info-text .wrapper-gas-content .gas-info-description .info-description{font-family: 'Metrocity-Bold';font-size: 18px;}
#wrapper-gas-info .wrapper-gas-content .info-first{margin-right: 61px;}

/* LARGER DESKTOP SCREEN'S                                                    */
/* ========================================================================== */
    
    /* ================================ BENEFITS ================================ */
        .show-desktop,
        #wrapper-benefits .wrapper-right.show-desktop {
            display: inline-block;
        }

        .show-mobile,
        #wrapper-benefits .wrapper-right.show-mobile {
            display: none;
        }

/* ========================================================================== */
/* SHORTER DESKTOP SCREEN'S                                                   */
/* ========================================================================== */

@media screen and (max-width: 1680px) and (min-width: 1440px) {

  /* ============================== GAS INFO ================================ */

  #wrapper-gas-info {
      padding: 129px 100px;
  }

}

/* ========================================================================== */
/* LAPTOP                                                                     */
/* ========================================================================== */

@media screen and (max-width: 1440px) {

  /* ============================== GAS INFO ================================ */

  #wrapper-gas-info {
      padding: 129px 100px;
  }

  #wrapper-gas-info .wrapper-gas-content .info-first, 
  #wrapper-gas-info .wrapper-gas-content .info-second{width: 44%;}

}


@media screen and (max-width: 1105px) {
  /* ============================== GAS INFO ================================ */
    #wrapper-gas-info .wrapper-gas-content .info-first, 
    #wrapper-gas-info .wrapper-gas-content .info-second{width: 43%;}
}


/* ================================ TABLET ================================ */

    /* ================================ BLOCO CUSTOM ================================ */
        body.tablet #bloco-custom{
            padding-bottom: 26px;
        }

        body.tablet #bloco-custom .wrapper-global {
            padding-bottom: 20px;
        }

        body.tablet #bloco-custom .wrapper-bottom {
            padding-bottom: 21px;
            padding-top: 15px;
            max-width: 1236px;
        }

       body.tablet #bloco-custom .wrapper-global .content-desc{
            max-width: 608px;
       }

        body.tablet #bloco-custom .imagem img{
            object-fit: cover;
            height: 100%;
            min-height: 444px;
        }

        body.tablet #bloco-custom .wrapper-bottom .description .h3,
        body.tablet #bloco-custom .wrapper-bottom .description span,
        body.tablet #bloco-custom .wrapper-bottom .description p,
        body.tablet #bloco-custom .wrapper-bottom .description .p,
        body.tablet #bloco-custom .wrapper-bottom .description .a,
        body.tablet #bloco-custom .wrapper-bottom .description a {
            font-size: 13px !important;
            line-height: 110% !important;
        }

        body.tablet #bloco-custom .wrapper-bottom .tit_H1 {
            padding-bottom: 14px;
        }

        /*body.tablet #bloco-custom .wrapper-bottom{
            max-width: 306px;
        }*/
    /* ================================ BLOCO CUSTOM ================================ */
    
    /* ============================= STEPS ============================== */

        body.tablet #wrapper-steps{padding-left: 15px;padding-right: 15px;}


        @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 1),
        screen and (min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 2){
            body.tablet #wrapper-gas-info .wrapper-gas-content .info-first {
                margin-right: 38px;
            }

            
            body.tablet #wrapper-gas-info .gas-info-text .wrapper-gas-content .gas-info-description{
                width: calc(100% - 105px);
            }

            body.tablet #wrapper-gas-info .wrapper-gas-content .info-first{
                margin-right: 15px;
            }

            body.tablet #wrapper-gas-info .wrapper-gas-content .info-first, body.tablet #wrapper-gas-info .wrapper-gas-content .info-second{
                width: 48%;
            }
        }

        @media only screen and (min-device-width: 1024px) and (max-device-width: 1366px) and (-webkit-min-device-pixel-ratio: 2){
            body.tablet #wrapper-gas-info .wrapper-gas-content .info-image {
                display: inline-block;
                margin: 0;
            }

            body.tablet #wrapper-gas-info .gas-info-text .wrapper-gas-content .gas-info-description{
                text-align: left;
                width: calc(100% - 104px);
            }
        }
         #wrapper-slider .slider-image img{/*object-fit: cover;*/height: auto;}

        body.tablet #wrapper-gas-info .wrapper-gas-content .info-first {margin-right: 52px;}

/* ================================ TABLET ================================ */

/* MOBILE DEVICES                                                             */
/* ========================================================================== */

@media screen and (max-width: 768px){

    /* ================================ BENEFITS ================================ */
        .show-desktop,
        #wrapper-benefits .wrapper-right.show-desktop {
            display: none;
        }

        .show-mobile,
        #wrapper-benefits .wrapper-right.show-mobile {
            display: inline-block;
        }

        #wrapper-benefits {
          padding: 38px 0px 170px;
          margin-top: 34px;
        }

        #wrapper-benefits .benefits-title {
          line-height: 38px;
          padding-bottom: 54px;
          font-size: 28px;
        }

        #wrapper-benefits .benefits-title.show-mobile{display: inline-block;padding: 0 15px 53px;}


        #wrapper-benefits .wrapper-left{padding-bottom: 48px;}
        #wrapper-benefits .wrapper-left,
        #wrapper-benefits .wrapper-right{width: 100%;padding-left: 0;} 

        #wrapper-benefits .wrapper-right .row{margin: auto;width: 100%;}
        #wrapper-benefits .benefit-wrapper{padding: 0;}

        #wrapper-benefits .benefit-wrapper .benefit-container {
          padding: 0;
          margin-bottom: 11px;
          padding-left: 20px;
        }

        #wrapper-benefits .benefit-wrapper .benefit-container .benefit-image {
          margin-right: 5px;
        }

        #wrapper-benefits .wrapper-left .vantagens-info-image {text-align: center;}
        #wrapper-benefits .wrapper-left .vantagens-info-image img{max-width: 244px;}

        #wrapper-benefits .benefit-wrapper .benefit-container .benefit-image img{    max-width: 86px;}

        #wrapper-benefits .benefit-wrapper .benefit-container .benefit-title {
          font-size: 15px;
          padding-bottom: 0;
          line-height: 150%;
        }

        #wrapper-benefits .benefit-wrapper .benefit-container .benefit-description {
          /*padding: 0 60px;*/
          line-height: 22px;
          font-size: 15px;
        }

        #wrapper-benefits .benefit-wrapper .benefit-container b{font-size: 15px;line-height: 150%;}
        #main #wrapper-benefits .benefit-wrapper .benefit-container .benefit-description{font-size: 15px;line-height: 22px;}

        #wrapper-benefits .benefit-wrapper .benefit-container .content-benefit {width: calc(100% - 104px);padding-right: 15px;}

        #wrapper-benefits .benefit-wrapper:nth-child(2) .benefit-title{font-family: 'Metrocity-Book';}
        #wrapper-benefits .benefit-wrapper:nth-child(2) .benefit-container .benefit-description{font-family: 'Metrocity-Bold';}

        #wrapper-benefits .benefit-wrapper:nth-child(3) .benefit-title{font-family: 'Metrocity-Bold';}
        #wrapper-benefits .benefit-wrapper:nth-child(3) .benefit-container .benefit-description{font-family: 'Metrocity-Book';}

    /* ================================ BENEFITS ================================ */

    /* ================================ BLOCO CUSTOM ================================ */
        #bloco-custom{
            padding-bottom: 26px;
        }

        #bloco-custom .wrapper-global {
            padding-bottom: 20px;
        }

        #bloco-custom .wrapper-bottom {
            padding-bottom: 21px;
            padding-top: 15px;
        }

        #bloco-custom .container{
            padding-left: 0;
            padding-right: 0;
        }

        #bloco-custom .imagem img{
            object-fit: cover;
            height: 100%;
            min-height: 126px;
        }

        #bloco-custom .wrapper-bottom .description .h3,
        #bloco-custom .wrapper-bottom .description span,
        #bloco-custom .wrapper-bottom .description p,
        #bloco-custom .wrapper-bottom .description .p,
        #bloco-custom .wrapper-bottom .description .a,
        #bloco-custom .wrapper-bottom .description a {
            font-size: 12px !important;
            line-height: 120% !important;
        }

        #bloco-custom .wrapper-bottom .tit_H1 {
            padding-bottom: 14px;
        }

        #bloco-custom .wrapper-bottom{
            max-width: 306px;
        }
    /* ================================ BLOCO CUSTOM ================================ */

    /* ============================== STEPS ================================ */

          #wrapper-steps{padding: 56px 20px 75px;}

          #wrapper-steps .wrapper-steps-title.show-mobile{display: inline-block;line-height: 38px;font-size: 28px;padding: 0 35px;}
          #wrapper-steps .steps-wrapper {margin-bottom: 26px;}

          #wrapper-steps .wrapper-button.wrapper-button-list .button {padding: 15px 43px;font-size: 16px;border-radius: 25px 0px;box-shadow: 3px 3px 6px #00000029;}
          #wrapper-steps ..wrapper-button-list {margin-top: 23px;}

          #wrapper-steps .steps-wrapper .content-steps .steps-description {font-size: 15px;padding-top: 4px;letter-spacing: 1px;}
          #wrapper-steps .steps-wrapper .content-steps .steps-title{font-size: 21px;letter-spacing: 1px;}
          #wrapper-steps .steps-wrapper .content-steps .steps-title span{padding-right: 0;padding-left: 0;}

          #wrapper-steps .steps-image img{max-width: 202px;}

    /* ============================== STEPS ================================ */

    /* ============================== GAS INFO ================================ */

        #wrapper-gas-info {
          padding: 56px 17px 12px;
        }

        #wrapper-gas-info .gas-info-container .gas-info-image {
          float: none;
          width: 100%;
          padding-left: 0;
        }

        #wrapper-gas-info .gas-info-container .gas-info-text {
          float: none;
          width: 100%;
          text-align: center;
          padding-top: 2px;
        }

        #wrapper-gas-info .gas-info-container .gas-info-text .gas-info-title {
          font-size: 28px;
          padding-bottom: 24px;
          line-height: 140%;
        }

        #wrapper-gas-info .gas-info-container .gas-info-text .gas-info-description {
          font-size: 18px;
          padding-bottom: 19px;
        }

        #wrapper-gas-info .gas-info-container .gas-info-text .gas-info-button {
          padding-top: 40px;
        }

        #wrapper-gas-info .gas-info-container .gas-info-text .gas-info-button button {
          font-size: 16px;
          box-shadow: 3px 3px 6px #00000029;
          border-radius: 25px 0px;
          padding: 15px 36px;
        }

        #wrapper-gas-info .wrapper-gas-content .info-first{margin: 0;width: 100%;}

        #wrapper-gas-info .gas-info-container .gas-info-text .wrapper-gas-content .gas-info-description{width: calc(100% - 96px);/*text-align: center;*/padding-top: 10px;}
        #wrapper-gas-info .gas-info-container .gas-info-text .wrapper-gas-content{text-align: left;}
        #wrapper-gas-info .wrapper-gas-content .info-image{max-width: 92px;/*display: block;margin: auto;*/max-height: 92px;}
        #wrapper-gas-info .wrapper-gas-content .info-image img{max-width: 92px;max-height: 92px;}
        #wrapper-gas-info .gas-info-text .wrapper-gas-content .gas-info-description .info-title{font-size: 17px;padding-left: 0;}
        #wrapper-gas-info .gas-info-container .gas-info-image img{max-width: none;width: 100%;}
        #wrapper-gas-info .wrapper-gas-content .info-first, 
        #wrapper-gas-info .wrapper-gas-content .info-second{width: 100%;}

}

/* ========================================================================== */
/* SMALL MOBILE DEVICES LIKE IPHONE 5                                         */
/* ========================================================================== */

@media screen and (max-width: 320px) {
    /* ============================== STEPS ================================ */

        #wrapper-steps .wrapper-steps-title.show-mobile{padding: 0;}

}
/* ========================================================================== */
/* TABLET DEVICES                                                             */
/* ========================================================================== */

/* ============================= GAS BOTTLES ============================== */

body.tablet #wrapper-gas-bottles .gas-bottle-container,
body.tablet #wrapper-gas-bottles .gas-bottle-info-container {
    margin-top: -191px;
}

body.tablet #wrapper-gas-bottles:not(.no-slider) .gas-bottle-container,
body.tablet #wrapper-gas-bottles:not(.no-slider) .gas-bottle-info-container {
    margin-top: -191px;
}

body.tablet #wrapper-gas-bottles:not(.no-slider) .gas-bottle-info-container{
    margin-top: 0;
}

body.tablet #wrapper-gas-bottles.no-slider .gas-bottle-container,
body.tablet #wrapper-gas-bottles.no-slider .gas-bottle-info-container {
    margin-top: 50px;
}

body.tablet #wrapper-gas-info .wrapper-gas-content .info-first {
    margin-right: 52px;
}

/*body.tablet #wrapper-gas-bottles .gas-bottle-container .gas-bottle-text .gas-bottle-bottom .gas-bottle-quantity .input_nav{
    right: 0;
}*/

/* ============================= STEPS ============================== */

body.tablet #wrapper-steps{padding-left: 15px;padding-right: 15px;}


@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 1),
screen and (min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 2){
    body.tablet #wrapper-gas-info .wrapper-gas-content .info-first {
        margin-right: 38px;
    }

    
    body.tablet #wrapper-gas-info .gas-info-text .wrapper-gas-content .gas-info-description{
        width: calc(100% - 105px);
    }

    body.tablet #wrapper-gas-info .wrapper-gas-content .info-first{
        margin-right: 15px;
    }

    body.tablet #wrapper-gas-info .wrapper-gas-content .info-first, body.tablet #wrapper-gas-info .wrapper-gas-content .info-second{
        width: 48%;
    }
}

@media only screen and (min-device-width: 1024px) and (max-device-width: 1366px) and (-webkit-min-device-pixel-ratio: 2){
    body.tablet #wrapper-gas-info .wrapper-gas-content .info-image {
        display: inline-block;
        margin: 0;
    }

    body.tablet #wrapper-gas-info .gas-info-text .wrapper-gas-content .gas-info-description{
        text-align: left;
        width: calc(100% - 104px);
    }
}
 #wrapper-slider .slider-image img{/*object-fit: cover;*/height: auto;}