/* ----------------------------------------------------------------
	Custom CSS

	Add all your Custom Styled CSS here for New Styles or
	Overwriting Default Theme Styles for Better Hanlding Updates
-----------------------------------------------------------------*/


/* -------------------------------------

INTRODUÇÃO A COMPOSIÇÃO DE IMAGENS

--------------------------------------*/
.logov1{
  width: 200px;
}

.sliderintro{
background-image: url('../images/megapack/bg-captain-furry.webp');
height:100vh;
background-position: -800px;
}

/* --------------------------------------

  PACK EFEITOS VISUAIS

  -------------------------------------*/


.imagebgpackvfx {
  height:auto;
  width: 500px;
}

.imageboxpackvfx {
  position:relative;
  height:auto;
  width: 460px;
  z-index:2;
}

        @media only screen and (max-width: 600px) {
          .imageboxpackvfx {
            position:relative;
            top:-30px;
            height:auto;
            z-index:2;
            display: block;
            margin-left: auto;
            margin-right: auto;
            width:250px;
          }
        }

.titulo-packvfx {
  position:relative;
  font-size:100px !important;
  color:#fff !important;
  letter-spacing: 2px;
 text-transform: uppercase;
 font-weight: 700;
 line-height: 1;
 margin-bottom: 0;
 z-index:1;
}
        @media only screen and (max-width: 600px) {
          .titulo-packvfx {
            position:relative;
            top:-60px;
            font-size:50px !important;
            color:#fff !important;
            letter-spacing: 2px;
           text-transform: uppercase;
           font-weight: 700;
           line-height: 1;
           margin-bottom: 0;
           z-index:1;
           text-align: center;
          }
        }

.row.imagebgpackvfx02{
  height:1000px;
  background-image: url('../images/pack-efeitos-visuais/bg-packvfx2.jpg');
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
      @media only screen and (max-width: 600px) {
        .row.imagebgpackvfx02{
          height:200px;
          position: relative;
        }
      }

.btn1 {
  position: relative;
  z-index: 10;
  width: 140px;
  height: 140px;
  border: 2px solid rgba(255, 255, 255, .1);
  border-radius: 30px;
  background-color: rgba(255, 255, 255, .1);
  background-image: url("https://www.transparenttextures.com/patterns/concrete-wall.png");
  color: #fff;
  letter-spacing: 1px;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  outline: none;
  cursor: pointer;
  font-size:4rem;
  line-height:8rem;
  color:#07d9ce;
}
        @media only screen and (max-width: 600px) {
          .btn1{
            width:80px;
            height:80px;
            border-radius: 10px;
            font-size:2.5rem;
            line-height:5rem;
          }
        }
.btn1::before {
  position: absolute;
  top: 70px;
  left: 39px;
  z-index: -1;
  width: 60px;
  height: 60px;
  border-radius: 20px;
  background-color: #07d9ce;
  filter: blur(30px) saturate(186%);
  content: "";
  transition: .5s;
}
        @media only screen and (max-width: 600px) {
          .btn1::before {
            position: absolute;
            top: 40px;
            left: 25px;
            width: 30px;
            height: 30px;
            filter: blur(20px) saturate(186%);
          }
        }
.btn1:hover {
  line-height:7.5rem;
  position:relative;
  top:-1px;
}
        @media only screen and (max-width: 600px) {
          .btn1:hover {
            line-height:4.5rem;
          }
        }
.btn1:hover::before {
  transform: scale(1.2);
}

.btn2 {
  position: relative;
  z-index: 10;
  width: 140px;
  height: 140px;
  border: 2px solid rgba(255, 255, 255, .1);
  border-radius: 30px;
  background-color: rgba(255, 255, 255, .1);
  background-image: url("https://www.transparenttextures.com/patterns/concrete-wall.png");
  color: #fff;
  font-size: 1.25rem;
  letter-spacing: 1px;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  outline: none;
  cursor: pointer;
  font-size:4rem;
  line-height:8rem;
  color:#129cf7;
}
          @media only screen and (max-width: 600px) {
            .btn2{
              width:80px;
              height:80px;
              border-radius: 10px;
              font-size:2.5rem;
              line-height:5rem;
            }
          }
.btn2::before {
  position: absolute;
  top: 70px;
  left: 39px;
  z-index: -1;
  width: 60px;
  height: 60px;
  border-radius: 20px;
  background-color: #129cf7;
  filter: blur(30px) saturate(186%);
  content: "";
  transition: .5s;
}
          @media only screen and (max-width: 600px) {
            .btn2::before {
              position: absolute;
              top: 40px;
              left: 25px;
              width: 30px;
              height: 30px;
              filter: blur(20px) saturate(186%);
            }
          }
.btn2:hover {
  line-height:7.5rem;
  position:relative;
  top:-1px;
}
          @media only screen and (max-width: 600px) {
            .btn2:hover {
              line-height:4.5rem;
            }
          }
.btn2:hover::before {
  transform: scale(1.2);
}

.btn3 {
  position: relative;
  z-index: 10;
  width: 140px;
  height: 140px;
  border: 2px solid rgba(255, 255, 255, .1);
  border-radius: 30px;
  background-color: rgba(255, 255, 255, .1);
  background-image: url("https://www.transparenttextures.com/patterns/concrete-wall.png");
  color: #fff;
  font-size: 1.25rem;
  letter-spacing: 1px;
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
  outline: none;
  cursor: pointer;
  font-size:4rem;
  line-height:8rem;
  color:#e249f9;
}
          @media only screen and (max-width: 600px) {
            .btn3{
              width:80px;
              height:80px;
              border-radius: 10px;
              font-size:2.5rem;
              line-height:5rem;
            }
          }
.btn3::before {
  position: absolute;
  top:70px;
  left: 39px;
  z-index: -1;
  width: 60px;
  height: 60px;
  border-radius: 20px;
  background-color: #e249f9;
  filter: blur(30px) saturate(186%);
  content: "";
  transition: .5s;
}
          @media only screen and (max-width: 600px) {
            .btn3::before {
              position: absolute;
              top: 40px;
              left: 25px;
              width: 30px;
              height: 30px;
              filter: blur(20px) saturate(186%);
            }
          }
.btn3:hover {
  line-height:7.5rem;
  position:relative;
  top:-1px;
  border: 2px solid rgba(255, 255, 255, .1);
}
        @media only screen and (max-width: 600px) {
          .btn3:hover {
            line-height:4.5rem;
          }
        }
.btn3:hover::before {
  transform: scale(1.2);
}

.verticalalign{
  position: absolute;
  top: 50%;
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

.examples {
  border-radius:30px;
  margin-top:30px;
  margin-left: 20px;
  height:180px;
}
        @media only screen and (max-width: 600px) {
          .examples {
            border-radius:5px;
            margin-top:20px;
            margin-left: 20px;
            height:90px;
          }
        }

.imagebgpackvfx03{
  height:700px;
  background-image: url('../images/pack-efeitos-visuais/bg-section.jpg');
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}
          @media only screen and (max-width: 600px) {
              .imagebgpackvfx03{
              height: 850px;
              }
          }

.mobileiconsvfx{
  font-size:6rem;
  color:#fff;
}
          @media only screen and (max-width: 600px) {
              .mobileiconsvfx{
              font-size:4rem;
              }
            }

.mobileiconsvfx2{
  font-size:3rem ;
  color:#fff ;
}
            @media only screen and (max-width: 600px) {
                .mobileiconsvfx2{
                font-size:1.5rem;
                }
              }
.arrowwidth{
  width: 14rem;
}

.logoartist{
  height:100px;
  width:auto !important;
  opacity:0.4;
}
        @media only screen and (max-width: 600px) {
          .logoartist{
            height:60px;
            margin-bottom:50px;
          }
        }

.oartista{
  background:#111f40;
  padding-top: 200px;
  padding-bottom:200px;
}
.oartistaimg01{
  width:85%;
  height:auto;
  border-radius:50%;
}
    @media only screen and (max-width: 600px) {
      .oartistaimg01{
        position: relative;
        left: 35px;
        width:85%;
        height:auto;
        border-radius:50%;
      }
    }

.oartistaimg03{
  height:500px;
  width:auto !important;
}
      @media only screen and (max-width: 600px) {
        .oartistaimg03{
          height:350px;
          width:100% !important;
        }
      }

.oartistatext{
  color:#fff;
  text-align: justify;
  font-size:18pt;
}

.oartistatext02{
  color:#fff;
  text-align: justify;
  font-size:15pt;
}

.oartistatext03{
  color:#fff;
  text-align: right;
  font-size:18pt;
}
        @media only screen and (max-width: 600px) {
          .oartistatext03{
            color:#fff;
            text-align: center;
            font-size:18pt;
          }
        }
.packport {
  padding-left: 0px;
  padding-right: 0px;
}

.icon-tooltip:hover{
  background-color: #fff;
}


/* ---------------------------------------------------------------------
------------------------------------------------------------------------
------------------------------------------------------------------------

CRIA PSD \/   \/

---------------------------------*/


.slideprincipal{
  position: relative;
  display: flex;
  flex-flow: column;
  justify-content: center;
  height:100vh;
  background-image: url('../images/cria-psd/BG01.jpg');
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

            @media only screen and (max-width: 600px) {
                .slideprincipal{
                  position: relative;
                  flex-flow: column;
                  justify-content: center;
                  height:120vh;
                  background-position: left;
                }
            }

.slider-caption {
  position: relative;
  display: flex;
  height: 100%;
  flex-flow: column;
  justify-content: center;
}

.titulo-cria {
  font-size:120px !important;
  color:#fff !important;
  letter-spacing: 2px;
 text-transform: uppercase;
 font-weight: 700;
 line-height: 1;
 margin-bottom: 0;
}

            @media only screen and (max-width: 600px) {
              .titulo-cria {
                margin-top:0px;
                font-size:70px !important;
                text-align:center;
              }
            }

.subtitulocria{
  font-size:18pt !important;
}
            @media only screen and (max-width: 600px) {
                .subtitulocria{
                  font-size: 10pt !important;
                  text-align:center;
                  margin-left:30px;
                  padding-right:30px;
                }
            }

.imageslidecria{
  width:400px;
  height:auto;
}

          @media only screen and (max-width: 600px){
            .imageslidecria{
              position: relative;
              left:60px;
              width:300px;
              height:auto;
            }
          }

  @media only screen and (max-width: 600px){
              .bgmobilecria{
                position: relative;
                top:-50px;
                width:1000px;
              }
          }

@media only screen and (max-width: 600px){
                      .before-heading{
                        margin-top: 100px;
                      }
                  }

.oqueeuganho{
  direction: rtl;
  text-align: right;
}

            @media only screen and (max-width: 600px){
              .oqueeuganho{
                direction: rtl;
                text-align:center;
                position: relative;
                left: 20px;
              }
            }

.bgcria02{
  height:2600px;
  background-image: url('../images/cria-psd/BG02.jpg');
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

          @media only screen and (max-width: 600px){
            .bgcria02{
              height:600px;
              background-image: url('../images/cria-psd/BG02.jpg');
              background-position: center;
              background-size: cover;
              background-repeat: no-repeat;
            }
          }

.secaoconteudocria{
  position: relative;
  top:2000px;
  background-color:#000000;
  padding:80px;
  border-radius: 100px;
  z-index:1;;"
}

          @media only screen and (max-width: 600px){
            .secaoconteudocria{
              position: relative;
              top:340px;
              background-color:#000000;
              padding:32px;
              margin-left:15px;
              margin-right:10px;
              border-radius: 50px;
              z-index:1;;"
            }

          }

.ajustecria{
  height:750px;
}

        @media only screen and (max-width: 600px){
          .ajustecria{
            height:2300px;
          }
        }
.imgaulacria{
    width: 100% !important;
    height:380px !important;
    border-radius:30px;
}
      @media only screen and (max-width: 600px){
        .imgaulacria{
            width: 100% !important;
            height:200px !important;
            border-radius:20px;
        }
      }

.imgaulacriaoverlay{
  border-radius: 30px !important;
}
.imgaulacriaoverlay:before{
  border-radius: 30px !important;
}
        @media only screen and (max-width: 600px){
          .imgaulacriaoverlay{
            border-radius: 10px !important;
          }
          .imgaulacriaoverlay:before{
            border-radius: 20px !important;
          }
        }




        .imgaulacrianova{
            width: 100% !important;
            height:600px !important;
            border-radius:30px;
        }
              @media only screen and (max-width: 600px){
                .imgaulacrianova{
                    width: 100% !important;
                    height:200px !important;
                    border-radius:20px;
                }
              }

        .imgaulacriaoverlay{
          border-radius: 30px !important;
        }
        .imgaulacriaoverlay:before{
          border-radius: 30px !important;
        }
                @media only screen and (max-width: 600px){
                  .imgaulacriaoverlay{
                    border-radius: 10px !important;
                  }
                  .imgaulacriaoverlay:before{
                    border-radius: 20px !important;
                  }
                }


.contadorcriaaulanova{
  background: rgba( 13, 22, 40, 0.25 );
  box-shadow: 0 8px 32px 0 rgba( 13, 22, 40, 0.6 );
  backdrop-filter: blur( 4.0px );
  -webkit-backdrop-filter: blur( 4.0px );
  border-radius: 10px;
  border-color: rgba(255,255,255, 0.2);
  font-size: 35px;
  color: #fff;
  padding-top: 30px;
  padding-bottom: 30px;
  margin-left: 200px;
  margin-right: 210px;
}

  @media only screen and (max-width: 600px){
    .contadorcriaaulanova{
      background: rgba( 13, 22, 40, 0.25 );
      box-shadow: 0 8px 32px 0 rgba( 13, 22, 40, 0.6 );
      backdrop-filter: blur( 4.0px );
      -webkit-backdrop-filter: blur( 4.0px );
      border-radius: 10px;
      border-color: rgba(255,255,255, 0.2);
      font-size: 16px;
      color: #fff;
      padding-top: 10px;
      padding-bottom: 10px;
      margin-left: 40px;
      margin-right: 40px;
    }
  }


.criabuttonaula{
    position: relative;
    top:25%;
    margin:120px;
    background-color:#f8138e;
    color:#fff;
    font-weight: 600;
    font-size:18px;
    text-transform:capitalize;
    border-radius:50px;
}

    @media only screen and (max-width: 600px){
      .criabuttonaula{
          position: relative;
          top:25%;
          margin:30px;
          background-color:#f8138e;
          color:#fff;
          font-weight: 600;
          font-size:16px;
          text-transform:capitalize;
          border-radius:50px;
      }
    }

.bgcria03{
  height:1200px;
  background-image: url('../images/cria-psd/BG03.webp');
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

    @media only screen and (max-width: 600px){
        .bgcria03{
          height:220px;
          background-image: url('../images/cria-psd/BG03.webp');
          background-position: center;
          background-size: cover;
          background-repeat: no-repeat;
      }
    }

.ajustemobilecriatext{
  text-align:left;
}

@media only screen and (max-width: 600px){
  .ajustemobilecriatext{
    text-align:center;
    margin-top: 50px;
    margin-left:5px;
    line-height: 1.0 !important;
  }
}

.oartistatextcria{
  color:#fff;
  text-align: justify;
  font-size:18pt;
}
  @media only screen and (max-width: 600px){
    .oartistatextcria{
      color:#fff;
      margin-left: 20px;
      margin-right:20px;
      text-align: center;
      font-size:18pt;
    }

    .iconcriaajustemobile{
      position: relative;
      left:40px;
      margin-top: 60px;
    }

  }

.bgcria04{
  height:1200px;
  background-image: url('../images/pack-efeitos-visuais/oartista02.jpg');
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

@media only screen and (max-width: 600px){
  .bgcria04{
    height:500px;
    background-position: right;
  }
}

.criabuttonfinale{
  border-radius:50px;
  background: rgb(78,78,78);
  background: linear-gradient(90deg, rgba(78,78,78,1) 0%, rgba(24,24,24,1) 100%);
  font-size: 1rem;
  line-height: 30px;
}

@media only screen and (max-width: 600px){
  .criabuttonfinale{
    border-radius:22px;
    position: relative;
    top: 150px;
    left:60px;
    padding: 8px;
    padding-left: 30px;
    padding-right: 210px;
    font-size: 1rem;
    line-height: 30px;
  }
}

.titulo-psd {
  color:#c61159 !important;
}