/*  phpBB3 Style Sheet
    --------------------------------------------------------------
	phpBB style name: Milk v2
	Based on style:   Merlin Framework (http://www.planetstyles.net)
    --------------------------------------------------------------
*/
/* Fusionado en un solo archivo para eliminar la cascada de @import bloqueante (PageSpeed: render-blocking requests) */

/* ===== normalize.css ===== */
html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;}body{margin:0;}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block;}audio,canvas,progress,video{display:inline-block;vertical-align:baseline;}audio:not([controls]){display:none;height:0;}[hidden],template{display:none;}a{background-color:transparent;}a:active,a:hover{outline:0;}abbr[title]{border-bottom:1px dotted;}b,strong{font-weight:bold;}dfn{font-style:italic;}h1{font-size:2em;margin:0.67em 0;}mark{background:#ff0;color:#000;}small{font-size:80%;}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;}sup{top:-0.5em;}sub{bottom:-0.25em;}img{border:0;}svg:not(:root){overflow:hidden;}figure{margin:1em 40px;}hr{box-sizing:content-box;height:0;}pre{overflow:auto;}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em;}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0;}button{overflow:visible;}button,select{text-transform:none;}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer;}button[disabled],html input[disabled]{cursor:default;}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0;}input{line-height:normal;}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;}input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto;}input[type="search"]{-webkit-appearance:textfield;box-sizing:content-box;}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none;}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em;}legend{border:0;padding:0;}textarea{overflow:auto;}optgroup{font-weight:bold;}table{border-collapse:collapse;border-spacing:0;}td,th{padding:0;}

/* ===== base.css ===== */
/* --------------------------------------------------------------
	$Base
-------------------------------------------------------------- */

/** {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
*:before,
*:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}*/

/* Define your base font-size here; most elements will inherit this. _NO__DOTCOMMA__AFTER__*/
html {
	font-size: 1em; /* Assuming 16px... */
	line-height: 1.5; /* 24px (This is now our magic number; all subsequent margin-bottoms and line-heights want to be a multiple of this number in order to maintain vertical rhythm.) _NO__DOTCOMMA__AFTER__*/
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

body {
	color: #333333;
	background-color: #ffffff;
}

input,
button,
select,
textarea {
	font-family: inherit;
	font-size: inherit;
	line-height: inherit;
}

figure { margin: 0; }
img { vertical-align: middle; }

hr {
	margin-top: 20px;
	margin-bottom: 20px;
	border: 0;
	border-top: 1px solid #e5e5e5;
}

a {
	color: #428bca;
	text-decoration: none;
}

a:hover,
a:active {
	color: #2a6496;
	text-decoration: underline;
}

blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
figure,
p,
pre { margin: 0; }
button {
	background: transparent;
	border: 0;
	padding: 0;
}

/**
 * Work around a Firefox/IE bug where the transparent `button` background
 * results in a loss of the default `button` focus styles.
 */
button:focus {
	outline: 1px dotted;
	outline: 5px auto -webkit-focus-ring-color;
}

fieldset {
	border: 0;
	margin: 0;
	padding: 0;
}

iframe { border: 0; }
ol,
ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

/**
 * Suppress the focus outline on links that cannot be accessed via keyboard.
 * This prevents an unwanted focus outline from appearing around elements that
 * might still respond to pointer events.
 */
[tabindex="-1"]:focus { outline: none !important; }

/**
 * Remove double underline from recent version of firefox
 */
abbr[title] {
	text-decoration: none;
}

/* ===== utilities.css ===== */
/* --------------------------------------------------------------
	$Utilities
-------------------------------------------------------------- */

.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	border: 0;
}

.sr-only-focusable:active,
.sr-only-focusable:focus {
  position: static;
  width: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  clip: auto;
}

.clearfix:before,
.clearfix:after,
.container:before,
.container:after,
.container-fluid:before,
.container-fluid:after,
.row:before,
.row:after {
	content: " ";
	display: table;
}
.clearfix:after,
.container:after,
.container-fluid:after,
.row:after { clear: both; }

.center-block {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.pull-right { float: right !important; }
.pull-left { float: left !important; }
.hide { display: none !important; }
.show { display: block !important; }
.invisible { visibility: hidden; }

.text-hide {
	font: 0/0 a;
	color: transparent;
	text-shadow: none;
	background-color: transparent;
	border: 0;
}

.hidden {
	display: none ;
}

.affix { position: fixed }

/* ===== common.css ===== */
/* General Markup Styles
---------------------------------------- */
html {
	/* Always show a scrollbar for short pages - stops the jump when the scrollbar appears. non-IE browsers */
	height: 101%;
}

body {
	line-height: normal;
	margin: 0;
	padding: 0;
	word-wrap: break-word;
	-webkit-print-color-adjust: exact;
}

html, body {
	height: 100%;
}

h1 {
	/* Forum name */
	margin-right: 200px;
}

h2 {
	/* Forum header titles */
	margin-bottom: 30px;
}

h2.solo {
	margin-bottom: 1em;
}

h3 {
	/* Sub-headers (also used as post headers, but defined later) */
	margin-bottom: 15px;
}

h4 {
	/* Forum and topic list titles */
}

p {
	line-height: 1.3em;
	margin-bottom: 1.5em;
}

img {
	border-width: 0;
}

hr {
	border: 0 solid transparent;
	border-top-width: 1px;
	height: 1px;
	margin: 15px 0;
	display: block;
	clear: both;
}

hr.dashed {
	border-top-style: dashed;
	margin: 10px 0;
}

hr.divider {
	display: none;
}

p.right {
	text-align: right;
}

p.jumpbox-return {
	margin-top: 10px;
	margin-bottom: 0;
	float: left;
}

p.login_container_info {
	font-size: 0.8em;
}

u {
	text-decoration: underline;
}

ul {
	list-style-type: disc;
}

ol {
	list-style-type: decimal;
}

li {
	display: list-item;
}

ul ul, ol ul {
	list-style-type: circle;
}

ol ol ul, ol ul ul, ul ol ul, ul ul ul {
	list-style-type: square;
}

a:hover	{ text-decoration: underline; }

/* Main blocks
---------------------------------------- */
.wrap {
	border-radius: 8px;
	margin: 0 auto;
	padding: 0;
	width: 100%;
}

.page-body {
	margin: 0;
	clear: both;
}

.page-footer {
	clear: both;
}

.page-footer h3 {
	margin-top: 20px;
}

.logo {
	display: block;
	width: auto;
	padding: 0;
}

.logo:hover {
	text-decoration: none;
}

.site_logo {
	display: inline-block;
	width: 275px;
	height: 51px;
	background-size: cover;
}

/* Site description and logo */
.site-description {
	text-align: center;
	/* margin: 50px auto 100px; */
	position: relative;
	z-index: 2;
	display: inline-block;
}

.site-description.logo_left {
	text-align: left;
	/* margin: 100px 50px; */
	float: left;
}

.site-description.logo_right {
	text-align: right;
	/* margin: 100px 50px; */
	float: right;
}

body.navbar_i_header .site-description {margin: 100px auto 100px;}
body.navbar_i_header .site-description.logo_left {margin: 100px 50px 100px;}
body.navbar_i_header .site-description.logo_right {margin: 100px 50px 100px;}

body.navbar_o_header .site-description {margin: 50px auto 100px;}
body.navbar_o_header .site-description.logo_left {margin: 50px 50px 100px;}
body.navbar_o_header .site-description.logo_right {margin: 50px 50px 100px;}

.site-description h1 {
	margin-right: 0;
	margin-top: 30px;
}

.site-description p {
	margin-bottom: 0;
}

/* Round cornered boxes and backgrounds
---------------------------------------- */
.headerbar {
	border-radius: 0px; /* Must be defined in .parallax-mirror if parallax header is enabled */
	position: relative;
}

#page-header {
	position: relative;
}

.navbar {
	padding: 15px;
	z-index: 10;
	top: 0;
	left: 0;
	right: 0;
	box-sizing: border-box;
	position: relative;
}

.navbar.navbar_in_header {
	position: absolute;
}

.forabg, .forumbg {
	margin-bottom: 30px;
	clear: both;
}

.forumlist_grid .forabg {
	margin-bottom: 45px;
}

.panel {
	margin-bottom: 15px;
	padding: 15px;
}

.post {
	padding: 15px;
	margin-bottom: 10px;
	background-repeat: no-repeat;
	background-position: 100% 0;
	position: relative;
	border-bottom: 1px solid;
}

.rowbg {
	margin: 5px 5px 2px 5px;
}

/* Horizontal lists
----------------------------------------*/
.navbar ul.linklist {
	padding: 2px 0;
	list-style-type: none;
}

ul.linklist {
	display: block;
	margin: 0;
}

.cp-main .panel {
	padding: 5px 10px;
}

ul.linklist > li {
	float: left;
	line-height: 28px !important; /* needed for breadcrumbs. Reset below */
	list-style-type: none;
	margin-right: 15px;
	width: auto;
}

#nav-main.linklist > li > a,
#nav-main.linklist > li > div > a {
	padding: 5px;
	line-height: normal !important;
	position: relative;
}

a.outline_button {
	padding: 5px 10px !important;
}

ul.linklist > li.rightside, p.rightside, a.rightside {
	float: right;
	margin-right: 0;
	margin-left: 15px;
	text-align: right;
}

ul.navlinks {

}

ul#nav-breadcrumbs {
	margin-bottom: 30px;
}

ul.leftside {
	float: left;
	margin-left: 0;
	margin-right: 5px;
	text-align: left;
}

ul.rightside {
	float: right;
	margin-left: 5px;
	margin-right: -5px;
	text-align: right;
}

ul.linklist li.responsive-menu {
	position: relative;
	margin: 0 15px 0 0;
}

ul.linklist li.rightside.responsive-menu {
	margin-left: 15px;
	margin-right: 0;
}

.hasjs ul.linklist.leftside, .hasjs ul.linklist.rightside {
	max-width: 48%;
}

.hasjs ul.linklist.fullwidth {
	max-width: none;
}

li.responsive-menu.dropdown-right .dropdown {
	left: -9px;
}

li.responsive-menu.dropdown-left .dropdown {
	right: -6px;
}

ul.linklist .dropdown {
	top: 45px;
}

ul.linklist .dropdown-up .dropdown {
	bottom: 18px;
	top: auto;
}

/* Bulletin icons for list items
----------------------------------------*/
ul.linklist.bulletin > li:before {
	display: inline-block;
	content: "\2022";
	font-size: inherit;
	line-height: inherit;
	padding-right: 4px;
}

ul.linklist.bulletin > li:first-child:before,
ul.linklist.bulletin > li.rightside:last-child:before {
	content: none;
}

ul.linklist.bulletin > li.no-bulletin:before {
	content: none;
}

.responsive-menu:before {
	display: none !important;
}

/* Profile in overall_header.html */
.header-profile {
	display: inline-block;
	vertical-align: top;
}

a.header-avatar,
a.header-avatar:hover {
	text-decoration: none;
}

a.header-avatar img {
	margin-bottom: 2px;
	max-height: 20px;
	max-width: 20px;
	vertical-align: middle;
	width: auto;
	height: auto;
}

a.header-avatar span:after {
	content: '\f0dd';
	display: inline-block;
	font: normal normal normal 14px/1 FontAwesome;
	padding-left: 6px;
	padding-top: 5px;
	vertical-align: top;
}

/* Dropdown menu
----------------------------------------*/
.dropdown-container {
	position: relative;
}

.dropdown-container-right {
	float: right;
}

.dropdown-container-left {
	float: left;
}

.nojs .dropdown-container:hover .dropdown {
	display: block !important;
}

.dropdown {
	display: none;
	position: absolute;
	left: 0;
	top: 1.2em;
	z-index: 5;
	border: 1px solid transparent;
	border-radius: 5px;
	padding: 9px 0 0;
	margin-right: -500px;
}

.dropdown.live-search {
	top: auto;
}

.dropdown-container.topic-tools {
	float: left;
}

.dropdown-up .dropdown {
	top: auto;
	bottom: 1.2em;
	padding: 0 0 9px;
}

.dropdown-left .dropdown, .nojs .rightside .dropdown {
	left: auto;
	right: 0;
	margin-left: -500px;
	margin-right: 0;
}

.dropdown-button-control .dropdown {
	top: 40px;
}

.dropdown-button-control.dropdown-up .dropdown {
	top: auto;
	bottom: 40px;
}

.dropdown .pointer, .dropdown .pointer-inner {
	position: absolute;
	width: 0;
	height: 0;
	border-top-width: 0;
	border-bottom: 10px solid transparent;
	border-left: 10px dashed transparent;
	border-right: 10px dashed transparent;
	-webkit-transform: rotate(360deg); /* better anti-aliasing in webkit */
	display: block;
}

.dropdown-up .pointer, .dropdown-up .pointer-inner {
	border-bottom-width: 0;
	border-top: 10px solid transparent;
}

.dropdown .pointer {
	right: auto;
	left: 10px;
	top: -1px;
	z-index: 3;
}

.dropdown-up .pointer {
	bottom: -1px;
	top: auto;
}

.dropdown-left .dropdown .pointer, .nojs .rightside .dropdown .pointer {
	left: auto;
	right: 10px;
}

.dropdown .pointer-inner {
	top: auto;
	bottom: -11px;
	left: -10px;
}

.dropdown-up .pointer-inner {
	bottom: auto;
	top: -11px;
}

.dropdown .dropdown-contents {
	z-index: 2;
	overflow: hidden;
	overflow-y: auto;
	border: 1px solid transparent;
	border-radius: 5px;
	padding: 7px;
	position: relative;
	max-height: 300px;
}

.dropdown-contents a {
	display: block;
	padding: 5px;
}

ul.search-results li {
	width: 200px;
	padding: 5px;
}

.jumpbox {
	margin: 5px 0;
}

.jumpbox .dropdown li {
	border-top: 1px solid transparent;
}

.jumpbox .dropdown-select {
	margin: 0;
}

.jumpbox .dropdown-contents {
	padding: 0;
	text-decoration: none;
}

.jumpbox .dropdown-contents li {
	padding: 0;
}

.jumpbox .dropdown-contents a {
	margin-right: 20px;
	padding: 5px 10px;
	text-decoration: none;
	width: 100%;
}

.jumpbox .spacer {
	display: inline-block;
	width: 0px;
}

.jumpbox .spacer + .spacer {
	width: 20px;
}

.dropdown-contents a {
	display: block;
	padding: 5px;
}

.dropdown-contents a:hover {
	border-radius: 	4px;
}

.jumpbox .dropdown-select {
	margin: 0;
}

.jumpbox .dropdown-contents a {
	text-decoration: none;
}

.dropdown li {
	display: list-item;
	border-top: 1px dotted transparent;
	float: none !important;
	line-height: normal !important;
	list-style: none;
	margin: 0;
	white-space: nowrap;
	text-align: left;
}

.dropdown-contents > li {
	padding-right: 15px;
}

.dropdown-nonscroll > li {
	padding-right: 0;
}

.dropdown li:first-child, .dropdown li.separator + li, .dropdown li li {
	border-top: 0;
}

.dropdown li li:first-child {
	margin-top: 4px;
}

.dropdown li li:last-child {
	padding-bottom: 0;
}

.dropdown li li {
	border-top: 1px dotted transparent;
	padding-left: 18px;
}

.wrap .dropdown li, .dropdown.wrap li, .dropdown-extended li {
	white-space: normal;
}

.dropdown li.separator {
	border-top: 1px solid transparent;
	padding: 0;
}

.dropdown li.separator:first-child, .dropdown li.separator:last-child {
	display: none !important;
}

/* Responsive breadcrumbs
----------------------------------------*/
.breadcrumbs .crumb {
	float: left;
	word-wrap: normal;
}

.breadcrumbs .crumb:before {
	content: '\2039';
	padding: 0 0.5em;
}

.breadcrumbs .crumb:first-child:before {
	content: none;
}

.breadcrumbs .crumb a {
	white-space: nowrap;
	text-overflow: ellipsis;
	vertical-align: bottom;
	overflow: hidden;
}

.breadcrumbs.wrapped .crumb a { letter-spacing: -.3px; }
.breadcrumbs.wrapped .crumb.wrapped-medium a { letter-spacing: -.4px; }
.breadcrumbs.wrapped .crumb.wrapped-tiny a { letter-spacing: -.5px; }

.breadcrumbs .crumb.wrapped-max a { max-width: 120px; }
.breadcrumbs .crumb.wrapped-wide a { max-width: 100px; }
.breadcrumbs .crumb.wrapped-medium a { max-width: 80px; }
.breadcrumbs .crumb.wrapped-small a { max-width: 60px; }
.breadcrumbs .crumb.wrapped-tiny a { max-width: 40px; }

/* Table styles
----------------------------------------*/
table.table1 {
	width: 100%;
}

.ucp-main table.table1 {
	padding: 2px;
}

table.table1 thead th {
	text-transform: uppercase;
	line-height: 1.3em;
	padding: 10px;
}

table.table1 thead th span {
	padding-left: 7px;
}

table.table1 tbody tr {
	border: 1px solid transparent;
}

table.table1 tbody td {
	padding: 10px;
	border-top: 1px solid transparent;
}

table.table1 tbody th {
	padding: 5px;
	border-bottom: 1px solid transparent;
	text-align: left;
}

/* Specific column styles */
table.table1 .name		{ text-align: left; }
table.table1 .center		{ text-align: center; }
table.table1 .reportby	{ width: 15%; }
table.table1 .posts		{ text-align: center; width: 7%; }
table.table1 .joined	{ text-align: left; width: 15%; }
table.table1 .active	{ text-align: left; width: 15%; }
table.table1 .mark		{ text-align: center; width: 7%; }
table.table1 .info		{ text-align: left; width: 30%; }
table.table1 .info div	{ width: 100%; white-space: normal; overflow: hidden; }
table.table1 .autocol	{ line-height: 2em; white-space: nowrap; }
table.table1 thead .autocol { padding-left: 1em; }

table.table1 span.rank-img {
	float: right;
	width: auto;
}

table.info td {
	padding: 3px;
}

table.info tbody th {
	padding: 3px;
	text-align: right;
	vertical-align: top;
}

.forumbg table.table1 {
	margin: 0;
}

.forumbg-table > .inner {
	margin: 0 -1px;
}

.color_palette_placeholder table {
	border-collapse: separate;
	border-spacing: 1px;
}

/* Misc layout styles
---------------------------------------- */
/* column[1-2] styles are containers for two column layouts */
.column1 {
	float: left;
	clear: left;
	width: 49%;
}

.column2 {
	float: right;
	clear: right;
	width: 49%;
}

/* General classes for placing floating blocks */
.left-box {
	float: left;
	width: auto;
	text-align: left;
	max-width: 100%;
}

.avatar-rank-container {
	max-width: 20%;
}

.left-box.profile-details {
	width: 80%;
}

.right-box {
	float: right;
	width: auto;
	text-align: right;
	max-width: 100%;
}

dl.details dt {
	float: left;
	clear: left;
	width: 30%;
	text-align: right;
	display: block;
}

dl.details dd {
	margin-left: 0;
	padding-left: 5px;
	margin-bottom: 5px;
	float: left;
	width: 65%;
	overflow: hidden;
	text-overflow: ellipsis;
}

.clearfix, fieldset dl, ul.topiclist dl, dl.polls {
	overflow: hidden;
}

fieldset.fields1 ul.recipients {
	list-style-type: none;
	line-height: 1.8;
	max-height: 150px;
	overflow-y: auto;
}

fieldset.fields1 dd.recipients {
	clear: left;
	margin-left: 1em;
}

fieldset.fields1 ul.recipients  input.button2{
	margin-right: 0;
	padding: 0;
}

fieldset.fields1 dl.pmlist > dt {
	width: auto !important;
}

fieldset.fields1 dl.pmlist dd.recipients {
	margin-left: 0 !important;
}

/* Action-bars (container for post/reply buttons, pagination, etc.)
---------------------------------------- */
.action-bar {
	margin: 0 0 30px;
}

.jumpbox-return {
	position: relative;
	z-index: 3;
}

.action-bar.bar-bottom {
	margin-top: 30px;
}

.forabg + .action-bar {
	margin-top: 2em;
}

.action-bar .button {
	margin-right: 15px;
	float: left;
}

.action-bar .button-search {
	margin-right: 0;
}

/* Pagination
---------------------------------------- */
.pagination {
	float: right;
	text-align: right;
	width: auto;
}

.action-bar .pagination {
	margin: 3px 0;
}

.action-bar.bar-bottom .pagination {
	margin-top: 0;
}

.action-bar .pagination .button {
	margin-right: 0;
	float: none;
}

.pagination > ul {
	display: inline-block;
	list-style: none !important;
	margin-left: 5px;
}

.pagination > ul > li {
	display: inline-block !important;
	padding: 0;
	line-height: normal;
	vertical-align: middle;
}

.pagination li a, .pagination li span {
	padding: 4px 7px;
}

.pagination li.active span {
	display: inline-block;
	line-height: 1.4;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	border: 1px solid transparent;
}

.pagination li.ellipsis span {
	border: none;
	padding: 0;
}

.pagination li.page-jump {
	margin-right: 5px;
}

.pagination li.page-jump a {
	padding: 0 8px;
}

.pagination .arrow a {
	padding: 4px 3px;
}

/* Pagination in viewforum for multipage topics */
.row .pagination {
	display: block;
	margin-top: 3px;
	margin-bottom: 3px;
}

.row .pagination > ul {
	margin: 0;
}

.row .pagination li a, .row .pagination li span {
    padding: 1px 5px;
}

/* jQuery popups
---------------------------------------- */
.phpbb_alert {
	border: 1px solid transparent;
	display: none;
	left: 0;
	padding: 0 25px 20px 25px;
	position: fixed;
	right: 0;
	top: 150px;
	z-index: 50;
	width: 620px;
	margin: 0 auto;
}

@media only screen and (max-height: 500px), only screen and (max-device-width: 500px)
{
	.phpbb_alert {
		top: 25px;
	}
}

.phpbb_alert .alert_close {
	float: right;
	margin-right: -36px;
	margin-top: -8px;
}

.phpbb_alert p {
	margin: 8px 0;
	padding-bottom: 8px;
}

.phpbb_alert label {
	display: block;
	margin: 8px 0;
	padding-bottom: 8px;
}

.darkenwrapper {
	display: none;
	position: relative;
	z-index: 44;
}

.darken {
	position: static;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	opacity: 0.5;
}

.loading_indicator {
	background: center center no-repeat;
	border-radius: 5px;
	display: none;
	opacity: 0.8;
	margin-top: -50px;
	margin-left: -50px;
	height: 50px;
	width: 50px;
	position: fixed;
	left: 50%;
	top: 50%;
	z-index: 51;
}

/* Miscellaneous styles
---------------------------------------- */
.copyright {
	padding: 5px;
	text-align: center;

}

.titlespace {
	margin-bottom: 15px;
}

.headerspace {

}

.error {
	margin-bottom: 15px !important;
}

div.rules {
	margin-bottom: 30px;
	padding: 15px;
	border-left: 3px solid;
}

div.rules ul, div.rules ol {
	margin-left: 20px;
}

p.post-notice {
	position: relative;
	padding: 15px;
	min-height: 14px;
	margin: 30px 0;
	border-left: 5px solid;
}

form > p.post-notice strong {
	line-height: 20px;
}

.stat-block {
	clear: both;
}

.top-anchor {
	display: block;
	position: absolute;
	top: -20px;
}

.clear {
	display: block;
	clear: both;
	font-size: 1px;
	line-height: 1px;
	background: transparent;
}

/* Inner box-model clearing */
.inner:after,
ul.linklist:after,
.action-bar:after,
.notification_text:after,
.tabs-container:after,
.tabs > ul:after,
.minitabs > ul:after,
.postprofile .avatar-container:after {
	clear: both;
	content: '';
	display: block;
}

.emoji {
	min-height: 18px;
	min-width: 18px;
	height: 1em;
	width: 1em;
}

.smilies {
	vertical-align: text-bottom;
}

.icon-notification {
	position: relative;
}

.member-search {
	float: left;
	margin: 0;
	padding: 6px 10px;
}

.dropdown-extended {
	display: none;
	z-index: 1;
}

.dropdown-extended ul {
	max-height: 350px;
	overflow-y: auto;
	overflow-x: hidden;
	clear: both;
}

.dropdown-extended ul li {
	padding: 0;
	margin: 0 !important;
	float: none;
	border-top: 1px solid;
	list-style-type: none;
	clear: both;
	position: relative;
}

.dropdown-extended ul li:first-child {
	border-top: none;
}

.dropdown-extended ul li.no_notifications {
	padding: 10px;
}

.dropdown-extended .dropdown-contents {
	max-height: none;
	padding: 0;
	position: absolute;
	width: 340px;
}

.nojs .dropdown-extended .dropdown-contents {
	position: relative;
}

.dropdown-extended .header {
	padding: 0 10px;
	text-align: left;
	text-transform: uppercase;
	line-height: 39px;
	border-bottom: 1px solid;
	border-radius: 5px 5px 0 0;
}

.dropdown-extended .header .header_settings {
	float: right;
	text-transform: none;
}

.dropdown-extended .header .header_settings a {
	display: inline-block;
	padding: 0 5px;
}

.dropdown-extended .header:after {
	content: '';
	display: table;
	clear: both;
}

.dropdown-extended .footer {
	text-align: center;
}

.dropdown-extended ul li a, .dropdown-extended ul li.no-url {
	padding: 8px;
}

.dropdown-extended .footer > a {
	padding: 5px 0;
}

.dropdown-extended ul li a, .notification_list dt > a, .dropdown-extended .footer > a {
	display: block;
	text-decoration: none;
}

.notification_list ul li img {
	float: left;
	max-height: 50px;
	max-width: 50px;
	width: auto !important;
	height: auto !important;
	margin-right: 5px;
}

.notification_list ul li p {
	margin-bottom: 4px;
}

.notification_list p.notification-reference,
.notification_list p.notification-location,
.notification_list li a p.notification-reason {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.notification_list p.notification-time {
	margin: 0;
	text-align: right;
}

.notification_list div.notifications {
	margin-left: 50px;
	padding: 5px;
}

.notification_list div.notifications a {
	display: block;
}

.notification_text {
	margin-left: 58px;
}

.badge {
	border-radius: 999px;
	text-align: center;
	white-space: nowrap;
	line-height: 8px;
	display: inline-block;
	position: absolute;
	top: 1px;
	right: 1px;
	padding: 4px 6px 5px 6px;
	border: 2px transparent;
}



.badge.hidden {
	display: none;
}

/* Navbar specific list items
----------------------------------------*/

.linklist .quick-links {
	margin: 0 30px 0 0;
}

.linklist.compact .rightside > a > span {
	display: none;
}

.dropdown-page-jump .dropdown {
	top: 20px;
}

.dropdown-page-jump.dropdown-up .dropdown {
	bottom: 20px;
}

.dropdown-page-jump input.tiny {
	width: 50px;
}

.dropdown .clone.hidden  {
	display: none;
}

.dropdown .clone.hidden + li.separator {
	display: none;
}

.dropdown .clone.hidden + li {
	border-top: none;
}

/* ===== links.css ===== */
/* Link Styles
---------------------------------------- */

/* Links adjustment to correctly display an order of rtl/ltr mixed content */
a {
	direction: ltr;
	unicode-bidi: embed;
	text-decoration: none;
	/* we use links inline more often then not so to address several bugs with
	IE and some other browsers we render all links as inlineblock by default */
	display: inline-block;

}

/* Coloured usernames */
.username-coloured {
	display: inline !important;
	padding: 0 !important;
}

/* Links on gradient backgrounds */
.forumbg .header a, .forabg .header a, th a {
	text-decoration: none;
}

.forumbg .header a:hover, .forabg .header a:hover, th a:hover {
	text-decoration: underline;
}

/* Notification mark read link */
.dropdown-extended a.mark_read {
	background-position: center center;
	background-repeat: no-repeat;
	border-radius: 3px 0 0 3px;
	display: none;
	margin-top: -20px;
	position: absolute;
	z-index: 2;
	right: 0;
	top: 50%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.dropdown-extended li:hover a.mark_read {
	display: block;
}

.dropdown-extended a.mark_read:hover {
	width: 50px;
}


/* Links for forum/topic lists */
a.forumtitle {
	text-decoration: none;
}

a.forumtitle:hover {
	text-decoration: underline;
}

a.topictitle {
	text-decoration: none;
	display: inline;
}

a.topictitle:hover {
	text-decoration: underline;
}

a.forumtitle, a.topictitle {
	display: inline-block !important;
	margin-bottom: 6px;
}

a.lastsubject {
	text-decoration: none;
}

a.lastsubject:hover {
	text-decoration: underline;
}

/* Post body links */
.postlink {
	text-decoration: none;
	border-bottom: 1px solid transparent;
	padding-bottom: 0;
}

.postlink:hover {
	text-decoration: none;
}

.signature a, .signature a:hover {
	border: none;
	text-decoration: underline;
}

/* Profile links */
.postprofile a, .postprofile dt.author a {
	text-decoration: none;
}

.postprofile a:hover, .postprofile dt.author a:hover {
	text-decoration: underline;
}

/* Profile searchresults */
.search .postprofile a {
	text-decoration: none;
}

.search .postprofile a:hover {
	text-decoration: underline;
}

.top {
	text-decoration: none;
	margin-top: 10px;
}

/* Back to top of page */
.back2top {
	clear: both;
}

.back2top .top {
	float: right;
	margin-right: -10px;
	margin-top: 0;
}

/* Arrow links  */

.arrow-up {
	padding-left: 10px;
	text-decoration: none;
	border-bottom-width: 0;
}

.arrow-up:hover { }

.arrow-down {
	padding-right: 10px;
}

.arrow-down:hover { }

.arrow-left:hover {
	text-decoration: none;
}

.arrow-right:hover {
	text-decoration: none;
}

/* invisible skip link, used for accessibility  */
.skiplink {
	position: absolute;
	left: -999px;
	width: 990px;
}

/* Feed icon in forumlist_body.html */
a.feed-icon-forum {
	float: right;
	margin: 3px;
}

a.anchor {
	display: block;
}

/* ===== content.css ===== */
/* Content Styles
---------------------------------------- */

ul.forums, ul.topics {
	padding: 10px;
}

ul.topiclist {
	display: block;
	list-style-type: none;
	margin: 0;
}

ul.topiclist li {
	display: block;
	list-style-type: none;
	margin: 0;
}

.content_block_header_block ul.topiclist li.header {

}

ul.topiclist dl {
	position: relative;
}

ul.topiclist li.row dl {

}

ul.topiclist dt, ul.topiclist dd {
	display: block;
	float: left;
}

ul.topiclist li.row dd {
	padding: 4px 0 999px 0;
	margin-bottom: -995px;
}

ul.topiclist dt {
	width: 100%;
	margin-right: -490px;
}

ul.topiclist.missing-column dt {
	margin-right: -395px;
}

ul.topiclist.missing-column li.header dt {
	margin-right: -425px;
}

ul.topiclist.two-long-columns dt {
	margin-right: -300px;
}

ul.topiclist.two-long-columns li.header dt {
	margin-right: -330px;
}

ul.topiclist.two-columns dt {
	margin-right: -95px;
}

ul.topiclist dt .list-inner {
	margin-right: 490px;
	padding-left: 5px;
	padding-right: 5px;
}

ul.topiclist.missing-column dt .list-inner {
	margin-right: 395px;
}

ul.topiclist.two-long-columns dt .list-inner {
	margin-right: 250px;
}

ul.topiclist.two-columns dt .list-inner {
	margin-right: 80px;
}

ul.topiclist.two-columns li.header dt  {
	margin-right: -130px;
}

ul.topiclist dd {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

ul.topiclist dfn {
	/* Labels for post/view counts */
	position: absolute;
	left: -999px;
	width: 990px;
}

.list-inner img {
	max-width: 100%;
}

.forum-image {
	float: left;
	padding-top: 5px;
	margin-right: 5px;
}

li.row {
	border-bottom: 1px solid transparent;
	padding: 15px 12px;
	margin-bottom: 0px !important;
}

li.row:last-child {border-width: 0;}

li.header dt, li.header dd {
	line-height: 1em;
	border-left-width: 0;
	margin: 14px 0;
	padding-top: 2px;
	padding-bottom: 2px;
}

li.header dt {
	width: 100%;
	margin-right: -520px;
	padding-left: 15px;
}

.forabg li.header dt , .forumbg li.header dt {
	margin-right: -530px; /* Accounts for 10px forumlist padding */
}

li.header dt .list-inner {
	margin-right: 440px;
}

li.header dd {
	padding-left: 1px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

li.header dl.row-item dt, li.header dl.row-item dd {
	min-height: 0;
}

li.header dl.row-item dt .list-inner {
	/* Tweak for headers alignment when folder icon used */
	padding-left: 0;
	padding-right: 50px;
}

/* Forum list column styles */


dl.row-item {
	background-position: 12px 50%;		/* Position of folder icon */
	background-repeat: no-repeat;
}

dl.row-item dt {
	background-repeat: no-repeat;
	background-position: 5px 95%;		/* Position of topic icon */
	background-size: 12px;
}

dl.row-item dt .list-inner {
	padding-left: 68px;					/* Space for folder icon */
}

dl.row-item dt, dl.row-item dd {
	min-height: 43px;
}

dl.row-item dt a {
	display: inline;
}

/* Touch target ampliado para el título del foro/subforo y del tema
   (ya son inline-block vía links.css; aquí solo se añade el área táctil que faltaba) */
.forumtitle, .topictitle {
	min-height: 24px;
	padding-top: 4px;
	padding-bottom: 4px;
}

dl a.row-item-link {						/* topic row icon links */
	display: block;
	width: 34px;
	height: 34px;
	padding: 0;
	position: absolute;
	top: 22px; /* row padding + row :before top adjustment */
	left: 0;
	margin-top: -15px;
	margin-left: 11px;
}

dd.posts, dd.topics, dd.views, dd.extra, dd.mark {
	width: 80px;
	text-align: center;
	line-height: 2.2em;
}

dd.posts, dd.topics, dd.views {
	width: 95px;
}

/* List in forum description */
dl.row-item dt ol,
dl.row-item dt ul {
	list-style-position: inside;
	margin-left: 1em;
}

dl.row-item dt li {
	display: list-item;
	list-style-type: inherit;
}

dd.lastpost, dd.redirect, dd.moderation, dd.time, dd.info {
	width: 300px;
}

dd.redirect {
	line-height: 2.5em;
}

dd.time {
	line-height: 200%;
}

dd.lastpost > span, ul.topiclist dd.info > span, ul.topiclist dd.time > span, dd.redirect > span, dd.moderation > span {
	display: block;
	padding-left: 5px;
}

dd.extra, dd.mark {
	line-height: 200%;
}

/* Post body styles
----------------------------------------*/
.postbody {
	padding: 0;
	line-height: 1.48em;
	width: 76%;
	float: left;
	position: relative;
}

/* Merlin Framework Adjustment */
.postprofile_Left .postbody {
	float: right;
}

.postbody h3 {
	/* Postbody requires a different h3 format - so change it here */
	float: left;
	padding: 2px 0 0 0;
	margin-top: 0 !important;
	margin-bottom: 0.3em !important;
	text-transform: none;
	border: none;
	line-height: 125%;
}

.postbody h3 img {
	vertical-align: bottom;
}

.has-profile .postbody h3 {
	/* If there is a post-profile, we position the post-buttons differently */
	float: none !important;
	margin-right: 180px;
}

.postbody .content {
	overflow-x: auto;
}

.postbody img.postimage {
	max-width: 100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.search .postbody {
	width: 68%;
}

/* Topic review panel
----------------------------------------*/
.panel .review {
	margin-top: 2em;
}

.topicreview {
	padding-right: 5px;
	overflow: auto;
	height: 300px;
}

.topicreview .postbody {
	width: auto;
	float: none;
	margin: 0;
	height: auto;
}

.topicreview .post {
	height: auto;
}

.topicreview h2 {
	border-bottom-width: 0;
}

.post-ignore .postbody {
	display: none;
}

/* MCP Post details
----------------------------------------*/
.post_details {
	/* This will only work in IE7+, plus the others */
	overflow: auto;
	max-height: 300px;
}

/* Content container styles
----------------------------------------*/
.content {
	clear: both;
	min-height: 3em;
	overflow: hidden;
	line-height: 1.4em;
	padding-bottom: 1px;
}

.content h2, .panel h2 {
	margin-bottom: 30px;
}

.panel h3 {
	margin: 15px 0 15px 0;
}

.panel p {
	margin-bottom: 1em;
	line-height: 1.4em;
}

.content p {
	margin-bottom: 1em;
	line-height: 1.4em;
}

.agreement {
	font-size: 12px;
	line-height: 17px;
	margin-bottom: 10px;
}

.agreement-text {
	line-height: 17px;
	margin-bottom: 10px;
}

dl.faq {
	margin-top: 1em;
	margin-bottom: 2em;
	line-height: 1.4em;
}


.content dl.faq {
	margin-bottom: 0.5em;
}

.content li {
	list-style-type: inherit;
}

.content ul, .content ol {
	margin: 0.8em 0 0.9em 3em;
}

.posthilit {
	padding: 0 2px 1px 2px;
}

/* Post author */
p.author {
	margin-bottom: 0.6em;
	padding: 15px 0 30px 0;
	line-height: 1.2em;
	clear: both;
}

/* Post signature */
.signature {
	margin-top: 15px;
	padding-top: 15px;
	border-top: 1px solid transparent;
	clear: left;
	line-height: 140%;
	overflow: hidden;
	width: 100%;
}

.signature.standalone {
	border-top-width: 0;
	margin-top: 0;
}

dd .signature {
	margin: 0;
	padding: 0;
	clear: none;
	border: none;
}

.signature li {
	list-style-type: inherit;
}

.signature ul, .signature ol {
	margin: 0.8em 0 0.9em 3em;
}

/* Post noticies */
.notice {
	width: auto;
	margin-top: 1.5em;
	padding-top: 0.2em;
	border-top: 1px dashed transparent;
	clear: left;
	line-height: 130%;
}

/* Jump to post link for now */
ul.searchresults {
	list-style: none;
	text-align: right;
	clear: both;
}

/* BB Code styles
----------------------------------------*/
/* Quote block */
blockquote {
	background: transparent none 6px 8px no-repeat;
	margin: 30px 1px 30px 25px;
	overflow: hidden;
	padding: 15px;
	border-left: 3px solid;
}

blockquote blockquote {
	/* Nested quotes */
	margin: 15px 1px 20px 15px;
}

blockquote cite {
	/* Username/source of quoter */
	margin-bottom: 5px;
	display: block;
}

blockquote cite:before {
    content: '\f10d';
    font-family: FontAwesome;
    font-weight: 300;
    margin-right: 5px;
}

blockquote.uncited {
	padding-top: 25px;
}

blockquote cite > span {
	float: right;
}

.postbody .content li blockquote {
	overflow: inherit;
	margin-left: 0;
}

/* Code block */
.codebox {
	padding: 0px;
	margin: 30px 0;
}

.codebox p {
	text-transform: uppercase;
	margin-bottom: 3px;
	display: block;
}

blockquote .codebox {
	margin-left: 0;
}

.codebox code {
	overflow: auto;
	display: block;
	height: auto;
	max-height: 200px;
	padding-top: 5px;
	line-height: 1.3em;
	margin: 2px 0;
	padding: 20px;
}

/* Attachments
----------------------------------------*/
.attachbox {
	float: left;
	width: auto;
	max-width: 100%;
	margin: 5px 5px 5px 0;
	padding: 6px;
	border: 1px dashed transparent;
	clear: left;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

/* Merlin Framework Adjustment */
.postprofile_Left .attachbox {
	float: left;
	clear: left;
}

.attachbox dt {
	text-transform: uppercase;
}

.attachbox dd {
	margin-top: 4px;
	padding-top: 4px;
	clear: left;
	border-top: 1px solid transparent;
	overflow-x: auto;
	overflow-y: hidden;
}

.attachbox dd dd {
	border: none;
}

.attachbox p {
	line-height: 110%;
	clear: left;
}

.attachbox p.stats {
	line-height: 110%;
	clear: left;
}

.attach-image {
	margin: 3px 0;
	max-width: 100%;
}

.attach-image img {
	cursor: default;
}

/* Inline image thumbnails */
div.inline-attachment dl.thumbnail, div.inline-attachment dl.file {
	display: block;
	margin-bottom: 4px;
}

dl.file {
	display: block;
}

dl.file dt {
	text-transform: none;
	margin: 0;
	padding: 0;
}

dl.file dd {
	margin: 0;
	padding: 0;
}

dl.thumbnail img {
	padding: 3px;
	border: 1px solid transparent;
	box-sizing: border-box;
}

dl.thumbnail dt a:hover img {
	border: 1px solid transparent;
}

/* Post poll styles
----------------------------------------*/
fieldset.polls dl {
	border-top: 1px solid transparent;
	padding: 10px 0;
	line-height: 120%;
}

fieldset.polls dt {
	text-align: left;
	float: left;
	display: block;
	width: 30%;
	border-right: none;
	padding: 0;
	margin: 0;
}

fieldset.polls dd {
	float: left;
	width: 10%;
	border-left: none;
	padding: 0 5px;
	margin-left: 0;
}

fieldset.polls dd.resultbar {
	width: 50%;
}

fieldset.polls dd input {
	margin: 2px 0;
}

fieldset.polls dd div {
	text-align: right;
	padding: 2px 2px 0 2px;
	overflow: visible;
	min-width: 8px;
}

.pollbar1, .pollbar2, .pollbar3, .pollbar4, .pollbar5 {
	border-bottom: 1px solid transparent;
	border-right: 1px solid transparent;
}

.vote-submitted {
	text-align: center;
}

/* Poster profile block
----------------------------------------*/
.postprofile {
	margin: 5px 0 10px 0;
	min-height: 80px;
	border: 1px solid transparent;
	border-width: 0 0 0 1px;
	width: 22%;
	float: right;
	display: inline;
	text-align: center;
}

/* Merlin Framework Adjustment */
.postprofile_Left .postprofile {
	border-width: 0 1px 0 0;
	float: left;
}

.postprofile dd, .postprofile dt {
	line-height: 1.2em;
}

/* Merlin Framework Adjustment */
.postprofile_Horizontal .postprofile dt{
	margin-left: 0;
}

.postprofile dd {
	overflow: hidden;
	text-overflow: ellipsis;
}

.postprofile dt.no-profile-rank, .postprofile dd.profile-rank, .postprofile .search-result-date {
	margin-bottom: 10px;
}

.profile-rank img {
	max-width: 160px;
}

/* Post-profile avatars */
.postprofile .has-avatar .avatar-container {
	margin-bottom: 15px;
	overflow: hidden;
}

.postprofile span .avatar {
	display: block;
	max-width: 100%;
	text-align: center; /* gravatar fix */
	margin: 0 auto;
}

.postprofile .avatar img {
	display: block;
	height: auto !important;
	max-width: 100%;
}

dd.profile-contact {
	overflow: visible;
}

.profile-contact .dropdown-container {
	display: inline-block;
}

.profile-contact .icon_contact {
	vertical-align: middle;
}

.profile-contact .dropdown {
	margin-right: -14px;
}

.online {
	background-image: none;
	background-position: 100% 0;
	background-repeat: no-repeat;
}

/* Poster profile used by search*/
.search .postprofile {
	width: 30%;
}

/* Profile used on view-profile */
.profile-avatar img {
	max-width: 100%;
}

/* pm list in compose message if mass pm is enabled */
dl.pmlist dt {
	width: 60% !important;
}

dl.pmlist dt textarea {
	width: 95%;
}

dl.pmlist dd {
	margin-left: 61% !important;
	margin-bottom: 2px;
}

.action-bar div.dl_links {
	padding: 10px 0 0 10px;
}

div.dl_links {
	display: inline-block;
	text-transform: none;
}

.dl_links ul {
	list-style-type: none;
	margin: 0;
	display: inline-block;
}

.dl_links li {
	display: inline-block;
}

.attachment-filename {
	width: 100%;
}

.ellipsis-text {
	display: inline-block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

table.fixed-width-table {
	table-layout: fixed;
}

/* Show scrollbars for items with overflow on iOS devices
----------------------------------------*/
.postbody .content::-webkit-scrollbar, .topicreview::-webkit-scrollbar, .post_details::-webkit-scrollbar, .codebox code::-webkit-scrollbar, .attachbox dd::-webkit-scrollbar, .attach-image::-webkit-scrollbar, .dropdown-extended ul::-webkit-scrollbar {
	width: 8px;
	height: 8px;
	-webkit-appearance: none;
	background: rgba(0, 0, 0, .1);
	border-radius: 3px;
}

.postbody .content::-webkit-scrollbar-thumb, .topicreview::-webkit-scrollbar-thumb, .post_details::-webkit-scrollbar-thumb, .codebox code::-webkit-scrollbar-thumb, .attachbox dd::-webkit-scrollbar-thumb, .attach-image::-webkit-scrollbar-thumb, .dropdown-extended ul::-webkit-scrollbar-thumb {
	background: rgba(0, 0, 0, .3);
	border-radius: 3px;
}

.group-description ol, .group-description ul {
	list-style-position: inside;
}

/* ===== buttons.css ===== */
/* Button Styles
---------------------------------------- */

.button {
	display: inline-block;
	padding: 8px 15px;
	line-height: 1.4;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	-ms-touch-action: manipulation;
	    touch-action: manipulation;
	cursor: pointer;
	-webkit-user-select: none;
	   -moz-user-select: none;
	    -ms-user-select: none;
	        user-select: none;
	border: 1px solid transparent;
}

.post .button {
	padding-top: 6px;
	padding-bottom: 6px;
}

.button:focus,
.button:hover {
 	text-decoration: none;
 	outline: none;
}

.caret {
	position: relative;
	right: -3px;
}

.caret i {
	vertical-align: top;
}

/* Posting page styles
----------------------------------------*/
.button-search,
.button-search-end  {
	float: left;
	border-radius: 0;
	margin: 0;
	padding: 0 9px;
	height: 37px;
}

.button-search-end {
	height: 35px;
	line-height: 35px;
}

.button-search-end {
	border-left-width: 0;
}

.search-header .button-search,
.search-header .button-search-end {
	border-top-width: 0;
	border-bottom-width: 0;
	padding: 6px 7px;
}

.search-header .button-search-end {
	border-right-width: 0;
}

.button-icon-only {
	padding-left: 3px;
	padding-right: 3px;
}

/* Poster contact icons
----------------------------------------*/
.contact-icons.dropdown-contents {
	min-width: 0;
	padding: 0;
}

.contact-icon {
	background-repeat: no-repeat;
	display: block;
	height: 16px;
	width: 16px;
}
.contact-icons a {
	border-bottom: 1px dotted;
	border-right: 1px dotted;
	display: block;
	float: left;
	padding: 8px;
}

.contact-icons .last-cell {
	border-right: none;
}

.contact-icons div:last-child a {
	border-bottom: none;
}

.contact-icons div {
	clear: left;
}

/* Post control buttons
--------------------------------------------- */
.post-buttons {
	float: right;
	list-style: none;
	margin-top: 2px;
}

.has-profile .post-buttons {
	float: none;
	position: absolute;
	margin: 0;
	right: 0;
	top: 5px;
}

.post-buttons > li {
	float: left;
	margin-right: 3px;
}

.post-buttons .button, .format-buttons .button {
	padding-left: 7px;
	padding-right: 7px;
}

.hastouch .post-buttons {
	margin-right: 10px;
}

/* Responsive buttons in post body */
.post-buttons .dropdown {
	top: 18px;
}

.post-buttons .dropdown a {
	display: block;
	text-align: right;
}

.hasjs .postbody .post-buttons {
	max-width: 60%;
}

/* Browser-specific tweaks */
button::-moz-focus-inner {
	padding: 0;
	border: 0;
}

/* Deprecated as of version 3.2
-------------------------------------------------*/
.small-icon {
	background-position: 0 50%;
	background-repeat: no-repeat;
	background-image: none;
}

.dropdown .small-icon {
	background-position: 5px 50%;
	padding: 5px;
}

.small-icon > a {
	padding: 0 0 0 18px;
}

ul.linklist.bulletin > li.small-icon:before {
	display: none;
}

.dropdown .small-icon > a {
	display: block;
}

.rtl .small-icon {
	background-position: 100% 50%;
}

.rtl .small-icon > a {
	padding-left: 0;
	padding-right: 19px;
}

/* ===== cp.css ===== */
/* Control Panel Styles
---------------------------------------- */


/* Main CP box
----------------------------------------*/
.cp-menu {
	float:left;
	width: 19%;
	margin-top: 1em;
	margin-bottom: 5px;
}

.cp-main {
	float: left;
	width: 81%;
}

.cp-main .content {
	padding: 0;
}

.panel-container .panel ol {
	margin-left: 2em;
}

.panel-container .panel li.row {
	border-bottom: 1px solid transparent;
	border-top: 1px solid transparent;
}

ul.cplist {
	margin-bottom: 30px;
	border-top: 1px solid transparent;
}

.panel-container .panel li.header dd, .panel-container .panel li.header dt {
	margin-bottom: 15px;
}

.panel-container table.table1 {
	margin-bottom: 1em;
}

.panel-container table.table1 thead th {
	border-bottom: 1px solid transparent;
	padding: 5px;
}

.panel-container table.table1 tbody th {
	background-color: transparent !important;
	border-bottom: none;
}

.cp-main .pm-message {
	border: 1px solid transparent;
	margin: 10px 0;
	width: auto;
	float: none;
}

.pm-message h2 {
	padding-bottom: 5px;
}

.cp-main .postbody h3, .cp-main .box2 h3 {
	margin-top: 0;
}

.cp-main .buttons {
	margin-left: 0;
}

.cp-main ul.linklist {
	margin: 0;
}

/* MCP Specific tweaks */
.mcp-main .postbody {
	width: 100%;
}

.tabs-container h2 {
	float: left;
	margin-bottom: 0px;
}

/* CP tabs shared
----------------------------------------*/
.tabs, .minitabs {
	line-height: normal;
}

.tabs > ul, .minitabs > ul {
	list-style: none;
	margin: 0;
	padding: 0;
	position: relative;
}

.tabs .tab, .minitabs .tab {
	display: block;
	float: left;
	line-height: 1.4em;
}

.tabs .tab > a, .minitabs .tab > a {
	display: block;
	padding: 8px 14px;
	position: relative;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
}

/* CP tabbed menu
----------------------------------------*/
.tabs {
	margin: 20px 0 0 7px;
}

.tabs .tab > a {
	border: 1px solid transparent;
	margin: 1px 1px 0 0;
}

.tabs .activetab > a {
	margin-top: 0;
	padding-bottom: 9px;
}

/* Mini tabbed menu used in MCP
----------------------------------------*/
.minitabs {
	float: right;
	margin: 15px 7px 0 0;
	max-width: 50%;
}

.minitabs .tab {
	float: right;
}

.minitabs .tab > a {
	border-radius: 5px 5px 0 0;
	margin-left: 2px;
}

.minitabs .tab > a:hover {
	text-decoration: none;
}

/* Responsive tabs
----------------------------------------*/
.responsive-tab {
	position: relative;
}

.responsive-tab > a.responsive-tab-link {
	display: block;
	position: relative;
	width: 16px;
	line-height: 0.9em;
	text-decoration: none;
}

.responsive-tab .responsive-tab-link:before {
	content: '';
	position: absolute;
	left: 10px;
	top: 7px;
	height: .125em;
	width: 14px;
	border-bottom: 0.125em solid transparent;
	border-top: 0.375em double transparent;
}

.tabs .dropdown, .minitabs .dropdown {
	top: 20px;
	margin-right: -2px;
}

.minitabs .dropdown {
	margin-right: -4px;
}

.tabs .dropdown-up .dropdown, .minitabs .dropdown-up .dropdown {
	bottom: 20px;
	top: auto;
}

.tabs .dropdown li {
	text-align: right;
}

.minitabs .dropdown li {
	text-align: left;
}

/* UCP navigation menu
----------------------------------------*/
/* Container for sub-navigation list */
.navigation {
	width: 100%;
	padding-top: 50px;
}

.navigation ul {
	list-style: none;
}

/* Default list state */
.navigation li {
	display: inline;
	margin: 1px 0;
	padding: 0;
}

/* Link styles for the sub-section links */
.navigation a {
	display: block;
	padding: 10px;
	margin: 1px 0;
	text-decoration: none;
}

.navigation a:hover {
	text-decoration: none;
}

/* Preferences pane layout
----------------------------------------*/
.cp-main h2 {
	border-bottom: none;
	padding: 0;
	margin-left: 10px;
}

/* Friends list */
.cp-mini {
	margin: 10px 15px 10px 5px;
	max-height: 200px;
	overflow-y: auto;
	padding: 5px 10px;
	border-radius: 7px;
}

dl.mini dd {
	padding-top: 4px;
}

/* PM Styles
----------------------------------------*/
/* Defined rules list for PM options */
ol.def-rules {
	padding-left: 0;
}

ol.def-rules li {
	line-height: 180%;
	padding: 1px;
}

/* PM marking colours */
.pmlist li.pm_message_reported_colour, .pm_message_reported_colour,
.pmlist li.pm_marked_colour, .pm_marked_colour,
.pmlist li.pm_replied_colour, .pm_replied_colour,
.pmlist li.pm_friend_colour, .pm_friend_colour,
.pmlist li.pm_foe_colour, .pm_foe_colour {
	border: solid 3px transparent;
	border-width: 0 3px;
}

.pm-legend {
	border-left-width: 10px;
	border-left-style: solid;
	border-right-width: 0;
	margin-bottom: 3px;
	padding-left: 3px;
}

/* Avatar gallery */
.gallery label {
	position: relative;
	float: left;
	margin: 10px;
	padding: 5px;
	width: auto;
	border: 1px solid transparent;
	text-align: center;
}

/* Responsive *CP navigation
----------------------------------------*/
@media only screen and (max-width: 900px), only screen and (max-device-width: 900px)
{
	.nojs .tabs a span, .nojs .minitabs a span {
		max-width: 40px;
		overflow: hidden;
		text-overflow: ellipsis;
		letter-spacing: -.5px;
	}

	.cp-menu, .navigation, .cp-main {
		float: none;
		width: auto;
		margin: 0;
	}

	.navigation {
		padding: 0;
		margin: 0 auto;
		max-width: 320px;
	}

	.navigation a {
		background-image: none;
	}

	.navigation li:first-child a {
		border-top-left-radius: 5px;
		border-top-right-radius: 5px;
	}

	.navigation li:last-child a {
		border-bottom-left-radius: 5px;
		border-bottom-right-radius: 5px;
	}
}

/* ===== forms.css ===== */
/* Form Styles
---------------------------------------- */

/* General form styles
----------------------------------------*/
fieldset {
	border-width: 0;
}

input {
	vertical-align: middle;
	padding: 0 3px;
}

input:hover {
	transition:.2s;
}

select {
	cursor: pointer;
	vertical-align: middle;
	border: 1px solid transparent;
	padding: 7px 7px 6px;
}

select:focus {
	outline-style: none;
}

option {
	padding-right: 1em;
}

select optgroup option {
	padding-right: 1em;
}

textarea {
	width: 60%;
	padding: 2px;
	line-height: 1.4em;
}

label {
	cursor: default;
	padding-right: 5px;
}

label input {
	vertical-align: middle;
}

label img {
	vertical-align: middle;
}

/* Definition list layout for forms
---------------------------------------- */
fieldset dl {
	padding: 4px 0;
}

fieldset dt {
	float: left;
	width: 40%;
	text-align: left;
	display: block;
}

.login_form fieldset dt {
	width: 100%;
}

fieldset dd {
	margin-left: 41%;
	vertical-align: top;
	margin-bottom: 3px;
}

/* Specific layout 1 */
fieldset.fields1 dt {
	width: 15em;
	border-right-width: 0;
	padding: 5px 0;
}

fieldset.fields1 dd {
	margin-left: 15em;
	border-left-width: 0;
}

fieldset.fields1 div {
	margin-bottom: 5px;
}

/* Set it back to 0px for the reCaptcha divs: PHPBB3-9587 */
fieldset.fields1 .live-search div {
	margin-bottom: 0;
}

/* Specific layout 2 */
fieldset.fields2 dt {
	width: 15em;
	border-right-width: 0;
	padding: 5px 0;
}

fieldset.fields2 dd {
	margin-left: 16em;
	border-left-width: 0;
}

/* Form elements */
dt label {
	text-align: left;
}

dd label {
	white-space: nowrap;
}

dd input, dd textarea {
	margin-right: 3px;
}

dd select {
	width: auto;
}

dd select[multiple] {
	width: 100%;
}

dd textarea {
	width: 85%;
}

/* Hover effects */
.timezone {
	width: 95%;
}

/* Browser-specific tweaks */
button::-moz-focus-inner {
	padding: 0;
	border: 0;
}

/* Quick-login on index page */
fieldset.quick-login {
	margin-top: 5px;
}

fieldset.quick-login input {
	width: auto;
}

fieldset.quick-login input.inputbox {
	width: 15%;
	vertical-align: middle;
	margin-right: 5px;
}

fieldset.quick-login label {
	white-space: nowrap;
	padding-right: 2px;
}

/* Display options on viewtopic/viewforum pages  */
fieldset.display-options {
	text-align: center;
	margin: 3px 0 5px 0;
}

fieldset.display-options label {
	white-space: nowrap;
	padding-right: 2px;
}

fieldset.display-options a {
	margin-top: 3px;
}

.dropdown fieldset.display-options {
	margin: 0;
	padding: 0;
}

.dropdown fieldset.display-options label {
	display: block;
	margin: 4px;
	padding: 0;
	text-align: right;
	white-space: nowrap;
}

.dropdown fieldset.display-options select {
	min-width: 120px;
}

/* Display actions for ucp and mcp pages */
fieldset.display-actions {
	text-align: right;
	line-height: 2em;
	white-space: nowrap;
	padding-right: 1em;
}

fieldset.display-actions label {
	white-space: nowrap;
	padding-right: 2px;
}

fieldset.sort-options {
	line-height: 2em;
}

/* MCP forum selection*/
fieldset.forum-selection {
	margin: 5px 0 3px 0;
	float: right;
}

fieldset.forum-selection2 {
	margin: 13px 0 3px 0;
	float: right;
}

/* Submit button fieldset */
fieldset.submit-buttons {
	text-align: center;
	vertical-align: middle;
	margin: 5px 0;
}

fieldset.submit-buttons input {
	vertical-align: middle;
}

/* Posting page styles
----------------------------------------*/

/* Buttons used in the editor */
.format-buttons {
	margin: 15px 0 2px 0;
}

.format-buttons input, .format-buttons select {
	vertical-align: middle;
}

/* Main message box */
.message-box {
	width: 80%;
}

.message-box textarea {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;	
	width: 450px;
	height: 270px;
	min-width: 100%;
	max-width: 100%;
	resize: vertical;
	outline: 3px dashed transparent;
	outline-offset: -4px;
	-webkit-transition: all .5s ease;
	-moz-transition: all .5s ease;
	-ms-transition: all .5s ease;
	-o-transition: all .5s ease;
	transition: all .5s ease;
}

/* Emoticons panel */
.smiley-box {
	width: 18%;
	float: right;
}

.smiley-box img {
	margin: 3px;
}

/* Input field styles
---------------------------------------- */
.inputbox {
	border: 1px solid transparent;
	padding: 7px;
}

.inputbox:hover, .inputbox:focus {
	border: 1px solid transparent;
	outline-style: none;
}

input.inputbox	{
	width: 85%;
	box-sizing: border-box;
}

.login_container input.inputbox,
.profile_widget input.inputbox {
	width: 100%;
}

input.medium	{ width: 50%; }
input.narrow	{ width: 25%; }
input.tiny	{ width: 150px; }
input.sidebar_search { width: 225px; }

textarea.inputbox {
	width: 85%;
}

.autowidth {
	width: auto !important;
}

input[type="number"] {
	-moz-padding-end: 0;
}

input[type="search"] {
	-webkit-appearance: textfield;
	-webkit-box-sizing: content-box;
}

input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-results-button, input[type="search"]::-webkit-search-results-decoration {
	display: none;
}

input[type="search"]::-webkit-search-cancel-button {
	cursor: pointer;
}

/* Form button styles
---------------------------------------- */
a.button1, input.button1, input.button3, a.button2, input.button2 {
	width: auto !important;
	padding: 7px;
	background: transparent none repeat-x top left;
	line-height: 1.5;
}

a.button1, input.button1 {
	border: 1px solid transparent;
}

input.button3 {
	padding: 0;
	margin: 0;
	line-height: 5px;
	height: 12px;
	background-image: none;
}

input[type="button"], input[type="submit"], input[type="reset"], input[type="checkbox"], input[type="radio"], .search-results li {
	cursor: pointer;
}

/* Alternative button */
a.button2, input.button2, input.button3 {
	border: 1px solid transparent;
}

/* <a> button in the style of the form buttons */
a.button1, a.button2 {
	text-decoration: none;
	padding: 7px;
	vertical-align: text-bottom;
}

/* Hover states */
a.button1:hover, input.button1:hover, a.button2:hover, input.button2:hover, input.button3:hover {
	border: 1px solid transparent;
}

/* Focus states */
input.button1:focus, input.button2:focus, input.button3:focus {
	outline-style: none;
}

/* Topic and forum Search */
.search-box {
	float: left;
}

.search-box .inputbox {
	background-image: none;
	border-right-width: 0;
	float: left;
	padding: 0 8px;
	height: 37px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-border-radius:0;
    border-radius:0;
}

/* Search box (header)
--------------------------------------------- */
.search-header {
	border-radius: 4px;
	display: block;
	float: right;
	margin-right: 5px;
	margin-top: 50px;
}

.search-header .inputbox {
	border: 0;
	-webkit-border-radius:0;
    border-radius:0;
}

li.responsive-search { display: none; }

input.search {
	background-image: none;
	background-repeat: no-repeat;
	background-position: left 1px;
	padding-left: 17px;
}

.full { width: 95%; }
.medium { width: 50%;}
.narrow { width: 25%;}
.tiny { width: 10%;}

/* ===== icons.css ===== */
/* --------------------------------------------------------------
	$Icons
-------------------------------------------------------------- */

/* Global module setup
--------------------------------*/

/* Renamed version of .fa class for agnostic usage of icon fonts.
 * Just change the name of the font after the 14/1 to the name of
 * the font you wish to use.
 */
.icon, .button .icon  {
	display: inline-block;
  	font-weight: normal;
  	font-style: normal;
  	font-variant: normal;
  	font-family: FontAwesome;
  	font-size: 14px;
  	line-height: 1;
  	text-rendering: auto; /* optimizelegibility throws things off #1094 */
  	-webkit-font-smoothing: antialiased;
  	-moz-osx-font-smoothing: grayscale;
}

.icon:before { padding-right: 2px; }

.button .icon:before {
	padding-right: 0;
}

/* Icon size classes - Default size is 14px, use these for small variations */

.icon.icon-xl {
	font-size: 20px;
}

.icon.icon-lg {
	font-size: 16px;
}

.icon.icon-md {
	font-size: 10px;
}

.icon.icon-sm {
	font-size: 8px;
}

/* icon modifiers */
.icon-tiny {
	width: 12px;
	transform: scale(0.65, 0.75);
	vertical-align: text-bottom;
	font-size: 16px;
}

.arrow-left .icon {
	float: left;
}

.arrow-left:hover .icon {
	margin-left: -5px;
	margin-right: 5px;
}

.arrow-right .icon {
	float: right;
}

.arrow-right:hover .icon {
	margin-left: 5px;
	margin-right: -5px;
}

.post-buttons .dropdown-contents .icon {
    float: right;
    margin-left: 5px;
}

.alert_close .icon:before {
	padding: 0;
    border-radius: 50%;
    width: 11px;
    display: block;
    line-height: .9;
    height: 12px;
}

/* ===== colours.css ===== */
/*
--------------------------------------------------------------
Colours and backgrounds for common.css
-------------------------------------------------------------- */

html, body {
	color: rgba(0,0,0,.4);
	background-color: #ECF0F1;
}

body {
	background-color: transparent; /* Required for parallax */
}

h1 {
	color: #FFFFFF;
}

h2 {
	color: #28313F;
}

h3 {
	border-bottom-color: #CCCCCC;
}

hr {
	border-color: #FFFFFF;
	border-top-color: #CCCCCC;
}

/*
--------------------------------------------------------------
Colours and backgrounds for links.css
-------------------------------------------------------------- */

a { color: #676767; }
a:hover { transition:.2s; }

a.forumtitle, a.topictitle {
	color: #303030;
}

body.high_contrast_links .navbar_footer a,
body.high_contrast_links .copyright_bar a {
	color: #CCCCCC !important;
}

/* Links on gradient backgrounds */
body.content_block_header_block .forumbg .header a, body.content_block_header_block .forabg .header a, th a {color: #FFFFFF;}
body.content_block_header_block .forumbg .header a:hover, body.content_block_header_block .forabg .header a:hover, th a:hover {color: #FFFFFF;}

/* Links on light backgrounds */

/* Notification mark read link */
.dropdown-extended a.mark_read {
	background-color: #FFFFFF;
}

/* Post body links */
.postlink {

}

.postlink:visited {

}

.postlink:hover {

}

.signature a, .signature a:hover {
	background-color: transparent;
}

/* Back to top of page */
.top i {
	color: #999999;
}

/* Arrow links  */
.arrow-left:hover, .arrow-right:hover {
	color: #368AD2;
}

/* Round cornered boxes and backgrounds
---------------------------------------- */
.wrap {
}

.headerbar {
	color: #FFFFFF;
}

.headerbar {
}

.forabg, .forumbg, .viewtopic_wrapper {
	background-color: rgba(0,0,0,.025);
}

.navbar {
	background-color: #2D3039;
}

.navbar_in_header {
	background: none;
}

.navbar a {
	color: #bec4c9;
}

.navbar_in_header ul.linklist > li > a {
	color: #FFFFFF;
	text-shadow: 0 1px 1px rgba(0,0,0,0.5);
}

.panel {
	background-color: #F9F9F9;
}

.post:target .content {
	color: #000000;
}

.post h3 a.first-unread,
.post:target h3 a {
	color: #000000;
}

.bg1 {
	background-color: #FFFFFF;
}

table.zebra-list tr:nth-child(odd) td, ul.zebra-list li:nth-child(odd) {
	background-color: #FFFFFF;
}

.bg2 {
	background-color: #FFFFFF;
}

table.zebra-list tr:nth-child(even) td, ul.zebra-list li:nth-child(even) {
	background-color: #FFFFFF;
}

.bg3	{
	background-color: #F9F9F9;
}

.ucprowbg {
	background-color: #DCDEE2;
}

.fieldsbg {
	background-color: #E7E8EA;
}

.site_logo {
	background-image: url("./images/logo.webp");
}

/* Horizontal lists
----------------------------------------*/

ul.navlinks {
	border-top-color: #FFFFFF;
}

/* Table styles
----------------------------------------*/
table.table1 thead th {
	color: #FFFFFF;
}

table.table1 tbody tr {
	border-color: #BFC1CF;
}

table.table1 td {
	color: #536482;
}

table.table1 tbody td {
	border-top-color: #FAFAFA;
}

table.table1 tbody th {
	border-bottom-color: #000000;
	color: #333333;
	background-color: #FFFFFF;
}

table.info tbody th {
	color: #000000;
}

/* Misc layout styles
---------------------------------------- */
dl.details dt {
	color: #000000;
}

dl.details dd {
	color: #536482;
}

.sep {
	color: #1198D9;
}

/* Icon styles
---------------------------------------- */
.icon.icon-blue, a:hover .icon.icon-blue {
	color: #196db5;
}

.icon.icon-green, a:hover .icon.icon-green{
	color: #1b9A1B;
}

.icon.icon-red, a:hover .icon.icon-red {
	color: #BC2A4D;
}

.icon.icon-orange, a:hover .icon.icon-orange{
	color: #FF6600;
}

.icon.icon-bluegray, a:hover .icon.icon-bluegray{
	color: #536482;
}

.icon.icon-gray, a:hover .icon.icon-gray{
	color: #777777;
}

.icon.icon-lightgray, a:hover .icon.icon-lightgray{
	color: #999999;
}

.icon.icon-black, a:hover .icon.icon-black{
	color: #333333;
}

.alert_close .icon:before {
	background-color: #FFFFFF;
}

/* Jumpbox */
.jumpbox .dropdown li {
	border-top-color: #CCCCCC;
}

.jumpbox-cat-link {
	color: #FFFFFF;
}

.jumpbox-cat-link:hover {
	border-top-color: #12A3EB;
	color: #FFFFFF;
}

.jumpbox-forum-link {
	background-color: #E1EBF2;
}

.jumpbox-forum-link:hover {
	background-color: #F6F4D0;
}

.jumpbox .dropdown .pointer-inner {
	border-color: #E1EBF2 transparent;
}

.jumpbox-sub-link {

}

.jumpbox-sub-link:hover {
}

/* Miscellaneous styles
---------------------------------------- */

.copyright {
	color: #555555;
}

.error {
	color: #BC2A4D;
}

.reported {
	background-color: #F7ECEF !important;
}

li.reported:hover {
	background-color: #ECD5D8 !important;
}
.sticky, .announce {
	/* you can add a background for stickies and announcements*/
}

div.rules {
	background-color: #ECD5D8;
	color: #BC2A4D;
}

div.rules a {
	color: #AA0000 !important;
	border-color: #AA0000 !important;
	font-weight: 500;
}

p.post-notice {
	background-color: #ECD5D8;
	background-image: none;
	border-color: #BC2A4D;
}

/*
--------------------------------------------------------------
Colours and backgrounds for content.css
-------------------------------------------------------------- */

ul.forums {
}

ul.topiclist li {
}

ul.topiclist dd {
	border-left-color: #FFFFFF;
}

.rtl ul.topiclist dd {
	border-right-color: #FFFFFF;
	border-left-color: transparent;
}

li.row,
.panel-container .panel li.row {border-bottom-color:  #ECF0F1; background-color: #FFFFFF;}
.forumlist_grid dl.row-item {border-bottom: 1px solid #ECF0F1;}


li.row strong {
	color: #000000;
}

li.row:hover {

}

li.row:hover dd {
	border-left-color: #CCCCCC;
}

.rtl li.row:hover dd {
	border-right-color: #CCCCCC;
	border-left-color: transparent;
}

body.content_block_header_block li.header dt, body.content_block_header_block li.header dd {
	color: #FFFFFF;
}

/* Post body styles
----------------------------------------*/
.postbody {
	color: #333333;
}

/* Content container styles
----------------------------------------*/
.content {
	color: #333333;
}

.content h2, .panel h2 {
	border-bottom-color:  #CCCCCC;
}

dl.faq dt {
	color: #333333;
}

.posthilit {
	background-color: #F3BFCC;
	color: #BC2A4D;
}

.announce, .unreadpost {
	/* Highlight the announcements & unread posts box */
}

/* Post signature */
.signature {
	border-top-color: #ECF0F1;
}

/* Post noticies */
.notice {
	border-top-color:  #CCCCCC;
}

/* BB Code styles
----------------------------------------*/
/* Quote block */
blockquote {
	background-color: #F8F8F8;
}


blockquote blockquote {
	/* Nested quotes */
	background-color:#FFFFFF;
}

blockquote blockquote blockquote {
	/* Nested quotes */
	background-color: #F8F8F8;
}

/* Code block */
.codebox {
	background-color: transparent;
	border-color: #C9D2D8;
}

.codebox p {
	border-bottom-color:  #CCCCCC;
}

.codebox code {
	color: #2E8B57;
	background-color: #F8F8F8;
	border-left: 3px solid;
}

/* Attachments
----------------------------------------*/
.attachbox {
	background-color: #FFFFFF;
	border-color:  #C9D2D8;
}

.pm-message .attachbox {
	background-color: #F2F3F3;
}

.attachbox dd {
	border-top-color: #C9D2D8;
}

.attachbox p {
	color: #666666;
}

.attachbox p.stats {
	color: #666666;
}

.attach-image img {
	border-color: #999999;
}

/* Inline image thumbnails */

dl.file dd {
	color: #666666;
}

dl.thumbnail img {
	border-color: #666666;
	background-color: #FFFFFF;
}

dl.thumbnail dd {
	color: #666666;
}

dl.thumbnail dt a:hover {
	background-color: #EEEEEE;
}

dl.thumbnail dt a:hover img {
	border-color: #368AD2;
}

/* Post poll styles
----------------------------------------*/

fieldset.polls dl {
	border-top-color: #DCDEE2;
}

fieldset.polls dl.voted {
	color: #000000;
}

fieldset.polls dd div {
	color: #FFFFFF;
}

.rtl .pollbar1, .rtl .pollbar2, .rtl .pollbar3, .rtl .pollbar4, .rtl .pollbar5 {
	border-right-color: transparent;
}

.pollbar1 {
	background-color: #AA2346;
	border-bottom-color: #74162C;
	border-right-color: #74162C;
}

.rtl .pollbar1 {
	border-left-color: #74162C;
}

.pollbar2 {
	background-color: #BE1E4A;
	border-bottom-color: #8C1C38;
	border-right-color: #8C1C38;
}

.rtl .pollbar2 {
	border-left-color: #8C1C38;
}

.pollbar3 {
	background-color: #D11A4E;
	border-bottom-color: #AA2346;
	border-right-color: #AA2346;
}

.rtl .pollbar3 {
	border-left-color: #AA2346;
}

.pollbar4 {
	background-color: #E41653;
	border-bottom-color: #BE1E4A;
	border-right-color: #BE1E4A;
}

.rtl .pollbar4 {
	border-left-color: #BE1E4A;
}

.pollbar5 {
	background-color: #F81157;
	border-bottom-color: #D11A4E;
	border-right-color: #D11A4E;
}

.rtl .pollbar5 {
	border-left-color: #D11A4E;
}

/* Poster profile block
----------------------------------------*/
.post {
	border-color: #ECF0F1;
}

.postprofile {
	color: #666666;
	border-color: #FFFFFF;
}

.pm .postprofile {
	border-color: #DDDDDD;
}

.postprofile strong {
	color: #000000;
}

.online {
	background-image: url("./en/icon_user_online.gif");
}

dd.profile-warnings {
	color: #BC2A4D;
}

/*
--------------------------------------------------------------
Colours and backgrounds for buttons.css
-------------------------------------------------------------- */
.button {
	border-color: #edecec;
	background-color: #F7F7F7; /* Old browsers */ /* FF3.6+ */
	color: #333333;
}

.panel .button {
	background-color: #FFFFFF;
}


.button:hover,
.button:focus {

}


.button .icon,
.button-secondary {
	color: #8f8f8f;
}

.button-search:hover,
.button-search-end:hover {
	border-color: #C7C3BF;
}

.caret	{ border-color: #DADADA; }
.caret	{ border-color: #C7C3BF; }

.contact-icons a		{ border-color: #DCDCDC; }
.contact-icons a:hover	{ background-color: #F2F6F9; }

/* Pagination
---------------------------------------- */

.pagination li a {
	filter: none;
	box-shadow: none;
	-webkit-box-shadow: none;
	color: #5C758C;
}

.pagination li a:hover, .pagination li a:hover .icon, .pagination li a:focus {
	color: #FFFFFF;
	text-shadow: none;
}

.pagination li.ellipsis span {
	background: transparent;
	color:	#000000;
}

.pagination li.active span {
	color: #FFFFFF;
}

.pagination .dropdown-visible a.dropdown-trigger, .nojs .pagination .dropdown-container:hover a.dropdown-trigger {
	background: #368AD2;
	border-color: #368AD2;
	filter: none;
	color: #FFFFFF;
	text-shadow: none;
}

/* Search box
--------------------------------------------- */

.search-box .inputbox,
.search-box .inputbox:hover,
.search-box .inputbox:focus {

}

.search-header {

}

/*
--------------------------------------------------------------
Colours and backgrounds for cp.css
-------------------------------------------------------------- */

/* Main CP box
----------------------------------------*/


.panel-container .panel li.row {
}

ul.cplist {
	border-top-color: #B5C1CB;
}

.content_block_header_block .panel-container .panel li.header dd, .content_block_header_block .panel-container .panel li.header dd a, .content_block_header_block .panel-container .panel li.header dt, .content_block_header_block .panel-container .panel li.header dt a {
	color: #FFFFFF;
}

.panel-container table.table1 thead th {
	color: #FFFFFF;
	border-bottom-color: #333333;
}

.cp-main .pm-message {
	border-color: #DBDEE2;
	background-color: #FFFFFF;
}

/* CP tabbed menu
----------------------------------------*/
.tabs .tab > a {
	background: #ecf0f1;
	color: #536482;
}

.tabs .tab > a:hover {
	background: #F9F9F9;
}

.tabs .activetab > a,
.tabs .activetab > a:hover {
	background-color: #F9F9F9;
	border-color: #F9F9F9;
}

.tabs .activetab > a:hover {
	color: #000000;
}

/* Mini tabbed menu used in MCP
----------------------------------------*/
.minitabs .tab > a {
	background-color: #E1EBF2;
}

.minitabs .activetab > a,
.minitabs .activetab > a:hover {
	background-color: #FFFFFF;
	color: #333333;
}

/* Responsive tabs
----------------------------------------*/
.responsive-tab .responsive-tab-link:before {
	border-color: #536482;
}

.responsive-tab .responsive-tab-link:hover:before {
	border-color: #D31141;
}

/* UCP navigation menu
----------------------------------------*/

/* Link styles for the sub-section links */
.navigation a {
	color: #333;
	background: #ecf0f1;
}

.rtl .navigation a {
	background: #ecf0f1;
}

.navigation a:hover {
	background: #FFFFFF;
}

.navigation .active-subsection a {
	background: #FFFFFF;
}

.navigation .active-subsection a, .navigation .active-subsection a:hover {
}



/* Preferences pane layout
----------------------------------------*/
.panel-container h2 {
	color: #333333;
}

.panel-container .panel {
	background-color: #FFFFFF;
}

.cp-main .pm {
	background-color: #FFFFFF;
}

/* Friends list */
.cp-mini {
	background-color: #F9F9F9;
}

dl.mini dt {
	color: #425067;
}

/* PM Styles
----------------------------------------*/
/* PM Message history */
.current {
}

/* PM marking colours */
.pmlist li.pm_message_reported_colour, .pm_message_reported_colour {
	border-left-color: #BC2A4D;
	border-right-color: #BC2A4D;
}

.pmlist li.pm_marked_colour, .pm_marked_colour {
	border-color: #FF6600;
}

.pmlist li.pm_replied_colour, .pm_replied_colour {
	border-color: #A9B8C2;
}

.pmlist li.pm_friend_colour, .pm_friend_colour {
	border-color: #5D8FBD;
}

.pmlist li.pm_foe_colour, .pm_foe_colour {
	border-color: #000000;
}

/* Avatar gallery */
.gallery label {
	background: #FFFFFF;
	border-color: #CCC;
}

.gallery label:hover {
	background-color: #EEE;
}

/*
--------------------------------------------------------------
Colours and backgrounds for forms.css
-------------------------------------------------------------- */

/* General form styles
----------------------------------------*/
select {
	border-color: #edecec;
	background-color: #F7F7F7;
}

option.disabled-option {
	color: graytext;
}

/* Definition list layout for forms
---------------------------------------- */
dd label {
	color: #333;
}

fieldset.fields1 {
	background-color: transparent;
}

/* Hover effects */
fieldset dl:hover dt label {
	color: #000000;
}

fieldset.fields2 dl:hover dt label {
	color: inherit;
}

/* Quick-login on index page */
fieldset.quick-login input.inputbox {
	background-color: #F2F3F3;
}

/* Posting page styles
----------------------------------------*/

.message-box textarea {
	color: #333333;
}

.message-box textarea.drag-n-drop {
	outline-color: rgba(102, 102, 102, 0.5);
}

.message-box textarea.drag-n-drop-highlight {
	outline-color: rgba(17, 163, 234, 0.5);
}

/* Input field styles
---------------------------------------- */
.inputbox {
	background-color: #F7F7F7;
	border-color: #edecec;
	color: #333333;
}

.panel .inputbox {
	background-color: #FFFFFF;
}

.inputbox[type=text], .inputbox[type=password], input[type=submit] {
	-webkit-appearance: none;
	-webkit-border-radius: 0;
}

.inputbox:-moz-placeholder {
	color: #333333;
}

.inputbox::-webkit-input-placeholder {
	color: #333333;
}

.inputbox:hover, .inputbox:focus {

}

.inputbox:focus:-moz-placeholder {
	color: transparent;
}

.inputbox:focus::-webkit-input-placeholder {
	color: transparent;
}


/* Form button styles
---------------------------------------- */

a.button1, input.button1, input.button3, a.button2, input.button2 {
	color: #717171;
	background-color: #F7F7F7;
	border-color: #D9D9D9;
}

input.button3 {
	background-image: none;
}

/* Hover states */
a.button1:hover, input.button1:hover, a.button2:hover, input.button2:hover, input.button3:hover {
	color: #FFFFFF;
}

/* Focus states */
input.button1:focus, input.button2:focus, input.button3:focus {
	color: #FFFFFF;
}

input.disabled {
	color: #666666;
}

/* Approve and unapprove */
.button_approve, .button_disapprove {
	color: #FFFFFF !important;
}

.button_approve {background: #27ae60 !important;}
.button_disapprove {background: #e74c3c !important;}




/* jQuery popups
---------------------------------------- */
.phpbb_alert {
	background-color: #FFFFFF;
	border-color: #999999;
}
.darken {
	background-color: #000000;
}

.loading_indicator {
	background-color: #000000;
	background-image: url("./images/loading.gif");
}

.dropdown-extended ul li {
	border-top-color: #B9B9B9;
}

.dropdown-extended ul li:hover {
	color: #000000;
}

.dropdown-extended .header, .dropdown-extended .footer {
	border-color: #B9B9B9;
	color: #000000;
}

.dropdown-extended .footer {
	border-top-style: solid;
	border-top-width: 1px;
}

.dropdown-extended .header {
	background-color: #FFFFFF;
}

.dropdown .pointer {
	border-color: #B9B9B9 transparent;
}

.dropdown .pointer-inner {
	border-color: #FFF transparent;
}

.dropdown-extended .pointer-inner {
	border-color: #FFFFFF transparent;
}

.dropdown .dropdown-contents {
	background: #fff;
	border-color: #B9B9B9;
	box-shadow: 1px 3px 5px rgba(0, 0, 0, 0.2);
}

.dropdown-up .dropdown-contents {
	box-shadow: 1px 0 5px rgba(0, 0, 0, 0.2);
}

.dropdown li, .dropdown li li {
	border-color: #DCDCDC;
}

.dropdown li.separator {
	border-color: #DCDCDC;
}

/* Notifications
---------------------------------------- */

.notification_list p.notification-time {
	color: #4C5D77;
}

li.notification-reported strong, li.notification-disapproved strong {
	color: #D31141;
}

.badge {
	color: #ffffff !important;
}

.navbar_in_header .badge {
	background: #D31141;
}

/*
--------------------------------------------------------------
Colours and backgrounds for merlin.css
-------------------------------------------------------------- */

/* Headerbar
---------------------------------------- */
.headerbar_overlay {}

.headerbar_overlay_darken {
	background-color: rgba(0,0,0,0.6);
}

/* Global Containers
---------------------------------------- */
.fancy_panel {
	background-color: #FFF;
}

body.content_block_header_stripe li.header {
	background-color: #FFFFFF;
}

.alt_block li.header dt, .alt_block .collapse-trigger a {
	color: #FFFFFF;
}


/* Sidebar and Profile widgets
---------------------------------------- */


/* Grid Forumlist
---------------------------------------- */
.grid_desc {
	background: #FFFFFF;
}

.forumlist_grid .grid_image_container {
	background: #FFFFFF;
}

.forumlist_grid .grid_colour_overlay {
	color: #FFFFFF;
	text-shadow: 0 1px 3px rgba(0,0,0,0.4);
}

.forumlist_grid ul.forums li.row {
	background: none;
}

.forumlist_grid.grid_tile_full .grid_image_container {
	background-color: #1D1F25;
}

.forumlist_grid.grid_tile_full a.tile_inner,
.forumlist_grid.grid_tile_full .mini_number {
	color: #FFFFFF;
}

.forumlist_grid.grid_tile_full .forum_description,
.forumlist_grid.grid_tile_full .forum_description strong,
.forumlist_grid.grid_tile_full .mini_label {
	color: rgba(255,255,255,1);
}

.forumlist_grid.grid_tile_full .tile_row_2::before {
	display: none;
}


/* Custom Login Page
---------------------------------------- */
.login_container_left_section_content {
	-webkit-box-shadow: 0px 15px 30px 0px rgba(0,0,0,0.27);
	-moz-box-shadow: 0px 15px 30px 0px rgba(0,0,0,0.27);
	box-shadow: 0px 15px 30px 0px rgba(0,0,0,0.27);
}

/* Postprofile Things
---------------------------------------- */
.online_indicator {
	color: #84BD00;
}

/* Social Links
---------------------------------------- */
.social_links_footer a span {
	color: #FFFFFF;
}

.social_links_footer a:hover span {
	background-color: #FFFFFF;
	border-color: #FFFFFF;
}

/* Scroll to Top
---------------------------------------- */
a.scrollToTop, a.scrollTopTop:hover {
	color: #FFFFFF !important;
}

/* Collapsible Panels
---------------------------------------- */
body.content_block_header_block .forabg .collapse-trigger a,
body.content_block_header_block .forumbg .collapse-trigger a,
body.content_block_header_block .sidebar_box .collapse-trigger a,
body.content_block_header_block .forabg .collapse-trigger a:hover,
body.content_block_header_block .forumbg .collapse-trigger a:hover,
body.content_block_header_block .sidebar_box .collapse-trigger a:hover,
body.content_block_header_block .forabg .collapse-trigger a:focus,
body.content_block_header_block .forumbg .collapse-trigger a:focus,
body.content_block_header_block .sidebar_box .collapse-trigger a:focus {
	color: #FFFFFF;
}


/* Missing Avatar Placeholder
---------------------------------------- */
a.no_avatar, a.no_avatar:hover {
	color: #FFFFFF;
	text-shadow: 0 1px 3px rgba(0,0,0,0.5);
}

/* Footer Bars
---------------------------------------- */
.navbar_footer {
	background-color: #2D3039;
	color: #A4A4A7;
}

.copyright_bar {
	background-color: #1D1F25;
	color: #A4A4A7;
}

/* Index and Permissions Blocks (and sidebar, probably)
---------------------------------------- */
.alt_block li.header {
	background: #343840 !important;
}


/* Misc
---------------------------------------- */
.topic_type, .grid_unread {
	color: #FFFFFF;
}

.topic_type a {
	color: #AA0000 !important;
}

.sidebar_content, .profile_widget_list, .login_form_forgot_link, .forumlist_grid_block_stats {
	border-top-color: #ECF0F1;
}

p.author, p.author a {
	color: #bec4c9;
}

.dropdown-contents > li > a:hover {
	color: #FFFFFF;
	text-decoration: none;
}

.viewtopic_wrapper .phpbb-ads-center {
	background: #FFFFFF;
}
/* Quitar la flecha separadora entre breadcrumbs */
#nav-breadcrumbs .crumb + .crumb:before {
    content: none !important;
}
/* Breadcrumb spacing */
#nav-breadcrumbs .crumb + .crumb {
    margin-left: 0.5em; /* Ajusta el espacio entre elementos */
}
/* Asegura que el contenedor del logo se ajuste al tamaño de la imagen */
#site-description .site_logo {
    display: inline-block;
    width: 234px;  /* Ancho de tu logo */
    height: 95px;  /* Alto de tu logo */
    background-size: contain !important; /* Ajusta la imagen al contenedor */
    background-repeat: no-repeat;
    background-position: center;
}

/* Si tu FORUM_LOGO es un <img> dentro de .site_logo */
#site-description .site_logo img {
    width: 234px;
    height: 95px;
    object-fit: contain;
    display: block;
}
.forum_header {
    background-image: url('{FORUM_HEADER}');
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: auto; /* mantiene tamaño original */
    height: 300px; /* altura de tu imagen */
}

/* ===== responsive.css ===== */
/* Responsive Design
---------------------------------------- */

@media (max-width: 320px) {
	select, .inputbox {
		max-width: 240px;
	}
}

/* Notifications list
----------------------------------------*/
@media (max-width: 350px) {
	.dropdown-extended .dropdown-contents {
		width: auto;
	}
}

@media (max-width: 430px) {
	.action-bar .search-box .inputbox {
		width: 120px;
	}

	.section-viewtopic .search-box .inputbox {
		width: 57px;
	}
}

@media (max-width: 500px) {
	dd label {
		white-space: normal;
	}

	select, .inputbox {
		/* max-width: 260px; */
	}

	.captcha-panel dd.captcha {
		margin-left: 0;
	}

	.captcha-panel dd.captcha-image img {
		width: 100%;
	}

	dl.details dt, dl.details dd {
		width: auto;
		float: none;
		text-align: left;
	}

	dl.details dd {
		margin-left: 20px;
	}

	p.responsive-center {
		float: none;
		text-align: center;
		margin-bottom: 5px;
	}

	.action-bar > div {
		margin-bottom: 5px;
 	}

	.action-bar > .pagination {
		float: none;
		clear: both;
		padding-bottom: 1px;
		text-align: center;
	}

	.action-bar > .pagination li.page-jump {
		margin: 0 2px;
	}

	p.jumpbox-return {
		display: none;
	}

	.display-options > label:nth-child(1) {
		display: block;
		margin-bottom: 5px;
	}

	.attach-controls {
		margin-top: 5px;
		width: 100%;
	}

	.quick-links .dropdown-trigger span {
		display: none;
	}
}

@media (max-width: 550px) {
	ul.topiclist.forums dt {
		margin-right: 0;
	}

	ul.topiclist.forums dt .list-inner {
		margin-right: 0;
	}

	ul.topiclist.forums dd.lastpost {
		display: none;
	}
}

@media (max-width: 700px) {
	.responsive-hide { display: none !important; }
	.responsive-show { display: block !important; }
	.responsive-show-inline { display: inline !important; }
	.responsive-show-inline-block { display: inline-block !important; }

	/* Content wrappers
	----------------------------------------*/
	html {
		height: auto;
	}

	body {
		padding: 0;
	}

	.wrap {
		border: none;
		border-radius: 0;
		margin: 0;
		padding: 0;
		width: 100%;
		min-width: 290px;
		overflow: hidden;
		
	}
	
	.body-layout-Fluid #inner-wrap {
		width: 100%;
		padding: 10px
	}

	#inner-wrap {
		padding: 30px 5px;
	}

	/* Common block wrappers
	----------------------------------------*/
	.headerbar {
		background-size: cover !important;
	}
	
	.headerbar, .navbar, .forabg, .forumbg, .post, .panel {
		border-radius: 0;
		/* margin-left: -5px;
		margin-right: -5px; */
	}

	.cp-main .forabg, .cp-main .forumbg, .cp-main .post, .cp-main .panel {
		border-radius: 7px;
	}

	/* Logo block
	----------------------------------------*/
	.site-description {
		float: none;
		width: auto;
		text-align: center;
	}

	.logo {
		display: block;
		float: none;
		padding: 0;
	}
	
	.site_logo {
		margin: 50px 0 0 0;
	}

	.site-description h1, .site-description p {
		text-align: inherit;
		float: none;
		line-height: 1.2em;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	.site-description p, .search-header {
		display: none;
	}

	/* Responsive fix for header left/right alignment */
	.site-description.logo_left,
	.site-description.logo_right {
		margin-left: 0 !important;
		margin-right: 0 !important;
		text-align: center;
	}

	/* Navigation
	----------------------------------------*/
	.headerbar + .navbar {
		margin-top: -5px;
	}

	/* Search
	----------------------------------------*/
	.responsive-search { display: block !important; }

	/* .topiclist lists
	----------------------------------------*/
	li.header dt {
		text-align: center;
		text-transform: none;
		line-height: 1em;
		font-size: 1.2em;
		padding-bottom: 4px;
	}

	ul.topiclist li.header dt, ul.topiclist li.header dt .list-inner {
		margin-right: 0 !important;
		padding-right: 0;
	}

	ul.topiclist li.header dd {
		display: none !important;
	}

	ul.topiclist dt, ul.topiclist dt .list-inner,
	ul.topiclist.missing-column dt, ul.topiclist.missing-column dt .list-inner,
	ul.topiclist.two-long-columns dt, ul.topiclist.two-long-columns dt .list-inner,
	ul.topiclist.two-columns dt, ul.topiclist.two-columns dt .list-inner {
		margin-right: 0;
	}

	ul.topiclist dt .list-inner.with-mark {
		padding-right: 34px;
	}

	ul.topiclist dt .list-inner {
		min-height: 28px;
	}

	ul.topiclist li.header dt .list-inner {
		min-height: 0;
	}

	ul.topiclist dd {
		display: none;
	}
	ul.topiclist dd.mark {
		display: block;
	}

	/* Forums and topics lists
	----------------------------------------*/
	ul.topiclist.forums dt {
		margin-right: -250px;
	}

	ul.topiclist dd.mark {
		display: block;
		position: absolute;
		right: 5px;
		top: 0;
		margin: 0;
		width: auto;
		min-width: 0;
		text-align: left;
	}

	ul.topiclist.forums dd.topics dfn, ul.topiclist.topics dd.posts dfn {
		position: relative;
		left: 0;
		width: auto;
		display: inline;
		font-weight: normal;
	}
	
	li.header dt {
		padding-left: 0;	
	}

	li.row .responsive-show strong {
		font-weight: bold;
		color: inherit;
	}

	ul.topiclist li.row dt a.subforum {
		vertical-align: bottom;
		overflow: hidden;
		text-overflow: ellipsis;
		max-width: 100px;
	}

	/* Pagination
	----------------------------------------*/
	.pagination > ul {
		margin: 5px 0 0;
	}

	.row .pagination .ellipsis + li {
		display: none !important;
	}

	/* Responsive tables
	----------------------------------------*/
	table.responsive, table.responsive tbody, table.responsive tr, table.responsive td {
		display: block;
	}

	table.responsive thead, table.responsive th {
		display: none;
	}

	table.responsive.show-header thead, table.responsive.show-header th:first-child {
		display: block;
		width: auto !important;
		text-align: left !important;
	}

	table.responsive.show-header th:first-child span.rank-img {
		display: none;
	}

	table.responsive tr {
		margin: 2px 0;
	}

	table.responsive td {
		width: auto !important;
		text-align: left !important;
		padding: 4px;
	}

	table.responsive td.empty {
		display: none !important;
	}

	table.responsive td > dfn {
		display: inline-block !important;
	}

	table.responsive td > dfn:after {
		content: ':';
		padding-right: 5px;
	}

	table.responsive span.rank-img {
		float: none;
		padding-right: 5px;
	}

	table.responsive.memberlist td:first-child input[type="checkbox"] {
		float: right;
	}

	/* Forms
	----------------------------------------*/
	fieldset dt, fieldset.fields1 dt, fieldset.fields2 dt {
		width: auto;
		float: none;
	}

	fieldset dd, fieldset.fields1 dd, fieldset.fields2 dd {
		margin-left: 0;
	}

	textarea, dd textarea, .message-box textarea {
		width: 100%;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}

	dl.pmlist dt {
		width: auto !important;
		margin-bottom: 5px;
	}

	dl.pmlist dd {
		display: inline-block;
		margin-left: 0 !important;
	}

	dl.pmlist dd:first-of-type {
		padding-left: 20px;
	}

	.smiley-box, .message-box {
		float: none;
		width: auto;
	}

	.smiley-box {
		margin-top: 5px;
	}

	.bbcode-status {
		display: none;
	}

	.colour-palette, .colour-palette tbody, .colour-palette tr {
		display: block;
	}

	.colour-palette td {
		display: inline-block;
		margin-right: 2px;
	}

	.horizontal-palette td:nth-child(2n), .vertical-palette tr:nth-child(2n) {
		display: none;
	}

	fieldset.quick-login label {
		display: block;
		margin-bottom: 5px;
		white-space: normal;
	}

	fieldset.quick-login label > span {
		display: inline-block;
		min-width: 100px;
	}

	fieldset.quick-login input.inputbox {
		width: 85%;
		max-width: 300px;
		margin-left: 20px;
	}

	fieldset.quick-login label[for="autologin"] {
		display: inline-block;
		text-align: right;
		min-width: 50%;
	}

	/* User profile
	----------------------------------------*/
	.column1, .column2, .left-box.profile-details {
		float: none;
		width: auto;
		clear: both;
	}

	.avatar-rank-container {
		max-width: 100%;
	}

	/* Polls
	----------------------------------------*/
	fieldset.polls dt {
		width: 90%;
	}

	fieldset.polls dd.resultbar {
		padding-left: 20px;
	}

	fieldset.polls dd.poll_option_percent {
		width: 20%;
	}

	fieldset.polls dd.resultbar, fieldset.polls dd.poll_option_percent {
		margin-top: 5px;
	}

	/* Post
	----------------------------------------*/
	.postbody {
		position: inherit;
		float: none !important;
	}

	.postprofile, .postbody, .search .postbody {
		display: block;
		width: auto;
		float: none;
		padding: 0;
		min-height: 0;
		text-align: left;
	}

	.post .postprofile {
		width: 300px;
		border-width: 0 0 1px 0;
		padding-bottom: 5px;
		margin: 0 0 5px 0;
		min-height: 40px;
		overflow: hidden;
	}

	.postprofile dd {
		display: none;
	}

	.postprofile dt, .postprofile dd.profile-rank, .search .postprofile dd {
		display: block;
		margin: 0;
	}

	.postprofile .has-avatar .avatar-container {
		margin: 0;
		overflow: inherit;
	}

	.postprofile .avatar-container:after {
		clear: none;
	}

	.postprofile .avatar {
		margin: 0 5px 0 0px;
		float: left;
	}

	.postprofile .avatar img {
		width: auto !important;
		height: auto !important;
		max-height: 32px;
	}

	.has-profile .postbody h3 {
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	.has-profile .post-buttons {
		right: 30px;
		top: 15px;
	}

	.online {
		background-size: 40px;
	}

	/* Misc stuff
	----------------------------------------*/
	h2 {
		margin-top: .5em;
	}

	p {
		margin-bottom: .5em;
		overflow: hidden;
	}

	p.rightside {
		margin-bottom: 0;
	}

	fieldset.display-options label {
		display: block;
		clear: both;
		margin-bottom: 5px;
	}

	dl.mini dd.pm-legend {
		float: left;
		min-width: 200px;
	}

	.topicreview {
		margin: 0 -5px;
		padding: 0 5px;
	}

	fieldset.display-actions {
		white-space: normal;
	}

	.phpbb_alert {
		width: auto;
		margin: 0 5px;
	}

	.attach-comment dfn {
		width: 100%;
	}
	
}

@media (min-width: 701px) {
	.postbody {
		width: calc(100% - 200px - 1px - 16px);
	}

	.postprofile_Left .postbody {
		width: calc(100% - 200px - 1px - 31px);
		margin-right: 0;
		margin-left: 31px;
	}

	.postprofile {
		width: 200px;
	}
}

@media (min-width: 701px) and (max-width: 950px) {
	.row .pagination {
		margin-top: 2px;
		margin-bottom: 2px;
	}

	ul.topiclist dt {
    	margin-right: -410px;
	}

	ul.topiclist dt .list-inner {
    	margin-right: 410px;
	}

	dd.posts, dd.topics, dd.views {
    	width: 80px;
	}
}

/* ===== merlin.css ===== */
/* New code for new things */


/* Ignore this. Used for testing only */
body {border-top: 0px solid;}

/* Boxed and Fluid Layout Switches
---------------------------------------- */
.body-layout-Fluid .wrap {}
.body-layout-Boxed .wrap {} /* Defined in responsive/large-desktops.css */


/* Headerbar
---------------------------------------- */
.headerbar_overlay_container {
}

.headerbar_overlay_active {

}


/* Particles
---------------------------------------- */
#particles-js {
}

.particles_container  {
  width: 100%;
  position: relative;
  overflow: hidden;
  z-index: 1;
  font-size: 0; /* Fix white space */
  text-align: center;
}



/* Global Containers
---------------------------------------- */
.fancy_panel {
}

.fancy_panel_padding {
	padding: 15px;
}

.fd_dark .fancy_panel_padding {
	padding: 15px !important;
}

#sidebar_right .fancy_panel_padding {
	padding: 15px 0;
}


.fd_dark .profile_widget_avatar img {
	max-width: 70px;
	max-height: 70px;
	width: auto;
	height: auto;
}


body.content_block_header_stripe li.header:before, .fancy_panel:before, .sidebar {
	content: '';
	width: 100%;
	display: block;
	height: 3px;
}

.alt_block li.header:before {
	height: 0px !important;
}

#inner-wrap {
	padding: 30px;
	box-sizing: border-box;
	box-shadow: 0 0 5px rgba(0,0,0,0.05);
}

.body-layout-Fluid #inner-wrap {
	width: 95%;
	margin: 0 auto;
}

/* Sidebar Structure
---------------------------------------- */
#contentwrapper {
	float: left;
	width: 100%;
}

/* Main content */
#contentcolumn {
	margin: 0 300px 0 120px; /*Margins for content column. Should be "0 RightColumnWidth 0 LeftColumnWidth*/
	padding: 0 30px;
}

#leftcolumn {
	float: left;
	width: 120px; /*Width of left column*/
	margin-left: -100%;
}

#rightcolumn {
	float: left;
	width: 300px; /*Width of right column*/
	margin-left: -300px; /*Set left margin to -(RightColumnWidth)*/
}

.innertube {
	margin: 0; /*Margins for inner DIV inside each column (to provide padding)*/
	margin-top: 0;
}

/* Conditional padding adjustments (to cater for flightdeck setting) */
.sidebar-left-only #contentcolumn {margin-right: 0px; padding-right: 0;}
.sidebar-right-only #contentcolumn {margin-left: 0px; padding-left: 0;}


/* Sidebar Widgets
---------------------------------------- */

/* Sidebar Widget */
.sidebar_widget {
	margin-bottom: 30px;
	clear: both;
}

.sidebar_widget h3 {
	display: block;
	text-align: left;
	margin: 0;
	margin-bottom: 15px;
}

.sidebar_widget p:last-child {
	margin-bottom: 0;
}

.sidebar_content {
	border-top: 1px solid;
	padding-top: 15px;
}


/* Profile Widget */
.profile_widget {
}

.profile_widget ul, .profile_widget li {
	list-style: none;
}

.profile_widget li a {
	position: relative;
	padding-right: 25px; /* space for badge */
}

.profile_widget li a .badge {
	top: 7px;
	right: 0;
}

.profile_widget_avatar {
	float: left;
	width: 100px;
	margin-bottom: 30px;
}

.profile_widget_avatar img {
	max-width: 100px;
	max-height: 100px;

}

.profile_widget_info {
	float: left;
	margin-left: 30px;
	margin-bottom: 30px;
}

.fd_dark .profile_widget_info {
	margin-left: 0;
}

.profile_widget_list {
	clear: both;
	padding-top: 20px;
	border-top: 1px solid;
}

.profile_widget_list ul li {
	line-height: 2.2em;
}

.profile_widget_list ul li .icon {
	margin-right: 5px;
}

/* Ad Widget */
.ad_grid {
	padding: 0;
	text-align: center;
}

.ad_grid a {
	display: inline-block;
	margin: 10px;
}

/* Blank Widget */
.blank_widget {
}


/* Grid Forumlist
---------------------------------------- */

/* For easy margins on grid items, we apply them to all sides. Here we need to pull the container
margins out so that the grid items 'appear' to be flush with the container and center column */
.forumlist_grid ul.forums {
	margin: 10px 0;
}

.forumlist_grid li.row {
	margin-bottom: 0px !important;
}

/* Sets the 3 column structure */
.forumlist_grid li.row {
	float: left;
	display: block;
	width: 33.3333333%;
	border: none;
	padding: 0;

}

.forumlist_grid .grid_image_container {
	margin-bottom: 10px;
    margin-right: 5px;
    margin-left: 5px;
    position: relative;
    border: 1px solid rgba(0,0,0,.05);
    transition: transform .1s;
}

/* Remove border if tile bg is set to full */
.forumlist_grid.grid_tile_full .grid_image_container {
	border: 0px;
}


.grid_image_container:hover {
}

.forumlist_grid .grid_image_container:last-child {

}

.forumlist_grid .tile_inner {
    width: 100%;
    padding: 15px;
    box-sizing: border-box;
    min-height: 200px;
}

.forumlist_grid .tile_title {
	padding-bottom: 10px;
	border-bottom: 1px solid rgba(0,0,0,.05);
}

.forumlist_grid .tile_forum_name {
	width: 100%;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;	
}

.forumlist_grid .tile_row_1 {
	background-image: url('./images/interlaced.png');
	background-size: cover;
    background-position: left top;
    background-repeat: repeat;
	overflow: hidden;
	background-color: #2b2b2b;
	padding-top: 56.25%; /* 16:9 */
}

.fd_dark .forumlist_grid .tile_row_1 {
	background-image: url('./images/interlaced_dark.png');
}

.forumlist_grid.grid_tile_full .tile_row_1 {
	background: none !important;
	padding-left: 0 !important;
}

.forumlist_grid .tile_row_1.tile_has_icon {
}

.forumlist_grid .tile_row_2 {
    margin-top: 15px;
}

.tile_row_25 {
    width: 25%;
    float: left;
}

.tile_row_50 {
    width: 50%;
    float: left;
}

.mini_label, .mini_number {
    display: block;
}

.mini_label, .mini_number, .forumlist_grid .forum_description {
    color: rgba(0,0,0,.4);
}

.mini_number, .mini_date {
    padding-top: 10px;
}

.mini_date {
    padding-top: 13px;
}

span.mini_date {
    display: block;
}


.forumlist_grid .forum_description {
    display: block;
	margin-top: 15px;
	height: 45px;
}

.grid_cat_title {
    margin-bottom: 15px;
    margin-left: 15px;
    display: block;
}

/* Since this is the only column, we don't need to push the others over to the right */
.forumlist_grid ul.topiclist dt .list-inner {
	padding: 0;
	margin: 0;
}

.forumlist_grid li.row:hover {
	background: none;
}

.forumlist_grid a:hover {
    text-decoration: none;
}

.forumlist_grid a:hover .forumlist_grid_title {
    display: none;
}

.forumlist_grid_numbers {
	bottom: 0;
}

.grid_desc {
	padding: 20px;
	box-shadow: 0 2px 3px rgba(0,0,0,0.1);
	overflow: hidden;
}



.grid_tile_full_bg_img {
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 0;
	background-size: cover;
	opacity: 0.5;
}

.tile_inner {
	position: relative;
	z-index: 1;
}

/* Stop the responsive breakpoints affecting the grid layout */
.forumlist_grid ul.topiclist dt .list-inner {
	margin-right: 0 !important;
}





/* Simple Forumlist
---------------------------------------- */





/* Grid Forumlist (Icons)
---------------------------------------- */

/* For easy margins on grid items, we apply them to all sides. Here we need to pull the container
margins out so that the grid items 'appear' to be flush with the container and center column */
.forumlist_grid_icons ul.forums {
	margin: 0;
}

.forumlist_grid_icons .forabg {
	border: none !important;
	margin-bottom: 60px;
}

.forumlist_grid_icons ul.forums li.row {
	background: none !important;
}

.forumlist_grid_icons li.row {
	margin-bottom: 0px !important;
}

/* Sets the 3 column structure */
.forumlist_grid_icons li.row {
	float: left;
	display: block;
	width: 33.3333333%;
	border: none;
	padding: 0;

}

.forumlist_grid_icons .grid_image_container {
	margin-bottom: 10px;
    margin-right: 5px;
    margin-left: 5px;
    position: relative;
    border: 1px solid rgba(0,0,0,.05);
    transition: transform .1s;
	background: #FFFFFF;
}


.grid_image_container:hover {
    transform: scale(1.04);
}

.forumlist_grid_icons .grid_image_container:last-child {

}

.forumlist_grid_icons .tile_inner {
    width: 100%;
    padding: 30px;
    box-sizing: border-box;
    min-height: 200px;
}

.forumlist_grid_icons .tile_row_1 {
    background-size: 64px;
    background-image: url('./images/comment.png');
    background-position: left top;
    background-repeat: no-repeat;
    height: 100px;
    overflow: hidden;
}

.forumlist_grid_icons .tile_row_1.tile_has_icon {
    padding-left: 84px;
    min-height: 100px;
}

.forumlist_grid_icons .tile_row_2 {
    margin-top: 15px;
}

.tile_row_25 {
    width: 25%;
    float: left;
}

.tile_row_50 {
    width: 50%;
    float: left;
}

.mini_label, .mini_number {
    display: block;
}

.mini_label, .mini_number, .forumlist_grid_icons .forum_description {
    color: rgba(0,0,0,.4);
}

.mini_number, .mini_date {
    padding-top: 10px;
}

.mini_date {
    padding-top: 13px;
}

span.mini_date {
    display: block;
}




.tile_row_2:before {
    content: '';
    display: block;
    width: 60px;
    height: 2px;
    margin-bottom: 10px;
}

.forumlist_grid_icons .forum_description {
    display: block;
    margin-top: 15px;
}

.grid_cat_title {
    margin-bottom: 15px;
    margin-left: 15px;
	margin-top: 15px;
    display: block;
}

/* Since this is the only column, we don't need to push the others over to the right */
.forumlist_grid_icons ul.topiclist dt .list-inner {
	padding: 0;
	margin: 0;
}

.forumlist_grid_icons li.row:hover {
	background: none;
}

.forumlist_grid_icons a:hover {
    text-decoration: none;
}

.forumlist_grid_icons a:hover .forumlist_grid_icons_title {
    display: none;
}

.forumlist_grid_icons_numbers {
	bottom: 0;
}

.grid_desc {
	padding: 20px;
	box-shadow: 0 2px 3px rgba(0,0,0,0.1);
	overflow: hidden;
}

/* Stop the responsive breakpoints affecting the grid layout */
.forumlist_grid_icons ul.topiclist dt .list-inner {
	margin-right: 0 !important;
}






/* Simple Forumlist
---------------------------------------- */
dd.simpleposts {
	text-align: center;
	line-height: 2em;
	width: 190px;
}

dd.simpleposts span {
	display: block;
}

/* Custom Login Page
---------------------------------------- */

/* Sets the width and 100% height required for vertical alignment */
.login_container {
	width: 100%; /* Scale up in responsive stylesheets */
	margin: 0 auto;
	min-height: 95%;
	height: 95%;
	display: table;
}


/* Vertically aligns the left content */
.login_container_left {
	width: 100%;
	display: block;
}

/* Vertically aligns the left content */
.login_container_right {
	width: 100%;
	display: block;
}

/* Content and fancypanel are one */
.login_container_left_section_content {
	position: relative;
	z-index: 2; /* Ensures the box shadow overlaps the 'registration' box */
}

.login_container_right_section_content {
	-webkit-animation-delay: 0.2s;
    animation-delay: 0.2s;
}

.login_container_padding {
	padding: 30px;
}

/* Login Widget */
.login_form input.inputbox {
	margin-bottom: 15px;
}

.login_form input#autologin2, .login_form input#autologin {
	margin-right: 5px;
}

.login_form input.button2, .login {
	margin: 15px 0; /* Usually we wouldn't do margin-top, but adding margin-bottom to the checkbox above gets weird */
	width: 100% !important;
}

.login_form_forgot_link {
	border-top: 1px solid;
	margin-top: 15px;
	padding-top: 15px;
}

/* Captcha Override */
.login_form fieldset dl {
	margin: 15px 0 0;
	padding: 0;
}

.login_form fieldset.fields2 dd {
	margin-left: 0;
}

/* Right Side tweaks */
.login_container_right a.button2 {
	width: 100% !important;
	text-align: center;
}


/* Postprofile Things (next release)
---------------------------------------- */


/* Social Links
---------------------------------------- */
.social_links_footer {
	text-align: center;
	clear: both;
	padding: 80px 0 30px;
	margin-top: -50px;
	position: relative;
	z-index: 2;
}

.social_links_footer a {
	display: inline-block;
	margin: 0 7.5px;
}

.social_links_footer a span {
	font-size: 24px;
	width: 46px;
	height: 46px;
	line-height: 44px;
	text-align: center;
	border: 2px solid;
	border-radius: 25px;
}

.social_links_footer a span:hover {
	transition:.2s;
}

/* Scroll to Top
---------------------------------------- */
.scrollToTop {
	width: 40px;
	height: 40px;
	line-height: 40px;
	text-align:center;
	text-decoration: none;
	position: fixed;
	bottom: 20px;
	right: 20px;
	display: none;
	z-index: 4;
}

.scrollToTop:hover {
	text-decoration:none;
	color: #FFFFFF;
}


/* Collapsible Panels
---------------------------------------- */
.collapse-trigger {
	display: block;
	float: right;
	position: relative;
	margin: -31px 18px 0 0;
}

/* Área táctil ampliada a 24px+ sin desplazar el icono visual (WCAG / Lighthouse touch target) */
.collapse-trigger::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 24px;
	height: 24px;
	transform: translate(-50%, -50%);
}

.fancy_panel_padding .collapse-trigger {
	margin-right: 0;
}

.collapse-trigger a:hover, .collapse-trigger a:focus {
	text-decoration: none;
}

span.fa-plus {display: block;}
span.fa-minus {display: none;}

.open span.fa-plus {display: none;}
.open span.fa-minus {display: block;}


/* As sidebar blocks entered via flightdeck can't use IF statements, we'll set the trigger visibility for the right sidebar here */

/* Hide them by default, then show when they're enabled */
#sidebar_right .collapse-trigger {display: none;}
#sidebar_right.sidebar_right_collapse .collapse-trigger {display: inline-block;}


/* Missing Avatar Placeholder
---------------------------------------- */
a.no_avatar {
	display: block;
	text-align: center;
	border-radius: 50px;
	height: 100px;
	width: 100px;
	line-height: 110px;
}

a.no_avatar i.icon {
	font-size: 25px;
	padding-left: 7px;
}


/* Topic Types
---------------------------------------- */
.topic_type {
	display: inline-block;
	padding: 2px 2px 2px 4px;
	font-weight: 500;
	float: right;
	margin-right: 3px;
}

.topic_type span {
	display: inline-block;
	text-transform: lowercase;
}

.topic_type span::first-letter {
	text-transform: uppercase;
}

.grid_unread {
	display: block;
	float: left;
	padding: 2px 4px;
	margin-right: 5px;
}


/* Footer Bars
---------------------------------------- */
.copyright_bar {
	clear: both;
	padding: 15px;
}

.navbar_footer {
	padding: 15px;
}


/* Last Post Avatar
---------------------------------------- */
span.lastpostavatar img {
	position: absolute;
	margin-left: -45px;
	margin-top: 4px; /* Counteracts the last topic title line height */
}

span.lastpostavatar img{
	border: none;
}

li.has_last_post_avatar dd.lastpost {
	padding-left: 45px;
}

/* Apparently viewforum doesn't like the above code. Weird..it's the same structure as index.php *shrug* */
ul.topics li.row span.lastpostavatar img {
	position: static;
	margin-left: 0;
	margin-right: 15px;
}


/* Columns
---------------------------------------- */


/* Index and Permissions Blocks (and sidebar, probably)
---------------------------------------- */
.alt_block {
	margin-bottom: 30px;
}


/* Misc
---------------------------------------- */
.squishy-show {display: inline-block;}
.quishy-hide {display: none;}

.planetstyles_credit_hidden {
	display: none;
}

.clutter {
	display: none !important;
}

.post_forumlist_links {
	text-align: center;
	margin-bottom: 30px;
}

.responsive_forumlist_row_stats {
	margin-top: 4px;
	opacity: 0.5;
}

.stat-block p {
	margin-bottom: 0;
}

/* Fade out soft deleted topics */
li.row.deleted {
	opacity: 0.5;
}

.button_disapprove, .button_approve {
	margin-left: 5px;
}

dd.captcha {
	margin-top: 15px;
  clear:  both; /* Captcha fix */
}


/* Remove the 5px top forumbg margin when stripe headers are enabled */
body.content_block_header_stripe.dark_base ul.forums, body.content_block_header_stripe.dark_base ul.topics {
	padding-top: 0;
}

/* ===== icons_forums_topics.css ===== */

/* Icon images
---------------------------------------- */

.contact-icon						{ background-image: url("./images/icons_contact.png"); }

/* Profile & navigation icons */
.pm-icon							{ background-position: 0 0; }
.email-icon							{ background-position: -21px 0; }
.jabber-icon						{ background-position: -80px 0; }
.phpbb_icq-icon						{ background-position: -61px 0 ; }
.phpbb_wlm-icon						{ background-position: -182px 0; }
.phpbb_aol-icon						{ background-position: -244px 0; }
.phpbb_website-icon					{ background-position: -40px 0; }
.phpbb_youtube-icon					{ background-position: -98px 0; }
.phpbb_facebook-icon				{ background-position: -119px 0; }
.phpbb_googleplus-icon				{ background-position: -140px 0; }
.phpbb_skype-icon					{ background-position: -161px 0; }
.phpbb_twitter-icon					{ background-position: -203px 0; }
.phpbb_yahoo-icon					{ background-position: -224px 0; }

/* Forum icons & Topic icons */
.global_read {
	background-image: url("./images/icons/png/icon_read.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_read.svg"); /* Modern browsers */
}
.global_read_mine {
	background-image: url("./images/icons/png/icon_read_mine.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_read_mine.svg"); /* Modern browsers */
}
.global_read_locked {
	background-image: url("./images/icons/png/icon_read_locked.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_read_locked.svg"); /* Modern browsers */
}
.global_read_locked_mine {
	background-image: url("./images/icons/png/icon_read_locked_mine.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_read_locked_mine.svg"); /* Modern browsers */
}

.global_unread {
	background-image: url("./images/icons/png/icon_unread.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_unread.svg"); /* Modern browsers */
}
.global_unread_mine {
	background-image: url("./images/icons/png/icon_unread_mine.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_unread_mine.svg"); /* Modern browsers */
}
.global_unread_locked {
	background-image: url("./images/icons/png/icon_unread_locked.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_unread_locked.svg"); /* Modern browsers */
}
.global_unread_locked_mine {
	background-image: url("./images/icons/png/icon_unread_locked_mine.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_unread_locked_mine.svg"); /* Modern browsers */
}

.announce_read {
	background-image: url("./images/icons/png/icon_read.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_read.svg"); /* Modern browsers */
}
.announce_read_mine {
	background-image: url("./images/icons/png/icon_read_mine.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_read_mine.svg"); /* Modern browsers */
}
.announce_read_locked {
	background-image: url("./images/icons/png/icon_read_locked.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_read_locked.svg"); /* Modern browsers */
}
.announce_read_locked_mine {
	background-image: url("./images/icons/png/icon_read_locked_mine.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_read_locked_mine.svg"); /* Modern browsers */
}

.announce_unread {
	background-image: url("./images/icons/png/icon_unread.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_unread.svg"); /* Modern browsers */
}
.announce_unread_mine {
	background-image: url("./images/icons/png/icon_unread_mine.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_unread_mine.svg"); /* Modern browsers */
}
.announce_unread_locked {
	background-image: url("./images/icons/png/icon_unread_locked.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_unread_locked.svg"); /* Modern browsers */
}
.announce_unread_locked_mine {
	background-image: url("./images/icons/png/icon_unread_locked_mine.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_unread_locked_mine.svg"); /* Modern browsers */
}

.forum_link {
	background-image: url("./images/icons/png/forum_link.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/forum_link.svg"); /* Modern browsers */
}

.forum_read {
	background-image: url("./images/icons/png/icon_read.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_read.svg"); /* Modern browsers */
}
.forum_read_locked {
	background-image: url("./images/icons/png/icon_read_locked.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_read_locked.svg"); /* Modern browsers */
}
.forum_read_subforum {
	background-image: url("./images/icons/png/icon_read.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_read.svg"); /* Modern browsers */
}

.forum_unread {
	background-image: url("./images/icons/png/icon_unread.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_unread.svg"); /* Modern browsers */
}
.forum_unread_locked {
	background-image: url("./images/icons/png/icon_unread_locked.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_unread_locked.svg"); /* Modern browsers */
}
.forum_unread_subforum {
	background-image: url("./images/icons/png/icon_unread.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_unread.svg"); /* Modern browsers */
}


.sticky_read {
	background-image: url("./images/icons/png/icon_read.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_read.svg"); /* Modern browsers */
}
.sticky_read_mine {
	background-image: url("./images/icons/png/icon_read_mine.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_read_mine.svg"); /* Modern browsers */
}
.sticky_read_locked {
	background-image: url("./images/icons/png/icon_read_locked.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_read_locked.svg"); /* Modern browsers */
}
.sticky_read_locked_mine {
	background-image: url("./images/icons/png/icon_read_locked_mine.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_read_locked_mine.svg"); /* Modern browsers */
}

.sticky_unread {
	background-image: url("./images/icons/png/icon_unread.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_unread.svg"); /* Modern browsers */
}
.sticky_unread_mine {
	background-image: url("./images/icons/png/icon_unread_mine.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_unread_mine.svg"); /* Modern browsers */
}
.sticky_unread_locked {
	background-image: url("./images/icons/png/icon_unread_locked.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_unread_locked.svg"); /* Modern browsers */
}
.sticky_unread_locked_mine {
	background-image: url("./images/icons/png/icon_unread_locked_mine.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_unread_locked_mine.svg"); /* Modern browsers */
}

.topic_moved {
	background-image: url("./images/icons/png/forum_link.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/forum_link.svg"); /* Modern browsers */
}

.topic_read {
	background-image: url("./images/icons/png/icon_read.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_read.svg"); /* Modern browsers */
}
.topic_read_mine {
	background-image: url("./images/icons/png/icon_read_mine.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_read_mine.svg"); /* Modern browsers */
}
.topic_read_hot {
	background-image: url("./images/icons/png/icon_read_hot.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_read_hot.svg"); /* Modern browsers */
}
.topic_read_hot_mine {
	background-image: url("./images/icons/png/icon_read_hot_mine.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_read_hot_mine.svg"); /* Modern browsers */
}
.topic_read_locked {
	background-image: url("./images/icons/png/icon_read_locked.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_read_locked.svg"); /* Modern browsers */
}
.topic_read_locked_mine {
	background-image: url("./images/icons/png/icon_read_locked_mine.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_read_locked_mine.svg"); /* Modern browsers */
}

.topic_unread {
	background-image: url("./images/icons/png/icon_unread.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_unread.svg"); /* Modern browsers */
}
.topic_unread_mine {
	background-image: url("./images/icons/png/icon_unread_mine.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_unread_mine.svg"); /* Modern browsers */
}
.topic_unread_hot {
	background-image: url("./images/icons/png/icon_unread_hot.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_unread_hot.svg"); /* Modern browsers */
}
.topic_unread_hot_mine {
	background-image: url("./images/icons/png/icon_unread_hot_mine.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_unread_hot_mine.svg"); /* Modern browsers */
}
.topic_unread_locked {
	background-image: url("./images/icons/png/icon_unread_locked.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_unread_locked.svg"); /* Modern browsers */
}
.topic_unread_locked_mine {
	background-image: url("./images/icons/png/icon_unread_locked_mine.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_unread_locked_mine.svg"); /* Modern browsers */
}

.pm_read {
	background-image: url("./images/icons/png/icon_read.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_read.svg"); /* Modern browsers */
}
.pm_unread {
	background-image: url("./images/icons/png/icon_unread.png"); /* IE8 + below */
	background-image: linear-gradient(transparent, transparent), url("./images/icons/svg/icon_unread.svg"); /* Modern browsers */
}





/* ------- New Forum & Topic Icons (Pulsing) ------- */

/* Switches */
.css_icons_enabled  dl.row-item {background-image: none;}
.css_icons_disabled .forums .row-item:before, .css_icons_disabled .topics .row-item:before, .css_icons_disabled .pmlist .row-item:before, .css_icons_disabled .cplist .row-item:before, .css_icons_disabled .forums .row-item:after, .css_icons_disabled .topics .row-item:after, .css_icons_disabled .pmlist .row-item:after, .css_icons_disabled .cplist .row-item:after {display: none;}


.forums .row-item:before, .topics .row-item:before, 
.pmlist .row-item:before, .cplist .row-item:before {
	font-family: FontAwesome;
	color: #FFFFFF;
	text-align: center;
	position: absolute;
	left: 11px;
	top: 7px;
	width: 32px;
	height: 32px;
	line-height: 32px;
	border: 1px solid rgba(0,0,0,0.1);
	color: rgba(0,0,0,0.1);
}

/* Adjustments for dark UI */
.fd_dark .forums .row-item:before, .fd_dark .topics .row-item:before, 
.fd_dark .pmlist .row-item:before, .fd_dark .cplist .row-item:before {
	border: 1px solid rgba(255,255,255,.15);
	color: rgba(255,255,255,.15);
}



/* Rows with 'last topic subject' have an extra 10px padding top, so we need to account for this with bigger top value */
.forums .row_has_subject .row-item:before {
	top: 17px;
}

/* Spotted topics */
.global_read_mine:after, .global_read_locked_mine:after, .global_unread_mine:after, .global_unread_locked_mine:after, .announce_read_mine:after, .announce_read_locked_mine:after, .announce_unread_mine:after, .announce_unread_locked_mine:after, .sticky_read_mine:after, .sticky_read_locked_mine:after, .sticky_unread_mine:after, .sticky_unread_locked_mine:after, .topic_read_mine:after, .topic_read_hot_mine:after, .topic_unread_mine:after, .topic_unread_hot_mine:after, .topic_read_locked_mine:after, .topic_unread_locked_mine:after {
	position: absolute;
	top: 8px;
	left: 35px;
	font-family: FontAwesome;
	content: "\f111";
	font-size: 6px;
	width: 6px;
	height: 6px;
	border: 2px solid #ffffff;
	border-radius: 6px;
	color: rgba(0,0,0,0.1);
	background: #FFFFFF;
}

/* Adjustments for dark UI */
.fd_dark .global_read_mine:after, 
.fd_dark .global_read_locked_mine:after, 
.fd_dark .global_unread_mine:after, 
.fd_dark .global_unread_locked_mine:after, 
.fd_dark .announce_read_mine:after, 
.fd_dark .announce_read_locked_mine:after, 
.fd_dark .announce_unread_mine:after, 
.fd_dark .announce_unread_locked_mine:after, 
.fd_dark .sticky_read_mine:after, 
.fd_dark .sticky_read_locked_mine:after, 
.fd_dark .sticky_unread_mine:after, 
.fd_dark .sticky_unread_locked_mine:after, 
.fd_dark .topic_read_mine:after, 
.fd_dark .topic_read_hot_mine:after, 
.fd_dark .topic_unread_mine:after, 
.fd_dark .topic_unread_hot_mine:after, 
.fd_dark .topic_read_locked_mine:after, 
.fd_dark .topic_unread_locked_mine:after {
	border: 2px solid #252F39;
	color: rgba(255,255,255,.1) !important;
	background: #242A36 !important;
}




/* Set the icons */            				 /* Megaphone */
.global_read:before							{content: "\f0a1";}
.global_read_mine:before					{content: "\f0a1";}
.global_read_locked:before					{content: "\f0a1";}
.global_read_locked_mine:before				{content: "\f0a1";}
.global_unread:before						{content: "\f0a1";}
.global_unread_mine:before					{content: "\f0a1";}
.global_unread_locked:before				{content: "\f0a1";}
.global_unread_locked_mine:before			{content: "\f0a1";}

											/* Megaphone */
.announce_read:before						{content: "\f0a1";}
.announce_read_mine:before					{content: "\f0a1";}
.announce_read_locked:before				{content: "\f0a1";}
.announce_read_locked_mine:before			{content: "\f0a1";}
.announce_unread:before						{content: "\f0a1";}
.announce_unread_mine:before				{content: "\f0a1";}
.announce_unread_locked:before				{content: "\f0a1";}
.announce_unread_locked_mine:before			{content: "\f0a1";}

											/* External link */
.forum_link:before							{content: "\f08e";}

											/* Speech Bubble */
.forum_read:before							{content: "\f068";}
.forum_read_subforum:before					{content: "\f068";}

											/* Check */
.forum_unread:before						{content: "\f00c";}
.forum_unread_subforum:before				{content: "\f00c";}

											/* Pin */
.sticky_read:before							{content: "\f08d";}
.sticky_read_mine:before					{content: "\f08d";}
.sticky_read_locked:before					{content: "\f08d";}
.sticky_read_locked_mine:before				{content: "\f08d";}

.sticky_unread:before						{content: "\f08d";}
.sticky_unread_mine:before					{content: "\f08d";}
.sticky_unread_locked:before				{content: "\f08d";}
.sticky_unread_locked_mine:before			{content: "\f08d";}

											/* Right arrow */
.topic_moved:before							{content: "\f061";}

											/* Envelope */
.pm_read:before 							{content: "\f0e0";}
.pm_unread:before 							{content: "\f0e0";}

											/* Bar */
.topic_read:before							{content: "\f068";}
.topic_read_mine:before						{content: "\f068";}
.topic_read_hot:before						{content: "\f068";}
.topic_read_hot_mine:before					{content: "\f068";}
											/* Tick */
.topic_unread:before						{content: "\f00c";}
.topic_unread_mine:before					{content: "\f00c";}
.topic_unread_hot:before					{content: "\f00c";}
.topic_unread_hot_mine:before				{content: "\f00c";}

											/* Cross */
.forum_read_locked:before					{content: "\f00d";}
.forum_unread_locked:before					{content: "\f00d";}
.topic_read_locked:before					{content: "\f00d";}
.topic_read_locked_mine:before				{content: "\f00d";}
.topic_unread_locked:before					{content: "\f00d";}
.topic_unread_locked_mine:before			{content: "\f00d";}

/* Forum link and moved topics */
.forum_link:before, .topic_moved:before {
	border: 1px solid #0090f5 !important;
	color: #0090f5 !important;
}

/* Unread States */
.global_unread:before, .global_unread_mine:before, .announce_unread:before, .announce_unread_mine:before, .forum_unread:before, .forum_unread_subforum:before, .sticky_unread:before, .sticky_unread_mine:before, .pm_unread:before, .topic_unread:before, .topic_unread_mine:before, .topic_unread_hot:before, .topic_unread_hot_mine:before {
	animation: UnreadPulse 1.4s infinite;
	border: 1px solid #84bd00 !important;
	color: #84bd00 !important;
}

/* Unread (dot) States */
.global_unread:after, .global_unread_mine:after, .announce_unread:after, .announce_unread_mine:after, .forum_unread:after, .forum_unread_subforum:after, .sticky_unread:after, .sticky_unread_mine:after, .pm_unread:after, .topic_unread:after, .topic_unread_mine:after, .topic_unread_hot:after, .topic_unread_hot_mine:after {
	color: #84bd00 !important;
	background-color: #FFFFFF;
}

/* Override unread locked with red */
.global_unread_locked:before, .global_unread_locked_mine:before, .announce_unread_locked:before, .announce_unread_locked_mine:before, .forum_unread_locked:before, .sticky_unread_locked:before, .sticky_unread_locked_mine:before, .topic_unread_locked:before, .topic_unread_locked_mine:before {
	animation: UnreadLockedPulse 1.4s infinite;
	border: 1px solid #bd0000 !important;
	color: #bd0000 !important;
}

/* Unread (locked) states */
.global_unread_locked:after, .global_unread_locked_mine:after, .announce_unread_locked:after, .announce_unread_locked_mine:after, .forum_unread_locked:after, .sticky_unread_locked:after, .sticky_unread_locked_mine:after, .topic_unread_locked:after, .topic_unread_locked_mine:after {
	color: #bd0000 !important;
	background-color: #FFFFFF;
}



.forum_link {

}


/* Box shadow for unread pulse icons */
@keyframes UnreadPulse {
	0% {
	  -moz-box-shadow: 0 0 0 0 rgba(132,189,0,0.4);
	  box-shadow: 0 0 0 0 rgba(132,189,0,0.4);
	  -webkit-box-shadow: 0 0 0 0 rgba(132,189,0,0.4);
	}
	70% {
		-moz-box-shadow: 0 0 0 8px rgba(132,189,0,0);
		box-shadow: 0 0 0 8px rgba(132,189,0, 0);
		-webkit-box-shadow: 0 0 0 8px rgba(132,189,0,0);
	}
	100% {
		-moz-box-shadow: 0 0 0 0 rgba(132,189,0,0);
		box-shadow: 0 0 0 0 rgba(132,189,0,0);
		-webkit-box-shadow: 0 0 0 0 rgba(132,189,0,0);
	}
}

/* Box shadow for unread pulse icons */
@keyframes UnreadLockedPulse {
	0% {
	  -moz-box-shadow: 0 0 0 0 rgba(189,0,0,0.4);
	  box-shadow: 0 0 0 0 rgba(189,0,0,0.4);
-webkit-box-shadow: 0 0 0 0 rgba(189,0,0,0.4);
	}
	70% {
		-moz-box-shadow: 0 0 0 8px rgba(189,0,0,0);
		box-shadow: 0 0 0 8px rgba(189,0,0, 0);
		-webkit-box-shadow: 0 0 0 8px rgba(189,0,0,0);
	}
	100% {
		-moz-box-shadow: 0 0 0 0 rgba(189,0,0,0);
		box-shadow: 0 0 0 0 rgba(189,0,0,0);
		-webkit-box-shadow: 0 0 0 0 rgba(189,0,0,0);
	}
}

/* ===== animate.css ===== */
/*!
 * animate.css -http://daneden.me/animate
 * Version - 3.5.1
 * Licensed under the MIT license - http://opensource.org/licenses/MIT
 *
 * Copyright (c) 2016 Daniel Eden
 */

.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.animated.infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}

.animated.hinge {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
}

.animated.flipOutX,
.animated.flipOutY,
.animated.bounceIn,
.animated.bounceOut {
  -webkit-animation-duration: .75s;
  animation-duration: .75s;
}

@-webkit-keyframes bounce {
  from, 20%, 53%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
  }

  40%, 43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -30px, 0);
    transform: translate3d(0, -30px, 0);
  }

  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -15px, 0);
    transform: translate3d(0, -15px, 0);
  }

  90% {
    -webkit-transform: translate3d(0,-4px,0);
    transform: translate3d(0,-4px,0);
  }
}

@keyframes bounce {
  from, 20%, 53%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
  }

  40%, 43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -30px, 0);
    transform: translate3d(0, -30px, 0);
  }

  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -15px, 0);
    transform: translate3d(0, -15px, 0);
  }

  90% {
    -webkit-transform: translate3d(0,-4px,0);
    transform: translate3d(0,-4px,0);
  }
}

.bounce {
  -webkit-animation-name: bounce;
  animation-name: bounce;
  -webkit-transform-origin: center bottom;
  transform-origin: center bottom;
}

@-webkit-keyframes flash {
  from, 50%, to {
    opacity: 1;
  }

  25%, 75% {
    opacity: 0;
  }
}

@keyframes flash {
  from, 50%, to {
    opacity: 1;
  }

  25%, 75% {
    opacity: 0;
  }
}

.flash {
  -webkit-animation-name: flash;
  animation-name: flash;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes pulse {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes pulse {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.pulse {
  -webkit-animation-name: pulse;
  animation-name: pulse;
}

@-webkit-keyframes rubberBand {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }

  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }

  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }

  65% {
    -webkit-transform: scale3d(.95, 1.05, 1);
    transform: scale3d(.95, 1.05, 1);
  }

  75% {
    -webkit-transform: scale3d(1.05, .95, 1);
    transform: scale3d(1.05, .95, 1);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes rubberBand {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }

  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }

  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }

  65% {
    -webkit-transform: scale3d(.95, 1.05, 1);
    transform: scale3d(.95, 1.05, 1);
  }

  75% {
    -webkit-transform: scale3d(1.05, .95, 1);
    transform: scale3d(1.05, .95, 1);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.rubberBand {
  -webkit-animation-name: rubberBand;
  animation-name: rubberBand;
}

@-webkit-keyframes shake {
  from, to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  20%, 40%, 60%, 80% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }
}

@keyframes shake {
  from, to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  20%, 40%, 60%, 80% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }
}

.shake {
  -webkit-animation-name: shake;
  animation-name: shake;
}

@-webkit-keyframes headShake {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  6.5% {
    -webkit-transform: translateX(-6px) rotateY(-9deg);
    transform: translateX(-6px) rotateY(-9deg);
  }

  18.5% {
    -webkit-transform: translateX(5px) rotateY(7deg);
    transform: translateX(5px) rotateY(7deg);
  }

  31.5% {
    -webkit-transform: translateX(-3px) rotateY(-5deg);
    transform: translateX(-3px) rotateY(-5deg);
  }

  43.5% {
    -webkit-transform: translateX(2px) rotateY(3deg);
    transform: translateX(2px) rotateY(3deg);
  }

  50% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes headShake {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  6.5% {
    -webkit-transform: translateX(-6px) rotateY(-9deg);
    transform: translateX(-6px) rotateY(-9deg);
  }

  18.5% {
    -webkit-transform: translateX(5px) rotateY(7deg);
    transform: translateX(5px) rotateY(7deg);
  }

  31.5% {
    -webkit-transform: translateX(-3px) rotateY(-5deg);
    transform: translateX(-3px) rotateY(-5deg);
  }

  43.5% {
    -webkit-transform: translateX(2px) rotateY(3deg);
    transform: translateX(2px) rotateY(3deg);
  }

  50% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

.headShake {
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-name: headShake;
  animation-name: headShake;
}

@-webkit-keyframes swing {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
    transform: rotate3d(0, 0, 1, 15deg);
  }

  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
    transform: rotate3d(0, 0, 1, -10deg);
  }

  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
    transform: rotate3d(0, 0, 1, 5deg);
  }

  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
    transform: rotate3d(0, 0, 1, -5deg);
  }

  to {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg);
  }
}

@keyframes swing {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
    transform: rotate3d(0, 0, 1, 15deg);
  }

  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
    transform: rotate3d(0, 0, 1, -10deg);
  }

  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
    transform: rotate3d(0, 0, 1, 5deg);
  }

  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
    transform: rotate3d(0, 0, 1, -5deg);
  }

  to {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg);
  }
}

.swing {
  -webkit-transform-origin: top center;
  transform-origin: top center;
  -webkit-animation-name: swing;
  animation-name: swing;
}

@-webkit-keyframes tada {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  10%, 20% {
    -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
  }

  30%, 50%, 70%, 90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }

  40%, 60%, 80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes tada {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  10%, 20% {
    -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
  }

  30%, 50%, 70%, 90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }

  40%, 60%, 80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.tada {
  -webkit-animation-name: tada;
  animation-name: tada;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes wobble {
  from {
    -webkit-transform: none;
    transform: none;
  }

  15% {
    -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
    transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  }

  30% {
    -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
    transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  }

  45% {
    -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
    transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  }

  60% {
    -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
    transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  }

  75% {
    -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
    transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes wobble {
  from {
    -webkit-transform: none;
    transform: none;
  }

  15% {
    -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
    transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  }

  30% {
    -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
    transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  }

  45% {
    -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
    transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  }

  60% {
    -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
    transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  }

  75% {
    -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
    transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

.wobble {
  -webkit-animation-name: wobble;
  animation-name: wobble;
}

@-webkit-keyframes jello {
  from, 11.1%, to {
    -webkit-transform: none;
    transform: none;
  }

  22.2% {
    -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
    transform: skewX(-12.5deg) skewY(-12.5deg);
  }

  33.3% {
    -webkit-transform: skewX(6.25deg) skewY(6.25deg);
    transform: skewX(6.25deg) skewY(6.25deg);
  }

  44.4% {
    -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
    transform: skewX(-3.125deg) skewY(-3.125deg);
  }

  55.5% {
    -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
    transform: skewX(1.5625deg) skewY(1.5625deg);
  }

  66.6% {
    -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
    transform: skewX(-0.78125deg) skewY(-0.78125deg);
  }

  77.7% {
    -webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
    transform: skewX(0.390625deg) skewY(0.390625deg);
  }

  88.8% {
    -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
    transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
  }
}

@keyframes jello {
  from, 11.1%, to {
    -webkit-transform: none;
    transform: none;
  }

  22.2% {
    -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
    transform: skewX(-12.5deg) skewY(-12.5deg);
  }

  33.3% {
    -webkit-transform: skewX(6.25deg) skewY(6.25deg);
    transform: skewX(6.25deg) skewY(6.25deg);
  }

  44.4% {
    -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
    transform: skewX(-3.125deg) skewY(-3.125deg);
  }

  55.5% {
    -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
    transform: skewX(1.5625deg) skewY(1.5625deg);
  }

  66.6% {
    -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
    transform: skewX(-0.78125deg) skewY(-0.78125deg);
  }

  77.7% {
    -webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
    transform: skewX(0.390625deg) skewY(0.390625deg);
  }

  88.8% {
    -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
    transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
  }
}

.jello {
  -webkit-animation-name: jello;
  animation-name: jello;
  -webkit-transform-origin: center;
  transform-origin: center;
}

@-webkit-keyframes bounceIn {
  from, 20%, 40%, 60%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(.9, .9, .9);
    transform: scale3d(.9, .9, .9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(.97, .97, .97);
    transform: scale3d(.97, .97, .97);
  }

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes bounceIn {
  from, 20%, 40%, 60%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(.9, .9, .9);
    transform: scale3d(.9, .9, .9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(.97, .97, .97);
    transform: scale3d(.97, .97, .97);
  }

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.bounceIn {
  -webkit-animation-name: bounceIn;
  animation-name: bounceIn;
}

@-webkit-keyframes bounceInDown {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0);
    transform: translate3d(0, -3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0);
    transform: translate3d(0, 25px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, 5px, 0);
    transform: translate3d(0, 5px, 0);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes bounceInDown {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0);
    transform: translate3d(0, -3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0);
    transform: translate3d(0, 25px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, 5px, 0);
    transform: translate3d(0, 5px, 0);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

.bounceInDown {
  -webkit-animation-name: bounceInDown;
  animation-name: bounceInDown;
}

@-webkit-keyframes bounceInLeft {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(-3000px, 0, 0);
    transform: translate3d(-3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0);
    transform: translate3d(25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(5px, 0, 0);
    transform: translate3d(5px, 0, 0);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes bounceInLeft {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(-3000px, 0, 0);
    transform: translate3d(-3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0);
    transform: translate3d(25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(5px, 0, 0);
    transform: translate3d(5px, 0, 0);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

.bounceInLeft {
  -webkit-animation-name: bounceInLeft;
  animation-name: bounceInLeft;
}

@-webkit-keyframes bounceInRight {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(3000px, 0, 0);
    transform: translate3d(3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(-25px, 0, 0);
    transform: translate3d(-25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(-5px, 0, 0);
    transform: translate3d(-5px, 0, 0);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes bounceInRight {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(3000px, 0, 0);
    transform: translate3d(3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(-25px, 0, 0);
    transform: translate3d(-25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(-5px, 0, 0);
    transform: translate3d(-5px, 0, 0);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

.bounceInRight {
  -webkit-animation-name: bounceInRight;
  animation-name: bounceInRight;
}

@-webkit-keyframes bounceInUp {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
    transform: translate3d(0, 3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -5px, 0);
    transform: translate3d(0, -5px, 0);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes bounceInUp {
  from, 60%, 75%, 90%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
    transform: translate3d(0, 3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -5px, 0);
    transform: translate3d(0, -5px, 0);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.bounceInUp {
  -webkit-animation-name: bounceInUp;
  animation-name: bounceInUp;
}

@-webkit-keyframes bounceOut {
  20% {
    -webkit-transform: scale3d(.9, .9, .9);
    transform: scale3d(.9, .9, .9);
  }

  50%, 55% {
    opacity: 1;
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }
}

@keyframes bounceOut {
  20% {
    -webkit-transform: scale3d(.9, .9, .9);
    transform: scale3d(.9, .9, .9);
  }

  50%, 55% {
    opacity: 1;
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }
}

.bounceOut {
  -webkit-animation-name: bounceOut;
  animation-name: bounceOut;
}

@-webkit-keyframes bounceOutDown {
  20% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  40%, 45% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}

@keyframes bounceOutDown {
  20% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  40%, 45% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}

.bounceOutDown {
  -webkit-animation-name: bounceOutDown;
  animation-name: bounceOutDown;
}

@-webkit-keyframes bounceOutLeft {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(20px, 0, 0);
    transform: translate3d(20px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}

@keyframes bounceOutLeft {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(20px, 0, 0);
    transform: translate3d(20px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}

.bounceOutLeft {
  -webkit-animation-name: bounceOutLeft;
  animation-name: bounceOutLeft;
}

@-webkit-keyframes bounceOutRight {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(-20px, 0, 0);
    transform: translate3d(-20px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}

@keyframes bounceOutRight {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(-20px, 0, 0);
    transform: translate3d(-20px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}

.bounceOutRight {
  -webkit-animation-name: bounceOutRight;
  animation-name: bounceOutRight;
}

@-webkit-keyframes bounceOutUp {
  20% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  40%, 45% {
    opacity: 1;
    -webkit-transform: translate3d(0, 20px, 0);
    transform: translate3d(0, 20px, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}

@keyframes bounceOutUp {
  20% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  40%, 45% {
    opacity: 1;
    -webkit-transform: translate3d(0, 20px, 0);
    transform: translate3d(0, 20px, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}

.bounceOutUp {
  -webkit-animation-name: bounceOutUp;
  animation-name: bounceOutUp;
}

@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

@-webkit-keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}

@-webkit-keyframes fadeInDownBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInDownBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInDownBig {
  -webkit-animation-name: fadeInDownBig;
  animation-name: fadeInDownBig;
}

@-webkit-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}

@-webkit-keyframes fadeInLeftBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInLeftBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInLeftBig {
  -webkit-animation-name: fadeInLeftBig;
  animation-name: fadeInLeftBig;
}

@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}

@-webkit-keyframes fadeInRightBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInRightBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInRightBig {
  -webkit-animation-name: fadeInRightBig;
  animation-name: fadeInRightBig;
}

@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}

@-webkit-keyframes fadeInUpBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInUpBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInUpBig {
  -webkit-animation-name: fadeInUpBig;
  animation-name: fadeInUpBig;
}

@-webkit-keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

@keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

.fadeOut {
  -webkit-animation-name: fadeOut;
  animation-name: fadeOut;
}

@-webkit-keyframes fadeOutDown {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

@keyframes fadeOutDown {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

.fadeOutDown {
  -webkit-animation-name: fadeOutDown;
  animation-name: fadeOutDown;
}

@-webkit-keyframes fadeOutDownBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}

@keyframes fadeOutDownBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}

.fadeOutDownBig {
  -webkit-animation-name: fadeOutDownBig;
  animation-name: fadeOutDownBig;
}

@-webkit-keyframes fadeOutLeft {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

@keyframes fadeOutLeft {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

.fadeOutLeft {
  -webkit-animation-name: fadeOutLeft;
  animation-name: fadeOutLeft;
}

@-webkit-keyframes fadeOutLeftBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}

@keyframes fadeOutLeftBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}

.fadeOutLeftBig {
  -webkit-animation-name: fadeOutLeftBig;
  animation-name: fadeOutLeftBig;
}

@-webkit-keyframes fadeOutRight {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

@keyframes fadeOutRight {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

.fadeOutRight {
  -webkit-animation-name: fadeOutRight;
  animation-name: fadeOutRight;
}

@-webkit-keyframes fadeOutRightBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}

@keyframes fadeOutRightBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}

.fadeOutRightBig {
  -webkit-animation-name: fadeOutRightBig;
  animation-name: fadeOutRightBig;
}

@-webkit-keyframes fadeOutUp {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

@keyframes fadeOutUp {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

.fadeOutUp {
  -webkit-animation-name: fadeOutUp;
  animation-name: fadeOutUp;
}

@-webkit-keyframes fadeOutUpBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}

@keyframes fadeOutUpBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}

.fadeOutUpBig {
  -webkit-animation-name: fadeOutUpBig;
  animation-name: fadeOutUpBig;
}

@-webkit-keyframes flip {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  40% {
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  50% {
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  80% {
    -webkit-transform: perspective(400px) scale3d(.95, .95, .95);
    transform: perspective(400px) scale3d(.95, .95, .95);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
}

@keyframes flip {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  40% {
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  50% {
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  80% {
    -webkit-transform: perspective(400px) scale3d(.95, .95, .95);
    transform: perspective(400px) scale3d(.95, .95, .95);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
}

.animated.flip {
  -webkit-backface-visibility: visible;
  backface-visibility: visible;
  -webkit-animation-name: flip;
  animation-name: flip;
}

@-webkit-keyframes flipInX {
  from {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

@keyframes flipInX {
  from {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

.flipInX {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInX;
  animation-name: flipInX;
}

@-webkit-keyframes flipInY {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

@keyframes flipInY {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

.flipInY {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInY;
  animation-name: flipInY;
}

@-webkit-keyframes flipOutX {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0;
  }
}

@keyframes flipOutX {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0;
  }
}

.flipOutX {
  -webkit-animation-name: flipOutX;
  animation-name: flipOutX;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
}

@-webkit-keyframes flipOutY {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    opacity: 0;
  }
}

@keyframes flipOutY {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    opacity: 0;
  }
}

.flipOutY {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipOutY;
  animation-name: flipOutY;
}

@-webkit-keyframes lightSpeedIn {
  from {
    -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
    transform: translate3d(100%, 0, 0) skewX(-30deg);
    opacity: 0;
  }

  60% {
    -webkit-transform: skewX(20deg);
    transform: skewX(20deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: skewX(-5deg);
    transform: skewX(-5deg);
    opacity: 1;
  }

  to {
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes lightSpeedIn {
  from {
    -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
    transform: translate3d(100%, 0, 0) skewX(-30deg);
    opacity: 0;
  }

  60% {
    -webkit-transform: skewX(20deg);
    transform: skewX(20deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: skewX(-5deg);
    transform: skewX(-5deg);
    opacity: 1;
  }

  to {
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

.lightSpeedIn {
  -webkit-animation-name: lightSpeedIn;
  animation-name: lightSpeedIn;
  -webkit-animation-timing-function: ease-out;
  animation-timing-function: ease-out;
}

@-webkit-keyframes lightSpeedOut {
  from {
    opacity: 1;
  }

  to {
    -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
    transform: translate3d(100%, 0, 0) skewX(30deg);
    opacity: 0;
  }
}

@keyframes lightSpeedOut {
  from {
    opacity: 1;
  }

  to {
    -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
    transform: translate3d(100%, 0, 0) skewX(30deg);
    opacity: 0;
  }
}

.lightSpeedOut {
  -webkit-animation-name: lightSpeedOut;
  animation-name: lightSpeedOut;
  -webkit-animation-timing-function: ease-in;
  animation-timing-function: ease-in;
}

@-webkit-keyframes rotateIn {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, -200deg);
    transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes rotateIn {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, -200deg);
    transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

.rotateIn {
  -webkit-animation-name: rotateIn;
  animation-name: rotateIn;
}

@-webkit-keyframes rotateInDownLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes rotateInDownLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

.rotateInDownLeft {
  -webkit-animation-name: rotateInDownLeft;
  animation-name: rotateInDownLeft;
}

@-webkit-keyframes rotateInDownRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes rotateInDownRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

.rotateInDownRight {
  -webkit-animation-name: rotateInDownRight;
  animation-name: rotateInDownRight;
}

@-webkit-keyframes rotateInUpLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes rotateInUpLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

.rotateInUpLeft {
  -webkit-animation-name: rotateInUpLeft;
  animation-name: rotateInUpLeft;
}

@-webkit-keyframes rotateInUpRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -90deg);
    transform: rotate3d(0, 0, 1, -90deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes rotateInUpRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -90deg);
    transform: rotate3d(0, 0, 1, -90deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

.rotateInUpRight {
  -webkit-animation-name: rotateInUpRight;
  animation-name: rotateInUpRight;
}

@-webkit-keyframes rotateOut {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, 200deg);
    transform: rotate3d(0, 0, 1, 200deg);
    opacity: 0;
  }
}

@keyframes rotateOut {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, 200deg);
    transform: rotate3d(0, 0, 1, 200deg);
    opacity: 0;
  }
}

.rotateOut {
  -webkit-animation-name: rotateOut;
  animation-name: rotateOut;
}

@-webkit-keyframes rotateOutDownLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
}

@keyframes rotateOutDownLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
}

.rotateOutDownLeft {
  -webkit-animation-name: rotateOutDownLeft;
  animation-name: rotateOutDownLeft;
}

@-webkit-keyframes rotateOutDownRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}

@keyframes rotateOutDownRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}

.rotateOutDownRight {
  -webkit-animation-name: rotateOutDownRight;
  animation-name: rotateOutDownRight;
}

@-webkit-keyframes rotateOutUpLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}

@keyframes rotateOutUpLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}

.rotateOutUpLeft {
  -webkit-animation-name: rotateOutUpLeft;
  animation-name: rotateOutUpLeft;
}

@-webkit-keyframes rotateOutUpRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 90deg);
    transform: rotate3d(0, 0, 1, 90deg);
    opacity: 0;
  }
}

@keyframes rotateOutUpRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 90deg);
    transform: rotate3d(0, 0, 1, 90deg);
    opacity: 0;
  }
}

.rotateOutUpRight {
  -webkit-animation-name: rotateOutUpRight;
  animation-name: rotateOutUpRight;
}

@-webkit-keyframes hinge {
  0% {
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  20%, 60% {
    -webkit-transform: rotate3d(0, 0, 1, 80deg);
    transform: rotate3d(0, 0, 1, 80deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  40%, 80% {
    -webkit-transform: rotate3d(0, 0, 1, 60deg);
    transform: rotate3d(0, 0, 1, 60deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    opacity: 1;
  }

  to {
    -webkit-transform: translate3d(0, 700px, 0);
    transform: translate3d(0, 700px, 0);
    opacity: 0;
  }
}

@keyframes hinge {
  0% {
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  20%, 60% {
    -webkit-transform: rotate3d(0, 0, 1, 80deg);
    transform: rotate3d(0, 0, 1, 80deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  40%, 80% {
    -webkit-transform: rotate3d(0, 0, 1, 60deg);
    transform: rotate3d(0, 0, 1, 60deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    opacity: 1;
  }

  to {
    -webkit-transform: translate3d(0, 700px, 0);
    transform: translate3d(0, 700px, 0);
    opacity: 0;
  }
}

.hinge {
  -webkit-animation-name: hinge;
  animation-name: hinge;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes rollIn {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes rollIn {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.rollIn {
  -webkit-animation-name: rollIn;
  animation-name: rollIn;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes rollOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
    transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
  }
}

@keyframes rollOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
    transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
  }
}

.rollOut {
  -webkit-animation-name: rollOut;
  animation-name: rollOut;
}

@-webkit-keyframes zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  50% {
    opacity: 1;
  }
}

@keyframes zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  50% {
    opacity: 1;
  }
}

.zoomIn {
  -webkit-animation-name: zoomIn;
  animation-name: zoomIn;
}

@-webkit-keyframes zoomInDown {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
    transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
    transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

@keyframes zoomInDown {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
    transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
    transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

.zoomInDown {
  -webkit-animation-name: zoomInDown;
  animation-name: zoomInDown;
}

@-webkit-keyframes zoomInLeft {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
    transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
    transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

@keyframes zoomInLeft {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
    transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
    transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

.zoomInLeft {
  -webkit-animation-name: zoomInLeft;
  animation-name: zoomInLeft;
}

@-webkit-keyframes zoomInRight {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
    transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
    transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

@keyframes zoomInRight {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
    transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
    transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

.zoomInRight {
  -webkit-animation-name: zoomInRight;
  animation-name: zoomInRight;
}

@-webkit-keyframes zoomInUp {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
    transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
    transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

@keyframes zoomInUp {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
    transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
    transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

.zoomInUp {
  -webkit-animation-name: zoomInUp;
  animation-name: zoomInUp;
}

@-webkit-keyframes zoomOut {
  from {
    opacity: 1;
  }

  50% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  to {
    opacity: 0;
  }
}

@keyframes zoomOut {
  from {
    opacity: 1;
  }

  50% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  to {
    opacity: 0;
  }
}

.zoomOut {
  -webkit-animation-name: zoomOut;
  animation-name: zoomOut;
}

@-webkit-keyframes zoomOutDown {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
    transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
    transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

@keyframes zoomOutDown {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
    transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
    transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

.zoomOutDown {
  -webkit-animation-name: zoomOutDown;
  animation-name: zoomOutDown;
}

@-webkit-keyframes zoomOutLeft {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
    transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: scale(.1) translate3d(-2000px, 0, 0);
    transform: scale(.1) translate3d(-2000px, 0, 0);
    -webkit-transform-origin: left center;
    transform-origin: left center;
  }
}

@keyframes zoomOutLeft {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
    transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: scale(.1) translate3d(-2000px, 0, 0);
    transform: scale(.1) translate3d(-2000px, 0, 0);
    -webkit-transform-origin: left center;
    transform-origin: left center;
  }
}

.zoomOutLeft {
  -webkit-animation-name: zoomOutLeft;
  animation-name: zoomOutLeft;
}

@-webkit-keyframes zoomOutRight {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
    transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: scale(.1) translate3d(2000px, 0, 0);
    transform: scale(.1) translate3d(2000px, 0, 0);
    -webkit-transform-origin: right center;
    transform-origin: right center;
  }
}

@keyframes zoomOutRight {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
    transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: scale(.1) translate3d(2000px, 0, 0);
    transform: scale(.1) translate3d(2000px, 0, 0);
    -webkit-transform-origin: right center;
    transform-origin: right center;
  }
}

.zoomOutRight {
  -webkit-animation-name: zoomOutRight;
  animation-name: zoomOutRight;
}

@-webkit-keyframes zoomOutUp {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
    transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
    transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

@keyframes zoomOutUp {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
    transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
    animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
    transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
  }
}

.zoomOutUp {
  -webkit-animation-name: zoomOutUp;
  animation-name: zoomOutUp;
}

@-webkit-keyframes slideInDown {
  from {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInDown {
  from {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInDown {
  -webkit-animation-name: slideInDown;
  animation-name: slideInDown;
}

@-webkit-keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInLeft {
  -webkit-animation-name: slideInLeft;
  animation-name: slideInLeft;
}

@-webkit-keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInRight {
  -webkit-animation-name: slideInRight;
  animation-name: slideInRight;
}

@-webkit-keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInUp {
  -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
}

@-webkit-keyframes slideOutDown {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

@keyframes slideOutDown {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

.slideOutDown {
  -webkit-animation-name: slideOutDown;
  animation-name: slideOutDown;
}

@-webkit-keyframes slideOutLeft {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

@keyframes slideOutLeft {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

.slideOutLeft {
  -webkit-animation-name: slideOutLeft;
  animation-name: slideOutLeft;
}

@-webkit-keyframes slideOutRight {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

@keyframes slideOutRight {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

.slideOutRight {
  -webkit-animation-name: slideOutRight;
  animation-name: slideOutRight;
}

@-webkit-keyframes slideOutUp {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

@keyframes slideOutUp {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

.slideOutUp {
  -webkit-animation-name: slideOutUp;
  animation-name: slideOutUp;
}

/* ===== tooltipster.bundle.min.css ===== */
.tooltipster-fall,.tooltipster-grow.tooltipster-show{-webkit-transition-timing-function:cubic-bezier(.175,.885,.32,1);-moz-transition-timing-function:cubic-bezier(.175,.885,.32,1.15);-ms-transition-timing-function:cubic-bezier(.175,.885,.32,1.15);-o-transition-timing-function:cubic-bezier(.175,.885,.32,1.15)}.tooltipster-base{display:flex;pointer-events:none;position:absolute}.tooltipster-box{flex:1 1 auto}.tooltipster-content{box-sizing:border-box;max-height:100%;max-width:100%;overflow:auto}.tooltipster-ruler{bottom:0;left:0;overflow:hidden;position:fixed;right:0;top:0;visibility:hidden}.tooltipster-fade{opacity:0;-webkit-transition-property:opacity;-moz-transition-property:opacity;-o-transition-property:opacity;-ms-transition-property:opacity;transition-property:opacity}.tooltipster-fade.tooltipster-show{opacity:1}.tooltipster-grow{-webkit-transform:scale(0,0);-moz-transform:scale(0,0);-o-transform:scale(0,0);-ms-transform:scale(0,0);transform:scale(0,0);-webkit-transition-property:-webkit-transform;-moz-transition-property:-moz-transform;-o-transition-property:-o-transform;-ms-transition-property:-ms-transform;transition-property:transform;-webkit-backface-visibility:hidden}.tooltipster-grow.tooltipster-show{-webkit-transform:scale(1,1);-moz-transform:scale(1,1);-o-transform:scale(1,1);-ms-transform:scale(1,1);transform:scale(1,1);-webkit-transition-timing-function:cubic-bezier(.175,.885,.32,1.15);transition-timing-function:cubic-bezier(.175,.885,.32,1.15)}.tooltipster-swing{opacity:0;-webkit-transform:rotateZ(4deg);-moz-transform:rotateZ(4deg);-o-transform:rotateZ(4deg);-ms-transform:rotateZ(4deg);transform:rotateZ(4deg);-webkit-transition-property:-webkit-transform,opacity;-moz-transition-property:-moz-transform;-o-transition-property:-o-transform;-ms-transition-property:-ms-transform;transition-property:transform}.tooltipster-swing.tooltipster-show{opacity:1;-webkit-transform:rotateZ(0);-moz-transform:rotateZ(0);-o-transform:rotateZ(0);-ms-transform:rotateZ(0);transform:rotateZ(0);-webkit-transition-timing-function:cubic-bezier(.23,.635,.495,1);-webkit-transition-timing-function:cubic-bezier(.23,.635,.495,2.4);-moz-transition-timing-function:cubic-bezier(.23,.635,.495,2.4);-ms-transition-timing-function:cubic-bezier(.23,.635,.495,2.4);-o-transition-timing-function:cubic-bezier(.23,.635,.495,2.4);transition-timing-function:cubic-bezier(.23,.635,.495,2.4)}.tooltipster-fall{-webkit-transition-property:top;-moz-transition-property:top;-o-transition-property:top;-ms-transition-property:top;transition-property:top;-webkit-transition-timing-function:cubic-bezier(.175,.885,.32,1.15);transition-timing-function:cubic-bezier(.175,.885,.32,1.15)}.tooltipster-fall.tooltipster-initial{top:0!important}.tooltipster-fall.tooltipster-dying{-webkit-transition-property:all;-moz-transition-property:all;-o-transition-property:all;-ms-transition-property:all;transition-property:all;top:0!important;opacity:0}.tooltipster-slide{-webkit-transition-property:left;-moz-transition-property:left;-o-transition-property:left;-ms-transition-property:left;transition-property:left;-webkit-transition-timing-function:cubic-bezier(.175,.885,.32,1);-webkit-transition-timing-function:cubic-bezier(.175,.885,.32,1.15);-moz-transition-timing-function:cubic-bezier(.175,.885,.32,1.15);-ms-transition-timing-function:cubic-bezier(.175,.885,.32,1.15);-o-transition-timing-function:cubic-bezier(.175,.885,.32,1.15);transition-timing-function:cubic-bezier(.175,.885,.32,1.15)}.tooltipster-slide.tooltipster-initial{left:-40px!important}.tooltipster-slide.tooltipster-dying{-webkit-transition-property:all;-moz-transition-property:all;-o-transition-property:all;-ms-transition-property:all;transition-property:all;left:0!important;opacity:0}@keyframes tooltipster-fading{0%{opacity:0}100%{opacity:1}}.tooltipster-update-fade{animation:tooltipster-fading .4s}@keyframes tooltipster-rotating{25%{transform:rotate(-2deg)}75%{transform:rotate(2deg)}100%{transform:rotate(0)}}.tooltipster-update-rotate{animation:tooltipster-rotating .6s}@keyframes tooltipster-scaling{50%{transform:scale(1.1)}100%{transform:scale(1)}}.tooltipster-update-scale{animation:tooltipster-scaling .6s}.tooltipster-sidetip .tooltipster-box{background:#565656;border:2px solid #000;border-radius:4px}.tooltipster-sidetip.tooltipster-bottom .tooltipster-box{margin-top:8px}.tooltipster-sidetip.tooltipster-left .tooltipster-box{margin-right:8px}.tooltipster-sidetip.tooltipster-right .tooltipster-box{margin-left:8px}.tooltipster-sidetip.tooltipster-top .tooltipster-box{margin-bottom:8px}.tooltipster-sidetip .tooltipster-content{color:#fff;line-height:18px;padding:6px 14px}.tooltipster-sidetip .tooltipster-arrow{overflow:hidden;position:absolute}.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow{height:10px;margin-left:-10px;top:0;width:20px}.tooltipster-sidetip.tooltipster-left .tooltipster-arrow{height:20px;margin-top:-10px;right:0;top:0;width:10px}.tooltipster-sidetip.tooltipster-right .tooltipster-arrow{height:20px;margin-top:-10px;left:0;top:0;width:10px}.tooltipster-sidetip.tooltipster-top .tooltipster-arrow{bottom:0;height:10px;margin-left:-10px;width:20px}.tooltipster-sidetip .tooltipster-arrow-background,.tooltipster-sidetip .tooltipster-arrow-border{height:0;position:absolute;width:0}.tooltipster-sidetip .tooltipster-arrow-background{border:10px solid transparent}.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-background{border-bottom-color:#565656;left:0;top:3px}.tooltipster-sidetip.tooltipster-left .tooltipster-arrow-background{border-left-color:#565656;left:-3px;top:0}.tooltipster-sidetip.tooltipster-right .tooltipster-arrow-background{border-right-color:#565656;left:3px;top:0}.tooltipster-sidetip.tooltipster-top .tooltipster-arrow-background{border-top-color:#565656;left:0;top:-3px}.tooltipster-sidetip .tooltipster-arrow-border{border:10px solid transparent;left:0;top:0}.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-border{border-bottom-color:#000}.tooltipster-sidetip.tooltipster-left .tooltipster-arrow-border{border-left-color:#000}.tooltipster-sidetip.tooltipster-right .tooltipster-arrow-border{border-right-color:#000}.tooltipster-sidetip.tooltipster-top .tooltipster-arrow-border{border-top-color:#000}.tooltipster-sidetip .tooltipster-arrow-uncropped{position:relative}.tooltipster-sidetip.tooltipster-bottom .tooltipster-arrow-uncropped{top:-10px}.tooltipster-sidetip.tooltipster-right .tooltipster-arrow-uncropped{left:-10px}

/* ===== tooltipster-sideTip-borderless.min.css ===== */
.tooltipster-sidetip.tooltipster-borderless .tooltipster-box{border:none;background:#1b1b1b;background:rgba(10,10,10,.9)}.tooltipster-sidetip.tooltipster-borderless.tooltipster-bottom .tooltipster-box{margin-top:8px}.tooltipster-sidetip.tooltipster-borderless.tooltipster-left .tooltipster-box{margin-right:8px}.tooltipster-sidetip.tooltipster-borderless.tooltipster-right .tooltipster-box{margin-left:8px}.tooltipster-sidetip.tooltipster-borderless.tooltipster-top .tooltipster-box{margin-bottom:8px}.tooltipster-sidetip.tooltipster-borderless .tooltipster-arrow{height:8px;margin-left:-8px;width:16px}.tooltipster-sidetip.tooltipster-borderless.tooltipster-left .tooltipster-arrow,.tooltipster-sidetip.tooltipster-borderless.tooltipster-right .tooltipster-arrow{height:16px;margin-left:0;margin-top:-8px;width:8px}.tooltipster-sidetip.tooltipster-borderless .tooltipster-arrow-background{display:none}.tooltipster-sidetip.tooltipster-borderless .tooltipster-arrow-border{border:8px solid transparent}.tooltipster-sidetip.tooltipster-borderless.tooltipster-bottom .tooltipster-arrow-border{border-bottom-color:#1b1b1b;border-bottom-color:rgba(10,10,10,.9)}.tooltipster-sidetip.tooltipster-borderless.tooltipster-left .tooltipster-arrow-border{border-left-color:#1b1b1b;border-left-color:rgba(10,10,10,.9)}.tooltipster-sidetip.tooltipster-borderless.tooltipster-right .tooltipster-arrow-border{border-right-color:#1b1b1b;border-right-color:rgba(10,10,10,.9)}.tooltipster-sidetip.tooltipster-borderless.tooltipster-top .tooltipster-arrow-border{border-top-color:#1b1b1b;border-top-color:rgba(10,10,10,.9)}.tooltipster-sidetip.tooltipster-borderless.tooltipster-bottom .tooltipster-arrow-uncropped{top:-8px}.tooltipster-sidetip.tooltipster-borderless.tooltipster-right .tooltipster-arrow-uncropped{left:-8px}

/* ===== responsive/xs-phones.css ===== */
@media (max-width: 767px) {
	
	body{ border-top-color: #FF0000;}
	
	/* Sidebar Adjustments
	----------------------------*/
	
	/* Hide left sidebar on tiny screens. Adjust the CSS to stop it borking the other columns */
	#leftcolumn {
		display: none;
		float: none;
		width: 100%;
		clear: both;
		margin-left: 0;
	}
	
	/* Center column padding/margin adjustments */
	#contentcolumn {
		margin: 0 !important;
		padding: 0;
	}
	
	/* Break right column onto new line cleanly */
	#rightcolumn {
		float: none;
		width: 100%;
		margin-left: 0;
		clear: both;
	}
	
	/* Sidebar Widgets
	---------------------------------------- */
	.sidebar_widget {
		table-layout: fixed;
	}
	
	.profile_widget_avatar, .profile_widget_info, .profile_widget_list {
		display: block;
		vertical-align: top;
		float: none;
		width: 100%;
		margin: 0;
		padding: 0;
		text-align: center;
	}
	
	.profile_widget_avatar {
		margin-bottom: 30px;
	}

	.profile_widget_info li {
		line-height: 2.2em;
	}
	
	.profile_widget_list {
		padding-top: 0;
		border-top: none;
	}
	
	/* Grid Forumlist
	---------------------------------------- */
	
	/* Turn 3 columns into 1 */
	.forumlist_grid li.row,
	.forumlist_grid_icons li.row {
		width: 100%;	
	}	
	
	
	/* Custom Login Page
	---------------------------------------- */
	
	/* Last Post Avatar
	---------------------------------------- */	
	span.lastpostavatar {
		display: none;	
	}
	
	/* Subforums in column
	---------------------------------------- */	
	ul.sub-list {
		width: 100%;
	}	
	
	/* responsive logo
	---------------------------------------- */	
	
	/* override the dynamic inline width so that we can relatively resize logo below */
	#site-description {
		width: 100% !important;
	}
	
	#site-description img {
		max-width: 100%;
	}

	img.custom_logo {
		max-height: 100px !important;
	}
	
	/* pagination fix
	---------------------------------------- */
    .row .pagination {
        display: block;
        margin-top: 0;
    }   
	
	/* Fix overlapping forum images */
	.list-inner img {
		max-width: 100%;	
	}	
	
}

/* ===== responsive/small-smaller-tablets.css ===== */
@media (min-width: 768px) and (max-width: 991px) {
	
	body{ border-top-color: #FF3;}
	
	/* Global Containers
	---------------------------------------- */

	/* Add a small margin */
	.body-layout-Boxed #wrap {
		padding: 0 15px;
		width: auto;
	}
	
	
	/* Sidebar Structure
	---------------------------------------- */	
	
	/* Hide left sidebar on tiny screens and move it out of the way */
	#leftcolumn {
		display: none;
		margin-left: -100%;
	}
	
	/* Clear center column padding */
	#contentcolumn {
		margin: 0;
		padding: 0;
	}	
		
	/* Break right column (sidebar) onto new line cleanly */
	#rightcolumn {
		float: none;
		width: 100%;
		margin-left: 0;
		clear: both;
	}
	
	/* Sidebar Widgets
	---------------------------------------- */
	.sidebar_widget {
		table-layout: fixed;
	}
	
	.profile_widget_avatar, .profile_widget_info, .profile_widget_list {
		display: table-cell;
		vertical-align: top;
		float: none;
		width: auto;
	}
	
	.profile_widget_avatar {
		margin-bottom: 0;
	}
	
	.profile_widget_info {
		padding: 0 30px;
	}
	
	.profile_widget_list {
		padding-top: 0;
		border-top: none;
	}	
	
	/* Grid Forumlist
	---------------------------------------- */
	
	/* Turn 3 columns into 2 */
	.forumlist_grid li.row,
	.forumlist_grid_icons li.row {
		width: 50%;	
	}	
	
	/* Forumlist Colums
	---------------------------------------- */		
	
	/* Remove the 'topics' column */
	.forabg dd.posts, .forumbg dd.views {
		display: none;
	}
	
	/* Or, reduce the width of 'simpleposts' by 50% (from 190 to 95) */
	dd.simpleposts {
		width: 95px;	
	}
	
	/* Adjust the other margins to account for the (now missing) 95px */
	ul.topiclist dt {
		margin-right: -395px;
	}
	
	ul.topiclist dt .list-inner {
		margin-right: 395px;
	}
	
	.forabg li.header dt, .forumbg li.header dt {
		margin-right: -435px;	
	}

	/* Beta: Make 'last post' column less greedy */
		dd.lastpost {
			width: 200px;
		}

		ul.topiclist dt { /* overrides line 86 */
			margin-right: -295px;
		}

		.forabg li.header dt, .forumbg li.header dt {
			margin-right: -330px;	
		}
		
		ul.topiclist dt .list-inner {
			margin-right: 295px;
		}		


	
	
	/* Custom Login Page
	---------------------------------------- */	
	
	/* Clear the veritcal alignment. Top alignment is fine for smaller devices. Also make it narrower */
	.login_container {
		display: block;
		width: 450px;
	}
	
	/* Increase left and right container width to 100% */
	.login_container_left, .login_container_right {
		width: 100%;
		display: block;
	}
	
	/* Bit of top margin though, just so it doesn't look totally weird */
	.login_container_left {
		margin-top: 50px;
	}
	
	/* no min height on the left content for phones, way too small */
	.login_container_left_section_content {
		min-height: 0;
	}	
	
	/* Misc
	---------------------------------------- */		
	ul.topiclist li.stat_login_hide {
		display: none;
	}
	
	/* Hide the topic type labels when we're in a boxed layout with both sidebars */
	span.topic_type span {
		display: none;
	}		
	
	/* Subforums in column
	---------------------------------------- */	
	ul.sub-list {
		width: 100%;
	}
	
	/* responsive logo
	---------------------------------------- */	
	
	/* override the dynamic inline width so that we can relatively resize logo below */
	#site-description {
		width: 100% !important;
	}
	
	#site-description img {
		max-width: 100%;
	}	
}

/* ===== responsive/medium-ipad.css ===== */
@media (min-width: 992px)and (max-width: 1199px) {

	body{ border-top-color: #0F9;}

	/* Global Containers
	---------------------------------------- */

	/* Add a small margin */
	.body-layout-Boxed #wrap {
		padding: 0 15px;
		width: auto;
	}

	/* Sidebar Adjustments
	----------------------------*/

	/* Hide left sidebar on tiny screens */
	#leftcolumn {
		display: none;
	}

	/* Clear center column padding */
	#contentcolumn {
		padding-left: 0;
	}

	/* Expand center column to fill empty gap */
	#contentcolumn {
		margin-left: 0;
	}

	/* Grid Forumlist
	---------------------------------------- */

	/* Turn 3 columns into 2 */
	.forumlist_grid li.row,
	.forumlist_grid_icons li.row {
		width: 50%;
	}

	/***** Remove desc & last post, make topics & posts wider. Reduce row 1 height & overflow */
	body.sidebar-right-only .forumlist_grid .forum_description,
	body.sidebar-both .forumlist_grid .forum_description,
	body.sidebar-right-only .forumlist_grid_icons .forum_description,
	body.sidebar-both .forumlist_grid_icons .forum_description {

	}

	body.sidebar-right-only .forumlist_grid .tile_row_1,
	body.sidebar-both .forumlist_grid .tile_row_1,
	body.sidebar-right-only .forumlist_grid_icons .tile_row_1,
	body.sidebar-both .forumlist_grid_icons .tile_row_1	{
		height: 75px;
	}

	body.sidebar-right-only .forumlist_grid .tile_row_2,
	body.sidebar-both .forumlist_grid .tile_row_2,
	body.sidebar-right-only .forumlist_grid_icons .tile_row_2,
	body.sidebar-both .forumlist_grid_icons .tile_row_2	{
		margin-top: 0;
	}

	body.sidebar-right-only .forumlist_grid .tile_row_25,
	body.sidebar-both .forumlist_grid .tile_row_25,
	body.sidebar-right-only .forumlist_grid_icons .tile_row_25,
	body.sidebar-both .forumlist_grid_icons .tile_row_25	{
		width: 50%;
	}

	body.sidebar-right-only .forumlist_grid .tile_row_50,
	body.sidebar-both .forumlist_grid .tile_row_50,
	body.sidebar-right-only .forumlist_grid_icons .tile_row_50,
	body.sidebar-both .forumlist_grid_icons .tile_row_50 {
		display: none;
	}
	/* End minimal squishy fix */

	/* Forumlist Colums
	---------------------------------------- */

	/* Remove the 'last post' column */
	body.sidebar-both .forabg dd.lastpost,
	body.sidebar-both .forumbg dd.lastpost,
	body.sidebar-right-only .forabg dd.lastpost,
	body.sidebar-right-only .forumbg dd.lastpost {
		display: none;
	}

	/* Increase the other margins to account for the (now missing) 300px */
	body.sidebar-both ul.topiclist.forums dt,
	body.sidebar-right-only ul.topiclist.forums dt,
	body.sidebar-both ul.topiclist.topics dt,
	body.sidebar-right-only ul.topiclist.topics dt{
		margin-right: -195px;
	}

	body.sidebar-both ul.topiclist dt .list-inner,
	body.sidebar-right-only ul.topiclist dt .list-inner {
		margin-right: 195px;
	}

	body.sidebar-both li.header dt,
	body.sidebar-right-only li.header dt {
		margin-right: -235px;
	}



	/* UCP Columns
	---------------------------------------- */

	/* For the UCP columns, we need to override this */
	body.sidebar-both ul.topiclist.pmlist dt, body.sidebar-right-only ul.topiclist.pmlist dt {
		margin-right: -95px;
	}

	/* Same again... */
	body.sidebar-both ul.topiclist.pmlist dt .list-inner, body.sidebar-right-only ul.topiclist.pmlist dt .list-inner {
		margin-right: 95px;
	}

	/* UCP Two long columns */
	body.sidebar-both ul.two-long-columns dt .list-inner {
		margin-right: 0;
	}
	body.sidebar-both ul.two-long-columns dd.lastpost {
		display: none;
	}


	/* MCP Columns
	---------------------------------------- */

	/* Manually enabling the responsive layout. First, we remove the second column  */
	body.sidebar-both.body-layout-Boxed .missing-column dd,
	body.sidebar-both.body-layout-Fluid .missing-column dd,
	body.sidebar-right-only.body-layout-Boxed .missing-column dd,
	body.sidebar-right-only.body-layout-Fluid .missing-column dd {
		display: none;
	}

	/* But we still want the mark column, so re-enable that */
	body.sidebar-both.body-layout-Boxed .missing-column dd.mark,
	body.sidebar-both.body-layout-Fluid .missing-column dd.mark,
	body.sidebar-right-only.body-layout-Boxed .missing-column dd.mark,
	body.sidebar-right-only.body-layout-Fluid .missing-column dd.mark {
		display: block;
	}

	/* Reduce the left column margin to 95px, just enough for the mark box */
	body.sidebar-both.body-layout-Boxed ul.topiclist.missing-column dt,
	body.sidebar-both.body-layout-Fluid ul.topiclist.missing-column dt,
	body.sidebar-right-only.body-layout-Boxed ul.topiclist.missing-column dt,
	body.sidebar-right-only.body-layout-Fluid ul.topiclist.missing-column dt {
		margin-right: -95px;
	}

	body.sidebar-both.body-layout-Boxed ul.topiclist.missing-column dt .list-inner,
	body.sidebar-both.body-layout-Fluid ul.topiclist.missing-column dt .list-inner,
	body.sidebar-right-only.body-layout-Boxed ul.topiclist.missing-column dt .list-inner,
	body.sidebar-right-only.body-layout-Fluid ul.topiclist.missing-column dt .list-inner {
		margin-right: 95px;
	}

	/* Then enable the extra info below */
	body.sidebar-both.body-layout-Boxed ul.topiclist.missing-column	.responsive-show,
	body.sidebar-both.body-layout-Fluid ul.topiclist.missing-column	.responsive-show,
	body.sidebar-right-only.body-layout-Boxed ul.topiclist.missing-column .responsive-show,
	body.sidebar-right-only.body-layout-Fluid ul.topiclist.missing-column .responsive-show {
		display: block !important;
	}

	/* Hacky bookmark fix */
	body.sidebar-both.body-layout-Boxed ul.topiclist.missing-column li.header dt,
	body.sidebar-both.body-layout-Fluid ul.topiclist.missing-column li.header dt,
	body.sidebar-right-only.body-layout-Boxed ul.topiclist.missing-column li.header dt,
	body.sidebar-right-only.body-layout-Fluid ul.topiclist.missing-column li.header dt {
		margin-right: -125px;  /* 95px + 30px padding */
	}


	/* Manually enabling the responsive layout. First, we remove the second column header */
	body.sidebar-both.body-layout-Boxed ul.topiclist.two-long-columns dd,
	body.sidebar-both.body-layout-Fluid ul.topiclist.two-long-columns dd,
	body.sidebar-right-only.body-layout-Fluid ul.topiclist.two-long-columns dd {
		display: none;
	}

	/* Increase the left column width to 100% */
	body.sidebar-both.body-layout-Boxed ul.topiclist.two-long-columns dt,
	body.sidebar-both.body-layout-Fluid ul.topiclist.two-long-columns dt,
	body.sidebar-right-only.body-layout-Fluid ul.topiclist.two-long-columns dt .list-inner {
		margin-right: 0;
	}

	/* Then enable the extra info below */
	body.sidebar-both.body-layout-Boxed ul.topiclist.two-long-columns .responsive-show,
	body.sidebar-both.body-layout-Fluid ul.topiclist.two-long-columns .responsive-show,
	body.sidebar-right-only.body-layout-Fluid ul.topiclist.two-long-columns .responsive-show {
		display: block !important;
	}






	/* Custom Login Page
	---------------------------------------- */

	/* Clear the veritcal alignment. Make it wider for larger screens */
	.login_container {
		width: 900px;
	}

	/* For ACP Auth (and login_body.html...probably), reduce container width to 450px  */
	.auth-page-admin .login_container {
		width: 450px;
	}

	/* Split the columns down */
	.login_container_left, .login_container_right {
		width: 50%;
		display: table-cell;
		vertical-align: middle;
	}

	/* Min height for left column content, so that it's taller than the registration box */
	.login_container_left_section_content {
		min-height: 400px;
	}

	/* For ACP Auth (and login_body.html...probably), remove min-height */
	.auth-page-admin .login_container_left_section_content {
		min-height: 0;
	}

	/* Subforums in column
	---------------------------------------- */
	ul.sub-list {
		width: 100%;
	}

	/* responsive logo
	---------------------------------------- */

	/* override the dynamic inline width so that we can relatively resize logo below */
	#site-description {
		width: 100% !important;
	}

	#site-description img {
		max-width: 100%;
	}



}

/* ===== responsive/large-desktops.css ===== */
@media (min-width: 1200px) {

	body{ border-top-color: #F3F;}

	/* Fix the body layout for large desktop devices */
	.body-layout-Boxed .wrap {width: 1200px;}


	/* Forumlist Colums (also see squishy.css for fluid/both fix)
	---------------------------------------- */

	/* Remove the 'topics' column */
	body.sidebar-both.body-layout-Boxed .forabg dd.posts, body.sidebar-both.body-layout-Boxed .forumbg dd.views {
		display: none;
	}

	/* Or, reduce the width of 'simpleposts' by 50% (from 190 to 95) */
	body.sidebar-both.body-layout-Boxed dd.simpleposts, body.sidebar-both.body-layout-Boxed dd.simpleposts {
		width: 95px;
	}

	/* Adjust the other margins to account for the (now missing) 95px */
	body.sidebar-both.body-layout-Boxed ul.topiclist dt {
		margin-right: -395px;
	}

	body.sidebar-both.body-layout-Boxed ul.topiclist dt .list-inner {
		margin-right: 395px;
	}

	body.sidebar-both.body-layout-Boxed li.header dt {
		margin-right: -425px;
	}

	/* UCP columns
	---------------------------------------- */

	body.sidebar-both.body-layout-Boxed ul.topiclist.pmlist dt .list-inner {
		margin-right: 95px; /* Creates the space */
	}
	body.sidebar-both.body-layout-Boxed  ul.topiclist.two-columns dt {
		margin-right: -95px;
	}
	body.sidebar-both.body-layout-Boxed  ul.topiclist.two-columns li.header dt {
		margin-right: -130px;
	}

	/* UCP Two long columns */
	body.sidebar-both.body-layout-Boxed ul.two-long-columns dt .list-inner {
		margin-right: 0;
	}
	body.sidebar-both ul.two-long-columns dd.lastpost {
		display: none;
	}

	/* MCP Columns
	---------------------------------------- */

	/* Manually enabling the responsive layout. First, we remove the second column header */
	body.sidebar-both.body-layout-Boxed .missing-column dd,
	body.sidebar-right-only.body-layout-Boxed .missing-column dd {
		display: none;
	}

	/* But we still want the mark column, so re-enable that */
	body.sidebar-both.body-layout-Boxed .missing-column dd.mark,
	body.sidebar-right-only.body-layout-Boxed .missing-column dd.mark {
		display: block;
	}

	/* Reduce the left column margin to 95px, just enough for the mark box */
	body.sidebar-both.body-layout-Boxed ul.topiclist.missing-column dt,
	body.sidebar-right-only.body-layout-Boxed ul.topiclist.missing-column dt {
		margin-right: -95px;
	}
	body.sidebar-both.body-layout-Boxed ul.topiclist.missing-column dt .list-inner,
	body.sidebar-right-only.body-layout-Boxed ul.topiclist.missing-column dt .list-inner {
		margin-right: 95px;
	}
	/* Then enable the extra info below */
	body.sidebar-both.body-layout-Boxed ul.topiclist.missing-column	.responsive-show,
	body.sidebar-right-only.body-layout-Boxed ul.topiclist.missing-column	.responsive-show {
		display: block !important;
	}

	/* Hacky bookmark fix */
	body.sidebar-both.body-layout-Boxed ul.topiclist.missing-column li.header dt,
	body.sidebar-both.body-layout-Fluid ul.topiclist.missing-column li.header dt,
	body.sidebar-right-only.body-layout-Boxed ul.topiclist.missing-column li.header dt {
		margin-right: -125px; /* 95px + 30px padding */
	}



	/* Manually enabling the responsive layout. First, we remove the second column header */
	body.sidebar-both.body-layout-Boxed ul.topiclist.two-long-columns dd,
	body.sidebar-right-only.body-layout-Boxed ul.topiclist.two-long-columns dd {
		display: none;
	}

	/* Increase the left column width to 100% */
	body.sidebar-both.body-layout-Boxed ul.topiclist.two-long-columns dt,
	body.sidebar-right-only.body-layout-Boxed ul.topiclist.two-long-columns dt {
		margin-right: 0;
	}

	/* Then enable the extra info below */
	body.sidebar-both.body-layout-Boxed ul.topiclist.two-long-columns .responsive-show,
	body.sidebar-right-only.body-layout-Boxed ul.topiclist.two-long-columns .responsive-show {
		display: block !important;
	}



	/* Custom Login Page
	---------------------------------------- */

	/* Clear the veritcal alignment. Make it wider for larger screens */
	.login_container {
		width: 900px;
	}

	/* For ACP Auth (and login_body.html...probably), reduce container width to 450px  */
	.auth-page-admin .login_container {
		width: 450px;
	}

	/* Split the columns down */
	.login_container_left, .login_container_right {
		width: 50%;
		display: table-cell;
		vertical-align: middle;
	}

	/* Min height for left column content, so that it's taller than the registration box */
	.login_container_left_section_content {
		min-height: 400px;
	}

	/* For ACP Auth (and login_body.html...probably), remove min-height */
	.auth-page-admin .login_container_left_section_content {
		min-height: 0;
	}


	/* Grid
	---------------------------------------- */

	/***** Remove desc & last post, make topics & posts wider. Reduce row 1 height & overflow */
	body.sidebar-right-only.body-layout-Boxed .forumlist_grid .forum_description,
	body.sidebar-right-only.body-layout-Boxed .forumlist_grid_icons .forum_description {
		display: none;
	}

	body.sidebar-right-only.body-layout-Boxed .forumlist_grid .tile_row_1,
	body.sidebar-right-only.body-layout-Boxed .forumlist_grid_icons .tile_row_1	{
		height: 75px;
	}

	body.sidebar-right-only.body-layout-Boxed .forumlist_grid .tile_row_2,
	body.sidebar-right-only.body-layout-Boxed .forumlist_grid_icons .tile_row_2	{
		margin-top: 0;
	}

	body.sidebar-right-only.body-layout-Boxed .forumlist_grid .tile_row_25,
	body.sidebar-right-only.body-layout-Boxed .forumlist_grid_icons .tile_row_25	{
		width: 50%;
	}

	body.sidebar-right-only.body-layout-Boxed .forumlist_grid .tile_row_50,
	body.sidebar-right-only.body-layout-Boxed .forumlist_grid_icons .tile_row_50 {
		display: none;
	}
	/* End minimal squishy fix */


}

/* ===== responsive/squishy.css ===== */
/* Interim Breakpoints to stop the content squishing up when sidebars are enabled
---------------------------------------- */

	/* Hide the topic type labels when we're in a boxed layout with both sidebars */
	body.sidebar-both.body-layout-Boxed span.topic_type span {
		display: none;
	}	
		

	/* Forumlist Colums
	---------------------------------------- */		
	
	/* When the layout is fluid and both sidebars are enabled, hide the 'lastpost' column */
	@media (min-width: 1200px)and (max-width: 1299px) {
		/* Remove the 'topics' column */
		body.sidebar-both.body-layout-Fluid .forabg dd.posts, 
		body.sidebar-both.body-layout-Fluid .forumbg dd.views {
			display: none;
		}
		
		/* Or, reduce the width of 'simpleposts' by 50% (from 190 to 95) */	
		body.sidebar-both.body-layout-Fluid dd.simpleposts, 
		body.sidebar-right-only.body-layout-Fluid dd.simpleposts {
			width: 95px;	
		}		
		
		/* Adjust the other margins to account for the (now missing) 95px */
		body.sidebar-both.body-layout-Fluid ul.topiclist dt {
			margin-right: -395px;
		}
				
		
		body.sidebar-both.body-layout-Fluid ul.topiclist dt .list-inner {
			margin-right: 395px;
		}
		
		body.sidebar-both.body-layout-Fluid li.header dt {
			margin-right: -435px;	
		}	
		
		/* UCP Columns
		---------------------------------------- */			
		
		body.sidebar-both ul.topiclist.pmlist dt .list-inner, body.sidebar-right-only ul.topiclist.pmlist dt .list-inner {
			margin-right: 95px;
		}
		body.sidebar-both  ul.topiclist.two-columns dt {
			margin-right: -95px;	
		}			
		body.sidebar-both  ul.topiclist.two-columns li.header dt {
			margin-right: -130px;	
		}		
		
		/* UCP Two long columns */
		body.sidebar-both ul.two-long-columns dt .list-inner {
			margin-right: 0 !important;
		}		
		
		/* MCP Columns
		---------------------------------------- */
		
		/* Manually enabling the responsive layout. First, we remove the second column header */
		body.sidebar-right-only.body-layout-Fluid .missing-column dd {
			display: none;
		}
		
		/* But we still want the mark column, so re-enable that */
		body.sidebar-right-only.body-layout-Fluid .missing-column dd.mark {
			display: block;
		}
		
		/* Reduce the left column margin to 95px, just enough for the mark box */
		body.sidebar-right-only.body-layout-Fluid ul.topiclist.missing-column dt {
			margin-right: -95px;
		}
		
		body.sidebar-right-only.body-layout-Fluid ul.topiclist.missing-column dt .list-inner {	
			margin-right: 95px;
		}
		
		/* Then enable the extra info below */
		body.sidebar-right-only.body-layout-Fluid ul.topiclist.missing-column .responsive-show {
			display: block !important;
		}	
		
		/* Manually enabling the responsive layout. First, we remove the second column header */
		body.sidebar-right-only.body-layout-Fluid ul.topiclist.two-long-columns dd {
			display: none;	
		}
		
		/* Increase the left column width to 100% */
		body.sidebar-right-only.body-layout-Fluid ul.topiclist.two-long-columns dt .list-inner {
			margin-right: 0;	
		}
	
		/* Then enable the extra info below */	
		body.sidebar-right-only.body-layout-Fluid ul.topiclist.two-long-columns .responsive-show {
			display: block !important;
		}			
			
		
	}
	
	/* Between 1200 and 1400px, and when we're fluid with both sidebars enabled, apply the responsive layout for mcp missing-column */
	@media (min-width: 1200px)and (max-width: 1399px) {
		/* Manually enabling the responsive layout. First, we remove the second column header */
		body.sidebar-both.body-layout-Fluid .missing-column dd {
			display: none;
		}
		
		/* But we still want the mark column, so re-enable that */
		body.sidebar-both.body-layout-Fluid .missing-column dd.mark {
			display: block;
		}
		
		/* Reduce the left column margin to 95px, just enough for the mark box */
		body.sidebar-both.body-layout-Fluid ul.topiclist.missing-column dt {
			margin-right: -95px;
		}
		
		body.sidebar-both.body-layout-Fluid ul.topiclist.missing-column dt .list-inner {	
			margin-right: 95px;
		}
		
		/* Then enable the extra info below */ 
		body.sidebar-both.body-layout-Fluid ul.topiclist.missing-column	.responsive-show {
			display: block !important;
		}
		
		/* Manually enabling the responsive layout. First, we remove the second column header */
		body.sidebar-both.body-layout-Fluid ul.topiclist.two-long-columns dd {
			display: none;	
		}
		
		/* Increase the left column width to 100% */
		body.sidebar-both.body-layout-Fluid ul.topiclist.two-long-columns dt .list-inner {
			margin-right: 0;	
		}
	
		/* Then enable the extra info below */	
		body.sidebar-both.body-layout-Fluid ul.topiclist.two-long-columns .responsive-show {
			display: block !important;
		}				
		
		
					
	}

	/* Grid Forumlist
	---------------------------------------- */
	
	/* When boxed and both sidebars are enabled, reduce grid forumlist down to 2 columns */
	body.sidebar-both.body-layout-Boxed .forumlist_grid li.row,
	body.sidebar-both.body-layout-Boxed .forumlist_grid_icons li.row  {
		width: 50%;		
	}
	
	/* When fluid and the right sidebar is present, reduce to 2 columns between 1200px and 1500px */
	@media (min-width: 1200px)and (max-width: 1499px) {
		body.sidebar-both.body-layout-Fluid .forumlist_grid li.row, 
		body.sidebar-right-only.body-layout-Fluid .forumlist_grid li.row,
		body.sidebar-both.body-layout-Fluid .forumlist_grid_icons li.row, 
		body.sidebar-right-only.body-layout-Fluid .forumlist_grid_icons li.row {
			width: 50%;		
		}		
	}

/* ===== dark.css ===== */
/* high-contrast text */
.fd_dark h2, 
.fd_dark .panel-container h2, 
.fd_dark .tabs .activetab > a, 
.fd_dark .tabs .activetab > a:hover, 
.fd_dark .tabs .tab a:hover, 
.fd_dark .navigation .active-subsection a, 
.fd_dark .navigation .active-subsection a:hover, 
.fd_dark .navigation a:hover, 
.fd_dark .panel-container, 
.fd_dark label:hover, 
.fd_dark fieldset dl:hover dt label, 
.fd_dark dl.faq dt, 
.fd_dark h3, 
.fd_dark .content h2, 
.fd_dark .panel h2, 
.fd_dark fieldset.polls dl.voted, 
.fd_dark .button .icon, 
.fd_dark .inputbox, 
.fd_dark textarea, 
.fd_dark .message-box textarea, 
.fd_dark .panel-container table.table1 thead th, 
.fd_dark a.button1, 
.fd_dark input.button1, 
.fd_dark input.button3, 
.fd_dark a.button2, 
.fd_dark input.button2, 
.fd_dark a.button1:hover, 
.fd_dark input.button1:hover, 
.fd_dark a.button2:hover, 
.fd_dark input.button2:hover, 
.fd_dark input.button3:hover, 
.fd_dark .postbody .content, 
.fd_dark .pagination li a, 
.fd_dark select, 
.fd_dark .button-secondary, 
.fd_dark .global_read_mine:after, 
.fd_dark .global_read_locked_mine:after, 
.fd_dark .global_unread_mine:after, 
.fd_dark .global_unread_locked_mine:after, 
.fd_dark .announce_read_mine:after, 
.fd_dark .announce_read_locked_mine:after, 
.fd_dark .announce_unread_mine:after, 
.fd_dark .announce_unread_locked_mine:after, 
.fd_dark .sticky_read_mine:after, 
.fd_dark .sticky_read_locked_mine:after, 
.fd_dark .sticky_unread_mine:after, 
.fd_dark .sticky_unread_locked_mine:after, 
.fd_dark .topic_read_mine:after, 
.fd_dark .topic_read_hot_mine:after, 
.fd_dark .topic_unread_mine:after, 
.fd_dark .topic_unread_hot_mine:after, 
.fd_dark .topic_read_locked_mine:after, 
.fd_dark .topic_unread_locked_mine:after, 
.fd_dark .dropdown-extended .header, 
.fd_dark .dropdown-extended .footer, 
.fd_dark .pagination li.ellipsis span, 
.fd_dark .icon.icon-black, 
.fd_dark a:hover .icon.icon-black, 
.fd_dark .minitabs a:hover, 
.fd_dark .minitabs .activetab > a, 
.fd_dark .minitabs .activetab > .fd_dark a:hover,
.fd_dark li.row strong  {
	color: #CCCCCC !important;
	
}


/* subtle text */
html.fd_dark body, 
.fd_dark .copyright, 
.fd_dark ul.topiclist li, 
.fd_dark .panel, 
.fd_dark label, 
.fd_dark dd label, 
.fd_dark .signature, 
.fd_dark .postprofile, 
.fd_dark .postprofile strong, 
.fd_dark dl.details dd, 
.fd_dark dl.details dt, 
.fd_dark .content, 
.fd_dark .postbody, 
.fd_dark fieldset.polls dl, 
.fd_dark dl.file dd, 
.fd_dark table.table1 td, 
.fd_dark .dropdown-extended ul li:hover,
.fd_dark .mini_label, 
.fd_dark .mini_number, 
.fd_dark .forumlist_grid .forum_description,
.fd_dark .forumlist_grid_icons .forum_description {
	color: #969fab;
	
}


html.fd_dark {
	background-color: #101216 !important;
}


/* Light bg colours */
.fd_dark .navbar_o_header .navbar, 
.fd_dark .forabg, 
.fd_dark .forumbg, 
.fd_dark li.row, 
.fd_dark .bg1, 
.fd_dark .bg2, 
.fd_dark .bg3, 
.fd_dark .tabs .activetab > a, 
.fd_dark .tabs a:hover, 
.fd_dark ul.cplist, 
.fd_dark .panel, 
.fd_dark blockquote blockquote, 
.fd_dark .panel blockquote, 
.fd_dark .panel blockquote blockquote blockquote, 
.fd_dark .panel .codebox, 
.fd_dark .dropdown .dropdown-contents, 
.fd_dark .jumpbox-cat-link, 
.fd_dark .jumpbox-sub-link, 
.fd_dark .jumpbox-forum-link, 
.fd_dark .cp-main .message-box textarea, 
.fd_dark fieldset.quick-login input.inputbox, 
.fd_dark .fancy_panel,
.fd_dark .dropdown-extended .header,
.fd_dark .forumlist_grid .grid_image_container,
.fd_dark  body.content_block_header_stripe li.header,
.fd_dark .forumlist_grid_icons .grid_image_container {
	background: #242a36 !important;
	
}

/* Dark bg colours */
.fd_dark #inner-wrap, 
.fd_dark.navbar_o_header .navbar,
.fd_dark .panel-container .panel, 
.fd_dark .navigation .active-subsection a, 
.fd_dark .navigation a:hover, 
.fd_dark .cp-mini, 
.fd_dark .codebox,
.fd_dark .codebox code, 
.fd_dark blockquote, 
.fd_dark blockquote blockquote blockquote, 
.fd_dark .panel blockquote blockquote, 
.fd_dark .attachbox, 
.fd_dark .message-box textarea, 
.fd_dark .phpbb_alert, 
.fd_dark select, 
.fd_dark .minitabs a:hover, 
.fd_dark .minitabs .activetab > a, 
.fd_dark .minitabs .activetab > a:hover, 
.fd_dark .cp-main .pm, 
.fd_dark .bg3 .topicreview .bg2, 
.fd_dark .bg3 .topicreview .bg1,
.fd_dark .forumlist_grid_icons .forabg {
	background-color: #171b24 !important;
	
}

/* Middle grey (dark bg) */
.fd_dark .tabs .tab > a {
	background: rgba(255,255,255,0.04);
	
}

/* Middle grey (light bg) */
.fd_dark .navigation a, 
.fd_dark .minitabs .tab > a {
	background: rgba(0,0,0,0.15);
	
}





/* Really light elements (buttons / forms etc) */
.fd_dark .inputbox, 
.fd_dark .button, 
.fd_dark a.button1, 
.fd_dark input.button1, 
.fd_dark input.button3, 
.fd_dark a.button2, 
.fd_dark input.button2, 
.fd_dark .pagination li a {
	background: rgba(255,255,255,0.1);
	
}

/* button hover */
.fd_dark .button:hover, 
.fd_dark a.button1:hover, 
.fd_dark input.button1:hover, 
.fd_dark a.button2:hover, 
.fd_dark input.button2:hover, 
.fd_dark input.button3:hover,  
.fd_dark .search-results li:hover, 
.fd_dark .search-results li.active {
	background: rgba(255,255,255,0.2);
	
}


/* Super subtle borders */
.fd_dark .forumbg, 
.fd_dark .forabg, 
.fd_dark .navbar_o_header .navbar, 
.fd_dark .post, 
.fd_dark .bg3, 
.fd_dark .panel blockquote, 
.fd_dark .panel blockquote, 
.fd_dark .panel .codebox,
.fd_dark .forumlist_grid .grid_image_container,
.fd_dark .forumlist_grid_icons .grid_image_container {
	border: 1px solid rgba(255,255,255,0.04);
	
}

.fd_dark li.row, 
.fd_dark ul.linklist li, 
.fd_dark h3, 
.fd_dark ul.linklist, 
.fd_dark ul.topiclist dd, 
.fd_dark .postprofile, 
.fd_dark .signature, 
.fd_dark .tabs .activetab > a, 
.fd_dark .tabs .activetab > a:hover, 
.fd_dark .panel-container h3, 
.fd_dark .panel-container .panel li.row, 
.fd_dark .panel-container hr, 
.fd_dark .cp-menu hr, 
.fd_dark table.table1 tbody tr, 
.fd_dark table.table1 tbody td, 
.fd_dark hr, 
.fd_dark .panel h2, 
.fd_dark .content h2, 
.fd_dark .codebox, 
.fd_dark .codebox p, 
.fd_dark fieldset.polls dl, 
.fd_dark .attach-image img, 
.fd_dark .attachbox, 
.fd_dark .attachbox dd, 
.fd_dark .inputbox, 
.fd_dark .phpbb_alert, 
.fd_dark a.button1, 
.fd_dark input.button1, 
.fd_dark input.button3, 
.fd_dark a.button2, 
.fd_dark input.button2, 
.fd_dark a.button1:hover, 
.fd_dark input.button1:hover, 
.fd_dark a.button2:hover, 
.fd_dark input.button2:hover, 
.fd_dark input.button3:hover, 
.fd_dark .dropdown li.separator, 
.fd_dark select, 
.fd_dark .dropdown li, 
.fd_dark .dropdown li li, 
.fd_dark .jumpbox .dropdown li, 
.fd_dark .dropdown-extended .header, 
.fd_dark .dropdown-extended .footer, 
.fd_dark input.button1:focus, 
.fd_dark input.button2:focus, 
.fd_dark input.button3:focus, 
.fd_dark .caret, 
.fd_dark .pm .postprofile, 
.fd_dark .sidebar_content, 
.fd_dark .profile_widget_list,
.fd_dark .button,
.fd_dark .login_form_forgot_link {
	border-color: rgba(255,255,255,0.04);
	
}


/*A less subtle border for overlapping elements (dropdowns) */
.fd_dark .dropdown .dropdown-contents {
	border-color: rgba(255,255,255,0.15);
	
}




/* Super subtle hover effects */
.fd_dark li.row:hover, 
.fd_dark .dropdown-extended ul li:hover, 
.fd_dark table.table1 tbody tr:hover, 
.fd_dark table.table1 tbody tr.hover {
	background: rgba(0,0,0,0.05) !important;
	
}


/* Hacky overrides here, because..reasons */
.fd_dark li.row.reported, 
.fd_dark p.post-notice, 
.fd_dark .rules {
	background-color: rgba(211,17,65,0.2) !important;
	color: #BC2A4D;
	
}

.fd_dark .dropdown .pointer-inner, 
.fd_dark .jumpbox .dropdown .pointer-inner {
	border-color: #242a36 transparent;
	
}


.fd_dark input#keywords::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #CCCCCC;
}
.fd_dark input#keywords::-moz-placeholder { /* Firefox 19+ */
  color: #CCCCCC;
}
.fd_dark input#keywords:-ms-input-placeholder { /* IE 10+ */
  color: #CCCCCC;
}
.fd_dark input#keywords:-moz-placeholder { /* Firefox 18- */
  color: #CCCCCC;
}

.fd_dark input#search_keywords::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #CCCCCC;
}
.fd_dark input#search_keywords::-moz-placeholder { /* Firefox 19+ */
  color: #CCCCCC;
}
.fd_dark input#search_keywords:-ms-input-placeholder { /* IE 10+ */
  color: #CCCCCC;
}
.fd_dark input#search_keywords:-moz-placeholder { /* Firefox 18- */
  color: #CCCCCC;
}


/* Ajustments */
.fd_dark .badge {
	border: 1px solid #242A36;
}

.fd_dark ul.cplist {
	border-top: none;
}

.fd_dark .forumlist_grid ul.forums {margin: 0; padding: 0; background: none;}
.fd_dark .forumlist_grid .forabg {background: none !important; border: none;}
.fd_dark .forumlist_grid li.row {background: none !important;}
.fd_dark .forumlist_grid li.row:hover {background: none !important;}

/* ===== fonts.css ===== */
/* Consolidation of fonts (*shield your eyes, there are many of them!). Families, then sizes and weights */

/* The basics */
html {
	font-size: 100%;
}

i, em {
	font-style: italic;
}

b, strong {
	font-weight: 500;
}

body {

}

.codebox code {
	font: 0.9em Monaco, "Andale Mono","Courier New", Courier, monospace;
}


/* Sizes */
h1 {/* Forum name */ font-size: 30px;}
.site-description p {font-size: 14px;}
h2 {/* Forum header titles */ font-size: 1.8em;}
h3 {/* Sub-headers (also used as post headers, but defined later) */ font-size: 1em;}
h4 {/* Forum and topic list titles */ font-size: 1.3em;}
ul#nav-main > li > a, ul#nav-main > li > div > a {font-size: 1.2em;}
dd.posts, dd.topics, dd.views, dd.extra, dd.mark, li.header dd.lastpost, ul#nav-breadcrumbs li {font-size: 1.2em}
li.header .icon {font-size: 1em;}
.small {font-size: 0.9em !important;}
a.forumtitle, a.topictitle {font-size: 1.2em;}
.badge {font-size: 10px;}
.pagination li a {font-size: 0.9em;}
.contact-icons {font-size: 0;}
.topic_type {font-size: 0.9em;}
.forumlist_grid_title {font-size: 1.4em;}
.grid_unread {font-size: 0.8em;}
li.row dd.simpleposts span {font-size: 1.5em;}
li.header dt {font-size: 1.2em;}
.tile_title {font-size: 1.3em;}
.mini_number {font-size: 1.2em;}
.forumlist_grid span.forum_description {font-size: 14px;}
.forumlist_grid span.grid_cat_title {font-size: 2em;}
.forumlist_grid_icons span.forum_description {font-size: 14px;}
.forumlist_grid_icons span.grid_cat_title {font-size: 2em;}





/* Weights */
h1 {/* Forum name */ font-weight: 300;}
h2 {/* Forum header titles */ font-weight: 300;}
li.row dd.simpleposts span {font-weight:  300;}
h3 {/* Sub-headers (also used as post headers, but defined later) */ font-weight: 500;}
ul#nav-breadcrumbs > li.breadcrumbs {font-weight: 300;}
.breadcrumbs .crumb:before {font-weight: 500;}
table.table1 thead th {font-weight: normal;}
table.info tbody th {font-weight: normal;}
.pagination li.active span {font-weight: normal;}
.error {font-weight: 500;}
.dropdown-extended .header {font-weight: 500;}
.dropdown-extended .header .header_settings {font-weight: normal;}
.notification_list p.notifications_title strong {font-weight: 500;}
.button {font-weight: normal;}
ul.topiclist dt {font-weight: normal;}
li.header dt, li.header dd {font-weight: 300;}
dd.posts, dd.topics, dd.views, dd.extra, dd.mark {font-weight: 300;}
li.row dd.simpleposts span {font-weight: 300;}
dl.faq dt {font-weight: 500;}
blockquote cite {/* Username/source of quoter */ font-style: normal; font-weight: 500;}
blockquote cite > div {font-weight: normal;}
.codebox p {font-weight: 500;}
.attachbox p {font-weight: normal;}
.attachbox p.stats {font-weight: normal;}
dl.file dt {font-weight: 500;}
dl.thumbnail dd {font-style: italic;}
fieldset.polls dl.voted {font-weight: 500;}
dd.profile-warnings {font-weight: 500;}
.dl_links strong {font-weight: 500;}
#memberlist tr.inactive, #team tr.inactive {font-style: italic;}
.panel-container table.table1 tbody th {font-style: italic;}
.tabs .tab, .minitabs .tab {font-weight: 500;}
.tabs .dropdown, .minitabs .dropdown {font-weight: normal;}
.navigation li {font-weight: 500;}
dl.mini dt {font-weight: 500;}
.friend-online {font-weight: 500;}
.friend-offline {font-style: italic;}
.tabs .dropdown, .minitabs .dropdown {font-weight: normal;}
input {font-weight: normal;}
select {font-weight: normal;}
dt label {font-weight: 500;}
a.button1, input.button1 {font-weight: 500;}
input.button3 {font-variant: small-caps;}
input.disabled {font-weight: normal;}
.jumpbox-cat-link, .jumpbox-forum-link { font-weight: 500; }
a.forumtitle {font-weight: 500;}
a.topictitle {font-weight: 500;}
a.lastsubject {font-weight: 400;text-decoration: none;}
.postprofile a, .postprofile dt.author a {font-weight: 500; text-decoration: none;}
.search .postprofile a {font-weight: normal;}
.username-coloured {font-weight: 500;}
.grid_unread {font-weight: 300;}
.tile_title {font-weight: 500;}
.forumlist_grid .forum_description {font-weight: 300 !important;}
.forumlist_grid_icons .forum_description {font-weight: 300 !important;}
.mini_label {font-weight: 400;}
.mini_number {font-weight: 600;}
.grid_cat_title {font-weight: 500;}

/* ===== milk.css ===== */
/* New code for new things */
#inner-wrap {
	background: #FFFFFF;
	position: relative;
	margin-top: -50px !important;
	z-index: 3;
}

#inner-wrap:after {
	content: "";
	display: table;
	clear: both;
	height: 0;
}

.viewtopic_wrapper {
	padding: 10px 10px 5px;
}

.sub-forumlist ul {
	float: left;
	list-style-type: none;
	margin-left: 20px !important;
}

.sub-forumlist li {
	line-height: 1.5em;
}

body.force_rounded_avatars span.lastpostavatar img.avatar {
    border-radius: 25px;
}

.viewtopic_wrapper .phpbb-ads-center {
	padding: 15px;
}

span.forumlist_mods {
	display: inline-block;
	margin-top: 8px;
}

.forumlist_mods a {
	display: inline-block !important;
	margin-bottom: 5px;
	border-radius: 15px;
	background: rgba(0,0,0,.05);
	padding: 5px 12px 5px 30px !important;
}

.forumlist_mods a:hover {
	text-decoration: none !important;
	background: rgba(0,0,0,.1);
}

.fd_dark .forumlist_mods a {background: rgba(0,0,0,.25);}
.fd_dark .forumlist_mods a:hover {background: rgba(0,0,0,.3);}


.forumlist_mods a i {
	margin-right: 5px;
	margin-left: -23px;
	padding: 5px 4px;
	position: absolute;
	font-size: 8px;
	color: #FFFFFF !important;
	border-radius: 50%;
	background: rgba(0,0,0,0.2);
}


.forumlist_mods a i:before {
	padding-right: 0px !important;
}


.headerbar_overlay_container {
	position: absolute;
	width: 100%;
	height: 100%;
}

span.forum_description {
	width: 100%;
	display: block;
}

.outline_button {
	border: 2px solid rgba(255,255,255,.4);
	border-radius: 9999px;
}

.specialbutton, 
.specialbutton .icon,
.specialbutton:hover, 
.specialbutton:hover .icon,
.fd_dark .specialbutton .icon,
.fd_dark .specialbutton:hover,
.fd_dark a.button2:hover,
.fd_dark input.button2:hover,
.fd_dark input.button2:focus {
	color: #FFFFFF !important;
}
 /* Oculta el mensaje de copyright en el footer */
.copyright_bar {
    display: none !important;
}

/* ===== lightbox.css ===== */
/* =========================================================
   Lightbox para imágenes de los mensajes (foro Milk v2)
   Al pulsar una imagen dentro de un post se muestra ampliada
   sobre un fondo oscurecido, sin salir del foro.
   ========================================================= */

#mk-lightbox {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.85);
	display: none;
	align-items: center;
	justify-content: center;
	z-index: 99999;
	padding: 40px 20px;
	box-sizing: border-box;
	opacity: 0;
	transition: opacity 0.2s ease;
}

#mk-lightbox.mk-lb-activo {
	display: flex;
	opacity: 1;
}

#mk-lightbox-wrapper {
	position: relative;
	max-width: 95%;
	max-height: 95%;
	display: flex;
	align-items: center;
	justify-content: center;
}

#mk-lightbox-img {
	display: block;
	max-width: 95vw;
	max-height: 95vh;
	border-radius: 4px;
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.6);
	background: transparent;
	transform: scale(0.96);
	transition: transform 0.2s ease;
}

#mk-lightbox.mk-lb-activo #mk-lightbox-img {
	transform: scale(1);
}

#mk-lightbox-cerrar {
	position: absolute;
	top: -42px;
	right: -8px;
	width: 34px;
	height: 34px;
	line-height: 34px;
	text-align: center;
	border: none;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.15);
	color: #ffffff;
	font-size: 16px;
	cursor: pointer;
	transition: background 0.15s ease;
	padding: 0;
}

#mk-lightbox-cerrar:hover,
#mk-lightbox-cerrar:focus {
	background: rgba(255, 255, 255, 0.3);
}

#mk-lightbox-loading {
	position: absolute;
	color: #ffffff;
	font-size: 13px;
	opacity: 0.8;
}

/* En pantallas pequeñas, la X se queda dentro del área visible */
@media (max-width: 600px) {
	#mk-lightbox {
		padding: 20px 12px;
	}
	#mk-lightbox-cerrar {
		top: 6px;
		right: 6px;
		background: rgba(0, 0, 0, 0.5);
	}
}

/* El cursor avisa de que la imagen es ampliable */
.postbody .content img.mk-lb-zoomable {
	cursor: zoom-in;
}

/* ===== Reglas propias (antes al final de stylesheet.css) ===== */
.seo-h1,
.seo-h2,
.seo-intro {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

/* ===== ACCESIBILIDAD: Correcciones de contraste WCAG AA ===== */

/* Usernames con contraste insuficiente sobre fondo blanco:
   #009999 ratio 3.5:1 → #007a7a ratio 4.6:1
   #009900 ratio 3.6:1 → #007700 ratio 4.7:1
   #BE0099 ratio 3.5:1 → #990080 ratio 4.5:1 */
a.username-coloured[style*="color: #009999"],
span.username-coloured[style*="color: #009999"] {
    color: #007a7a !important;
}
a.username-coloured[style*="color: #009900"],
span.username-coloured[style*="color: #009900"] {
    color: #007700 !important;
}
a.username-coloured[style*="color: #BE0099"],
span.username-coloured[style*="color: #BE0099"] {
    color: #990080 !important;
}

/* Contraste de texto secundario en listas de foros */
span.forum_description {
    color: #555555;
}
dd.topics, dd.posts, dd.views {
    color: #555555;
}
dd.lastpost span, dd.lastpost time,
dd.time span, dd.time time {
    color: #555555;
}

/* Links de colapso sin texto discernible: texto oculto para lectores de pantalla */
.collapse-trigger a[href="#"]::after {
    content: "Contraer o expandir sección";
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    border: 0;
}

/* ===== FIN ACCESIBILIDAD ===== */

.link-hover {
  color: #fff;
  text-decoration: none;
  font-weight: bold;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  transition: transform 0.2s ease, color 0.2s ease;
  will-change: transform;
}

.link-hover:hover {
  color: #84BE63;
  transform: scale(1.08);
  text-decoration: none;
}

.icon-hover {
  transition: transform 0.2s ease;
  display: inline-block;
}

.icon-hover:hover {
  transform: scale(1.1);
}

.discord-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 16px;
  cursor: pointer;
  background-color: #5865F2;
  color: white;
  font-weight: 600;
  font-size: 16px;
  border: none;
  border-radius: 30px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.2);
  transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease;
}

.discord-btn:hover {
  transform: scale(1.06);
  box-shadow: 0 6px 18px rgba(0,0,0,0.35);
  filter: brightness(1.1);
}