/*  Web Designer Magazine
		---------------------
		Ultimate HTML5 Footer
		---------------------
	*/
	
	body {
/*		background-color: #534741;     */
		margin:			0 auto;
		font-family:	'Raleway', helvetica, sans-serif;
		font-size:		100%;	
		width:			100%;
	}

	header {
        display:		block;
		position:		relative;
		margin:			0 auto;
		background-image: url(../images/footerbg.png);
		color:			#333;
		height:			5em;
		margin-top:		1.25em;
		margin-bottom:	3px;
		padding:		1.25em;
		-moz-box-shadow:	0px 0px 5px rgba(0,0,0,0.5);
		-webkit-box-shadow:	0px 0px 5px rgba(0,0,0,0.5);
		box-shadow:			0px 0px 5px rgba(0,0,0,0.5);
        max-width: 57.5em;
	}
	
	header h1 {
		color:			#FFFFFF;
	}

    .tflogo {
        color: #fff;
    }

    /*Styles for screen 400px and lower*/
@media screen and (max-width: 25em) {
	.tflogo { 
  		font-size: 80%;
  	}
}

    #showWinner {
        float: right;
    }

    .f-note {
        width: 40%;
        position: absolute;
        bottom: 0.3125em;
        left: 0.3125em;
        font-size: 0.8em;
        text-align:justify;
    }

.current {
	
	color: #635c49; 	
}

    .randomImage {
        margin-top:    1.25em;
    }
	
	.special_text {
		font-size: 		1.1em;
		font-style: 	oblique;
	/*	font-weight: 	bolder;   */
		color: 			#9000A1;
        text-align:     center;
	}

    .special_img {
        width:          90%;
        display:        block;
        margin:			0 auto;
        padding-bottom: 1.25em;
    }
	
	.special_img img {     /* used to force img resize and retain aspect */
		display: block;
        max-width:12.625em;
        max-height:10em;
        width: auto;
        height: auto;
	}
	
	article {
		display:		block;		
		position:		relative;
		margin:			0 auto;
		background:		#fff;
		height:			28.125em;
		margin-bottom:	2px;
		padding:		1.25em;	
		-moz-box-shadow:	0px 0px 5px rgba(0,0,0,0.5);
		-webkit-box-shadow:	0px 0px 5px rgba(0,0,0,0.5);
		box-shadow:			0px 0px 5px rgba(0,0,0,0.5);
        max-width: 57.5em;
	}
	
	footer {
		display:		block;		
		position:		relative;
		margin:			1.25em auto 20px auto;
	/*	height:			6.25em;    */
	/*	padding:		1.25em;    */
		background: 	#9B3913 url(../images/footerbg2.png) repeat top left;
		-moz-box-shadow:	0px 0px 5px rgba(0,0,0,0.5);
		-webkit-box-shadow:	0px 0px 5px rgba(0,0,0,0.5);
		box-shadow:			0px 0px 5px rgba(0,0,0,0.5);
		border-top:			2px solid #222;
		border-bottom:		2px solid #222;
   /*     max-width: 57.5em;   */
	}

	footer section {
	/*	position:		relative;   */
	/*	width:			50%; /* 12.5em; */
	/*	float:			left;   */
	/*	margin-right:	1.25em;    */
	/*	left:			1.5625em;   */
		height:			6.25em;
		background: #050002; /* Old browsers */
		background: -moz-linear-gradient(top, #050002 0%, #a90329 50%); /* FF3.6+ */
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#050002), color-stop(50%,#a90329)); /* Chrome,Safari4+ */
		background: -webkit-linear-gradient(top, #050002 0%,#a90329 50%); /* Chrome10+,Safari5.1+ */
		background: -o-linear-gradient(top, #050002 0%,#a90329 50%); /* Opera11.10+ */
		background: -ms-linear-gradient(top, #050002 0%,#a90329 50%); /* IE10+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#050002', endColorstr='#a90329',GradientType=0 ); /* IE6-9 */
		background: linear-gradient(top, #050002 0%,#a90329 50%); /* W3C */
		-moz-border-radius: 2px/20px;	
		-webkit-border-radius: 2px/20px;
		border-radius: 5px/20px;
		-webkit-transition:all 0.5s;
		-moz-transition:all 0.5s;
		transition:		all 0.5s;
	}

    footer .drawerpos {
		position:		relative;
		width:			100%; /* 12.5em; */
		float:			left;
	/*	margin-right:	1.25em;   */
	/*	left:			1.5625em;  */
		height:			6.25em;
		background: #050002; /* Old browsers */
		background: -moz-linear-gradient(top, #050002 0%, #a90329 50%); /* FF3.6+ */
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#050002), color-stop(50%,#a90329)); /* Chrome,Safari4+ */
		background: -webkit-linear-gradient(top, #050002 0%,#a90329 50%); /* Chrome10+,Safari5.1+ */
		background: -o-linear-gradient(top, #050002 0%,#a90329 50%); /* Opera11.10+ */
		background: -ms-linear-gradient(top, #050002 0%,#a90329 50%); /* IE10+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#050002', endColorstr='#a90329',GradientType=0 ); /* IE6-9 */
		background: linear-gradient(top, #050002 0%,#a90329 50%); /* W3C */
		-moz-border-radius: 2px/20px;	
		-webkit-border-radius: 2px/20px;
		border-radius: 5px/20px;
		-webkit-transition:all 0.5s;
		-moz-transition:all 0.5s;
		transition:		all 0.5s;
	}
/*
	footer:hover {
	/*	width:			90%;  /* 13.125em;  
		margin-left:	-5px;	
		margin-right:	0.9375em;
	}
*/
	footer .handle{
		position:		absolute;
		top:			0;
		left:			0;
		width:			100%;              /*  12.5em;   */
		height:			6.25em;
		background: 	#9B3913 url(../images/drawerbg.png) no-repeat center center;
		-moz-box-shadow:	0px 3px 5px rgba(0,0,0,0.3);
		-webkit-box-shadow:	0px 3px 5px rgba(0,0,0,0.3);
		box-shadow:			0px 3px 5px rgba(0,0,0,0.3);
		-webkit-transition:all 0.5s;
		-moz-transition:all 0.5s;
		transition:		all 0.5s;
	}
	
	footer .contents {
		position:		absolute;
		top:			0;
		left:			5px;
		background:		#89e5e4;
		padding:		0 5px 5px 5px;
		-moz-border-radius:5px;
		-webkit-border-radius:5px;
		border-radius: 5px;
		width:		95%;   /* 14em; */
	/*	height:		5em;   */
		margin:		0 auto 10px auto;
		font-size:	0.8em;
		text-align:		center;
		-webkit-transition:all 0.5s;
		-moz-transition:all 0.5s;
		transition:		all 0.5s;
	}

    footer .contents:after {   /* used to extend the background so that the floated image is enclosed */
        content:        ".";
        display:        block;
        height:         0;
        clear:          both;
        visibility:     hidden;
    }
	
	.contents ul {
		text-align:		left;
	}

    .drawerpos img {     /* used to force img resize and retain aspect */
		display: block;
        max-width:4em;
        max-height:4em;
        width: auto;
        height: auto;
        float: right;
        margin-top: 0.3125em;
	}
	
	footer .drawerpos:hover .handle {
		top:			1.25em;
		left:			0px;
		width:			100%; /* 13.125em; */
		height:			6.25em;
		margin-right:	0.625em;
		-moz-box-shadow:	0px 5px 8px rgba(0,0,0,0.7);
		-webkit-box-shadow:	0px 5px 8px rgba(0,0,0,0.7);
		box-shadow:			0px 5px 8px rgba(0,0,0,0.7);
	}

	footer .drawerpos:hover .contents {
		top:			-3.125em;
		left:				0px;
		-webkit-transform: rotate(-10deg);
		-moz-transform: rotate(-10deg);
		transform: rotate(-10deg);
		-moz-box-shadow:	0px 0px 5px rgba(0,0,0,0.5);
		-webkit-box-shadow:	0px 0px 5px rgba(0,0,0,0.5);
		box-shadow:			0px 0px 5px rgba(0,0,0,0.5);
	}
	
	footer .drawerpos .meta {
		background:			#89e589;
	}
	
	footer .drawerpos .legal {
		background:			#e5cc89;
	}
	
	footer .drawerpos .social {
		background:			#fff;
	}
	
	footer .drawerpos:hover .meta {
		left:				5px !important;
		-webkit-transform: rotate(5deg) !important;
		-moz-transform: rotate(5deg) !important;
		transform: rotate(5deg) !important;
	}
	
	footer .drawerpos:hover .legal {
		left:				4px !important;
		-webkit-transform: rotate(-2deg) !important;
		-moz-transform: rotate(-2deg) !important;
		transform: rotate(-2deg) !important;
	}
	
	footer .drawerpos:hover .social {
		left:				5px !important;
		-webkit-transform: rotate(0deg) !important;
		-moz-transform: rotate(0deg) !important;
		transform: rotate(0deg) !important;
	}
	
	ul.social {
		margin:			0;
		padding:		0;
		margin-top:		10px;
	}
	
	ul.social li {
		margin:			0;
		padding:		0;
		list-style:		none;
		float:			left;
		margin-right:	4px;
	}