div.rankings-intro {
   padding-top:2em;
   padding-bottom:1em;	
}

.rankings-pageheadline {
   font-size:24px;
   font-weight:bold;	
   margin-bottom:1em;
}

.rankings-image {
   width:100%;
   height:auto;
   overflow:hidden;
   border:none;	
}

.rankings-countdown {
   width:100%;
   /* height:152px; */
   color:#222;
   font-size:72px;
   line-height:72px;
   font-weight:800;
   /* line-height:146px; */
   padding:64px 0 0 10px;
   margin-bottom:0;
}

.rankings-title {
   font-size:20px;
   line-height:1.4;
   font-weight:600;
   padding: 10px 10px 0 10px;
   display:block;
}

.rankings-body {
   height:auto;
   font-size:13px;
   line-height:1.5;
   padding: 10px;
}

.rankings-source {
   font-size:14px;
   font-weight:normal;	
   padding: 10px 10px 0 10px;
}

.rankings-badge {
   padding: 10px 10px 0 10px;
   border:0;
}

.rankings-competitive {
   font-size:12px;
   font-weight:normal;
   font-style:italic;
   color:#969696;	
   padding: 10px 10px 0 10px;
}


/* Additional tile styles */

.tag {
   font-size:12px;
   font-weight:normal;
   color:#909090;
   text-decoration:none;
   border-bottom:0px solid transparent;
   margin:10px;
}

a.selectedtag {
   font-size:12px;
   font-weight:normal;
   color:#FFCC00;
   background-color:#EBEBEB;		
}

.itemSection {
   width:100%;
   border-top: 1px solid #DDDDDD;
   padding:5%;	
}

.socialIcons {
   text-align:center;
}

.fa {
    display: inline-block;
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
	
}

.socialIcons a, .socialIcons a:visited {
	color:#000;
    border-color: transparent;
    font-size: 22px;
    margin-right: 28px;
    display: inline-block;
	text-decoration:none;
}

.socialIcons a:hover, .socialIcons a:active {
	color:#990033;
}

.form-type-bef-link {
    display:inline-block;
}

.form-type-bef-link a {
    margin-right:.5em;
    padding: 0 5px 0 5px;
    background-color:#999;
    color:#fff;
    text-decoration:none;
    font-size:13px;
    line-height:1.5;
    border-bottom:0px solid transparent;
}

.form-type-bef-link a:hover {
    background-color:#777;
    color:#efefef;
    text-decoration:none;
    border-bottom:0px solid transparent;
}
.tilescontainer {
	/*background-color:#fcd5e2;   pink */
	
}
.masonry-processed {
	/*background-color:#e1fcd5;   green */
	
}
div.form-item {
	
}

/*  flipcard stuff */
@media only screen and (max-width: 480px) {   /* center on mobile */
	.flip-container {
		margin: 5px auto;
	}
}

		/* simple */
		.flip-container {
			-webkit-perspective: 1000;
			-moz-perspective: 1000;
			-ms-perspective: 1000;
			perspective: 1000;

			-ms-transform: perspective(1000px);
			-moz-transform: perspective(1000px);
    			-moz-transform-style: preserve-3d; 
    			-ms-transform-style: preserve-3d; 
		}

			/*
			.flip-container:hover .flipper, .flip-container.hover .flipper, #flip-toggle.flip .flipper {
				-webkit-transform: rotateY(180deg);
				-moz-transform: rotateY(180deg);
				-ms-transform: rotateY(180deg);
				transform: rotateY(180deg);
				filter: FlipH;
    			-ms-filter: "FlipH";
			}
			*/


/* START: Accommodating for IE */
	.flip-container:hover .tileback, .flip-container.hover .tileback {
    -webkit-transform: rotateY(0deg);
    -moz-transform: rotateY(0deg);
    -o-transform: rotateY(0deg);
    -ms-transform: rotateY(0deg);
    transform: rotateY(0deg);
}

.flip-container:hover .tilefront, .flip-container.hover .tilefront {
    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
    -o-transform: rotateY(180deg);
    transform: rotateY(180deg);
}
		
/* END: Accommodating for IE */

.flip-container, .tilefront, .tileback {
	width: 238px;
	height: 400px;
	
}

		.flipper {
			-webkit-transition: 0.6s;
			-webkit-transform-style: preserve-3d;
			-ms-transition: 0.6s;

			-moz-transition: 0.6s;
			-moz-transform: perspective(1000px);
			-moz-transform-style: preserve-3d;
			-ms-transform-style: preserve-3d;

			transition: 0.6s;
			transform-style: preserve-3d;

			position: relative;
		}

		.tilefront, .tileback {
			-webkit-backface-visibility: hidden;
			-moz-backface-visibility: hidden;
			-ms-backface-visibility: hidden;
			backface-visibility: hidden;

		    -webkit-transition: 0.6s;
		    -webkit-transform-style: preserve-3d;
		    -webkit-transform: rotateY(0deg);

		    -moz-transition: 0.6s;
		    -moz-transform-style: preserve-3d;
		    -moz-transform: rotateY(0deg);

		    -o-transition: 0.6s;
		    -o-transform-style: preserve-3d;
		    -o-transform: rotateY(0deg);

		    -ms-transition: 0.6s;
		    -ms-transform-style: preserve-3d;
		    -ms-transform: rotateY(0deg);

		    transition: 0.6s;
		    transform-style: preserve-3d;
		    transform: rotateY(0deg);

			position: absolute;
			top: 0;
			left: 0;
		}

		.tilefront {
			-webkit-transform: rotateY(0deg);
			-ms-transform: rotateY(0deg);
			background: white;
			z-index: 2;
			border:1px solid #ccc;
			box-sizing: border-box;
		}
		
		.goldcard {
		    background: #ffcc00 !important;	
		}
		
		.goldcard .tag {
		    color:#715B00 !important;	
		}
		
		.goldcard .rankings-countdown, .goldcard .rankings-title, .goldcard .rankings-source, .goldcard .rankings-competitive {
			color:#000000 !important;
		}
		
		
		.marooncard {
		    background: #990033 !important;	
		}
		
		.marooncard .rankings-countdown {
		    background: #990033 !important;	
		}
		
		.marooncard .rankings-countdown, .marooncard .rankings-title, .marooncard .rankings-source, .marooncard .rankings-competitive {
			color:#ffffff !important;
		}
		
		.marooncard .tag {
		    color:#ffffff !important;	
		}
		
		.blackcard {
		    background: #000000 !important;	
		}
		
	    .blackcard .rankings-countdown {
		    background: #000000 !important;	
		}
		
		.blackcard .rankings-countdown, .blackcard .rankings-title, .blackcard .rankings-source, .blackcard .rankings-competitive {
			color:#ffcc00 !important;
		}
		
		.blackcard .tag {
		    color:#ffcc00 !important;	
		}

	    .whitecard .rankings-countdown {
		    color: #ffcc00 !important;	
		}


		.tileback {
			background: white;
			-webkit-transform: rotateY(-180deg);
		    -moz-transform: rotateY(-180deg);
		    -o-transform: rotateY(-180deg);
		    -ms-transform: rotateY(-180deg);
		    transform: rotateY(-180deg);
		    border:1px solid #ccc;
		    box-sizing: border-box;
		}


		.back-logo {
			position: absolute;
			top: 40px;
			left: 90px;
			width: 160px;
			height: 117px;
			background: url(logo.png) 0 0 no-repeat;
		}


			/* START: Accommodating for IE */
			.vertical.flip-container:hover .tileback, .vertical.flip-container.hover .tileback {
			    -webkit-transform: rotateX(0deg);
			    -moz-transform: rotateX(0deg);
			    -o-transform: rotateX(0deg);
			    -ms-transform: rotateX(0deg);
			    transform: rotateX(0deg);
			}

			.vertical.flip-container:hover .tilefront, .vertical.flip-container.hover .tilefront {
			    -webkit-transform: rotateX(180deg);
			    -moz-transform: rotateX(180deg);
			    -o-transform: rotateX(180deg);
			    transform: rotateX(180deg);
			}
		/* END: Accommodating for IE */