* { 
        font-family: 'Roboto', sans-serif!important;
     }

    *:focus{
        outline:none;
    }
     html {
       scroll-behavior: smooth;
       overflow-y: scroll;
     }

    body { 

        /*PALETA*/

--verde-sogimig:#7DC9D2;

--laranja-sogimig:#F36B3C;

--cinza-sogimig:#747474;

--lilas:#D5A8D2;

--azul:#AFDFF0;

--verde:#D9ECC4;

--laranja:#FFD2C5;


        /*ESTILO*/

margin:0;

padding:0;

}

.ancoras {
    width: 100%;
    height: 1px;
    display: block;
    position: absolute;
    z-index: 99999999999999999999;
    visibility: hidden;
    /* background: red; */
    /* height: 30px; */
}

div#omanifesto {
    top: 0;
}

div#nosmedicos {
    top: 3500px;
}

div#sogimig {
    top: 4240px;
}
 #intro {
     position: absolute;
     top: 0;
     right: 0;
     left: 0;
     bottom: 0;
     width: 100%;
     height: 100%;
     background-color: var(--laranja-sogimig);
     background-image: url(../img/bgmanifesto.png);
}
 .btn {
     position: absolute;
     bottom: 10px;
     right: 10px;
}
 .intro-text-wrapper {
     position: absolute;
     top: 0;
     right: 0;
     bottom: 0;
     left: 0;
     text-align: center;
}
 .intro-text-wrapper p {
     color: #fff;
     margin: 0;
     font-size: 2em;
     position: absolute;
     display: inline-block;
     left: 0;
     right: 0;
     top: 50%;
     transform: translateY(-50%);
     color: rgba(0, 0, 0, 0);
     style: preserve-3d;
}
 .intro-text-wrapper span {
     display: inline-block;
     color: rgba(0, 0, 0, 0);
     transform-style: preserve-3d;
     transform: translate3d(0, 0, 0);
}
 .intro-text-wrapper.animation p {
     animation: OpeningSequence 7s linear forwards;
}
 .intro-text-wrapper.animation p:nth-child(2) {
     animation-delay: 6s;
}
 .intro-text-wrapper.animation p:nth-child(3) {
     animation-delay: 12s;
}
 .intro-text-wrapper.animation p:nth-child(4) {
     animation-delay: 18s;
}
 .intro-text-wrapper.animation p:nth-child(5) {
     animation-delay: 24s;
}
 .intro-text-wrapper.animation p:nth-child(6) {
     animation-delay: 30s;
}
 @keyframes OpeningSequence {
     0% {
         text-shadow: 0 0 50px #fff;
         opacity: 0.2;
    }
     30% {
         text-shadow: 0 0 1px #fff;
         opacity: 1;
    }
     85% {
         text-shadow: 0 0 0 #fff;
         opacity: 1;
    }
     100% {
         text-shadow: 0 0 30px #fff;
         opacity: 0;
         pointer-events: none;
    }
}
 .replay {
     cursor: pointer;
}




    .barrinhas {
        margin-top: 3px;
        height: 6px;
    }

    .laranja { 
        background-color:var(--laranja);
     }
    .azul { 
        background-color:var(--azul);
     }

    .lilas { 
        background-color:var(--lilas);
     }

    .verde { 
        background-color:var(--verde);
     }

     header .container {
        padding: 15px 0px 15px 0px;
    }


    nav li {
        list-style: none;
        display: inline-block;
        margin: 0px 14px;
        text-align: center;
    }

    header {
        display: table;
        position: relative;
        box-shadow: 0px 10px 20px #00000014;
        /* height: 12vh; */
        background: #fff;
        transition: all 300ms;
        width: 100%;
        z-index: 100;
    }

    header nav {
        margin-top: 30px;
    }

    .hashtag {
        padding-top: 15px;
    }

    header span {
        margin-top: 13px;
        display: block;
    }

    header.affix {
            width: 100%;
            transition: all 300ms;
            top: 0;
            z-index: 100;
        }

    footer {
        background-color: var(--laranja-sogimig);
        padding: 30px 0px;
        color: #fff;
    }

    footer .row {
        margin-top: 30px;
    }

    nav a {
        color: var(--cinza-sogimig)!important;
        font-weight: 400;
        font-size: 15px;
        text-align: center;
        transition: all 300ms;
    }

    nav a::after {
            display: block;
            content: attr(espaco);
            height: 0;
            overflow: hidden;
            visibility: hidden;
            font-weight: bold;
            text-align: center;
    }

    nav a:hover {
        text-decoration: none;
        font-weight: bold;
        transition: all 300ms;
    }

    #menu-principal li.active a {
        font-weight: bold;
        text-decoration: none;
    }


    .compartilhe {
        width: 55px;
        padding: 20px 10px;
        list-style: none;
        border-radius: 40px;
        box-shadow: 0px 2px 10px #0000002b;
        right: 30px;
        position: fixed;
        top: 190px;
        z-index: 99999999999999999;
        background: #fff;
    }

    .compartilhe li {
        margin-top: 10px;
        position: relative;
        height: 40px;
        width: 35px;
    }

    .compartilhe span {
        transform: rotate(90deg)!important;
        display: block;
        margin: 60px 0px 32px -45px;
        text-align: left!important;
        width: 130px;
        color: var(--verde-sogimig);
        font-weight: bold;
        font-size: 16px;
    }

    .compartilhe img:hover {
        width: 110%;
        height: auto;
        transition: all 500ms;
        position: absolute;
        /* margin: -5px 0px 0px -5px; */
    }

    .compartilhe img {
        transition: all 200ms;
    }


    section#manifesto {
        padding: 110px 0px;
        height: 100vh;
        background-image: url(../img/bgmanifesto.png);
        background-color: var(--laranja-sogimig);
        background-position: 0px -370px;
        transition: all 100ms;
    }

    
    #manifesto h2, #manifesto h3 {
        color: #fff;
    }

    #manifesto h2 {
        font-weight: bold;
    }

    .compensa.affix-top {
    height: 113px;
    position: absolute;
    transition: all 300ms;
}

.compensa.affix {
    position: relative!important;
    height: 113px;
    width: 100%;
    display: block;
    transition: all 300ms;
    background: red;
}


section#movimento {
    padding: 110px 0px;
    height: 100vh;
}

#movimento .texto {
    text-align: right;
    margin-top: 80px;
}

#movimento .col-md-8 img {
    margin: 0 auto;
    display: block;
}

#movimento .texto h2 {
    color: #fff;
    font-weight: bold;
}

#movimento .texto h3 {
    color: #fff;
    font-weight: 100;
}

#movimento .texto h2, #movimento .texto h3 {
    font-size: 30px!important;
}

header h1 {
    font-size: 0;
    margin: 0;
}


#cta h2 {
    background: #fff;
    padding: 40px;
    border-radius: 60px;
    text-align: center;
    font-weight: bold;
    color: var(--verde-sogimig);
    width: 80%;
    margin: 0 auto;
    margin-bottom: 60px;
    margin-top: -60px;
}

#cta .col-md-4 h3 {
    color: var(--laranja-sogimig);
    font-weight: bold;
}

#cta .col-md-4 p {
    font-size: 16px;
    line-height: 25px;
    color: var(--cinza-sogimig);
    text-align: justify;
    margin-top: 30px;
}

.cta {
    background-color: #ffffff;
    padding: 30px 150px;
    text-align: center;
    border-radius: 20px;
    width: 70%;
    margin: 0 auto;
    margin-top: 70px;
    margin-bottom: 60px;
}

#cta .cta h3 {
    color: #52b7c3;
    font-weight: bold;
    margin: 0;
}

section#downloads {
    background-image: url(../img/bgdownloads.svg);
    /* height: 1000px; */
    padding: 360px 0px;
    background-repeat: no-repeat;
    background-position: top center;
    background-size: 100% auto;
    z-index: 9;
    margin-top: -240px;
    display: block;
    position: relative;
    margin-bottom: -130px;
}

section#downloads h2 {
    text-align: center;
    font-weight: bold;
    color: var(--verde-sogimig);
    font-size: 40px;
    width: 50%;
    margin: 0 auto;
    margin-bottom: 40px;
}

#downloads .col-md-4 a {
    text-align: center!important;
    color: #585858;
    transition: all 300ms;
    display: block;
}

#downloads .col-md-4 a h3 {
    font-weight: bold;
}

#downloads .col-md-4 a img {
    width: 100%;
}

#downloads .col-md-4 a:hover, #downloads .col-md-4 button:hover {
    text-decoration: none;
    transform: translateY(-10px);
    display: block;
    transition: all 300ms;
}


section#cartilha {
    margin-top: 90px;
}
section#sociais h2 {
    text-align: center;
    color: var(--verde-sogimig);
    font-weight: bold;
    margin: 0;
}

section#sociais {
    padding: 80px 0px;
}

section#sociais ul {
    list-style: none;
    margin: 0 auto;
    padding: 0;
    width: 511px;
    margin-top: 40px;
}

section#sociais ul li {
    display: inline-block;
}

section#video {
    margin: 100px 0px;
}

.container.fluid2 {
    background: var(--azul);
    padding: 70px;
    border-radius: 50px;
    width: 70%;
}

#video span {
    font-size: 24px;
    text-align: center;
    display: block;
    width: 440px;
    /* float: right; */
    margin: 0 auto;
    margin-top: 110px;
}


#asogimig p {
    font-size: 18px;
}

#asogimig {
    margin: 140px 0px 60px 0px;
}

section#historia {
    background-image: url(../img/bgazul.svg);
    background-repeat: no-repeat;
    background-position: top center;
    padding: 250px 0px 300px 0px;
}

#historia h2 {
    font-size: 40px;
    font-weight: bold;
    color: #fff;
}

#historia p {
    color: #fff;
    font-size: 24px;
    margin-bottom: 50px;
    font-weight: 100;
}

#historia h3 {
    color: #fff;
    font-weight: bold;
    font-size: 30px;
}

p.caption {
    text-align: center;
    font-size: 16px!important;
    margin-top: 10px;
}

p.fundadores {
    font-size: 18px!important;
}


.balao {
    box-shadow: 0px 3px 6px #00000036;
    padding: 30px;
    border-radius: 20px;
    position: relative;
}

.balao img {
    position: absolute;
}

.esquerda .balao img {
    right: -49px;
}


.direita .balao img {transform: scaleX(-1);left: -48px;}


.centro img {
    margin: 0 auto;
    display: block;
}


#timeline h2 {
    text-align: center;
    font-weight: bold;
    font-size: 50px;
    color: var(--laranja-sogimig);
    margin-bottom: 80px;
    margin-top: 0;
}

.balao h3 {
    font-weight: bold;
    color: var(--cinza-sogimig);
}


.esquerda .balao.um {
    margin-top: 115px;
}

.esquerda .balao.dois {
    margin-top: 520px;
}

.esquerda .balao.tres {
    margin-top: 425px;
}

.direita .balao.um {
    margin-top: 510px;
}

.direita .balao.dois {
    margin-top: 425px;
}

.direita .balao.tres {
    margin-top: 470px;
}

section#timeline {
    margin-bottom: 120px;
}


section#apoio {
    background: #f7f7f7;
}

section#apoio div img {
    width: 100%;
}

section#apoio {
    background: #f7f7f7;
    text-align: center;
    padding: 60px 0px 90px 0px;
}

section#apoio div img {
    width: 100%;
}

section#apoio h2 {
    font-weight: bold;
    font-size: 50px;
}


#apoio .col-md-3 {
    margin-top: 30px;
}

footer li {
    list-style: none;
    display: inline;
}

footer {
    text-align: center;
}

footer a {
    color: #fff;
}

footer a:hover {
    opacity: 0.6;
    text-decoration: none;
}

        .carousel-fade .item {
            transition-property: opacity;
        }
        
        .carousel-fade .item,
        .carousel-fade .active.left,
        .carousel-fade .active.right {
            opacity: 0;
        }

       .carousel-fade  .active,
        .carousel-fade .next.left,
       .carousel-fade  .prev.right {
            opacity: 1;
        }

       .carousel-fade .next,
        .carousel-fade .prev,
        .carousel-fade .active.left,
        .carousel-fade .active.right {
            left: 0;
            transform: translate3d(0, 0, 0);
        }
    

   .carousel-fade  .carousel-control {
        z-index: 2;
    }



html, 
body, 
.carousel, 
.carousel-inner, 
.carousel-inner .item {
    height: 100%;
}

section#movimento.dois {
    border-color: var(--verde);
}

section#movimento.um {
    border-color: var(--azul);
}

section#movimento.tres {
    border-color: var(--lilas);
}

section#movimento.quatro {
    border-color: #f5d2c9;
}


section#cta {z-index: 11;width: 100%;margin-top: -390px;position: absolute;}

#movimentos.affix {
    position: relative;
    background-color: var(--azul);
    transition: all 500ms;
    padding-bottom: 300px;
}


.quatro .texto h2, .quatro .texto h3, .dois .texto h2, .dois .texto h3 {
    color: #6E6E6E!important;
}
button.pular {
    position: absolute;
    bottom: 80px;
    background: transparent;
    border: 4px solid #fff;
    padding: 15px 110px 15px 60px;
    width: 300px;
    margin-left: -150px;
    left: 50%;
    color: #fff;
    font-weight: bold;
    font-family: "Roboto", sans-serif;
    font-size: 16px;
    background-image: url(../img/seta.svg);
    background-position: 200px 18px;
    background-repeat: no-repeat;
    transition: all 300ms;
}


button.pular:hover {
    background-position: 210px 18px;
    transition: all 300ms;
}

.navbar-toggle.ativo .segunda {
    opacity: 0;
    transition: all 300ms;
}

.navbar-toggle.ativo .primeira {
    transform: rotate(-45deg);
    margin-top: 30px;
    transition: all 300ms;
}

.navbar-toggle.ativo .terceira {
    transform: rotate(45deg);
    margin-top: -12px;
    transition: all 300ms;
}

.navbar-toggle span {
    transition: all 300ms;
}

.navbar-toggle.ativo span {
    background: var(--laranja-sogimig);
}



#downloads button {
    background: transparent;
    border: none;
    transition: all 300ms;
}

#downloads button:hover {
    cursor: pointer;
}

#downloads button img {
    width: 100%;
}




section#materiais, section#compartilhar {
    background: white;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99;
    width: 100%;
    padding-top: 220px;
    height: 100%;
    overflow: auto;
    box-shadow: 10px 0px 30px #00000026;
    text-align: center;
}


section#materiais a, section#compartilhar a {
    color: var(--laranja-sogimig);
}

section#materiais h2, section#compartilhar h2 {
    margin-top: 60px;
    font-weight: bold;
}

#materiais img {
    margin-bottom: 30px;
  
}

section#compartilhar img {
    margin-bottom: 30px;
    width: 100%;
}
div#movimento {
    top: 1040px;
}


#cartilha h2 {
    font-weight: bolder;
    font-size: 60px;
    color: #69b2bb;
    margin-top: 80px;
}

#cartilha span {
    font-weight: bold;
    font-size: 19px;
    margin-bottom: 30px;
    display: block;
    max-width: 550px;
}

#cartilha p {
    max-width: 300px;
    font-weight: 400;
    font-size: 16px;
    margin-bottom: 30px;
}

#cartilha a {background: var(--laranja-sogimig);padding: 20px 40px;border-radius: 40px;color: #fff;font-weight: bold;font-size: 20px;margin-top: 30px;display: table;}
header.hidden-md.hidden-lg.hidden-xg {
    height: 12vh;
}

@media (max-width:768px) {
div#sogimig {
    top: 4490px;
}

        div#movimento {
    top: 690px;
}
            .compartilhe {
                right:inherit;
                bottom: 10px;
                width: 90vw;
                display: block;
                margin-left: -45vw;
                left: 50%;
                top: inherit;
                padding: 0px;
            }   

            .compartilhe span {
                transform: initial!important;
                /* margin: initial!important; */
                width: initial!important;
                margin: 10px 0px 0px 32px;
                float: left;
                display: block;
            }

            .compartilhe li {
                float: left;
                width: 25px;
                height: 30px;
                margin-left: 10px;
            }

            .compartilhe li img {
                width: 100%;
            }

            .navbar-toggle .icon-bar {
                background: var(--verde-sogimig);
                height: 4px;
                width: 36px;
                border-radius: 10px;
            }

            .navbar-toggle {
                padding: 0;
                margin: 0;
            }

            header .col-xs-4 img {
                width: 100%;
            }

              #slide-navbar-collapse {
        position: fixed;
        top: 0;
        left: 0;
        z-index: 99;
        width: 100%;
        padding-top: 100px;
        height: 100%;
        background-color: #fff;
        overflow: auto;
        box-shadow: 10px 0px 30px #00000026;
      }
      .menu-overlay {
        display: none;
        background-color: #000;
        bottom: 0;
        left: 0;
        opacity: 0.5;
        filter: alpha(opacity=50);
        /* IE7 & 8 */
        position: fixed;
        right: 0;
        top: 0;
        z-index: 49;
      }


      section#manifesto {
        padding: 20px 20px 0px 20px;
        background-color: var(--laranja-sogimig)!important;
    }

    section#manifesto h3 {
        font-size: 16px;
        line-height: 20px;
        margin: 8px 0px;
    }

    section#manifesto h2 {
        font-size: 23px;
    }


    #manifesto h3 strong {
        font-size: 19px;
        line-height: 25px;
    }

    header {position:fixed;}

    main#movimentos {
        padding-top: 65px;
    }

    header hashtag img {margin-top: 30px!important;}

    header .hashtag img {
        margin-top: 13px;
    }

    header .logo img {
        width: 70%;
        margin: 0 auto;
        margin-top: 20px;
        display: block;
    }

    button.navbar-toggle.collapsed {
        margin-top: 17px;
        margin-right: 20px;
    }

    .navbar-nav>li>a {
        font-size: 30px;
        font-family: "Roboto", sans-serif;
        font-weight: 100;
        color: var(--verde-sogimig)!important;
    }

    .navbar-nav>li>a.active {
        font-weight: bold;
    }

    .nav>li {
        margin: 20px 0px;
    }


    .rodape {
        text-align: center;
    }

    .rodape a {
        color: var(--laranja-sogimig);
        font-weight: 400;
        line-height: 30px;
    }

    .socialz {
        list-style: none;
        display: table;
        margin: 0 auto;
        margin-top: 20px;
        width: 240px;
    }

    .socialz li {
        display: inline;
    }

    .col-md-4.col-xs-12.movimento_texto .texto {
        text-align: center!important;
    }

    .col-md-8.col-xs-12.movimento_grafismo {
        opacity: 0.1;
        position: absolute;
        z-index: 1;
    }

    #movimento .row {
        position: relative;
    }

    .col-md-8.col-xs-12.movimento_grafismo img {
        text-align: center;
        width: 100%;
        margin-top: 140px!important;
    }

    .col-md-4.col-xs-12.movimento_texto {
        position: absolute;
        z-index: 10;
    }

    section#movimento {
        padding: 0;
    }

    .um .col-md-8.col-xs-12.movimento_grafismo img {
        margin-top: 30px!important;
    }

    #cta h2 {
        font-size: 20px;
        border-radius: 60px;
    }

    section#cta {
        text-align: center!important;
    }


    .cta {
        width: 90%;
        padding: 16px;
        margin-top: 170px;
    }

    .cta h3 {
        font-size: 5vw;
        line-height: 6vw;
    }

    section#downloads {
        background-size: auto 100%;
        height: auto;
        background-position-y: -130px;
        padding-top: 130px;
        margin-bottom: initial!important;
        padding-bottom: 220px;
    }

    section#downloads h2 {
        font-size: 7vw;
        width: 90%;
    }

    #downloads .col-md-4.col-xs-12 {
        margin-bottom: 70px;
    }


    #video .container.fluid2 {
        width: 100%;
        border-radius: 0;
        padding: 0px;
        text-align: center!important;
        padding-bottom: 70px;
        padding-top: 50px;
    }

    #video {
        margin-top: -270px!important;
    }

    #video span {
        text-align: center;
        width: 90%;
        margin: 0 auto;
        padding: 0;
        display: block;
        float: none;
        margin-top: 60px;
        margin-bottom: 60px;
        font-size: 17px;
    }

    #video iframe {
        width: 100%;
        max-height: 220px;
    }

    #asogimig p {
        text-align: center;
        font-size: 15px;
    }

    section#asogimig {
        margin-top: 0px;
    }

    #asogimig img {
        width: 230px;
        margin-top: 40px!important;
    }

    section#historia {
        background-size: auto 120%;
        padding: 90px 20px 30px 20px;
        background-position-y: -120px;
        text-align: center;
        margin-bottom: 100px;
    }

    #historia h2 {
        font-size: 32px;
    }

    #historia p {
        font-size: 16px;
        margin-bottom: 30px;
    }

    #historia img {
        width: 100%;
    }

    p.fundadores {
        font-size: 15px!important;
    }



    .esquerda .balao img {
        width: 30px;
        right: -30px;
    }

    .esquerda .balao.um {
        margin-top: 126px;
    }


    .esquerda .balao.dois {
        margin-top: 59px;
    }

    .esquerda .balao.tres {
        margin-top: 3px;
    }

    .esquerda .balao.quatro {
        margin-top: 90px;
    }

    .esquerda .balao.cinco {
        margin-top: 44px;
    }

    .esquerda .balao.seis {
        margin-top: 200px;
    }

    #timeline2 h2 {
        font-size: 50px;
        font-weight: bold;
        color: var(--laranja-sogimig);
        margin-bottom: -70px;
    }

    section#apoio {
        margin-top: 61px;
        padding-top: 30px;
    }

    section#apoio img {
    }

#movimento .texto {
    margin-top: 50px;
}

.balao {
    padding: 2vw 7vw;
}
section#compartilhar {
    padding-top: 60px;
}

section#compartilhar h2 {
    font-size: 19px;
    width: 90%;
    margin: 0 auto;
    margin-top: 50px;
    margin-bottom: 40px;
}

#cartilha img {
    width: 100%;
}

section#cartilha {
    margin-top: -220px;
    text-align: center!important;
    margin-bottom: 350px;
}

#cartilha p {
    max-width: unset;
}

#cartilha span {
    max-width: unset;
}

#cartilha a {
    margin: 0 auto;
}

#cartilha h2 {
    margin-top: 10px;
}

}

@media (min-width: 960px) and (max-width:1400px) { 
section#manifesto {height: 650px;background-position: 0px -670px;padding-top: 20px;padding-bottom: 0px;}

div#omovimento {
}

#movimento .col-md-8 img {
    height: 550px;
}

#movimento .texto {
    margin-top: 0;
}

section#downloads {
    padding-top: 130px;
}

.container.fluid2 {
    width: 90%;
}

.container.fluid2 .col-md-6 {
    /* width: 100%; */
}

.container.fluid2 .container {
    width: 100%;
}

#video iframe {
    width: 100%;
}

section#video {
    margin-top: 0;
}

div#movimento {
    top: 810px;
}

div#nosmedicos {
    top: 2970px;
}

div#sogimig {
    top: 3520px;
}
}

.col-md-2.col-xs-6 {
    margin-bottom: 30px;
}