/**
*
* @package phpBB Extension - CSS Magic
* @copyright (c) 2018 martin - https://www.martins-play-ground.com & dmzx - https://www.dmzx-web.net
* @license Proprietary/All rights reserved (martins-play-ground.com ownes these files and has the right to disable them)
*
*/

/* Logo hats start */
.logo-hat {
	z-index: 2;
	width: 110px;
	height: 127px;
	position: absolute;
	margin-left: -50px;
	margin-top: -19px;
}
.newyearhat {
	z-index: 2;
	width: 51px;
	height: 95px;
	position: absolute;
	margin-left: -22px;
	margin-top: -30px;
}
.halloweenhat {
	z-index: 2;
	width: 56px;
	height: 90px;
	position: absolute;
	margin-left: -30px;
	margin-top: -35px;
}

.rememberhat {
	z-index: 2;
	width: 62px;
	height: 95px;
	position: absolute;
	margin-left: -30px;
	margin-top: -30px;
}

.smillieshat {
	z-index: 2;
	width: 90px;
	height: 120px;
	position: absolute;
	margin-left: -32px;
	margin-top: -42px;
}

.thanksgivinghat {
	z-index: 2;
	width: 70px;
	height: 104px;
	position: absolute;
	margin-left: -30px;
	margin-top: -35px;
}

.easterhat {
	z-index: 2;
	width: 74px;
	height: 97px;
	position: absolute;
	margin-left: -30px;
	margin-top: -28px;
}

.laborshat {
	z-index: 2;
	width: 115px;
	height: 85px;
	position: absolute;
	margin-left: -30px;
	margin-top: -35px;
}

.fingerhat {
	background-size: auto 98px !important;
	width: 67px;
	height: 98px;
	max-height: 98px !important;
	position: absolute;
	margin-left: -35px;
	margin-top: -30px;
	z-index: 2;
}

@media (min-width: 350px) and (max-width: 950px) {
	.fingerhat, .fingerhat1, .laborshat, .easterhat, .thanksgivinghat, 
	.smillieshat, .logo-hat, .newyearhat, .halloweenhat, .rememberhat {
    	display: none;
	}

	.site-description h1, .site-description p {
    	margin-top: 10px;
	}
}
/* Logo hats end  */

.flip-box {
  position: relative;
  margin: 0px auto !important;
  width: 800px;
  height: 75px;
  z-index: 1;
  margin-top: 10px !important;
}

.flip-box-inner {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 1.0s;
  transform-style: preserve-3d;
}



.flip-box-front, .flip-box-back {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.flip-box-front {
  position: absolute;
  width: 100%;
  height: 30%;
  backface-visibility: hidden;
  transform: rotateX(0deg);
}

.flip-box-back {
  backface-visibility: hidden;
  transform: rotateX(180deg);
}

/*  ---------------------- Center Flip header logos ---------------------------------------- */

img.center {
    position: absolute;
    transform: translateX(-50%);
    left: 50%;
}


.wrap {margin-top: 6px !important;}