#beer1 {
  height: 50vh;
  background-color: #F7BD01;
  font-weight: 900;
  position: relative;
}
#beer1 > div {
  font-size: 6em;
  color: transparent;
  text-align: center;
  position: absolute;
  top: 50%;
  width: 100%;
  -webkit-transform: translate(0, -50%);
  -moz-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  -o-transform: translate(0, -50%);
  -webkit-background-clip: text;
  background-clip: text;
  background-image: url('//caraujo_pens.surge.sh/images/nnk2Gsg.png');
  background-position: 0 0;
  -webkit-animation: serveja 1s linear infinite;
  -moz-animation: serveja 1s linear infinite;
  animation: serveja 1s linear infinite;
  -ms-animation: serveja 1s linear infinite;
}
@-moz-keyframes serveja {
  to {
    background-position: 1051px 0;
  }
}
@-webkit-keyframes serveja {
  to {
    background-position: 1051px 0;
  }
}
@keyframes serveja {
  to {
    background-position: 1051px 0;
  }
}
#beer2 {
  height: 50vh;
  background-color: #fff;
  font-weight: 900;
  position: relative;
}
#beer2 > div {
  width: 140px;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  background-image: url('//caraujo_pens.surge.sh/images/zQjJ7lI.png');
  background-repeat: repeat-x;
  background-color: #F7BD01;
  -webkit-animation: serveja 10s linear infinite;
  -moz-animation: serveja 10s linear infinite;
  animation: serveja 10s linear infinite;
  -ms-animation: serveja 10s linear infinite;
}
#beer2 > div > div {
  position: relative;
  z-index: 400000;
  width: 100%;
  padding-bottom: 100%;
  background-image: url('../img/preloader/fondo.png');
  
}
#beer2 > div .bolha {
  border-radius: 100%;
  display: block;
  z-index: 2;
}
#beer2 > div .bolha:nth-child(40) {
  background-color: rgba(255, 255, 255, 0.3349466);
  width: 2.55941267px;
  height: 2.55941267px;
  position: absolute;
  left: 41.63064914%;
  bottom: 0;
  -webkit-animation: bolha 1.61477654s infinite linear;
  -moz-animation: bolha 1.61477654s infinite linear;
  animation: bolha 1.61477654s infinite linear;
  -ms-animation: bolha 1.61477654s infinite linear;
}
#beer2 > div .bolha:nth-child(39) {
  background-color: rgba(255, 255, 255, 0.54406996);
  width: 5.1452078px;
  height: 5.1452078px;
  position: absolute;
  left: 47.57773369%;
  bottom: 0;
  -webkit-animation: bolha 1.23403459s infinite linear;
  -moz-animation: bolha 1.23403459s infinite linear;
  animation: bolha 1.23403459s infinite linear;
  -ms-animation: bolha 1.23403459s infinite linear;
}
#beer2 > div .bolha:nth-child(38) {
  background-color: rgba(255, 255, 255, 0.10297698);
  width: 5.0318771px;
  height: 5.0318771px;
  position: absolute;
  left: 48.29800983%;
  bottom: 0;
  -webkit-animation: bolha 1.13359108s infinite linear;
  -moz-animation: bolha 1.13359108s infinite linear;
  animation: bolha 1.13359108s infinite linear;
  -ms-animation: bolha 1.13359108s infinite linear;
}
#beer2 > div .bolha:nth-child(37) {
  background-color: rgba(255, 255, 255, 0.33475984);
  width: 3.93739179px;
  height: 3.93739179px;
  position: absolute;
  left: 23.81047682%;
  bottom: 0;
  -webkit-animation: bolha 1.66500251s infinite linear;
  -moz-animation: bolha 1.66500251s infinite linear;
  animation: bolha 1.66500251s infinite linear;
  -ms-animation: bolha 1.66500251s infinite linear;
}
#beer2 > div .bolha:nth-child(36) {
  background-color: rgba(255, 255, 255, 0.12460796);
  width: 4.47727159px;
  height: 4.47727159px;
  position: absolute;
  left: 35.02759047%;
  bottom: 0;
  -webkit-animation: bolha 1.54371679s infinite linear;
  -moz-animation: bolha 1.54371679s infinite linear;
  animation: bolha 1.54371679s infinite linear;
  -ms-animation: bolha 1.54371679s infinite linear;
}
#beer2 > div .bolha:nth-child(35) {
  background-color: rgba(255, 255, 255, 0.85679091);
  width: 3.66906644px;
  height: 3.66906644px;
  position: absolute;
  left: 38.89493741%;
  bottom: 0;
  -webkit-animation: bolha 1.24434815s infinite linear;
  -moz-animation: bolha 1.24434815s infinite linear;
  animation: bolha 1.24434815s infinite linear;
  -ms-animation: bolha 1.24434815s infinite linear;
}
#beer2 > div .bolha:nth-child(34) {
  background-color: rgba(255, 255, 255, 0.84309167);
  width: 2.75852374px;
  height: 2.75852374px;
  position: absolute;
  left: 21.40519169%;
  bottom: 0;
  -webkit-animation: bolha 1.14605289s infinite linear;
  -moz-animation: bolha 1.14605289s infinite linear;
  animation: bolha 1.14605289s infinite linear;
  -ms-animation: bolha 1.14605289s infinite linear;
}
#beer2 > div .bolha:nth-child(33) {
  background-color: rgba(255, 255, 255, 0.24068036);
  width: 5.99435445px;
  height: 5.99435445px;
  position: absolute;
  left: 50.74190443%;
  bottom: 0;
  -webkit-animation: bolha 1.50692634s infinite linear;
  -moz-animation: bolha 1.50692634s infinite linear;
  animation: bolha 1.50692634s infinite linear;
  -ms-animation: bolha 1.50692634s infinite linear;
}
#beer2 > div .bolha:nth-child(32) {
  background-color: rgba(255, 255, 255, 0.86896782);
  width: 5.31277866px;
  height: 5.31277866px;
  position: absolute;
  left: 56.17281967%;
  bottom: 0;
  -webkit-animation: bolha 1.6771306s infinite linear;
  -moz-animation: bolha 1.6771306s infinite linear;
  animation: bolha 1.6771306s infinite linear;
  -ms-animation: bolha 1.6771306s infinite linear;
}
#beer2 > div .bolha:nth-child(31) {
  background-color: rgba(255, 255, 255, 0.30230212);
  width: 5.93015742px;
  height: 5.93015742px;
  position: absolute;
  left: 41.51515814%;
  bottom: 0;
  -webkit-animation: bolha 1.60437206s infinite linear;
  -moz-animation: bolha 1.60437206s infinite linear;
  animation: bolha 1.60437206s infinite linear;
  -ms-animation: bolha 1.60437206s infinite linear;
}
#beer2 > div .bolha:nth-child(30) {
  background-color: rgba(255, 255, 255, 0.70952942);
  width: 2.44681933px;
  height: 2.44681933px;
  position: absolute;
  left: 37.06639005%;
  bottom: 0;
  -webkit-animation: bolha 1.71754776s infinite linear;
  -moz-animation: bolha 1.71754776s infinite linear;
  animation: bolha 1.71754776s infinite linear;
  -ms-animation: bolha 1.71754776s infinite linear;
}
#beer2 > div .bolha:nth-child(29) {
  background-color: rgba(255, 255, 255, 0.10752819);
  width: 3.99472127px;
  height: 3.99472127px;
  position: absolute;
  left: 46.27766595%;
  bottom: 0;
  -webkit-animation: bolha 1.54240552s infinite linear;
  -moz-animation: bolha 1.54240552s infinite linear;
  animation: bolha 1.54240552s infinite linear;
  -ms-animation: bolha 1.54240552s infinite linear;
}
#beer2 > div .bolha:nth-child(28) {
  background-color: rgba(255, 255, 255, 0.74201992);
  width: 4.57512083px;
  height: 4.57512083px;
  position: absolute;
  left: 33.20735665%;
  bottom: 0;
  -webkit-animation: bolha 1.59612717s infinite linear;
  -moz-animation: bolha 1.59612717s infinite linear;
  animation: bolha 1.59612717s infinite linear;
  -ms-animation: bolha 1.59612717s infinite linear;
}
#beer2 > div .bolha:nth-child(27) {
  background-color: rgba(255, 255, 255, 0.25165272);
  width: 5.43933082px;
  height: 5.43933082px;
  position: absolute;
  left: 34.62661478%;
  bottom: 0;
  -webkit-animation: bolha 1.73894365s infinite linear;
  -moz-animation: bolha 1.73894365s infinite linear;
  animation: bolha 1.73894365s infinite linear;
  -ms-animation: bolha 1.73894365s infinite linear;
}
#beer2 > div .bolha:nth-child(26) {
  background-color: rgba(255, 255, 255, 0.11688153);
  width: 4.48565459px;
  height: 4.48565459px;
  position: absolute;
  left: 23.47848126%;
  bottom: 0;
  -webkit-animation: bolha 1.12590501s infinite linear;
  -moz-animation: bolha 1.12590501s infinite linear;
  animation: bolha 1.12590501s infinite linear;
  -ms-animation: bolha 1.12590501s infinite linear;
}
#beer2 > div .bolha:nth-child(25) {
  background-color: rgba(255, 255, 255, 0.50228669);
  width: 4.82639748px;
  height: 4.82639748px;
  position: absolute;
  left: 57.99284918%;
  bottom: 0;
  -webkit-animation: bolha 1.44557171s infinite linear;
  -moz-animation: bolha 1.44557171s infinite linear;
  animation: bolha 1.44557171s infinite linear;
  -ms-animation: bolha 1.44557171s infinite linear;
}
#beer2 > div .bolha:nth-child(24) {
  background-color: rgba(255, 255, 255, 0.34977949);
  width: 3.27700539px;
  height: 3.27700539px;
  position: absolute;
  left: 29.75459191%;
  bottom: 0;
  -webkit-animation: bolha 1.63389745s infinite linear;
  -moz-animation: bolha 1.63389745s infinite linear;
  animation: bolha 1.63389745s infinite linear;
  -ms-animation: bolha 1.63389745s infinite linear;
}
#beer2 > div .bolha:nth-child(23) {
  background-color: rgba(255, 255, 255, 0.38494505);
  width: 3.23346747px;
  height: 3.23346747px;
  position: absolute;
  left: 31.46121717%;
  bottom: 0;
  -webkit-animation: bolha 1.35155675s infinite linear;
  -moz-animation: bolha 1.35155675s infinite linear;
  animation: bolha 1.35155675s infinite linear;
  -ms-animation: bolha 1.35155675s infinite linear;
}
#beer2 > div .bolha:nth-child(22) {
  background-color: rgba(255, 255, 255, 0.88888775);
  width: 4.16410692px;
  height: 4.16410692px;
  position: absolute;
  left: 18.04132602%;
  bottom: 0;
  -webkit-animation: bolha 1.74024318s infinite linear;
  -moz-animation: bolha 1.74024318s infinite linear;
  animation: bolha 1.74024318s infinite linear;
  -ms-animation: bolha 1.74024318s infinite linear;
}
#beer2 > div .bolha:nth-child(21) {
  background-color: rgba(255, 255, 255, 0.34214058);
  width: 3.17031782px;
  height: 3.17031782px;
  position: absolute;
  left: 27.73993368%;
  bottom: 0;
  -webkit-animation: bolha 1.02312732s infinite linear;
  -moz-animation: bolha 1.02312732s infinite linear;
  animation: bolha 1.02312732s infinite linear;
  -ms-animation: bolha 1.02312732s infinite linear;
}
#beer2 > div .bolha:nth-child(20) {
  background-color: rgba(255, 255, 255, 0.20153778);
  width: 3.51675949px;
  height: 3.51675949px;
  position: absolute;
  left: 36.97980264%;
  bottom: 0;
  -webkit-animation: bolha 1.45598405s infinite linear;
  -moz-animation: bolha 1.45598405s infinite linear;
  animation: bolha 1.45598405s infinite linear;
  -ms-animation: bolha 1.45598405s infinite linear;
}
#beer2 > div .bolha:nth-child(19) {
  background-color: rgba(255, 255, 255, 0.21590929);
  width: 2.16416649px;
  height: 2.16416649px;
  position: absolute;
  left: 29.93524594%;
  bottom: 0;
  -webkit-animation: bolha 1.12053378s infinite linear;
  -moz-animation: bolha 1.12053378s infinite linear;
  animation: bolha 1.12053378s infinite linear;
  -ms-animation: bolha 1.12053378s infinite linear;
}
#beer2 > div .bolha:nth-child(18) {
  background-color: rgba(255, 255, 255, 0.81832419);
  width: 3.51850633px;
  height: 3.51850633px;
  position: absolute;
  left: 23.53203714%;
  bottom: 0;
  -webkit-animation: bolha 1.42176149s infinite linear;
  -moz-animation: bolha 1.42176149s infinite linear;
  animation: bolha 1.42176149s infinite linear;
  -ms-animation: bolha 1.42176149s infinite linear;
}
#beer2 > div .bolha:nth-child(17) {
  background-color: rgba(255, 255, 255, 0.52960679);
  width: 2.51342073px;
  height: 2.51342073px;
  position: absolute;
  left: 50.98884838%;
  bottom: 0;
  -webkit-animation: bolha 1.08201709s infinite linear;
  -moz-animation: bolha 1.08201709s infinite linear;
  animation: bolha 1.08201709s infinite linear;
  -ms-animation: bolha 1.08201709s infinite linear;
}
#beer2 > div .bolha:nth-child(16) {
  background-color: rgba(255, 255, 255, 0.87201906);
  width: 5.63389528px;
  height: 5.63389528px;
  position: absolute;
  left: 35.41147512%;
  bottom: 0;
  -webkit-animation: bolha 1.42459936s infinite linear;
  -moz-animation: bolha 1.42459936s infinite linear;
  animation: bolha 1.42459936s infinite linear;
  -ms-animation: bolha 1.42459936s infinite linear;
}
#beer2 > div .bolha:nth-child(15) {
  background-color: rgba(255, 255, 255, 0.69902751);
  width: 5.13425794px;
  height: 5.13425794px;
  position: absolute;
  left: 24.65306142%;
  bottom: 0;
  -webkit-animation: bolha 1.60702065s infinite linear;
  -moz-animation: bolha 1.60702065s infinite linear;
  animation: bolha 1.60702065s infinite linear;
  -ms-animation: bolha 1.60702065s infinite linear;
}
#beer2 > div .bolha:nth-child(14) {
  background-color: rgba(255, 255, 255, 0.63595673);
  width: 5.4298968px;
  height: 5.4298968px;
  position: absolute;
  left: 36.85577454%;
  bottom: 0;
  -webkit-animation: bolha 1.60192481s infinite linear;
  -moz-animation: bolha 1.60192481s infinite linear;
  animation: bolha 1.60192481s infinite linear;
  -ms-animation: bolha 1.60192481s infinite linear;
}
#beer2 > div .bolha:nth-child(13) {
  background-color: rgba(255, 255, 255, 0.4246604);
  width: 2.71157576px;
  height: 2.71157576px;
  position: absolute;
  left: 56.74449594%;
  bottom: 0;
  -webkit-animation: bolha 1.24283035s infinite linear;
  -moz-animation: bolha 1.24283035s infinite linear;
  animation: bolha 1.24283035s infinite linear;
  -ms-animation: bolha 1.24283035s infinite linear;
}
#beer2 > div .bolha:nth-child(12) {
  background-color: rgba(255, 255, 255, 0.20888521);
  width: 4.87839569px;
  height: 4.87839569px;
  position: absolute;
  left: 56.4252728%;
  bottom: 0;
  -webkit-animation: bolha 1.54743826s infinite linear;
  -moz-animation: bolha 1.54743826s infinite linear;
  animation: bolha 1.54743826s infinite linear;
  -ms-animation: bolha 1.54743826s infinite linear;
}
#beer2 > div .bolha:nth-child(11) {
  background-color: rgba(255, 255, 255, 0.65744916);
  width: 3.18907075px;
  height: 3.18907075px;
  position: absolute;
  left: 24.40937834%;
  bottom: 0;
  -webkit-animation: bolha 1.71322583s infinite linear;
  -moz-animation: bolha 1.71322583s infinite linear;
  animation: bolha 1.71322583s infinite linear;
  -ms-animation: bolha 1.71322583s infinite linear;
}
#beer2 > div .bolha:nth-child(10) {
  background-color: rgba(255, 255, 255, 0.63629632);
  width: 4.89622149px;
  height: 4.89622149px;
  position: absolute;
  left: 32.62887743%;
  bottom: 0;
  -webkit-animation: bolha 1.33098673s infinite linear;
  -moz-animation: bolha 1.33098673s infinite linear;
  animation: bolha 1.33098673s infinite linear;
  -ms-animation: bolha 1.33098673s infinite linear;
}
#beer2 > div .bolha:nth-child(9) {
  background-color: rgba(255, 255, 255, 0.27713469);
  width: 3.40242551px;
  height: 3.40242551px;
  position: absolute;
  left: 25.24138666%;
  bottom: 0;
  -webkit-animation: bolha 1.41313522s infinite linear;
  -moz-animation: bolha 1.41313522s infinite linear;
  animation: bolha 1.41313522s infinite linear;
  -ms-animation: bolha 1.41313522s infinite linear;
}
#beer2 > div .bolha:nth-child(8) {
  background-color: rgba(255, 255, 255, 0.40221131);
  width: 2.16783198px;
  height: 2.16783198px;
  position: absolute;
  left: 43.93408836%;
  bottom: 0;
  -webkit-animation: bolha 1.10537556s infinite linear;
  -moz-animation: bolha 1.10537556s infinite linear;
  animation: bolha 1.10537556s infinite linear;
  -ms-animation: bolha 1.10537556s infinite linear;
}
#beer2 > div .bolha:nth-child(7) {
  background-color: rgba(255, 255, 255, 0.10463768);
  width: 2.81742466px;
  height: 2.81742466px;
  position: absolute;
  left: 39.96001561%;
  bottom: 0;
  -webkit-animation: bolha 1.54532975s infinite linear;
  -moz-animation: bolha 1.54532975s infinite linear;
  animation: bolha 1.54532975s infinite linear;
  -ms-animation: bolha 1.54532975s infinite linear;
}
#beer2 > div .bolha:nth-child(6) {
  background-color: rgba(255, 255, 255, 0.49946346);
  width: 3.56031087px;
  height: 3.56031087px;
  position: absolute;
  left: 19.92676977%;
  bottom: 0;
  -webkit-animation: bolha 1.72117693s infinite linear;
  -moz-animation: bolha 1.72117693s infinite linear;
  animation: bolha 1.72117693s infinite linear;
  -ms-animation: bolha 1.72117693s infinite linear;
}
#beer2 > div .bolha:nth-child(5) {
  background-color: rgba(255, 255, 255, 0.68298225);
  width: 5.28229821px;
  height: 5.28229821px;
  position: absolute;
  left: 20.65796267%;
  bottom: 0;
  -webkit-animation: bolha 1.41300653s infinite linear;
  -moz-animation: bolha 1.41300653s infinite linear;
  animation: bolha 1.41300653s infinite linear;
  -ms-animation: bolha 1.41300653s infinite linear;
}
#beer2 > div .bolha:nth-child(4) {
  background-color: rgba(255, 255, 255, 0.12334705);
  width: 2.9226392px;
  height: 2.9226392px;
  position: absolute;
  left: 35.45177811%;
  bottom: 0;
  -webkit-animation: bolha 1.51614657s infinite linear;
  -moz-animation: bolha 1.51614657s infinite linear;
  animation: bolha 1.51614657s infinite linear;
  -ms-animation: bolha 1.51614657s infinite linear;
}
#beer2 > div .bolha:nth-child(3) {
  background-color: rgba(255, 255, 255, 0.23761191);
  width: 3.563674px;
  height: 3.563674px;
  position: absolute;
  left: 58.2222364%;
  bottom: 0;
  -webkit-animation: bolha 1.63139708s infinite linear;
  -moz-animation: bolha 1.63139708s infinite linear;
  animation: bolha 1.63139708s infinite linear;
  -ms-animation: bolha 1.63139708s infinite linear;
}
#beer2 > div .bolha:nth-child(2) {
  background-color: rgba(255, 255, 255, 0.73566792);
  width: 4.00727462px;
  height: 4.00727462px;
  position: absolute;
  left: 51.30620291%;
  bottom: 0;
  -webkit-animation: bolha 1.38782945s infinite linear;
  -moz-animation: bolha 1.38782945s infinite linear;
  animation: bolha 1.38782945s infinite linear;
  -ms-animation: bolha 1.38782945s infinite linear;
}
#beer2 > div .bolha:nth-child(1) {
  background-color: rgba(255, 255, 255, 0.87389768);
  width: 3.30731772px;
  height: 3.30731772px;
  position: absolute;
  left: 37.81647073%;
  bottom: 0;
  -webkit-animation: bolha 1.74276353s infinite linear;
  -moz-animation: bolha 1.74276353s infinite linear;
  animation: bolha 1.74276353s infinite linear;
  -ms-animation: bolha 1.74276353s infinite linear;
}
@-moz-keyframes bolha {
  to {
    bottom: 100%;
    opacity: 0;
    -webkit-opacity: 0;
    -moz-opacity: 0;
  }
}
@-webkit-keyframes bolha {
  to {
    bottom: 100%;
    opacity: 0;
    -webkit-opacity: 0;
    -moz-opacity: 0;
  }
}
@keyframes bolha {
  to {
    bottom: 100%;
    opacity: 0;
    -webkit-opacity: 0;
    -moz-opacity: 0;
  }
}