/* --- Awwwards Ribbons --- */

/* Base */

#awwwards {
	position:absolute;
	top:40px;
	z-index:999999;
}

/* Left */

#awwwards.left {
	left:0;
}

/* Right */

#awwwards.right {
	right: 0;
	opacity: 0;
	-webkit-transform: translateY(-30px) scale(0.9);
	   -moz-transform: translateY(-30px) scale(0.9);
	    -ms-transform: translateY(-30px) scale(0.9);
	     -o-transform: translateY(-30px) scale(0.9);
	        transform: translateY(-30px) scale(0.9);
	-webkit-transition: all .2s .4s ease-out;
	   -moz-transition: all .2s .4s ease-out;
	    -ms-transition: all .2s .4s ease-out;
	     -o-transition: all .2s .4s ease-out;
	        transition: all .2s .4s ease-out;
}
#awwwards.right.in {
	-webkit-transform: translateY(0);
	   -moz-transform: translateY(0);
	    -ms-transform: translateY(0);
	     -o-transform: translateY(0);
	        transform: translateY(0);
	opacity: 1;
}

/* Link */

#awwwards a {
	display:block;
	width:70px;
	height:105px;
	text-indent:-8000px;
	background-repeat:no-repeat;
	background-position: 0 0;
	overflow:hidden;
}

/* Black */

#awwwards.left.black a {
	background-image:url('ribbons/awwwards_sotd_black_left.png');
}
#awwwards.right.black a {
	background-image:url('ribbons/awwwards_sotd_black_right.png');
}

/* White */

#awwwards.left.white a {
	background-image:url('ribbons/awwwards_sotd_white_left.png');
}
#awwwards.right.white a {
	background-image:url('ribbons/awwwards_sotd_white_right.png');
}

/* Green */

#awwwards.left.green a {
	background-image:url('ribbons/awwwards_sotd_green_left.png');
}
#awwwards.right.green a {
	background-image:url('ribbons/awwwards_sotd_green_right.png');
}


/* MEDIA QUERIES */

/* Landscape phone to portrait tablet */

@media (max-width: 767px) {

	/* hidden */
	#awwwards {
		display: none;
	}

}

/* Retina Displays */

/* Target any device with retina display (ie iPad 3 and MacBook Pro) */

@media
only screen and (-Webkit-min-device-pixel-ratio: 1.5),
only screen and (-moz-min-device-pixel-ratio: 1.5),
only screen and (-o-min-device-pixel-ratio: 3/2),
only screen and (min-device-pixel-ratio: 1.5) {

	#awwwards a {
		-moz-background-size: 70px 105px;
		-ie-background-size:70px 105px;
		-o-background-size:70px 105px;
		-webkit-background-size:70px 105px;
		background-size:70px 105px;
	}

	/* Gray */

	#awwwards.left.black a {
		background-image:url('ribbons/awwwards_sotd_black_left2x.png');
	}
	#awwwards.right.black a {
		background-image:url('ribbons/awwwards_sotd_black_right2x.png');
	}

	/* White */

	#awwwards.left.white a {
		background-image:url('ribbons/awwwards_sotd_white_left2x.png');
	}
	#awwwards.right.white a {
		background-image:url('ribbons/awwwards_sotd_white_right2x.png');
	}

	/* Green */

	#awwwards.left.green a {
		background-image:url('ribbons/awwwards_sotd_green_left2x.png');
	}
	#awwwards.right.green a {
		background-image:url('ribbons/awwwards_sotd_green_right2x.png');
	}

}
