@CHARSET "UTF-8";
/* JUMBOTRON CSS v0.1 by djphil (CC-BY-NC-SA 4.0) */

.jumbotron-particles { 
	width: 100%;
    /*height: 400px;*/
	font-family: 'Roboto', sans-serif;
	color: #fff;
	position: relative;
    text-shadow: 0px 2px #222;
    
}

#particles-js {
	position: absolute;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: 50% 50%;
    border-radius: 10px;

    /*animate*/
    background-size: 400% 400%;    
    -webkit-animation: AnimationName 30s ease infinite;
    -moz-animation: AnimationName 30s ease infinite;
    -o-animation: AnimationName 30s ease infinite;
    animation: AnimationName 30s ease infinite;
}

/*animate*/
@-webkit-keyframes AnimationName {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}
@-moz-keyframes AnimationName {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}
@-o-keyframes AnimationName {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}
@keyframes AnimationName { 
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}

/*texthover*/
.jumbotron-holder { 
    position: relative;
    width: 100%;
    height: 100%;
    padding: 50px;
    display: table;
    text-align: center;
}
.jumbotron-holder h1 {font-size: 4em;}

@media screen and (max-width: 600px) {
    .jumbotron-particles,
    .jumbotron-holder,
    .jumbotron-holder h1 {/*display: none;*/}
    .jumbotron-holder h1 {font-size: 2em;}
    .jumbotron-holder {padding: 20px;}
    .jumbotron-holder h3 {font-size: 1.0em;}
}