/* ==========================================================================
HTML5 Boilerplate styles - h5bp.com (generated via initializr.com)
========================================================================== */

html, button, input, select, textarea {
    color: #222;
}

body {
    font-size: 1em;
    line-height: 1.4;
}

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

img {
    vertical-align: middle;
}

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

textarea {
    resize: vertical;
}

.chromeframe {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}


/*Fonte*/

.icoSeta{
    color: #015eab;
}


/* ==========================================================================
Author's custom styles
========================================================================== */

article, nav, aside, footer {}

    * {
        margin: 0 auto;
        padding: 0 auto
    }

    ul {
        padding: 0
    }

    li {
        list-style: none
    }

    a {
        text-decoration: none
    }

    p {
        font-family: calibri;
        font-size: 18px;
        line-height: 23px;
    }

    body {}

        .clear {
            clear: both;
        }

        .bg {
            background: url('../img/bg.jpg') center top no-repeat #5a9fda;
            height: auto;
        }

        section {
            width: 1050px;
            position: relative;
        }

        header img {
            margin: 40px 0px 0px 30px
        }

        header {
            clear: both;
        }

        nav {
            margin: 180px 45px 0px 0px;
            float: left;
            position: relative;
            z-index: 9999
        }

        nav ul li {
            font-weight: bold !important;
            width: 260px;
            height: 30px;
            margin: 5px 0px;
            background-image: url('../img/hover_menu.jpg');
            border-radius: 30px;
            padding: 6px 20px;
            box-shadow: 0px 2px 6px #555;
            behavior: url(PIE.htc);
        }

        nav ul li {
            font: 20px calibri;
            color: #fff;
        }

        nav ul li:hover {
            background-color: #0055a0;
            background-image: none;
            cursor: pointer;
            box-shadow: 2px 0px 6px #333;
            -webkit-transition: all .3s;
            -moz-transition: all .3s;
            -ms-transition: all .3s;
            -o-transition: all .3s;
            transition: all .3s;
        }


        /*.home #pack{width: 640px;
        height: 273px;
        margin: 60px 0px 0px 0px;
        float: right;}*/

        .home #pack {
            width: 530px;
            height: 273px;
            margin: 90px 0px 0px 0px;
            float: right;
        }

        #pack li {
            float: left;
            -webkit-transition: all .5s;
            -moz-transition: all .5s;
            -ms-transition: all .5s;
            -o-transition: all .5s;
            transition: all .5s;
        }

        .pack1 {
            margin: 0px
        }

        .pack2 {
            margin: -40px -10px 0px -70px !important;
            position: relative;
            z-index: 9
        }

        .pack3 {
            margin: 25px -10px 0px -55px !important
        }

        .pack1:hover {
            margin: -10px 0px 0px 0px
        }

        .pack2:hover {
            margin: -50px -10px 0px -70px !important;
        }

        .pack3:hover {
            margin: 15px -10px 0px -55px !important
        }

        #pack li:hover {
            -webkit-transition: all .5s;
            -moz-transition: all .5s;
            -ms-transition: all .5s;
            -o-transition: all .5s;
            transition: all .5s;
        }


        /*.home h1{color: #fff;
        float: right;
        margin: 34px 0px -30px 0px;
        font-weight: 100;
        font-size: 22px;}*/

        .home h1 {
            color: #fff;
            float: right;
            margin: 99px 100px -30px 0px;
            font-weight: 100;
            font-size: 22px;
        }

        aside {
            width: 950px;
            padding: 30px 0px;
            clear: both;
            height: 160px;
            margin-left: 177px;
        }

        aside ul li {
            float: left;
        }

        aside ul li:hover {
            cursor: pointer;
        }

        aside ul li h2 {
            color: #fff;
            text-align: center;
            font-weight: 100;
            font-size: 21px;
            margin: 8px 0px;
        }

        .farmacia li:first-child {
            width: 93px;
            height: 104px;
            padding: 20px;
            background-color: #00335d;
            background-image: none;
            margin-right: 5px;
            margin-top: -10px;
            margin-left: 20px;
        }

        .farmacia li {
            width: 205px;
            height: 68px;
            padding: 38px 0px;
            background-image: url('../img/bg_destaque.jpg');
            box-shadow: 0px 0px 15px #222;
            margin-top: -10px;
        }

        .conheca {
            float: left;
            margin: -10px 0px 0px 0px;
            z-index: 9;
            position: relative;
        }

        .farmacia {
            margin: -20px 0px 0px 0px;
        }

        .conheca li:first-child {
            background-color: #0082d0;
            margin-right: 5px;
            padding: 30px 30px;
            width: 70px;
        }

        .conheca li {
            box-shadow: 0px 0px 15px #222;
            width: 190px;
            padding: 20px 0px;
            background-color: #00a6e0;
        }

        .farmacia:hover li:first-child, .conheca:hover li:first-child {
            background-color: #fff;
            background-image: none;
            -webkit-transition: all .3s;
            -moz-transition: all .3s;
            -ms-transition: all .3s;
            -o-transition: all .3s;
            transition: all .3s;
        }


        /*  produtos  */


        /*.menup{width: 380px;
        height: 23px;
        float: right;
        margin: 40px 50px 5px 0px;
        border-radius: 35px;
        padding: 10px 20px;
        box-shadow: 0px 2px 6px #555;
        background-image: url('../img/bg_menu_p.jpg');
        background-position: center;}*/

        .menup {
            width: 220px;
            height: 23px;
            float: right;
            margin: 40px 120px 5px 0px;
            border-radius: 35px;
            padding: 10px 20px;
            box-shadow: 0px 2px 6px #555;
            background-color: #0055a0;
        }

        .menup li {
            float: left
        }

        .menup li a {
            color: #fff;
            font-size: 18px;
            padding: 0px 18px;
            border-left: solid 1px;
        }

        .menup li:first-child a {
            border: none;
            padding: 0px 19px;
        }

        .imgprod {
            float: right;
            margin: 40px 10px 0px 0px;
            position: relative;
            z-index: 9
        }

        .cont_prod {
            background-image: url('../img/branco.png');
            border-radius: 20px;
            behavior: url(PIE.htc);
            width: 910px;
            height: auto;
            clear: both;
            padding: 20px 30px 60px 30px;
            margin: -80px 0px 40px 0px;
            float: left;
            color: #015eab
        }

        .cont_prod div {
            width: 48%;
            float: right;
        }

        .cont_prod div:first-child {
            float: left
        }

        .cont_prod p {
            width: 100%;
            text-align: justify;
            margin: 20px 0px 0px 0px;
        }

        .cont_prod h1 {
            margin: 10px 0px 0px 0px
        }

        .cont_prod h2 {
            float: left;
            margin: 5px 0px 0px 0px;
            padding: 25px 0px 0px 0px;
            border-top: solid 1px #abd7f8;
            width: 100%;
            font-size: 28px;
        }

        .cont_prod h3 {
            font-size: 13px;
            float: left;
            margin: 40px 0px 0px 0px;
            text-transform: uppercase;
        }

        .icon {
            width: 47px;
            height: 47px;
            float: left;
            margin: 0px 4px 0px 0px;
            background-image: url('../img/icons.png');
        }

        .iconcenter {
            margin-top: 10px;
        }

        .itens {
            width: 100%;
            float: left;
            margin: 0;
        }

        .itens li {
            float: left;
            width: 49%;
            height: 75px;
            margin: 22px 0px 0px 0px;
            font-weight: bold;
        }

        .itens li p {
            font-size: 12px;
            margin: 0px 0px 0px 47px;
            float: left;
            font-weight: 100;
            line-height: 16px;
        }

        .tubo {
            background-position: 0px 0px
        }

        .unissex {
            background-position: -47px 0px
        }

        .anatomico {
            background-position: -94px 0px
        }

        .canais {
            background-position: -235px 0px
        }

        .vitamina {
            background-position: -141px 0px
        }

        .vitaminae {
            background-position: -565px 0px
        }

        .testado {
            background-position: -282px 0px
        }

        .gel {
            background-position: -188px 0px
        }

        .tuni {
            background-position: -468px 0px;
        }

        .tuni2 {
            background-position: -514px 0px;
        }

        .tm {
            background-position: -329px 0px
        }

        .tg {
            background-position: -376px 0px
        }

        .tu {
            background-position: -423px 0px;
            margin: -3px 0px 0px 0px;
        }

        .itens2 {
            margin: 50px 0px 0px 0px
        }

        .center {
            margin: -19px 0px 0px 137px !important;
        }

        .tu2 {
            margin-top: -19px !important
        }

        .tu2 span {
            margin-top: -14px
        }

        .fralda {
            background-image: url('../img/fralda.png');
            background-position: center bottom;
            background-repeat: no-repeat;
            width: 100% !important;
            height: 400px;
            margin: 65px 0px -75px 0px;
            position: relative;
        }

        .absorvente {
            background-image: url('../img/absorvente.png');
            background-position: center bottom;
            background-repeat: no-repeat;
            width: 480px !important;
            height: 369px;
            margin: 15px 0px -75px 0px;
            position: relative;
        }

        .roupa {
            background-image: url('../img/roupa.png');
            background-position: center bottom;
            background-repeat: no-repeat;
            width: 480px !important;
            height: 369px;
            margin: 15px 0px -75px 0px;
            position: relative;
        }

        .fralda span, .absorvente span, .roupa span {
            color: #fff;
            font-size: 27px;
            font-weight: 100;
            border: solid 4px #71b0df;
            background-color: #005dab;
            border-radius: 27px;
            padding: 0px 11px;
            behavior: url(PIE.htc);
            z-index: 9
        }

        .fralda1, .fralda2, .fralda3, .fralda4, .fralda5, .fralda6 {
            position: absolute;
            cursor: pointer;
            z-index: 8
        }

        .fralda .fralda1 {
            top: 65px;
            left: 77px;
        }

        .fralda .fralda2 {
            top: 88px;
            left: 160px;
        }

        .fralda .fralda3 {
            top: 126px;
            left: 232px;
        }

        .fralda .fralda4 {
            top: 226px;
            left: 196px;
        }

        .fralda .fralda5 {
            top: 207px;
            left: 127px;
        }

        .fralda .img_fralda1 {
            top: 37px;
            left: -62px;
        }

        .fralda .img_fralda2 {
            top: -40px;
            left: 136px;
        }

        .fralda .img_fralda3 {
            top: 115px;
            left: 261px;
        }

        .fralda .img_fralda4 {
            top: 229px;
            left: -40px;
        }

        .fralda .img_fralda5 {
            top: 254px;
            left: 206px;
        }

        .img_fralda1, .img_fralda2, .img_fralda3, .img_fralda4, .img_fralda5, .img_fralda6 {
            position: absolute;
            display: none
        }

        .absorvente .fralda1 {
            top: 97px;
            left: 290px;
        }

        .absorvente .fralda2 {
            top: 197px;
            left: 244px;
        }

        .absorvente .fralda3 {
            top: 236px;
            left: 339px;
        }

        .absorvente .img_fralda1 {
            top: 8px;
            left: 115px;
        }

        .absorvente .img_fralda2 {
            top: 115px;
            left: 35px;
        }

        .absorvente .img_fralda3 {
            top: 252px;
            left: 341px;
        }

        .roupa .fralda1 {
            top: 89px;
            left: 177px;
        }

        .roupa .fralda2 {
            top: 88px;
            left: 365px;
        }

        .roupa .fralda3 {
            top: 182px;
            left: 239px;
        }

        .roupa .fralda4 {
            top: 243px;
            left: 264px;
        }

        .roupa .fralda5 {
            top: 173px;
            left: 349px;
        }

        .roupa .fralda6 {
            top: 238px;
            left: 326px;
        }

        .roupa .img_fralda1 {
            top: 7px;
            left: 50px;
        }

        .roupa .img_fralda2 {
            top: 14px;
            left: 251px;
        }

        .roupa .img_fralda3 {
            top: 181px;
            left: -42px;
        }

        .roupa .img_fralda4 {
            top: 131px;
            left: 382px;
        }

        .roupa .img_fralda5 {
            top: 265px;
            left: -25px;
        }

        .roupa .img_fralda6 {
            top: 256px;
            left: 307px;
        }

        .produto {
            position: relative;
        }

        .fp {
            z-index: 99;
            border: solid 2px #fff;
            margin: 182px 2px -291px 29px;
            position: relative;
        }

        .fp:hover {
            cursor: pointer;
            border: solid 2px #D02F27;
        }

        #swf {
            position: absolute;
            width: 100%
        }


        /* INCONTINENCIA */

        .incontinencia {
            height: 410px;
            position: relative;
        }

        .incontinencia p {
            color: #fff;
            font-size: 18px;
            margin: 170px 0px 0px 0px;
            float: left;
            width: 500px;
        }

        .incontinencia h1 {
            color: #fff;
            font-weight: 100;
            font-size: 21px;
            border-bottom: solid 1px #98c6e9;
            float: left;
            margin: 100px 0px 20px 0px;
            padding: 0px 0px 10px 0px;
            width: 600px;
        }

        .incontinencia h2 {
            color: #0055a0;
            float: left;
            width: 437px;
            font-size: 36px;
            font-weight: 200;
            margin: 5px 0px 0px 0px;
        }

        .incontinencia img {
            float: right;
            margin: -66px 105px 0px -185px
        }

        .cont_incontinencia {
            background-image: url('../img/branco.png');
            border-radius: 20px;
            behavior: url(PIE.htc);
            width: 910px;
            height: auto;
            clear: both;
            padding: 20px 30px 60px 30px;
            margin: 0px 0px 40px 0px;
            float: left;
            color: #015eab
        }

        .menui {
            width: 380px;
            height: 24px;
            float: right;
            margin: 40px 50px 5px 0px;
            border-radius: 35px;
            padding: 10px 20px;
            box-shadow: 0px 2px 6px #555;
            background-image: url('../img/bg_menu_i.jpg');
            background-position: center;
        }

        .menui li {
            float: left
        }

        .menui li a {
            color: #fff;
            font-size: 16px;
            padding: 0px 10px;
            border-left: solid 1px;
        }

        .menui li:first-child a {
            border: none
        }

        .active {
            color: #A9DBF2 !important
        }


        /* rodapé */

        footer {
            width: 100%;
            background-color: #0154A0;
            height: 100px;
            margin-top: 50px;
            float: left;
        }

        footer div {
            width: 990px
        }

        footer div ul {
            float: left;
            margin: 45px 50px 0px 0px;
        }

        footer div ul li {
            float: left;
            font-size: 12px;
            padding: 0px 8px;
        }

        footer div ul a {
            float: left;
            cursor: pointer;
        }

        footer div ul li {
            color: #fff
        }

        footer div ul li:hover {
            color: #999
        }

        footer img {
            float: right;
            padding: 35px 0px 0px 20px
        }


        /* FARMACIA POPULAR */

        .farpopular h1 {
            color: #0055a0;
            float: left;
            width: 437px;
            font-size: 36px;
            font-weight: 200;
            margin: 135px 0px 0px 150px;
        }

        .farpopular img {
            margin: 16px 55px 0px 153px;
        }


        /* mitos */

        .mitos div {
            clear: both;
            float: left;
            margin-bottom: 20px;
            width: 100%
        }

        .mitos div ul li h2 {
            background-color: #015eab;
            color: #fff;
            border-radius: 5px
        }

        .ul-dica {
            background-color: #fff;
            padding: 20px;
            width: 25%;
            float: left;
            margin: 0px 17px;
            text-align: center;
            border-radius: 10px;
            min-height: 300px;
            -webkit-transition: all .25s;
            -moz-transition: all .25s;
            -ms-transition: all .25s;
            -o-transition: all .25s;
            transition: all .25s;
        }

        .ul-dica:hover {
            cursor: pointer;
            background: #5EA3D7;
            color: #fff;
            -webkit-transition: all .25s;
            -moz-transition: all .25s;
            -ms-transition: all .25s;
            -o-transition: all .25s;
            transition: all .25s;
        }

        .resposta {
            display: none
        }

        .pergunta {
            font-weight: bold;
        }

        .resposta {
            font-style: italic;
        }

        .ul-dica li img {
            margin: 0px;
            float: none
        }


        /* FALE CONOSCO */

        .faleconosco h1 {
            color: #fff;
            float: left;
            margin: 170px 0px -15px 0px;
            font-weight: 100;
            font-size: 30px;
        }

        .faleconosco p {
            float: left;
            width: 350px;
            margin-left: 80px;
            color: #0154A0;
            margin-top: 160px;
        }

        form {
            float: left;
            width: 630px;
            font: 18px calibri;
            color: #0154A0;
            margin-bottom: 50px;
        }

        form input {
            padding: 10px 15px 5px 10px;
            border: none;
            margin: 0px 0px 5px 0px;
            border-radius: 5px
        }

        #nome, #email {
            width: 94%
        }

        #telefone {
            width: 83%
        }

        #ddd, #uf, #estado {
            width: 5%
        }

        #ddd, #endereco, #cidade {
            float: left;
            margin: 0px 10px 0px 0px;
        }

        #endereco, #cidade {
            width: 38%
        }

        #mensagem {
            width: 92%;
            resize: none;
            border-radius: 5px;
            padding: 20px;
            border: none;
        }

        #ftel {
            margin-left: 20px
        }

        #lcid {
            margin: 0px 219px 0px 203px;
        }

        #img_captcha_contato {
            float: left;
            margin-right: 50px;
        }

        form button {
            width: 150px;
            background: transparent;
            background-color: #0154A0;
            color: #fff;
            border: none;
            border-radius: 20px;
            padding: 7px 6px;
        }

        form button:hover {
            background-color: #fff;
            color: #0154A0;
        }

        form p {
            float: right !important;
            width: 195px !important;
        }

        .btneco, .btnnor {
            float: left;
            font-size: 12px;
            background-color: #fde900;
            padding: 6px 20px;
            text-align: center;
            position: absolute;
            width: 250px !important;
            right: 133px;
            top: 745px;
            border-radius: 20px;
            cursor: pointer;
        }

        .btnnor {
            display: none
        }

        .feco, .ieco {
            display: none
        }


        /* termos */

        .termos h1 {
            color: #fff;
            float: left;
            width: 537px;
            font-size: 36px;
            font-weight: 200;
            margin: 57px 0px 0px 0px;
        }

        .termos p {
            float: left;
            color: #0055a0;
            width: 630px;
        }

        .as ul {
            float: left;
            color: #0154A0;
        }

        .as ul, .as h1, .as p {
            margin-left: 100px
        }

        .as a {
            font-weight: bold;
            color: #0154A0;
        }


        /* ==========================================================================
        Media Queries
        ========================================================================== */

        @media only screen and (min-width: 35em) {}

            @media print, (-o-min-device-pixel-ratio: 5/4), (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi) {}


                /* ==========================================================================
                Helper classes
                ========================================================================== */

                .ir {
                    background-color: transparent;
                    border: 0;
                    overflow: hidden;
                    *text-indent: -9999px;
                }

                .ir:before {
                    content: "";
                    display: block;
                    width: 0;
                    height: 150%;
                }

                .hidden {
                    display: none !important;
                    visibility: hidden;
                }

                .visuallyhidden {
                    border: 0;
                    clip: rect(0 0 0 0);
                    height: 1px;
                    margin: -1px;
                    overflow: hidden;
                    padding: 0;
                    position: absolute;
                    width: 1px;
                }

                .visuallyhidden.focusable:active, .visuallyhidden.focusable:focus {
                    clip: auto;
                    height: auto;
                    margin: 0;
                    overflow: visible;
                    position: static;
                    width: auto;
                }

                .invisible {
                    visibility: hidden;
                }

                .clearfix:before, .clearfix:after {
                    content: " ";
                    display: table;
                }

                .clearfix:after {
                    clear: both;
                }

                .clearfix {
                    *zoom: 1;
                }


                /* ==========================================================================
                Print styles
                ========================================================================== */

                @media print {
                    * {
                        background: transparent !important;
                        color: #000 !important;
                        /* Black prints faster: h5bp.com/s */
                        box-shadow: none !important;
                        text-shadow: none !important;
                    }
                    a, a:visited {
                        text-decoration: underline;
                    }
                    a[href]:after {
                        content: " (" attr(href) ")";
                    }
                    abbr[title]:after {
                        content: " (" attr(title) ")";
                    }
                    /*
                    * Don't show links for images, or javascript/internal links
                    */
                    .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after {
                        content: "";
                    }
                    pre, blockquote {
                        border: 1px solid #999;
                        page-break-inside: avoid;
                    }
                    thead {
                        display: table-header-group;
                        /* h5bp.com/t */
                    }
                    tr, img {
                        page-break-inside: avoid;
                    }
                    img {
                        max-width: 100% !important;
                    }
                    @page {
                        margin: 0.5cm;
                    }
                    p, h2, h3 {
                        orphans: 3;
                        widows: 3;
                    }
                    h2, h3 {
                        page-break-after: avoid;
                    }
                }