/** PORTFOLIO PAGES **/
.gridCont-TRC {
  gap: 0;
  grid-template-rows: 500px 500px 500px;
}

.bigOpening-TRC {
  background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2FSiteshot-Transforma.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  grid-column: 1/5;
  grid-row: 1/3;
}

.txtCase-TRC {
  grid-column: 3/5;
  grid-row: 1/2;
  padding-left: 5%;
  padding-right: 5%;
  background-color: #40404294;
}

.lapTRC {
  background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2FLaptop-Site-TRC.jpg");
}

.caseWebTRC1 {
  background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2FBox-Web-TRC1.jpg");
  grid-column: 1/2;
  grid-row: 3/4;
}

.caseWebTRC2 {
  background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2FBox-Web-TRC2.jpg");
  grid-column: 2/3;
  grid-row: 3/4;
}

.caseWebTRC3 {
  background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2FBox-Web-TRC3.jpg");
  grid-column: 3/4;
  grid-row: 3/4;
}

.caseWebTRC4 {
  background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2FBox-Web-TRC4.jpg");
  grid-column: 4/5;
  grid-row: 3/4;
}

.gridCont-MF {
  gap: 0;
  grid-template-rows: 500px 500px 500px;
}

.bigOpening-MF {
  background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2FTelas-site-Maria-da-Fe.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  grid-column: 1/5;
  grid-row: 1/3;
}

.txtCase-WMF {
  grid-column: 3/5;
  grid-row: 1/2;
  padding-left: 5%;
  padding-right: 5%;
  background-color: #40404294;
}

.img-destaque {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  grid-column: 3/5;
  grid-row: 2/3;
}

.lapMF {
  background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2FLaptop-Site-MariaDaFe-100.jpg");
}

.caseWebMF1 {
  background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2FBox-Web-MF1.jpg");
  grid-column: 1/2;
  grid-row: 3/4;
}

.caseWebMF2 {
  background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2FBox-Web-MF2.jpg");
  grid-column: 2/3;
  grid-row: 3/4;
}

.caseWebMF3 {
  background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2FBox-Web-MF3.jpg");
  grid-column: 3/4;
  grid-row: 3/4;
}

.caseWebMF4 {
  background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2FBox-Web-MF4.jpg");
  grid-column: 4/5;
  grid-row: 3/4;
}

.bigOpening-BC {
  background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2FSiteshot-BC.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  grid-column: 1/5;
  grid-row: 1/3;
}

.txtCase-BC {
  grid-column: 4/5;
  grid-row: 2/3;
  padding-left: 5%;
  padding-right: 5%;
}

.caseWebBC1 {
  background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2FBox-Web-BC1.jpg");
  grid-column: 1/2;
  grid-row: 3/4;
}

.caseWebBC2 {
  background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2FBox-Web-BC2.jpg");
  grid-column: 2/3;
  grid-row: 3/4;
}

.caseWebBC3 {
  background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2FBox-Web-BC3.jpg");
  grid-column: 3/4;
  grid-row: 3/4;
}

.caseWebBC4 {
  background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2FBox-Web-BC4.jpg");
  grid-column: 4/5;
  grid-row: 3/4;
}

.icoPort-web {
  background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2FiDesignWeb.svg");
}

.heroPort-web {
  background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2Fhero-port-web.jpg");
}

.top-img-portWeb-GA {
  background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2Ftop-Site-Garcia.jpg");
}

.abertura-WebGA {
  background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2FAbertura-Site-Garcia.jpg");
}

.caseWebGA1 {
  background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2FBox-Site-Garcia.jpg");
}

.caseWebGA2 {
  background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2FBox-Site-Garcia2.jpg");
}

.caseWebGA3 {
  background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2FBox-Site-Garcia3.jpg");
}

.caseWebGA4 {
  background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2FBox-Site-Garcia4.jpg");
}

.top-img-port-WebVS {
  background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2Ftop-Site-Varga.jpg");
}

.abertura-WebVS {
  background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2FAbertura-Site-Varga.jpg");
}

.caseWebVS1 {
  background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2FBox-Site-Varga.jpg");
}

.caseWebVS2 {
  background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2FBox-Site-Varga2.jpg");
}

.caseWebVS3 {
  background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2FBox-Site-Varga3.jpg");
}

.caseWebVS4 {
  background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2FBox-Site-Varga4.jpg");
}

.just1moreThing {
  width: 100%;
  height:fit-content;
  display:flex;
  background-color: #f5f5f5;
  margin: 3% 0;
  padding:3%;
  border-radius: 1.25rem;
}

.inside-OneMore {
  flex-basis: 80%;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.oneMoreTitle {
  flex-basis: 100%;
  margin-bottom: 1%;
  font-size:2rem;
  font-weight: 100;
  line-height: 1.2;
}

.thumbAddCases {
  flex-basis: 49%;
  margin-bottom: 2%;
  box-shadow: 0 5px 5px 0 rgba(061, 061, 063, .80);
}

.thumbAddCases:hover {
  border:#ffd400 solid 5px;
  border-radius: 5px;
}



/**  BREAKPOINTS **/
@media screen and (max-width: 1800px) {
  .bigOpening-BC {
    background-size: contain;
  }
  .gridCont-HeightFlex {
    grid-template-rows: 1fr 1fr 393px;
  }
}

@media screen and (max-width: 1600px) {
  .bigOpening-BC {
    background-position: top center;
  }
}

@media screen and (max-width: 1536px) {
  .bigOpening-BC {
    background-size: cover;
  }
  .txtCase-BC {
    grid-column: 3/5;
  }
}

@media screen and (max-width: 1440px) {
  .lapMF {
    background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2FAlt-Laptop-MF.jpg");
  }
}

@media screen and (max-width: 1280px) {
  .titleCase-BC {
    line-height: 1.5em;
  }
}

@media screen and (max-width: 1200px) {
  .abertura-WebGA {
    background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2FAbertura-Site-Garcia-Mob.jpg");
    background-position: center center;
  }
  .abertura-WebVS {
    background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2FAbertura-Site-Varga-Mob.jpg");
    background-position: center center;
  }
  .lapMF {
    display: none;
  }

  .txtCase-WMF {
    background-color: #404042;
    grid-column: 3/5;
    grid-row: 2/3;
  }
}

@media screen and (max-width: 1136px) {
  .gridCont-TRC {
    grid-template-rows: 500px 500px 250px;
  }
}

@media screen and (max-width: 1080px) {
  .gridCont-MF {
    grid-template-rows: repeat(3, 1fr);
  }
  .txtCase-TRC {
    grid-column: 1/3;
    grid-row: 2/3;
  }
}

@media screen and (max-width: 1024px) {
  .gridCont-HeightFlex {
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(2, 1fr) 210px;
  }

  .bigOpening-BC {
    background-size: cover;
    background-position: top center;
    grid-column: 1/3;
    grid-row: 1/3;
  }
  .txtCase-BC {
    grid-column: 3/5;
    grid-row: 1/3;
    padding: 2.5%;
  }

  .caseWebBC1 {
    grid-column: 1/2;
    grid-row: 3/4;
  }

  .caseWebBC2 {
    grid-column: 2/3;
    grid-row: 3/4;
  }

  .caseWebBC3 {
    grid-column: 3/4;
    grid-row: 3/4;
  }

  .caseWebBC4 {
    grid-column: 4/5;
    grid-row: 3/4;
  }
}

@media screen and (max-width: 900px) {
  .BoxTitles-Web {
    flex-basis: 80% !important;
    margin-left: 1%;
  }
  .oneMoreTitle {
    font-size:1.5rem;
  }

  .bigOpening-MF {
    grid-column: 1/5;
    grid-row: 1/2;
  }
  .txtCase-WMF {
    grid-column: 1/5;
  }
}

@media screen and (max-width: 800px) {
  .gridCont-TRC {
    grid-template-rows: repeat(3, 1fr);
  }
  .lapTRC {
    display: none;
  }
  .txtCase-TRC {
    grid-column: 1/5;
    background-color: #404042;
  }

  .thumbAddCases {
    flex-basis: 100%;
    margin-bottom: 3%;
  }
}

@media screen and (max-width: 690px) {
  .txtCase-BC {
    padding: 4%;
  }
  .gridCont-TRC {
    grid-template-rows: 280px repeat(2, 1fr);
  }
  .bigOpening-TRC {
    background-size: contain;
    background-position: top center;
  }
}

@media screen and (max-width: 667px) {
  .gridCont-HeightFlex {
    grid-template-rows: 280px repeat(2, 1fr);
    gap: 0;
  }

  .bigOpening-BC {
    grid-column: 1/5;
    grid-row: 1/2;
  }
  .txtCase-BC {
    grid-column: 1/3;
    grid-row: 2/4;
  }

  .caseWebBC1 {
    grid-column: 3/4;
    grid-row: 2/3;
  }

  .caseWebBC2 {
    grid-column: 4/5;
    grid-row: 2/3;
  }

  .caseWebBC3 {
    grid-column: 3/4;
    grid-row: 3/4;
  }

  .caseWebBC4 {
    grid-column: 4/5;
    grid-row: 3/4;
  }

  #caseWebGA1 {
    grid-column: 1/3;
    grid-row: 3/4;
  }
  #caseWebGA2 {
    grid-column: 3/5;
    grid-row: 3/4;
  }
  #caseWebGA3 {
    grid-column: 1/3;
    grid-row: 4/5;
  }
  #caseWebGA4 {
    grid-column: 3/5;
    grid-row: 4/5;
  }
  #caseWebVS1 {
    grid-column: 1/3;
    grid-row: 3/4;
  }
  #caseWebVS2 {
    grid-column: 3/5;
    grid-row: 3/4;
  }
  #caseWebVS3 {
    grid-column: 1/3;
    grid-row: 4/5;
  }
  #caseWebVS4 {
    grid-column: 3/5;
    grid-row: 4/5;
  }

  .gridCont-TRC {
    grid-template-rows: repeat(4, 1fr);
  }
  .bigOpening-TRC {
    background-size: cover;
    background-position: center center;
  }
  .caseWebTRC1 {
    grid-column: 1/3;
    grid-row: 3/4;
  }

  .caseWebTRC2 {
    grid-column: 3/5;
    grid-row: 3/4;
  }

  .caseWebTRC3 {
    grid-column: 1/3;
    grid-row: 4/5;
  }

  .caseWebTRC4 {
    grid-column: 3/5;
    grid-row: 4/5;
  }
}

@media screen and (max-width: 640px) {
  .bigOpening-MF {
    background-size: 130%;
    background-position: top left;
  }
}

@media screen and (max-width: 600px) {
  .icoPort-web {
    flex-basis: 15% !important;
    margin-top: -4%;
  }
  .gridCont-MF {
    grid-template-rows: repeat(4, 1fr);
  }
  .bigOpening-MF {
    grid-column: 1/5;
    grid-row: 1/2;
  }
  .txtCase-WMF {
    grid-column: 1/5;
    grid-row: 2/3;
  }
  .caseWebMF1 {
    grid-column: 1/3;
    grid-row: 3/4;
  }

  .caseWebMF2 {
    grid-column: 3/5;
    grid-row: 3/4;
  }

  .caseWebMF3 {
    grid-column: 1/3;
    grid-row: 4/5;
  }

  .caseWebMF4 {
    grid-column: 3/5;
    grid-row: 4/5;
  }
}

@media screen and (max-width: 568px) {
  .grayBar-Web {
    padding: 7% !important;
  }
  .icoPort-web {
    margin-top: -2.5%;
  }
  .gridCont-HeightFlex {
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(2, 1fr) repeat(2, 230px);
  }

  .bigOpening-BC {
    background-size: contain;
    grid-column: 1/5;
    grid-row: 1/2;
  }
  .txtCase-BC {
    grid-column: 1/5;
    grid-row: 2/3;
  }

  .caseWebBC1 {
    grid-column: 1/3;
    grid-row: 3/4;
  }

  .caseWebBC2 {
    grid-column: 3/5;
    grid-row: 3/4;
  }

  .caseWebBC3 {
    grid-column: 1/3;
    grid-row: 4/5;
  }

  .caseWebBC4 {
    grid-column: 3/5;
    grid-row: 4/5;
  }

  .bigOpening-MF {
    background-size: cover;
  }
  .bigOpening-TRC {
    background-position: top center;
  }
}

@media screen and (max-width: 533px) {
  .icoPort-web {
    flex-basis: 16% !important;
  }
}

@media screen and (max-width: 504px) {
  .oneMoreTitle {
    margin-bottom: 2%;
  }
  .bigOpening-BC {
    background-size: cover;
  }
}

@media screen and (max-width: 480px) {
  .icoPort-web {
    flex-basis: 14% !important;
    margin-right: 5% !important;
    margin-top: 0 !important;
  }
}

@media screen and (max-width: 414px) {
  .icoPort-web {
    flex-basis: 22% !important;
  }
  .gridCont-MF {
    grid-template-rows: repeat(2, 1fr) repeat(2, 162px);
  }
  .bigOpening-MF {
    background-position: center center;
  }
  .gridCont-TRC {
    grid-template-rows: 250px 1fr repeat(2, 162px);
  }
  .bigOpening-TRC {
    background-size: 200%;
  }

  .oneMoreTitle {
    font-size: 1.2rem;
  }
  
}

@media screen and (max-width: 375px) {
  .gridCont-HeightFlex {
    grid-template-rows: 290px 1fr repeat(2, 230px);
  }
  .bigOpening-BC {
    background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2Ftela-principal-site-bc.jpg");
    background-size: contain;
  }
}

@media screen and (max-width: 360px) {
  .grid-Container {
    gap: 0;
  }
  .gridCont-HeightFlex {
    grid-template-rows: 280px 1fr repeat(2, 230px);
  }
  .top-img-portWeb-GA {
    background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2Ftop-Site-Garcia-mob.jpg");
    background-position: center center;
  }
  .top-img-port-WebVS {
    background-image: url("http://www.erc7231.com/proxy.php?url=https%3A%2F%2Fwww.ewcom.com.br%2Fimages%2Ftop-Site-Varga-mob.jpg");
    background-position: center center;
  }
}

@media screen and (max-width: 320px) {
  .BoxTitles-Web {
    flex-basis: 100% !important;
  }
  .gridCont-HeightFlex {
    grid-template-rows: 240px 1fr repeat(2, 230px);
  }
  .bigOpening-TRC {
    background-size: 250%;
  }
}