@import url('https://fonts.googleapis.com/css2?family=Coiny&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cookie&display=swap');

/*#hero-theme{background-color:#84e4e9; background-image:url('/wp-content/themes/understrap/img/themes/praia1/bg.png'); background-repeat:no-repeat;background-position:center 50px; background-size:contain;position: relative; height:250px; width:100%;}*/
#hero-theme{background-color: #fff; width:100%; height:auto;}
#hero-theme #nuvens1{width: 120px; position: absolute; top: 45px; right: 10%;}
#hero-theme #nuvens2{width: 120px; position: absolute; top: 15px; left: 10%;}
#hero-theme #sol{width: 130px; position: absolute; top:15px; left: 35%; z-index:0;}
#hero-theme #arvoretema{width:60px; position: absolute; bottom:-10px; left:20px; z-index:1; transform: scaleX(-1);}
#hero-theme #vacatema{width:210px; position: absolute; bottom:-20px; right:25%; z-index:2; transform: scaleX(-1);}
#hero-theme #porcotema{width:150px; position: absolute; bottom:-10px; left:30%; z-index:1;}
#hero-theme #galotema{width: 100px; position: absolute; bottom:255px; right:-15px; z-index:0;}
#hero-theme #celeiro{width:180px; position: absolute; bottom: 0px; right:-30px; z-index:0;}
#hero-theme #moldurasuperior{width:100%; height:70px;position: absolute;top: -20px; left:0px; z-index:5; background-image:url('/wp-content/themes/understrap/img/themes/praia1/moldura.png'); background-repeat:repeat-x; background-size:200px;background-position: center;}
#hero-theme #moldura{width:100%; height:70px;position: absolute;bottom: -20px; left:0px; z-index:5; background-image:url('/wp-content/themes/understrap/img/themes/praia1/moldura.png'); background-repeat:repeat-x; background-size:200px;background-position: center;}

.title-cha{background-color:#fff;text-align:center;background-image: url('/wp-content/themes/understrap/img/themes/praia1/bg01.jpg');background-repeat:repeat;background-size:cover;background-position:bottom;overflow:auto;}
#title-cha1{background-image:url('/wp-content/themes/understrap/img/themes/praia1/placa01.png');background-size: 60%;background-repeat:no-repeat;background-position:top center;height: 220px;text-align:center;width:100%;max-width:600px;margin:auto;padding-top: 35px;}
#title-cha1 h1{padding-top: 35px;font-family: 'Coiny', sans-serif;color: #2b55a5;}
#title-cha1 span{padding-top:15px;display:block;font-family: 'Cookie', sans-serif;color: #6d4009;font-size:60pt;margin-top:-30px;}
#title-cha2{background-image: url('/wp-content/themes/understrap/img/themes/praia1/placa02.png');background-size: 85%;background-repeat:no-repeat;background-position: center;height: 165px;text-align:center;width:100%;max-width:300px;margin:auto;padding-top: 25px;margin-top: -30px;}
#title-cha2 h1{padding-top:25px;font-family: 'Cookie', sans-serif;color: #2b55a5;font-size: 18pt !important;}
#title-cha2 span{padding-top: 0px;display:block;font-family: 'Cookie', sans-serif;color: #6d4009;font-size: 41pt;margin-top: -10px;}

#title-cha1 span.bigger{padding-top: 15px;color: #f5a3c7 !important;}

.title-sub{text-align:center; position:relative; overflow:hidden;}

.title-sub h1 {
    padding-top: 130px;
    padding-bottom: 130px;
    font-family: 'Cookie', sans-serif;
    color: #6d4009 !important;
    background-image: url(/wp-content/themes/understrap/img/themes/praia1/placa03.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 180px;
    z-index: 99;
    position: relative;
    font-size: 30pt !important;
    line-height: 35px;
}

#title-local {
    background-image: url(/wp-content/themes/understrap/img/themes/praia1/bg02.jpg);
    background-repeat: repeat;
    background-size: cover;
    background-position: top;
}

#title-rsvp{
    background-image: url(/wp-content/themes/understrap/img/themes/praia1/bg03.jpg);
    background-repeat: repeat;
    background-size: cover;
}

#title-videos{
    background-image: url(/wp-content/themes/understrap/img/themes/praia1/bg05.jpg);
    background-size: cover;
    background-position: top;
}

#title-fotos{
    background-image: url(/wp-content/themes/understrap/img/themes/praia1/bg04.jpg);
    background-size: cover;
    background-position: top;
}

#title-presentes{
    background-image: url(/wp-content/themes/understrap/img/themes/praia1/bg07.jpg);
    background-size: cover;
    background-position: bottom;
}

#title-presentes #title-presentes1{
    position: absolute;
    bottom: 0px;
    right: -10px;
    width: 150px;
}

#title-presentes #title-presentes2{
    position: absolute;
    bottom: 0px;
    right: -10px;
    width: 150px;
}

#title-mural{
    background-image: url(/wp-content/themes/understrap/img/themes/praia1/bg06.jpg);
    background-size: cover;
    background-position: top;
}

#tocha1{
    position: absolute;
    bottom: 10px;
    left: 20px;
    width: 65px;
}

#castelo{
    position: absolute;
    bottom: 10px;
    right: 100px;
    width: 200px;
}

#tocha2{
    position: absolute;
    bottom: 10px;
    right: 20px;
    width: 65px;
}

#varal{
    position: absolute;
    top: 0px;
    left: 25%;
    width: 700px;
}

#estrela1{
    position: absolute;
    top: 10px;
    right: 20px;
    width: 150px;
}

#estrela2{
    position: absolute;
    bottom: 10px;
    left: 20px;
    width: 150px;
}

#coco{
    position: absolute;
    bottom: 10px;
    left: 20px;
    width: 200px;
}

#bola{
    position: absolute;
    bottom: 10px;
    right: -65px;
    width: 250px;
}

#molduraemptycover{background-image:url('/wp-content/themes/understrap/img/themes/praia1/moldura.png'); background-repeat: repeat-x; background-size: 800px; background-position:top; position: relative; height:34px; overflow: hidden; top: 0px; left: 0px; width: 100%;}

.hero-img #moldurasuperior{background-image:url('/wp-content/themes/understrap/img/themes/praia1/moldura.png');background-repeat:repeat-x;background-size:800px;background-position:top;position:absolute;height:150px;overflow:hidden;top:-17px;left: 0px;width: 100%;}

.hero-img #moldura{background-image:url('/wp-content/themes/understrap/img/themes/praia1/moldura2.png');background-repeat:repeat-x;background-size:800px;background-position:bottom;position:absolute;height:150px;overflow:hidden;bottom: -23px;left: 0px;width: 100%;}

.title-cha #cubos{float: left; width: 150px; margin-left:-10px; margin-top:-140px;}
.title-cha #brinquedo{float: right; width: 150px; margin-right:20px; margin-top:-120px;}

#sobreospais{background:#fff !important;}
#sobreospais .pink-text{font-family: 'Coiny', sans-serif !important;color: #2b55a5 !important;font-size: 20pt !important;}
#sobreospais .baby-green-1-text{font-family: 'Cookie', sans-serif;color: #6d4008 !important;font-size: 25pt !important;}

#grampo01{display:none;}
#grampo02{display:none;}

@media (max-width:727px){
    .title-sub h1{font-size: 22pt !important;padding-bottom: 70px;background-size: 140px;padding-top:70px;}
    .title-sub.double h1{line-height: 25px;padding-top: 70px;}
    .title-sub{background-size:60%;}
    .title-cha #cubos{width: 70px; margin-left: 0px; margin-top: -100px;}
    .title-cha #brinquedo{width: 80px; margin-right: 10px; margin-top: -105px;}
    #title-fotos #flor_rosa{left:0px; width: 70px;}
    #title-fotos #flor_laranja{right:0px; width: 70px;}
    #title-rsvp #galinha{left:0px; width: 100px;}
    #title-rsvp #carneiro{right:-20px; width: 115px;}
    #title-cha1{height:200px;margin-bottom: 0px;padding-top: 40px;background-size:80%;}
    #title-cha1 h1{padding-top: 20px;line-height: 40px;}
    #title-cha2{height:130px;background-size:70%;padding-top: 5px;}
    /*#hero-theme{background-position:center 50px; height: 200px;}*/
    #hero-theme #moldura{height: 50px; background-size: 150px;}
    #hero-theme #nuvens1{width:80px;}
    #hero-theme #nuvens2{width:80px;}
    #hero-theme #arvoretema{width: 70px; bottom: -10px;}
    #hero-theme #sol{width: 90px; top: 25px;}
    #hero-theme #celeiro{right:-30px; width:130px;}
    #hero-theme #vacatema{right:20%; width:120px; bottom: -9px;}
    #hero-theme #porcotema{left:20%; width: 100px; bottom: -6px;}
    .hero-img #moldura, .hero-img #moldurasuperior{background-size: 520px;}
    #title-local{padding:0px;}
    #title-cha1 span{font-size: 40pt; margin-top: -10px;}
    #title-cha1 span.bigger{margin-top: -40px !important; font-size:30pt !important;}
    #coco{width:70px;}
    #varal{width: 350px;left: 5%;}
    #bola{width:70px;}
    #estrela1{width:70px;}
    #estrela2{width:70px;}
    #tocha1{width: 30px;}
    #tocha2{width: 30px;}
    #castelo{width: 70px;right: 45px;}
}
