@import url(https://fonts.googleapis.com/css?family=Lora);

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	font-family: 'Lora', Athelas;
}

html,body {
    height:100%;
    min-height:100%;
}

#wrapper {
	background: url('../img/background.jpg') #AFAFAF;
	background-size: cover;
	width: 100%;
    height:100%; 
    position: relative;
    padding: 30px 20px 0;
}

img {
	max-width: 100%;
}

.logo {
    width: 450px;
    margin: 0 auto;
    display: block;
    z-index: 99;
}

.info {
	display: block;
	margin: 30px auto 0;
	position: relative;
	z-index: 99;
}

.social-buttons {
	width: 270px;
	margin: 0 auto;
	display: block;
}

.social-buttons a {
	max-width: 50px;
	display: inline-block;
}

.links {
    text-align: center;
	margin-top: 10px;
}

.links a,
.links span {
	color: white;
	font-size: 15px;
	text-transform: uppercase;
    text-transform: uppercase;
    text-decoration: none;
    letter-spacing: 3px;
    opacity: 1;
}

.info a:hover {
	opacity: .5;
	-webkit-transition: opacity .3s ease;
	-o-transition: opacity .3s ease;
	transition: opacity .3s ease;
}

.nique {
	width: 250px;
	position: absolute;
	bottom: 0;
	left: 50%;
	margin-left: -125px;
}

@media (min-width : 800px) {
	.logo {
	    width: 600px;
	    left: 13%;
	    top: 100px;
	    position: relative;
	}
	.nique {
		width: 57%;
    	max-width: 600px;
		left: 0;
		margin-left: 0;
	}

	.info {
	    display: inline-block;
	    position: relative;
	    margin: 50px 0;
	    left: 60%;
	    top: 200px;
	}
}

@media (min-width : 1030px) {
	.nique {
	    width: 55%;
	    max-width: 650px;
	    left: 20px;
	}
	.logo {
		width: 60%;
	    position: absolute;
	   	top: 130px;
	    right: 20px;
	    left: inherit;
	}
	.info {
	    position: absolute;
	    bottom: 40px;
	    top: inherit;
	    right: 9%;
	    left: inherit;
	}
}

@media (max-width : 300px) {
	.nique {
		display: none;
	}
	.links a {
	    display: inline-block;
	    text-align: center;
	    padding: 10px;
	    border: 2px solid;
	    margin: 10px auto;
	}
	.links span {
		display: none;
	}
	.social-buttons {
		width: inherit;
	}
	.social-buttons a {
	    max-width: 50px;
	    display: block;
	    margin: 10px auto;
	}
}