/*!******************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[0].use[2]!./assets/styles/styles.css ***!
  \******************************************************************************************************************************************************************************/
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
   ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */

html {
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

/* Sections
   ========================================================================== */

/**
 * Remove the margin in all browsers.
 */

body {
  margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */

main {
  display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */

h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/* Grouping content
   ========================================================================== */

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */

hr {
  box-sizing: content-box; /* 1 */
  height: 0; /* 1 */
  overflow: visible; /* 2 */
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

pre {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/* Text-level semantics
   ========================================================================== */

/**
 * Remove the gray background on active links in IE 10.
 */

a {
  background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */

abbr[title] {
  border-bottom: none; /* 1 */
  text-decoration: underline; /* 2 */
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted; /* 2 */
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */

b,
strong {
  font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

code,
kbd,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/**
 * Add the correct font size in all browsers.
 */

small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Embedded content
   ========================================================================== */

/**
 * Remove the border on images inside links in IE 10.
 */

img {
  border-style: none;
}

/* Forms
   ========================================================================== */

/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */

button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */

button,
input { /* 1 */
  overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */

button,
select { /* 1 */
  text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */

button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */

fieldset {
  padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */

legend {
  box-sizing: border-box; /* 1 */
  color: inherit; /* 2 */
  display: table; /* 1 */
  max-width: 100%; /* 1 */
  padding: 0; /* 3 */
  white-space: normal; /* 1 */
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */

progress {
  vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */

textarea {
  overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */

[type="checkbox"],
[type="radio"] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */

[type="search"] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */

[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/* Interactive
   ========================================================================== */

/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */

details {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */

summary {
  display: list-item;
}

/* Misc
   ========================================================================== */

/**
 * Add the correct display in IE 10+.
 */

template {
  display: none;
}

/**
 * Add the correct display in IE 10.
 */

[hidden] {
  display: none;
}

body {
    font-family: "Roboto", Arial, sans-serif;
    font-size: 1rem;
    color: rgb(34, 34, 34);
    background-color: #FFF;
	overflow: auto;
	height: auto;
}

body h2 {
		font-size: 2.75rem;
		text-align: center;
		padding-bottom: 2rem;
	}

* {
    box-sizing: border-box;
    margin: 0px;
    padding: 0px;
}

.hidden {
    visibility: hidden;
	display: none;
}

.hidden--under-medium{
		display: none;
	}

@media (min-width: 768px) {

.hidden--under-medium{
			display: block
	}
    }

.hidden--over-medium{
		display: block;
	}

@media (min-width: 768px) {

.hidden--over-medium{
			display: none;
			position: absolute
	}
    }

.hidden--remove{
		position: absolute;
	}

.header {
	padding-top: .5rem;
	padding-bottom: .5rem;
	position: sticky;
	top: 0;
	z-index: 10;
	background-color: rgb(34, 34, 34);
	width: 100%;
/*
	@mixin atSmall{
		background-color: rgb(112, 0, 0);
	}

	@mixin atMedium{
		background-color: rgb(134, 110, 0);
	}

	@mixin atLarge{
		background-color: rgb(11, 134, 0);
	}

	@mixin atLarger{
		background-color: rgb(0, 85, 134);
	}
*/
}

.header--tall {
		height: 112px;
	}

@media (min-width: 530px) {

.header {
		position: sticky;
		top: 0;
		z-index: 10;
		background-color: rgb(34, 34, 34);
		width: 100%;
		height: auto;
  }
    }

.header__container {
		display: flex;
	}

.header__logo {
		display: flex;
		width: 8.1rem;
		position: relative;


	}

@media (min-width: 768px) {

.header__logo {
			width: 8.1rem;
			flex: none;


	}
    }

.header__logo a img {
			height: 2.5rem;
		}

.header__logo span {
			color: rgb(189, 189, 189);
			font-size: .7rem;
			position: absolute;
			top: 2rem;
			left: .2rem;
		}

.header__search {
		position: absolute;
		display: block;
		top: 65px;
		left: 0;
		width: 100%;
		align-items: center;
		justify-content: center;
	}

@media (min-width: 530px) {

.header__search {
			width: 100px;
			position: static;
			display: flex;
			vertical-align: top;
			justify-content: center;
			flex: 1
	}
    }

.header__editor-menu {
		width: 100px;
		position: static;
		display: flex;
		align-items: center;
		justify-content: center;
		flex: 1;

	}

.header__filter {
		position: absolute;
		top: 55px;
	}

@media (min-width: 530px) {

.header__filter {
			position: static;
			top: 0
	}
    }

.header__nav {
		display: flex;
		justify-content: right;
		align-items: center;
		width: 8.1rem;
		margin-left: auto;
	}

@media (min-width: 530px) {

.header__nav {
			width: 8.1rem;
	}
    }

@media (min-width: 768px) {

.header__nav {
			flex: none;
			justify-content: center;
			align-items: center;
	}
    }

.header__nav--wide {
			width: 36rem;
		}

@media (min-width: 768px) {

.header__nav--wide {
				width: 36rem
		}
    }

.header__help {
		cursor: pointer;

	}

.header__help i {
			color: rgb(189, 189, 189);
			
			font-size: 2rem;
			width: 2rem;
			height: 2rem;
		}

.header__user {
		margin-left: 14px;
		cursor: pointer;
	}

.header__user i {
			color: rgb(189, 189, 189);
			
			font-size: 2rem;
			width: 2rem;
			height: 2rem;
		}

.header__pending{
		width: 1.73rem;
		height: 1.73rem;
		border-radius: .865rem;
		margin-right: 24px;
		background-color: #EBC12C;
		text-align: center;
		padding-top: .19rem;
	}

.header__pending:link {
			color: rgb(34, 34, 34);
		}

.header__pending:visited {
			color: rgb(34, 34, 34);
		}

.header__menu-btn {
			float: right;
			padding: 5px 5px 5px 5px;
			margin-right: 0.5rem;
			font-size: 1.64rem;
			color: #848a9b;
			cursor: pointer;
	}

.header__edit-menu {
		padding: 0 5px;
		text-align: center;
	}

.header__edit-menu--always-center{
			text-align: center;
		}

@media (min-width: 768px) {

.header__edit-menu {
			text-align: center;
  }
    }

.header__mobile-filters {
		height: 447px;
	}

@media (min-width: 530px) {

.header__mobile-filters {
			height: auto
	}
    }

.header--search-active{
		color: rgb(34, 34, 34);
		background-color: white;
	}

.search__container{
		display: flex;
		width: 100%;
		padding: 0 10px;
	}

@media (min-width: 530px) {

.search__container{
			max-width: 520px
	}
    }

.search__input{
		flex: 1;
        padding: 10px;
		height: 40px;
		border: none;
        -webkit-appearance: none;
           -moz-appearance: none;
                appearance: none;
		border-radius: 5px;
	}

.search__input:focus {
			outline: 2px solid #b22222;
			outline-offset: -3px;
		}

@media (min-width: 530px) {

.search__input {
			width: 200px;
  }
    }

@media (min-width: 768px) {

.search__input {
			width: 500px;
  }
    }

.search__options{
		width: 40px;
		height: 40px;
		margin-left: 8px;
		border-radius: 3px;
		background-color: #b22222;
		cursor: pointer;
	}

.search__options:hover{
			background-color: #df2d2d;
		}

.search__options i{
			color: rgb(238, 238, 238);
			font-size: 30px;
			margin: 3px 0 0 6px;

		}

.search__no-results{
		color: rgb(189, 189, 189);
		margin-top: 50px;
		text-align: center;
		font-size: 35px;
	}

.search__no-results i {
			margin-right: 15px;
			margin-top: 2px;
			font-size: 35px;
			height: 35px;
			width: 35px;
		}

.search-popup{
    position: fixed;
    top: 59.39px;
    right: 0;
    width: 100%;
    height: 100%;
    padding: .94rem;
    background-color: white;
    
    box-sizing: border-box;
    visibility: hidden;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 12px 0px;
    z-index: 10;
}

@media (min-width: 530px) {

.search-popup{
		border-radius: 10px;
		top: 3rem;
		width: 500px;
}
    }

.search-popup a{
        text-decoration: none;
    }

.search-popup__input{
        width: 100%;
        padding: 10px;
		border: none;
        -webkit-appearance: none;
           -moz-appearance: none;
                appearance: none;
        outline: rgb(189, 189, 189) solid 1px;
		border-radius: 5px;
    }

@media (min-width: 530px) {
    }

.search-popup__input:focus{
		outline: #b22222 solid 2px;
    }

.search-popup--active{
        visibility: visible;
    }

.search-popup--active--results{
			height: 100%;
        }

@media (min-width: 530px) {

.search-popup--active--results{
				height: auto
        }
    }

.search-popup__content-box{
		margin-top: 10px;
        height: 500px;
    }

@media (min-width: 530px) {

.search-popup__content-box{
			height: auto
    }
    }

.search-results{
	display: flex;

	outline: #000 solid 1px;
	width: 100%;
	height: 100px;
    
}

.search-results :hover{
		background-color: rgb(254, 254, 204);
	}

.search-results__thumbnail{
		position: relative;
		top: 10px;
		left: 10px;
		display: inline-block;
		width: 80px;
		height: 80px;
    }

.search-results__thumbnail img{
            border-radius: 4px;
			-o-object-fit: cover;
			   object-fit: cover;
			width: 100%;
			height: 100%;
        }

.search-results__content{
		display: inline-block;
		flex: 1;
		margin-left: 20px;
	}

.search-results__title{
        position: relative;
		top: 10px;
        color: #b22222;
        font-size: .97rem;
        text-align: center;
		font-weight: 500;
    }

.search-results__title i{
            font-size: 1rem;
        }

.search-results__link{
		display: block;
		margin: 8px 0 0 0;
        color: #b22222;
    }

.config-tile__icon {
    font-size: 200px;
    height: 200px;
    padding-top: 20px;
    color: rgb(34, 34, 34);
    width: auto;
  }

.config-grid-parent {
  display: grid;
  padding-top: 50px;
  margin: 20px;
  grid-template-columns: repeat(auto-fit, 300px);
  grid-auto-rows: 320px;
  gap: 20px;
  }

.config-grid-tile {
  box-sizing: border-box;
  position: relative;
  background-color: #f6f6f6;
  padding: 20px;
  border-radius: 4px;
  text-align: center;
  text-decoration: none;
  color: rgb(34, 34, 34);
  z-index: 1;
  pointer-events: none;

}

.config-grid-tile__tile-link {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 320px;
    height: 320px;
    pointer-events: initial;

  }

.config-grid-tile__tile-link :visited {
      text-decoration: none;
      color: rgb(100, 100, 100);
    }

.config-grid-tile__title {
    width: 258px;
    position: absolute;
    top: 10px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    font-size: 15px;
    margin: 0;
  }

.config-grid-tile__status {
    font-size: 13px;
    -webkit-text-size-adjust: 100%;
       -moz-text-size-adjust: 100%;
            text-size-adjust: 100%;
  }

.config-grid-tile__image {
    margin-top: 15px;
    max-width: 100%;
    height: auto;
    display: block;
    border-radius: 5px;
    z-index: 2;
  }

.config-grid-tile__icon {
    font-size: 200px;
    padding-top: 50px;
    height: 200px;
    width: auto;
    z-index: 2;
  }

.config-grid-tile:hover {
  color: rgb(34, 34, 34);
}

.config-grid-tile:hover img {
  filter: brightness(110%);
}

.config-grid-tile .tile-author-items {
  position: absolute;
  top: 295px;
  left: 0;
  font-size: 13px;
  color: #999999;
  text-decoration: none;
  width: 290px;
  height: 30px;
  border-radius: 8px;
  text-align: right;
  padding-top: 5px;
  padding-right: 5px;
  z-index: 3;
  overflow: visible;
}

.config-grid-tile .tile-author-items .post-status {
  position: absolute;
  top: 5px;
  left: 15px;
  width: 265px;
  text-align: left;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  color: rgb(100, 100, 100);
}

.config-grid-tile .tile-author-items .post-status-pending {
  color: rgb(238, 199, 115);
  width: 190px;
}

.config-grid-tile .tile-author-items .post-status-publish {
  color: rgb(136, 201, 171);
  width: 190px;
}

.config-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, 320px);
    grid-auto-rows: 320px;
    -moz-column-gap: 23px;
         column-gap: 23px;
    row-gap: 23px;
    justify-content: center;
}

.config-grid__tile {
        grid-column: span 1;
        grid-row: span 1;
    }

/* @import "modules/_rating"; */

.like {
    position: relative;
    height: 44px;
    top: 7px;
}

.like__box{
        position: relative;
        height: 30px;
		width: auto;
        margin-top: 20px;
        margin-left: auto;
        margin-right: auto;
		text-align: center;
    }

.like__count {
		position: absolute;
		top: 10px;
		font-size: 20px;
		color: #EBC12C;
	}

.like__thumbsup {
		color: rgb(50, 50, 50);
		height: 47px;
		width: 47px;
		font-size: 47px;
		cursor: pointer;
		transition: none;
		-webkit-text-stroke: 2px #EBC12C;
	}

.like__thumbsup--liked {
			color: #EBC12C;
			-webkit-text-stroke: none;
		}

.like__tile-div{
		position: absolute;
		bottom: -35px;
		left: 0;
		width: 320px;
		text-align: center;
	}

.like__tile-bg{
		margin-top: -10px;
		padding: 1px 7px 6px 7px;
		background-color: rgba( 0, 0, 0, .65);
		border-radius: 4px;
	}

.like__tile-thumbsup {
		color: #EBC12C;
		height: 25px;
		width: 25px;
		font-size: 25px;
		transition: none;
		margin-right: 10px;
		margin-top: 2px;
	}

.like__tile-count {
		position: relative;
		top: 1px;
		font-size: 17px;
		color: #EBC12C;

		padding-right: 5px;
	}

.button {
	display: inline-block;
	min-width: 34px;
	font-size: 1rem;
	background-color: #b22222;
	color: rgb(238, 238, 238);
	text-align: center;
	text-decoration: none;
	border-radius: 5px;
	margin: 5px 0 5px 5px;
	cursor: pointer;
	padding: .365rem 0 .365rem 0;
}

.button--fixed-120 {
		width: 120px;
		padding-top: 6px;
	}

.button i {
		font-size: 1rem;
		height: 1rem;
		width: 1rem;
		pointer-events: none;
		transform: scale( 130% );
	}

.button .dashicons {
		margin-top: .3rem;
		padding-top: -1px;
	}

.button--icon-small i {
		transform: scale( 90% );
	}

.button:hover {
		background-color: #df2d2d;
	}

@media (min-width: 768px) {
			.button--insert-text i {
				margin-right: 10px;
			}
    }

.button--insert-text .dashicons {
			margin-top: 2px;
		}

@media (min-width: 768px) {

.button--save {
			width: 150px
	}
			.button--save::after {
				content: 'SAVE';
			}
    }

@media (min-width: 768px) {

.button--submit {
			width: 150px
	}
			.button--submit::after {
				content: 'SUBMIT';
			}
    }

.button--publish {
		color: rgb(34, 34, 34);
		background-color: #EBC12C;
		margin-left: 0;
	}

.button--publish:hover {
			background-color: #ffd230;
		}

@media (min-width: 768px) {

.button--publish {
			width: 150px;
  }
			.button--publish::after {
				content: 'PUBLISH';
			}
    }

@media (min-width: 768px) {

.button--preview {
			width: 150px
	}
			.button--preview::after {
				content: 'PREVIEW';
			}
    }

@media (min-width: 768px) {

.button--delete {
			width: 150px
	}
			.button--delete::after {
				content: 'DELETE';
			}
    }

@media (min-width: 768px) {

.button--edit {
			width: 150px
	}
			.button--edit::after {
				content: 'EDIT';
			}
    }

@media (min-width: 768px) {

.button--insert-image {
			width: 190px
	}
			.button--insert-image::after {
				content: 'INSERT IMAGE';
			}
    }

@media (min-width: 768px) {

.button--insert-code {
			width: 190px
	}
			.button--insert-code::after {
				content: 'INSERT XIM CODE';
			}
    }

@media (min-width: 768px) {

.button--insert-youtube {
			width: 190px
	}
			.button--insert-youtube::after {
				content: 'INSERT YOUTUBE';
			}
    }

@media (min-width: 768px) {

.button--insert-notes {
			width: 190px
	}
			.button--insert-notes::after {
				content: 'INSERT TEXT';
			}
    }

@media (min-width: 768px) {

.button--insert-section {
			width: 190px
	}
			.button--insert-section::after {
				content: 'INSERT SECTION';
			}
    }

.button--disabled{
		background-color: rgb(50, 50, 50);
		color: rgb(189, 189, 189);
		cursor: default;
	}

.button--disabled:hover {
			background-color: rgb(50, 50, 50);
		}

.button--right{
      	float: right;
    }

.button--icon-r-margin-10 i{
			margin-right: 10px;
		}

.button--margin-r-10 {
		margin-right: 15px;
	}

.wrapper {
    padding-left: 10px;
    padding-right: 10px;
    margin-left: auto;
    margin-right: auto;

}

@media (min-width: 1100px) {

.wrapper {
        width: 1100px;
        padding-left: 0;
        padding-right: 0;

}
    }

@media (min-width: 1350px) {

.wrapper {
        width: 1350px;

}
    }

.wrapper--center{
        width: 100%;
    }

.wrapper--t-margin {
        padding-top: 25px;
    }

@media (min-width: 530px) {

.wrapper--t-margin {
            padding-top: 50px
    }
    }

@media (min-width: 768px) {

.wrapper--large-padding {
            max-width: 900px
    }
    }

.wrapper--no-padding {
        padding-left: 0;
        padding-right: 0;
    }

.wrapper--500 {
		width: 500px;
		margin-left: auto;
		margin-right: auto;
	}

.primary-nav {
    margin-top: .8rem;
}

@media (min-width: 768px) {

.primary-nav--right {
			float: right
    }
    }

.primary-nav li {
		list-style: none;
		text-align: center;
		padding: 7px 0;
    }

@media (min-width: 768px) {

.primary-nav li {
			padding: 0;
			float: left;
			padding-right: 1.5rem
    }
    }

.primary-nav__link {
		width: auto;
		font-size: 1.0rem;
		text-decoration: none;
		color: rgb(238, 238, 238);
    }

.primary-nav__link--admin{
			color: #EBC12C;
		}

@media (min-width: 768px) {

.primary-nav__link {
			font-size: 1.1rem;
  }
    }

.primary-nav--admin{
		width: auto;
		font-size: 1.0rem;
		text-decoration: none;
		color: #EBC12C;
	}

@media (min-width: 768px) {

.primary-nav--admin{
			font-size: 1.1rem
	}
    }

/* Customize the label (the container) */

.container {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 12px;
    cursor: pointer;
    font-size: 1.2rem;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
  }

/* Hide the browser's default checkbox */

.container input {
    position: absolute;
    opacity: 1;
    cursor: pointer;
    height: 0;
    width: 0;
  }

/* Create a custom checkbox */

.checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 25px;
    width: 25px;
    background-color: #eee;
  }

.checkmark__group-title {
      font-size: 1.5rem;
      font-weight: 400;
      width: 350px;
      margin-bottom: 18px;
      text-align: center;
    }

/* On mouse-over, add a grey background color */

.container:hover input ~ .checkmark {
    background-color: #ccc;
  }

/* When the checkbox is checked, add a blue background */

.container input:checked ~ .checkmark {
    background-color: #b22222;
  }

/* Create the checkmark/indicator (hidden when not checked) */

.checkmark:after {
    content: "";
    position: absolute;
    display: none;
  }

/* Show the checkmark when checked */

.container input:checked ~ .checkmark:after {
    display: block;
  }

/* Style the checkmark/indicator */

.container .checkmark:after {
    left: 9px;
    top: 5px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 3px 3px 0;
    transform: rotate(45deg);
  }

.pagination{
    text-align: center;
    padding: 0;

}

.pagination__page-link{
        font-weight: 700;
        text-decoration: none;
    }

.pagination__btn{
        position: relative;
        background-color: rgb(189, 189, 189);
        height: 40px;
        width: 40px;
        border-radius: 20px;
		cursor: pointer;
    }

.pagination__btn--current{
            background-color: #b22222;
        }

.pagination__text{
        width: 40px;
        position: relative;
        text-align: center;
        top: 11px;
        color: #b22222;
    }

.pagination__text--current{
            color: rgb(189, 189, 189);
        }

.pagination li {
        list-style: none;
        display: inline-block;
        margin-left: 6px;
        margin-right: 6px;
    }

@keyframes rotating {
    0% {transform: rotate(0deg);}
    100% {transform: rotate(360deg);}
}

@keyframes pulse {
    0% {transform: scale(100%);}
    25% {transform: scale(150%);}
    100% {transform: scale(100%);}
}

.loading__fullscreen-bg{
		position: fixed;
		top: 0;
		background-color: rgba( 255, 255, 255, .45);
		width: 100%;
		height: 100%;
	}

.loading__icon{
		height: 17px;
		width: 17px;
		font-size: 17px;
		margin-left: -2px;
		margin-top: 1px;
        transform-origin: 50% 50%;
        color: rgb(238, 238, 238);
        animation-name: rotating;
        animation-duration: .4s;
        animation-timing-function: linear;
        animation-iteration-count: infinite;

    }

.loading__icon--black {
			color: rgb(34, 34, 34);
		}

@media (min-width: 768px) {

.loading__icon {
			margin-right: 10px;
			height: 20px;
			width: 20px;
			font-size: 20px;
  }
    }

.loading__icon--medium{
			position: relative;
			top: -7px;
			left: 6px;
			height: 35x;
			width: 35px;
			font-size: 35px;
		}

.loading__icon--large{
			position: relative;
			top: -5px;
			height: 50px;
			width: 50px;
			font-size: 50px;
		}

.loading__icon--grid{
			position: fixed;
			top: 50%;
			left: 50%;
			translate: -50px -25px;
			height: 100px;
			width: 100px;
			font-size: 100px;
			color: #b22222;

		}

.loading__icon--grid--bar{
				translate: -50px 12px;
			}

.loading__icon--grid--filter{
				translate: -50px 145px;
			}

.loading__response{
        animation-name: pulse;
        animation-iteration-count: 1;
	}

.ximcp__header {
		background-color: rgb(50, 50, 50);
		padding-top: 10px;
		padding-bottom: 15px;
		border-bottom: 2px solid rgb(34, 34, 34);
		box-shadow: 0 5px 10px rgba( 0, 0, 0, .4 );
	}

.ximcp__status{
		position: relative;
		text-align: center;
		color: rgb(238, 238, 238);
		padding-top: 10px;
		padding-bottom: 5px;
		font-size: 1.25rem;
	}

.ximcp__status--pending{
			color: rgb(238, 238, 238);
		}

.ximcp__status--publish{
			color: rgb(238, 238, 238);
		}

.ximcp__tile-title{
		position: absolute;
		top: 24px;
		left: 0;
		width: 320px;
		height: auto;
		background-color: rgba( 0, 0, 0, .65);
		color: rgb(238, 238, 238);
		font-weight: 500;
		font-size: 1.3rem;
		text-align: center;
		padding: 5px 10px;
	}

.ximcp__tile-author {
		font-weight: 500;
		font-size: .75rem;
	}

.ximcp__post-title {
		padding-top: 1rem;
		padding-bottom: .75rem;
		background-color: transparent;
		font-size: 2.25rem;
		color: rgb(238, 238, 238);
		width: 100%;
		text-align: center;
		font-weight: 400;
		outline: none;
		border: 0;
		border-radius: 10px;
		margin-bottom: 0;
	}

.ximcp__post-title--edit{
			outline: 2px solid rgb(189, 189, 189);
			outline-offset: -5px;
			padding: 1rem 10px .75rem 10px;
		}

@media (min-width: 530px) {

.ximcp__post-title {
			font-size: 2.25rem;
			padding-top: 1.25rem;
			padding-bottom: 1rem;
  }
    }

.ximcp__post-author {
		background-color: transparent;
		font-size: 1rem;
		color: rgb(238, 238, 238);
		width: 100%;
		text-align: center;
		font-weight: 400;
		outline: none;
		border: 0;
		border-radius: 10px;
	}

@media (min-width: 530px) {

.ximcp__post-author {
			font-size: 1.2rem;
			margin-bottom: 2rem
	}
    }

.ximcp__thumbnail-overflow {
		position: relative;
		display: inline-block;
		display: flex;
		width: 320px;
		height: 320px;
		margin-right: auto;
		margin-left: auto;
		
		overflow: visible;
	}

@media (min-width: 530px) {

.ximcp__thumbnail-overflow {
			width: 450px;
			height: 450px;
			border-radius: 39px
	}
    }

@media (min-width: 768px) {

.ximcp__thumbnail-overflow {
			width: 525px;
			height: 525px;
			border-radius: 39px
	}
    }

.ximcp__thumbnail-div {
		position: relative;
		display: inline-block;
		display: flex;
		width: 320px;
		height: 320px;
		border-radius: 24px;
		margin-right: auto;
		margin-left: auto;
		
		overflow: hidden;
		box-shadow: 5px 5px 10px rgba( 0, 0, 0, .75 );
	}

@media (min-width: 530px) {

.ximcp__thumbnail-div {
			width: 450px;
			height: 450px;
			border-radius: 39px;
	}
    }

@media (min-width: 768px) {

.ximcp__thumbnail-div {
			width: 525px;
			height: 525px;
			border-radius: 39px;
	}
    }

.ximcp__thumbnail-div--edit{
			cursor: pointer;
		}

.ximcp__thumbnail-div--edit:hover{
				filter: brightness(110%);
			}

.ximcp__thumbnail-div--small{
			width: 320px;
			height: 320px;
			border-radius: 24px;
			box-shadow: 3px 3px 5px rgba( 0, 0, 0, .3 );
		}

.ximcp__thumbnail-div--small:hover{
				filter: brightness(110%);
			}

.ximcp__copy-button {
		position: absolute;
		top: 5px;
		right: 10px;
	}

.ximcp__featured-badge {
		position: absolute;
		top: -10px;
		left: -12px;
		height: 75px;
		width: 75px;
	}

.ximcp__featured-badge img {
			width: 75px;
			height: 75px;
		}

.ximcp__thumbnail-image {
		-o-object-fit: cover;
		   object-fit: cover;
		width: 100%;
		height: 100%;
	}

.ximcp__tile-link {
		position: absolute;
		top: 0;
		left: 0;
		display: block;
		width: 320px;
		height: 320px;
		pointer-events: initial;
	}

.ximcp__tile-link :visited {
		  text-decoration: none;
		  color: rgb(100, 100, 100);
		}

.ximcp__edit-icon {
		position: absolute;
		top: 10px;
		right: 10px;
		background-color: rgba( 255, 255, 255, .75 );
		border-radius: 12px;
		height: 70px;
		width: auto;
		cursor: pointer;
	}

@media (min-width: 530px) {

.ximcp__edit-icon {
			top: 15px;
			right: 55px;
			height: 80px
	}
    }

@media (min-width: 768px) {

.ximcp__edit-icon {
			top: -15px;
			right: -15px;
			height: 92px
	}
    }

.ximcp__featured-toggle {
		position: absolute;
		top: -16px;
		left: -16px;
		border: 5px dashed transparent;
		border-radius: 62px;
		width: 76px;
		height: 76px;

	}

@media (min-width: 530px) {

.ximcp__featured-toggle {
			left: 16px;
			width: 124px;
			height: 124px;

	}
    }

@media (min-width: 768px) {

.ximcp__featured-toggle {
			left: -16px;
			width: 124px;
			height: 124px;

	}
    }

.ximcp__featured-toggle img {
			position: absolute;
			top: -4px;
			left: -4px;
			width: 75px;
			height: 75px;
		}

@media (min-width: 530px) {

.ximcp__featured-toggle img {
				left: -4px;
				width: 124px;
				height: 124px
		}
    }

@media (min-width: 768px) {

.ximcp__featured-toggle img {
				left: -4px;
				width: 124px;
				height: 124px
		}
    }

.ximcp__featured-toggle--edit {
			background-color: rgba( 255, 255, 255, .5 );
			border: 5px dashed #b22222;
			cursor: pointer;
		}

.ximcp__game-list{
		width: 500px;
		text-align: center;
		font-size: 1rem;
		color: red;
	}

.ximcp__platform-icon {
		width: auto;
		height: 49px;
		border-radius: 5px;
		margin-right: 3px;
	}

@media (min-width: 530px) {

.ximcp__platform-icon {
			height: 62px;
			border-radius: 10px;
			margin-right: 5px;
	}
    }

@media (min-width: 768px) {

.ximcp__platform-icon {
			height: 65px;
			border-radius: 10px;
			margin-right: 5px;
	}
    }

.ximcp__platform-icon--small{
			height: 49px;
			border-radius: 5px;
			margin-right: 3px;
		}

.ximcp__platform-div {
		position: absolute;
		width: auto;
		height: auto;
		padding: 5px 5px 0px 5px;
		bottom: 64px;
		right: 12px;
		border-radius: 6px;
		background-color: rgba( 255, 255, 255, .75 );
	}

@media (min-width: 530px) {

.ximcp__platform-div {
			padding: 10px 5px 5px 10px;
			bottom: 100px;
			right: 23px;
			border-radius: 12px;
	}
    }

@media (min-width: 768px) {

.ximcp__platform-div {
			padding: 10px 5px 5px 10px;
			bottom: 120px;
			right: 23px;
			border-radius: 12px;
	}
    }

.ximcp__platform-div--small{
			padding: 5px 5px 0px 8px;
			bottom: 64px;
			right: 12px;
			border-radius: 6px;
		}

.ximcp__mapping-icon{
		width: auto;
		height: 32px;
	}

@media (min-width: 530px) {

.ximcp__mapping-icon{
			height: 45px;
	}
    }

@media (min-width: 768px) {

.ximcp__mapping-icon{
			height: 55px;
	}
    }

.ximcp__mapping-icon--small{
			height: 32px;
		}

.ximcp__mapping-div {
		position: absolute;
		width: auto;
		height: auto;
		padding: 5px 5px 0px 5px;
		bottom: 12px;
		right: 12px;
		border-radius: 6px;
		background-color: rgba( 255, 255, 255, .75 );
	}

@media (min-width: 530px) {

.ximcp__mapping-div {
			padding: 10px 10px 7px 10px;
			bottom: 23px;
			right: 23px;
			border-radius: 12px;
	}
    }

.ximcp__mapping-div--small{
			padding: 5px 5px 0px 5px;
			bottom: 12px;
			right: 12px;
			border-radius: 6px;
		}

.ximcp__options {
		color: rgb(238, 238, 238);
		text-align: center;
		margin-top: 25px;
		margin-bottom: 0px;

	}

.ximcp__options h4{
			font-size: 1.25rem;
			font-weight: 500;
			margin-bottom: 10px;
		}

.ximcp__options p {
			font-size: .8rem;
			font-weight: 300;
			margin-bottom: 20px;
		}

.ximcp__options--filter{
			margin-bottom: 0;
		}

.ximcp__options--filter-mapping {
			display: inline-block;
			width: 161px;
			margin-bottom: 0;
		}

.ximcp__options--filter-mapping-arrow {
			display: inline-block;
			width: 30px;
			margin-bottom: 0;
		}

.ximcp__options--filter-mapping-arrow img {
				height: 45px;
				margin-bottom: 40px;
			}

.ximcp__filter-mappings-div{
		background-color: rgb(238, 238, 238);
		border-radius: 8px;
		margin-bottom: 7px;
		padding: 3px 0;
	}

.ximcp__option-icon {
		width: auto;
		height: 70px;
		border-radius: 10px;
		margin-left: 9px;
		margin-right: 9px;
		outline: 4px solid transparent;
		outline-offset: 5px;
		margin-top: 10px;
		margin-bottom: 10px;
		background-color: rgb(238, 238, 238);
	}

.ximcp__option-icon--platform {
			height: 65px;
			background-color: transparent;
		}

.ximcp__option-icon {

		box-sizing: content-box;
		cursor: pointer;
}

@media (min-width: 530px) {

.ximcp__option-icon {
			height: 55px;
			border-radius: 10px;
			margin-left: 9px;
			margin-right: 9px;
			outline: 4px solid transparent;
			outline-offset: 5px;
  }
    }

.ximcp__option-icon--action {
			height: 45px;
			background-color: transparent;
		}

.ximcp__option-icon--action--filter {
				height: 39px;
				border-radius: 5px;
			}

.ximcp__option-icon--filter{
			height: 45px;
			margin-left: 4px;
			margin-right: 4px;
			margin-bottom: 4px;
			outline-offset: 2px;
			border-radius: 5px;
		}

@media (min-width: 530px) {

.ximcp__option-icon--filter{
				height: 55px;
				border-radius: 5px;
				margin: 4px;
				outline: 4px solid transparent;
				outline-offset: 0px;
				padding:0
		}
    }

.ximcp__option-icon--output {
			padding-left: 5px;
			padding-right: 5px;
		}

.ximcp__option-icon--selected{
			outline: 4px solid #b22222;
			filter: brightness(100%);
		}

.ximcp__option-icon--selected-filter{
			outline: 3px solid #b22222;
			filter: brightness(100%);
		}

.ximcp__option-icon:hover {
			filter: brightness(130%);
		}

.ximcp__inputs input {
			display: none;
		}

.ximcp__load-more{
		text-align: center;
		margin-top: 30px;
		margin-bottom: 10px;
		cursor: pointer;
	}

.ximcp__load-more span{
			color: rgb(238, 238, 238);
			background-color: #b22222;
			padding: 10px 15px 9px 15px;
			border-radius: 6px;
		}

.ximcp__load-more span:hover{
				background-color: red;
			}

.ximcp__load-more i{
			color: rgb(238, 238, 238);
			margin-right: 5px;
			margin-top: 0px;
		}

.ximcp__block-section{
		position: relative;
		padding-top: 35px;
		padding-bottom: 35px;
		margin-bottom: 35px;
		border-bottom: 1px solid #b22222;
		margin-left: 15px;
		margin-right: 15px;
	}

.ximcp__block-section--edit {
			border-bottom: 3px solid #b22222;
		}

.ximcp__delete-block{
		position: absolute;
		top: -10px;
		right: 0;
	}

@media (min-width: 1100px) {

.ximcp__delete-block{
			top: -15px;
			right: 5px
	}
    }

.ximcp__block-title{
		width: 100%;
		text-align: center;
		font-size: 45px;
		font-weight: 700;
		color: rgb(34, 34, 34);
		margin-bottom: 25px;
	}

.ximcp__code-textarea{
		width: 100%;
		color: rgb(34, 34, 34);
		font-family:'Courier New', Courier, monospace;
		text-align: center;
		margin-bottom: 25px;
		resize: none;
		overflow: hidden;
		padding: 1.5rem;
	}

.ximcp__code-textarea::-moz-placeholder {
			font-family: "Roboto", Arial, sans-serif;;
			text-align: center;
		}

.ximcp__code-textarea::placeholder {
			font-family: "Roboto", Arial, sans-serif;;
			text-align: center;
		}

.ximcp__code-button{
		margin-top: 20px;
		text-align: center;
		font-size: 20px;
		color: rgb(238, 238, 238);
	}

.ximcp__code-button span{
			display: inline-block;
			width: 180px;
			padding: 10px;
			background-color: #b22222;
			border-radius: 10px;
			box-shadow: 3px 3px 5px rgba( 0, 0, 0, .3 );
			cursor: pointer;
		}

.ximcp__code-button span i {
				margin-right: 5px;
			}

.ximcp__code-button span:hover{
				background-color: #df2d2d;
			}

.ximcp__code-button--click{
			animation-name: click;
			animation-duration: .1s;
			animation-timing-function: linear;
			animation-iteration-count: 1;
		}

.ximcp__media-section{
		position: relative;
		margin-top: 20px;
		margin-bottom: 20px;
	}

.ximcp__media-section input {
			margin-left: 5px;
		}

.ximcp__insert-media {
		margin-bottom: 5px;
	}

.ximcp__insert-media span {
			margin-bottom: 10px;
		}

.ximcp__block-image {
		position: relative;
		display: flex;
		justify-content: center;
		margin-top: 1rem;
		align-items: center;
		overflow: hidden;
		width: 100%;
		padding-bottom: 56.25%;
		border-radius: 5px;
	}

.ximcp__block-image img {
			position: absolute;
			-o-object-fit: contain;
			   object-fit: contain;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%
		}

.ximcp__block-image--edit{
			cursor: pointer;
		}

.ximcp__block-image--edit:hover{
				filter: brightness(110%);
			}

.ximcp__media-controls{
		position: relative;
		width: 100%;
		top: 5px;
		right: 0px;
	}

.ximcp__media-controls--video{
			display: flex;
		}

.ximcp__delete-video{
		position: absolute;
		top: 40px;
		right: 5px;
	}

@media (min-width: 768px) {

.ximcp__delete-video{
			position: relative;
			display: inline-block;
			top: 0;
			right: 0
	}
    }

.ximcp__delete-image{
		position: absolute;
		right: 3px;
	}

@media (min-width: 530px) {

.ximcp__delete-image{
			right: 0
	}
    }

.ximcp__block-video{
		position: relative;
		margin-top: 1rem;
		width: 100%;
		height: 0;
		padding-bottom: 56.25%;
		background-color: rgb(34, 34, 34);
		border-radius: 5px;
	}

@media (min-width: 768px) {

.ximcp__block-video{
			overflow: hidden;
	}
    }

.ximcp__block-video input {
			display:inline-block;
			width: 100%;
			height: 34px;
			text-align: center;
			font-size: 1.2rem;
			padding: 4px;
			margin-right: 5px;

		}

@media (min-width: 768px) {

.ximcp__block-video input {
				display: flex;
				margin-right: 0;
				flex: 1

		}
    }

@media (min-width: 1100px) {

.ximcp__block-video input {
				display: flex;
				height: 42px;
				flex: 1

		}
    }

.ximcp__block-video iframe {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
		}

.ximcp__block-notes{
		font-size: 1rem;
		margin-top: 20px;
		margin-bottom: 20px;
	}

.ximcp__block-notes--textarea{
			width: 100%;
    		resize: vertical;
			border: none;
			outline: none;
		}

.ximcp__block-notes ul {
			padding-left: 40px;
		}

.ximcp__block-notes ol {
			padding-left: 40px;
		}

.ximcp__block-notes p {
			margin: 0;
		}

.ximcp__block-notes a {
			color: #b22222;
		}

@keyframes click {
	
    0% {transform: scale(100%);}
    65% {transform: scale(98%);}
    100% {transform: scale(100%);}
}

/* ===============================
=            Choices            =
=============================== */

.choices {
	position: relative;
	overflow: hidden;
	margin-bottom: 24px;
	width: 100%;
	font-size: 16px;
  }

.choices:focus {
	outline: none;
  }

.choices:last-child {
	margin-bottom: 0;
  }

.choices.is-open {
	overflow: visible;
  }

.choices.is-disabled .choices__inner,
  .choices.is-disabled .choices__input {
	background-color: #eaeaea;
	cursor: not-allowed;
	-webkit-user-select: none;
			-moz-user-select: none;
	     user-select: none;
  }

.choices.is-disabled .choices__item {
	cursor: not-allowed;
  }

.choices [hidden] {
	display: none !important;
  }

.choices[data-type*=select-one] {
	cursor: pointer;
  }

.choices[data-type*=select-one] .choices__inner {
	padding-bottom: 7.5px;
  }

.choices[data-type*=select-one] .choices__input {
	display: block;
	width: 100%;
	padding: 10px;
	border-bottom: 1px solid #ddd;
	background-color: #fff;
	margin: 0;
  }

.choices[data-type*=select-one] .choices__button {
	background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMSAyMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSIjMDAwIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik0yLjU5Mi4wNDRsMTguMzY0IDE4LjM2NC0yLjU0OCAyLjU0OEwuMDQ0IDIuNTkyeiIvPjxwYXRoIGQ9Ik0wIDE4LjM2NEwxOC4zNjQgMGwyLjU0OCAyLjU0OEwyLjU0OCAyMC45MTJ6Ii8+PC9nPjwvc3ZnPg==");
	padding: 0;
	background-size: 8px;
	position: absolute;
	top: 50%;
	right: 0;
	margin-top: -10px;
	margin-right: 25px;
	height: 20px;
	width: 20px;
	border-radius: 10em;
	opacity: 0.25;
  }

.choices[data-type*=select-one] .choices__button:hover, .choices[data-type*=select-one] .choices__button:focus {
	opacity: 1;
  }

.choices[data-type*=select-one] .choices__button:focus {
	box-shadow: 0 0 0 2px #00bcd4;
  }

.choices[data-type*=select-one] .choices__item[data-value=""] .choices__button {
	display: none;
  }

.choices[data-type*=select-one]::after {
	content: "";
	height: 0;
	width: 0;
	border-style: solid;
	border-color: #333 transparent transparent transparent;
	border-width: 5px;
	position: absolute;
	right: 11.5px;
	top: 50%;
	margin-top: -2.5px;
	pointer-events: none;
  }

.choices[data-type*=select-one].is-open::after {
	border-color: transparent transparent #333 transparent;
	margin-top: -7.5px;
  }

.choices[data-type*=select-one][dir=rtl]::after {
	left: 11.5px;
	right: auto;
  }

.choices[data-type*=select-one][dir=rtl] .choices__button {
	right: auto;
	left: 0;
	margin-left: 25px;
	margin-right: 0;
  }

.choices[data-type*=select-multiple] .choices__inner,
  .choices[data-type*=text] .choices__inner {
	cursor: text;
  }

.choices[data-type*=select-multiple] .choices__button,
  .choices[data-type*=text] .choices__button {
	position: relative;
	display: inline-block;
	margin-top: 0;
	margin-right: -4px;
	margin-bottom: 0;
	margin-left: 8px;
	padding-left: 16px;
	border-left: 1px solid rgb(189, 189, 189);
	background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMSAyMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSIjRkZGIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik0yLjU5Mi4wNDRsMTguMzY0IDE4LjM2NC0yLjU0OCAyLjU0OEwuMDQ0IDIuNTkyeiIvPjxwYXRoIGQ9Ik0wIDE4LjM2NEwxOC4zNjQgMGwyLjU0OCAyLjU0OEwyLjU0OCAyMC45MTJ6Ii8+PC9nPjwvc3ZnPg==");
	background-size: 8px;
	width: 8px;
	line-height: 1;
	opacity: 0.75;
	border-radius: 0;
  }

.choices[data-type*=select-multiple] .choices__button:hover, .choices[data-type*=select-multiple] .choices__button:focus,
  .choices[data-type*=text] .choices__button:hover,
  .choices[data-type*=text] .choices__button:focus {
	opacity: 1;
  }

.choices__inner {
	display: inline-block;
	vertical-align: top;
	width: 100%;
	background-color: #f9f9f9;
	padding: 0px 0px 3px 0px;
	border: 1px solid #ddd;
	border-radius: 5px;
	font-size: 1rem;
	min-height: 40px;
	overflow: hidden;
	text-align: center;
  }

.is-focused .choices__inner, .is-open .choices__inner {
	border-color: #b7b7b7;
  }

.is-open .choices__inner {
	border-radius: 2.5px 2.5px 0 0;
  }

.is-flipped.is-open .choices__inner {
	border-radius: 0 0 2.5px 2.5px;
  }

.choices__list {
	margin: 0;
	padding-left: 0;
	list-style: none;
	text-align: center;
  }

.choices__list--single {
	display: inline-block;
	padding: 4px 16px 4px 4px;
	width: 100%;
  }

[dir=rtl] .choices__list--single {
	padding-right: 4px;
	padding-left: 16px;
  }

.choices__list--single .choices__item {
	width: 100%;
  }

.choices__list--multiple {
	display: inline;
  }

.choices__list--multiple .choices__item {
	display: inline-block;
	vertical-align: middle;
	border-radius: 4px;
	padding: 3px 10px;
	font-size: 1rem;
	font-weight: 500;
	margin: 3px 3px 0 0;
	background-color: #b22222;
	border: 1px solid #d64242;
	color: rgb(238, 238, 238);
	word-break: break-all;
	box-sizing: border-box;
  }

.choices__list--multiple .choices__item[data-deletable] {
	padding-right: 5px;
  }

[dir=rtl] .choices__list--multiple .choices__item {
	margin-right: 0;
	margin-left: 3.75px;
  }

.choices__list--multiple .choices__item.is-highlighted {
	background-color: red;
	border: 1px solid #b22222;
  }

.is-disabled .choices__list--multiple .choices__item {
	background-color: #aaaaaa;
	border: 1px solid #919191;
  }

.choices__list--dropdown, .choices__list[aria-expanded] {
	visibility: hidden;
	z-index: 1;
	position: absolute;
	width: 100%;
	background-color: #fff;
	border: 1px solid #ddd;
	top: 100%;
	margin-top: -1px;
	border-bottom-left-radius: 2.5px;
	border-bottom-right-radius: 2.5px;
	overflow: hidden;
	word-break: break-all;
	will-change: visibility;
  }

.is-active.choices__list--dropdown, .is-active.choices__list[aria-expanded] {
	visibility: visible;
  }

.is-open .choices__list--dropdown, .is-open .choices__list[aria-expanded] {
	border-color: #b7b7b7;
  }

.is-flipped .choices__list--dropdown, .is-flipped .choices__list[aria-expanded] {
	top: auto;
	bottom: 100%;
	margin-top: 0;
	margin-bottom: -1px;
	border-radius: 0.25rem 0.25rem 0 0;
  }

.choices__list--dropdown .choices__list, .choices__list[aria-expanded] .choices__list {
	position: relative;
	max-height: 300px;
	overflow: auto;
	-webkit-overflow-scrolling: touch;
	will-change: scroll-position;
  }

.choices__list--dropdown .choices__item, .choices__list[aria-expanded] .choices__item {
	position: relative;
	padding: 10px;
	font-size: 14px;
  }

[dir=rtl] .choices__list--dropdown .choices__item, [dir=rtl] .choices__list[aria-expanded] .choices__item {
	text-align: right;
  }

@media (min-width: 640px) {
	.choices__list--dropdown .choices__item--selectable, .choices__list[aria-expanded] .choices__item--selectable {
	  padding-right: 10px;
	}
	.choices__list--dropdown .choices__item--selectable::after, .choices__list[aria-expanded] .choices__item--selectable::after {
	  content: attr(data-select-text);
	  font-size: 12px;
	  opacity: 0;
	  position: absolute;
	  right: 10px;
	  top: 50%;
	  transform: translateY(-50%);
	}
	[dir=rtl] .choices__list--dropdown .choices__item--selectable, [dir=rtl] .choices__list[aria-expanded] .choices__item--selectable {
	  text-align: right;
	  padding-left: 100px;
	  padding-right: 10px;
	}
	[dir=rtl] .choices__list--dropdown .choices__item--selectable::after, [dir=rtl] .choices__list[aria-expanded] .choices__item--selectable::after {
	  right: auto;
	  left: 10px;
	}
  }

.choices__list--dropdown .choices__item--selectable.is-highlighted, .choices__list[aria-expanded] .choices__item--selectable.is-highlighted {
	background-color: rgb(238, 238, 238);
  }

.choices__list--dropdown .choices__item--selectable.is-highlighted::after, .choices__list[aria-expanded] .choices__item--selectable.is-highlighted::after {
	opacity: 0.5;
  }

.choices__item {
	cursor: default;
	color: rgb(34, 34, 34);
  }

.choices__item--selectable {
	cursor: pointer;
  }

.choices__item--disabled {
	cursor: not-allowed;
	-webkit-user-select: none;
			-moz-user-select: none;
	     user-select: none;
	opacity: 0.5;
  }

.choices__heading {
	font-weight: 600;
	font-size: 12px;
	padding: 10px;
	border-bottom: 1px solid #f7f7f7;
	color: gray;
  }

.choices__button {
	text-indent: -9999px;
	-webkit-appearance: none;
			-moz-appearance: none;
	     appearance: none;
	border: 0;
	background-color: transparent;
	background-repeat: no-repeat;
	background-position: center;
	cursor: pointer;
  }

.choices__button:focus {
	outline: none;
  }

.choices__input {
	display: inline-block;
	vertical-align: baseline;
	background-color: #f9f9f9;
	font-size: 1rem;
	margin-bottom: 0px;
	border: 0;
	border-radius: 0;
	max-width: 100%;
	padding: 4px 0 4px 2px;
  }

.choices__input:focus {
	outline: 0;
  }

.choices__input::-webkit-search-decoration, .choices__input::-webkit-search-cancel-button, .choices__input::-webkit-search-results-button, .choices__input::-webkit-search-results-decoration {
	display: none;
  }

.choices__input::-ms-clear, .choices__input::-ms-reveal {
	display: none;
	width: 0;
	height: 0;
  }

[dir=rtl] .choices__input {
	padding-right: 2px;
	padding-left: 0;
  }

.choices__placeholder {
	opacity: 0.5;
  }

/* =====  End of Choices  ====== */

.content__version {
		position: absolute;
		top: .75rem;
		left: 0;
		font-size: .65rem;
		margin-left: 5px;
		color: rgb(100, 100, 100);
	}

.content__version--content {
			top: 1.5rem;
		}

.content__firmware {
		position: relative;
		background-color: #0F9ED5;
		box-shadow: 0 5px 10px rgba( 0, 0, 0, .4 );
		text-align: center;
		padding: 15px 0;
		z-index: 1;
	}

.content__firmware h3 {
			margin: 0;
		}

.content__firmware a {
			font-size: 22px;
			font-weight: 500;
			color: rgb(238, 238, 238);
		}

.content__firmware span {
			color: rgb(34, 34, 34);
		}

.content__toc {
		position: relative;
		background-color: #b22222;
		box-shadow: 0 5px 10px rgba( 0, 0, 0, .4 );
		text-align: center;
		padding: 15px 0;
		z-index: 1;
	}

.content__toc a {
			margin: 0px;
			padding: 0px;
			font-size: 22px;
			font-weight: 500;
			color: rgb(238, 238, 238);
		}

.content__toc h3 {
			margin: 6px;
		}

.content__section {
		margin-top: 25px;
		position: relative;
		min-height: 50px;

	}

.content__section::before {
			/* for bookmark jumping, account for header height*/
			content:"";
			display:block;
			height:63px;
			margin:-63px 0 0;
		  }

.content__section hr {
			border-bottom: 1px solid #b22222;
			margin: 0 0 1px 0;
		}

.content__section-title {
		width: 100%;
		text-align: center;
		font-size: 30px;
		font-weight: 700;
		color: rgb(34, 34, 34);
		margin: 0 0 20px 0;
	}

.content__section-title:focus::-moz-placeholder {
			color: transparent;
		}

.content__section-title:focus::placeholder {
			color: transparent;
		}

.content__notes {
		position: relative;
		margin: 30px 5px;
	}

.content__notes li {
			margin-left: 40px;
		}

.content__code {
		position: relative;
		margin: 35px 5px;
	}

.content__code li {
			margin-left: 40px;
		}

.content__video {
		position: relative;
		margin: 30px 5px;
	}

.content__video-container {
		position: relative;
		display: flex;
		height: 0;
		padding-bottom: 56.25%;
		background-color: rgb(34, 34, 34);
		border-radius: 5px;
	}

.content__video-container iframe {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			border-radius: 5px;
		}

.content__image {
		position: relative;
		margin: 30px 5px;
	}

.content__image--100 {
			width: 100%;
		}

.content__image--85 {
			width: 90%;
		}

@media (min-width: 768px) {

.content__image--85 {
				width: 85%
		}
    }

.content__image--70 {
			width: 80%;
		}

@media (min-width: 768px) {

.content__image--70 {
				width: 70%
		}
    }

.content__image--55 {
			width: 70%;
		}

@media (min-width: 768px) {

.content__image--55 {
				width: 55%
		}
    }

.content__image--40 {
			width: 60%;
		}

@media (min-width: 768px) {

.content__image--40 {
				width: 40%
		}
    }

.content__image--25 {
			width: 50%;
		}

@media (min-width: 768px) {

.content__image--25 {
				width: 25%
		}
    }

.content__image-container {
		display: flex;
		justify-content: center;
		align-items: center;
	}

.content__image-container img {
			top: 0;
			left: 0;
			height: auto;
			filter: drop-shadow( 5px 5px 5px rgba( 0, 0, 0, .5 ) );
		}

.content__image-container--cover img {
			-o-object-fit: cover;
			   object-fit: cover;

		}

.content__image-container--contain img {
			-o-object-fit: contain;
			   object-fit: contain;
		}

.content__element--edit {
			//outline: rgb(210, 210, 210) dashed 1px;
			//outline-offset: -1px;
			padding: 50px 5px 5px 5px;
		}

@media (min-width: 530px) {

.content__element--edit {
				//outline-offset: 5px;
		}
    }

.content__element--edit--section {
				outline: #b22222 dashed 1px;
			}

.content__element--edit--section hr {
					position: relative;
					top: 20px;
					border-bottom: 3px solid #b22222;
					margin: 0 0 1px 0;
				}

.content__code-title {
		width: 100%;
		text-align: center;
		font-size: 21px;
		font-weight: 700;
		color: rgb(34, 34, 34);
		margin: 0 0 7px 0;
	}

.content__code-title:focus::-moz-placeholder {
			color: transparent;
		}

.content__code-title:focus::placeholder {
			color: transparent;
		}

.content__code-button{
		text-align: center;
		font-size: 20px;
		color: rgb(238, 238, 238);
	}

.content__code-button span{
			display: inline-block;
			width: 180px;
			padding: 10px;
			background-color: #b22222;
			border-radius: 10px;
			box-shadow: 3px 3px 5px rgba( 0, 0, 0, .3 );
			cursor: pointer;
		}

.content__code-button span i {
				margin-right: 5px;
			}

.content__code-button span:hover{
				background-color: #df2d2d;
			}

.content__code-button--click{
			animation-name: click;
			animation-duration: .1s;
			animation-timing-function: linear;
			animation-iteration-count: 1;
		}

@keyframes click {
	
    0% {transform: scale(100%);}
    65% {transform: scale(98%);}
    100% {transform: scale(100%);}
}

.editor__progress-div {
		max-width: 460px;
		margin-left: auto;
		margin-right: auto;
	}

.editor__progress-bar {
		width: 0%;
		background-color: #b22222;
		height: 2px;
	}

.editor__status{
		position: relative;
		text-align: center;
		color: rgb(238, 238, 238);
		padding-top: 8px;
		padding-bottom: 5px;
		font-size: 1.25rem;
	}

.editor__toolbar {
		position: absolute;
		top: 0px;
		right: 0px;
		background-color: rgb(210, 210, 210);
		padding-right: 5px;
		//border-radius: 0 0 0 10px;
		border-radius: 10px;
		z-index: 1;
	}

@media (min-width: 530px) {

.editor__toolbar {
			top: 3px;
			right: 3px;
	}
    }

.editor__toolbar--section {
			background-color: rgb(50, 50, 50);
		}

.editor__toolbar input {
			display: inline-flex;
			height: 35px;
			width: 180px;
			border-radius: 5px;
			margin-left: 5px;
			border: 1px solid rgb(189, 189, 189);
			padding: 5px;
			-webkit-appearance: none;
			   -moz-appearance: none;
			        appearance: none;
		}

.editor__toolbar input:focus::-moz-placeholder {
				color: transparent;
			}

.editor__toolbar input:focus::placeholder {
				color: transparent;
			}

@media (min-width: 530px) {

.editor__toolbar input {
				width: 360px;
  }
    }

@media (min-width: 768px) {

.editor__toolbar input {
				width: 400px;
  }
    }

.editor__toolbar input:focus {
				outline: 2px solid #b22222;
				outline-offset: -3px;
			}

.editor__code{
		width: 100%;
		color: rgb(34, 34, 34);
		font-family:'Courier New', Courier, monospace;
		text-align: center;
		resize: none;
		max-height: 87px;
		padding: 0.65rem;
	}

.editor__code::-moz-placeholder {
			text-align: center;
		}

.editor__code::placeholder {
			text-align: center;
		}

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

.editor__code:focus::placeholder {
			color: transparent;
		}

.editor__video-input {
		display:inline-block;
		width: 100%;
		height: 34px;
		text-align: center;
		font-size: 1.2rem;
		padding: 4px;
		margin-right: 5px;
	}

@media (min-width: 768px) {

.editor__video-input {
			display: flex;
			margin-right: 0;
			flex: 1
	}
    }

@media (min-width: 1100px) {

.editor__video-input {
			display: flex;
			height: 42px;
			flex: 1
	}
    }

.editor__content-disable {
		position: fixed;
		top: 0;
		background-color: rgba( 0, 0, 0, 0);
		width: 100%;
		height: 100%;
		z-index: 1;
	}

.editor__insert-section {
		padding-top: 20px;
	}

.container__grid-3-col{
		display: grid;
		grid-template-columns: 1fr 600px 1fr;
		-moz-column-gap: 15px;
		     column-gap: 15px;
	}

.container__fullscreen-modal{
		background-color: rgb(34, 34, 34);
		position: fixed;
		z-index: 1;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		width: 100%;
		height: 100%;
	}

.container__padding-10 {
		box-sizing: border-box;
		padding: 10px;
	}

.container__reference{
		position: relative;
		margin-left: auto;
		margin-right: auto;
		width: 320px;
	}

@media (min-width: 530px) {

.container__reference{
			width: 450px
	}
    }

@media (min-width: 530px) {

.container__reference{
			width: 525px
	}
    }

.container__center{
		text-align: center;
	}

.container__no-padding {
		width: 100%;
	}

@keyframes rotating {
    0% {transform: rotate(0deg);}
    100% {transform: rotate(180deg);}
}

.feedback__waiting{
        font-size: 50px;
        transform-origin: 75% 75%;
        color: rgb(238, 238, 238);
        animation-name: rotating;
        animation-duration: .5s;
        animation-timing-function: ease;
        animation-iteration-count: infinite;
	}

.warning__title{
		margin-top: 50px;
		font-size: 30px;
		text-align: center;
	}

@media (min-width: 530px) {

.warning__title{
			font-size: 50px
	}
    }

.warning__message{
		margin-top: 50px;
		font-size: 20px;
		text-align: center;
	}

@media (min-width: 530px) {

.warning__message{
			font-size: 30px
	}
    }

.modal__fullscreen-bg {
		position: fixed;
		top: 0;
		background-color: rgba( 255, 255, 255, .45);
		width: 100%;
		height: 100%;
		z-index: 1;
	}

.modal__frame {
		margin-top: 50vh;
		width: 355px;
		margin-left: auto;
		margin-right: auto;
		padding: 20px 20px;
		color: rgb(34, 34, 34);
		text-align: center;
		font-size: 1.25rem;
		background-color: rgb(238, 238, 238);
		border: 1px solid rgb(189, 189, 189);
		border-radius: 8px;
		transform: translateY( -50% );
	}

@media (min-width: 530px) {

.modal__frame {
			width: 500px;
			padding: 20px 0;
	}
    }

.modal__frame__box{

			background-color: rgb(238, 238, 238);
		}

.modal__frame div {
			margin-bottom: 20px;

		}

.modal__delete{
		margin-top: 50vh;
		width: 355px;
		margin-left: auto;
		margin-right: auto;
		padding: 20px 20px;
		color: rgb(34, 34, 34);
		text-align: center;
		font-size: 1.25rem;
		background-color: rgb(238, 238, 238);
		border: 1px solid rgb(189, 189, 189);
		border-radius: 8px;
	}

@media (min-width: 530px) {

.modal__delete{
			width: 500px;
			padding: 20px 0;
	}
    }

.modal__delete__box{

			background-color: rgb(238, 238, 238);
		}

.modal__delete div {
			margin-bottom: 20px;

		}

.modal__notice{
		margin-top: 50vh;
		width: 355px;
		margin-left: auto;
		margin-right: auto;
		padding: 20px 20px;
		color: rgb(34, 34, 34);
		text-align: center;
		font-size: 1.25rem;
		background-color: rgb(238, 238, 238);
		border: 1px solid rgb(189, 189, 189);
		border-radius: 8px;
	}

@media (min-width: 530px) {

.modal__notice{
			width: 500px;
			padding: 20px 0;
	}
    }

.modal__notice__box{

			background-color: rgb(238, 238, 238);
		}

.modal__notice div {
			margin-bottom: 20px;

		}

.options__wrapper {
		position: relative;
		width: 360px;
		margin-left: auto;
		margin-right: auto;
	}

@media (min-width: 530px) {

.options__wrapper {
			width: 384px
	}
    }

.options__games{
		margin: 9px 7px 0px 7px;
		position: relative;
	}

.options__games-close {
		position: absolute;
		top: -3px;
		right: 5px;
	}

@media (min-width: 530px) {

.options__games-close {
			top: -3px;
			right: 20px
	}
    }

.options__platforms{
		margin-top: 14px;
		margin-bottom: -7px;
		text-align: center;
	}

.options__contents {
		margin-top: 14px;
		margin-bottom: 8px;
		text-align: center;
	}

.options__mappings {
		padding: 4px 0 0 16px;
		margin: 6px 5px 5px 5px;
		background-color: rgb(238, 238, 238);
		border-radius: 12px;
	}

@media (min-width: 530px) {

.options__mappings {
			padding: 4px 0 0 16px;
			margin: 6px 0 5px 0;
			background-color: rgb(238, 238, 238);
			border-radius: 12px
	}
    }

.options__mapping-block {
		position: relative;
		display: inline-block;
		text-align: center;
		padding: 4px 0 2px 0;
	}

.options__mapping-block--input {
			width: 130px;
			margin-right: 9px;
		}

@media (min-width: 530px) {

.options__mapping-block--input {
				width: 152px;
				margin-right: 7px
		}
    }

.options__mapping-block--arrow {
			width: 33px;
		}

@media (min-width: 530px) {

.options__mapping-block--arrow {
				width: 33px;
		}
    }

.options__mapping-block--arrow img {
				margin: 0 0 53px 0;
			}

@media (min-width: 530px) {

.options__mapping-block--arrow img {
					margin: 0 0 60px 0
			}
    }

.options__mapping-block--output {
			width: 130px;
			margin-left: 13px;
		}

@media (min-width: 530px) {

.options__mapping-block--output {
				width: 146px;
				margin-left: 10px
		}
    }

.options__mapping-block span {
			color: rgb(34, 34, 34);
			font-size: .6875rem;
		}

.options__mapping-block div {
			margin-top: -8px;
		}

.icon__platform {
		height: 55px;
		margin: 0 12px 0 0;
	}

@media (min-width: 530px) {

.icon__platform {
			height: 60px;
			margin: 0 17px 0 0;
	}
    }

.icon__platform--last {
			margin-right: 0;
		}

.icon__content {
		height: 39px;
		border-radius: 7px;
		margin: 0 8px 0 0;
	}

@media (min-width: 530px) {

.icon__content {
			height: 44px;
			border-radius: 7px;
			margin: 0 8px 0 0;
	}
    }

.icon__content--last {
			margin-right: 0;
		}

.icon__mapping {
		padding: 0 10px 0 0;
		height:  50px;
		margin: 2px 0 0 0;
	}

@media (min-width: 530px) {

.icon__mapping {
			padding: 0 15px 0 0;
			height:  58px;
			margin: 3px 0 0 0;
	}
    }

.icon__mapping--no-padding {
			padding: 0;
		}

.icon__arrow {
		height: 26px;
	}

.icon__arrow--tile {
			height: 20px;
			margin: 5px 5px;
		}

.icon__arrow--post {
			height: 20px;
			margin: 6px 5px;
		}

@media (min-width: 530px) {

.icon__arrow--post {
				height: 32px
		}
    }

@media (min-width: 768px) {

.icon__arrow--post {
				height: 32px;
				margin: 10px 5px
		}
    }

.icon--selectable {
		cursor: pointer;
	}

.icon--selectable:hover {
			filter: brightness(130%);
		}

.icon--selected {

		filter: drop-shadow( 4px 0 0 #b22222 )
		drop-shadow( 0 4px 0 #b22222 )
		drop-shadow( -4px -0 0 #b22222 )
		drop-shadow( 0 -4px 0 #b22222 );
	}

.icon--selected:hover {
			filter: brightness(130%) 
			drop-shadow( 4px 0 0 #df2d2d )
			drop-shadow( 0 4px 0 #df2d2d )
			drop-shadow( -4px -0 0 #df2d2d )
			drop-shadow( 0 -4px 0 #df2d2d );
		}

.sort__container {
		margin-top: -15px;
		margin-bottom: 20px;
		height: 35px;
		display: inline;
		margin-left: 20px;
		/* border-bottom: 1px solid black; */
	}

@media (min-width: 530px) {

.sort__container {
			display: flex
	}
    }

.sort__block {
		display: flex;
		font-size: 1.05rem;
		font-weight: 500;
		padding-right: 0px;
		justify-content: center;
		margin-bottom: 30px;


	}

@media (min-width: 530px) {

.sort__block {
			margin-bottom: 0px;
			padding-right: 20px;


	}
    }

.sort__block--left {
			flex: none;
		}

@media (min-width: 530px) {

.sort__block--left {
				display: inline-block;
				text-align: left
		}
    }

.sort__block--right {
   flex: 1;
		}

@media (min-width: 530px) {

.sort__block--right {
				display: inline-block;
				text-align: right
		}
    }

.sort__icon {
		height: 27px;
		width: 27px;
		font-size: 27px;
		margin-left: 20px;
		border-radius: 1px;
		padding-right: 1px;
		outline: 3px solid transparent;
		outline-offset: 3px;
		cursor: pointer;
	}

.sort__icon:hover {
			color: #b22222;
		}

.sort__icon--selected {
			outline: 3px solid #b22222;
		}

.sort__text-button {
		font-size: 17px;
		height: 27px;
		font-weight: 800;
		margin-left: 20px;
		border-radius: 1px;
		padding: 3px 10px 3px 10px;
		outline: 3px solid rgb(189, 189, 189);
		outline-offset: 3px;
		cursor: pointer;
	}

@media (min-width: 530px) {

.sort__text-button {
			float: left;
	}
    }

.sort__text-button:hover {
			color: #b22222;
		}

.sort__text-button--first {
			margin-left: 0px;
		}

.sort__text-button--selected {
			outline: 3px solid #b22222;
		}

.login__message{
		
		font-size: 20px;
		text-align: center;
		color: #b22222;

	}

.login__message p {
			margin-top: 100px;
			color: #b22222;

		}

.login__message p span {
				color: rgb(34, 34, 34);
			}

@media (min-width: 530px) {

.login__message {
			margin-top: 50px;
			font-size: 25px;
  }
    }