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


@media only screen and (min-width: 992px) {
	/****Ipad Landscape 1024 Container 970 ****/
	
	.service-list{ margin-bottom:30px;}
	.c-logo-part ul li{ margin:0 15px;}
	.main-nav{ display:block !important; }
	

	.main-nav li a {
    	margin: 35px 20px;
    } 

    .row.me-row {
	    margin-top: 8%;
	}

	#services .sub-title {
	    margin: 0px 0 135px 0;
	}
	
}	
   
@media only screen and (min-width: 768px) and (max-width: 991px) {
	/****Ipad Portrait 768 Container 750 ****/
	body{ font-size:13px;}
	p{ line-height:20px ;}
	.header h1{ font-size:46px;}
	.main-nav ul li a{ padding:14px;}
	.small-logo{ padding:0 20px;}
	h2{ font-size:30px}
	h6{ font-size:16px;}
	h3{ font-size:15px;}
	.service-list{ margin-bottom:20px; font-size:15px;}
	.featured-work p.padding-b{ padding-bottom:15px;}
	.main-section{ padding:70px 0;}
	.c-logo-part ul li{ margin:0 1%; float:left; width:18%;}
	.c-logo-part ul li a{ display:block;}
	.c-logo-part ul li a img{ display:block;}
	.contact-info-box{ margin:0 ;}
	.social-link{ margin:0;}
	
	.main-nav{ display:block !important; }
	.main-nav li a{ 
		padding:0;
		margin: 35px 15px;
	}
	/*.portfolioContainer{ width:750px; margin:0px auto !important; }
	.Portfolio-box{ height:250px;}*/

	.logo {
	    top: 20vh;
	}

	.main-nav{
		margin: 0 -25px;
	}
	
	.thumbnail-perfil {
	    max-width: 50%;
	    margin: 0 auto 45px;
	}

	.me-text, .me-text span {
	    text-align: center;
	    max-width: 95%;
	    margin: auto;
	}

	.me-text span p {
	    line-height: 32px;
	}

	.me-row {
	    margin-top: 60px;
	}

	.business-talking {
	    padding: 50px 0 1px;
	}

	.business-talking h2 {
	    line-height: 45px;
	}

	#services .sub-title {
	    margin: 0px 0 105px 0;
	}

	.what-i-do .col-xs-12.col-lg-3.col-md-6 {
	    margin-bottom: 55px;
	}

	.service-text {
	    margin: 20px auto 0;
	    max-width: 80%;
	}

	.portfolio-col {
	    width: 100%;
	    align-items: center;
	}

	.portfolio-row, .portfolio-col {
	    display: block;
	}

	.portfolio-content {
	    padding-left: 0;
	    margin: 40px 40px 0;
	    text-align: center;
	}

	.contact-me {
	    width: 50%;
	    float: left;
	}

	.social-link {
	    margin: 0;
	    float: left;
	    padding: 0 70px;
	}

	.form-contact {
	    margin-top: 65px;
	}

	.portfolio-text {
	    line-height: 25px;
	}

	.text-item {
	    margin-bottom: 35px;
	    padding-right: 20px;
	}

	.project-detail img {
	    margin-bottom: 15px;
	}
	 
	.container.project-page {
	    padding: 0 30px;
	}

	.project-detail {
	    margin: 75px auto;
	}

	.side-menu {
	    position: fixed;
	    background: #fff;
	    bottom: 0;
	    height: 50px;
	    width: 100%;
	    border-top: 1px solid #ddd;
	    justify-content: space-between;
	    display: flex;
	}

	.side-menu a {
	     position: static; 
	    display: flex;
	    height: 36px;
	    width: auto;
	    font-size: 24px;
	     margin: 2px 13%;

	}

	.side-menu a div {
    	display: none;
	}

	.header .logo img {
	    max-width: 33%;
	    margin-top: 0;
	}

	h3 {
	    font-size: 18px;
	}

	.logo-clients >div {
	    height: 120px;
	    text-align: center;
	}

	.logo-clients >div img.hub,
	.logo-clients >div img.resultado  {
	    max-width: 150px;
	}

	#clients h2 {
	    margin-bottom: 45px;
	}

	#contact h2 {
	    margin-bottom: 0;
	}

	.social-link {
	    margin: 0;
	    float: none;
	    padding: 20px 70px;
	    text-align: center;
	}
	
}

@media only screen and (max-width: 767px) {
	/****Mobile Landscape 480 Container 100% ****/
	body{ font-size:12px;}
	h2{ font-size:26px;}
	h3{ font-size:14px;}
	h6{ font-size:16px; margin-bottom:40px;}
	p{ line-height:18px;}
	.service-list{ font-size:12px; margin-bottom:20px;}
	.we-create li{ font-size:13px; padding:0 0 0 8px}
	.header h1{ font-size:28px;}
	.header{ padding:60px 0;}
	.main-section{ padding:60px 0 70px;}
	.main-nav{ display:none; position:absolute; left:0; width:100%; top:74px; margin:0 auto; flote : none; background:#fff;}
	.main-nav li{ display:block; float:none;}

	.main-nav li a {
	    font-size: 20px;
	    margin: 20px 15px;
	    line-height: 34px;
	}

	.main-nav li.small-logo{ display:none;}
	.main-nav li a{ display:block; padding:7px 32px; border-bottom:none;}
	.main-nav li a:hover{color:#1AB7B3}
	.team-leader-box{ max-width:307px; width:auto; float:none; margin:0 auto;	}
	.team-leader-box:nth-of-type(3n){ margin:0 auto}
	.res-nav_click{ display:block;}
	.featured-work{ font-size:12px; margin-top:30px;}
	.featured-box{ font-size:12px;}
	.featured-box p{ line-height:18px; }
	.c-logo-part ul a{ margin-bottom:5px;}
	.main-section.team{ padding:60px 0 50px;}
	.business-talking h2{ font-size:36px;}
	.contact-info-box{ margin:0 0 12px 30px; font-size:12px;}
	.contact-info-box span{ line-height:18px;}
	.social-link{ margin-left:30px;} 
	.copyright{ font-size:12px;}
	.business-talking a{ padding:10px 25px; font-size:14px;}
	.main-section.contact{ padding:60px 0 70px}
	.client-part-haead{ font-size:20px; line-height:30px;}
	.link{ font-size:14px; padding:10px 25px;}
	.logo{ width:100px;}
	.main-section.contact{ background-size:contain;}
	.Portfolio-nav li a{ padding:5px 16px;}
	.Portfolio-nav li{ display:block;}
	/*.isotope-item img{ width:300px; left:50%; margin-left:-100px;}
	.isotope-item{ width:300px; margin:0px auto;}
	.isotope{ width:400px; margin:0px auto;}
	.Portfolio-box{}
	.portfolioContainer{ width:350px; margin:0px auto !important; } */

	/****Mobile Portrait 320 ****/
	.contact-info-box{ margin-left:0px;}
	.social-link{ margin-left:0px;}
	.c-logo-part ul li{ display:block;}
	.Portfolio-box{  max-width:300px !important; width:96.4% !important; margin:0 !important}
	.Portfolio-box img { max-width:100%;}
	.portfolioContainer{ width:280px !important; margin:0 auto !important } 

	.portfolio-col {
	    width: 100%;
	}

	.portfolio-row, .portfolio-col {
	    display: block;
	}

	.logo {
	    width: 100%;
	    top: 33vh;
	}

	.down-arrow {
	    bottom: 65px;
	    top: auto;
	}

	.thumbnail-perfil {
	    width: 75%;
	    margin: 0 auto 25px;
	}

	.me-text, .me-text span {
	    display: flex;
	    align-items: center;
	    font-size: 14px;
	    text-align: center;
	}

	.row.me-row {
	    margin-top: 50px;
	}

	.business-talking h2 {
	    font-size: 22px;
	    margin-bottom: 52px;
	    line-height: 28px;
	}

	.business-talking {
	    padding: 32px 0 1px;
	}

	#services .sub-title {
	    margin: 0px 0 55px 0;
	}

	.service-text {
	    width: 80%;
	    margin: 20px auto 55px;
	}

	.logo-clients {
	    margin: auto;
	}

	.logo-clients >div {
	    height: 48px;
	    width: 50%;
	}

	.logo-clients >div img.votorantim-logo {
	    max-width: 125%;
	}

	.ctc-logo {
	    width: auto;
	    margin-top: -19px;
	}

	.logo-clients >div img.cosan-logo {
	    max-width: 63%;
	}

	img.crefisa-logo {
	    margin-right: -16px;
	}

	h6 {
	    margin-bottom: 60px;
	}

	.portfolio-content {
	    padding: 35px 20px 0;
	    text-align: center;
	}

	.portfolio-title {
	    display: block;
	    font-size: 22px;
	    margin-bottom: 12px;
	}

	.portfolio-text {
	    font-size: 14px;
	    margin-bottom: 30px;
	}

	.portfolio-subtitle {
	    font-size: 13px;
	}
	
	.owl-carousel {
	    padding: 0 15px;
	}

	a.btn-app {
	    width: 175px;
	    margin-left: 0;
	    margin-top: 25px;
	}

	.contact-info-box h3 {
	    float: none;
	    margin-bottom: 0;
	}

	.contact-info-box span {
	    font-size: 16px;
	    margin-top: 5px;
	}

	.res-nav_click {
	    font-size: 28px;
	    color: #d4d4d4;
	    width: 48px;
	    float: right;
	    height: 48px;
	    margin: 17px 0 0px;
	}

	.res-nav_click:hover, .res-nav_click:active, .res-nav_click:focus {
	    color: #451782 !important;
	}

	.main-nav {
	        height: 100vh;
    width: 100vw;
    position: fixed;
    /* left: -90px; */
    padding-top: 20px;
    top: 60px;
    z-index: 999;
	}

	.main-nav li a {
	    padding: 22px 32px;
	    border-bottom: none;
	    font-size: 24px;
	}

	.main-nav li a:hover {
	    color: #1AB7B3;
	}

	ul.main-nav.active {
	    display: block !important;
	}

	section#who-am-i {
	    margin-top: -50px;
	}

	.small-logo.mobile {
	    width: 100px;
	    margin: 7px auto;
	    float: left;
	}

	.mobile-img{
		display: block;
		margin-top: 25%;
	}

	.larger-img{
		display: none;
	}

	.logo {
	    top: 17vh;
	}

	.text-item {
	    padding-right: 0;
	}

	.container.project-page {
	    margin-top: 60px;
	    padding: 0 30px;
	}

	.project-page h1 {
	    margin-bottom: 50px;
	    font-size: 30px;
	}

	.project-detail {
	    margin: 65px auto;
	}

	.project-detail img {
	    margin-bottom: 15px;
	}

	.side-menu {
	    position: fixed;
	    background: #fff;
	    bottom: 0;
	    height: 50px;
	    width: 100%;
	    border-top: 1px solid #ddd;
	    justify-content: space-between;
	    display: flex;
	}

	.side-menu a {
	     position: static; 
	    display: flex;
	    height: 36px;
	    width: auto;
	    font-size: 24px;
	     margin: 2px 13%;

	}

	.side-menu a div {
    	display: none;
	}

	.form {
	    max-width: 100%;
	    margin: auto;
	}

	.logo-clients >div {
	    height: 48px;
	    width: 100%;
	    margin-bottom: 60px;
	    text-align: center;
	    /* max-width: 300px; */
	}

	.logo-clients >div:last-child{
		margin-bottom: 0;
	}

	.logo-clients >div img.hub ,
	.logo-clients >div img.resultados{
	    max-width: 150px;
	}

	.service-icon img {
	    width: 30%;
	}

	.main-nav li a {
	    font-size: 20px;
	}

	.small-logo.mobile {
	    width: 100px;
	    margin: 1px auto;
	    display: block;
	}

	.res-nav_click:hover, .res-nav_click:active, .res-nav_click:focus {
	    color: #13a0a0 !important;
	}

	.header .logo img {
	    max-width: 55%;
	    margin: 0 auto;
	    margin-top: 0;
	}

	.banner-title {
	    font-family: 'Open Sans';
	    font-size: 1.4em;
	    color: #fff;
	    margin: 45px auto 195px;
	    opacity: 0.8;
	    font-weight: 100;
	}

	.service-text {
	    width: 80%;
	    margin: 20px auto 35px;
	}

	.small-logo img {
	    width: 100px;
	    margin: 7px 0;
	}

	.main-nav li.mobile-only{
		display: block;
	}

	.main-nav li.hide-on-mobile{
		display: none;
	}
	
	
}

@media only screen and (max-width: 479px) {
	/****Mobile Portrait 320 ****/
	.contact-info-box{ margin-left:0px;}
	.social-link{ margin-left:0px;}
	.c-logo-part ul li{ display:block;}
	.Portfolio-box{  max-width:300px !important; width:96.4% !important; margin:0 !important}
	.Portfolio-box img { max-width:100%;}
	.portfolioContainer{ width:280px !important; margin:0 auto !important } 

	.portfolio-col {
	    width: 100%;
	}

	.portfolio-row, .portfolio-col {
	    display: block;
	}

	.logo {
	    width: 100%;
	    top: 33vh;
	}

	.down-arrow {
	    bottom: 65px;
	    top: auto;
	}

	.thumbnail-perfil {
	    width: 75%;
	    margin: 0 auto 25px;
	}

	.me-text, .me-text span {
	    display: flex;
	    align-items: center;
	    font-size: 14px;
	    text-align: center;
	}

	.row.me-row {
	    margin-top: 50px;
	}

	.business-talking h2 {
	    font-size: 22px;
	    margin-bottom: 52px;
	    line-height: 28px;
	}

	.business-talking {
	    padding: 32px 0 1px;
	}

	#services .sub-title {
	    margin: 0px 0 55px 0;
	}

	.service-text {
	    width: 80%;
	    margin: 20px auto 55px;
	}

	.logo-clients {
	    margin: auto;
	}

	.logo-clients >div {
	    height: 48px;
	    width: 50%;
	}

	.logo-clients >div img.votorantim-logo {
	    max-width: 125%;
	}

	.ctc-logo {
	    width: auto;
	    margin-top: -19px;
	}

	.logo-clients >div img.cosan-logo {
	    max-width: 63%;
	}

	img.crefisa-logo {
	    margin-right: -16px;
	}

	h6 {
	    margin-bottom: 60px;
	}

	.portfolio-content {
	    padding: 35px 20px 0;
	    text-align: center;
	}

	.portfolio-title {
	    display: block;
	    font-size: 22px;
	    margin-bottom: 12px;
	}

	.portfolio-text {
	    font-size: 14px;
	    margin-bottom: 30px;
	}

	.portfolio-subtitle {
	    font-size: 13px;
	}
	
	.owl-carousel {
	    padding: 0 15px;
	}

	a.btn-app {
	    width: 135px;
	    margin-left: 0;
	    margin-top: 25px;
	}

	.contact-info-box h3 {
	    float: none;
	    margin-bottom: 0;
	}

	.contact-info-box span {
	    font-size: 16px;
	    margin-top: 5px;
	}

	.res-nav_click {
	    font-size: 28px;
	    color: #d4d4d4;
	    width: 48px;
	    float: left;
	    height: 48px;
	    margin: 17px 0 0px;
	}

	.res-nav_click:hover, .res-nav_click:active, .res-nav_click:focus {
	    color: #451782 !important;
	}

	.main-nav {
	    height: 100vh;
	    width: 100%;
	    padding-top: 20px;
	    top: 60px;
	    z-index: 999;
	}

	.main-nav li a {
	    padding: 22px 32px;
	    border-bottom: none;
	    font-size: 24px;
	}

	.main-nav li a:hover {
	    color: #1AB7B3;
	}

	ul.main-nav.active {
	    display: block !important;
	}

	section#who-am-i {
	    margin-top: -50px;
	}

	.small-logo.mobile {
	    display: block;
	    width: 33px;
	    margin: 11px auto;
	    padding: 0;
	}

	.mobile-img{
		display: block;;
	}

	.larger-img{
		display: none;
	}

	.logo {
	    top: 17vh;
	}

	.text-item {
	    padding-right: 0;
	}

	.container.project-page {
	    margin-top: 60px;
	    padding: 0 30px;
	}

	.project-page h1 {
	    margin-bottom: 50px;
	    font-size: 24px;
	}

	.project-detail {
	    margin: 65px auto;
	}

	.project-detail img {
	    margin-bottom: 15px;
	}

	.side-menu {
	    position: fixed;
	    background: #fff;
	    bottom: 0;
	    height: 50px;
	    width: 100%;
	    border-top: 1px solid #ddd;
	    justify-content: space-between;
	    display: flex;
	}

	.side-menu a {
	     position: static; 
	    display: flex;
	    height: 36px;
	    width: auto;
	    font-size: 24px;
	     margin: 2px 13%;

	}

	.side-menu a div {
    	display: none;
	}

	.btn-primary {
	    min-width: 135px;
	    height: 40px;
	    padding: 10px 20px;
	}

	.form {
	    max-width: 100%;
	    margin: auto;
	}

	.logo-clients >div {
	    height: 48px;
	    width: 100%;
	    margin-bottom: 60px;
	    text-align: center;
	    /* max-width: 300px; */
	}

	.logo-clients >div:last-child{
		margin-bottom: 0;
	}

	.logo-clients >div img.hub ,
	.logo-clients >div img.resultados{
	    max-width: 150px;
	}

	.service-icon img {
	    width: 30%;
	}

	.main-nav li a {
	    font-size: 16px;
	    margin: 0 15px;
	    line-height: 34px;
	}

	.small-logo.mobile {
	    width: 55px;
	    margin: 1px auto;
	}

	.res-nav_click:hover, .res-nav_click:active, .res-nav_click:focus {
	    color: #13a0a0 !important;
	}

	.header .logo img {
	    max-width: 55%;
	    margin: 0 auto;
	    margin-top: 0;
	}

	.banner-title {
	    font-family: 'Open Sans';
	    font-size: 1.4em;
	    color: #fff;
	    margin: 45px auto 195px;
	    opacity: 0.8;
	    font-weight: 100;
	}

	.service-text {
	    width: 80%;
	    margin: 20px auto 35px;
	}

	.small-logo.mobile {
	    width: 100px;
	    margin: 7px auto;
	    float: left;
	}

	.res-nav_click {
	    font-size: 28px;
	    color: #d4d4d4;
	    width: 48px;
	    float: right;
	    height: 48px;
	    margin: 17px 0 0px;
	}

	.small-logo img {
	    width: 110px;
	    margin: 4px 0;
	}

	.main-nav li {
	    float: none;
	}

	.main-nav li.mobile-only{
		display: block;
	}

	.main-nav li.hide-on-mobile{
		display: none;
	}

}