/* Tooltip fix */
.tooltip {margin-right: 1.5em;}

/* Color Section */
html, body {height: 100%;}
html {overflow:hidden; background: url('../img/header.jpg') no-repeat; background-size: cover; background-color: #333;}

body {background-color: rgba(50,50,70,0.7);}
.intro {cursor: pointer; height: 500px;}
.proyects {display: none; cursor: pointer; height: 500px;}
.col-xs-12 { text-align: center; }
.logo{
    width: 140px;
    border-radius: 5px;
    margin-top: 100px;
    -webkit-box-shadow: 6px 6px 6px 6px rgba(0,0,0,.1);
	-moz-box-shadow: 6px 6px 6px 6px rgba(0,0,0,.1);
	box-shadow: 6px 6px 6px 6px rgba(0,0,0,.1);
    -webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 1s; /* Firefox < 16 */
        -ms-animation: fadein 1s; /* Internet Explorer */
         -o-animation: fadein 1s; /* Opera < 12.1 */
            animation: fadein 1s;
}

h1 {
	font-family: 'Montez'; 
	color: #FFF; 
	font-size: 3.5em; 
	opacity: .9;
	text-shadow: 3px 3px 3px rgba(0, 0, 0, .2);
	-webkit-animation: fadein 3s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 3s; /* Firefox < 16 */
        -ms-animation: fadein 3s; /* Internet Explorer */
         -o-animation: fadein 3s; /* Opera < 12.1 */
            animation: fadein 3s;

}

h2 {
	font-family: 'Roboto'; 
	color:#EEE; 
	font-size: 1.3em; 
	font-weight: 100; 
	letter-spacing: 1px;
	margin-top: 30px;
	text-shadow: 3px 3px 3px rgba(0, 0, 0, .2);
	-webkit-animation: fadein 5s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 5s; /* Firefox < 16 */
        -ms-animation: fadein 5s; /* Internet Explorer */
         -o-animation: fadein 5s; /* Opera < 12.1 */
            animation: fadein 5s;
} 
h1 span {font-size: .8em;}
h2 span {text-decoration: underline;}
h2 strong {margin: 5px;}
strong { color:#FF6E6E;}

.proyects h2 {
	text-decoration: underline;
	text-transform: uppercase;
	font-size: 1.5em;
}

.proyects ul {
	width: 330px;
	margin: 0 auto;
	list-style: none;
	text-align: left;
	font-size: 1.2em;
}

.proyects ul li {
	margin-top: 5px;
}

.proyects ul li a {
	color: #FFF;
	opacity: .7;
	font-weight: 100;
}

.proyects ul li a:hover {
	color: #FFF;
	text-decoration: none;
	opacity: 1;
}

footer {
	text-align: center;
	width: 100%;
	height: 50px;
	text-shadow: 3px 3px 3px rgba(0, 0, 0, .2);
	-webkit-animation: fadein 2s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 2s; /* Firefox < 16 */
        -ms-animation: fadein 2s; /* Internet Explorer */
         -o-animation: fadein 2s; /* Opera < 12.1 */
            animation: fadein 2s;
}
footer a{color: #FFF;opacity: .8;font-size: 2em!important;margin: 10px;}
footer a:hover{color: #FFF; text-decoration: none; opacity: 1;}



/* fade in */

@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Firefox < 16 */
@-moz-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Internet Explorer */
@-ms-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Opera < 12.1 */
@-o-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}