/* 
    PEOPLUS Squared(TM) Design System
    designed by David Oh.

    The whole new design system is designed for all of PEOPLUS Studio's production design.
    And this design is not sticky, and not mirrored.
    Only show to clearly objects about positioned which areas.

    PEOPLUS Squared Design System/and logo are trademarks of PEOPLUS Studio.

    Last Updated : 22/11/15

    (C) PEOPLUS Studio, All rights reserved.
    http://peoplus.studio/
*/

/*
    You can find out about point what you want.

	@find-point: colors
	@find-point: tooltip-box
	@find-point: switch
    @find-point: icon
    @find-point: indicator
    @find-point: effects
	@find-point: animations
    @find-point: smoke_effect
    @find-point: fadein_effect
*/

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

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


    @font-face {
        font-family: 'PEOPLUS Barunche';
        font-style: normal;
        font-weight: normal;
        src: url('fonts/barunche-regular.eot');
        src: url('fonts/barunche-regular.ttf');
    }

    @font-face {
        font-family: 'Font Awesome';
        font-style: normal;
        font-weight: normal;
        src: url('fonts/fa-regular.eot');
        src: url('fonts/fa-regular.ttf');
    }


	@font-face {
		font-family: 'Nucleo Outline';
		/* src: url('fonts/nucleo-outline.eot'); */
		src: url('fonts/nucleo-outline.eot') format("embedded-opentype");
		src: url('fonts/nucleo-outline.woff2') format("woff2");
		src: url('fonts/nucleo-outline.woff') format("woff");
		src: url('fonts/nucleo-outline.ttf') format("truetype");
		font-weight: normal;
		font-style: normal;
	}

    body {
        margin: 0;
        font-family: 'PEOPLUS Barunche' !important;
    }

    body [class^="icon-"], body [class*=" icon-"] {
        font-size: 14px;
        line-height: 20px;
        height: 20px;
    }


    main {
        display: block;
    }


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


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

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

    a {
        background-color: transparent;
    }


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

    b,
    strong {
        font-weight: bolder;
    }

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

    small {
        font-size: 80%;
    }

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

    sub {
        bottom: -0.25em;
    }

    sup {
        top: -0.5em;
    }

    img {
        border-style: none;
        text-decoration: none;
    }

    select[multiple],
    select[size] {
        height: auto;
    }

    input::placeholder {
        color: rgba(26, 30, 39, 0.75);
        font-weight: normal;
    }

    input::placeholder:focus {
        color: #FFFFFF;
        font-weight: normal;
    }

    textarea::placeholder {
        color: rgba(26, 30, 39, 0.75);
        font-weight: normal;
    }

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

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

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


    button:not(.ppsquared-button-login),
    input[type="button"]:not(.ppsquared-button-login),
    input[type="reset"]:not(.ppsquared-button-login),
    input[type="submit"]:not(.ppsquared-button-login) {
        margin: 0;
        padding: 5px 20px;
        border: 1px solid #588FF9;
        min-width: 42px;
        min-height: 32px;
        color: #588FF9;
        cursor: pointer;
        border-radius: 5px;
        box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        background: #FFFFFF;
        -webkit-appearance: button;
    }

    button:not(.ppsquared-button-login):hover,
    input[type="button"]:not(.ppsquared-button-login):hover,
    input[type="reset"]:not(.ppsquared-button-login):hover,
    input[type="submit"]:not(.ppsquared-button-login):hover {
        color: #FFFFFF;
        background: #588FF9;
        box-sizing: border-box;
    }

    button:not(.ppsquared-button-login)::-moz-focus-inner,
    input[type="button"]:not(.ppsquared-button-login)::-moz-focus-inner,
    input[type="reset"]:not(.ppsquared-button-login)::-moz-focus-inner,
    input[type="submit"]:not(.ppsquared-button-login)::-moz-focus-inner {
        border-style: none;
        padding: 0;
    }

    button:not(.ppsquared-button-login):-moz-focusring,
    input[type="button"]:not(.ppsquared-button-login):-moz-focusring,
    input[type="reset"]:not(.ppsquared-button-login):-moz-focusring,
    input[type="submit"]:not(.ppsquared-button-login):-moz-focusring {
        outline: 1px dotted ButtonText;
    }

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

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

    progress {
        vertical-align: baseline;
    }

    textarea {
        overflow: auto;
    }

    input[type="checkbox"] {
        display: none;
    }

    input[type="checkbox"] + label:not(.ppsquared-switch) {
        color: #1A1E27;
        cursor: pointer;
    }

    input[type="checkbox"] + label:not(.ppsquared-switch) span {
        display: inline-block;
        width: 17.5px;
        height: 17.5px;
        margin: -2px 5px 0 0;
        vertical-align: middle;
        border: 1px solid #2952A1;
		border-radius: 2.5px;
        background: #FFFFFF;
        box-sizing: border-box;
        cursor: pointer;
    }

    input[type="checkbox"]:checked + label:not(.ppsquared-switch) span {
        background: linear-gradient(120deg, #588FF9, #2952A1);
    }

    input[type="radio"] {
        display: none;
    }

    input[type="radio"] + label {
        color: #1A1E27;
        cursor: pointer;
    }

    input[type="radio"] + label span {
        display: inline-block;
        width: 17.5px;
        height: 17.5px;
        margin: -2px 5px 0 0;
        vertical-align: middle;
        border: 1px solid #2952A1;
        background: #FFFFFF;
        border-radius: 100%;
        box-sizing: border-box;
        cursor: pointer;
    }

    input[type="radio"]:checked + label span {
        background: linear-gradient(120deg, #588FF9, #2952A1);
    }

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

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

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


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

    details {
        display: block;
    }

    summary {
        display: list-item;
    }

    template {
        display: none;
    }

    [hidden] {
        display: none;
    }


    select, textarea,
	.uneditable-input,
    input[type="text"],
    input[type="password"],
    input[type="datetime"],
    input[type="datetime-local"],
    input[type="date"],
    input[type="month"],
    input[type="time"],
    input[type="week"],
    input[type="number"],
    input[type="email"],
    input[type="url"],
    input[type="search"],
    input[type="tel"],
    input[type="color"] {
        display: inline-block;
        padding: 4px 6px;
        margin-bottom: 10px;
        font-size: 14px;
        line-height: 20px;
        color: #555555;
        vertical-align: middle;
        outline: 0 !important;
    }

    select,
    textarea,
	.uneditable-input,
    input[type="text"],
    input[type="password"],
    input[type="datetime"],
    input[type="datetime-local"],
    input[type="date"],
    input[type="month"],
    input[type="time"],
    input[type="week"],
    input[type="number"],
    input[type="email"],
    input[type="url"],
    input[type="search"],
    input[type="tel"],
    input[type="color"] {
        margin: 0;
        padding: 5px;

        font-family:'PEOPLUS Barunche' !important;
        font-size: 11pt;
        font-weight: normal;
        color: inherit;
        
        border: 0;
        border-bottom: 3px solid rgba(88, 143, 249, 0.25);
        box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        background: inherit;
        display: inline-block;
        resize: none;
    }

    select:hover,
    textarea:hover,
	.uneditable-input:hover,
    input[type="text"]:hover,
    input[type="password"]:hover,
    input[type="datetime"]:hover,
    input[type="datetime-local"]:hover,
    input[type="date"]:hover,
    input[type="month"]:hover,
    input[type="time"]:hover,
    input[type="week"]:hover,
    input[type="number"]:hover,
    input[type="email"]:hover,
    input[type="url"]:hover,
    input[type="search"]:hover,
    input[type="tel"]:hover,
    input[type="color"]:hover {
        border-bottom: 3px solid rgba(88, 143, 249, 0.5);

        transition: 0.25s;
        -webkit-transition: 0.25s;
    }

    select:focus,
    textarea:focus,
	.uneditable-input:focus,
    input[type="text"]:focus,
    input[type="password"]:focus,
    input[type="datetime"]:focus,
    input[type="datetime-local"]:focus,
    input[type="date"]:focus,
    input[type="month"]:focus,
    input[type="time"]:focus,
    input[type="week"]:focus,
    input[type="number"]:focus,
    input[type="email"]:focus,
    input[type="url"]:focus,
    input[type="search"]:focus,
    input[type="tel"]:focus,
    input[type="color"]:focus {
        color: inherit;

        border-bottom: 3px solid rgba(88, 143, 249, 1.0);
        outline: none;

        background: inherit;

        transition: 0.25s;
        -webkit-transition: 0.25s;
    }

    select > option.dark {
        background: #1A1E27;
    }

	/*
		PEOPLUS Squared
		Color Presets

		@find-point: colors
	*/

	/* Text Colors */
    .text-gray-100 {
        --text-opacity: 1;
        color: #f1f4f7;
        color: rgba(241, 244, 247, var(--text-opacity));
    }

    .text-gray-200 {
        --text-opacity: 1;
        color: #edf2f7;
        color: rgba(237, 242, 247, var(--text-opacity));
    }

    .text-gray-300 {
        --text-opacity: 1;
        color: #E2E8F0;
        color: rgba(226, 232, 240, var(--text-opacity));
    }

    .text-gray-400 {
        --text-opacity: 1;
        color: #cbd5e0;
        color: rgba(203, 213, 224, var(--text-opacity));
    }

    .text-gray-500 {
        --text-opacity: 1;
        color: #a0aec0;
        color: rgba(160, 174, 192, var(--text-opacity));
    }

    .text-gray-600 {
        --text-opacity: 1;
        color: #718096;
        color: rgba(113, 128, 150, var(--text-opacity));
    }

    .text-gray-700 {
        --text-opacity: 1;
        color: #4a5568;
        color: rgba(74, 85, 104, var(--text-opacity));
    }

    .text-gray-900 {
        --text-opacity: 1;
        color: #1A1E27;
        color: rgba(26, 32, 44, var(--text-opacity));
    }

    .text-peoplus-squared {
        background: linear-gradient(90deg, #588FF9, #2952A1);
		background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }

    .text-peoplus-squared\:dark {
        background: linear-gradient(90deg, #2952A1, #1A1E27);
		background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }

    .text-peoplus-squared-blue {
        --text-opacity: 1;
        color: #588FF9;
        color: rgba(88, 143, 249, var(--text-opacity));
    }

    .text-peoplus-squared-navy {
        --text-opacity: 1;
        color: #2952A1;
        color: rgba(41, 82, 161, var(--text-opacity));
    }

    .text-peoplus-squared-black {
        --text-opacity: 1;
        color: #1A1E27;
        color: rgba(26, 30, 39, var(--text-opacity));
    }

    .text-peoplus-squared-red {
        --text-opacity: 1;
        color: #D03A3A;
        color: rgba(208, 58, 58, var(--text-opacity));
    }

    .text-peoplus-squared-green {
        --text-opacity: 1;
        color: #7CC623;
        color: rgba(124, 198, 35, var(--text-opacity));
    }

    .text-peoplus-squared-yellow {
        --text-opacity: 1;
        color: #E4CC00;
        color: rgba(228, 204, 0, var(--text-opacity));
    }

    .text-peoplus-squared-cube {
        background: linear-gradient(90deg, #D03A3A, #6C1919);
		background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }

    .text-peoplus-squared-cube-red {
        --text-opacity: 1;
        color: #D03A3A;
        color: rgba(208, 58, 58, var(--text-opacity));
    }

    .text-peoplus-squared-cube-dark-red {
        --text-opacity: 1;
        color: #6C1919;
        color: rgba(108, 25, 25, var(--text-opacity));
    }

    .text-peoplus-squared-system {
        background: linear-gradient(90deg, #00AFBA, #A9CD00);
		background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }

    .text-peoplus-squared-system-emerald {
        --text-opacity: 1;
        color: #00AFBA;
        color: rgba(0, 175, 186, var(--text-opacity));
    }

    .text-peoplus-squared-system-green {
        --text-opacity: 1;
        color: #A9CD00;
        color: rgba(169, 205, 0, var(--text-opacity));
    }

    .text-peoplus-squared-square {
        background: linear-gradient(90deg, #F444FF, #5400FF);
		background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }

    .text-peoplus-squared-square-pink {
        --text-opacity: 1;
        color: #F444FF;
        color: rgba(244, 68, 255, var(--text-opacity));
    }

    .text-peoplus-squared-square-purple {
        --text-opacity: 1;
        color: #5400FF;
        color: rgba(84, 0, 255, var(--text-opacity));
    }

    .text-peoplus-squared-village {
        background: linear-gradient(90deg, #E4CC00, #8D7E00);
		background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }

    .text-peoplus-squared-village-yellow {
        --text-opacity: 1;
        color: #E4CC00;
        color: rgba(228, 204, 0, var(--text-opacity));
    }

    .text-peoplus-squared-village-dark-yellow {
        --text-opacity: 1;
        color: #8D7E00;
        color: rgba(141, 126, 0, var(--text-opacity));
    }

    .text-peoplus-squared-suite {
        background: linear-gradient(90deg, #FFFF00, #EEAE00);
		background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }

    .text-peoplus-squared-suite-yellow {
        --text-opacity: 1;
        color: #FFFF00;
        color: rgba(255, 255, 0, var(--text-opacity));
    }

    .text-peoplus-squared-suite-orange {
        --text-opacity: 1;
        color: #EEAE00;
        color: rgba(238, 174, 0, var(--text-opacity));
    }

    .text-peoplus-squared-universe {
        background: linear-gradient(to right, #588FF9, #2952A1, #D03A3A, #7CC623, #E4CC00);
		background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }

    .text-peoplus-squared-border {
        --text-opacity: 1;
        color: #D1D8E4;
        color: rgba(209, 216, 228, var(--text-opacity));
    }

    .text-peoplus-squared-background {
        --text-opacity: 1;
        color: #F2F4F7;
        color: rgba(242, 244, 247, var(--text-opacity));
    }

    .text-peoplus-squared-clickable-border {
        --text-opacity: 1;
        color: #B1C1DD;
        color: rgba(177, 193, 221, var(--text-opacity));
    }

    .text-peoplus-squared-clickable-background {
        --text-opacity: 1;
        color: #F1F3F6;
        color: rgba(241, 243, 246, var(--text-opacity));
    }

    .text-white {
        --text-opacity: 1;
        color: #FFFFFF;
        color: rgba(255, 255, 255, var(--text-opacity));
    }

    .text-black {
        --text-opacity: 1;
        color: #000000;
        color: rgba(0, 0, 0, var(--text-opacity));
    }

	/* Background Colors */
    .bg-gray-100 {
        --background-opacity: 1;
        background-color: #f1f4f7;
        background-color: rgba(241, 244, 247, var(--background-opacity));
    }

    .bg-gray-200 {
        --background-opacity: 1;
        background-color: #edf2f7;
        background-color: rgba(237, 242, 247, var(--background-opacity));
    }

    .bg-gray-300 {
        --background-opacity: 1;
        background-color: #E2E8F0;
        background-color: rgba(226, 232, 240, var(--background-opacity));
    }

    .bg-gray-400 {
        --background-opacity: 1;
        background-color: #cbd5e0;
        background-color: rgba(203, 213, 224, var(--background-opacity));
    }

    .bg-gray-500 {
        --background-opacity: 1;
        background-color: #a0aec0;
        background-color: rgba(160, 174, 192, var(--background-opacity));
    }

    .bg-gray-600 {
        --background-opacity: 1;
        background-color: #718096;
        background-color: rgba(113, 128, 150, var(--background-opacity));
    }

    .bg-gray-700 {
        --background-opacity: 1;
        background-color: #4a5568;
        background-color: rgba(74, 85, 104, var(--background-opacity));
    }

    .bg-gray-900 {
        --background-opacity: 1;
        background-color: #1A1E27;
        background-color: rgba(26, 32, 44, var(--background-opacity));
    }

    .bg-peoplus-squared {
        background: linear-gradient(90deg, #588FF9, #2952A1);
        background-size: 150% 150%;
    }

    .bg-peoplus-squared\:dark {
        background: linear-gradient(90deg, #2952A1, #1A1E27);
        background-size: 150% 150%;
    }

    .bg-peoplus-squared-blue {
        --background-opacity: 1;
        background-color: #588FF9;
        background-color: rgba(88, 143, 249, var(--background-opacity));
    }

    .bg-peoplus-squared-navy {
        --background-opacity: 1;
        background-color: #2952A1;
        background-color: rgba(41, 82, 161, var(--background-opacity));
    }

    .bg-peoplus-squared-black {
        --background-opacity: 1;
        background-color: #1A1E27;
        background-color: rgba(26, 30, 39, var(--background-opacity));
    }

    .bg-peoplus-squared-red {
        --background-opacity: 1;
        background-color: #D03A3A;
        background-color: rgba(208, 58, 58, var(--background-opacity));
    }

    .bg-peoplus-squared-green {
        --background-opacity: 1;
        background-color: #7CC623;
        background-color: rgba(124, 198, 35, var(--background-opacity));
    }

    .bg-peoplus-squared-yellow {
        --background-opacity: 1;
        background-color: #E4CC00;
        background-color: rgba(228, 204, 0, var(--background-opacity));
    }

    .bg-peoplus-squared-cube {
        background: linear-gradient(90deg, #D03A3A, #6C1919);
        background-size: 150% 150%;
    }

    .bg-peoplus-squared-cube-red {
        --background-opacity: 1;
        background-color: #D03A3A;
        background-color: rgba(208, 58, 58, var(--background-opacity));
    }

    .bg-peoplus-squared-cube-dark-red {
        --background-opacity: 1;
        background-color: #6C1919;
        background-color: rgba(108, 25, 25, var(--background-opacity));
    }

    .bg-peoplus-squared-system {
        background: linear-gradient(90deg, #00AFBA, #A9CD00);
        background-size: 150% 150%;
    }

    .bg-peoplus-squared-system-emerald {
        --background-opacity: 1;
        background-color: #00AFBA;
        background-color: rgba(0, 175, 186, var(--background-opacity));
    }

    .bg-peoplus-squared-system-green {
        --background-opacity: 1;
        background-color: #A9CD00;
        background-color: rgba(169, 205, 0, var(--background-opacity));
    }

    .bg-peoplus-squared-square {
        background: linear-gradient(90deg, #F444FF, #5400FF);
        background-size: 150% 150%;
    }

    .bg-peoplus-squared-square-pink {
        --background-opacity: 1;
        background-color: #F444FF;
        background-color: rgba(244, 68, 255, var(--background-opacity));
    }

    .bg-peoplus-squared-square-purple {
        --background-opacity: 1;
        background-color: #5400FF;
        background-color: rgba(84, 0, 255, var(--background-opacity));
    }

    .bg-peoplus-squared-village {
        background: linear-gradient(90deg, #E4CC00, #8D7E00);
        background-size: 150% 150%;
    }

    .bg-peoplus-squared-village-yellow {
        --background-opacity: 1;
        background-color: #E4CC00;
        background-color: rgba(228, 204, 0, var(--background-opacity));
    }

    .bg-peoplus-squared-village-dark-yellow {
        --background-opacity: 1;
        background-color: #8D7E00;
        background-color: rgba(141, 126, 0, var(--background-opacity));
    }

    .bg-peoplus-squared-suite {
        background: linear-gradient(90deg, #FFFF00, #EEAE00);
        background-size: 150% 150%;
    }

    .bg-peoplus-squared-suite-yellow {
        --background-opacity: 1;
        background-color: #FFFF00;
        background-color: rgba(255, 255, 0, var(--background-opacity));
    }

    .bg-peoplus-squared-suite-orange {
        --background-opacity: 1;
        background-color: #EEAE00;
        background-color: rgba(238, 174, 0, var(--background-opacity));
    }

    .bg-peoplus-squared-universe {
        background: linear-gradient(to right, #588FF9, #2952A1, #D03A3A, #7CC623, #E4CC00);
        background-size: 150% 150%;
    }

    .bg-peoplus-squared-border {
        --background-opacity: 1;
        background-color: #D1D8E4;
        background-color: rgba(209, 216, 228, var(--background-opacity));
    }

    .bg-peoplus-squared-background {
        --background-opacity: 1;
        background-color: #F2F4F7;
        background-color: rgba(242, 244, 247, var(--background-opacity));
    }

    .bg-peoplus-squared-clickable-border {
        --background-opacity: 1;
        background-color: #B1C1DD;
        background-color: rgba(177, 193, 221, var(--background-opacity));
    }

    .bg-peoplus-squared-clickable-background {
        --background-opacity: 1;
        background-color: #F1F3F6;
        background-color: rgba(241, 243, 246, var(--background-opacity));
    }

    .bg-white {
        --background-opacity: 1;
        background-color: #FFFFFF;
        background-color: rgba(255, 255, 255, var(--background-opacity));
    }

    .bg-black {
        --background-opacity: 1;
        background-color: #000000;
        background-color: rgba(0, 0, 0, var(--background-opacity));
    }

	/* Border Colors */
    .border-gray-100 {
        --border-opacity: 1;
        border-color: #f1f4f7;
        border-color: rgba(241, 244, 247, var(--border-opacity));
    }

    .border-gray-200 {
        --border-opacity: 1;
        border-color: #edf2f7;
        border-color: rgba(237, 242, 247, var(--border-opacity));
    }

    .border-gray-300 {
        --border-opacity: 1;
        border-color: #E2E8F0;
        border-color: rgba(226, 232, 240, var(--border-opacity));
    }

    .border-gray-400 {
        --border-opacity: 1;
        border-color: #cbd5e0;
        border-color: rgba(203, 213, 224, var(--border-opacity));
    }

    .border-gray-500 {
        --border-opacity: 1;
        border-color: #a0aec0;
        border-color: rgba(160, 174, 192, var(--border-opacity));
    }

    .border-gray-600 {
        --border-opacity: 1;
        border-color: #718096;
        border-color: rgba(113, 128, 150, var(--border-opacity));
    }

    .border-gray-700 {
        --border-opacity: 1;
        border-color: #4a5568;
        border-color: rgba(74, 85, 104, var(--border-opacity));
    }

    .border-gray-900 {
        --border-opacity: 1;
        border-color: #1A1E27;
        border-color: rgba(26, 32, 44, var(--border-opacity));
    }

    .border-peoplus-squared-blue {
        --border-opacity: 1;
        border-color: #588FF9;
        border-color: rgba(88, 143, 249, var(--border-opacity));
    }

    .border-peoplus-squared-navy {
        --border-opacity: 1;
        border-color: #2952A1;
        border-color: rgba(41, 82, 161, var(--border-opacity));
    }

    .border-peoplus-squared-black {
        --border-opacity: 1;
        border-color: #1A1E27;
        border-color: rgba(26, 30, 39, var(--border-opacity));
    }

    .border-peoplus-squared-red {
        --border-opacity: 1;
        border-color: #D03A3A;
        border-color: rgba(208, 58, 58, var(--border-opacity));
    }

    .border-peoplus-squared-green {
        --border-opacity: 1;
        border-color: #7CC623;
        border-color: rgba(124, 198, 35, var(--border-opacity));
    }

    .border-peoplus-squared-yellow {
        --border-opacity: 1;
        border-color: #E4CC00;
        border-color: rgba(228, 204, 0, var(--border-opacity));
    }

    .border-peoplus-squared-cube-red {
        --border-opacity: 1;
        border-color: #D03A3A;
        border-color: rgba(208, 58, 58, var(--border-opacity));
    }

    .border-peoplus-squared-cube-dark-red {
        --border-opacity: 1;
        border-color: #6C1919;
        border-color: rgba(108, 25, 25, var(--border-opacity));
    }

    .border-peoplus-squared-system-emerald {
        --border-opacity: 1;
        border-color: #00AFBA;
        border-color: rgba(0, 175, 186, var(--border-opacity));
    }

    .border-peoplus-squared-system-green {
        --border-opacity: 1;
        border-color: #A9CD00;
        border-color: rgba(169, 205, 0, var(--border-opacity));
    }

    .border-peoplus-squared-square-pink {
        --border-opacity: 1;
        border-color: #F444FF;
        border-color: rgba(244, 68, 255, var(--border-opacity));
    }

    .border-peoplus-squared-square-purple {
        --border-opacity: 1;
        border-color: #5400FF;
        border-color: rgba(84, 0, 255, var(--border-opacity));
    }

    .border-peoplus-squared-village-yellow {
        --border-opacity: 1;
        border-color: #E4CC00;
        border-color: rgba(228, 204, 0, var(--border-opacity));
    }

    .border-peoplus-squared-village-dark-yellow {
        --border-opacity: 1;
        border-color: #8D7E00;
        border-color: rgba(141, 126, 0, var(--border-opacity));
    }

    .border-peoplus-squared-suite-yellow {
        --border-opacity: 1;
        border-color: #FFFF00;
        border-color: rgba(255, 255, 0, var(--border-opacity));
    }

    .border-peoplus-squared-suite-orange {
        --border-opacity: 1;
        border-color: #EEAE00;
        border-color: rgba(238, 174, 0, var(--border-opacity));
    }

	.border-peoplus-squared-universe::before {
		content: "";
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 1rem;
		background: linear-gradient(to right, #588FF9, #2952A1, #D03A3A, #7CC623, #E4CC00);
		display: inline-block;
	}

    .border-peoplus-squared-border {
        --border-opacity: 1;
        border-color: #D1D8E4;
        border-color: rgba(209, 216, 228, var(--border-opacity));
    }

    .border-peoplus-squared-background {
        --border-opacity: 1;
        border-color: #F2F4F7;
        border-color: rgba(242, 244, 247, var(--border-opacity));
    }

    .border-peoplus-squared-clickable-border {
        --border-opacity: 1;
        border-color: #B1C1DD;
        border-color: rgba(177, 193, 221, var(--border-opacity));
    }

    .border-peoplus-squared-clickable-background {
        --border-opacity: 1;
        border-color: #F1F3F6;
        border-color: rgba(241, 243, 246, var(--border-opacity));
    }

    .border-white {
        --border-opacity: 1;
        border-color: #FFFFFF;
        border-color: rgba(255, 255, 255, var(--border-opacity));
    }

    .border-black {
        --border-opacity: 1;
        border-color: #000000;
        border-color: rgba(0, 0, 0, var(--border-opacity));
    }

	/*
		PEOPLUS Squared
		Tooltip Box Design

		@find-point: tooltip-box
	*/
	
	[ppsquared-tooltip-text]:hover {
		display: block;
		position: relative;
	}

	[ppsquared-tooltip-text]:before {
		-webkit-transition: bottom .3s ease-in-out, opacity .3s ease-in-out;
		-moz-transition: bottom .3s ease-in-out, opacity .3s ease-in-out;
		transition: bottom .3s ease-in-out, opacity .3s ease-in-out;

		position: absolute;
		left: -9999px;
		top: 90%;

		border-top: 0 solid transparent;
		border-left: 10px solid transparent;
		border-right: 10px solid transparent;
		border-bottom: 10px solid #2952A1;
		
		opacity: 0;
		z-index: 9999;

		content: "";
	}

	[ppsquared-tooltip-text]:after{
		position: absolute;
		left: -9999px;
		top: 90%;
		margin-top: 10px;
		padding: 7px 12px;
		width: auto;
		min-width: 50px;
		max-width: 300px;

		color: #FFFFFF;
		font-size: 12px;
		word-wrap: break-word;

		-webkit-transition: bottom .3s ease-in-out, opacity .3s ease-in-out;
		-moz-transition: bottom .3s ease-in-out, opacity .3s ease-in-out;
		transition: bottom .3s ease-in-out, opacity .3s ease-in-out;

		background-color: #2952A1;

		-webkit-box-shadow: 0px 0px 3px 1px rgba(26, 30, 39, 0.4);
		-moz-box-shadow: 0px 0px 3px 1px rgba(26, 30, 39, 0.4);
		box-shadow: 0px 0px 3px 1px rgba(26, 30, 39, 0.4);

		-webkit-border-radius: 0.25rem;
		-moz-border-radius: 0.25rem;
		border-radius: 0.25rem;

		opacity: 0;

		z-index: 9998;

		content: attr(ppsquared-tooltip-text);
	}

	[ppsquared-tooltip-text]:hover:before{
		top: 100%;
		left: 25px;
		opacity: 1;
	}

	[ppsquared-tooltip-text]:hover:after{
		top: 100%;
		left: 0;
		opacity: 1;
	}

	.ppsquared-tooltip {
		display: inline;
		position: relative;
	}
	
	.ppsquared-tooltip:hover span:after {
		position: absolute;
		margin-bottom: 10px;
		padding: 7px 12px;
		left: 0px;
		top: 120%;

		width: auto;
		min-width: 150px;
		max-width: 300px;
		word-wrap: break-word;
		color: #FFFFFF;
		font-size: 12px;

		z-index: 9999;
		-webkit-transition: bottom .3s ease-in-out, opacity .3s ease-in-out;
		-moz-transition: bottom .3s ease-in-out, opacity .3s ease-in-out;
		transition: bottom .3s ease-in-out, opacity .3s ease-in-out;

		background-color: #2952A1;

		-webkit-box-shadow: 0px 0px 3px 1px rgba(26, 30, 39, 0.4);
		-moz-box-shadow: 0px 0px 3px 1px rgba(26, 30, 39, 0.4);
		box-shadow: 0px 0px 3px 1px rgba(26, 30, 39, 0.4);

		-webkit-border-radius: 0px;
		-moz-border-radius: 0px;
		border-radius: 0px;

		opacity: 1;

		content: attr(data-title);
	}

	.ppsquared-tooltip span:hover{
		display: none;
	}

	/*
		PEOPLUS Squared
		Switch Design

		Exmaple Code:
			<div class="ppsquared-switcher">
				<input type="checkbox" id="switch1" name="switch1" class="ppsquared-switch">
				<label for="switch1" class="ppsquared-switch">
					<span class="marble"></span>
					<span class="on"></span>
					<span class="off"></span>
				</label>
			</div>

		@find-point: switch
	*/

	div.ppsquared-switcher {
		margin: 0;
		padding: 0;
		width: 45px;
		height: 26px;
	}
	input[type="checkbox"].ppsquared-switch {
		display: none;
	}
	label.ppsquared-switch {
		overflow: hidden;
		position: relative;
		display: block;

		margin: 0;
		padding: 0;
		width: 45px;
		height: 26px;

		-webkit-border-radius: 13px;
		-moz-border-radius: 13px;
		border-radius: 13px;

		background-color: #D03A3A;
		color: #fff;
		font-weight: bold;
		cursor: pointer;

		-webkit-transition: all .3s;
		-moz-transition: all .3s;
		-ms-transition: all .3s;
		-o-transition: all .3s;
		transition: all .3s;
	}
	label.ppsquared-switch > * {
		vertical-align: middle;
		-webkit-transition: all .3s;
		-moz-transition: all .3s;
		-ms-transition: all .3s;
		-o-transition: all .3s;
		transition: all .3s;
		font-size: 14px;
	}
	label.ppsquared-switch > .marble {
		position: absolute;
		display: block;

		top: 2px;
		left: 2px;
		width: 22px;
		height: 22px;

		background-color: #FFFFFF;

		-webkit-border-radius: 50%;
		-moz-border-radius: 50%;
		border-radius: 50%;
		-webkit-box-shadow: 0 0 10px rgba(0, 0, 0, .3);
		-moz-box-shadow: 0 0 10px rgba(0, 0, 0, .3);
		box-shadow: 0 0 10px rgba(0, 0, 0, .3);
	}
	label.ppsquared-switch > .on {
		display: none;
		padding-left: 10px;
		line-height: 25px;
	}
	label.ppsquared-switch > .off {
		padding-left: 30px;
		line-height: 25px;
	}
	input[type="checkbox"].ppsquared-switch:checked + label.ppsquared-switch {
		background-color: #588FF9;
	}
	input[type="checkbox"].ppsquared-switch:checked + label.ppsquared-switch > .on {
		display: block;
	}
	input[type="checkbox"].ppsquared-switch:checked + label.ppsquared-switch > .off {
		display: none;
	}
	input[type="checkbox"].ppsquared-switch:checked + label.ppsquared-switch > .marble {
		left: 21px;
	}

	/*
		PEOPLUS Squared
		Alert Message Design
	*/

	div#ppsqured-alert-message {
		top: 0;
		left: 0;
		width: 100vw;
		height: 100vh;
		height: calc(var(--vh, 1vh) * 100);
		position: fixed;
		
		background-color: rgba(26, 30, 39, 0.8);
		z-index: 2;
	}

	div#ppsqured-alert-message div.alert-message-context {
		bottom: 0;
		left: 0;
		width: 100vw;
		position: absolute;
		display: flex;
		flex-direction: column;
		align-items: flex-end;
	}

	div#ppsqured-alert-message div.alert-message-context > div.alert-message-box {
		bottom: 1.5rem;
		right: 1.5rem;
		position: absolute;
		display: flex;
		flex-direction: column;
		align-items: flex-start;
	}

	@media (max-width: 1000px) {
		div#ppsqured-alert-message div.alert-message-context > div.alert-message-box {
			bottom: 0;
			right: 0;
		}
	}

	/*
		PEOPLUS Squared
		Message Context Design
	*/
	
	.ppsquared-msg-context {
		position: relative;
		margin-left: 10px;
		padding: 5px 10px;
		width: auto;
		min-width: 50px;
		max-width: 300px;

		color: #FFFFFF;
		font-size: 12px;
		word-wrap: break-word;

		-webkit-transition: bottom .3s ease-in-out, opacity .3s ease-in-out;
		-moz-transition: bottom .3s ease-in-out, opacity .3s ease-in-out;
		transition: bottom .3s ease-in-out, opacity .3s ease-in-out;

        background: linear-gradient(90deg, #D03A3A, #6C1919);
        background-size: 150% 150%;

		-webkit-box-shadow: 0px 0px 3px 1px rgba(108, 25, 25, 0.4);
		-moz-box-shadow: 0px 0px 3px 1px rgba(108, 25, 25, 0.4);
		box-shadow: 0px 0px 3px 1px rgba(108, 25, 25, 0.4);

		-webkit-border-radius: 0.25rem;
		-moz-border-radius: 0.25rem;
		border-radius: 0.25rem;

		opacity: 1;

		display: inline-block;
	}

	.ppsquared-msg-context:before {
		content: "";
		position: absolute;
		top: calc(100%/4);
		right: 100%;
		
		border-top: 7.5px solid transparent;
		border-bottom: 7.5px solid transparent;
		border-left: 7.5px solid transparent;
		border-right: 7.5px solid #D03A3A;
	}

	/*
		PEOPLUS Squared
		Module Part Design
	*/
	.ppsquared-module {
		border-color: transparent;
		background-color: transparent;
	}
	.ppsquared-module-head {
		color: #FFFFFF;
		background-color: #2952A1;
		border-color: #2952A1;
		padding: 10px 15px;
		border-bottom: 1px solid transparent;
	}
	.ppsquared-module-head h3 {
		font-size: 14px;
		line-height: 20px;
		height: 20px;
		margin: 0
	}
	.ppsquared-module-option {
		border-bottom: 1px solid #e5e5e5;
		padding: 15px 0;
		margin: 0 15px
	}
	.ppsquared-module-body {
		padding: 15px;
	}
	.ppsquared-module-body.ppsquared-table {
		padding: 15px 0
	}
	.ppsquared-module-body.ppsquared-table .ppsquared-table th,
	.ppsquared-module-body.ppsquared-table .ppsquared-table td {
		padding-left: 15px;
		padding-right: 15px
	}
	.ppsquared-module-foot {
		background: #f9f9f9;
		border-top: 1px solid #ddd;
		-webkit-border-radius: 0 0 2px 2px;
		-moz-border-radius: 0 0 2px 2px;
		border-radius: 0 0 2px 2px;
		padding: 15px
	}

	/*
		PEOPLUS Squared
		Charts Design
	*/

	div.ppsquared-circle-chart {
		position: relative;
		width: 100%;
		height: 100%;
		min-width: 80px;
		min-height: 80px;
		border-radius: 50%;
	}
	
	div.ppsquared-circle-chart > div.chart-hole {
		position: absolute;
		top: 50%;
		left: 50%;
		width: calc(100% / 1.75);
		height: calc(100% / 1.75);

		background: #FFFFFF;
		border-radius: 50%;
		transform: translate(-50%, -50%);
	}

	div.ppsquared-circle-chart > div.chart-hole > span.chart-value {
		position: absolute;
		top: 50%;
		left: 50%;

		font-size: 15px;
		text-align: center;
		line-height: 100%;

		background: #FFFFFF;
		border-radius: 50%;
		transform: translate(-50%, -50%);
	}

	/*
		PEOPLUS Squared Table
	*/

	.ppsquared-table {
		margin-bottom: 0;
		border-bottom: 0;
		border-collapse: collapse;
	}
	.ppsquared-table th,
	.ppsquared-table td {
		padding: 8px;
		font-size: 10pt;
		vertical-align: middle;
		border-top: 1px solid #D1D8E4;
		border-left: 1px solid #D1D8E4;
		word-break: keep-all;
	}

	.ppsquared-table th:first-child,
	.ppsquared-table td:first-child {
		border-left: 0;
	}
	.ppsquared-table.valign-middle td,
	.ppsquared-table.valign-middle th {
		vertical-align: middle
	}

	.ppsquared-table {
		border-collapse: collapse;
	}
	.ppsquared-table:first-child {
		margin-top: 0;
		border-top: 1px solid #D1D8E4;
	}
	.ppsquared-table-bordered:last-child{
		margin-bottom: 0;
		border-bottom: 1px solid #D1D8E4;
	}
	.ppsquared-table-bordered th:first-child,
	.ppsquared-table-bordered td:first-child {
		border-left: 1px solid #D1D8E4 !important;
	}
	.ppsquared-table-bordered th:last-child,
	.ppsquared-table-bordered td:last-child {
		border-right: 1px solid #D1D8E4;
	}
	.ppsquared-table-bordered td:first-child {
		font-weight: bold;
		background-color: #F2F4F7;
	}
	.ppsquared-table-bordered thead:first-child tr:first-child>th:first-child,
	.ppsquared-table-bordered tbody:first-child tr:first-child>td:first-child {
		-webkit-border-top-left-radius: 2px;
		-moz-border-radius-topleft: 2px;
		border-top-left-radius: 2px
	}
	.ppsquared-table-bordered thead:first-child tr:first-child>th:last-child,
	.ppsquared-table-bordered tbody:first-child tr:first-child>td:last-child {
		-webkit-border-top-right-radius: 2px;
		-moz-border-radius-topright: 2px;
		border-top-right-radius: 2px
	}
	.ppsquared-table-bordered thead:last-child tr:last-child>th:first-child,
	.ppsquared-table-bordered tbody:last-child tr:last-child>td:first-child,
	.ppsquared-table-bordered tfoot:last-child tr:last-child>td:first-child {
		-webkit-border-bottom-left-radius: 2px;
		-moz-border-radius-bottomleft: 2px;
		border-bottom-left-radius: 2px
	}
	.ppsquared-table-bordered thead:last-child tr:last-child>th:last-child,
	.ppsquared-table-bordered tbody:last-child tr:last-child>td:last-child,
	.ppsquared-table-bordered tfoot:last-child tr:last-child>td:last-child {
		-webkit-border-bottom-right-radius: 2px;
		-moz-border-radius-bottomright: 2px;
		border-bottom-right-radius: 2px
	}

	.ppsquared-table-bordered tfoot > tr.border-top-none,
	.ppsquared-table-bordered tfoot > tr.border-top-none > th{
		border-top: none;
	}

	.ppsquared-table th .small-icon, .ppsquared-table td .small-icon {
		position: relative;
		margin: 0 5px 0 0;
		padding: 0;
		min-width: 33px;
		min-height: 33px;
		font-size: 10pt;
		text-align: center;
		vertical-align: middle;
		background-position: center;
		background-repeat: no-repeat;
		background-size: 75%;
		display: inline-block;
	}

	/*
		PEOPLUS Squared DataTable
	*/
	.ppsquared-datatable-wrapper {
		overflow: hidden;
	}
	.ppsquared-datatable-wrapper select,
	.ppsquared-datatable-wrapper input,
	.ppsquared-datatable-wrapper label {
		margin: 0
	}
	.ppsquared-datatable-wrapper select,
	.ppsquared-datatable-wrapper input {
		margin: 0 0 0 5px
	}
	.ppsquared-datatable-wrapper > div {
		float: left;
		margin: 0 0 15px 15px
	}
	.ppsquared-datatable-wrapper > div+div {
		float: right;
		margin: 0 15px 15px 0
	}

	.ppsquared-datatable-wrapper .ppsquared-datatable-filter label {
		display: inline-block;
	}
	.ppsquared-datatable-wrapper .ppsquared-datatable-filter label::before {
		content: "\f002";

		margin-right: -1.75rem;
		font-family: "Font Awesome";
		font-weight: 900;
		color: #1A1E27;
	}
	.ppsquared-datatable-wrapper .ppsquared-datatable-filter label > input[type=text] {
		padding-left: 1.6rem;
	}

	.ppsquared-datatable-wrapper > table {
        border-bottom: 1px solid #E2E8F0;
	}
	.ppsquared-datatable-wrapper table+div,
	.ppsquared-datatable-wrapper table+div+div {
		margin-top: 15px;
		margin-bottom: 0;
	}
	.ppsquared-datatable-wrapper table th {
		background: #f5f5f5;
		cursor: pointer;
	}
	.ppsquared-datatable-wrapper table th:focus {
		outline: 0;
	}
	.ppsquared-datatable-wrapper table th.sorting_asc,
	.ppsquared-datatable-wrapper table th.sorting_desc {
		background: #f0f0f0;
		-webkit-box-shadow: 0 0 5px rgba(0,0,0,0.1) inset;
		-moz-box-shadow: 0 0 5px rgba(0,0,0,0.1) inset;
		box-shadow: 0 0 5px rgba(0,0,0,0.1) inset
	}
	.ppsquared-datatable-wrapper table tr:hover th {
		background: #f1f1f1;
		background: -moz-linear-gradient(top, #fafafa 0, #fafafa 50%, #f1f1f1 51%, #f1f1f1 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fafafa), color-stop(50%, #fafafa), color-stop(51%, #f1f1f1), color-stop(100%, #f1f1f1));
		background: -webkit-linear-gradient(top, #fafafa 0, #fafafa 50%, #f1f1f1 51%, #f1f1f1 100%);
		background: -o-linear-gradient(top, #fafafa 0, #fafafa 50%, #f1f1f1 51%, #f1f1f1 100%);
		background: -ms-linear-gradient(top, #fafafa 0, #fafafa 50%, #f1f1f1 51%, #f1f1f1 100%);
		background: linear-gradient(to bottom, #fafafa 0, #fafafa 50%, #f1f1f1 51%, #f1f1f1 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='@topColor', endColorstr='@bottomColor', GradientType=0)
	}
	.ppsquared-datatable-wrapper table tr:hover th.sorting_asc,
	.ppsquared-datatable-wrapper table tr:hover th.sorting_desc {
		background: #f0f0f0
	}

	.ppsquared-datatable-wrapper .ppsquared-table-bordered {
		-webkit-border-radius: 0;
		-moz-border-radius: 0;
		border-radius: 0;
		border-left: 0;
		border-right: 0
	}
	.ppsquared-datatable-wrapper .ppsquared-table-bordered thead tr > th:first-child,
	.ppsquared-datatable-wrapper .ppsquared-table-bordered tbody tr > td:first-child,
	.ppsquared-datatable-wrapper .ppsquared-table-bordered tfoot tr > td:first-child,
	.ppsquared-datatable-wrapper .ppsquared-table-bordered tfoot tr > th:first-child {
		border-left: 0
	}
	.ppsquared-datatable-wrapper .ppsquared-table-bordered thead:first-child tr:first-child > th:first-child,
	.ppsquared-datatable-wrapper .ppsquared-table-bordered tbody:first-child tr:first-child > td:first-child {
		-webkit-border-top-left-radius: 0;
		-moz-border-radius-topleft: 0;
		border-top-left-radius: 0
	}
	.ppsquared-datatable-wrapper .ppsquared-table-bordered thead:first-child tr:first-child > th:last-child,
	.ppsquared-datatable-wrapper .ppsquared-table-bordered tbody:first-child tr:first-child > td:last-child {
		-webkit-border-top-right-radius: 0;
		-moz-border-radius-topright: 0;
		border-top-right-radius: 0
	}
	.ppsquared-datatable-wrapper .ppsquared-table-bordered thead:last-child tr:last-child > th:first-child,
	.ppsquared-datatable-wrapper .ppsquared-table-bordered tbody:last-child tr:last-child > td:first-child,
	.ppsquared-datatable-wrapper .ppsquared-table-bordered tfoot:last-child tr:last-child > td:first-child {
		-webkit-border-bottom-left-radius: 0;
		-moz-border-radius-bottomleft: 0;
		border-bottom-left-radius: 0
	}
	.ppsquared-datatable-wrapper .ppsquared-table-bordered thead:last-child tr:last-child > th:last-child,
	.ppsquared-datatable-wrapper .ppsquared-table-bordered tbody:last-child tr:last-child > td:last-child,
	.ppsquared-datatable-wrapper .ppsquared-table-bordered tfoot:last-child tr:last-child > td:last-child {
		-webkit-border-bottom-right-radius: 0;
		-moz-border-radius-bottomright: 0;
		border-bottom-right-radius: 0
	}

	.ppsquared-datatable-length {
		color: #1A1E27;
	}
	.ppsquared-datatable-info {
		float: left;
		padding-top: 5px;
		color: #1A1E27;
	}
	.ppsquared-datatable-pagination {
		float: right
	}
	.ppsquared-datatable-pagination > a {
		-webkit-border-radius: 0;
		-moz-border-radius: 0;
		border-radius: 0;
		cursor: pointer;
		display: inline-block;
		line-height: 20px;
		min-height: 20px;
		background-color: #2952A1;
		
		color: #FFFFFF;
		padding: 8px 12px 4px;
		text-align: center;
		text-decoration: none!important;
		text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
		vertical-align: middle
	}
	.ppsquared-datatable-pagination > a+a {
		margin-left: -1px
	}
	.ppsquared-datatable-pagination > a:first-child {
		-webkit-border-top-left-radius: 3px;
		-moz-border-radius-topleft: 3px;
		border-top-left-radius: 3px;
		-webkit-border-bottom-left-radius: 3px;
		-moz-border-radius-bottomleft: 3px;
		border-bottom-left-radius: 3px
	}
	.ppsquared-datatable-pagination > a:last-child {
		-webkit-border-top-right-radius: 3px;
		-moz-border-radius-topright: 3px;
		border-top-right-radius: 3px;
		-webkit-border-bottom-right-radius: 3px;
		-moz-border-radius-bottomright: 3px;
		border-bottom-right-radius: 3px
	}
	.ppsquared-datatable-pagination > a:hover {
		background-color: #1A1E27;
		background-image: -moz-linear-gradient(top, #1A1E27, #1A1E27);
		background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#1A1E27), to(#1A1E27));
		background-image: -webkit-linear-gradient(top, #1A1E27, #1A1E27);
		background-image: -o-linear-gradient(top, #1A1E27, #1A1E27);
		background-image: linear-gradient(to bottom, #1A1E27, #1A1E27);
		background-repeat: repeat-x;
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff1A1E27', endColorstr='#ff1A1E27', GradientType=0)
	}
	.ppsquared-datatable-pagination > a.paginate_disabled_previous,
	.ppsquared-datatable-pagination > a.paginate_disabled_next {
		cursor: default
	}
	.ppsquared-datatable-pagination > a.paginate_disabled_previous i,
	.ppsquared-datatable-pagination > a.paginate_disabled_next i {
		opacity: .5;
		filter: alpha(opacity=50)
	}
	.ppsquared-datatable-pagination > a span {
		display: none
	}

	/*
		PEOPLUS Squared
		Table Array
	*/
	.ppsquared-table-array{
		position: static;
		margin: 0 auto 10px;
		padding: 0;
		
		background-color: #FFFFFF; /* #F2F4F7 */
		font-size: 10pt;
		font-weight: normal;
		color: #1A1E27;

		transition: 0.5s;
		-webkit-transition: 0.5s;
	}

	.ppsquared-table-array:hover .label{
		color: #2952A1; /* #F2F4F7 */

		transition: 0.5s;
		-webkit-transition: 0.5s;
	}

	.ppsquared-table-array:hover .label input[type="text"]{
		border: 1px solid #2952A1; /* #F2F4F7 */

		transition: 0.5s;
		-webkit-transition: 0.5s;
	}

	.ppsquared-table-array .label{
		position: static;
		margin: 0 10px 0 0;

		font-weight: bold;
		color: #1A1E27;

		transition: 0.5s;
		-webkit-transition: 0.5s;
	}

	.ppsquared-table-array .context{
		position: static;
		margin: 0 auto 0;
	}

	/*
		PEOPLUS Squared Button Array
	*/
	.ppsquared-button-array {
		position: relative;
		margin-top: 10px;
		padding: 0;
		width: 100%;
		font-size: 11pt;
		font-weight: normal;
		list-style: none;
		color: #1A1E27;
		display: inline-block;
	}

	.ppsquared-button-array li{
		position: relative;
		float: left;
		margin: 0 10px 0 0;
		padding: 0;
		width: 100px;
		height: 100px;

		background-color: #FFFFFF;
		border: 1px solid #D1D8E4;

		
		font-size: 11pt;
		font-weight: normal;
		color: #1A1E27;
	}

	.ppsquared-button-array li:hover{
		background-color: #F1F3F6;
		border: 1px solid #B1C1DD;
	}

	.ppsquared-button-array li .item{
		position: relative;
		margin: 0;
		padding: 0;
		width: 100%;
		height: 100%;
		
		line-height: 175px;
		
		font-size: 10pt;
		font-weight: normal;
		text-align: center;
		color: #1A1E27;

		cursor: pointer;
	}

	.ppsquared-button-array li .item-with-img{
		position: relative;
		margin: 0;
		padding: 0;
		width: 100%;
		height: 100%;
		
		background-size: 35px 35px;
		background-repeat: no-repeat;
		background-position: center;
		
		/* line-height: 170px; */
		
		font-size: 9pt;
		font-weight: normal;
		text-align: center;
		color: #1A1E27;

		cursor: pointer;
	}
	
	.ppsquared-button-array li .item span,
	.ppsquared-button-array li .item-with-img span{
		position: absolute;
		margin: 0;
		padding: 0;
		left: 0;
		bottom: 10px;
		width: 100%;
		
		font-size: 9pt;
		font-weight: normal;
		text-align: center;
		color: #1A1E27;
		word-break: break-all;
		display: inline-block;

		cursor: pointer;
	}

	.ppsquared-button-array li .item:hover span,
	.ppsquared-button-array li .item-with-img:hover span{
		font-weight: bold;
	}
	/*
		Default Margin Values
	*/
	.margin-top-15 {
		margin-top: 15px !important;
	}

	.margin-top-25 {
		margin-top: 25px !important;
	}

	.margin-top-45 {
		margin-top: 45px !important;
	}

	.margin-top-100 {
		margin-top: 100px !important;
	}

	.margin-bottom-16 {
		margin-bottom: 16px !important;
	}

	.margin-bottom-28 {
		margin-bottom: 28px !important;
	}

	.margin-bottom-45 {
		margin-bottom: 45px !important;
	}

	.margin-bottom-90 {
		margin-bottom: 90px !important;
	}

	.margin-bottom-100 {
		margin-bottom: 100px !important;
	}

	.margin-bottom-128 {
		margin-bottom: 128px !important;
	}

	.ppsquared-textbox {
		padding-left: 15px !important;
		padding-right: 15px !important;
		width: 100%;
		max-width: 477px;
		min-height: 56px;
		
		font-weight: bold !important;

		display: inline-block;
	}

	.ppsquared-textbox::placeholder {
		color: #1A1E27;
		font-weight: bold;
	}

	.ppsquared-button-submit {
		width: 100%;
		max-width: 360px;
		min-height: 37px;
		
		background: #588FF9 !important;
		color: #FFFFFF !important;
		font-size: 12pt !important;

		display: inline-block;

		transition: 0.25s;
		-webkit-transition: 0.25s;
	}

	.ppsquared-button-submit:hover,
	.ppsquared-button-submit:focus {
		background: #2952A1 !important;

		transition: 0.25s;
		-webkit-transition: 0.25s;
	}

	input.ppsquared-button-login,
	input.ppsquared-button-login:focus,
	input.ppsquared-button-login:hover,
	button.ppsquared-button-login,
	button.ppsquared-button-login:focus,
	button.ppsquared-button-login:hover {
		--min-wdith: 250px;
		position: relative;
		margin: 0;
		padding: 15px 10px 20px;
		min-width: var(--min-wdith);
		min-height: calc(var(--min-wdith) / 5);
		
		line-height: 1.0;
		font-size: 10pt;
		font-weight: bold;
		color: #2952A1;
		
		border-radius: 0.5rem;
		border: 1px solid #D1D8E4;
		background: #FFFFFF;

		display: inline-block;

        box-shadow: 0 1px 3px 0 rgba(26, 30, 39, .1), 0 1px 2px 0 rgba(26, 30, 39, .06);
		box-sizing: border-box;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;

		outline: none;
		overflow: hidden;
		cursor: pointer;
	}

	input.ppsquared-button-login::before,
	button.ppsquared-button-login::before {
		content: "";
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 0.5rem;
		background: linear-gradient(to right, #588FF9, #2952A1, #D03A3A, #7CC623, #E4CC00);
		display: inline-block;
	}

	.ppsquared-slogan-text{
		font-weight: bold;
		background: linear-gradient(to right, #588FF9, #2952A1);
		background-clip: text;
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
	}
	
	/*
		PEOPLUS Squared Font-based Icons

		@find-point: icons
	*/
	.ppsquared-icons-all{
		display: inline-block;
		font: normal normal normal 14px/1 'Nucleo Outline' !important;
		font-size: inherit;
		speak: none;
		speak-as: spell-out;
		text-transform: none;
		/* Better Font Rendering */
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}

	.ppsquared-icons-all [class*="ppsquared-icons-all"] {
		font-size: 32px;
	}
	
	.ppsquared-icons-all.ui-1_check:before {
		content: "\ea22";
	}

	.ppsquared-icons-all.ui-1_email-85:before {
		content: "\ea2a";
	}

	.ppsquared-icons-all.arrows-1_cloud-download-93:before {
		content: "\ea21";
	}

	.ppsquared-icons-all.arrows-1_cloud-upload-94:before {
		content: "\ea24";
	}

	.ppsquared-icons-all.arrows-1_minimal-down:before {
		content: "\ea39";
	}

	.ppsquared-icons-all.arrows-1_minimal-left:before {
		content: "\ea3a";
	}

	.ppsquared-icons-all.arrows-1_minimal-right:before {
		content: "\ea3b";
	}

	.ppsquared-icons-all.arrows-1_minimal-up:before {
		content: "\ea3c";
	}

	.ppsquared-icons-all.arrows-1_refresh-69:before {
		content: "\ea44";
	}

	.ppsquared-icons-all.arrows-1_share-66:before {
		content: "\ea4c";
	}

	.ppsquared-icons-all.business_badge:before {
		content: "\ea09";
	}

	.ppsquared-icons-all.business_bank:before {
		content: "\ea0a";
	}

	.ppsquared-icons-all.business_briefcase-24:before {
		content: "\ea13";
	}

	.ppsquared-icons-all.business_bulb-63:before {
		content: "\ea15";
	}

	.ppsquared-icons-all.business_chart-bar-32:before {
		content: "\ea1e";
	}

	.ppsquared-icons-all.business_chart-pie-36:before {
		content: "\ea1f";
	}

	.ppsquared-icons-all.business_globe:before {
		content: "\ea2f";
	}

	.ppsquared-icons-all.business_money-coins:before {
		content: "\ea40";
	}

	.ppsquared-icons-all.clothes_tie-bow:before {
		content: "\ea5b";
	}

	.ppsquared-icons-all.design_vector:before {
		content: "\ea61";
	}

	.ppsquared-icons-all.design_app:before {
		content: "\ea08";
	}

	.ppsquared-icons-all.design_bullet-list-67:before {
		content: "\ea14";
	}

	.ppsquared-icons-all.design_image:before {
		content: "\ea33";
	}

	.ppsquared-icons-all.design_palette:before {
		content: "\ea41";
	}

	.ppsquared-icons-all.design_scissors:before {
		content: "\ea4a";
	}

	.ppsquared-icons-all.design-2_html5:before {
		content: "\ea32";
	}

	.ppsquared-icons-all.design-2_ruler-pencil:before {
		content: "\ea48";
	}

	.ppsquared-icons-all.emoticons_satisfied:before {
		content: "\ea49";
	}

	.ppsquared-icons-all.files_box:before {
		content: "\ea12";
	}

	.ppsquared-icons-all.files_paper:before {
		content: "\ea43";
	}

	.ppsquared-icons-all.files_single-copy-04:before {
		content: "\ea52";
	}

	.ppsquared-icons-all.health_ambulance:before {
		content: "\ea07";
	}

	.ppsquared-icons-all.loader_gear:before {
		content: "\ea4e";
	}

	.ppsquared-icons-all.loader_refresh:before {
		content: "\ea44";
	}

	.ppsquared-icons-all.location_bookmark:before {
		content: "\ea10";
	}

	.ppsquared-icons-all.location_compass-05:before {
		content: "\ea25";
	}

	.ppsquared-icons-all.location_map-big:before {
		content: "\ea3d";
	}

	.ppsquared-icons-all.location_pin:before {
		content: "\ea47";
	}

	.ppsquared-icons-all.location_world:before {
		content: "\ea63";
	}

	.ppsquared-icons-all.media-1_album:before {
		content: "\ea02";
	}

	.ppsquared-icons-all.media-1_button-pause:before {
		content: "\ea16";
	}

	.ppsquared-icons-all.media-1_button-play:before {
		content: "\ea18";
	}

	.ppsquared-icons-all.media-1_button-power:before {
		content: "\ea19";
	}

	.ppsquared-icons-all.media-1_camera-compact:before {
		content: "\ea1c";
	}

	.ppsquared-icons-all.media-2_note-03:before {
		content: "\ea3f";
	}

	.ppsquared-icons-all.media-2_sound-wave:before {
		content: "\ea57";
	}

	.ppsquared-icons-all.objects_diamond:before {
		content: "\ea29";
	}

	.ppsquared-icons-all.objects_globe:before {
		content: "\ea2f";
	}

	.ppsquared-icons-all.objects_key-25:before {
		content: "\ea38";
	}

	.ppsquared-icons-all.objects_planet:before {
		content: "\ea46";
	}

	.ppsquared-icons-all.objects_spaceship:before {
		content: "\ea55";
	}

	.ppsquared-icons-all.objects_support-17:before {
		content: "\ea56";
	}

	.ppsquared-icons-all.objects_umbrella-13:before {
		content: "\ea5f";
	}

	.ppsquared-icons-all.education_agenda-bookmark:before {
		content: "\ea01";
	}

	.ppsquared-icons-all.education_atom:before {
		content: "\ea0c";
	}

	.ppsquared-icons-all.education_glasses:before {
		content: "\ea2d";
	}

	.ppsquared-icons-all.education_hat:before {
		content: "\ea30";
	}

	.ppsquared-icons-all.education_paper:before {
		content: "\ea42";
	}

	.ppsquared-icons-all.shopping_bag-16:before {
		content: "\ea0d";
	}

	.ppsquared-icons-all.shopping_basket:before {
		content: "\ea0b";
	}

	.ppsquared-icons-all.shopping_box:before {
		content: "\ea11";
	}

	.ppsquared-icons-all.shopping_cart-simple:before {
		content: "\ea1d";
	}

	.ppsquared-icons-all.shopping_credit-card:before {
		content: "\ea28";
	}

	.ppsquared-icons-all.shopping_delivery-fast:before {
		content: "\ea27";
	}

	.ppsquared-icons-all.shopping_shop:before {
		content: "\ea50";
	}

	.ppsquared-icons-all.shopping_tag-content:before {
		content: "\ea59";
	}

	.ppsquared-icons-all.sport_trophy:before {
		content: "\ea5d";
	}

	.ppsquared-icons-all.sport_user-run:before {
		content: "\ea60";
	}

	.ppsquared-icons-all.tech_controller-modern:before {
		content: "\ea26";
	}

	.ppsquared-icons-all.tech_headphones:before {
		content: "\ea31";
	}

	.ppsquared-icons-all.tech_laptop:before {
		content: "\ea36";
	}

	.ppsquared-icons-all.tech_mobile:before {
		content: "\ea3e";
	}

	.ppsquared-icons-all.tech_tablet:before {
		content: "\ea58";
	}

	.ppsquared-icons-all.tech_tv:before {
		content: "\ea5e";
	}

	.ppsquared-icons-all.tech_watch-time:before {
		content: "\ea62";
	}

	.ppsquared-icons-all.text_align-center:before {
		content: "\ea05";
	}

	.ppsquared-icons-all.text_align-left:before {
		content: "\ea06";
	}

	.ppsquared-icons-all.text_bold:before {
		content: "\ea0e";
	}

	.ppsquared-icons-all.text_caps-small:before {
		content: "\ea1b";
	}

	.ppsquared-icons-all.gestures_tap-01:before {
		content: "\ea5a";
	}

	.ppsquared-icons-all.transportation_air-baloon:before {
		content: "\ea03";
	}

	.ppsquared-icons-all.transportation_bus-front-12:before {
		content: "\ea17";
	}

	.ppsquared-icons-all.travel_info:before {
		content: "\ea04";
	}

	.ppsquared-icons-all.travel_istanbul:before {
		content: "\ea34";
	}

	.ppsquared-icons-all.ui-1_bell-53:before {
		content: "\ea0f";
	}

	.ppsquared-icons-all.ui-1_calendar-60:before {
		content: "\ea1a";
	}

	.ppsquared-icons-all.ui-1_lock-circle-open:before {
		content: "\ea35";
	}

	.ppsquared-icons-all.ui-1_send:before {
		content: "\ea4d";
	}

	.ppsquared-icons-all.ui-1_settings-gear-63:before {
		content: "\ea4e";
	}

	.ppsquared-icons-all.ui-1_simple-add:before {
		content: "\ea4f";
	}

	.ppsquared-icons-all.ui-1_simple-delete:before {
		content: "\ea54";
	}

	.ppsquared-icons-all.ui-1_simple-remove:before {
		content: "\ea53";
	}

	.ppsquared-icons-all.ui-1_zoom-bold:before {
		content: "\ea64";
	}

	.ppsquared-icons-all.ui-2_chat-round:before {
		content: "\ea20";
	}

	.ppsquared-icons-all.ui-2_favourite-28:before {
		content: "\ea2b";
	}

	.ppsquared-icons-all.ui-2_like:before {
		content: "\ea37";
	}

	.ppsquared-icons-all.ui-2_settings-90:before {
		content: "\ea4b";
	}

	.ppsquared-icons-all.ui-2_time-alarm:before {
		content: "\ea5c";
	}

	.ppsquared-icons-all.users_circle-08:before {
		content: "\ea23";
	}

	.ppsquared-icons-all.users_single-02:before {
		content: "\ea51";
	}

	/*
		PEOPLUS Squared Animations

		@find-point: animations
	*/
	@keyframes fadeIn {
        0% {
            opacity: 0;
			z-index: -1;
        }
        to {
            opacity: 1;
			z-index: -1;
        }
    }

	@keyframes fadeIn-with-blur {
		0% {
			opacity: 0;
			filter: blur(20px);
		}
		
		100% {
			opacity: 1;
			filter: blur(0px);
		}
		
	}

	@keyframes fadeInDown {
        0% {
            opacity: 0;
            transform: translate3d(0, -50%, 0);
        }
        to {
            opacity: 1;
            transform: translateZ(0);
        }
    }

	/*
		PEOPLUS Squared Indicator

		@find-point: indicator
	*/
	@-webkit-keyframes ppsquared-indicator-cubeAngle {
		0%, 10% {
			-webkit-transform: perspective(140px) rotateX(-180deg);
					transform: perspective(140px) rotateX(-180deg);
			opacity: 0; 
		} 25%, 75% {
			-webkit-transform: perspective(140px) rotateX(0deg);
					transform: perspective(140px) rotateX(0deg);
			opacity: 1; 
		} 90%, 100% {
			-webkit-transform: perspective(140px) rotateY(180deg);
					transform: perspective(140px) rotateY(180deg);
			opacity: 0; 
		}
	}

	@keyframes ppsquared-indicator-cubeAngle {
		0%, 10% {
			-webkit-transform: perspective(140px) rotateX(-180deg);
					transform: perspective(140px) rotateX(-180deg);
			opacity: 0; 
		} 25%, 75% {
			-webkit-transform: perspective(140px) rotateX(0deg);
					transform: perspective(140px) rotateX(0deg);
			opacity: 1; 
		} 90%, 100% {
			-webkit-transform: perspective(140px) rotateY(180deg);
					transform: perspective(140px) rotateY(180deg);
			opacity: 0; 
		}
	}

	.ppsquared-indicator {
		position: fixed;
		margin: 0;
		padding: 0;
		top: 0;
		width: 100%;
		height: 100%;
		color: #FFFFFF;
		background-color: rgba(0,0,0,0.75);
		z-index: 999;
		display: none;
	}

	.ppsquared-indicator > .ppsquared-indicator-wrap {
		margin: 150px auto 0;
		padding: 0;
		width: 100%;
		color: #FFFFFF;
	}

	.ppsquared-indicator > .ppsquared-indicator-wrap > .ppsquared-indicator-cube {
		margin: 20px auto;
		width: 40px;
		height: 40px;
		position: relative;
		-webkit-transform: rotateZ(45deg);
				transform: rotateZ(45deg);
	}

	.ppsquared-indicator > .ppsquared-indicator-wrap > .ppsquared-indicator-cube .type-cube {
		float: left;
		width: 50%;
		height: 50%;
		position: relative;
		-webkit-transform: scale(1.1);
			-ms-transform: scale(1.1);
				transform: scale(1.1); 
	}
	.ppsquared-indicator > .ppsquared-indicator-wrap > .ppsquared-indicator-cube .type-cube:before {
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-color: #FFFFFF;
		-webkit-animation: ppsquared-indicator-cubeAngle 2.4s infinite linear both;
				animation: ppsquared-indicator-cubeAngle 2.4s infinite linear both;
		-webkit-transform-origin: 100% 100%;
			-ms-transform-origin: 100% 100%;
				transform-origin: 100% 100%;
	}
	.ppsquared-indicator > .ppsquared-indicator-wrap > .ppsquared-indicator-cube .type-cube2 {
		-webkit-transform: scale(1.1) rotateZ(90deg);
				transform: scale(1.1) rotateZ(90deg);
	}
	.ppsquared-indicator > .ppsquared-indicator-wrap > .ppsquared-indicator-cube .type-cube3 {
		-webkit-transform: scale(1.1) rotateZ(180deg);
				transform: scale(1.1) rotateZ(180deg);
	}
	.ppsquared-indicator > .ppsquared-indicator-wrap > .ppsquared-indicator-cube .type-cube4 {
		-webkit-transform: scale(1.1) rotateZ(270deg);
				transform: scale(1.1) rotateZ(270deg);
	}
	.ppsquared-indicator > .ppsquared-indicator-wrap > .ppsquared-indicator-cube .type-cube2:before {
		-webkit-animation-delay: 0.3s;
				animation-delay: 0.3s;
	}
	.ppsquared-indicator > .ppsquared-indicator-wrap > .ppsquared-indicator-cube .type-cube3:before {
		-webkit-animation-delay: 0.6s;
				animation-delay: 0.6s;
	}
	.ppsquared-indicator > .ppsquared-indicator-wrap > .ppsquared-indicator-cube .type-cube4:before {
		-webkit-animation-delay: 0.9s;
				animation-delay: 0.9s;
	}

    @-webkit-keyframes ppsquared-indicator-circles {
        from {
            opacity: 0.8;
            transform: scale(1.5);
        }
        to {
            opacity: 0.5;
            transform: scale(1);
        }
    }
    @keyframes ppsquared-indicator-circles {
        from {
            opacity: 0.8;
            transform: scale(1.5);
        }
        to {
            opacity: 0.5;
            transform: scale(1);
        }
    }

    .ppsquared-indicator > .ppsquared-indicator-wrap > .ppsquared-indicator-circles {
        margin: 20px auto;
        width: 100px;
        height: 72px;
		position: relative;

        box-sizing: border-box;
        vertical-align: middle;
        overflow: visible;
    }
    .ppsquared-indicator > .ppsquared-indicator-wrap > .ppsquared-indicator-circles > svg {
        width: 100px;
        height: 72px;

        display: block;
        overflow: visible;
    }
    .ppsquared-indicator > .ppsquared-indicator-wrap > .ppsquared-indicator-circles > svg > * {
        -webkit-animation-name: ppsquared-indicator-circles;
                animation-name: ppsquared-indicator-circles;
        -webkit-animation-duration: 0.8s;
                animation-duration: 0.8s;
		transform: translate3d(0, 0, 0);
		transform-origin: center;
		-webkit-animation-iteration-count: infinite;
				animation-iteration-count: infinite;
    }
    .ppsquared-indicator > .ppsquared-indicator-wrap > .ppsquared-indicator-circles > svg > *:nth-child(1) {
        fill: rgba(88, 143, 249, 0.8);
    }
    .ppsquared-indicator > .ppsquared-indicator-wrap > .ppsquared-indicator-circles > svg > *:nth-child(2) {
        fill: rgba(41, 82, 161, 0.8);
    }
    .ppsquared-indicator > .ppsquared-indicator-wrap > .ppsquared-indicator-circles > svg > *:nth-child(3) {
        fill: rgba(208, 58, 58, 0.8);
    }
    .ppsquared-indicator > .ppsquared-indicator-wrap > .ppsquared-indicator-circles > svg > *:nth-child(4) {
        fill: rgba(124, 198, 35, 0.8);
    }
    .ppsquared-indicator > .ppsquared-indicator-wrap > .ppsquared-indicator-circles > svg > *:nth-child(5) {
        fill: rgba(228, 204, 0, 0.8);
    }

    .ppsquared-indicator > .ppsquared-indicator-wrap > .ppsquared-indicator-circles > svg > *:nth-of-type(1) {
        -webkit-animation-delay: 0.1s;
                animation-delay: 0.1s;
    }
    .ppsquared-indicator > .ppsquared-indicator-wrap > .ppsquared-indicator-circles > svg > *:nth-of-type(2) {
        -webkit-animation-delay: 0.2s;
                animation-delay: 0.2s;
    }
    .ppsquared-indicator > .ppsquared-indicator-wrap > .ppsquared-indicator-circles > svg > *:nth-of-type(3) {
        -webkit-animation-delay: 0.3s;
                animation-delay: 0.3s;
    }
    .ppsquared-indicator > .ppsquared-indicator-wrap > .ppsquared-indicator-circles > svg > *:nth-of-type(4) {
        -webkit-animation-delay: 0.4s;
                animation-delay: 0.4s;
    }
    .ppsquared-indicator > .ppsquared-indicator-wrap > .ppsquared-indicator-circles > svg > *:nth-of-type(5) {
        -webkit-animation-delay: 0.5s;
                animation-delay: 0.5s;
    }

	/*
		PEOPLUS Squared Smoke Effect

		@find-point: smoke_effect
	*/
	.ppsquared-smoke {
		animation: smoke-animate 3s 5s linear 1 forwards;
	}

	@keyframes smoke-animate {
		0% {
			transform: rotate(0deg) translateY(0);
			opacity: 1;
			filter: blur(1px);
		}
		
		100% {
			transform: rotate(45deg) translateY(-250px);
			opacity: 0;
			filter: blur(20px);
		}
		
	}
	.ppsquared-smoke .ppsquared-smoke-first {animation-delay: 3s;}
	.ppsquared-smoke .ppsquared-smoke-second {animation-delay: 6s;}

	/*
		PEOPLUS Squared Fade-In Effect

		@find-point: fadein_effect
	*/
	.ppsquared-fadein {
		animation: fadeIn-with-blur 3s 5s linear 1 forwards;
		opacity: 0;
	}
	.ppsquared-fadein .ppsquared-fadein-first {animation-delay: 3s;}

	/*
		PEOPLUS Squared Effects

		@find-point: effects
	*/
	.filter-blur-origin {
		filter: blur(10px);
		-webkit-filter: blur(10px);
	}
    .filter-blur {
        -webkit-backdrop-filter: blur(10px);
        backdrop-filter: blur(10px);
    }
    .filter-brightness {
        -webkit-backdrop-filter: brightness(1.5);
        backdrop-filter: brightness(1.5);
    }
    .filter-contrast {
        -webkit-backdrop-filter: contrast(.2);
        backdrop-filter: contrast(.2);
    }
    .filter-drop-shadow {
        -webkit-backdrop-filter: drop-shadow(5px 5px red);
        backdrop-filter: drop-shadow(5px 5px red);
    }
    .filter-grayscale {
        -webkit-backdrop-filter: grayscale(.8);
        backdrop-filter: grayscale(.8);
    }
    .filter-hue-rotate {
        -webkit-backdrop-filter: hue-rotate(45deg);
        backdrop-filter: hue-rotate(45deg);
    }
    .filter-invert {
        -webkit-backdrop-filter: invert(1);
        backdrop-filter: invert(1);
    }
    .filter-opacity {
        -webkit-backdrop-filter: opacity(.4);
        backdrop-filter: opacity(.4);
    }
    .filter-saturate {
        -webkit-backdrop-filter: saturate(.3);
        backdrop-filter: saturate(.3);
    }
    .filter-sepia {
        -webkit-backdrop-filter: sepia(.9);
        backdrop-filter: sepia(.9);
    }

	/**
	 * Effects
	 *
	 * References
	 * - https://mrb18.tistory.com/entry/CSS3-animation-%EC%82%AC%EC%9A%A9%ED%95%98%EA%B8%B0
	 */
	@keyframes fadein {from {opacity: 0;} to {opacity: 1;}}
	@-moz-keyframes fadein {from {opacity: 0;} to {opacity: 1;}} /* Firefox */
	@-webkit-keyframes fadein {from {opacity: 0;} to {opacity: 1;}} /* Safari and Chrome */
	@-o-keyframes fadein {from {opacity: 0;} to {opacity: 1;}} /* Opera */

	@keyframes fadeinHalf {from {opacity: 0;} to {opacity: 0.25;}}
	@-moz-keyframes fadeinHalf {from {opacity: 0;} to {opacity: 0.25;}} /* Firefox */
	@-webkit-keyframes fadeinHalf {from {opacity: 0;} to {opacity: 0.25;}} /* Safari and Chrome */
	@-o-keyframes fadeinHalf {from {opacity: 0;} to {opacity: 0.25;}} /* Opera */

	@keyframes fadeinMoveToTop {from {opacity: 0; background-position: 50% 100%;} to {opacity: 1; background-position: 50% 5%;}}
	@-moz-keyframes fadeinMoveToTop {from {opacity: 0; background-position: 50% 100%;} to {opacity: 1; background-position: 50% 5%;}} /* Firefox */
	@-webkit-keyframes fadeinMoveToTop {from {opacity: 0; background-position: 50% 100%;} to {opacity: 1; background-position: 50% 5%;}} /* Safari and Chrome */
	@-o-keyframes fadeinMoveToTop {from {opacity: 0; background-position: 50% 100%;} to {opacity: 1; background-position: 50% 5%;}} /* Opera */

	@keyframes fadeinMoveToBottomMore {from {opacity: 0; background-position: 50% 400%;} to {opacity: 1; background-position: 50% 150%;}}
	@-moz-keyframes fadeinMoveToBottomMore {from {opacity: 0; background-position: 50% 400%;} to {opacity: 1; background-position: 50% 150%;}} /* Firefox */
	@-webkit-keyframes fadeinMoveToBottomMore {from {opacity: 0; background-position: 50% 400%;} to {opacity: 1; background-position: 50% 150%;}} /* Safari and Chrome */
	@-o-keyframes fadeinMoveToBottomMore {from {opacity: 0; background-position: 50% 400%;} to {opacity: 1; background-position: 50% 150%;}} /* Opera */