/* ---- particles.js container ---- */

#particles-js{
  width: 100%;
  height: 100%;
  background-color: #ffffff;
  background-image: url('');
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  overflow:hidden;
}


*{
    -webkit-box-sizing:border-box;-moz-box-sizing:border-box;
	box-sizing:border-box;
}

html,body{
    width:100%;
	height:100%;
	overflow:hidden;
}

body{
    font-family:'Raleway',sans-serif;
	line-height:1.5;-webkit-font-smoothing:antialiased;
}

hr{
    border:0;
	border-top:3px double #a9a9a9;
}

#intro{
    position:absolute;
	left:0;
	top:50%;
	padding:0 20px;
	width:100%;
	text-align:center;
}

h1{
    margin:0;
	padding:0;
	/*font-size:4em;*/
	color:#a9a9a9;
	font-weight:100;
	text-transform:uppercase;
}

p{
    color:#a9a9a9;
	font-weight:300;
}

.social-media-icons{
    font-size:15px;
	padding-bottom:10px;
}

.social-media-icons a{
    color:black;
}

.social-media-icons i{
    padding:14px 10px;
}

.social-media-icons a:hover .fa-linkedin, .social-media-icons a:active .fa-linkedin{
    color:#0976b4;
}

.social-media-icons a:hover .fa-envelope-o,.social-media-icons a:active .fa-envelope-o{
    color:#ffa930;
}

.social-media-icons a:hover .fa-github,.social-media-icons a:active .fa-github{
    color:#6cc644;
}

.social-media-icons a:hover .fa-key,.social-media-icons a:active .fa-key{
    color:#e39732;
}

.hvr-bounce-to-top:before{
    background:black;
}

.hvr-bounce-to-top:hover,.hvr-bounce-to-top:focus,.hvr-bounce-to-top:active{
    color:black;
}

.hvr-bounce-to-right:before{
    background:black;
}

.hvr-bounce-to-right:hover,.hvr-bounce-to-right:focus,.hvr-bounce-to-right:active{
    color:black;
}

@media only screen and (max-width: 1000px) {
    h1{font-size:70px;}
}

@media only screen and (max-width: 800px) {
    h1{font-size:48px;}
    h1::after{height:8px;}
}

@media only screen and (max-width: 568px) {
    #intro{padding:0 10px;}
    h1{font-size:30px;}
    h1::after{height:6px;}
    p{font-size:18px;}
    .btn{font-size:16px;}
}

@media only screen and (max-width: 320px) {
    h1{font-size:28px;}
    h1::after{height:4px;}
}