body {
	overflow-x:hidden;
	height: 100%;
}

.text-muted {
	color: #999;
	font-weight: 400;
	font-style: italic;

}

p {
  font-size: 20px;
}

a,a:hover,a:focus,a:active,a.active,a.focus{
	outline:0
}

/* -------------------- */

section{
	padding: 100px 0;
}

section h2.section-heading{
font-size:45px;
margin-top:0;
margin-bottom:15px
}

section h3.section-subheading{
font-size:25px;
font-style:italic;
font-weight:400;
margin-bottom:75px
}

/* ------------- */


.navbar {
	margin-top: 5px;
  padding: 2px 0;
  background-color: rgba(255,255,255,0.9);
  font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
  font-size: 1.4em;
  font-weight: 100;
  border-color: transparent;

}

.navbar-default .navbar-brand{
	padding-left: 20px;
	font-family:"Poiret One","Helvetica Neue",Helvetica,Arial,cursive;
	font-size: 1.5em;

}

/*hover*/
.navbar-default .nav li a:hover,.navbar-default .nav li a:focus{
	background-color:rgba(250,164,96,0.2);
	color:#222;
}

/*active*/
.navbar-default .navbar-nav>.active>a{
	color:#222;
	background-color: rgba(250,164,96,0.4)
}

/*hover+active*/
.navbar-default .navbar-nav>.active>a:hover,.navbar-default .navbar-nav>.active>a:focus{
	color:#222;
	background-color: rgba(250,164,96,0.7)
}



@media(min-width:768px) {

  .navbar-default .navbar-brand{

		font-size: 2.2em;
	}

}

/* ------------  */ 

header{
text-align:center;
color:#222 
}

header .intro-text .intro-heading{
font-family:"Poiret One","Helvetica Neue",Helvetica,Arial,sans-serif;
font-style: italic;
font-weight:600;
font-size:50px;
line-height:50px;


position: absolute;
margin-left: auto;
margin-right: auto;
top: 40%;
left: 0;
right: 0;

}


@media (min-width:768px){

	header .intro-text .intro-heading{
	font-family:"Poiret One","Helvetica Neue",Helvetica,Arial,sans-serif;
	
	font-weight:700;
	font-size:75px;
	line-height:75px;
	}
}

header .page-scroll{
	color: #CCC;
	position: absolute;
	margin-left: auto;
	margin-right: auto;
	top: 80%;
	left:48%;
}

header .page-scroll:hover{
	color: #444;
}

/*--------------*/

#portfolio {
	background-color: #EEE;
}

#portfolio .portfolio-item{
margin:0 0 15px;
right:0
}

#portfolio .portfolio-item .portfolio-link{
display:block;
position:relative;
max-width:400px;
margin:0 auto
}

#portfolio .portfolio-item .portfolio-link .portfolio-hover{
background:rgba(90,90,90,.9);
position:absolute;
width:100%;
height:100%;
opacity:0;
transition:all ease .5s;
-webkit-transition:all ease .5s;
-moz-transition:all ease .5s
}

#portfolio .portfolio-item .portfolio-link .portfolio-hover:hover{
opacity:1
}

#portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content{
position:absolute;
width:100%;
height:20px;
font-size:20px;
text-align:center;
top:50%;
margin-top:-12px;
color:rgba(255,255,255,0.9);
}

#portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content i{
margin-top:-12px
}

#portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content h3,#portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content h4{
margin:0
}

#portfolio .portfolio-item .portfolio-caption{
max-width:400px;
margin:0 auto;
background-color:#fff;
text-align:center;
padding:25px
}

#portfolio .portfolio-item .portfolio-caption h4{
font-size: 1.5em;
text-transform:none;
margin:0
}

#portfolio .portfolio-item .portfolio-caption p{
font-style:italic;
font-size:16px;
margin:0
}

#portfolio *{
z-index:2
}

@media (min-width:767px){
	#portfolio .portfolio-item{
		margin:0 0 30px
	}
}

/* --------  */

#about {
  color: #fff;
  background: #9c9c9c;
}

/* --------- */

.educa{
	color:hsl(46,	83%,56%);
}

.ccode{
	color:hsl(227,83%,56%);
}

.fablab{
	color:hsl(2,83%,56%);
}

/* ---------- */

#contact {
  color: #fff;
  background: #444;
}

#social-net {
	text-align: center;
	color:#FFF;
}

#social-net a{
	color:#FFF;
	transition:all ease .5s;
	-webkit-transition:all ease .5s;
	-moz-transition:all ease .5s	
}

#social-net .fa-inverse{
	color:#444;	
	transition:all ease .5s;
	-webkit-transition:all ease .5s;
	-moz-transition:all ease .5s
}

#social-net a:hover{
	color:transparent;
	transition:all ease .5s;
	-webkit-transition:all ease .5s;
	-moz-transition:all ease .5s
}

#social-net .fa-inverse:hover{
	color:#FFF;
	transition:all ease .5s;
	-webkit-transition:all ease .5s;
	-moz-transition:all ease .5s
}

.social-item{
	margin-left: 0;
	margin-right: 0;
}




/* ------------ */

footer {
	height: 80px;
	font-family:"Poiret One","Helvetica Neue",Helvetica,Arial,cursive;
	font-size: 2.5em;
	text-align: center;
}

footer .container{
	margin-top: 20px;
}


/* ------   */

.portfolio-modal .modal-content {
    padding: 100px 0;
    min-height: 100%;
    border: 0;
    border-radius: 0;
    text-align: center;
    background-clip: border-box;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.portfolio-modal .modal-content h2 {
  margin: 0;
  font-size: 3em;
}

.portfolio-modal p {
	text-align: justify;
}

.portfolio-modal .modal-content img {
	margin-top: 30px;
  margin-bottom: 30px;
}

.portfolio-modal .modal-content .item-details {
  margin: 30px 0;
}

.portfolio-modal .close-modal {
  position: absolute;
  top: 25px;
  right: 25px;
  width: 75px;
  height: 75px;
  background-color: transparent;
  cursor: pointer;
}

.portfolio-modal .close-modal:hover {
  opacity: .3;
}

.portfolio-modal .close-modal .lr {
  z-index: 1051;
  width: 1px;
  height: 75px;
  margin-left: 35px;
  background-color: #2c3e50;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

.portfolio-modal .close-modal .lr .rl {
  z-index: 1052;
  width: 1px;
  height: 75px;
  background-color: #2c3e50;
  -webkit-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
}

.portfolio-modal .modal-backdrop {
  display: none;
  opacity: 0;
}

.portfolio-modal .video { 
  position: relative; 
  padding-bottom: 56.25%; 
  height: 0; 
  overflow: hidden; 
  max-width: 800px; 
  margin-top: 30px;
  margin-bottom: 30px;
  text-align: center;
}
          
.portfolio-modal .video iframe, 
.portfolio-modal .video object, 
.portfolio-modal .video embed { 
  position: absolute; 
  top: 0; 
  left: 0; 
  width: 100%; 
  height: 100%;

}

.portfolio-modal .btn {
	margin-top: 30px;
}

.img-centered {
    margin: 0 auto;
}