@charset "UTF-8";
/* Reset CSS
 * --------------------------------------- */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,
form,fieldset,input,textarea,p,blockquote,th,td {
    padding: 0;
    margin: 0;
}
a{
	text-decoration:none;
	outline: none;
}
table {
    border-spacing: 0;    
}
fieldset,img {
    border: 0;
}
address,caption,cite,code,dfn,em,strong,th,var {
    font-weight: normal;
    font-style: normal;
}
strong{
	font-weight: bold;
}
ol,ul {
    list-style: none;
    margin:0;
    padding:0;
}
caption,th {
    text-align: left;

}
h1,h2,h3,h4,h5,h6 {
    font-weight: normal;
    font-size: 100%;
    margin:0;
    padding:0;
    color:#0f3a54;
}
q:before,q:after {
    content:'';
}
abbr,acronym { border: 0;
}


body{
	font-family: 'Droid Sans', sans-serif;
	color:#0f3a54;
	color: rgba(0,0,0,0.5);
}
.wrap{
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	position: relative;
}
h1{
	font-size: 6em;	
}
p{

}

.hover {
-webkit-user-select: none;
-webkit-touch-callout: none;        
}

/* Custom CSS
 * --------------------------------------- */


.section{
	text-align:center;

}

#menu { 
	display:inline-block;
	background: url('imag/nav/nav.png') repeat;
	width: 100%;
	list-style: none;
	overflow: hidden;
	position:fixed;
	top:0;
	left:0;
	height: 90px;
	z-index: 70;
	padding: 0;
	margin:0;
}
#menu li {
    display:inline-block;
	width: 16%;
		height: 90px;
}


.icons{
	padding-top:72px;
	text-align:center;
	height: 15px;
	text-transform:uppercase;

}

#menu li a {
	display:inline-block;
	font-size:14px;
	text-decoration: none;
    color: #FFFFFF;
    width:100%;
    border: none;

}


#home { 
	background: url('imag/nav/nblogo.png') no-repeat;
	text-indent:-999px;
	    background-position:center top;	
}


.active > #quem{
		background: url('imag/nav/quemi.png')no-repeat;
	    background-position:center top;	
}

#quem { 
	background: url('imag/nav/quem.png') no-repeat;
	    background-position:center top;	
}


.active > #serv{
		background: url('imag/nav/servicosi.png')no-repeat;
	    background-position:center top;	
}

#serv { 
	background: url('imag/nav/servicos.png')no-repeat;
	    background-position:center top;	
}

.active > #port { 
	background: url('imag/nav/porti.png')no-repeat;
	    background-position:center top;	
}
#port { 
	background: url('imag/nav/port.png')no-repeat;
	    background-position:center top;	
}

.active > #cont { 
	background: url('imag/nav/conti.png')no-repeat;
	    background-position:center top;	
}

#cont { 
	background: url('imag/nav/cont.png')no-repeat;
	    background-position:center top;	
}
#social{
	top: -10px;
	position: relative;
	
}

.rdso{
	font-size:14px;
	text-decoration:none;
	text-transform:lowercase;
	height: 25px;
	z-index: 4;
	padding-top:2px;
}
.solink {
	margin-left:10px;
	 
}
#social a{
	width:inherit;
	text-align:center;	
}
#facebook img{
	    vertical-align: middle;
}
#twitter{
	text-indent: -16px;
}
#twitter img{
    vertical-align: middle;

}
#pinterest img{
	    vertical-align: middle;
}



.logo { 
	background: url('imag/logo.png') no-repeat;
	background-size:400px 400px;
	height: 400px;
	margin-top: 50px;
	background-position:center; 
}

.marquee{
	width: 100%;  
    height: 50px;  
    margin: 25px auto;  
    overflow: hidden;  
    position: relative;  
    margin: 25px auto; 
}
.marquee h1{
	font-size:40px;
	color: #1b608b;
	text-align: center;
	width: 100%;  
    height: 100%;  
    margin: 0;  
    line-height: 50px;
    position:absolute;
}
.marquee h1 {   
    	-webkit-transform:translateY(100%); 
		-webkit-transform:translateY(100%); 
}  
.marquee h1:nth-child(1) {  
    	-webkit-animation: up-um 20s ease infinite;  
    	animation: up-um 35s ease infinite;  
}  
.marquee h1:nth-child(2) {  
    	-webkit-animation: up-dois 35s ease infinite;  
    	animation: up-dois 35s ease infinite;  
}
.marquee h1:nth-child(3) {  
    	-webkit-animation: up-tres 35s ease infinite;  
    	animation: up-tres 35s ease infinite;  
}
.marquee h1:nth-child(4) {  
    	-webkit-animation: up-quatro 35s ease infinite;  
    	animation: up-quatro 35s ease infinite;  
}
.marquee h1:nth-child(5) {  
    	-webkit-animation: up-cinco 35s ease infinite;  
    	animation: up-cinco 35s ease infinite;  
}  
.marquee h1:nth-child(6) {  
    	-webkit-animation: up-seis 35s ease infinite;  
    	animation: up-seis 35s ease infinite;  
}
.marquee h1:nth-child(7) {  
    	-webkit-animation: up-seis 35s ease infinite;  
    	animation: up-seis 35s ease infinite;  
}  
@-webkit-keyframes up-um {  
    0%  {  
        -webkit-transform:translateY(100%);  
    }  
    3% {  
        -webkit-transform:translateY(0%);  
    }  
    7% {  
        -webkit-transform:translateY(0%);  
    }  
    13% {  
        -webkit-transform:translateY(0%);  
    }  
    16% {
		-webkit-transform:translateY(-100%);  
    }
    100%{  
        -webkit-transform:translateY(-100%);  
    }  
}
@-webkit-keyframes up-dois {  
    0%  {  
        -webkit-transform:translateY(100%);  
    }
    16%  {  
        -webkit-transform:translateY(100%);  
    }   
    19% {  
        -webkit-transform:translateY(0%);  
    }  
    29% {  
        -webkit-transform:translateY(0); 
    }
    32% {  
        -webkit-transform:translateY(-100%);  
    } 
    
    100%{  
        -webkit-transform:translateY(-100%);  
    }
 }
@-webkit-keyframes up-tres {  
    0%  {  
        -webkit-transform:translateY(100%);  
    }
    32%  {  
        -webkit-transform:translateY(100%);  
    }   
    35% {  
        -webkit-transform:translateY(0%);  
    }  
    45% {  
        -webkit-transform:translateY(0); 
    }
    48% {  
        -webkit-transform:translateY(-100%);  
    } 
    
    100%{  
        -webkit-transform:translateY(-100%);  
    }
 }
@-webkit-keyframes up-quatro {  
    0%  {  
        -webkit-transform:translateY(100%);  
    }
    48%  {  
        -webkit-transform:translateY(100%);  
    }   
    51% {  
        -webkit-transform:translateY(0%);  
    }  
    61% {  
        -webkit-transform:translateY(0); 
    }
    64% {  
        -webkit-transform:translateY(-100%);  
    } 
    
    100%{  
        -webkit-transform:translateY(-100%);  
    }
 }
@-webkit-keyframes up-cinco {  
    0%  {  
        -webkit-transform:translateY(100%);  
    }
    64%  {  
        -webkit-transform:translateY(100%);  
    }   
    67% {  
        -webkit-transform:translateY(0%);  
    }  
    77% {  
        -webkit-transform:translateY(0); 
    }
    80% {  
        -webkit-transform:translateY(-100%);  
    } 
    
    100%{  
        -webkit-transform:translateY(-100%);  
    }
 }
@-webkit-keyframes up-seis {  
    0%  {  
        -webkit-transform:translateY(100%);  
    }
    80%  {  
        -webkit-transform:translateY(100%);  
    }   
    83% {  
        -webkit-transform:translateY(0%);  
    }  
    94% {  
        -webkit-transform:translateY(0); 
    }
    98% {  
        -webkit-transform:translateY(-100%);  
    } 
    
    100%{  
        -webkit-transform:translateY(-100%);  
    }
 }
 
 @keyframes up-um {  
    0%  {  
        transform:translateY(100%);  
    }  
    3% {  
        transform:translateY(0%);  
    }  
    7% {  
        transform:translateY(0%);  
    }  
    13% {  
        transform:translateY(0%);  
    }  
    16% {
		transform:translateY(-100%);  
    }
    100%{  
        transform:translateY(-100%);  
    }  
}
@keyframes up-dois {  
    0%  {  
        transform:translateY(100%);  
    }
    16%  {  
        transform:translateY(100%);  
    }   
    19% {  
        transform:translateY(0%);  
    }  
    29% {  
        transform:translateY(0); 
    }
    32% {  
        transform:translateY(-100%);  
    } 
    
    100%{  
        transform:translateY(-100%);  
    }
 }
@keyframes up-tres {  
    0%  {  
        transform:translateY(100%);  
    }
    32%  {  
        transform:translateY(100%);  
    }   
    35% {  
        transform:translateY(0%);  
    }  
    45% {  
        transform:translateY(0); 
    }
    48% {  
        transform:translateY(-100%);  
    } 
    
    100%{  
        transform:translateY(-100%);  
    }
 }
@keyframes up-quatro {  
    0%  {  
        transform:translateY(100%);  
    }
    48%  {  
        transform:translateY(100%);  
    }   
    51% {  
        transform:translateY(0%);  
    }  
    61% {  
        transform:translateY(0); 
    }
    64% {  
        transform:translateY(-100%);  
    } 
    
    100%{  
        transform:translateY(-100%);  
    }
 }
@keyframes up-cinco {  
    0%  {  
        transform:translateY(100%);  
    }
    64%  {  
        transform:translateY(100%);  
    }   
    67% {  
        transform:translateY(0%);  
    }  
    77% {  
        transform:translateY(0); 
    }
    80% {  
        transform:translateY(-100%);  
    } 
    
    100%{  
        transform:translateY(-100%);  
    }
 }
@keyframes up-seis {  
    0%  {  
        transform:translateY(100%);  
    }
    80%  {  
        transform:translateY(100%);  
    }   
    83% {  
        transform:translateY(0%);  
    }  
    94% {  
        transform:translateY(0); 
    }
    98% {  
        transform:translateY(-100%);  
    } 
    
    100%{  
        transform:translateY(-100%);  
    }
 }
 
 
.equipa{
	margin-top:60px;
	background: url('imag/cover_sofa.jpg');
	background-size: cover;
    background-repeat: no-repeat;
    height: 354px;
	width: 960px;	
}
 
 
 
#textos{
	position:relative;
	display:inline-block;
	text-align:justify;
	width:85%;
	top:10px;
	color:#777777;
	height:150px;
	margin-left: auto;
	margin-right: auto;
}
#textos p{
	font-size: 13px;
	margin-top:10px;
}

/*-------------------------------Serviços*/
.serv{
	display:inline-block;
	width: 33%;
}

#dcorp{
	background: url('imag/bacalhau.jpg')no-repeat;
	background-position:center top;
	background-size: contain;
   	height: 220px;
   	width: 100%;	
}
#wdesign{
	background: url('imag/papas.jpg')no-repeat;
	background-position:center top;
	background-size: contain;
	height: 220px;
	width: 100%;		    
}
#wdevelo{
	background: url('imag/toucinho.jpg')no-repeat;
	background-position:center top;
	background-size: contain;
	height: 220px;
	width: 100%;
}

.servtitulo{
	position:relative;
	margin: 10px 0;
	font-size:24px;
	font-weight: bold;
	color: #1b608b;

}
.servlist p{
	margin:6px 0;
}


/*portfolio coisas lindas --------------------------*/

.thumbnailWrapper{
text-align: center;
}

.thumbnailWrapper ul { 
	display:inline-block; 
    list-style-type: none; /* remove the default style for list items (the circles) */  
    margin: 0px;
    padding:0px; /* remove default padding */  
}  
.thumbnailWrapper ul li {  
    float:left; /* important: left float */ 
    margin:5px 5px;
	border-style:solid;
	border-width:1px;
	border-color:#1b608b;
    position:relative; /* so we can use top and left positioning */  
    overflow:hidden; /* hide the content outside the boundaries (ZOOM) */  
}  
.thumbnailWrapper ul li a img {  
    width:200px; /* not important, the pics we use here are too big */  
    position:relative; /* so we can use top and left positioning */  
    border:none; /* remove the default blue border */  
}  
.caption{  
    position:absolute; /* needed for positioning */  
	bottom:0px; /* bottom of the list item (container) */  
    left:0px; /* start from left of the list item (container) */  
    width:100%; /* stretch to the whole width of container */  
    display:none; /* hide by default */  
    /* styling bellow */  
    background:#1b608b;  
    color:white;  
    opacity:0.9;  
}  
.caption .captionInside{  
    /* just styling */  
    padding:5px 10px 5px 10px;  
    margin:0px;
    font-size:16px;  
} 
.caption .captionInsideref{  
    /* just styling */ 
    font-style:italic; 
    padding:0px 10px 3px 10px;  
    margin:0px; 
    font-size:13px; 
} 
.clear { clear:both; } /* to clear the float after the last item */  

/* portfolio coisas lindas -------------end-------------*/

/*----carousel-----------------------------------*/


.wrapper {
	width: 960px;
	height: 500px;
	margin: -550px 0 0 -480px;
	overflow: hidden;
	position: relative;
	top: 50%;
	left: 50%;
}
.overlay {
	background: #FFFFFF;
	background-color:#FFFFF;
	width: 300px;
	height: 500px;
	overflow: hidden;
	position: absolute;
	left: -300px;
	top: 0;
	z-index: 1;
	
	-webkit-transition: left .5s ease;
	-moz-transition: left .5s ease;
	transition: left .5s ease;
}
.wrapper:hover .overlay {
	left: 0px;
}
.description {
	padding-top: 20px;
	width: 250px;
	height:500px;
	margin-left: 450px;

 
	-webkit-transition: margin .5s ease;
	-moz-transition: margin .5s ease;
	transition: margin .5s ease;
}
.wrapper:hover .description {
	margin-left: 0px;
}
.description h3 {
	color: #1b608b;
	font-size: 35px;
	font-weight: normal;
	text-align: right;
	line-height: 30px;
	margin: 20px 0;

}
.description p {
	font-size: 13px;
	text-align: justify;
	float: right;
}
 
.wrapper .caroufredsel_wrapper {
	margin-left: 0px !important;
	
	-webkit-transition: margin .5s ease;
	-moz-transition: margin .5s ease;
	transition: margin .5s ease;
}
.wrapper:hover .caroufredsel_wrapper {
	margin-left: 150px !important;
}
.carousel img {
	display: block;
	float: left;
}
 
.pager {
	text-align: center;
	padding: 40px 20px 0 0;
}
.pager a {
	border-radius: 5px;
	background: #666666;
	display: block;
	width: 10px;
	height: 10px;
	margin: 10px 5px;
	float: right;
}
.pager a.selected {
	background: #1b608b;
}
.pager span {
	display: none;
}

/*----carousel----------------------------end-------*/


#map_canvas {
	width: 100%;
    height: 100%;
    margin-left:auto;
    margin-right:auto;
}

#infobox{
	position: absolute;
margin: -115px 0px 0px 0px;
width: 100%;
background-color: #1b608b;
height: 115px;
z-index: 100;
}

#infoboxcont{

}
#infoboxcont p{
	color:#FFFFFF;
	text-align: center;
	font-size: 16px;
	margin:5px 0;
}

/*------------------------------------------Responcive*/


/*------------------------------------------PadsPortrait*/
@media only screen and (max-width : 768px)  {
	
	
	/*-------------------------------Serviços*/
	.serv{
		margin-left:auto;
		display:block;
		width: 85%;
	}
	

	.serv_text{
				margin-left:auto;
		position:relative;
		padding-top:40px;
		height: 220px;
	   	width: 110%;	
	}
	#dcorpm{
		background: url('imag/entidadecorporativa.png')no-repeat;
		background-position:left top;
	}
	
	#dcorp{
		display:none;
	}
	#wdesignm{
		background: url('imag/webdesign.png')no-repeat;
		background-position:left top;
	}
	#wdesign{
		display:none;
	}
	#wdevelom{
		background: url('imag/webdevelopment.png')no-repeat;
		background-position:left top;
	}
	#wdevelo{
		display:none;
	}
	
	.servtitulo{
		margin: 10px 0;
		font-size:24px;
		font-weight: bold;
		color: #1b608b;
	
	}
	.servlist p{
		margin:6px 0;
	}

}

/* ----------------------------SmartphonesLandscape) */
@media only screen and (min-width : 321px) {

}

/* -----------------------------SmartphonesPortrait */
@media only screen and (max-width : 320px) {
	body {
		display: none;	
	}
}

/* ---------------------------------Desktopslaptops */
@media only screen and (min-width : 1224px) {

	.wrap{
		width: 960px;
	}

}