@font-face {
    font-family: 'pacificoregular';
    src: url('../fonts/pacifico-webfont.woff2') format('woff2'),
         url('../fonts/pacifico-webfont.woff') format('woff'),
        url('../fonts/pacifico-webfont.ttf') format('ttf');
    font-weight: normal;
    font-style: normal;
}

.containerLogo {
    margin-left: auto;
    margin-right: auto;
    margin-top: 7px;
    width: 100%;
    font-family: 'pacificoregular', cursive, Arial, sans-serif;
}
.elasticwrapper {
    margin-left: auto;
    margin-right: auto;
    padding-right: 50px;
}

#logo{
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
    margin: 0;
    padding: 0;
}
#logo {
    font-weight: normal;
    font-size: 90px;
}
#logo span {
    display: inline-block;
    position: relative;
    letter-spacing: -1px;
    -webkit-transition: all 0.2s ease-out;
}
#logo span:hover {
    top: 30px
}

#logo .char2,
#logo .char12 {
color: #c44032;
    text-shadow: #863027 -4px 4px 0;
}

#logo .char3,
#logo .char11 {
    color: #e36b23;
    text-shadow: #9b4d1f -4px 4px 0
}
#logo .char4,
#logo .char10 {
    color: #e6c92e;
    text-shadow: #9c8b26 -4px 4px 0
}
#logo .char5,
#logo .char9 {
    color: #5da028;
    text-shadow: #427021 -4px 4px 0
}
#logo .char6,
#logo .char8 {
    color: #4584be;
    text-shadow: #2f597f -4px 4px 0
}
/*#logo .char6,*/
#logo .char7 {
    color: #7073cf;
    text-shadow: #4a4d88 -4px 4px 0
}

#logo .char9 {
   width: 40px;
}
#logo .char10 {
    left: 1px;
}

#logo .char10:hover {
    -webkit-transition-duration: 0.4s;
}


#logo .char10,
#logo .char11,
#logo .char12 {
	font-size:60px;
}

#logo .char1{ z-index: 1;}
#logo .char2{ z-index: 2;}
#logo .char3{ z-index: 3;}
#logo .char4{ z-index: 4;}
#logo .char5{ z-index: 5;}
#logo .char6{ z-index: 6;}
#logo .char7{ z-index: 7;}
#logo .char8{ z-index: 8;}
#logo .char9{ z-index: 9;}
#logo .char10{ z-index: 10;}
#logo .char11{ z-index: 11;}
#logo .char12{ z-index: 12;}




@media screen and (max-width: 768px) {
   
    .container {
         overflow: hidden;
    }
    .elasticwrapper {
        padding-right: 50px;
    }
     .containerLogo {
        margin-top: 4px;
        /*max-width: 320px;*/
        height: 60px;
        
    }
    header hgroup {
        width: 320px;
    }

    .title-wrapper {
       padding: 0px 0px 30px 0px;
    }
  
    #logo {
        -webkit-transform: scale(0.6);
        -moz-transform: scale(0.6);
        -o-transform: scale(0.6);
        /*min-width: 630px;*/
        /*position: relative;
        left: 0px;
        top: -20px;
        height: 110px;
        margin-bottom: -24px!important;*/

        /*text-align: center;*/
        width: 400px;
    }

    .subtitulo {
        margin-top: 20px;
    }
}