/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ aicommon.css: Styling throughout the website
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

@import url(https://fonts.googleapis.com/css?family=Righteous);

html { font-size: 12px; }
body { font-family: "Malgun Gothic", sans-serif; color: #292b2c; }
input { color: #292b2c;; }
p { margin: 0.0em }
a:hover, a:active { text-decoration: underline; }
a:focus, div:focus { outline: 0; }
a.ainoline:hover { text-decoration: none; }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ Materialize/FontAwesome Default Style Overriding & New Adding
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.container { margin: 0 auto; width: 95%; max-width: 1110px; }
.row { margin-bottom: 0.5em !important; }
.col { margin-bottom: 0.0em !important; }
.modal { width: 95% !important; max-width: 500px; }
.collapsible { margin: 0.0em !important; }
.datepicker-date-display .date-text { font-size: 2.0em; }
.text-warning { color: #e57373 !important; }

.btn.btn-small { font-size: 0.9em; height: 3.0em; line-height: 3.0em; }

a.btn:hover { text-decoration: none !important;}
a.btn, button.btn { -webkit-box-shadow: none; box-shadow: none; }
a.btn:hover, button.btn:hover { filter: brightness(95%); transition: 0.3s; -webkit-box-shadow: none; box-shadow: none; }
a.btn.defaults, button.btn.defaults { background-color: #ffffff; border: 1px solid #d7d7d7; color: #393b3c; }
a.disabled { opacity: 0.5; pointer-events: none; }

input { height: 2.0em !important; }

.card { margin: 0.0em 0.0em !important; border: 1px solid #dddddd; box-shadow: none; }
.card-header { border-bottom: 1px solid #dedede;}
.card-block  { padding: 0.7em 0.5em; }
.card-footer { border-top: 1px solid #dedede; }

.dropdown-content { padding: 0.5em !important; }
.dropdown-content li { min-height: 1em ; line-height: 1em; }
.dropdown-content li.divider { min-height: 1px !important; margin: 0.5em 0.0em !important; }
.dropdown-content li > a { color: inherit; height: 2.5em; line-height: 2.5em; padding: 0em 2em; }
.dropdown-content li > span { padding: 0.3em 1.0em; }

@media screen and (min-width: 1921px) { .showonxl { display: block; } }
@media screen and (max-width: 1920px) { .showonxl { display: none; } }

.fa-ul { margin-left: 2.0em !important; }
.svg-inline--fa.fa-li { margin-top: 0.2em !important; }

.input-field { margin-bottom: 0.0em !important; }
.input-field>input { margin: 0.0em !important; }
.input-field>label { top: -0.8em; }
.input-field.required label.active { color: #ef5350  !important ; }
.input-field>label:not(.label-icon).active { -webkit-transform: translateY(-0.1em) scale(0.8); transform: translateY(-0.1em) scale(0.8); }
/* .select-wrapper+label { top: -2.5em !important; } */

.pagination .active { background-color: #e0e0e0 !important; }

.tabs { border-bottom: 1px solid #dedede; height: 3em; margin-bottom: 0.5em; }
.tabs .tab { height: 3em; line-height: 3em; flex-grow: 0; }
.tabs .tab a { padding: 0.0em 1.5em; }
.tabs .tab a.active { background-color: rgba(246,178,181,0.2); }

.checkbox { margin-top: 1.0em; }
.checkbox input[type="checkbox"]+span:not(.lever) { padding-left: 1.7em; }
.checkbox input[type="checkbox"]+span:not(.lever):before { width: 14px; height: 15px; top: 2px; }
.checkbox input[type="checkbox"]:checked+span:not(.lever):before { width: 10px; height: 16px; top: 0px; }

.progress { height: 1em; }

.fr-popup .fr-input-line input[type=text], .fr-popup .fr-input-line textarea { font-size: inherit; }
.fr-popup .fr-action-buttons button.fr-command { font-size: inherit; }

.fr-view ul { list-style-type: disc !important; padding: 0 0 0 1.8em !important }
.fr-view ul li { list-style-type: disc !important }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ Global  Styles for 마이호주
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.ainavbar { height: 40px; padding: 0.5em; }
.aibrands { font-family: Righteous, cursive; }
.ailnkblk { color: inherit; }
.aidotted { border-bottom: dotted 1px grey; }
.airadius { border-radius: 50%; }
.aicenter { margin: 0 auto; }
/*.ailabels { display: inline-block; width: 5.0em; }*/
.aicolons { display: inline-block; width: 1.0em; text-align: center; }
.aligntop { display: inline-block; vertical-align: top; }
.alignbtm { display: inline-block; vertical-align: bottom; }
.airplane { height: 16px; vertical-align: bottom; }
.postfixs { margin-top: 1.0em; line-height: 2.0em; padding: 0.0em 1.0em; white-space: nowrap; background-color: #e0e0e0; border-bottom: 1px solid #9e9e9e; }
.boldtext { font-weight: bold; }

.ainavbar .menubars { display: block; font-size: 18px; line-height: 18px; color: #fff; margin: 11px 0px; }
.ainavbar a.ailogokr { display: block; font-size: 18px; line-height: 18px; font-weight: bold; color: #fff; margin: 11px 6px; }
.ainavbar a.ailogokr:hover { text-decoration: none; }

.fasize08 { font-size: 0.8em; }
.fasize10 { font-size: 1.0em; }
.fasize11 { font-size: 1.1em; }
.fasize12 { font-size: 1.2em; }
.fasize13 { font-size: 1.3em; }
.fasize15 { font-size: 1.5em; }
.fasize16 { font-size: 1.6em; }
.fasize17 { font-size: 1.7em; }
.fasize18 { font-size: 1.8em; }
.fasize20 { font-size: 2.0em; }
.fasize24 { font-size: 2.4em; }
.fasize25 { font-size: 2.5em; }

.lineht17 { height: 1.7em; line-height: 1.7em; }
.lineht18 { height: 1.8em; line-height: 1.8em; }
.lineht20 { height: 2.0em; line-height: 2.0em; }

.collapse { display: none !important; }
.hideflow { overflow: hidden; }
.textmute { color: #a9a9a9 !important; }
.relative { position: relative; }
.image100 { display: block; height: 100%; max-width: 100%; max-height: 100%; }
.imagefit { display: block; min-width: 1px; min-height: 1px; max-width: 100%; max-height: 100%; }

.bordered { border: 1px solid #dddddd; }
.noshadow { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; }
.statbars { position: absolute; opacity: 0.8; width: 100%; left: 0; bottom: 0; }

.aibadges { display: inline-block; width: 45px; font-size: 0.8em; border-radius: 3px; text-align: center;}
.norbadge { background-color: #757575; color: #ffffff !important; border: 1px solid #9e9e9e; }
.ambbadge { background-color: #ffb300; color: #ffffff !important; border: 1px solid #ffb300; font-weight: bold; }
.redbadge { background-color: #d9534f; color: #ffffff !important; border: 1px solid #d9534f; font-weight: bold; }
.grnbadge { background-color: #5cb85c; color: #ffffff !important; border: 1px solid #43a047; font-weight: bold; }
.dblbadge { background-color: #2a2c7b; color: #ffffff !important; border: 1px solid #2a2c7b; font-weight: bold; }
.revbadge { background-color: #ffffff; color: #616161 !important; border: 1px solid #9e9e9e; }

.toolicon { padding: 0.0em 0.2em; }
.toolicon:link, .toolicon:visited { color: grey; text-decoration: none;}
.toolicon:hover, toolicon:active { color: orange; text-decoration: none;}
.toolicon.active { color: #ff8c00; }

.toolicon-info:link, .toolicon-info:visited { color: #64b5f6 !important; transition: 0.3s; }
.toolicon-dang:link, .toolicon-dang:visited { color: #e57373 !important; transition: 0.3s; }
.toolicon-info:hover, .toolicon-info:active { color: #1976d2 !important; transition: 0.3s; }
.toolicon-dang:hover, .toolicon-dang:active { color: #f44336 !important; transition: 0.3s; }

.toolicon-rect { width: 40px !important; border-radius: 5px; text-decoration: none !important; }

*[data-linkhref], *[data-openhref] { cursor: pointer; }
*[data-linkhref]:hover, *[data-openhref]:hover { background-color: #fafafa; }

#btKakaoL { color: #393b3c; background-color: #fee934; }
#btKakaoL img { display: inline-block; height: 2em; vertical-align: middle; }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ Top / Navigation Bar Menu Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.mytopbar .itemwrap .itemlogo { height: 100%; }
.mytopbar .itemwrap .itemsrch { height: 100%; max-width: 450px; }

@media screen and (max-width: 600px) {
    .mytopbar { padding: 1.4em 0.0em 0.2em 0.0em; }
    .mytopbar .itemwrap { height: 35px; }
    .mytopbar .itemlogo { margin-right: 1.0em; }
    .mytopbar .itemwrap .itemsrch { padding: 0.0em 0.0em; }
    .mytopbar .itemwrap .itemsrch input { font-size: 1.2em; }
    .mytopbar .itemwrap .itemsrch .btsearch { font-size: 1.5em; }
}
@media screen and (min-width: 601px) and (max-width: 992px) {
    .mytopbar { padding: 1.4em 0.0em 1.0em 0.0em; } /*{ padding: 1.4em 0.0em 1.4em 0.0em; }*/
    .mytopbar .itemwrap { height: 50px; }
    .mytopbar .itemlogo { margin-right: 2.0em; }
    .mytopbar .itemwrap .itemsrch { padding: 0.5em 0.0em; }
    .mytopbar .itemwrap .itemsrch input { font-size: 1.4em; }
    .mytopbar .itemwrap .itemsrch .btsearch { font-size: 2.0em; }
}
@media screen and (min-width: 993px) {
    .mytopbar { padding: 2.8em 0.0em 1.6em 0.0em; } /*{ padding: 2.8em 0.0em 2.8em 0.0em; }*/
    .mytopbar .itemwrap { height: 55px; }
    .mytopbar .itemlogo { margin-right: 2.0em; }
    .mytopbar .itemwrap .itemsrch { padding: 0.8em 0.0em; }
    .mytopbar .itemwrap .itemsrch input { font-size: 1.4em; }
    .mytopbar .itemwrap .itemsrch .btsearch { font-size: 2.0em; }
}

.mynavbar .fixitems { font-size: 13px; font-weight: bold; height: 40px; background-color: #0a0c6b; }
.mynavbar .fixitems a { display: inline-block; color: #fff; padding: 0.5em 1.0em; }
.mynavbar .fixitems a:hover { text-decoration: none; }

.mynavbar .navitems { overflow: auto; white-space: nowrap; font-size: 13px; font-weight: bold; height: 40px; background-color: #2a2c7b; }
.mynavbar .navitems a { display: inline-block; color: white; padding: 0.5em 1.0em; }
.mynavbar .navitems a:not(:last-child) { border-right: 1px solid #515693; }
.mynavbar .navitems a:hover { text-decoration: none; border-top: 3px solid #2b2f79; border-bottom: 3px solid #d72342; }
.mynavbar .navitems a.active { text-decoration: none; border-top: 3px solid #2b2f79; border-bottom: 3px solid #d72342; }

/* Hide scrollbar for Chrome, Safari and Opera */
.mynavbar .navitems::-webkit-scrollbar { display: none; }
.mynavbar .navitems { -ms-overflow-style: none; }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ Main Menu Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

#mainmenu.sidenav .circle { margin: 0 auto; width: 100px; height: 100px; }
#mainmenu.sidenav>li>a { height: 2.8em; line-height: 2.8em; color: #37474f; }
#mainmenu.sidenav #gdomSideQuit { position: absolute; top: 1.0em; right: 1.0em; color: #616161; }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ 통합검색 Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

/*
form#gdomGlobalSQ input { color: #ffffff; font-size: 15px; font-weight: bold; text-align: center; border-bottom: none; height: 23px !important; line-height: 15px; padding: 5px 0px; }

form#gdomGlobalSQ.takeaway { border-bottom: 1px solid #2a2c7b ; transition: 0.3s; }
form#gdomGlobalSQ.takeaway input { width: 0px; transition: 0.3s; }

form#gdomGlobalSQ.activate { background-color: #404386; border-bottom: 1px solid #ffffff; transition: 0.3s; }
@media screen and (min-width: 1201px) { form#gdomGlobalSQ.activate input { width: 250px; transition: 0.3s; } }
@media screen and (max-width: 1200px) { form#gdomGlobalSQ.activate input { width: 150px; transition: 0.3s;  } }
*/

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ Modal WIndow Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.modal .modalbox-head { background-color: #f0f0f0; padding: 0.6em; border-bottom: 1px solid #e0e0e0; }
.modal .modalbox-body { padding: 1.5em; }
.modal .modalbox-foot { padding: 0.3em; border-top: 1px solid #e0e0e0; text-align: right; }
.modalbox-head .closebox { float: right; font-size: 1.5em; font-weight: bold; color: #7f7f7f; cursor: pointer; margin: -0.4em 0.5em 0em 0.5em; }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ Carousel/JSSlick Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.slick-dotted.slick-slider { margin-bottom: 0.0em !important; }
.slick-prev { left: 0px; }
.slick-next { right: 0px; }
.slick-dots { bottom: 0.5em; }
.slick-dots li { margin: 0.0em; }

@media screen and (max-width: 600px) { .jsslider img { max-height: 100px; } }
@media screen and (min-width: 601px) { .jsslider img { max-height: 130px; } }

.jsslider img { max-width: 100%; margin: 0 auto; }
.jsslider .jsimages { display: none; }
.jsslider .jsimages:first-child { display: block; }
.jsslider.slick-initialized .jsimages { display: block !important; }
.jsslider .slick-prev, .jsslider .slick-next { z-index: 10; }
.jsslider .slick-prev::before, .jsslider .slick-next::before { color: #01579b; }
.jsslider .jstitles { position: absolute; width: 100%; bottom: 0.3em; left: 0px; }
.jsslider .jstitles span { display: inline-block; padding: 0.3em 1.0em; border-radius: 2px; background-color: black; opacity: 0.7; color: white; }
.jsslider .slick-dots { bottom: 0.0em; }

.cbslicks .slick-dots { bottom: -2.0em; }
.fbslicks .slick-dots { bottom: -2.0em; }
.rbslicks .slick-dots { bottom: -2.0em; }
.hbslicks .slick-dots { bottom: -2.0em; }
.sbslicks .slick-dots { bottom: -2.0em; }
.pbslicks .slick-dots { bottom: -2.0em; }
.jnslicks .slick-dots { bottom: -2.0em; }
.ybslicks .slick-dots { bottom: -2.0em; }

/* ImagesAD Styling */
.iaslicks .slick-arrow { z-index: 100; }
.iaslicks .slick-next:before, .iaslicks .slick-prev:before { color: #4682b4; }
.iaslicks .repimage { height: 160px; background-size: cover !important; border-right: 2px solid #fff; border-left: 2px solid #fff; }

@media screen and (min-width: 1201px) { .iaslicks .repimage img { width: 100%; height: 180px; object-fit: cover; } }
@media screen and (min-width:  993px) { .iaslicks .repimage img { width: 100%; height: 180px; object-fit: cover; } }
@media screen and (min-width:  601px) { .iaslicks .repimage img { width: 100%; height: 180px; object-fit: cover; } }
@media screen and (max-width:  600px) { .iaslicks .repimage img { width: 100%; height: 150px; object-fit: cover; } }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ Vertiser Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.vertiser { text-align: center; }

@media screen and (min-width:  601px) { .vertiser img { height: auto; max-width: 100%; max-height: 130px; vertical-align: bottom } }
@media screen and (max-width:  600px) { .vertiser img { height: auto; max-width: 100%; max-height: 100px; vertical-align: bottom } }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ Breadcrumbs Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.aibcrumb { display: inline-block; overflow: hidden; }
.aibcrumb ul { display: -webkit-flex; display: -ms-flexbox; display: flex; list-style: none; margin: 0; padding: 0; }
.aibcrumb ul li { margin: 0; background-color: #93c47d; transition: 0.3s; }
.aibcrumb ul li:first-child a { margin-left: 0; }
.aibcrumb ul li:last-child { border-radius: 0 100px 100px 0; }
.aibcrumb ul li:last-child a { padding-right: 30px; /* pointer-events: none; */}
.aibcrumb ul li:last-child a:before { display: none; }
.aibcrumb ul li:hover { background-color: #84bc6b; }
.aibcrumb ul li:hover a { color: #ffffff; }
.aibcrumb ul li:hover a:before { background-color: #84bc6b; }
.aibcrumb ul li.active { background-color: #e8f5e9; border-right: 1px solid #d3d3d3; }
.aibcrumb ul li.active a { color: #94c380; }
.aibcrumb ul li.active a:before { background-color: #eef5ff; }
.aibcrumb ul li a { position: relative; box-sizing: border-box; display: inline-block; min-height: 100%; font-weight: 600; padding: 0.6em 0 0.6em 10px; margin-left: 30px; color: #ffffff; text-decoration: none; transition: 0.3s; }
.aibcrumb ul li a:before { content: ""; position: absolute; left: 100%; top: 0; width: 30px; height: 100%; background-color: #93c47d; border-radius: 0 100px 100px 0; box-shadow: 3px 0 3px rgba(0, 0, 0, 0.2); transition: 0.3s; }
.aibcrumb ul li a:hover { text-decoration: none; }
.aibcrumb ul li a i { -webkit-transform: scale(1.4); -ms-transform: scale(1.4); transform: scale(1.4); }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ AISelect (ddslick) / Sweet Dropdown Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.aiselect { position: relative; margin-top: 1.0em; }
.aiselect select { display: none; }
.aiselect .dd-select { border: none !important; font-weight: normal; }
.aiselect .dd-selected-text { color: rgba(0, 0, 0, 0.87); font-weight: normal !important; height: 2.0em; line-height: 2.0em; }
.aiselect .dd-select a { background-color: #ffffff; text-decoration: none; border: none; border-bottom: 1px solid #9e9e9e; padding: 0.0em; }
.aiselect .dd-selected-description { margin-bottom: 0.2em; }
.aiselect .dd-options li.dd-dividers { height: 1px; margin: 0.3em 1.0em; background-color: #e0e0e0; }
.aiselect .dd-option { border: none !important; padding: 0.5em 1.0em !important; text-decoration: none; }
.aiselect .ailabels { position: absolute; font-size: 0.8em; top: -1.3em; color: rgba(0, 0, 0, 0.42); }
.aiselect.required .ailabels { color: #ef5350; }

.aiselect.addspace a.dd-selected { padding-left: 1.0em; } /* for AISelect located in Post */
.aiselect .dd-container.invalid a.dd-selected { border-bottom: 1px solid #f1453d; }
.aiselect .dd-container.disabled { pointer-events: none; }
.aiselect .dd-container.disabled .dd-selected-text { color: rgba(0, 0, 0, 0.42); }
.aiselect .dd-container.disabled .dd-pointer { opacity: 0.5; }
.aiselect .dd-container.disabled a.dd-selected { color: rgba(0, 0, 0, 0.42); border-bottom: 1px dotted rgba(0, 0, 0, 0.42); pointer-events: none; }

.aiselect .dd-options li.disabled { pointer-events: none; }
.aiselect .dd-options li.disabled .dd-option { color: rgba(0, 0, 0, 0.42); }

.dropdown-menu ul li { margin: 0; padding: 0; height: 2.5em; line-height: 2.5em; }
.dropdown-menu ul li>a { margin: 0; padding: 0 2em; height: 2.5em; line-height: 2.5em;  }
.dropdown-menu ul li>a:not(.grey):hover, .dropdown-menu ul li>a:hover { background-color: #0277bd; color: white; }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ Table Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

td { padding: 0.7em !important; }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ Search Query Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.searchsq .input-field { display: table; }
.searchsq .input-field input[name="sq"] { text-align: center; font-weight: bold; font-size: 1.1em; color: #f06292; }
.searchsq .input-field .suffix { display: table-cell; width: 1%; }
.searchsq .input-field .suffix button { padding: 0em 0.5em; height: 2em; line-height: 2em; }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ AISearch Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

#searchAI a.dd-selected { border-bottom: 1px solid #bdbdbd; }
#searchAI label.dd-selected-text, #searchAI label.dd-option-text { color: #616161; }
#searchAI #sqCaster { border-bottom: 1px solid #bdbdbd; }
#searchAI #sqCaster.invalid { border-bottom: 1px solid #F44336; }

.aisearch .toptitle { background-color: #9e9e9e; color: #ffffff; }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ Event Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.aievents .eventlog .badge { position: absolute; top: 0.5em; left: 50%; transform: translateX(-50%); width: 90%; opacity: 0.9; text-align: center; }
.aievents .eventlog .editicon { position: absolute; right: 0px; bottom: 0px; }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ Portfolio Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

@media screen and (max-width: 600px) { .portfolio .foliolog { height: 120px; } }
@media screen and (min-width: 601px) and (max-width: 992px) { .portfolio .foliolog { height: 200px; } }
@media screen and (min-width: 993px) { .portfolio .foliolog { height: 200px; } }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ Bookmark/Entities/TakeAway/AISchool/MyScraps Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.bookmark .repimage { width: 120px; height: 90px; text-align: center; border: 1px solid #ddd; padding: 0.2em; margin-right: 1.0em; }
.bookmark .repimage img { max-width: 100%; max-height: 100%; }
.bookmark .dropdown-content li>a { padding: 0em !important; height: 2em !important; line-height: 2em !important; text-decoration: none; }
.bookmark .dropdown-content li>span { padding: 0em; color: inherit; }
.bookmark .usermemo { border: 1px solid #a9a9a9; height: 4em; overflow-y: auto; background-color: #fafafa; }
.bookmark .childinf a { color: inherit; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}

.entities .repimage { text-align: center; border: 1px solid #ddd; padding: 0.2em; margin-right: 1.0em; }
.entities .repimage img { max-width: 100%; max-height: 100%; }
.entities .dropdown-content li>a { padding: 0em !important; height: 2em !important; line-height: 2em !important; text-decoration: none; }
.entities .dropdown-content li>span { padding: 0em; color: inherit; }
.entities .usermemo { border: 1px solid #a9a9a9; height: 4em; overflow-y: auto; background-color: #fafafa; }
.entities .childinf a { color: inherit; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}

@media screen and (max-width: 767px) { .entities .repimage { width:  9.0em; height: 8.0em; margin-right: 0.5em; } }
@media screen and (min-width: 768px) { .entities .repimage { width: 11.0em; height: 8.0em; margin-right: 1.0em; } }

.entlists .topgroup { padding: 0.7em; margin-bottom: 0.5em; color: #ffb300; background-color: #fff8e1; }
.entlists .subgroup { padding: 0.7em; margin-bottom: 0.5em; background-color: #f5f5f5;}
.entlists .bizitems { padding: 0.5em; margin-bottom: 0.5em; border-bottom: 1px dotted #bdbdbd; }
.entlists .bizitems a { color: #424242 ; }
.entlists .nonitems { padding: 0.7em; margin-bottom: 0.5em; color: #757575; }

div[data-ldomstat="ldomStatETET"] { position: absolute; width: 100%; bottom: 8px; left: 0px; opacity: 0.7; }
div[data-ldomstat="ldomStatETEI"] { position: absolute; width: 100%; bottom: 8px; left: 0px; opacity: 0.7; }
div[data-ldomstat="ldomStatAIFR"] { position: absolute; width: 100%; bottom: 0px; left: 0px; opacity: 0.7; z-index: 10 }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ News Stand Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.newstand .newsitem { display: inline-block; height: auto; }
.newstand .newsitem img { border: 1px solid #000; box-shadow: 5px -3px 5px lightgrey; }
.newstand .newsitem .editicon { position: absolute; top: 0px; right: 0px; }
.newstand .newsitem .reptitle { position: absolute; color: #fff; background-color: #2f4f4f; left: 0px; bottom: 0px; width: 100%; padding: 0.3em 0.0em; opacity: 0.9; }
.newstand .shelfimg { text-align: center; }
.newstand .shelfimg img { display: block; width: 100%; max-width: 836px; z-index: -1; }

@media screen and (max-width: 600px) {
    .newstand .topspace { padding: 0.5em; }
    .newstand .newsitem { width:  120px; margin: 0.0em 0.3em; bottom: -0.5em; }
}

@media screen and (min-width: 601px) and (max-width: 992px) {
    .newstand .topspace { padding: 0.5em; }
    .newstand .newsitem { width: 200px; margin: 0.0em 0.7em; bottom: -0.5em; }
}

@media screen and (min-width: 993px) {
    .newstand .topspace { padding: 1.0em; }
    .newstand .newsitem { width: 200px; margin: 0.0em 1.5em; bottom: -1.0em; }
}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ Common Articles Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

div.announce { height: 0.25em; background-color: #d3d3d3; }
div.cmboard1, div.fmboard1, div.hrboard1, div.pcboard1, div.ytboard1 { height: 0.25em; background-color: #5ECDDE; }
div.cmboard2, div.fmboard2, div.hrboard2, div.pcboard2, div.ytboard2 { height: 0.25em; background-color: #D595AA; }
div.cmboard3, div.fmboard3, div.hrboard3, div.pcboard3, div.ytboard3 { height: 0.25em; background-color: #FFE00E; }

.aitdhead { position: relative; padding: 0.0em; }
.aitdcell { position: relative; border-bottom: 1px solid #eaeaea; }
.aitdtail { position: relative; border-bottom: none; }
.altitles { border-top: 1px solid #d3d3d3; border-bottom: 1px solid #d3d3d3; background-color: #f7f7f7; padding: 0.8em; }

.articles .usrpicsm { width: 70px; height: 50px; }
.articles .reppicsm { width: 70px; height: 50px; }
.articles .insertts { color: #9e9e9e; }
.articles .pricetag { position: absolute; width: 100%; bottom: 0; left: 0; background-color: #000000; color: #ffffff; opacity: 0.6; }
.articles .usrpicsm .socicon2 { width: 50px; height: 50px; line-height: 40px; font-size: 1.5em; border: 4px solid #f1f1f1; margin: 0 auto; color: #ffffff; text-align: center; }

.comments .usrpicsm { width: 40px; height: 40px; }
.comments .insertts { color: #9e9e9e; }
.comments .btn { height: 2.5em; line-height: 2.5em; font-size: 0.7em; }

.aifields { margin: 0px !important; }
.aifields .col { display: flex; padding: 0px; }
.aifields .aitdleft { float: left; width: 10em; text-align: center; margin-bottom: 0.2em; padding: 0.5em; background-color: #f7f7f7; border-bottom: 1px solid #e0e0e0;}
.aifields .aitdcont { flex-grow: 1; margin-bottom: 0.2em; padding: 0.5em; border-bottom: 1px solid #e0e0e0; }

/* Styling for Social Website Share Link */
#gdomAISLinks a { display: inline-block; border-radius: 50%; width: 35px; height: 35px; line-height: 35px; vertical-align: top; font-size: 1.5em; text-align: center; }
#gdomAISLinks #gdomAISLinkF { background: #3B5998; color: white; }
#gdomAISLinks #gdomAISLinkT { background: #55ACEE; color: white; }
#gdomAISLinks #gdomAISLinkG { background: #dd4b39; color: white; }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ MainPage Articles Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

/* Materializecss Tabs Overriding */
/*
.mainpage .tabs .tab a.active { color: #585858; background-color: #f2f2f2; }
.mainpage .tabs .tab a { color: #585858; background-color: #fafafa; }
.mainpage .tabs .tab a:hover { color:#585858; }
.mainpage .tabs .tab .a:focus { background-color: #e6e6e6; }
.mainpage .tabs .tab a:focus.active { color:#585858; background-color: #e6e6e6; }
.mainpage .tabs .indicator { background-color: #848484; }
*/

.mainpage .tabs .tab { margin: 0 2px 0 0;}
.mainpage .tabs .tab a.active { color: #ffffff; background-color: #d52746; }
.mainpage .tabs .tab a { color: #585858; background-color: #f0f0f0; }
.mainpage .tabs .tab a:hover { color:#585858; text-decoration: none; }
.mainpage .tabs .tab .a:focus { color: #ffffff; background-color: #d52746; }
.mainpage .tabs .tab a:focus.active { color:#ffffff; background-color: #d52746; }
.mainpage .tabs .tab a.active:hover { color:#ffffff; background-color: #d52746; }
.mainpage .tabs .indicator { background-color: #f2a466; }

.mainpage .repimage { width: 6.0em; height: 5.3em; margin: 0.2em 0.0em; }
.mainpage .repimage a { width: inherit; height: inherit; }
.mainpage #ldomTitleStr { position: absolute; height: 100%; background-color: #fafafa; border-bottom: none; right: 0; top: 0; }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ AISearch Articles Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.aisearch .articles .repimage { text-align: center; border: 1px solid #ddd; padding: 0.2em; margin-right: 1.0em; overflow: hidden; }
.aisearch .articles .subjects { padding: 0.5em; margin-bottom: 0.5em; background-color: #f5f5f5; }
.aisearch .articles .category { color: #5f9ea0; }

@media screen and (max-width: 767px) { .aisearch .articles .repimage { width:  9.0em; height: 6.0em; } }
@media screen and (min-width: 768px) { .aisearch .articles .repimage { width: 11.0em; height: 6.0em; } }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ Journals Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

/* Mainpage Journals Styling */
.journals .provname { position: absolute; right: 0px; bottom: 0px; }
.journals .provname span { color: #fff; background-color: #ffc400; }

.journals .provider .reptitle { display: inline-block; padding: 0.2em 1em; border: 1px solid #ffc400; color: #ffc400; font-weight: 700; }
.journals .provider .repimage { text-align: center; border-right: 1px solid #ddd; padding: 0.5em; margin-right: 1.0em; overflow: hidden; }
.journals .articles .repimage { text-align: center; border: 1px solid #ddd; padding: 0.2em; margin-right: 1.0em; overflow: hidden; }
.journals .articles .subjects { padding: 0.5em; margin-bottom: 0.5em; color:#000000; background-color: #f5f5f5; }
.journals .articles .striptag { height: 3.0em; overflow: hidden; color: #777777; }

@media screen and (max-width: 767px) {
    .journals .provider .repimage { width:  9.0em; height: 7.5em; }
    .journals .articles .repimage { width:  9.0em; height: 7.5em; }
}

@media screen and (min-width: 768px) {
    .journals .provider .repimage { width: 11.0em; height: 7.5em; }
    .journals .articles .repimage { width: 11.0em; height: 7.5em; }
}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ PCBoards Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

/* Mainpage PCBoards Styling */
.pcboards .provname { position: absolute; right: 0px; bottom: 0px; }
.pcboards .provname span { color: #fff; background-color: #aed581; }

.pcboards .provider .reptitle { display: inline-block; padding: 0.2em 1em; border: 1px solid #aed581; color: #aed581; font-weight: 700; }
.pcboards .provider .repimage { text-align: center; border-right: 1px solid #ddd; padding: 0.5em; margin-right: 1.0em; overflow: hidden; }
.pcboards .articles .repimage { text-align: center; border: 1px solid #ddd; padding: 0.2em; margin-right: 1.0em; overflow: hidden; }
.pcboards .articles .subjects { padding: 0.5em; margin-bottom: 0.5em; color:#000000; background-color: #f5f5f5; }
.pcboards .articles .striptag { height: 3.0em; overflow: hidden; color: #777777; }

@media screen and (max-width: 767px) {
    .pcboards .provider .repimage { width:  9.0em; height: 7.5em; }
    .pcboards .articles .repimage { width:  9.0em; height: 7.5em; }
}

@media screen and (min-width: 768px) {
    .pcboards .provider .repimage { width: 11.0em; height: 7.5em; }
    .pcboards .articles .repimage { width: 11.0em; height: 7.5em; }
}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ PodCasts Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.podcasts .provider .reptitle { display: inline-block; padding: 0.2em 1em; border: 1px solid #afd8e5; color: #5f9ea0; font-weight: 700; }
.podcasts .provider .repimage { text-align: center; border-right: 1px solid #ddd; padding: 0.5em; margin-right: 1.0em; overflow: hidden; }
.podcasts .articles .repimage { text-align: center; border-right: 1px solid #ddd; padding: 0.2em; margin-right: 1.0em; overflow: hidden; }
.podcasts .articles .subjects { padding: 0.5em; margin-bottom: 0.5em; background-color: #f5f5f5; }
.podcasts .articles .striptag { height: 3.0em; overflow: hidden; color: #777777; }

@media screen and (max-width: 767px) {
    .podcasts .provider .repimage { width:  9.0em; height: 7.5em; }
    .podcasts .articles .repimage { width:  5.0em; height: 4.0em; }
}

@media screen and (min-width: 768px) {
    .podcasts .provider .repimage { width: 11.0em; height: 7.5em; }
    .podcasts .articles .repimage { width:  7.0em; height: 4.0em; }
}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ YouTuber Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

/* Mainpage YouTuber Styling */
.youtuber .provname { position: absolute; right: 0px; bottom: 0px; }
.youtuber .provname span { color: #fff; background-color: #e57373; }

.youtuber .provider .reptitle { display: inline-block; padding: 0.2em 1em; border: 1px solid #ef9a9a; color: #e57373; font-weight: 700; }
.youtuber .provider .repimage { text-align: center; border-right: 1px solid #ddd; padding: 0.5em; margin-right: 1.0em; overflow: hidden; }
.youtuber .articles .repimage { text-align: center; border: 1px solid #ddd; padding: 0.2em; margin-right: 1.0em; overflow: hidden; }
.youtuber .articles .subjects { padding: 0.5em; margin-bottom: 0.5em; color:#000000; background-color: #f5f5f5; }
.youtuber .articles .striptag { height: 3.0em; overflow: hidden; color: #777777; }

@media screen and (max-width: 767px) {
    .youtuber .provider .repimage { width:  9.0em; height: 7.5em; }
    .youtuber .articles .repimage { width:  9.0em; height: 7.5em; }
}

@media screen and (min-width: 768px) {
    .youtuber .provider .repimage { width: 11.0em; height: 7.5em; }
    .youtuber .articles .repimage { width: 11.0em; height: 7.5em; }
}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ REBoards Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.reboards .provider .reptitle { display: inline-block; padding: 0.2em 1em; border: 1px solid #ef9a9a; color: #e57373; font-weight: 700; }
.reboards .provider .repimage { text-align: center; border-right: 1px solid #ddd; padding: 0.5em; margin-right: 1.0em; overflow: hidden; }
.reboards .articles .repimage { text-align: center; border: 1px solid #ddd; padding: 0.2em; margin-right: 1.0em; overflow: hidden; }
.reboards .articles .subjects { padding: 0.5em; margin-bottom: 0.5em; color:#000000; background-color: #f5f5f5; }
.reboards .articles .striptag { height: 3.0em; overflow: hidden; color: #777777; }

@media screen and (max-width: 767px) {
    .reboards .provider .repimage { width:  9.0em; height: 7.5em; }
    .reboards .articles .repimage { width:  9.0em; height: 7.5em; }
}

@media screen and (min-width: 768px) {
    .reboards .provider .repimage { width: 11.0em; height: 7.5em; }
    .reboards .articles .repimage { width: 11.0em; height: 7.5em; }
}

.reboards .aitdcell { border-bottom: 1px solid #c0c0c0; }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ FMBoards Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.fmboards .articles .repimage { text-align: center; border: 1px solid #ddd; padding: 0.2em; margin-right: 1.0em; }
.fmboards .articles .repimage img { height: 5.0em; }
.fmboards .articles .subjects { padding: 0.5em; margin-bottom: 0.5em; background-color: #f5f5f5; font-weight: bold; }

@media screen and (max-width: 767px) { .fmboards .articles .repimage { width:  7.5em; height: 7.5em; } }
@media screen and (min-width: 768px) { .fmboards .articles .repimage { width: 11.0em; height: 7.5em; } }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ REBoards Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.reboards .articles .repimage { text-align: center; border: 1px solid #ddd; padding: 0.2em; margin-right: 1.0em; }
.reboards .articles .repimage img { height: 5.0em; }
.reboards .articles .subjects { padding: 0.5em; margin-bottom: 0.5em; background-color: #f5f5f5; font-weight: bold; }

@media screen and (max-width: 767px) { .reboards .articles .repimage { width:  7.5em; height: 7.5em; } }
@media screen and (min-width: 768px) { .reboards .articles .repimage { width: 11.0em; height: 7.5em; } }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ HRBoards Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.hrboards .articles .repimage { text-align: center; border: 1px solid #ddd; padding: 0.2em; margin-right: 1.0em; }
.hrboards .articles .repimage img { height: 5.0em; }
.hrboards .articles .subjects { padding: 0.5em; margin-bottom: 0.5em; background-color: #f5f5f5; font-weight: bold; }

@media screen and (max-width: 767px) { .hrboards .articles .repimage { width:  7.5em; height: 7.5em; } }
@media screen and (min-width: 768px) { .hrboards .articles .repimage { width: 11.0em; height: 7.5em; } }


/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ ImagesAD Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.imagesad .articles .repimage { text-align: center; border: 1px solid #ddd; }
.imagesad .articles .usrpicsm { width: 60px; height: 50px; }

@media screen and (max-width: 767px) { .imagesad .articles .repimage { width:  6.5em; height: 5.0em; margin-right: 0.5em; } }
@media screen and (min-width: 768px) { .imagesad .articles .repimage { width: 11.0em; height: 5.0em; margin-right: 1.0em; } }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ 내관심글 / 내가쓴글 Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.myscraps .articles .repimage { text-align: center; border: 1px solid #ddd; padding: 0.2em; margin-right: 1.0em; overflow: hidden; }
.myscraps .articles .subjects { padding: 0.5em; margin-bottom: 0.5em; background-color: #f5f5f5; }
.myscraps .articles .category { color: #5f9ea0; }

@media screen and (max-width: 767px) { .myscraps .articles .repimage { width:  9.0em; height: 6.0em; } }
@media screen and (min-width: 768px) { .myscraps .articles .repimage { width: 11.0em; height: 6.0em; } }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ AILogins Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

@media screen and (max-width: 600px) { .socialid { border: none; } } /*-top: 1px solid #D7D7D7; padding-left: 2.0em; } }*/
@media screen and (min-width: 601px) { .socialid { border-left: 1px solid #D7D7D7; padding-left: 2.0em; } }

.socialid div { max-width: 300px; margin: 0.8em auto; }
.socialid div[id^="oauthid"] { height: 40px; opacity: 0.8; cursor: pointer; }
.socialid img { margin-right: 0.5em; padding: 0.5em; width: 40px; border-right: 1px solid #D7D7D7; }

.socialid .oauthidN { background-color: #1DC800; padding: 0.3em; }
.socialid .oauthidK { background-color: #FFEB00; padding: 0.3em; }
.socialid .oauthidG { background-color: #DA4B38; padding: 0.3em; }
.socialid .oauthidF { background-color: #3E59A5; padding: 0.3em; }
.socialid .oauthidA { background-color: #FFFFFF; padding: 0.3em; }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ AISchool Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.commlink { position: absolute; bottom: 0.5em; right: 0.5em; }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ AISocial Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.isfriend { color: red !important; }
.aifemale { background-color: #fffafb; }
.aihemale { background-color: #eff9fc; }
.ainobody { background-color: #ffffff; }
.aiimg15p { width: 15px; height: 15px; }
.aiimg42p { width: 42px; height: 42px; }
.aicursor { cursor: pointer; }

.aidialog { position: absolute; border: 1px solid #dadada; background-color: #fff; top: -1000px; left: 0px; width: 400px; max-width: calc(100% - 8px); z-index: 100; opacity: 0; }
.aislider { position: absolute; overflow-y: auto; width: 300px; max-width: 100%; height: 100%; opacity: 0; z-index: 110; border: 1px solid #ddd; background-color: #fff; }
.aimsgimg { width: 100%; height: 100%; max-width: 200px; max-height: 100%; }

*[data-sethover] { cursor: pointer; }
*[data-sethover]:hover { background-color: #fafafa; }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ Sitemaps Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.sitemaps .col { margin-left: 0 !important; }
.sitemapt { padding: 0.5em 0.0em 0.5em 1.5em; color: #406da2; border-top: 1px solid #406da2; border-bottom: 1px solid #406da2;}
.sitemapm { border: 1px solid #dddddd; text-align: center; margin: 0.5em 1.5em 0.0em 1.5em; padding: 0.5em; }
.sitemapb li { padding: 0.2em; }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ Alert Box Styles
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.guidebox { padding: 0.2em; border-radius: 0.25em; border: 1px solid #f0f0f0; background-color: #fafafa; }
.alertbox { padding: 0.7em; border-radius: 0.25em; text-align: center; }
.alertdiv { padding: 0.7em; margin: 0.5em 0.0em 0.0em 0.0em; text-align: center;}

.alertbox-prim { border: 1px solid #b9dbfd; background-color: #cde5fe; color: #064283; }
.alertbox-good { border: 1px solid #c4e5cc; background-color: #d5eddb; color: #195626; }
.alertbox-info { border: 1px solid #bfe5ea; background-color: #d2ecf1; color: #12545f; }
.alertbox-warn { border: 1px solid #feedbd; background-color: #fff2cf; color: #846315; }
.alertbox-dang { border: 1px solid #f4c6cb; background-color: #f7d7da; color: #711d26; }
.alertbox-grey { border: 1px solid #d6d8db; background-color: #e2e3e5; color: #52565a; }
.alertbox-dark { border: 1px solid #c6c8ca; background-color: #d6d8d9; color: #313d3f; }

.alertbox.outlines { background-color: #ffffff !important; }

.guidebox .closebox { display: block; float: right; font-size: 1.5em; font-weight: bold; color: #7f7f7f; cursor: pointer; margin: -0.4em 0.5em 0em 0.5em; }
.alertbox .closebox { display: block; float: right; font-size: 1.5em; font-weight: bold; color: #7f7f7f; cursor: pointer; margin: -0.4em 0.5em 0em 0.5em; }

.alertdiv-dang { color: #ef5350; background-color: #ffebee; border-top: 1px solid #ffcdd2; border-bottom: 1px solid #ffcdd2; }

.shadebox { padding: 0.7em; text-align: center; }
.shadebox-prim { color: #004085; background-color: #cce5ff; border-top: 1px solid #b8daff; border-bottom: 1px solid #b8daff; }
.shadebox-warn { color: #ffb300; background-color: #fff8e1; border-top: 1px solid #ffb300; border-bottom: 1px solid #ffb300; }
.shadebox-grey { color: #383d41; background-color: #f7f7f7; border-top: 1px solid #d6d8db; border-bottom: 1px solid #d6d8db; }
.shadebox-good { color: #2e7d32; background-color: #e8f5e9; border-top: 1px solid #a5d6a7; border-bottom: 1px solid #a5d6a7; }
.shadebox-info { color: #1a4d9a; background-color: #f4f8ff; border-top: 1px solid #bfd9ff; border-bottom: 1px solid #bfd9ff; }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ Plug-Ins Style Overriding (FREditor, NotifyJS, DevBridge, Pickadate)
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.autocomplete-suggestions { border: 1px solid #999; background: #FFF; overflow: auto; padding: 0.5em; }
.autocomplete-suggestion { cursor: pointer; padding: 0.4em 0.7em; white-space: nowrap; overflow: hidden; }
.autocomplete-suggestion strong { color: #fb8c00; }
.autocomplete-no-suggestion { padding: 0.5em; white-space: nowrap; overflow: hidden; }
.autocomplete-selected { background: #F0F0F0; }

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ Gradient Styling
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.gradient-head { display: inline-block; height: 2.5em; line-height: 2.5em; padding: 0.0em 1.0em; border-radius: 3px 3px 0px 0px; }
.gradient-menu { height: 2.5em; line-height: 2.5em; }
.gradient-linegrey { border-bottom: 1px solid #a9a9a9; margin-bottom: 0.3em; }
.gradient-lineored { border-bottom: 1px solid #fd7e25; margin-bottom: 0.3em; }

.gradient-grey {
    background: #f6f8f9;
    background: -moz-linear-gradient(top, #f6f8f9 0%, #e5ebee 50%, #d7dee3 51%, #f5f7f9 100%);
    background: -webkit-linear-gradient(top, #f6f8f9 0%,#e5ebee 50%,#d7dee3 51%,#f5f7f9 100%);
    background: linear-gradient(to bottom, #f6f8f9 0%,#e5ebee 50%,#d7dee3 51%,#f5f7f9 100%);
}
.gradient-dark {
    background: #aebcbf;
    background: -moz-linear-gradient(top, #aebcbf 0%, #6e7774 50%, #0a0e0a 51%, #0a0809 100%);
    background: -webkit-linear-gradient(top, #aebcbf 0%,#6e7774 50%,#0a0e0a 51%,#0a0809 100%);
    background: linear-gradient(to bottom, #aebcbf 0%,#6e7774 50%,#0a0e0a 51%,#0a0809 100%);
}
.gradient-ored {
    background: #ffb76b;
    background: -moz-linear-gradient(top, #ffb76b 0%, #ffa73d 50%, #ff7c00 51%, #ff7f04 100%);
    background: -webkit-linear-gradient(top, #ffb76b 0%,#ffa73d 50%,#ff7c00 51%,#ff7f04 100%);
    background: linear-gradient(to bottom, #ffb76b 0%,#ffa73d 50%,#ff7c00 51%,#ff7f04 100%);
}
.gradient-cyan {
    background: #f2f6f8;
    background: -moz-linear-gradient(top, #f2f6f8 0%, #d8e1e7 50%, #b5c6d0 51%, #e0eff9 100%);
    background: -webkit-linear-gradient(top, #f2f6f8 0%,#d8e1e7 50%,#b5c6d0 51%,#e0eff9 100%);
    background: linear-gradient(to bottom, #f2f6f8 0%,#d8e1e7 50%,#b5c6d0 51%,#e0eff9 100%);
}
.gradient-semi {
    background: #ffffff;
    background: -moz-linear-gradient(top, #ffffff 0%, #f1f1f1 50%, #e1e1e1 51%, #f6f6f6 100%);
    background: -webkit-linear-gradient(top, #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%);
    background: linear-gradient(to bottom, #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%);
}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ◇ White Space Styles
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.ma00 { margin: 0.0em !important; }
.ma01 { margin: 0.1em !important; }
.ma02 { margin: 0.2em !important; }
.ma03 { margin: 0.3em !important; }
.ma05 { margin: 0.5em !important; }
.ma07 { margin: 0.7em !important; }
.ma10 { margin: 1.0em !important; }
.ma15 { margin: 1.5em !important; }
.ma20 { margin: 2.0em !important; }

.mt00 { margin-top: 0.0em !important; }
.mt05 { margin-top: 0.5em !important; }
.mt07 { margin-top: 0.7em !important; }
.mt10 { margin-top: 1.0em !important; }
.mt16 { margin-top: 1.6em !important; }
.mt20 { margin-top: 2.0em !important; }

.mb00 { margin-bottom: 0.0em !important; }
.mb01 { margin-bottom: 0.1em !important; }
.mb02 { margin-bottom: 0.2em !important; }
.mb03 { margin-bottom: 0.3em !important; }
.mb05 { margin-bottom: 0.5em !important; }
.mb07 { margin-bottom: 0.7em !important; }
.mb10 { margin-bottom: 1.0em !important; }
.mb15 { margin-bottom: 1.5em !important; }
.mb20 { margin-bottom: 2.0em !important; }

.ml00 { margin-left: 0.0em !important; }
.ml05 { margin-left: 0.5em !important; }
.ml10 { margin-left: 1.0em !important; }

.mr00 { margin-right: 0.0em !important; }
.mr01 { margin-right: 0.1em !important; }
.mr02 { margin-right: 0.2em !important; }
.mr05 { margin-right: 0.5em !important; }
.mr07 { margin-right: 0.7em !important; }
.mr10 { margin-right: 1.0em !important; }
.mr20 { margin-right: 2.0em !important; }

.ml02 { margin-left: 0.2em !important; }

.mx00 { margin-left: 0.0em !important; margin-right: 0.0em !important; }
.mx01 { margin-left: 0.1em !important; margin-right: 0.1em !important; }
.mx02 { margin-left: 0.2em !important; margin-right: 0.2em !important; }
.mx03 { margin-left: 0.3em !important; margin-right: 0.3em !important; }
.mx05 { margin-left: 0.5em !important; margin-right: 0.5em !important; }
.mx07 { margin-left: 0.7em !important; margin-right: 0.7em !important; }
.mx10 { margin-left: 1.0em !important; margin-right: 1.0em !important; }
.mx15 { margin-left: 1.5em !important; margin-right: 1.5em !important; }
.mx20 { margin-left: 2.0em !important; margin-right: 2.0em !important; }

.my00 { margin-top: 0.0em !important; margin-bottom: 0.0em !important; }
.my01 { margin-top: 0.1em !important; margin-bottom: 0.1em !important; }
.my02 { margin-top: 0.2em !important; margin-bottom: 0.2em !important; }
.my03 { margin-top: 0.3em !important; margin-bottom: 0.3em !important; }
.my04 { margin-top: 0.4em !important; margin-bottom: 0.4em !important; }
.my05 { margin-top: 0.5em !important; margin-bottom: 0.5em !important; }
.my07 { margin-top: 0.7em !important; margin-bottom: 0.7em !important; }
.my10 { margin-top: 1.0em !important; margin-bottom: 1.0em !important; }
.my15 { margin-top: 1.5em !important; margin-bottom: 1.5em !important; }
.my20 { margin-top: 2.0em !important; margin-bottom: 2.0em !important; }

.pa00 { padding: 0.0em !important; }
.pa01 { padding: 0.1em !important; }
.pa02 { padding: 0.2em !important; }
.pa03 { padding: 0.3em !important; }
.pa04 { padding: 0.4em !important; }
.pa05 { padding: 0.5em !important; }
.pa06 { padding: 0.6em !important; }
.pa07 { padding: 0.7em !important; }
.pa08 { padding: 0.8em !important; }
.pa10 { padding: 1.0em !important; }
.pa15 { padding: 1.5em !important; }
.pa20 { padding: 2.0em !important; }

.pt02 { padding-top: 0.2em !important; }
.pt05 { padding-top: 0.5em !important; }
.pt10 { padding-top: 1.0em !important; }

.pb00 { padding-bottom: 0.0em !important; }
.pb01 { padding-bottom: 0.1em !important; }
.pb02 { padding-bottom: 0.2em !important; }
.pb05 { padding-bottom: 0.5em !important; }
.pb10 { padding-bottom: 1.0em !important; }

.pl05 { padding-left: 0.5em !important; }
.pl07 { padding-left: 0.7em !important; }
.pl20 { padding-left: 2.0em !important; }

.pr05 { padding-right: 0.5em !important; }
.pr07 { padding-right: 0.7em !important; }

.px00 { padding-left: 0.0em !important; padding-right: 0.0em !important; }
.px01 { padding-left: 0.1em !important; padding-right: 0.1em !important; }
.px02 { padding-left: 0.2em !important; padding-right: 0.2em !important; }
.px03 { padding-left: 0.3em !important; padding-right: 0.3em !important; }
.px05 { padding-left: 0.5em !important; padding-right: 0.5em !important; }
.px07 { padding-left: 0.7em !important; padding-right: 0.7em !important; }
.px10 { padding-left: 1.0em !important; padding-right: 1.0em !important; }
.px12 { padding-left: 1.2em !important; padding-right: 1.2em !important; }
.px15 { padding-left: 1.5em !important; padding-right: 1.5em !important; }
.px20 { padding-left: 2.0em !important; padding-right: 2.0em !important; }

.py00 { padding-top: 0.0em !important; padding-bottom: 0.0em !important; }
.py01 { padding-top: 0.1em !important; padding-bottom: 0.1em !important; }
.py02 { padding-top: 0.2em !important; padding-bottom: 0.2em !important; }
.py03 { padding-top: 0.3em !important; padding-bottom: 0.3em !important; }
.py04 { padding-top: 0.4em !important; padding-bottom: 0.4em !important; }
.py05 { padding-top: 0.5em !important; padding-bottom: 0.5em !important; }
.py06 { padding-top: 0.6em !important; padding-bottom: 0.6em !important; }
.py07 { padding-top: 0.7em !important; padding-bottom: 0.7em !important; }
.py08 { padding-top: 0.8em !important; padding-bottom: 0.8em !important; }
.py10 { padding-top: 1.0em !important; padding-bottom: 1.0em !important; }
.py15 { padding-top: 1.5em !important; padding-bottom: 1.5em !important; }
.py20 { padding-top: 2.0em !important; padding-bottom: 2.0em !important; }