/* BASICS */
    body, html {height:100%; margin:0}
    #index{height:100%; overflow-y:scroll}

          .social-ic{
              padding:0;
              border-radius:10px;
              width:auto;
              float:right; margin-left: 10px;
                margin-top: 3px}
          
            .fab.fa-instagram,
            .fab.fa-facebook,
            .far.fa-envelope,
            .fab.fa-youtube{
              font-size:20px;
              color:#0054a6; margin-left:5px}

            .fas.fa-bars{display:none}
          
            .fab.fa-instagram:hover,
            .fab.fa-facebook:hover,
            .far.fa-envelope:hover,
            .fab.fa-youtube:hover{
              color:#00AEEF;transition:1s}

            .fab.fa-whatsapp{
                font-size: 34px;
                color: #fff;
                margin-left: 20px;
                margin-top: 17px}

    a:active {text-decoration:none}
    a{text-decoration:none}
    a img {border:0;}
    li{list-style:none}
    img.escala{width:100%;margin-bottom: -4px}      img.escala2{height:100%;margin-bottom: -4px}

.left20.box-text-3{
    background-color:#ffffff8a;
    height:100%; border-radius: 0 40px 0 0;}

.float-btao {
    background-color: #189d0e;
    box-shadow: 2px 3px 6px 0px #0000004a;
}

.float-btao, .float-btao:hover {
    bottom: 75px;
    right: 50px;
    position: fixed;
    float: right;
    width: 70px;
    height: 70px;
    z-index: 99;
    border-radius: 35px}

        .float-btao:hover {
            background-color:#00ffff;
            box-shadow: 2px 2px 1px 0px #000}

.foot-menu{
    font: 16px 'Raleway', sans-serif;
    text-align: left;
    color: #0000ff;
    position: fixed;
    width: 100%;
    bottom: 0;
    z-index: 99;
    background-color: #ffffffe0;
}

.foot-menu p {margin-left:9%}


.box-home.slide5,.box-home.slide6{}

.logoservicos{width:150px}

.quad p,.quad2 p, .txt p, .box-text-2 p, .box-text-3 p, .box-text-4 p, .txt-tri p{
    font:24px 'Raleway', sans-serif;
    line-height:24px;
    color:#fff;}

.box-text-2 p{
    font:18px 'Raleway', sans-serif;
    line-height:24px;
    color:#0000ff}

.foot-txt p{
    font:16px 'Raleway', sans-serif;
    color:#6D6E71;
    line-height:22px;
    letter-spacing: 0.5px}

.box-text-3 p, .txt-tri p{color:#0000ff}

.left-default.box-text-3 p {
    color:#fff;
    text-transform:uppercase}

p.title, p.title-home {
    font-family:'Raleway', sans-serif;
    font-size: 20px;
    margin: 30px 0 10px 0;
    font-weight: 600}


p.title{color:#005BAA}
p.title-home{color:#0000ff}

p.title-page {
    font-family:'Raleway', sans-serif;
    font-size: 34px; color:#fff;
    font-weight: 600;
    margin: 30px 0 10px 0;
    text-align:left; letter-spacing:1px;
    line-height: 34px;
    text-transform:uppercase;}

span.title2{font-size:38px}
span.title3{font-size:24px}

.txt{
    width:60%;
    margin-top: 200px;
    margin-bottom:-100px;
    float:left;
    position:relative;
    left:16%;
    border-radius:8px;
    padding:20px 4% 0 4%}

.box-dupla{
    position:relative;
    margin-top:92px}
.quad{background-color:#fff}
.quad2{background-color:#24cac1}
.quad, .quad2 {
    width:60%;
    margin-bottom:20px;
    float:left;
    position:relative;
    left:20%;
    border-radius:8px;
    padding:10px 4% 20px 4%}

    .depo-icon{width:20%; float:left; margin-top:30px}
    .radius{overflow:hidden; border-radius:50%}

.txt-depo{width:75%;float:right}


.menu-mobile, .menu-box{display:none}

/* MENU FIXED */

    .foto-perfil, .logo-perfil{
        position:absolute;
        height:200px; width:200px; float:left;
        margin-left:-100px; left:50%;
        background-repeat:no-repeat;
        background-color:transparent;
        background-size:cover;
        border-radius:50%}
    .foto-perfil{background-image:url()}
    .logo-perfil{background-image:url()}
    
    .top100{padding-top:100px}

    .home, .home:hover{
        height:141px; width:190px; float:right;
        margin-top:94px; margin-right:10%;
        background-image:url("imgs/pierre-logo-menu.png");
        background-repeat:no-repeat;
        background-color:transparent;
        background-size:cover}

    .foto-perfil .home{position:fixed; background-position: -50% 0}


    .menu-bar, .menu-index{
        position: fixed;
        _position: absolute;
        _top: expression(body.scrollTop + document.body.clientHeight - 35 + "px");
        height:auto; width:100%;
        margin-top:0; padding:0; top:0;
        float:left;
        display:block;
        z-index:900;
        background-color:#fff}

    .lista, .lista-2{
        position:absolute;
        width: 100%}
    .lista{display:block;}
    .lista-2{display:none}

    .menu-index ul {
        position:relative;
        width:100%;
        list-style-type:none;
        overflow:hidden;
        float:left;
        left:50%;
        background-color:transparent}

    .menu-bar ul {
        position:fixed;
        width:auto;
        list-style-type:none;
        overflow:hidden;
        top:0; float:left;
        margin-top:60px;
        padding:0;
        left:10%;
        background-color:transparent}

    .menu-bar li, .menu-bar li a:hover,
    .menu-index li, .menu-index li a:hover {
        float:left; list-style:none}

    .menu-bar a.bt-on, .menu-bar a.bt-on:hover {
        color:#fff;
        border:1px #fff solid;
        border-radius: 4px;
        background-color:#00AEEF;
        border:1px #00AEEF solid}

    .menu-bar li a, .menu-index li a {
        font:22px 'Raleway', sans-serif;
        letter-spacing:0.5px;
        display: block;
        margin:0 25px 0 25px;
        text-decoration:none}

    .menu-bar li a:hover{color:#00ffff}

    .menu-bar li a, .menu-index li a {
        color:#0000ff}

    .menu-bar a.bt-on, .menu-bar a.bt-on:hover,
    .menu-bar li a, .menu-bar li a:hover{padding: 4px 5px;}


    .card{
        width:29%;
        margin:0;
        padding: 0;
        display: inline-block}

    .card-2{
        width:20%; height:auto;
        margin:0;  padding:0;
        display:table-cell;}

/* MENU */
    .box-2 ul {
        width:auto;
        list-style-type:none;
        overflow:hidden;
        top:0; float:left;
        margin-top: 20px;
        left:0;
        background-color:transparent;
        position: relative; z-index:900;}

    .box-2 li{
        font:20px 'Montserrat', sans-serif; color:#fff;
        letter-spacing:1px;
        text-align: center;
        text-decoration: none;
        background-color:#7d47a9;
        padding: 10px 25px 10px 25px;
        margin-top:0;
        border:0;
        border-radius:4px;}
/* PARALLAX E MOBI */
    
    .height33{height:33%}
    .mobi{display:none}
    .blu{
        font-family: 'Affogato-Regular', sans-serif;
        font-size: 16px;
        color:#fff;
        font-weight: 600;
        background-color:#00AEEF; float:left;
        padding: 20px 35px;
        border-radius:8px;
        margin-top: -48.5px;
        top: 50%;
        position: relative;
    }

    .index{height:100%; background-image: url('imgs/bg-index.jpg')}
    .index2{height:100%; background-image: url('imgs/bg-index2.jpg')}
    .atend{height:auto; background-image: url('imgs/bg-atend.jpg')}

.menu-bar{
	position:fixed;
	_position:absolute;
	_top: expression(body.scrollTop + document.body.clientHeight - 35 + "px");
	height:auto; width:100%;
	margin-top:0; padding:0; top:0;
	float:left;
	display:block;
	z-index:500;
	background-color:transparent;
	background-attachment:fixed;
	background-repeat:repeat}

.logo-hero{display:none}

.logo-menu{
	position:absolute;
    height:52px; width:112px;
    top:10px; left:20px;
    float:left;
    padding:0;
    background-image: url('imgs/soma5-logo-menu.png');
    background-size:cover}

.margintop{ margin-top:72px}

.box-home {
    /*padding-bottom: 30px;*/
    height: auto;
    width: 100%;
    background-color:#fff;
    float: left;
}

.info{margin-top:150px; width:85%; width: 70%; margin-left: 19%}
.info2{
    margin-top:50%; width:80%; padding: 40px 10% 40px 40px; background-color: #ffffffbd;
    border-radius: 40px 0 0 40px}

.info3{
    margin-top:35%; width:80%; padding: 40px 40px 40px 23%; background-color: #ffffffbd;
    border-radius: 0 40px 40px 0}

.box-text{                  float:right; height:auto; width:55%; margin-right:5%}
.box-text-2,.box-text-4{float:left; height:auto}
.box-text-2{                width:40%; margin-left:5%}
.box-text-3{                width:52%; margin-left:20%}
.box-btao{width:auto; margin-left:40px;}
.box-text-4{                width:100%}
.box-text-4 p{              color:#fff}

.left20{ margin-left:0; float:left}
.left{float:left;}
.right20{ margin-right:0; float:right}
.right{ float:right}
.left-default{margin-left:38px}

.box-text li, .box-text li:hover, .box-text-3 li, .box-text-3 li:hover{
	font:20px 'Montserrat', sans-serif;
	padding:15px 20px 15px 20px;
	display:inline-block; letter-spacing:1px;
    transition:0.5s;
    border-radius:4px}

.box-text li, .box-text-3 li{	color:#fff; background-color: #7d47a9;}
.box-text li:hover, .box-text-3 li:hover{color:#7d47a9; background-color:#efdbff; border-radius: 4px;}

.box-img,.box-img-2 {
    height:auto; float:left;
    overflow:hidden}
.box-img{width:30%; margin-left:5%}
.box-img-2 {width:49%; margin-left:0}

/* FOOT */

    .box-foot{
        letter-spacing:1px;
        padding-top:40px; padding-bottom:40px;
        height:auto;
        width:100%;
        background-color:#fff;
        overflow:auto}

    .grey{background-color:#414042;padding-top:20px;padding-bottom:20px;text-align:center}
    .grey p{text-align:center; font:14px phenomenalight, Sans-Serif; color:#fff; letter-spacing:1.2px; margin:0}
    .grey p a{color:#fff}

    .foot-info{
        position: relative;
        margin-left:-140px;
        float:left;
        text-align:center;
        width:280px;
        left:50%}

    img.foot{
        width:150px; height:auto;
        padding:0; float:left;
        left:50%; position:relative; margin: 0 0 20px -75px;}

    .box-foot a{color:#58595b; text-decoration:none; transition: 0.5s;}
    .box-foot a:hover{color:#00AEEF; text-decoration:none;}

    .foot-logo{margin-bottom:10px; padding:0;}

    .foot-txt{
        margin:0; padding:0;
        float:left;
        text-align:left;
        width: 100%;}

    .foot-txt p{
        padding: 0;
        margin: 10px 0 0 0;
        text-align: center;}

    .content-info{
        width:118px;
        position:relative;
        height:auto;
        left:50%;
        margin-left:-48.25px}
/* CONTATO FORM */

	.box-contact {
        position:absolute;
	    height:auto;
	    float:left;
	    text-align:left;
	    display:block;
        top:50%;
        margin-top:-188px;
        width: 40%; margin-left:30%;
	    padding:0; border:0;
        font: 16px 'Affogato-Regular', sans-serif; color:#fff;
        letter-spacing:1px}

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

	.textfield {
        width: 96%;
        border: 0;
        margin-bottom: -10px;
        padding: 2%;
        font: 16px 'Affogato-Regular', sans-serif;
        letter-spacing: 1px;
        color: #fff;
        border-radius: 4px;
        background-color: #fff;}

.slide4{background-image:url("imgs/v1.jpg")}
.slide1{background-image:url("imgs/v2.jpg")}
.slide2{background-image:url("imgs/v3.jpg")}
.slide5{background-image:url("imgs/v4.jpg")}
.slide6{background-image:url("imgs/v5.jpg")}
.slide3{background-image:url("imgs/slide-03.jpg")}

.slide1, .slide2, .slide3,.slide4,.slide5,.slide6,
.cover1, .cover2, .cover3, .cover4{
    background-repeat:no-repeat;
    background-size:cover;
    height:100%;
    float:left;
    overflow:hidden}

.slide2, .slide4, .slide5, .slide6{
    border-top:0; border-bottom:0}

.cover1{background-image:url("imgs/cover1.jpg")}
.cover2{background-image:url("imgs/cover2.jpg")}
.cover3{background-image:url("imgs/cover3.jpg")}
.cover4{background-image:url("imgs/cover4.jpg")}

    p.subtitle{font:16px Affogato-Regular}
    p.subtitle-2{font:14px Affogato-Medium;
        text-transform: uppercase;
        margin-top:0}

	p.botao, input.botao, input.botao:hover {
	    padding: 8px 20px 8px 20px;
	    float:right;
	    right:0; margin-right:0;
	    font:18px 'Raleway', sans-serif;
	    border-radius:4px}

    p.botao, input.botao {border:0; background-color:#fff; color:#00AEEF}
    p.botao:hover, input.botao:hover {border:0; background-color:#0054a6; color:#fff;}

    p.botao:hover{transition:0.5s}

    p.botao{margin-top:20px; top:-18.6px; position:relative; margin-bottom:0}

    .faixa {
        width: 100%;
        float: left}

    .box-icon{
        margin-top:30px; margin-bottom:30px;
        overflow:auto;
        padding:30px 20px 30px 20px;
        background-color:#9a59ce}
    .icon{
        width:30%;
        float: left;
        margin-left:5%}
/* SOCIAL BOX */

    .box-social{
        height:20px; width:auto;
        float:left;
        display:block;
        background-color:transparent}

    .box-social-txt{
        font:16px 'Raleway', sans-serif;
        color:#e2bdff; letter-spacing:1px; padding-top:6px;
        width:auto; float:left}

    .menu-foot{
        font:16px 'Raleway', sans-serif;
        color:#989898; letter-spacing:1px;
        width:100%; float:left}

    .margin10{margin-right:10px}

/* MOBILE */
    @media (max-width: 850px) {

    .foot-menu p{   
        margin-top: 0.5em;
        margin-bottom: 0.5em;}

        .left20.box-text-3{background-color: transparent}

        .box-home.slide5,.box-home.slide6{display:block}
        p.title-home{margin-top:0; margin-bottom:5px}

        .box-text-3 p, .box-text-2 p{
            font-size:14px; letter-spacing:0;
            line-height: 18.5px; margin-bottom:0}

        .box-text-2 p{}

        .slide4{background-image:url("imgs/mobile-v1.jpg")}
        .slide1{background-image:url("imgs/mobile-v2.jpg")}
        .slide2{background-image:url("imgs/mobile-v3.jpg")}

        .slide5{background-image:url("imgs/mobile-v4.jpg")}
        .slide6{background-image:url("imgs/mobile-v5.jpg")}

        .slide4, .slide5, .slide6{}

        span.title2, span.title3{
            font-size:20px;
            letter-spacing:0}

        #home.box-home.slide4 .left20.box-text-3 .info{
            margin-top:60%;
            background-color:#ffffffb3;
            border-radius: 0 40px 40px 0;}

        #objetivo.box-home.slide5 .left20.box-text-3 .info.left{}

        .info, .info2{
            width:86%; margin-top:85%; padding:8%; Background-color:#ffffffb3;
            border-radius: 0 40px 40px 0;
            margin-left:0}

        .info3{
            width:86%; margin-top:60%; padding:8%; Background-color:#ffffffb3;
            border-radius: 0 40px 40px 0;
            margin-left:0
        }

        .fas.fa-bars{
            font-size:24px;
            color:#0000ff; margin-top:24px; margin-left:5%;
            float: left;
            display:block}

        .depo-icon{width:80%; margin-left:10%}
        .txt-depo{width:100%}

        .index2.parallax{height:100%}
        .index2{background-image: url(imgs/index-mobile.jpg)}
        .index{background-image: url(imgs/index-mobile-blur.jpg)}

        .quad p.title,.quad2 p.title, .txt p.title {font-weight: 600}
        .parallax, .parallax-b{height:auto; float:left}
        .content-info{width:100%; float:left; margin-left:-68.44px}
        .box-social{height:40px}
        .fb,.fb:hover, .insta,.insta:hover, .whats,.whats:hover{height:40px; width:40px}
        .youtube,.youtube:hover{height:40px; width:56px}
        .foot-txt p{font-size:18px; margin-top:20px}
        .foot-info {
            margin-left:5%;
            float:left; width:90%; left:0}

        img.foot{width:150px; margin: 0 0 25px -75px}

        /* SIDENAV */
            .home, .home:hover{
                margin-top: 10%;
                margin-right: 0;
                right:5%;
                float: right;
                position: absolute;
                height: 107px;
                width: 144px}

            .menu-bar ul{display:none}

            .menu-box {
                position:absolute;
                width:100%; height:100%;
                display:block;
                background-color:#fff;
                overflow:hidden}
            .menu-mobile{
                float:left;
                width:26px; height:26px;
                display:block;
                margin-top:23px; margin-left:15px;
                background-image:url("imgs/burguer.svg");
                background-repeat:no-repeat;
                background-color:transparent;
                background-size:cover}

            .sidenav{
                height:100%; width:0;
                position:fixed; top:0; left:0;
                overflow-x:hidden;
                transition:0.5s;
                z-index:999}
            .sidenav a{
                text-decoration:none;
                color:#0000ff;
                display:block;
                transition:0.3s}
            .sidenav a:hover{
                color:#fff;
                background-color:#0000ff}

            .sidenav ul {margin-top:50px; margin-right:50px}
            .sidenav a, .sidenav ul a, .sidenav ul a:hover, .offcanvas a:focus{
                font:28px 'Raleway', sans-serif;
                letter-spacing:0.5px; line-height:35px;
                padding:8px 0 8px 32px}
            .sidenav .closebtn, .sidenav .closebtn:hover {
                font:40px 'Raleway', sans-serif;
                position:absolute;
                top:0; right:0; margin-right:10px}
            .sidenav a.bt-on {
                font-weight:500; color:#000;
                border-left:8px solid #00AEEF}

            img.logo{width:130px;height:auto; float:left; margin-left:32px;}

            .compendium-1{width:100%; margin:32px 0 32px 0; float:left}
            .compendium{width:100%; height:auto; float:left}

            .box-text li{font-size:16px; padding:15px 16px 15px 16px;}
            img.escala2{width:100%}
            h1{font-size:48px}
            span.big {font-size:60px}

            .logo-hero{
                position:absolute;
                height:auto; width:180px;
                float:left;
                margin-left:-90px; margin-top:-55px;
                top:50%; left:50%;
                padding:0;
                background-color:transparent;
                display:block;
                z-index:99}

            .mobi{display:block; overflow:hidden}

            .box-2{position:absolute; width:100%}
            .box-text{width:90%; margin-right:5%}
            .box-text-2, .box-text-3{width:100%; margin-left:0}
            .box-text-2, .box-text-3{margin-bottom:20px}
            .box-foot{letter-spacing: 4px}
            .box-img {
                height:auto; width:90%;
                margin-left:5%; margin-bottom:40px}

            .box-img-2 {width:100%}
            .img-large{width:90%; margin-left:5%}

            .box-contact {
                width:90%; height:auto;
                margin-left:5%; float:left;
                text-align:left;
                display:block}

            .sidenav ul{width:200px; margin-right:70px; float:left;}
            .sidenav .closebtn, .sidenav .closebtn:hover {font-size:70px; margin-right:20px}

            .icon{margin-top:30px; width:100%; margin-left:0}
            .right20{margin-right:0}

            .fab.fa-instagram, .fab.fa-facebook, .far.fa-envelope, .fab.fa-youtube{
                font-size:25px}

        }

    @media (min-width:1400px) {
        .txt{width:60%; left:16%}
        .foto-perfil, .logo-perfil{
            height:400px;
            width:400px;
            margin-left:-200px}

        }