/*-----------------------------------------------------------
  Responsive 
-------------------------------------------------------------*/

/*1201px e acima —  telas muito grandes, TVs*/

@media screen and (max-width: 1680px) {
    body, input, select, textarea {font-size: 11pt;}
    .col-mobile {width: 25%;min-height: 1px;padding-right: 15px;padding-left: 15px;}
    h4{font-size: 8px !important;text-align: left;position: absolute;top: 12px;left: 13px;bottom: 0px;margin: 0 auto;}
}

/*----------------------------------------------------------------------------------------------------------
BREAKING POINT Nº1 (1023max - 1024min)  
------------------------------------------------------------------------------------------------------------*/
/* 0px to ---> 1023px max */
@media all and (max-width:1023px) {
    .menubar {border-right: 0;height: 80px;top: 0;width: 100%;}
    .menubar.off-screen {height: 100vh;}
    .menubar #logo {float: left;margin-top: 0;margin-left: 20px;}
    .menubar .menu-button {display: block;margin-right: 20px}
    .menubar.off-screen .menu-button {margin-right: 0}
    .content.mar-left-250 {margin-left: 0;}
}
/*-----------------------------------------------------------
1024px min to ---> ∞
-------------------------------------------------------------*/
@media all and (min-width:1024px) {
    .menubar .flexnav.sidebar.flexnav-show {border-right: 1px solid rgba(102, 102, 102, 0.1);left: 0;}
}


/*----------------------------------------------------------------------------------------------------------
BREAKING POINT Nº2  (800max - 801min) - 769px — 1024px: telas pequenas, laptops
------------------------------------------------------------------------------------------------------------*/

/* 0px to ---> 800px max */
@media all and (max-width: 800px) {
    .flexnav.flexnav-show {
        background-color: whitesmoke;
       /* height: 180px;
        opacity: 0.9;
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out
    }*/

/*novas modificacoes logo abaixo*/

/*width: 100%;*/
z-index: 1;
line-height: 50px;
top: 0px;
padding-top: 150px;

height: 100vh;
       
        position: absolute;
    right: 0px;
    margin-left: auto;
    margin-right: auto;
       /* opacity: 0.9;*/
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
}

    .flexnav.standard li a {
    font-size: 2.0rem;
    color: #000;
    text-align: center;
    text-transform: uppercase;
    padding-left: 15px;
   /* padding-top: 15px;*/
    display: block;
    z-index: 2;
    -webkit-transition: all 0.1s ease-in-out;
    -moz-transition: all 0.1s ease-in-out;
    -o-transition: all 0.1s ease-in-out;
    -ms-transition: all 0.1s ease-in-out;
    transition: all 0.1s ease-in-out;
    font-size: 3.0rem;
    line-height: normal;
}

    .flexnav li a {
    /*background: #fff;*/
    /*color: #fff;*/
    text-align: left;
    text-transform: uppercase;
    padding: 5px 0;
    display: block;
    z-index: 2;

}

    .icon-social{display: inline-flex!important;width: 35px;fill-rule: evenodd;fill:#000000!important;/*position: absolute!important;top: 0;*/}
    .facebook{margin-bottom: 10px;}
    .instagram{margin-bottom: 10px;}
    .umporextenso{margin-bottom: 10px;}

    h3  {font-size: 1.1em !important;/*text-align: left !important;*/}
     #header .header-wrapper #logo{
        padding-left: 25px;
        min-height: 81px !important;
        height: 81px !important;
        width: 185px !important;
        position: relative !important;
        /*float: clear !important;*/
        padding-top: 0px !important;
        z-index: 3 !important;
        border: none !important;

     }
    #header .header-wrapper #logo .logo-text h3{
        font-size: 1.5rem!important;
        line-height: 23px;
        margin-left: -1px;
    }
    .menu-button {z-index: 3;}
    .menubar .flexnav.flexnav-show {padding: 0 40px;}
    .menubar.off-screen {border-right: 0;border-bottom: 1px solid rgba(102, 102, 102, 0.1);height: 80px;padding: 0 20px;width: 100%;}
    .menubar.off-screen #logo {bottom: 0;top: 0;transform: rotate(0deg);}
    .menubar.off-screen .menu-button {float: right;}
    .content {margin-left: 0;}
    .fixed-img {background-attachment: unset;}
    .portfolio-text h3 span {display: none;}


    .relation-works{
        display: none;
    }

    /*.fixed-img-bio {margin-bottom: -500px;}*/
    .row-text h2{font-size: 1.3rem;font-weight: 700;}
}


/*-----------------------------------------------------------
801px min to ---> ∞
-------------------------------------------------------------*/

@media all and (min-width:801px) {

    nav {position: relative;float: right;right: 0;width: auto;top: 0px;}
    .flexnav.standard {display: block;float: right;position: relative;width: auto;}
    .flexnav.standard .touch-button {background: transparent none repeat scroll 0 0;}
    .flexnav.standard .touch-button .navicon {display: none;}
    .flexnav.standard,.flexnav.standard li {overflow: visible}
    .flexnav.standard.opacity {opacity: 1}
    .flexnav.standard li {
        background: transparent none repeat scroll 0 0;
        margin-left: 15px;
        position: relative;
        list-style: none;
        float: left;
        display: block;
        
    }

    .flexnav.standard>li {line-height: 30px;}

    .flexnav.standard li a {
        background: transparent none repeat scroll 0 0;
        position: relative;
        border-bottom: none;
        border-left: medium none;
        font-weight: 400;
        line-height: 1.6;
        font-family: 'Comfortaa', sans-serif;
        color: #2c2c2c;
        font-size: 14px;
        text-transform: uppercase;
        -webkit-transition: all 0.1s ease-in-out;
        -moz-transition: all 0.1s ease-in-out;
        -o-transition: all 0.1s ease-in-out;
        -ms-transition: all 0.1s ease-in-out;
        transition: all 0.1s ease-in-out;
    }

    /*alternative button atribuites - seletor ">" seleciona todos elementos que sejam filhos de outro elemento.L*/
    .flexnav.standard>li>a {color: whitesmoke;}
    .flexnav.standard li a.active,.flexnav.standard li:hover a {/*color: #2c2c2c;*/ opacity: 1.0;}

   /* burtton border animation*/
    .flexnav.standard li a::after {
        content: '';
        position: absolute;
        bottom: 15px;
        left: 0;
        width: 100%;
        height: 1px;
        z-index: 0;
      /*  background: rgba(0, 0, 0, 1);*/
      background: whitesmoke;
        transform: scaleX(0);
        transform-origin: right;
        transition: transform .2s ease-out, opacity .2s ease-out 0.3s;
    }

    .flexnav.standard li:hover a::after,
    .flexnav.standard li a.active::after {transform: scaleX(1);transform-origin: left;}

    .flexnav.standard li ul {
        -webkit-transition: all 0.2s ease-in-out;
        -moz-transition: all 0.2s ease-in-out;
        -o-transition: all 0.2s ease-in-out;
        -ms-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out;
        -webkit-transform: translate3d(0px, 20px, 0px);
        -moz-transform: translate3d(0px, 20px, 0px);
        -o-transform: translate3d(0px, 20px, 0px);
        -ms-transform: translate3d(0px, 20px, 0px);
        transform: translate3d(0px, 20px, 0px);
        display: block!important;
        min-width: 175px;
        opacity: 0;
        padding-top: 20px;
        visibility: hidden;
        background: #fff;
        border: 1px solid #f5f5f5;
    }

    .flexnav.standard.dark li ul {background: #222;border: none;}

    .flexnav.standard li ul.flexnav-show {
        -webkit-transform: translate3d(0px, 0px, 0px);
        -moz-transform: translate3d(0px, 0px, 0px);
        -o-transform: translate3d(0px, 0px, 0px);
        -ms-transform: translate3d(0px, 0px, 0px);
        transform: translate3d(0px, 0px, 0px);
        opacity: 1;
        visibility: visible;
    }

    .flexnav.standard>li>ul {left: -20px;}
    .flexnav.standard li>ul li {margin-left: 0;}
    .flexnav.standard li ul li a::after {content: none;}
    .flexnav.standard li ul li a {
        padding: 0 20px 10px;
        font-weight: 400;
        font-size: 12px;
        text-transform: uppercase;
        color: #787878!important;
        -webkit-transition: all 0.05s ease-in-out;
        -moz-transition: all 0.05s ease-in-out;
        -o-transition: all 0.05s ease-in-out;
        -ms-transition: all 0.05s ease-in-out;
        transition: all 0.05s ease-in-out;
        cursor: pointer;
    }

    .flexnav.standard.dark li ul li a {color: #f5f5f5!important;}
    .flexnav.standard li ul li a.active,
    .flexnav.standard li ul li a:hover {color: #2c2c2c!important;}
    .flexnav.standard.dark li ul li a.active,
    .flexnav.standard.dark li ul li a:hover {color: #ccc!important;}
    .flexnav.standard li>ul {position: absolute;top: auto;left: -20px}
    .flexnav.standard li ul li>ul,
    .flexnav.standard li ul.open ul.open {margin-left: 100%;left: 0;top: -20px;}
    .flexnav.standard li>ul li {width: 100%}
    .flexnav.standard li ul.open {display: block;opacity: 1;visibility: visible;z-index: 1}
    .flexnav.standard li ul.open li {overflow: visible;max-height: 100px}
    .menu-button {display: none}
    .menu-button.off-canvas,
    .menu-button.sidebar {display: block;position: absolute;right: 0;}
    .flexnav.off-canvas {right: 50px;transform: scaleY(0);transform-origin: top;transition: transform .2s ease-out, opacity .2s ease-out 0.3s;}
    .flexnav.off-canvas.flexnav-show {transform: scaleY(1);transform-origin: bottom;}
    .flexnav.sidebar {background-color: #FFF;height: 100vh;overflow: auto;padding: 100px 30px 0 30px;position: fixed;right: -300px;width: 250px;top: 0;transition: all .3s ease-out;}
    .flexnav.sidebar.flexnav-show {right: 0;z-index: -1}
    .menubar.off-screen .flexnav.sidebar {left: -300px;}
    .menubar.off-screen .flexnav.sidebar.flexnav-show {left: 60px;}
    .flexnav.sidebar li ul li a {padding-top: 10px;padding-bottom: 10px;}
    .flexnav.sidebar>li>a {font-size: 16px;}
    .flexnav.sidebar li a.active {color: #2c2c2c;}
}



/*----------------------------------------------------------------------------------------------------------
BREAKING POINT Nº3  (767max - 800min)
------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width: 736px) {

        h2 {font-size: 1em;}
        h3 {font-size: 1.1em !important;
          text-align: left !important;
          /*left: 50px;
          margin-top: 15px!important;
          position: absolute;;*/

          font-weight: bolder!important;}
        h4 {font-size: 0.8em;}
        h5 {font-size: 0.7em;}
        h6 {font-size: 0.7em;}
    }

    @media screen and (max-width: 720px) {
  
 .fixed-img {
    background-image: url("../img/imageBio1.jpg");
    height: 500px;
    background-attachment: fixed;
    background-position: left;
    background-repeat: no-repeat;
    background-size: bottom;
}
  }


/*supertelas*/
@media (min-width:1540px) {.container { width: 1152px; }
/*Antes: 1444px*/
}