﻿/** Com **/
@media print {
  .no-print, .no-print * {display: none !important;background: red !important}
  #cssmenu { position:absolute !important;border-radius:6px; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
  #page_content{ width:100% !important;}
  .module{ display:block !important;width:100% !important;height:auto !important;position:relative !important;top:unset !important;left:unset !important;right:unset !important;bottom:unset !important}
}
* {box-sizing: border-box;line-height:1.6 !important}
html{overflow-x:hidden;overflow-y:scroll;}
body{font-family:Tahoma;font-size:10pt;margin:0 auto;padding:0;overflow-x:hidden !important;overflow-y:visible !important;/*max-width:1200px*/}
body.rtl_site{direction:rtl}
body.ltr_site{direction:ltr}
.pwa .logo-app,.pwa .menu_app_switch_button, .pwa .menu-trigger, .pwa .close-trigger,.pwa .container { display:block !important}
a{color:#008fca;text-decoration:none;cursor:pointer}
a:hover{text-decoration:none}
img{border:0}
h1,#m_wnd h1{font-size:13pt}
h2,#m_wnd h2{font-size:11pt}
h3,#m_wnd h3{font-size:10pt}
h4,#m_wnd h4{font-size:9pt}
h5,#m_wnd h5{font-size:8pt}
h6,#m_wnd h6{font-size:7pt}
ul,ol{padding:0 15px;margin:0}
button:focus { outline: 0; }
input[type=checkbox] { -ms-transform: scale(1.5); /* IE */ -moz-transform: scale(1.5); /* FF */ -webkit-transform: scale(1.5); /* Safari and Chrome */ -o-transform: scale(1.5); /* Opera */ transform: scale(1.5); margin: 2px }
.pwa input[type=checkbox] { -ms-transform: scale(2); /* IE */ -moz-transform: scale(2); /* FF */ -webkit-transform: scale(2); /* Safari and Chrome */ -o-transform: scale(2); /* Opera */ transform: scale(2);margin: 1rem  }
table{border-collapse:collapse;table-layout:fixed;font-size:9pt}
.hide{display:none}
.inline-block{display:inline-block}
.width_100_percent{width:100% !important}
.pos-rel{position:relative !important}
.linethrough{text-decoration:line-through}/*remove*/
.line-through{text-decoration:line-through;cursor:default}
input[type=text]:read-only, select[disabled] { background-color: #ccc !important; cursor: no-drop; box-shadow: inset 0.1em 0.1em 0.2em #BABECC !important; }
MARQUEE a{width:100%;display:inline-block}
MARQUEE img{width:32px;height:32px;border-radius:50%;padding:4px}
input[type="submit"],input[type="button"],textarea,select{-webkit-appearance:none}/*iOS devices improvment*/
.force-one-line{overflow:hidden !important;white-space:nowrap !important}
.visible{overflow:visible !important}
.fill-width{width:100% !important}
/**internet connection**/
#internet_connection{position: fixed;top: 51px;z-index: 1001;color: #fff;font-size: .85em;width: 100%;transition: height .24s ease-in-out;background-color: #424242;padding: 8px;text-align:center;display: none}
.pwa #internet_connection{top: auto;bottom: 6vh}
/**Checkbox as Toggle Switch**/
.switch { position: relative; display: inline-block; width: 50px; height: 28px;vertical-align: middle; }
.switch input { opacity: 0; width: 0; height: 0; }
.box { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; border-radius: 28px; background-color: #ccc; -webkit-transition: .4s; transition: .4s; }
.box:before { position: absolute; content: ""; height: 20px; width: 20px; left: 5px; bottom: 4px; border-radius: 50%; background-color: white; -webkit-transition: .4s; transition: .4s; }
input:checked + .box { background-color: #4bd661; }
input:focus + .box { box-shadow: 0 0 1px #4bd661; }
input:checked + .box:before { -webkit-transform: translateX(20px); -ms-transform: translateX(20px); transform: translateX(20px); }
/*Lock Screen Orientation*/
#turn { display:none; }
#page_content,.copy { display:block; }
@media only screen and (min-aspect-ratio: 13/9/*orientation:landscape*/) {
  .pwa #turn { display:block;text-align:center;margin-top:40vh;color:red;font-weight:bold }
  .pwa #page_content,.pwa .copy { display:none; }
}
/** Blink **/
.blink { animation: blinker 1s linear infinite; }
@keyframes blinker {50% { opacity: 0; }}
/** separate-char **/
input.separate-char[type="text"] { width: 8% !important; height: 2.5em !important; text-align: center; padding: 0.1em; font-weight: bold }
input.separate-char:focus { border: 1px solid #00b725;background:#dbffca;color:#000 !important; animation-name: separate-char-zoom; animation-duration: 400ms; }
@keyframes separate-char-zoom {
  from { }
  to { transform: scale(1.8); }
}
/** Spin **/
.spin {
    -webkit-animation:spin 8s linear infinite;
    -moz-animation:spin 8s linear infinite;
    animation:spin 8s linear infinite;
}
@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }
/*Util*/
.fl{float:left}
.fr{float:right}
.dl{direction:ltr}
.dr{direction:rtl}
.al{text-align:left}
.ar{text-align:right}
.ac{text-align:center !important}
.aj{text-align:justify}
.cp{cursor:pointer !important}
.clr{clear:both;width:100%;height:0px;font-size:0px}
.text-bold{font-weight:bold !important}
.red{color:#ff0000 !important}
.orange{color:#e55f00 !important}
.black{color:#000000 !important}
.white{color:#ffffff !important}
.text-dark{color:#373737 !important}
.gray{color:#828282 !important}
.text-silver{color:#aaaaaa !important}
.green{color:#31bd00 !important}
.blue{color:#0031bd !important}
.purple{color:#b4006f !important}
.overflow-x-hide{overflow-x: hidden !important}
.overflow-y-hide{overflow-y: hidden !important}
.loading-page { width:25%}
.thumb{max-height:40px;max-width:300px}
.copy{border-top:1px solid #eee;margin-top:4vh;padding:4vh 0 22vh 0;text-align:center !important;color:#838994;font-size:1em}
.copy img{max-width:150px;max-height:150px}
.parallax { z-index:0}
.rotate90 { transform: rotate(90deg); -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); }
#map {height:350px !important}
.std_table{*border-collapse:collapse; /* IE7 and lower */border-spacing:0;width:100%;table-layout:fixed;border:solid #ccc 1px;-moz-border-radius:6px;-webkit-border-radius:6px;border-radius:6px;}
.std_table input[type="text"],.std_table textarea{width:90%}
/*.std_table tr:hover{background:#fbf8e9;-o-transition:all 0.1s ease-in-out;-webkit-transition:all 0.1s ease-in-out;-moz-transition:all 0.1s ease-in-out;-ms-transition:all 0.1s ease-in-out;transition:all 0.1s ease-in-out}*/
.std_table td,.std_table th{border:1px solid #ccc;padding:10px;text-align:right;overflow:hidden;position:relative}
.std_table th{
background-color:#dce9f9;
background-image:-webkit-gradient(linear, left top, left bottom, from(#ebf3fc), to(#dce9f9));
background-image:-webkit-linear-gradient(top, #ebf3fc, #dce9f9);
background-image:-moz-linear-gradient(top, #ebf3fc, #dce9f9);
background-image:-ms-linear-gradient(top, #ebf3fc, #dce9f9);
background-image:-o-linear-gradient(top, #ebf3fc, #dce9f9);
background-image:linear-gradient(top, #ebf3fc, #dce9f9);
-webkit-box-shadow:0 1px 0 rgba(255,255,255,.8) inset;-moz-box-shadow:0 1px 0 rgba(255,255,255,.8) inset;box-shadow:0 1px 0 rgba(255,255,255,.8) inset;
border-top:none;text-align:center;text-shadow:0 1px 0 rgba(255,255,255,.5)}
  .std_table td.desc { background:#f1f1f1;color:#999}
  .std_table.horizontal-scrollable{width:auto;min-width:100%}
  .std_table.horizontal-scrollable td,.std_table.horizontal-scrollable th{padding:2px}
#DAPPlugin{display:none}
.option_parent { font-weight: bold }
hr { margin-top: 3vh; margin-bottom: 3vh; border: 0; border-top: 1px solid #eee; }
hr.gray{ border-color:#aaa; }
.format_date,.format_time,.format_date_time{ direction:ltr}
/**Form**/
form{padding:0;margin:0}
select,textarea,input,a.grid-button,.paging-button{outline:none;font-family:Tahoma;font-size:1em !important;padding:1em;border-radius:0.2em;width:8em;outline: none;/*border:1px solid #bbb*/}
input[type="file"]{width:auto}
img,input[type="submit"],input[type="button"],input[type="checkbox"],textarea,audio{vertical-align:middle;*vertical-align:text-bottom}/*button middle of text box in 1 line in ie8*/
textarea{width:210px;height:80px}
input[type="checkbox"],input[type="radio"]{padding:0;width:auto}
input.cancel{background:#efefef;color:#333;border:1px solid #9c9c9c}
input.cancel:hover{background:#e4e4e4}
span.title{display:inline-block;width:100px;text-align:left;margin:10px 0 0 5px}

select,textarea,input[type="text"],input[type="password"]{color:#666 !important}
select,input[type="text"],input[type="password"]{text-align:center;width:16em;color:#888 !important}
input[type="submit"],input[type="button"],.grid-button,.paging-button,textarea,select,input[type="text"],input[type="password"] { border: 0; outline: 0; font-size: 1em; border-radius: 0.2em; padding: 0.5em 1em; background-color: #EBECF0;box-shadow: inset 0.2em 0.2em 0.4em #BABECC, inset -0.2em -0.2em 0.7em #FFF; box-sizing: border-box; transition: all 0.2s ease-in-out; appearance: none; -webkit-appearance: none; }
input[type="submit"]:focus,input[type="button"]:focus,.grid-button:focus,.paging-button:focus,textarea:focus,select:focus,input[type="text"]:focus,input[type="password"]:focus { box-shadow: inset 0.1em 0.1em 0.2em #BABECC, inset -0.1em -0.1em 0.2em #FFF; }
input[type="submit"],input[type="button"],.grid-button,.paging-button { width:auto;min-width: 140px;color: #777; box-shadow: -0.3em -0.3em 0.7em #FFF, 0.3em 0.3em 0.7em #BABECC; transition: all 0.2s ease-in-out; cursor: pointer; }
input[type="submit"]:hover,input[type="button"]:hover,.grid-button:hover ,.paging-button:hover { box-shadow: -0.1em -0.1em 0.3em #FFF, 0.1em 0.1em 0.3em #BABECC; }
input[type="submit"]:active,input[type="button"]:active,.grid-button:active,.paging-button:active { box-shadow: inset 0.1em 0.1em 0.2em #BABECC, inset -0.1em -0.1em 0.2em #FFF; }
.ios input[type="submit"], .ios input[type="button"], .ios .grid-button, .ios .paging-button { background:#eaebef !important;box-shadow:none !important;border:1px solid #c9c9c9 !important;}
/** Input Color **/
input[type="color"] {width: 44px;height: 23px;background-color: buttonface;cursor: default;border-width: 1px;border-style: solid;border-color: rgb(169, 169, 169);border-image: initial;padding: 1px 2px;}
.empty-input-color { width: 44px;height: 23px;background-color: buttonface;cursor: default;border-width: 1px;border-style: solid;border-color: rgb(169, 169, 169);border-image: initial;padding: 1px 2px;display: inline-block;border-radius: 0.2em;}
/*Bootstrap Improve*/
.table .radio,
.table .checkbox { position: relative; height: 20px; display: block; width: 20px; padding: 0px 0px; margin: 0px 5px; text-align: center; }
  .table .radio .icons,
  .table .checkbox .icons { left: 5px; }
.table > thead > tr > th,
.table > tbody > tr > th,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > tbody > tr > td,
.table > tfoot > tr > td { padding: 6px; vertical-align: middle; }
.table > thead > tr > th { border-bottom-width: 1px; font-size: 12px; text-transform: uppercase; color: #9A9A9A; font-weight: 400; padding-bottom: 5px; }
.table .td-actions .btn { opacity: 0.36; filter: alpha(opacity=36); }
  .table .td-actions .btn.btn-xs { padding-left: 3px; padding-right: 3px; }
.table .td-actions { min-width: 90px; }
.table > tbody > tr { position: relative; }
  .table > tbody > tr:hover .td-actions .btn { opacity: 1; filter: alpha(opacity=100); }
.col-md-12 { padding-left:0}
/*head&foot*/
div.head,div.foot{margin:auto;width:100%;height:120px}
div.head{color:#c5c5c5;overflow:hidden;/*-moz-box-shadow:5px 5px 1px #aaa;-webkit-box-shadow:5px 5px 1px #aaa;box-shadow:5px 5px 1px #aaa*/}
div.head div.box{width:1000px;margin:auto;position:relative}
.mobile-menu-button { display:none}
/*@media only screen and (min-width:544px){div.head div.box{width:544px}}*/
@media only screen and (min-width:1000px){div.head div.box{width:1000px}}
@media only screen and (min-width:1200px){div.head div.box{width:1160px}}
div.head .fl{padding:5px 0;text-align:left;direction:rtl;font:normal 13px tahoma}
/*Admin*/
.dashboard-list,.dashboard-list * { font-size: 1.3rem !important;line-height:2.2 !important}
.dashboard-list div.row { border:1px solid #000;margin:0 !important;}
.dashboard-list div.row:nth-child(even) { border-color:#eee;background:#eee}
.dashboard-list div.row:nth-child(odd) { border-color:#ddd;background:#ddd}
.dashboard-list div.row:hover { border-color:#bbb}
.dashboard-list .index { font-size: 1.1rem !important;color:#888;width:24px;text-align:center;display:inline-block}
.dashboard-list a.button { font-size: 1rem !important;border:2px solid #aaa;background:#aaa;color:#fff !important;float:left;margin:2px 2px 2px 4px;padding:1px 10px;border-radius:4px}
.dashboard-list a.button.green { background:#31bd00;border-color:#31bd00;}
.dashboard-list a.button.red { background:#f00;border-color:#f00;}
.dashboard-list a.button.blue { background:#00f;border-color:#00f;}
.dashboard-list a.button:hover { border-color:#444;}
/*.dashboard-list div.row:hover a { transform: scale(1.2)}*/
.dashboard-list a.button:horizontal { background:#bbb;}
.dashboard-list a.button.disabled,.dashboard-list a.button.disabled:hover { border-color:#777;background:#777;color:#bbb;cursor:default}

.notification-num,.dashboard-notification-num{display:table;width:20px;height:20px;background:#f73a31;color:#fff;border-radius:50%;text-align:center;font-size:7pt;font-weight:bold;float:right;margin-left:4px;}
.notification-num>span,.dashboard-notification-num>span{display:table-cell;vertical-align:middle}
.dashboard-notification-num{float:left;margin-top:4px;margin-left:0}
.setup{padding:8px}
.setup select, .setup textarea, .setup input[type="text"], .setup input[type="file"]{width:95%;display:block;margin:auto}
.modlue_table{text-align:center;width:100%}
.modlue_table td{width:10%;vertical-align:bottom;line-height:16px;vertical-align:top}
.modlue_table td a{color:#820c97;font-size:8pt !important;margin-bottom:16px;display:inline-block}
.modlue_table td a.gray{color:#777}
.modlue_table td a img{margin-bottom:4px;height:36px;width:36px}
/**Dashboard-card**/
.dashboard-card {display:inline-block; width:30%;margin:0 2% 0 0;background:#fff;padding:16px;border-radius:6px;box-shadow: rgba(0, 0, 0, 0.14) 0px 3px 8px;}
.dashboard-card *{line-height:1 !important}
.dashboard-card .title{}
.dashboard-card .desc{color:#888;font-size:1.2rem !important;margin-bottom:1rem}
.dashboard-card .icon {font-size: 4rem !important;}
/**Slideshow**/
.slideshow_line{position:absolute;bottom:20px;z-index:5;background:red}
.slideshow_timebar{position:absolute;bottom:6px;height:2px;z-index:5;background:#e2e2e2}
.slideshow_timebar_val,.slideshow_timebar_full{position:absolute;top:0;bottom:0;left:0;height:2px;background:#333/*808080*/}
.slideshow_timebar_full{width:100%}

.slideshow .title_desc{position:absolute;right:0;left:0;bottom:calc(40px + 4%);height:auto;color:#ffffff;padding:0 4%}
.slideshow .title_desc.top{top:calc(40px + 4%);bottom:auto;}
.slideshow .title_desc.bottom{top:auto;bottom:calc(40px + 4%);}
.slideshow .title_desc.ar,.slideshow .title_desc.al{width:auto}
.slideshow .title_desc.ar{left:auto}
.slideshow .title_desc.al{right:auto}
.slideshow .title_desc h1,.slideshow .title_desc h2{margin:0}
.slideshow .title_desc h2{margin:0.5em 0 0 0}
.slideshow .title_desc h1.small{font-size:1.5em}
.slideshow .title_desc h2.small{font-size:1em;}
.slideshow .title_desc h1.medium{font-size:2em}
.slideshow .title_desc h2.medium{font-size:1.5em;}
.slideshow .title_desc h1.large{font-size:2.5em}
.slideshow .title_desc h2.large{font-size:2em;}

.album2_box .arrow_left,.album2_box .arrow_right{cursor:pointer;position:absolute;top:45%;height:40px;width:40px;border-radius:50%;background:#e1e1e1;opacity:0.8}
.album2_box .arrow_left:hover,.album2_box .arrow_right:hover{background:#efefef}
.album2_box .arrow_left{left:1%}
.album2_box .arrow_right{right:1%}

.ss_fit{width:100% !important;position:absolute;left:50% !important;right:50% !important;margin-left: -50vw;margin-right: -50vw;width: 100vw !important;max-width :100vw !important;background:#eee}
.ss_fit .album2{margin:auto !important;width:auto !important}
.fit_module{overflow:visible !important;width:100% !important}

.album2_box{background-color:#666;transition:all 0.6s;direction:rtl}
/*Album1*/
.pwa .album_box, .pwa .album_box table, .pwa .album_box table div, .pwa .album_box table div img { height:auto !important}
.album-fit { height:100% !important;display: flex !important;align-items: center !important;justify-content: center !important;}
.album-fit a,.album-fit img{ position:relative;border-radius:0;height:auto !important;max-height: 100%; width: auto !important;max-width: 100%;}
.album_box{background:#000;margin:auto;border:1px solid #222;position:relative;z-index:11;overflow:hidden}
.album_box table{width:100%;height:100%;border:none;table-layout:fixed/*Important for ff,ie*/}
.album_box table tr td{vertical-align:middle;text-align:left}
.album_box table tr td div{text-align:center;width:100%;margin:auto}
.album_box img.gpic{z-index:12;display:none;width:100%;height:100%;height:auto}
.album_box img.garrow,.album4 img.garrow{width:32px;height:32px;border:none;position:absolute;bottom:5px;cursor:pointer;z-index:13}
.album_box img.gLeft,.album4 img.gLeft{left:5px;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=20)";filter:alpha(opacity=20);-moz-opacity:0.2;-khtml-opacity:0.2;opacity:0.2}
.album_box img.gRight,.album4 img.gRight{right:5px;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=20)";filter:alpha(opacity=20);-moz-opacity:0.2;-khtml-opacity:0.2;opacity:0.2}
.album_box img.gLeft:hover,.album4 img.gLeft:hover{-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";filter:alpha(opacity=60);-moz-opacity:0.6;-khtml-opacity:0.6;opacity:0.6}
.album_box img.gRight:hover,.album4 img.gRight:hover{-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";filter:alpha(opacity=60);-moz-opacity:0.6;-khtml-opacity:0.6;opacity:0.6}
.gdesc{background:#000;color:#EEE;position:absolute;top:5px;left:5px;z-index:13}
table.admin_table{width:100%;font-size:8pt}
table.admin_table tr td{width:25%;text-align:right;padding-bottom:20px}
table.admin_table img{width:120px;height:120px}
table.admin_table input[type="text"]{width:100px}
a.album_page_link{background:#000;color:#111;width:200px;height:140px;border:6px solid #222;display:block;position:relative;margin:auto}
a.album_page_link table{background:#000;width:100%;height:100%;border:none}
a.album_page_link table tr td{vertical-align:middle;text-align:center}
a.album_page_link img{max-width:190px;max-height:130px;height:auto; width:auto}
/**ALBUM_IMAGE_TYPE_GRID**/
.album-image-grid{text-align:center;margin:8px auto auto auto}
.album-image-grid > div { display:inline-block;margin:0.5% ;width:19%;height:CalC(30% - 18px);position:relative}
.pwa .album-image-grid > div{ width:32%;height:16vh}
.album-image-grid > div.a { display:inline-block;margin:4px ;width:19%;height:30%;position:relative}
.album-image-grid > div img{ max-width:100%;height:100%;border-radius:4px;}
.album-image-grid .title { position:absolute;left:0;right:0;bottom:0;padding:4px !important;background:rgba(0,0,0,0.6) !important;overflow:hidden;border-bottom-left-radius:4px;border-bottom-right-radius:4px}
.album-image-grid .link,.album6 .link { position:absolute;left:4px;top:4px;background:rgba(255,255,255,0.9);padding:8px;border-radius:4px;z-index:1;border:1px solid #ddd;}
/*Album2*/
div.album2_box{position:relative}
div.album2 img,div.album2 a{position:absolute;display:none;top:0;left:0;width:100%;height:100%;-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px}
div.album2 img.active,div.album2 a.active{display:inline}
div.album2 a{overflow: hidden}
div.album2 a img{display:inline;width:100%;height:100%;object-fit: cover;}
/*div.album2 a.fit.active{display:table}
div.album2 a.fit .img-box{display:table-cell;vertical-align:middle;position:relative}
 div.album2 a.fit img { position:relative;border-radius:0;height:auto}*/
div.album2 a.fit .img-box{/*position:relative;*/height:100%;display: flex;align-items: center;justify-content: center;}
div.album2 a.fit img  {position:relative;border-radius:0;height:auto;max-height: 100%; width: auto;max-width: 100%;}
/*Album4*/
.album4{position:relative}
.album4_box{overflow:hidden;white-space:nowrap;position:relative;width:100%;height:100%}
.pwa .album4_box{height:auto}
.album4_box img{border:3px solid rgba(0,0,0,0);display:inline-block;width:30%;height:95%;}
.album4_box img:hover{border-color:#FFF}
/*Album5*/
.album5{text-align:center;padding:5px;overflow:hidden}
.album5 img{display:block;width:100%;margin-bottom:5px;-moz-border-radius:6px;-webkit-border-radius:6px;border-radius:6px}
/*Ablum6*/
.album6 *,
.album6 *::before,
.album6 *::after { margin: 0; padding: 0; box-sizing: border-box; }
.album6 { overflow:hidden}
.paper_album { display: flex; justify-content: center; flex-wrap: wrap; width: 100%; max-width: 1200px; padding: 50px 0 }
.paper_album__container { position: relative; width: 90%; max-width: 10.5em; height: 12.25em; background-color: #fff; font-size: 30px; box-shadow: 0 2px 6px 1px rgba(0, 0, 0, 0.5); transition: transform 0.5s cubic-bezier(0.075, 0.82, 0.165, 1), box-shadow 0.5s, margin 0.5s; }
@media screen and (max-width: 500px) {
  .paper_album__container { max-width: 7.35em; height: 8.575em; }
}
.paper_album__container:nth-child(1n) { transform: translate(40px, 30px) rotate(-30deg); z-index: 40; }
  .paper_album__container:nth-child(1n):hover { transform: scale(1.15) translate(40px, 30px) rotate(0); }
@media screen and (max-width: 700px) {
  .paper_album__container:nth-child(1) { transform: translate(0) rotate(-30deg); }
    .paper_album__container:nth-child(1n):hover { transform: scale(1.1) translate(0) rotate(0); }
}
.paper_album__container:nth-child(2n) { transform: translate(30px, 20px) rotate(7deg); z-index: 50; }
  .paper_album__container:nth-child(2n):hover { transform: scale(1.15) translate(30px, 20px) rotate(0); }
@media screen and (max-width: 700px) {
  .paper_album__container:nth-child(2n) { transform: translate(0) rotate(7deg); }
    .paper_album__container:nth-child(2n):hover { transform: scale(1.1) translate(0) rotate(0); }
}
.paper_album__container:nth-child(3n) { transform: translate(-20px, 20px) rotate(20deg); z-index: 40; }
  .paper_album__container:nth-child(3n):hover { transform: scale(1.15) translate(-20px, 20px) rotate(0); }
@media screen and (max-width: 700px) {
  .paper_album__container:nth-child(3n) { transform: translate(0) rotate(20deg); }
    .paper_album__container:nth-child(3n):hover { transform: scale(1.1) translate(0) rotate(0); }
}
.paper_album__container:nth-child(4n) { transform: translate(40px, -10px) rotate(10deg); z-index: 30; }
  .paper_album__container:nth-child(4n):hover { transform: scale(1.15) translate(40px, -10px) rotate(0); }
@media screen and (max-width: 700px) {
  .paper_album__container:nth-child(4n) { transform: translate(0) rotate(10deg); }
    .paper_album__container:nth-child(4n):hover { transform: scale(1.1) translate(0) rotate(0); }
}
.paper_album__container:nth-child(5n) { transform: translate(30px, -20px) rotate(-20deg); z-index: 20; }
  .paper_album__container:nth-child(5n):hover { transform: scale(1.15) translate(30px, -20px) rotate(0); }
@media screen and (max-width: 700px) {
  .paper_album__container:nth-child(5n) { transform: translate(0) rotate(-20deg); }
    .paper_album__container:nth-child(5n):hover { transform: scale(1.1) translate(0) rotate(0); }
}
.paper_album__container:nth-child(6n) { transform: translate(30px, -40px) rotate(-10deg); z-index: 40; }
  .paper_album__container:nth-child(6n):hover { transform: scale(1.15) translate(30px, -40px) rotate(0); }
@media screen and (max-width: 700px) {
  .paper_album__container:nth-child(6n) { transform: translate(0) rotate(-10deg); }
    .paper_album__container:nth-child(6n):hover { transform: scale(1.1) translate(0) rotate(0); }
}
.paper_album__container:hover { box-shadow: 0 4px 8px 3px rgba(0, 0, 0, 0.4); z-index: 60; }
@media screen and (max-width: 700px) {
  .paper_album__container:hover { margin: 0 25px; }
}
.paper_album__container:hover .paper_album__photo::before { transform: scale(1); }
.paper_album__container.active, .paper_album__container.active:hover { transform: rotate(0) scale(1.25); }
@media screen and (max-width: 500px) {
  .paper_album__container.active, .paper_album__container.active:hover { transform: rotate(0) scale(1.15); }
}
.paper_album__container.active { position: relative; }
  .paper_album__container.active .paper_album__photo { cursor: default; }
    .paper_album__container.active .paper_album__photo::before { display: none; }
.paper_album__photo { position: relative; width: 9.25em; height: 9.25em; margin: 0.625em auto 0; overflow: hidden; cursor: pointer; display: block }
@media screen and (max-width: 500px) {
  .paper_album__photo { width: 6.475em; height: 6.475em; margin: 0.4375em auto 0; }
}
.paper_album__photo::before { content: "مشاهده"; display: flex; justify-content: center; align-items: center; position: absolute; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); color: #fff; font-size: 0.8em; transform: scale(0); transition: all 0.25s; }
.paper_album__img { width: 100%; height: 100%; object-fit: cover; }
.paper_album__caption { display: flex; justify-content: center; align-items: center; width: 100%; height: 2.375em; }
@media screen and (max-width: 500px) {
  .paper_album__caption { height: 1.6625em; }
}
.paper_album__text { color: #222; font-size: 0.6em}
/*Slider*/
.slider{position:relative}
.slider_box{position:relative;overflow:hidden;width:100%;height:100%}
.pwa .slider_box { overflow-x:auto;height:30vh !important}
.pwa .slider_item{width:28vw !important;margin-top:1vh;padding:0}
.pwa .slider_item a{max-width:none !important}
.pwa .slider_item a.force-one-line{text-overflow: ellipsis;width: 28vw !important;}
.items{position:relative;display:table;/*table-layout:fixed;*/width:100%;height:100%;padding:0 4vw}
.pwa .items{padding:0}
.slider_item{display:table-cell;vertical-align:top;/*width:200px;*/height:100%;padding:10px;text-align:center;overflow:hidden;}
/*.pwa .slider_item:first-child{margin-right:40px}
.pwa .slider_item:last-child{margin-left:40px}*/
.slider_item a{display:block;margin-bottom:10px;height:100%;max-width:12vw;}
.slider_item a .force-one-line{text-overflow: ellipsis; overflow: hidden; white-space: nowrap;font-size:0.9em !important;}
.slider_item img{display:inline-block;width:auto;height:25vh;margin-bottom:5px}
.shop .slider_item,.ads-module .slider_item{width:12vw}
/*.shop .slider_item a { height:auto} این خط نظم یونیت فروشگاه در حالت نمایش رده ها را بهم میزند.*/
.shop .slider_item img,.ads-module .slider_item img{max-height: 40%;height:120px}
.pwa .shop .items,.pwa .ads-module .items { display:flex}
.pwa .shop .slider_item,.pwa .ads-module .slider_item { flex:1;min-width:28vw}
.pwa .shop .slider_item a,.pwa .ads-module .slider_item a { height: auto;}
.pwa .shop .slider_item img,.pwa .ads-module .slider_item img { /*max-width: 100%;*/max-height:none;height: 70%;width: auto;}
.slider div.garrow{width:6vw;max-width:40px;min-width:20px;height:100%;border:none;position:absolute;top:0;cursor:pointer;background-size: 50% !important;z-index:11}
.pwa .slider div.garrow{display:none}
.slider div.gLeft{left:0;border-left:1px solid #ccc;background:#f1f1f1 url(../img/slider/left.png) center center no-repeat;-webkit-box-shadow:5px 0px 5px -3px #616161;box-shadow:5px 0px 5px -3px #616161;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=20)";filter:alpha(opacity=20);-moz-opacity:0.2;-khtml-opacity:0.2;opacity:0.2}
.slider div.gRight{right:0;border-right:1px solid #ccc;background:#f1f1f1 url(../img/slider/right.png) center center no-repeat;-webkit-box-shadow:-5px 0px 5px -3px #616161;box-shadow:-5px 0px 5px -3px #616161;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=20)";filter:alpha(opacity=20);-moz-opacity:0.2;-khtml-opacity:0.2;opacity:0.2}
.slider div.gLeft:hover{-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";filter:alpha(opacity=95);-moz-opacity:0.95;-khtml-opacity:0.95;opacity:0.95}
.slider div.gRight:hover{-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";filter:alpha(opacity=95);-moz-opacity:0.95;-khtml-opacity:0.95;opacity:0.95}
/*like-dislike*/
.like-box{padding:4px;text-align:left;display:inline;float:left;margin:0 16px 0 0}
.like-box a{color:#000}
.like-box img{width:20px;height:20px;margin:0 6px 0 26px}
.ltr_site .like-box img{margin:0 26px 0 6px}
/*star rating*/
.rating-box{padding:4px;text-align:right}
.product-info .rating-box { text-align: center }
.rating-star{width:24px;height:24px;display:inline-block;margin-right:1px;background:url(../img/star-rating/star-bw.png) no-repeat}
.rating-star-off{background:url(../img/star-rating/star-bw.png) no-repeat;}
.rating-star-on,.rating-star-selected{background:url(../img/star-rating/star.png) no-repeat;}
/**Audio&Video**/
.audio_box{padding:10px;font-size:7pt;text-align:center}
.audio_download,.audio_title,.video_download,.video_title{padding:2px 4px 0 4px;text-align:center;font-size:8pt;display:block;}
.video_box{text-align:center;width:19%;display:inline-block;margin:8px auto auto auto}
.video_box video { margin:12px auto 8px auto}
.video_box.full { width: 100%;height:88%}
  .video_box.full video, .video_box.full iframe { width: 100%; height: 100% }
.pwa .video_box{width:80% !important}
/*Search*/
#suggestDiv{z-index:10000;background-color:white;display:none;width:150px;height:160px;position:absolute;border:1px solid black;font-size:14px;}
.suggestLink{cursor:pointer;width:100%;display:block}
form.search{padding:0;margin:0;border:none;direction:rtl;background-color:transparent}
input#q{width:110px;padding:4px;background:rgba(0,0,0,0);color:#666 !important;margin:0 0 0 5px;vertical-align:top;box-shadow:none !important;border:1px solid #bbb;border-radius:4px}
input[type="button"]#btn_search{width:30px;height:28px;min-width:0 !important;border:none !important;background:rgba(0,0,0,0) url(../img/search_dark.png) no-repeat center center !important;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px}
input[type="button"]#btn_search:hover{background-color:#a81c21}
div.search_box{float:left;width:210px;height:30px;text-align:left}
body.ltr_site div.search_box{float:right;text-align:right}
body.ltr_site input#q{margin:0 5px 0 0}

.search-result li { margin:1vh 4vh}

.pwa form.search { text-align:right}
.pwa input#q { border:1px solid #bbb !important}
.pwa .search input[type="button"]#btn_search{background-image:url(../img/search_dark.png) !important}
.pwa div.search_box { width:100% !important}
/**Form**/
.form-inner-table{/*width:100%;*/border-collapse:separate;border-spacing: 0 1em;}
.form-inner-table th{width:auto;padding:0 1em;vertical-align:middle;font-weight:normal;text-align:right}
.form-inner-table td{width:60%}
.date_combo{width:67px}
.form-help{display:inline-block;border-radius:50%;background:#00c2d5;color:#eee;width:20px;height:20px;cursor:help;opacity:1;text-align:center}
.form-unit{text-align:center}
.form-unit h2{background:#ddd;border-radius:3px;padding:8px;margin:3vh 0 1vh 0}
.form-unit h2:first-child{margin-top: 0;}
.form-unit span.title{background:none;color:#333;width:150px}
/*Comment*/
.comment{font-size:9pt}
.comment table{width:100%;margin:auto;font-size:9pt}
.comment table td{padding-bottom:8px}
.commentBox{width:98%;margin:auto;font-size:9pt;color:#222}
.commentBox .item{background:#fafafa;padding:2px;margin:10px auto;border:1px solid #CCC;border-radius:3px;-webkit-border-radius:3px;border-radius:3px}
.commentBox .item .item{width:95%;margin:10px auto;border:1px dashed #CCC;}
.commentBox .item div.text{color:#222;padding:4px}
.commentBox .item div.c_info{color:#555;padding:10px}

div.res_form{text-align:left;margin:0 0 1vh 1vh}

.comment-input { width:95%;height:200px}
.ltr_site .comment-input { direction:ltr}
/*Tooltip*/
.tooltip { position: relative; display: inline-block }
  .tooltip .tooltiptext { visibility: hidden; width: 120px; background-color: #555; color: #fff; text-align: center; padding: 5px 0; border-radius: 6px; position: absolute; z-index: 1; opacity: 0; transition: opacity .6s; top: 5px; right: 105%; }
  .tooltip .tooltiptext::after { content: " "; position: absolute; top: 40%; left: 100%; margin-top: -5px; border-width: 5px; border-style: solid; border-color: transparent transparent transparent #555; }
  .tooltip:hover .tooltiptext { visibility: visible; opacity: 0.9;}
/*Vote*/
.vote_container hr{margin-top: 4px !important;margin-bottom:4px !important}
.vote_container .ac { margin-top:16px}
div.vote_box{width:90%;margin-bottom:4px;padding:4px 0;/*border-bottom:1px solid #AAA;line-height:28px*/}
div.vote_box div.vote_result_box{/*line-height:12px;*/font-size:9pt}
div.vote_box div.vote_result_box div.bar{height:12px;color:#111;margin-top:3px;border:1px solid #2a5800;display:inline-block;-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px}
div.all_result{}
/*user*/
.user_photo{width:64px;height:64px;border-radius:50%}
.user_upload_button{padding-right:20px;font-size:6.5pt}
.user_upload_button:hover{color:#111}
.login_frm{margin:5px;font-size:10pt/*;line-height:16px*/}
div.main_menu a{margin-right:20px;color:#fff;display:block}
div.main_menu a:hover{color:#111}
.OptionBox{height:30px;background:#EEE;position:absolute;top:0;left:23%;padding:2px;width:55%;text-align:center;font-size:12px;direction:rtl;z-index:1000}
.OptionBox input[type=button]{background:#AAA;color:#FFF;font-weight:bold;cursor:pointer}
.OptionBox input[type=submit]{background:#AAA;color:#FFF;font-weight:bold;cursor:pointer}
.OptionBox input[type=text]{color:#222;font-weight:bold;width:80px;text-align:center}
.OptionBox input[type=password]{color:#222;font-weight:bold;width:80px;text-align:center}
.inline_search_info { width:350px !important;display:inline !important}
.inline_search_button { display:inline !important}
/*Password_Strength_Checker*/
.user_reg td{position:relative;padding-bottom:8px}
.password-strength-checker-box #progress_box{position:absolute;top:3px;right:0;width:70px;opacity:0.95}
.password-strength-checker-box{/*position:absolute;top:4px;right:125px;width:110px;*/letter-spacing:0 !important;text-shadow:none;text-indent:initial;display:inline-block;width: 16em;display:block;margin-bottom:4px}
.password-strength-checker-box .progress_box{background:#f0f0f0;/*width:200px;*/height:12px;position:relative;text-align:center;border-radius: 4px;border: 1px solid #ccc;}
.password-strength-checker-box .progress_bar{background:#00a0ff;height:100%;width:0;float:left;border-radius: 4px;}
.password-strength-checker-box .desc{color:#000;/*position:absolute;top:1px;left:0;*/width:100%;text-align:center;font-size:1.2rem !important;/*line-height: 2.5rem;*/margin-top:2px}
.password-strength-checker-box .desc sub{font-size:0.9rem !important}
.grid-edit-box .password-strength-checker-box{width: 20em;margin: 4px auto;}
/*Percent_Progress*/
@-webkit-keyframes
load { 0% {stroke-dashoffset:0}}
@-moz-keyframes load { 0% {stroke-dashoffset:0}}
@keyframes load { 0% {stroke-dashoffset:0}}
.progress { position: relative; display: inline-block; padding: 0; text-align: center;width:100%;height:100%;margin-bottom:0 !important;background:none !important;box-shadow:none !important}
  .progress > li { display: inline-block; position: relative; text-align: center; color: #93A2AC; font-family: Lato; font-weight: 100; margin: 2rem; }
  .progress > li.desc { display: block;}
  .progress > li:before { content: attr(data-name); position: absolute; width: 100%; bottom: 3rem; font-weight: 400; }
  .progress > li:after { content: attr(data-percent); position: absolute; width: 100%; top: 3.7rem; left: 0; font-size: 2rem; text-align: center; }
  .progress > li.desc::before { content: attr(data-name); bottom: 1.2em;/*width: 170px;left: -83px;*/    width: 100%;left: 0;text-align: center; }
  .pwa .progress > li.desc::before { bottom: -3.2em;left: 0; }
  .progress svg { width: 12rem; height: 12rem; }
  .progress svg:nth-child(2) { position: absolute; left: 0; top: 0; transform: rotate(-90deg); -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); }
  .progress svg:nth-child(2) path { fill: none; stroke-width: 6px; stroke-dasharray: 629; stroke: #ddd; -webkit-animation: load 6s; -moz-animation: load 6s; -o-animation: load 6s; animation: load 6s; }
/** Progress Bar **/
.bizup-progress-box { width: 80%; display: block; margin: 4px auto;position:relative }
  .bizup-progress-box.with-desc { background: rgba(0, 0, 0, 0.25); border-radius: 6px; box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.25), 0 1px rgba(255, 255, 255, 0.08); }
  .bizup-progress-box .desc { position: absolute; top: 0; bottom: 0; right: 0; left: 0; color: #333;padding:1px; font-size: 9px;text-align:center}
.bizup-progress-bar-box { width: 100%; direction: ltr; display: inline-block; margin: auto; padding: 3px; background: rgba(0, 0, 0, 0.25); border-radius: 6px; box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.25), 0 1px rgba(255, 255, 255, 0.08); }
.bizup-progress-bar { height: 6px; border-radius: 4px; background-image: linear-gradient(to bottom, rgba(129, 199, 255, 0.74), rgba(15, 1, 248, 0.05)); transition: 0.4s linear; transition-property: width, background-color; box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.25), inset 0 1px rgba(255, 255, 255, 0.1); }
.bizup-progress-box.with-desc .bizup-progress-bar-box { background: none; border-radius: 0; box-shadow: none; }
/*window*/
#m_wnd * { font-size: 1.4rem;}
#m_wnd{position:fixed;top:8%;z-index:10001;display:block;display:none;overflow:hidden;background:#EBECF0;border:1px solid rgba(0,0,0,0.2);border-radius:6px;-webkit-box-shadow:0 5px 15px rgba(0,0,0,0.5);box-shadow:0 5px 15px rgba(0,0,0,0.5)}
#m_wnd_handle{height:4em;border-bottom: 1px solid #e5e5e5;position:relative;width:100%}
#m_wnd_handle *{cursor:default}
#m_wnd_handle table{position:absolute;top:1em;right:0px;color:#333;direction:ltr;width:100%}
#m_wndClose{margin-left:0.4em}
#m_wndClose, #m_wnd_minimize, #m_wnd_maximize, #m_wnd_back { background: #dee1e6; color: #666; border-radius: 0.4vh;text-align: center; padding: 0;  display: inline-block; margin-top: -0.3em; cursor: pointer; font-size:3.4vh; width: 5vh; height: 5vh; /*line-height: 5vh !important;*/ display: inline-block; }
.pwa #m_wndClose, .pwa #m_wnd_minimize, .pwa #m_wnd_maximize, .pwa #m_wnd_back {font-size:2.4vh; width: 5vh; height: 5vh; line-height: 5vh !important;  }
#m_wndClose:hover,#m_wnd_maximize:hover,#m_wnd_minimize:hover,#m_wnd_back:hover{background:#c7cacf;}
#m_wndTitle{color:#444;padding-right:1em;font:bold 1.2em Tahoma}
#m_wnd.maximize{}
#m_wnd.minimize{overflow:hidden !important;top:auto !important}
.wnd-box { margin:1em}
/**Modal**/
html, body { min-height: 100%; }
  html.modal-active, body.modal-active { overflow: hidden; }
#modal-container { position: fixed; display: table; height: 100%; width: 100%; top: 0; left: 0; transform: scale(0); z-index: 10000; }
  #modal-container.active { transform: scaleY(0.01) scaleX(0); animation: unfoldIn 0.8s cubic-bezier(0.165, 0.84, 0.44, 1) forwards; }
    #modal-container.active.out { transform: scale(1); animation: unfoldOut 0.7s 0.2s cubic-bezier(0.165, 0.84, 0.44, 1) forwards; }
.modal-background { display: table-cell; background: rgba(0, 0, 0, 0.5);-webkit-backdrop-filter: saturate(180%) blur(10px);backdrop-filter: saturate(180%) blur(10px); text-align: center; vertical-align: middle;}
@keyframes unfoldIn {
  0% { transform: scaleY(0.003) scaleX(0.1); }
  50% { transform: scaleY(0.003) scaleX(1); }
  100% { transform: scaleY(1) scaleX(1); }
}
@keyframes unfoldOut {
  0% { transform: scaleY(1) scaleX(1); }
  50% { transform: scaleY(0.003) scaleX(1); }
  100% { transform: scaleY(0.003) scaleX(0); }
}
/*Tab*/
.ffTabHeader ul{list-style:none;padding:0;margin:0;margin-top:5px;}
.pwa .ffTabHeader ul{ overflow-x: hidden;white-space: nowrap;width: max-content;}
.ffTabHeader li{float:right;/*border:solid 1px #CCC;*/border-bottom-width:0;margin:0;}
.ffTabHeader a{font-size:8pt;text-decoration:none;display:block;background:#DDD;padding:6px 4px;min-width:110px;text-align:center;cursor:pointer;color:#555;border: solid 1px #ddd;
  background-color: #eeeeee;background: url(images/linear_bg_2.png);background-repeat: repeat-x;white-space:nowrap;overflow:hidden;
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#eeeeee), to(#ffffff));
  background: -webkit-linear-gradient(top, #ffffff, #eeeeee);
  background: -moz-linear-gradient(top, #ffffff, #eeeeee);
  background: -ms-linear-gradient(top, #ffffff, #eeeeee);
  background: -o-linear-gradient(top, #ffffff, #eeeeee);
}
.ffTabHeader a img { max-width:14px;max-height:14px}
/*.pwa .ffTabHeader a { width:100px}*/
.ffTabHeader a:hover{background:#EEE}
.ffTabHeader .ffTabSelected{border-color:#ddd}
.ffTabHeader .ffTabSelected a{position:relative;top:1px;color:#333;font-size:9pt;font-weight:bold;cursor:help;padding:8px 4px;margin-top:-5px}
div.tab_content{/*display:none;*/position:relative;border:solid 1px #ddd;padding:6px;font-size:9pt;/*line-height:23px;*/height:350px;overflow:auto}
div.tab_content .xls{position:absolute;top:4px;left:4px;}
div.tab_content .xls a{color:#080;display: inline-block;}
.signin div.tab_content { height:auto}
/**Favorites**/
.favorites i{font-size:14pt;vertical-align:middle;*vertical-align:text-bottom}
.favorites{padding:1vh 0;display:block}
.favorites,.favorites *{color:#888;font-size:9pt}
.favorites:hover,.favorites:hover *{color:#666 !important}
.favorites.active i{color:#c60000 !important;font-weight:bold}
/**Shop**/
.shop{text-align:center}
.shop > .al{margin:0 0 8px 8px}
.brand-thumb{width:20px;max-height:20px}
.shop_admin a.del_product,.shop_admin a.edit_product{position:relative;left:auto;top:auto}
.product{display:inline-block;text-align:center;vertical-align:top;padding:5px}
.product a.product_title{display:block;overflow:hidden;text-overflow:ellipsis;width:290px;font-size:12pt;margin-top:8px}
.shop-option{text-align:left;margin:8px 8px 16px 8px}
.pwa .shop-option{text-align:right;line-height:6vh !important}
.pwa .shop-option span{display:block}
.shop-option a.sort,.shop-option a.display{margin:2vh 1vh;padding:1vh}
.shop-option a.display{padding-bottom:10px}
.shop-option a.sort.active{border-bottom:1px solid #008fca}
.shop-option a.display.active{background:#cfcfcf;border-radius:4px}
/*.product td{width:25%;text-align:center;vertical-align:top;padding:10px}*/

.shop-review {padding: 1vh; font-size: 1.5em !important; /*line-height: 4vh;*/ width: 100%; color: #4d4d4d; text-align:justify}
.shop-product-properties { width:100%;table-layout:fixed;border-collapse: separate;border-spacing: 8px;}
.product-block { background: #fafafa; padding: 14px 18px; font-size: 13px !important; font-size: .929rem; /*line-height: 28px;*/ width: 60%; color: #4d4d4d; letter-spacing: -.3px; vertical-align:middle /*margin: 1% 1% 0 0 ; min-height: 47px;*/ }
.product-block.product-title { width:36%}

.shop-product-options{margin:0 auto 32px auto;padding:32px;width:100%;border-top:  1px solid #eee;border-bottom: 4px solid #eee;}
.shop-product-options a{width:20%;display:inline-block;text-align:center;color:#999}
.pwa .shop-product-options{padding:8px;}
.pwa .shop-product-options a{width:100%;display:block;text-align:right;margin:16px auto}

.shop-content-box{float:right;width:calc(100% - 240px);vertical-align:top;overflow:hidden}
.shop-content-box.full { width:100%}
.shop-filter-box{float:right;width:240px;vertical-align:top;text-align:center;padding-top:8px}
.pwa .shop-filter-box,.pwa .shop-content-box{float:none;width:100% !important}

.pwa .shop-filter-box,.pwa .shop-filter-box .product{display:block}
.pwa .shop-filter-box,.pwa .shop-filter-box .product,.pwa .shop-filter-box table,.pwa .shop-filter-box tbody{width:100% !important}
.pwa .shop-option a.sort { padding: 1vh 0;margin: 1vh 0.7vh;display:inline-block}
.shop-filter-box .product table.cell{height:auto !important}
.shop-filter-box .product table.cell td{min-height:0;max-height:none;height:auto !important;padding:10px;text-align:right;/*line-height:3vh;*/font-size:1.8vh}
.shop-filter-box .product table.cell td h1{margin-top: 5px;margin-bottom:5px;font-size:2.1vh}
.shop-filter-box .product table.cell input[type=text]{width:90%;}
.shop-filter-box .product table.cell input[type=button]{width:48%;min-width:unset}
.shop-filter-box .product table.cell td hr{margin-top: 10px;margin-bottom:10px}
.ltr_site .shop-filter-box .product table.cell td { text-align:left}

.shop-filter-handle{display:none;padding:16px 8px 0 8px}
.shop-filter-handle img{height:4vh}
.pwa .module .shop-filter-handle{display:block;font-size:2.5vh !important;padding:0 8px}

.shop-filter-close-handle { display: none; }
.pwa .shop-filter-box { display: none; position: fixed; width: 100vw !important; height: 100vh !important; top: 0; left: 0; right: 0; bottom: 0; background: #fff; z-index: 1000; }
.pwa  .module a.shop-filter-close-handle { display:block; position: absolute; width: 6vh;height: 6vh;font-size:2.5vh !important;font-weight:bold; top: 1vh; left: 1vh; z-index: 1001; background:red;color:#fff;border-radius:50%;padding-top: 1.7vh}

.product table.cell{position:relative;margin:auto;width:140px;height:135px}
.product table.cell td{position:relative;background:#fff;min-width:220px;min-height:220px;max-width:220px;max-height:220px;width:220px;height:220px;text-align:center;vertical-align:central;border:1px solid #dddbdc;padding:10px 20px 25px 20px;margin:5px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}
.product.line-display{display:block}
.product.line-display table.cell,.product.line-display .product_title{width:100%}

div.shop-path{ font-size:1.8vh !important;color:#999;padding:1vh;margin:2vh 2vh 0 2vh;}
.pwa div.shop-path{ margin:0}

.product-info{position:relative;background:#fff;/*border: 1px solid #e4e4e4;padding:1vh;*/margin:0 2vh 2vh 2vh !important;}
.module.fill-width .product-info{margin-top:2vh}
.product-info .main-info{line-height:3 !important;margin:1vh !important;width:47%}
.main-info hr{margin-top: 10px !important;margin-bottom: 10px !important;}
.pwa .product-info .main-info{ margin:1vh 0 1vh 0;width:100%;/*line-height:6vh !important*/}
.pwa .product-info .ffTabHeader,.pwa .product-info .ffTabHeader ul { width:100%}
/*.pwa .product-info .ffTabHeader li { min-width:24%}*/
.pwa .product-info .ffTabHeader a{ width:100%}
.pwa .product-info .comment td.al { width:20%}
/*.product-info .main-info select{line-height:28px}*/
.product-info div.tab_content{height:auto !important}
.brand-info .main-info{margin-right:0;margin-top:30px;/*line-height:24px*/}
div.shop-product-meta .red,div.shop-product-meta .blue{text-align:right;display:block;line-height: 5vh;}
div.shop-product-meta .red{ text-align: center}
div.shop-product-meta .blue { font-size:9pt}
@media only screen and (max-width: 1200px) {div.shop-product-meta .blue { font-size: 8pt }}
.product-info .blue img { width: 24px; height: 24px; margin: 0 4px }
div.shop-product-meta .margin-top{margin-top:2vh}
.pwa .shop-product-meta .red{text-align:left}
.pwa .product-info .blue { font-size:1.8vh !important }
div.shop-product-meta span.product-price{color:#fb3449;font-size:3vh !important;line-height:4vh !important;text-align:left}
div.shop-product-meta span.product-price .price{display:block !important}
#ads_contact { font-size:3vh}
/*.pwa div.shop-product-meta span.product-price{position: absolute;left: 1vh;bottom: 3vh;}*/
/*.pwa div.shop-product-meta span.product-price .price{font-size:3vh !important;display:inline-block !important}*/
.product-highlight-info{color:#1ca2bd;font-size:12pt;border-bottom:1px dashed #1ca2bd;cursor:default}
a.product-highlight-info{cursor:pointer}

.filter-line { margin-bottom:6px}
div.product-color-box { margin:2vh 0}
div.product-color-bubble-box { width:10vh;display:inline-block;line-height:4vh;text-align:center;vertical-align:middle;*vertical-align:text-bottom;cursor:default;padding:1.5vh 0 1vh 0;color:#999;font-size:1.5vh !important}

.selected-bubble { border:1px dashed #c1c1c1;border-radius:3px}
.product-color-bubble { width:24px;height:24px;border-radius:50%;margin:auto;box-shadow: inset 0 0 5px 0px rgba(0,0,0,0.72);box-shadow: inset 0px 0.1rem 2px 0px rgba(0,0,0,0.5);}
.cell .product-color-bubble { display:inline-block;width:16px;height:16px;vertical-align:middle;*vertical-align:text-bottom}
.product-price .line-through{color:#999;display:block;font-size:1.8vh;line-height:6vh}
.bizup-shop-card_title .line-through{display:inline;font-size:1.4vh;line-height:12pt}

.product-price .price { color:#111 !important}
.pwa .product-price .price { float:left}
.pwa .cart .product-price .price { float:none}

div.product-title{font-size:4vh !important;line-height:5vh !important}
div.product-title img.icon{height:6vh !important;border-radius: 0.8vh;}
.pwa div.product-title{margin:1vh 0}
.pwa .category-brand-info div.product-title { margin-right:1vh}

.shop-product-meta {position:absolute;top:1vh;left:1vh;padding:1vh;width:22%;background-color: #f5f5f5;border: 1px solid #e4e4e4;border-radius: 5px; z-index:10}
.shop-product-meta hr{margin:0 !important}
.pwa .shop-product-meta{position:fixed;top:auto;bottom:calc(6vh - 1px);left:0;right:0;width:100%;border-radius:0;z-index:101;
                        min-height:13vh;/*important for price bar in pwa for no orderable*/}
.pwa .ads-info .shop-product-meta{min-height:9vh;/*important for price bar in pwa for no orderable*/}
.pwa .cart.std_table input.p_num { width:90% !important}

input[type="button"].product-add-to-cart,a.product-add-to-cart{
  /*background:#62b965 url(../img/icon/admin/shopping-cart.png) no-repeat center right !important;border:none !important;padding:4px 40px 4px 10px !important;font-size:13pt;margin-top:16px;*/
    font-size: 2vh !important;
    line-height: 2.6vh !important;
    border-radius:1.5vh !important;
    color: #fff !important;
    overflow: hidden;
    text-align: center;
    /*min-height: 55px;*/
    background-color: #ef394e !important;
    border: none;
    padding: 3vh !important;
    box-shadow:none !important;
    width:96% !important;
    margin:2vh auto auto auto !important;
    display:block !important;
}
.pwa input[type="button"].product-add-to-cart,.pwa a.product-add-to-cart { padding: 2vh !important;width: 45% !important;display:inline-block !important; margin:auto !important;}
input[type="button"].product-add-to-cart:hover,a.product-add-to-cart:hover{background-color:#e63146 !important}
.product-info .album4,img.product-img{width:30%;}
.category-brand-info { position: relative;background: #fff;border: 1px solid #e4e4e4;padding: 1vh;margin: 2vh;}
.pwa .category-brand-info { margin:0}
.category-brand-info .shop { width: calc(100% + 2vh);margin-right: -1vh;}
.category-brand-info .shop/*,.category-brand-info .stats-container*/ { background: #f7f7f7;}

.category-brand-head { display:table;width:100%}
.category-brand-info .title-desc-box, .category-brand-info .icon-box { display: table-cell;vertical-align:top }
.category-brand-info .title-desc-box{ padding: 0 8px;}
.category-brand-info .category-brand-title { font-size: 4vh !important;line-height: 5vh !important;}
.pwa .category-brand-info .category-brand-title { font-size: 3vh !important;line-height: 4vh !important;}
.category-brand-info .icon-box{margin:0 0 0 1%; width: 1%;white-space: nowrap;}
.category-brand-info .icon-box img{width:auto;height:6vh;}

.category-brand-info .product-title{margin-top:1vh}
.product-info .album4 img{border-radius:0.8vh}
.pwa .product-info .album4,img.product-img{width:100%;}
img.product-img{width:100%;/*max-height:200px;*/height:auto}
.pwa img.product-img{width:100%}
img.product-img-in-cell{max-width:180px;max-height:200px}
/*img.category-brand-img{width:80px;height:auto}*/
img.other-product-img{max-width:60px;height:60px;width:auto;margin:4px 0 0 4px}
a.del_product{position:absolute;bottom:2px;left:38px}
a.edit_product{position:absolute;bottom:2px;left:20px}
img.new_product{position:absolute;top:2px;left:2px}
img.special_product{position:absolute;top:2px;left:2px}
img.special_product_dual{left:36px}
img.stop_product{position:absolute;bottom:2px;right:2px}
.cart{width:100%}
.pwa #dashboard_content .cart{padding:1.5vh}
/*.cart td,.cart th{padding:5px;text-align:center;vertical-align:middle}*/
.cart img.product{width:100%;border-radius:1.5vh}
.cart img.delete{position:absolute;top:0.2vh;right:0.4vh;height:5vh;cursor:pointer}
.cart input[type="text"],.cart .op{width:7vh !important;min-width:unset;font-size:5vh;line-height:6vh;font-weight:bold}
.cart-op { margin-top: 2vh;text-align:center }
  .cart-op input[type="button"] { min-width: 150px; }
.cart hr{border-top-color:#ddd;}
.cart-col-0 { float:right;width:24%;margin-left:2%;position:relative}
.pwa .cart-col-0 { width:38%;margin-left:2%}
.cart-col-1 { float:right;width:70%}
.cart-col-1 h3{line-height:3vh;font-size: 1.8vh !important;}
.pwa .cart-col-1 { width:60%}
.pwa .cart .fr,.pwa .cart .fl{float:none;display:block}
.path{height:70px;position:relative;line-height:22px}
.path ul{float:right;text-align:right;width:95%}
.path ul li{float:left;height:39px;width:25%;display:block;position:relative;top:1px;direction:rtl;border-bottom:1px solid #ccc}
.path ul li a{height:40px;line-height:40px;text-align:center;text-decoration:none;width:100%;display:block;color:#ccc;background:0;outline:0;cursor:default}
.path ul li a.current{color:#1768e1}
.path ul li a.selected{color:#64a000}
.path ul li a .bullet{height:7px;width:7px;top:34px;left:45%;position:absolute;display:block;border-radius:3px;background-color:#fff;border:2px solid #ccc}
.path ul li a.current .bullet{border:2px solid #1768e1;height:10px;width:10px;top:32px}
.path ul li a.selected .bullet{border:2px solid #ccc;height:10px;width:10px;top:32px;background:url("../img/icon/tick.gif") no-repeat 50% 50%}
.shop_transaction_op{margin:5px 0 25px 0;text-align:center}
.shop_transaction_op input{margin:0 15px;width:130px}
.shop-compare-summary-box { position: fixed; bottom: 1vh; left: 1vh; z-index: 101;display:none; }
.pwa .shop-compare-summary-box { bottom: 7vh}
.shop-compare-summary { position: absolute; bottom: 0;left: 0; background-color: #00bfd6; border: 1px solid #36abba; border-radius: 8px; color: #fff; font-size: 14px; font-size: 1rem; line-height: 25px; display: flex; justify-content: space-between; align-items: center; padding: 10px 20px 10px 10px; width: 145px; height: 40px; cursor: pointer;z-index: 4; }
  .shop-compare-summary:hover {color: #fff}
  .shop-compare-summary .word { font-size:12pt}
  .shop-compare-summary .num { font-size: 11pt; padding: 1px 5px; background-color: rgba(0,0,0,.08); border-radius: 3px; z-index: 1; }
    .shop-compare-summary .num .val { display:inline}
#shop-compare-list { position:absolute;bottom:0;left:0;background:#fefefe;padding:4px 4px 40px 4px;width:145px;border-radius: 8px; border:1px solid #ddd}
.shop-compare-list-item { color:#666;font-size:8pt;height:34px;border-bottom:1px solid #eee;margin-bottom:4px;position:relative}
.shop-compare-list-item .fr:first-child{width:28px}
.shop-compare-list-item .name{width:104px;height:28px;overflow:hidden !important;}
.shop-compare-list-item img{width:28px;height:28px;border-radius: 3px;}
.shop-compare-list-item .compare-delete{top:-2vh;right:-2vh;}
.pwa .compare-delete, th:hover .compare-delete, .shop-compare-list-item:hover .compare-delete{opacity:1}
th .compare-delete { top:1vh;right:1vh;padding: 1.3vh 1vh 1vh 1vh;}
a.compare-delete{position:absolute;width:4vh;height:4vh;border-radius:50%;padding:1.3vh 0.9vh 1vh 1vh;background:#e9e9e9;color:#666;border:1px solid #aaa;z-index:6;opacity:0.1}
a.compare-delete,.pwa a.compare-delete{font-size:2vh !important;line-height:2vh !important}
a.compare-delete:hover{color:#000}
/*.pwa .compare-delete{width:48px;height:48px}*/
.shop-compare-table th .name{font-size:3vh;margin-top:2vh;display:block}
.shop-compare-table th a.shop-compare-image{height:28vh;display:block}
.shop-compare-table th a.shop-compare-image img{margin-bottom:1vh !important;max-width:80%;max-height:100%;height:100%;border-radius:4px}
.pwa .shop-compare-table th{vertical-align:top}
.pwa .shop-compare-table th a.shop-compare-image img{height:auto}
.shop-compare-table th .desc{font-size:2vh !important;display:block;color:#666 }
.pwa .shop-compare-table th .price{display:block}
.pwa .shop-compare-table th a.shop-compare-image,.pwa .shop-compare-table th a.shop-compare-image img { height:7vh}

.shop-report select,.shop-report input[type="text"]{width:20% !important;display:inline-block;}
/**Menu (Website)**/
.fixed_menu{position:fixed;top:0;left:0;margin-top:0 !important;z-index:100}
#cssmenu{position:fixed;top:0;left:0;z-index:100;color:#fff;overflow:visible !important;/*important for display sub items*/}
#cssmenu { width:100%;height:50px;/*background:rgba(50,50,50,.9);*/background: rgba(210,210,210,0.8);-webkit-backdrop-filter: saturate(180%) blur(20px);backdrop-filter: saturate(180%) blur(20px);}
/*#cssmenu.pink { background: rgba(255,0,71,0.8)}
#cssmenu.purple { background: rgba(122,0,255,0.8)}
#cssmenu.blue { background: rgba(0,173,255,0.8)}
#cssmenu.green { background: rgba(122,255,0,0.8)}
#cssmenu.yellow { background: rgba(255,235,0,0.8)}
#cssmenu.orange { background: rgba(255,94,0,0.8)}
#cssmenu.red { background: rgba(255,0,0,0.8)}*/
#cssmenu a{font-size: 1em !important;color:#333;display:inline-block;/*line-height:40px;*/padding:15px 20px;text-decoration:none;font-weight:normal !important}
#cssmenu a:hover,#cssmenu > ul > li.active a,#cssmenu > ul > li:hover > a{color:#999}
#cssmenu ul{list-style:none;padding:0}
#cssmenu > ul, #cssmenu > ul > li{float:right}
body.ltr_site #cssmenu > ul,body.ltr_site #cssmenu > ul > li{float:left}
#cssmenu .has-sub{z-index:1}
#cssmenu .has-sub:hover > ul{display:block}
#cssmenu .has-sub ul{display:none;position:absolute;width:150px;top:100%;right:0}
body.ltr_site #cssmenu .has-sub ul{left:0}
body.ltr_site #cssmenu .has-sub ul li a{text-align:left}
#cssmenu .has-sub .has-sub:hover > ul{display:block}
#cssmenu .has-sub .has-sub ul{display:none;position:absolute;right:100%;top:0}
body.ltr_site #cssmenu .has-sub .has-sub ul{left:100%}

.menu-icon { height:16px}
.admin_row { padding:6px 2px;margin:2px 0;border:1px dotted rgba(0, 0, 0, 0);border-radius:4px;}
.admin_row:hover {border-color:#ccc}
.admin_row a{ background: #dfdfdf;padding: 2px 6px;border-radius: 4px;font-weight:bold}
.admin_row .op a{ background: #eee;font-weight:normal;}
.admin_row .op a:hover{ background: #ddd;}
#cssmenu img.icon { height:20px}

#cssmenu a.logo{padding:0 5px;}
#cssmenu a.logo img{height:90%;margin-top:5%}

#cssmenu .shopping_cart_link img{height:16px}

.main-link {overflow: hidden;white-space: nowrap;display:table-cell;vertical-align:middle;}
.main-link{display:inline-block !important;background: #cacaca;color:#333 !important;border-radius: 5px;padding: 8px !important;margin: 7px 0 7px 7px;position:relative;overflow:visible}
body.ltr_site .main-link{margin: 7px 7px 7px 0;}
.main-link:hover{background: #bfbfbf;color:#333 !important}
.main-link .notification-num { position:absolute;top:-4px;right:-4px}
.ads-main-link { background:#555;color:#fff !important;padding-right:16px !important;padding-left:16px !important}
.ads-main-link:hover {background:#444;color:#fff !important}

.lang-option { margin-left:8px}
.lang-option a.selected{ box-shadow: 1px 0px 4px 2px rgba(100, 100, 100, 0.7), inset 0px 0px 3px rgba(100, 100,100, 0.5);  }

a.lang{margin:16px 4px 0 0;display:inline-block;padding:0 !important}
a.lang-text{margin:0;display:inline-block;padding:5px !important;font-size: 1em !important;line-height: 40px;}
.lang img{ height:16px}

div.search_box{margin:10px 0 0 6px}
body.ltr_site div.search_box{margin:6px 6px 0 0}
input#btn_search{background-color:#fff;box-shadow:none !important;border-radius:2px}
input#btn_search:hover{background-color:#eee;box-shadow:none !important}

@media only screen and (max-width:1024px) {
  #cssmenu a,#cssmenu .has-sub ul li a{color:#ffffff !important}
  #cssmenu li a:hover,#cssmenu .has-sub ul li a:hover{background:#008ac3 !important;color:#fff !important}
  #cssmenu li a, #cssmenu .has-sub ul li a{border-bottom: 1px solid #008ac3 !important}
}

#cssmenu br{display:none}
/*#cssmenu > ul{position:relative}*/
#cssmenu > ul > li > ul, #cssmenu ul > li.has-sub:hover > ul > ul{list-style: none;
     -webkit-box-orient: vertical !important;
     -webkit-box-direction: normal !important;
    -ms-flex-direction: column !important;
    flex-direction: column !important;
    -ms-flex-wrap: wrap !important;
    flex-wrap: wrap !important;
    -ms-flex-line-pack: start !important;
    align-content: flex-start !important;
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;}
#cssmenu > ul > li > ul{height:400px;max-height:400px;padding:1% !important;/*overflow:hidden;*/border-radius:0 !important;border-bottom-right-radius:5px !important;border-bottom-left-radius:5px !important;-webkit-box-shadow: 0 2px 10px 0 rgba(0,0,0,.15) !important;box-shadow: 0 2px 10px 0 rgba(0,0,0,.15) !important;}
#cssmenu > ul > li,#cssmenu > ul > li > a,#cssmenu > ul > li > a span{position:static !important}
#cssmenu .has-sub > ul > a{font-weight:bold}
#cssmenu .has-sub > ul{/*background:#f1f1f1;*/width:96vw !important;right:1vw !important;left:1vw !important;margin-right:0 !important;margin-left:0 !important;box-shadow: 1px 1px 2px rgba(0,0,0,0.05)}
#cssmenu .has-sub ul a { padding: 0 !important; background: none; width: 25%; justify-content: flex-start; display: block; white-space: nowrap; color: #1ca2bd !important; font-size: 22pt; font-size: 1.457rem; line-height: 0.833; font-weight: 500; text-decoration: none; background: none !important; text-shadow: none !important; text-align: right !important; }
#cssmenu li.has-sub ul{visibility:hidden !important;opacity:0 !important;background:#fff}
#cssmenu li.has-sub:hover ul{opacity:1 !important;visibility:visible !important}
#cssmenu ul ul span {width:100%}
#cssmenu .has-sub ul a span:before { vertical-align: middle; *vertical-align: text-bottom; display: inline-block; font-family: 'Pe-icon-7-stroke' !important; content: "\e686"; position: relative; right: 0; margin-left: 2px; color: #1ca2bd; font-size: 22pt; font-size: 2.257rem; line-height: 1.233; }
#cssmenu .has-sub ul a:hover span{border-bottom: 1px dashed #1ca2bd;font-weight: 700;padding-left:10px}
#cssmenu .has-sub ul ul{display:inline-block !important;position:relative !important;width:auto !important;min-width:0 !important;background:none !important;top:auto !important;right:auto !important;left:auto !important;float:none !important;box-shadow:none;-moz-box-shadow:none;-webkit-box-shadow:none}
#cssmenu .has-sub ul a.last-child { color: #6a6a6a !important; font-size: 1.257rem; line-height: 2.27; font-weight: 100; margin-right:30px;}
#cssmenu .has-sub ul a.last-child span:before{content:none}
#cssmenu .has-sub ul a.last-child:hover span{color: #4a5f73 !important;font-weight:700;border-bottom:none}

#cssmenu.website-menu-classic li{position:relative !important}
#cssmenu.website-menu-classic li.has-sub ul{display:none !important}
#cssmenu.website-menu-classic li.has-sub:hover > ul{display:block !important;opacity:1 !important;visibility:visible !important}
#cssmenu.website-menu-classic > ul > li > ul { max-height:none !important;padding:0 !important;}
#cssmenu.website-menu-classic .has-sub > ul{ display:block !important;position:absolute !important;width:calc(100% + 5vw) !important;height:auto !important;right:auto !important;left:auto !important}
#cssmenu.website-menu-classic .has-sub ul a {  width:100% !important;padding: 10px 8px 10px 0 !important;position:relative;}
#cssmenu.website-menu-classic .has-sub ul a:hover {  background:#f1f1f1 !important;/* background:red !important*/}
#cssmenu.website-menu-classic .has-sub ul a:hover span{border-bottom: none;padding-left:0}
#cssmenu.website-menu-classic .has-sub ul a span:before,
#cssmenu.website-menu-classic .has-sub ul a.last-child:after{ display:none !important}
#cssmenu.website-menu-classic .has-sub ul .has-sub a:after {  vertical-align: middle; *vertical-align: text-bottom; display: inline-block; font-family: 'Pe-icon-7-stroke' !important; content: "\e687"; position: absolute; left: 8px; margin-right: 2px; color: #1ca2bd; font-size: 1.5em !important; line-height: 1.6; top:8%}
#cssmenu.website-menu-classic ul ul li { position:relative}
#cssmenu.website-menu-classic ul li.has-sub ul ul {display:none !important;position:absolute !important;width:100% !important;top: 0 !important;right:calc(100% - 4px) !important; z-index: 10;background: #fff !important;-webkit-box-shadow: 0 2px 10px 0 rgb(0 0 0 / 15%) !important;box-shadow: 0 2px 10px 0 rgb(0 0 0 / 15%) !important;}
#cssmenu.website-menu-classic ul li.has-sub ul ul,
#cssmenu.website-menu-classic ul,
#cssmenu.website-menu-classic ul:hover { border-radius: 5px !important;}
#cssmenu.website-menu-classic > ul > li > ul > li:first-child > a:hover,
#cssmenu.website-menu-classic > ul > li > ul > li > ul > li:first-child > a:hover{border-top-left-radius: 5px !important;border-top-right-radius: 5px !important;}
#cssmenu.website-menu-classic > ul > li > ul > li > ul > li:last-child > a:hover,
#cssmenu.website-menu-classic > ul > li > ul > li:last-child > a:hover{border-bottom-left-radius: 5px !important;border-bottom-right-radius: 5px !important;}
#cssmenu.website-menu-classic ul li.has-sub ul li:hover ul,
#cssmenu.website-menu-classic ul li.has-sub ul ul:hover{display:block !important;}
#cssmenu.website-menu-classic .has-sub ul a.last-child { color:#1ca2bd !important; font-size: 1.257rem; line-height: 1.6 !important; font-weight: 700; margin-right:0;}
body.ltr_site #cssmenu.website-menu-classic a {text-align:left !important}
body.ltr_site #cssmenu.website-menu-classic .has-sub ul a {  padding: 10px 0 10px 8px !important;}
body.ltr_site #cssmenu.website-menu-classic .has-sub ul .has-sub a:after { left: auto; right:8px; margin-left: 2px;content: "\e685"; }
body.ltr_site #cssmenu.website-menu-classic ul li.has-sub ul ul {right:auto;left:calc(100% - 4px) !important; }

/*@media only screen and (min-width: 1200px) {#cssmenu .has-sub > ul{width:1160px !important}}*/
/**Menu_App Com**/
.logo-app {position: absolute; top: 1em; right: 1em;z-index:1000 }
.logo-app img{width:auto; height: 4em; }
.logo-app,.menu_app_switch_button, .menu-trigger, .close-trigger,.container { display:none}
@media only screen and (max-width:1024px) {
  .logo-app,.menu_app_switch_button, .menu-trigger, .close-trigger,.container { display:block !important}
}
/**Menu_App Classic**/
.side_menu #nav li{float:none;z-index:21}
.side_menu #nav li a{text-align:inherit;z-index:22;background-repeat:no-repeat}
.side_menu #nav ul{top:0;right:190px}
.side_menu #nav ul li{margin:0 9px;text-align:center}

.menu_app_switch_button{position:absolute;top:3.5vh;left:2.5vh;z-index:5}
#nav-icon1 { width: 40px; height: 30px; position: relative; margin: auto; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .5s ease-in-out; -moz-transition: .5s ease-in-out; -o-transition: .5s ease-in-out; transition: .5s ease-in-out; cursor: pointer; }
  #nav-icon1 span { display: block; position: absolute; height: 6px; width: 100%; background: #2f2f2f; border-radius: 9px; opacity: 1; left: 0; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out; }
  #nav-icon1 span:nth-child(1) { top: 0px; }
  #nav-icon1 span:nth-child(2) { top: 12px; }
  #nav-icon1 span:nth-child(3) { top: 24px; }
  #nav-icon1.open span:nth-child(1) { top: 12px; -webkit-transform: rotate(135deg); -moz-transform: rotate(135deg); -o-transform: rotate(135deg); transform: rotate(135deg); }
  #nav-icon1.open span:nth-child(2) { opacity: 0; left: -60px; }
  #nav-icon1.open span:nth-child(3) { top: 12px; -webkit-transform: rotate(-135deg); -moz-transform: rotate(-135deg); -o-transform: rotate(-135deg); transform: rotate(-135deg); }

#v_menu_body { z-index: 1001; height: 100%; width: 0; position: fixed; top: 0; right: 0;left:auto; background-color: #111; overflow-x: hidden; padding-top: calc(9vh + 8px); transition: 0.5s; }
#v_menu_body.open { width: 250px}
#v_menu_body .v_menu_content { min-width:250px }
#v_menu_body.al { left: 0; right:auto}
.menu-app-classic #website_search_box {margin-right:8px !important}
.menu-app-classic .menu-app-link-box {padding: 8px 32px 8px 8px}
.menu-app-open-child {padding:2px 8px !important;border:1px solid #818181;margin-left:4px}
.menu-app-link-box img{width:1.5em;height:1.5em}
#v_menu_body a {text-decoration:none;font-size:20px;color:#818181;transition:0.3s}
#v_menu_body.al a { padding: 8px 8px 8px 32px}
#v_menu_body a:hover, .offcanvas a:focus{color:#f1f1f1}
#v_menu_body .v_menu_op{ position: absolute;top: 2vh;left: 2vh;/* margin-right: 50px;min-width:250px*/}
#v_menu_body .v_menu_op.ar{ top: 3.5vh;right: 2vh;left:auto}
#v_menu_body .v_menu_op a{display:inline-block;padding-right:8px}
  #v_menu_body .shopping_cart_link{opacity:0.6}
  #v_menu_body .shopping_cart_link:hover{opacity:1}
  #v_menu_body .closebtn { font-size: 6vh;line-height: 6vh !important; }
  #v_menu_body.al .closebtn { right: 25px; left:auto; margin-left: 50px; margin-right: auto; }
#v_menu_fill_layer { z-index:1000;display: none;cursor:auto;background:rgba(0,0,0,0.4);position:fixed;top:0;bottom:0;left:0;right:0 }
.menu-group{margin-right:12px}
@media screen and (max-height: 450px) {
  #v_menu_body { padding-top: 15px; }
    #v_menu_body a { font-size: 18px; }
}

.pwa #nav-icon1{ width:6vh !important;height:6vh !important}
.pwa #nav-icon1 span { height:0.6vh !important}
.pwa #nav-icon1 span:nth-child(2) { top:2vh}
.pwa #nav-icon1 span:nth-child(3) { top:4vh}
.pwa #nav-icon1.open span:nth-child(1) { top: 2vh;}
.pwa #nav-icon1.open span:nth-child(3) { top: 2vh;}
.pwa .mobile-menu-button { display:inline;margin-top:2vh;width:13vh;height:10vh !important;float:left;text-align:center}
/**Menu_App Modern**/
.container {
  width: 100%;
  max-width: 100%;
  min-height: 100%;
  margin: 0 auto;
  border-radius: 0px;
  position: fixed;left:0;top:0;bottom:0;
  overflow: hidden;
  /*-webkit-box-shadow: 0px 9px 13px 0px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: 0px 9px 13px 0px rgba(0, 0, 0, 0.3);
  box-shadow: 0px 9px 13px 0px rgba(0, 0, 0, 0.3);*/
  -webkit-transform: scale(1);
  z-index: 333;
}
.menu-trigger, .close-trigger { position: fixed; direction:ltr !important; top: 2em; left: 2em; width: 4em; height: 4em; cursor: pointer; z-index: 334; }
  .menu-trigger:hover .menu-trigger-bar:before, .close-trigger:hover .menu-trigger-bar:before { width: 100%; }
  .menu-trigger:hover .close-trigger-bar:before, .close-trigger:hover .close-trigger-bar:before { width: 100%; }
.close-trigger { z-index: 5; top: 3em; left: 1em;}
.menu-trigger-bar { display: block; width: 100%; height: 4px; background-color: white; margin-bottom: 6px; transform: rotate(-45deg); position: relative; border: 1px solid rgba(0,0,0,.2) }
  .menu-trigger-bar:before { content: ""; position: absolute; top: 0; left: 0; display: block; width: 0%; height: 100%; background-color: rgba(0, 0, 0, 0.2); transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1); }
  .menu-trigger-bar.top { width: 50%; }
  .menu-trigger-bar.middle:before { left: auto; right: 0; }
  .menu-trigger-bar.bottom { width: 50%; margin-left: 50%; }
  .close-trigger-bar { display: block; width: 100%; height: 4px; background-color: #222222; position: relative; }
  .close-trigger-bar:before { content: ""; position: absolute; top: 0; left: 0; display: block; width: 0%; height: 100%; background-color: rgba(255, 255, 255, 0.2); transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1); }
  .close-trigger-bar.left { transform: translateX(100px) translateY(-100px) rotate(-45deg); }
  .close-trigger-bar.right { transform: translateX(-100px) translateY(-100px) rotate(45deg); top: -3px; }
.inner-container, .menu-container { position: absolute; height: 100%; width: 100%; left: 0; top: 0; }
.inner-container { z-index: 20; }
.menu-container { display: flex; align-items: flex-start; overflow: auto }
.menu { display: block; width: 100%; padding: 20% 15% 10% 15%; }
  .menu li { display: block; padding: 15px 0; }
  .menu a { text-decoration: none; color: #222222; display: inline-block; padding: 10px 0; position: relative; font-size: 1.5em }
    .menu a:hover:before { opacity: 1; transform: translateX(0px); }
    .menu a:before { content: ""; display: block; position: absolute; left: 0; bottom: 0; width: 18px; height: 4px; opacity: 0; background-color: #222222; transform: translateX(100px); transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1); }
.menu-bg { position: absolute; display: block; width: 200%; left: -53%; top: -25%; height: 34%; background-color: white; }
  .menu-bg.middle { top: 33%; left: -53%; transform: rotate(0) scaleY(0); }
  .menu-bg.top { left: -34%; top: 0; transform: rotate(0) translateY(-152%); }
  .menu-bg.bottom { top: 105%; transform: rotate(0) translateY(25%); left: -20%; }
.menu-container .menu-app-open-child {border-color:#111}
.menu-container .menu li{display:inline-block}
/*Site Lang*/
/*body.rtl_site div.footer div.box{direction:rtl;text-align:right}
body.ltr_site div.footer div.box{direction:ltr;text-align:left}*/
body.ltr_site div.content{float:right}
body.ltr_site div.side_menu{float:left}
body.ltr_site #nav ul{left:0}
body.ltr_site #nav li{float:left}
body.ltr_site .side_menu #nav li{float:none}
body.ltr_site .side_menu #nav ul{left:190px}
body.rtl_site .side_menu #nav li a{background-image:url(../img/icon/arrow_left.gif);background-position:left center}
body.ltr_site .side_menu #nav li a{background-image:url(../img/icon/arrow_right.gif);background-position:right center}
body.ltr_site .side_menu #nav ul li a,body.rtl_site .side_menu #nav ul li a{background-image:none}
/*page*/
#editor{min-height:300px}
#page_content{position:relative;width:100%;height:2000px;margin:49px auto 0 auto;min-height:300px}
/*@media only screen and (min-width:1000px){#page_content{width:1000px}}
@media only screen and (min-width:1200px){#page_content{width:1160px}}*/

#page_op{position:fixed;bottom:0;right:0;left:0;width:100%;margin:0;background:rgba(200,200,200,0.95);padding:10px;z-index:61}
#page_op .fl input{margin-left:10px}
#page_op .fr input{margin-right:10px}
#page_op_handle,#page_op_save,#page_op_live_bg,#page_op_access,#page_op_paste_module,#page_op_paste_page,#page_op_copy_page,#page_op_down,#page_op_up { position:absolute;top:-28px;width:40px;height:40px;cursor:pointer;transition: transform 0.2s;background:#f1f1f1;border:1px solid #aaa;border-radius:50%;padding:4px}
#page_op_handle:hover,#page_op_save:hover,#page_op_live_bg:hover,#page_op_access:hover,#page_op_paste_module:hover,#page_op_paste_page:hover,#page_op_copy_page:hover,#page_op_down:hover,#page_op_up:hover{ transform: scale(1.4);}
.pwa #page_op {text-align:center;margin-bottom: 4vh;}
.pwa #page_op > img { width:10%;height:auto;position: relative;margin: 0;left: auto;right: auto;}
.pwa #page_op img:hover {transform: scale(1.1) !important}
.pwa .modlue_table td a img{width:8vw;height:auto}
.pwa .modlue_table td a{font-size:1vh !important}
#page_op_handle { right:10px;}
#page_op_save { right:110px;}
#page_op_live_bg{ right:60px;}
#page_op_access { right:calc(50vw - 100px);}
#page_op_paste_module { right:calc(50vw - 50px);}
#page_op_copy_page { right:calc(50vw);}
#page_op_paste_page{ right:calc(50vw + 50px);}
#page_op_up { left:10px;}
#page_op_down { left:60px;}

.module{position:relative;position:absolute;/*max-width:100%;*/width:200px;border:none;overflow:hidden;overflow-y:auto;-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px;}
.module-bg-color{ background:#fcfcfc; }
.mng-module:hover{z-index:13;
  -webkit-box-shadow: 0px 0px 12px 0px rgba(255,0,123,0.2), inset 0px 0px 12px 0px rgba(255,0,123,0.2);
  -moz-box-shadow: 0px 0px 12px 0px rgba(255,0,123,0.2), inset 0px 0px 12px 0px rgba(255,0,123,0.2);
  box-shadow: 0px 0px 12px 0px rgba(255,0,123,0.2), inset 0px 0px 12px 0px rgba(255,0,123,0.2);
}
.pwa .mng-module:hover { z-index: auto; }
.module .mng{position:absolute;top:1px;right:1px;background:#000;padding:3px;z-index:99;display:none}
.module:hover .mng{display:block}
.module .mng img {width:20px;height:20px }
.module .title{padding:10px;margin:0;font-size:10pt;line-height:1.43;color:#fff;background:#bdbdbd;background:linear-gradient(to bottom, #bdbdbd 0%, #a1a1a1 100%)}
.module .data{padding:10px;line-height:20px}
.module .data div.fr{margin-left:5px}
.module .data div.fr img{width:50px;height:50px;-moz-border-radius:2px;-webkit-border-radius:2px;border-radius:2px}
.module a.title_list{font-size:10pt}
.module .intro_list{font-size:8pt}
.sys_page{width:980px;margin:10px auto;padding:10px;min-height:300px;background:#eee;-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px}
.meta{margin-bottom:8px;color:#aaa;font-size:8pt}
/*drag.resize*/
#editor{position:relative;overflow:hidden;/*width:100%;height:99%;*/border:1px dashed #ccc}
#editor .type{display:none}
#editor .info{font-size:7pt;color:#fff}
.block{/*border:1px solid #aaa;position:absolute;background:#eee;padding:0px;border-collapse:collapse*/}
.handle,.resize{display:block;width:16px;height:16px;/*z-index:100;*/}
.handle{position:absolute;top:0;right:0;left:0;width:100%;height:auto;/*padding-top:2px;*/padding:0;background:#888;cursor:move;text-align:right;display:none;z-index:12;direction: rtl !important;}
.pwa .handle{height:auto}
.module:hover .handle{display:block}
.handle:hover{background:#999}
.handle a{color:#fff;transition: all .2s ease-in-out;display:inline-block;border-radius:4px}
.handle a:first-child,.handle a img{padding:4px 8px}
.handle a:hover{transform: scale(1.2);background:rgba(0,0,0,.15)}
.pwa .handle a{margin-right:1.3vh;margin-left:1.3vh;font-size:3vh !important;line-height:5vh !important}
.pwa .handle a img{height:3vh;padding:0}
.pwa .handle .info{font-size:1.2vh !important;margin-right:1.3vh;}
.resize{position:absolute;right:0;bottom:0;cursor:nw-resize;z-index:61}
.resize.fix_height{cursor:w-resize}
/*.resize-disable .resize{display:none !important}*/
/**Chat**/
.chatbox{position:absolute;position:fixed;width:225px;display:none;z-index:100;direction:rtl}
.chatboxhead{background-color:#222;padding:6px;color:#ffffff;border-right:1px solid #222;border-left:1px solid #222}
.chatboxhead .chat_title{padding:0 6px;cursor:default}
.chatboxblink{background-color:#176689;border-right:1px solid #176689;border-left:1px solid #176689}
.chatboxcontent{background-color:#ffffff;font-family:tahoma;font-size:10pt;line-height:18px;color:#333333;min-height:80px;max-height:200px;overflow-y:auto;overflow-x:hidden;padding:7px;border:1px solid #ccc;border-top:none;border-bottom-color:#eee}
.chatboxcontent .time{color:#ccc;font-size:6.5pt;text-align:left;margin:0 0 6px 0}
  .chatboxcontent .time:hover { color: #999}
.chatboxinput{padding:5px;background:#ffffff;border:1px solid #ccc;border-top:none}
.chatboxtextarea{width:98%;height:44px;max-height:44px;padding:3px 0pt 3px 3px;border:2px solid #ddd;margin:1px;overflow:hidden}
.chatboxtextareaselected{border:2px solid #f99d39}
.chatboxmessage{margin-left:1em}
.chatboxinfo{margin-left:-1em;color:#666666}
.chatboxmessagefrom{margin-left:-1em;font-weight:bold}
.chatboxmessagecontent{}
.chatboxoptions{float:right;direction:ltr}
.chatboxoptions a{text-decoration:none;color:white;font-weight:bold;font-family:Verdana,Arial,"Bitstream Vera Sans",sans-serif}
.chatboxoptions a:hover{color:#F00}
.chatboxtitle{float:left;position:relative}
.chatboxtitle a{color:#fff}
.chatboxtitle img.usr{position:absolute;left:-2px;bottom:-20px;width:40px;height:40px;padding:1px;background:#fff;border:1px solid #666}
/*LinkBox*/
/*.box_title{background:#919191;color:#fff;padding:5px;-moz-border-radius-topright:4px;-webkit-border-radius-top-right:4px;border-top-right-radius:4px;-moz-border-radius-topleft:4px;-webkit-border-radius-top-left:4px;border-top-left-radius:4px}*/
.linkbox_body{padding:5px;line-height:20px;overflow:visible}
  .linkbox_body ul{ list-style: none }
  .linkbox_body li { clear: both; width: 100%; margin: 8px auto 0; border: 1px solid rgb(207, 206, 206); width: 100%; height: 70px; display: block; box-shadow: 0px 0px 3px #c7c7c7; clear: both; overflow: hidden; background: #ECECEC; box-shadow: 0 0 0 0.5em #FFF inset; }
  .linkbox_body a { width:100%;height:100%;display:inline-block;margin-top:4px}
  .linkbox_body a img { margin: 6px 12px 6px 6px !important; width: 48px; height: 48px!important; float: right; background: #FFF; padding: 3px; border-radius: 50%; }
  /*.linkbox_body img,.linkbox_body .linkbox-pad { margin: 6px 12px 6px 6px !important; width: 48px; height: 48px!important; float: right; }*/
  .linkbox_body a h1 { margin: 15px 0 3px; color: rgb(58, 58, 58); font-family: IranSans; font-size: 13px; line-height: 16px; height: 16px; overflow: hidden; padding-bottom: 6px; text-decoration: none; float: right; }
  .linkbox_body a h2 { color: rgb(59, 59, 59); font-family: IranSans; font-size: 10px; font-style: normal; height: 13px; }
  .linkbox_body a:nth-child(-n+1 of h1),.linkbox_body a:nth-child(-n+2 of h2){width: calc(100% - 70px);background:yellow !important}
  .linkbox_body a h1,.linkbox_body a h2{width: 100%; padding: 0 16px;}
  .linkbox_body a h1:nth-child(2),.linkbox_body a h2:nth-child(3){width: calc(100% - 70px);padding: 0 }
.pwa .linkbox_body li { height:9.5vh}
.pwa .linkbox_body a h1 ,.pwa .linkbox_body a h2 { height:auto;margin:1vh 0 0 0}
/*LinkBox_Column*/
div.linkbox-column{font-size:10pt;width:100%;padding:16px 8px 8px 8px}
div.linkbox-column .box{margin:auto}
div.linkbox-column table{width:100%;table-layout:fixed;border-collapse: collapse;}
div.linkbox-column td{vertical-align:text-bottom}
.pwa div.linkbox-column td{display:block;margin-top:32px}
@media only screen and (min-width:544px){div.linkbox-column div.box{width:544px}}
@media only screen and (min-width:1000px){div.linkbox-column div.box{width:1000px}}
@media only screen and (min-width:1200px){div.linkbox-column div.box{width:1160px}}
div.linkbox-column img{height:16px}
div.linkbox-column h2{font-size:10pt;color:#4c5058;font-weight:bold;margin-bottom:10px;margin:0}
div.linkbox-column a{margin:12px 8px 0 8px;display:inline-block;color:#838994;display:block}
div.linkbox-column a:hover{color:#fb8367}
/*Skin*/
.home_box div.fr{width:31%;margin:0 5px}
.home_box div.fr a{display:block;margin-bottom:5px}

div.body{width:990px;margin:20px auto;overflow:auto}
div.side_menu{width:200px;float:right;border:none;padding:10px;background:#f5f5f5;-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px}
div.side_menu a{display:block;margin:5px 0;padding-bottom:5px}
div.side_menu a:hover{color:#00a4da}
div.side_menu ul{margin:0;padding:0;padding-right:25px;margin-bottom:10px}
div.side_menu ul li a{margin:0px}
div.content{width:730px;float:left;color:#333;padding-right:20px;position:relative}
h1.mainTitle{margin:0;margin-bottom:15px;padding:8px;line-height:16px;font-size:12px;text-transform:uppercase;background:#eaeaea;color:#555;letter-spacing:.5px;border-radius:3px;-webkit-border-radius:3px;border-radius:3px}
.trHighLight:hover{background:#ddd;color:#333}
div.main_content div.fr{width:50%;line-height:23px}
div.main_content div.fr a{color:#3a5799;padding-right:14px}
#nav ul li{border-top:1px solid #777;background:#00104a}
#nav ul a{color:#eee}
#nav ul a:hover,#nav ul li:hover{background:#444}
/*autocomplete*/
.autolist{width:142px;position:relative;padding:0 5px;margin:2px 30px 0 0;line-height:17px;z-index:100}
body.ltr_site .autolist{margin:2px 38px 0 0}
.autolist_box{width:140%;position:absolute;top:0;right:-20%;padding:0;margin:0;z-index:100}
.al-item-style{display:block;margin:0;padding:4px 6px;border:1px solid #ddd;border-bottom:none;background:#fff;color:#333;overflow:hidden;cursor:pointer;z-index:100;overflow:hidden !important;white-space:nowrap !important}
.al-item-style:last-child{border-bottom:1px solid #999}
.al-item-style:hover,.al_active{background:#3b5998;color:#fff}
.al-item-style:first-child{border-top-left-radius:4px;border-top-right-radius:4px}
.al-item-style:last-child{border-bottom-left-radius:4px;border-bottom-right-radius:4px}
.al-item-style img{width:40px;max-height:64px;margin-left:4px;border-radius:4px}
/*share*/
.share{background:#c0c0c0;color:#888;letter-spacing:3px;border-top:1px solid #a4a4a4;padding:6px;font-size:9pt}
.share img{vertical-align:middle;*vertical-align:text-bottom}
/*Label*/
.label{display:table-cell;width:100%;text-align:center;vertical-align:middle}
.label a{color:#333}
/**TextBox**/
.textbox hr{margin-top:2px;margin-bottom:2px;}
/*News_Auto*/
.news_auto_box{margin-bottom:30px;padding:4px 8px;font-size:9pt;line-height:18px}
.news_auto_box td{vertical-align:top;padding:10px}
.news_auto_box img{width:80px;height:60px;border:1px solid #AEAEAE}
.news_auto_box a{font-weight:bold;display:block}
.news_auto_box .desc{font-size:8pt;color:#888}
/**News**/
.news-category-group > a{display:block;padding:0.5%;border-bottom:1px solid #aaa}
.news-category-group > a:nth-child(odd){background:#f1f1f1}
.news-category-group > a:nth-child(even){background:#dfdfdf}
.news-category-group > a:hover{background:#ccc}
.news-category-group img{width:4%}

.unit-news .marquee-container { height: calc(100% - 80px); }
.pwa .unit-news { height:55vh !important;}
.pwa .unit-news .marquee-container { height:calc(100% - 100px)}
.news{overflow:hidden/*;height:100%*/}
.news-module-box{padding:0 8px}
.news-module-box marquee{ width: 100%; height: calc(100% - 105px); overflow: hidden; /*margin-top: -2px;*/ }
.news-module-box marquee .news-box .news-img { border-radius:4px}
  .news-module-box div.tab_content { height:calc(100% - 50px)}
  /*.pwa .news-module-box div.tab_content { height:auto}*/
.news-box{display:block;text-align:right;padding:8px;width:100%}
.news-box table{width:100%}
.news-box table td{vertical-align:top}
.news-img-box{width:128px;height:auto;overflow: hidden;}
.news-img-box a{width:100%;height:100%}
.news-img{margin-left:10px;overflow: hidden;width: 130px;height:110px;border-radius:3px}
.news-box .fl .news-img {width: 96px !important;height:81px !important; }
.library-module-box .al , .social_media .al{margin:0 8px}
.library-module-box .media-item{width:19%;height:auto;background:none}
.library-module-box .media-item .album4{height:calc((100vw/5))}
.news-title-desc-box{font-size:9pt;color:#555}
.news-title{font-size:10pt;font-weight:bold;color:#555;padding-right:8px}
.news-desc{font-size:9pt;padding:0 8px 0 0;margin:0}
.news-box{padding:8px;}
.news-box .fr{width:70%}
.news-box .fl{width:29%;margin-right:1%;padding:8px;border:1px solid #ddd;border-radius:3px}
.news-box .fl h1{font-size:16px}
.news-box .fl .news-img-box{width:100px}
.news-box .fl img{width:90px;cursor:pointer}
.news-box .fl a{font-size:13px;line-height:20px}
.news-box .fl td{padding:10px 0 10px 0;border-top:1px solid #eee}
.news-box .fl hr{border-top:4px solid #ddd}
.news-box .news-meta-box{line-height:30px !important}
.news-box .news-img{display:block;height:auto;cursor:default;height: 100px;width: 100px;margin:auto;}
.module.news-page .news-box .news-img { width:100%;height:auto}
.news-page .news-box .news-img { max-height:none}
.news-box h1{margin-top: 0;line-height: normal;font-size: 21px;font-weight: bold;color: #0c3555;}
.news-box h1 img{width:5%;}
.news-box h2{margin: 10px 0;line-height: normal;font-size: 16px;color: #777;text-align:justify}
.news-box .news-body{margin: 10px 0;font-size: 16px;color: #555;line-height:30px;text-align:justify}
.news-box .tab_content { height:auto}
.pwa .news-box .fl{display:none}
.pwa .news-box .fr{width:100%}
.pwa .module .news-meta-info ,.pwa .module .news-meta-info span{ font-size:1.1vh !important;margin-top:2px}
.news-meta-info{
  padding: 1px 5px;font-size: 12px;border-radius: 3px;border: 1px solid #ccc;text-shadow: 0 1px 0 #fff;cursor:default;direction:rtl;
  display: inline-block;color: #333;margin: 0 0 1px 0;line-height: 1.43;text-align: center;white-space: nowrap;vertical-align: middle;
  background-image: -webkit-linear-gradient(top,#fff 0,#e0e0e0 100%);
  background-image: -o-linear-gradient(top,#fff 0,#e0e0e0 100%);
  background-image: -webkit-gradient(linear,left top,left bottom,from(#fff),to(#e0e0e0));
  background-image: linear-gradient(to bottom,#fff 0,#e0e0e0 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe0e0e0', GradientType=0);
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
  background-repeat: repeat-x;-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 1px 1px rgba(0,0,0,.075);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 1px 1px rgba(0,0,0,.075);background-color: #fff;
}
.news-meta-info:hover{color: #333;background-color: #e6e6e6;border-color: #adadad;}
.news-page { width:100% !important}
.news-page .news-img { height: auto }
/*User_Table*/
.user_table { cursor: default; table-layout: fixed }
.user_table{width:100%;border:solid #ccc 1px;line-height:20px}
.user_table td,.user_table th{padding:4px;border:solid #ccc 1px;font-size:8pt !important}
.user_table th{background-color:#dce9f9;box-shadow:0 1px 0 rgba(255,255,255,.8) inset;height:40px;color:#444;text-align:right}
.user_table tr:hover{background:#fbf8e9}
/**Lightbox**/
#jquery-overlay { position: fixed; top: 0; left: 0; z-index: 10001; width: 100%; height: 100% !important; }
#jquery-lightbox { position: fixed; top: 0; left: 0; width: 100%; z-index: 10002; text-align: center; line-height: 0; }
#jquery-lightbox a img { border: none; }
#jquery-lightbox * { -webkit-box-sizing: content-box !important; -moz-box-sizing: content-box !important; box-sizing: content-box !important; }
#lightbox-container-image-box { position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; overflow:hidden}
#lightbox-container-image { padding: 10px; }
#lightbox-loading { position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#lightbox-loading img{width:32px !important;height:32px !important}
#lightbox-nav { position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#lightbox-container-image-box > #lightbox-nav { left: 0; }
#lightbox-nav a { outline: none;}
#lightbox-nav-btnPrev, #lightbox-nav-btnNext { width: 49%; height: 100%; zoom: 1; display: block; }
#lightbox-nav-btnPrev { left: 0; float: left; }
#lightbox-nav-btnNext { right: 0; float: right; }
#lightbox-container-image-data-box { font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%; padding: 0 10px 0; }
#lightbox-container-image-data { padding: 0 10px; color: #666; }
#lightbox-container-image-data #lightbox-image-details { width: 70%; float: left; text-align: left; }
#lightbox-image-details-caption { font-weight: bold; }
#lightbox-image-details-currentNumber { display: block; clear: left; padding-bottom: 1.0em; direction: rtl; }
#lightbox-secNav-btnClose { width: 66px; float: right; padding-bottom: 0.7em; }
/*#lightbox-container-image-data-box{max-width:880px !important}*/
/*#lightbox-container-image-box {max-width:900px !important;max-height:490px ! important}*/
/*#lightbox-container-image img {max-width:880px !important;max-height:470px ! important;width:100% }*/
#lightbox-container-image img {width:100% }
/*Responsive*/
@media only screen and (max-width:1024px) {
  #lightbox-container-image-box{ width:100% !important;height:100% !important}
  #lightbox-container-image-data-box { width:100% !important}
  #lightbox-nav-btnPrev, #lightbox-nav-btnNext { height: 90% !important; }
}
/*App-Panel*/
#map {height:470px !important;}

.bizup-color-picker { width:120px !important}
.bizup-color-picker-box * {cursor:default !important}
.bizup-color-picker-box{ width:120px !important;display:inline-block}

.mobile-box {position:relative;width:330px;height:573px;margin:auto;text-align:center;padding:0 !important}
  .mobile-box .bg {position:absolute;top:77px;left:40px;background:#fff;height:411px;width:233px}
  .mobile-box .menu-h {position:absolute;top:448px;left:40px;background:#bc18d4;height:40px;width:233px;text-align:center}
  .mobile-box .menu-h img {margin:8px 8px 0 8px}
  .mobile-box .menu-v {position:absolute;top:77px;left:253px;background:#a3a3a3;height:411px;width:20px;text-align:center}
  .mobile-box .menu-v img {margin:8px 0 8px 0;width:14px;height:14px}
  .mobile-box .map-icon {position:absolute;top:78px;left:40px;background:#bc18d4;width:233px;text-align:center}
  .mobile-box .ads-icon {position:absolute;top:260px;left:40px;background:#bc18d4;width:233px;text-align:center;font-size:7pt}

/*.mobile-box.introduction.setup {height:340px}
.mobile-box.introduction {display:inline-block}
  .mobile-box.introduction *{font-family:"bizup-font"}
  .mobile-box.introduction input[type="text"],.mobile-box.introduction input[type="file"],.mobile-box.introduction textarea,.mobile-box.introduction select{text-align:right;width:80%;margin:auto}
  .mobile-box.introduction .slider{text-align:center;position:absolute;top:465px;left:50px;width:233px;}
  .mobile-box.introduction .slider span{background:#9A9A9A;display:inline-block;width:8px;height:8px;margin:0 2px;border-radius:50%}
  .mobile-box.introduction .slider span.active{background:#FF9500}
  .mobile-box.introduction .slider{text-align:center;position:absolute;top:465px;left:50px;width:233px;}
  .mobile-box.introduction .introduction-icon {position:absolute;top:150px;left:135px;width:64px;text-align:center}
  .mobile-box.introduction .title {position:absolute;top:300px;left:50px;width:233px;text-align:center}
  .mobile-box.introduction .desc {position:absolute;top:350px;left:50px;width:233px;text-align:center;color:#777777}*/
/** Paging **/
.paging-box {margin:16px auto;text-align:center}
.paging-button { width: auto;padding: 0.5em 1em;}
.paging-button:hover { color: #777}
.paging-button.disable,.paging-button.disable:hover { color:#888;background:#c8c8c8;box-shadow:none;cursor:default}
.paging-summary { font-size:0.8em;color:#bbb;display:inline-block}
select.paging-select { width:80px}
/** Grid **/
#grid,#grid_form{direction:rtl;background-color:#EBECF0;}
.pwa #grid table{width:auto}
.pwa #grid > .fl{float:right}
.pwa #grid .more-menu-caret { left:auto;right:12px}
.pwa #grid .toolbar > div{ float:none !important;display:block;margin-top: 2vh;text-align: right;}
#grid h1{text-align:right;display:block;font-size:12pt !important;padding:2px 6px 2px 6px;margin:0;color:#444}
#grid h2{text-align:right;display:block;font-size:10pt !important;padding:4px 6px 6px 6px;margin:0;color:#aaa}
#grid legend{margin: 0 auto 20px auto;border-bottom: 1px solid #e5e5e5;width:340px}
#grid .toolbar{padding:0 8px 8px 8px}
#grid .toolbar select{width:80px}

#grid td.highlight,#grid th.highlight {background-color: #efefef !important;}
#grid td:hover,#grid th:hover {background:  #dde3e9 !important;}

.grid_external_data *{font-size: 1.1rem !important;}

  .grid-edit-box { padding:4px;float:right;width:CalC(33% - 8px);position:relative}
  .pwa .grid-edit-box { float: none;width: 95%;}
  .grid-edit-box .title{width:20em;max-width:100%;text-align:right;margin:auto;font-size:11pt}
  .grid-edit-box input[type="text"],.grid-edit-box input[type="password"],.grid-edit-box textarea{width:20em;max-width:95%; /*border-radius: 4px;padding: 8px; border:1px solid #DDDDDD;width:340px*/}
  .grid-edit-box select{width:14em;}
  .grid-edit-box input[type="text"].filter{width:6em/*;margin-left: -6em;*/}
  .grid-edit-box textarea { /*width:300px;*/height:230px}
  .grid-external-table-box { width: 90%; margin: auto; max-height: 250px; border: 1px dashed #ddd; padding: 20px; overflow: auto; line-height: 23px;border-radius:6px }
  .grid-edit-box .inline_search_info { width:170px !important}
 #grid .quick-search-button{width:auto !important}
  #grid input[type="button"],#grid input[type="submit"],.grid-record input[type="button"],a.grid-button{
    text-align:center;padding: 0.5em 1em;
    display: inline-block; text-align: center; white-space: nowrap; vertical-align: middle;
    user-select: none;
    -webkit-transition: all 100ms ease-in;
    -moz-transition: all 100ms ease-in;
    -o-transition: all 100ms ease-in;
    -ms-transition: all 100ms ease-in;
    transition: all 100ms ease-in;
    min-width:10px !important;
    vertical-align:middle;*vertical-align:text-bottom
  }
  /*#grid input[type="button"]:hover, #grid input[type="submit"]:hover,.grid-record input[type="button"]:hover,a.grid-button:hover{ background-color:#4d97ff !important}*/
  #grid input[type="button"].red,a.grid-button.red{ color: #aa0000 !important; /*border-color: #ea1d7d !important;*/ }
  /*#grid input[type="button"].red:hover,a.grid-button.red:hover{ background-color:#ea476d !important}*/
  #grid .grid-button.red{ color: #ea1d7d !important; /*border-color: #ea1d7d !important;*/ }
  .grid-button-medium{width:100px !important}
  .grid-button-large{width:180px !important}
  .grid-button-xlarge { width: 320px !important }
  #grid .grid-button.red:hover{ color:#ff0000 !important}
  #grid table{table-layout: fixed;}
  /*#grid tr{transition: all .2s ease-in-out;}
  #grid tr:hover{transform: scale(1.02);}*/
  #grid th{/*font-weight:bold;*/cursor:default}
  #grid th,#grid td{text-align:right}
  #grid th img{width:16px;height:16px}
  #grid th.sortable{color:#008fca;cursor:pointer}
  #grid td,#grid th{ text-overflow:ellipsis;overflow:hidden;white-space:nowrap}
  #grid .col-op { width:120px}
  #grid .col-index { width:80px}
  #grid .op{width:24px;height:24px;transition: transform .2s;}
  .pwa #grid .op{width:32px;height:32px;transition: transform .2s;}
  #grid .op:hover { transform: scale(1.2);}
.grid-img{border-radius:4px !important;width:32px !important;height:32px !important;margin:auto !important;display:block !important}
.grid-img .album4_box img,.grid-img .album4_box img:hover{border:none !important}
.grid-record{padding:0 0 0 0;}
.grid-record,.grid-record form{height:auto;position:relative;/*overflow-x:hidden*/}
.grid-record input[type="file"]{margin:4px auto;}
.grid-record .grid-img{width:80px !important;height:80px !important;margin:auto;display:block}
#dashboard_content .table-responsive{overflow-x:visible !important;background-color:#f9f9f9;}
.grid-operation-record{background:#EBECF0;position:sticky;bottom:-2px;right:0;left:0;padding:12px 0 10px 0;border-top:1px solid #e5e5e5;}
.pwa .grid-operation-record a, .pwa .grid-operation-record input[type] { width: 47% !important;float: right;margin: 1%;}
#grid input[type="file"]{margin:4px auto 0 auto;display:block}
#grid video{max-height:80px;border-radius: 8px;}
.grid_edit_desc{color:#aaa;font-size:7.5pt !important}
#grid_query { width:190px !important}
.grid-field-desc { font-size:8pt;color:#aaa;padding:4px 0}
.grid-map-location-component { margin-top:10px}
.grid-field-group{background:#c9c9c9;border-radius:4px;width:96%;margin:10px auto;padding:20px;font-size:13pt;}
#grid [class^="pe-7s-"], #grid [class*=" pe-7s-"],.grid-button [class^="pe-7s-"], .grid-button [class*=" pe-7s-"]{line-height:inherit}
.grid-search-box{float:left;margin-left:4px}
#grid .autolist{width:100%;margin-right:0}
#grid .autolist_box{right:0}
#grid_loading { padding:2% 0}
#grid_loading_percent { font-size:0.9em;line-height:1em;margin:1em auto auto auto;color:#999}
/*Grid-Sortable*/
	.grid-sortable { list-style-type: none; margin: auto;padding:20px;text-align:center}
  .grid-sortable .ui-sortable {margin: 1%; padding: 22px 4px 10px 4px; float: right; width: 23%;min-height:100px;height:auto; background:#fefefe; font-size: 9pt; text-align: center; border:1px dashed #aaa;border-radius:4px;position:relative}
	.grid-sortable .ui-sortable .item { padding: 20px 4px; float: right; width: 98%; background:#eee; font-size: 9pt; text-align: center; border:1px solid #888;border-radius:4px;/*position:absolute;right:1%;left:1%;z-index:1*/}
  .grid-sortable .ui-sortable.pool .item { margin: 1%; position:relative;right:auto;left:auto}
  .grid-sortable .ui-sortable .title {position: absolute;top: 4px;left: 4px;right:4px;width:auto;display:block;margin:auto;text-align:right;color:#999}
  .grid-sortable .ui-sortable .title .comment{color:#bbb;font-size:6pt;border-radius:4px;border:1px dotted #ddd;display:block;padding:4px;text-align:center;margin-top:4px;z-index:0}
  .grid-sortable .pool {width:100%}
  .grid-sortable .ui-sortable.pool .item {width:23%}
/**Analytic**/
.std_table.analytic th.icon { vertical-align:top}
.std_table.analytic th img { width:24px;height:24px; margin-bottom:16px; }
.std_table.analytic.geo th div.country_code{ font-size:1rem !important;}
.std_table.analytic.geo th img { width:auto;height:14px; margin-bottom:auto;margin-top: 0.6rem;border:1px solid #ddd;border-radius:3px}
.std_table.analytic th div.rotate90 { line-height: 1.6vh; font-size: 1.4vh !important;/*width: auto;display: inline-block;*/}
.std_table.analytic .titles { position: sticky; top: -12px; right: 0; left: 0; z-index: 1; }
.ana_full_link{font-weight:bold;font-size:8pt;color:#ffffff}
.pwa .std_table.analytic  {width:auto}
.pwa .std_table.analytic td{overflow:hidden !important;white-space:nowrap !important}
/*Dashboard*/
#dashboard_content { border-radius: 4px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), 0 0 0 1px rgba(63, 63, 68, 0.1); background-color: #FFFFFF; margin-bottom: 30px; direction:rtl}
.pwa #dashboard_content { box-shadow:none !important;background:none !important}
.wrapper { position: relative; top: 0; /*height: 100%;*/ }
.sidebar { position: absolute; top: 0; bottom: 0; right: 0; left: auto; width: 30vh; display: block; z-index: 1; color: #555;/*background:#fff;*/ font-weight: 200; background-size: cover; background-position: center center; }
  .sidebar .sidebar-wrapper { position: relative; /*max-height: calc(100vh - 75px); min-height: 100%;*/ overflow: auto; width: 30vh; z-index: 4; /*padding-bottom: 50px;*/border-left:1px solid #ddd !important;/*padding-bottom:8px;*/ }
  .pwa .sidebar,.pwa .sidebar .sidebar-wrapper { width:100%;}
  .sidebar .sidebar-background { position: absolute; z-index: 1; height: 100%; width: 100%; display: block; top: 0; left: 0; background-size: cover; background-position: center center; }
  .sidebar .logo {padding: 1vh 1vh 0.5vh 1vh;border-bottom: 1px solid rgba(255, 255, 255, 0.2); background:#fff}
  .sidebar .logo .user_photo { width:48px;height:48px;border:1px solid #ddd}
  .sidebar .info { padding:10px 6px 0 0}
  .sidebar .info h2,.sidebar .info h3{font-size:10pt !important; margin-top: 0px;margin-bottom: 0px;line-height:17px;width:90px;text-overflow: ellipsis;overflow: hidden;white-space: nowrap;}
  .sidebar .info a{ font-size:8pt !important}
  .sidebar .nav { /*margin-top: 20px;*/ float: none; }
  .sidebar .sub-nav { margin-top: 0; margin-right: 0 }
  .sidebar ul {padding:0}
  .sidebar .sidebar-wrapper > ul {border-top:1px solid #ddd !important;border-bottom:1px solid #ddd !important}
  .sidebar .sidebar-wrapper > ul li{border-bottom:1px solid #ddd}
  .sidebar .sidebar-wrapper > ul > li > ul > li:first-child{border-top:1px solid #ddd}
  .sidebar .sidebar-wrapper > ul li:last-child{border-bottom:none}
  .sidebar li,.sidebar .nav-pad{opacity:0.85;background:#fff}
  .sidebar .nav-pad{height:3vh}
  .sidebar ul ul .nav-pad{border-bottom:1px solid #ddd}
  .sidebar .nav>li>a{padding:4px 10px}
  .sidebar .nav .open > a,
  .sidebar .nav li.dropdown .dropdown-menu li:hover > a,
  .sidebar .nav li:hover > a { background-color: #f9f9f9; opacity: 1; }
  .sidebar .nav li > a { color: #555; /*margin: 1px 15px; opacity: .86; border-radius: 4px;*/ display: block}
  .sidebar .nav li > ul > li a {padding-right:3vh}
  .sidebar .nav li > ul ul li a{padding-right:6vh}
  .sidebar .sub-nav li > a { padding: 4px 12px; }
  .sidebar .nav li.active > a { /*color: #fff;*/ opacity: 1; background: #f1f1f1; }
  .sidebar .nav > ul >li:hover { background: #f9f9f9; }
  .sidebar .nav li.separator { margin: 15px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.2); }
  .sidebar .nav li.separator + li { margin-top: 31px; }
  .sidebar .nav p { margin: 0; line-height: 4vh !important; font-size: 1.8vh !important; font-weight: 400; /*text-transform: uppercase; margin-right: 45px;*/ text-align: right}
  .sidebar .nav i { font-size: 3.5vh !important; float: right; /*margin-left: 15px;*/ line-height: 4vh !important; width: 4vh; height: 4vh; text-align: center;color:#333 !important; background:none !important;/*border-radius:50%;*/margin-left:4px}
  /*.sidebar .nav i.orange { background:#ff8d1c !important; }
  .sidebar .nav i.green { background:#4cd966 !important; }
  .sidebar .nav i.red { background:#ff3b2f !important; }
  .sidebar .nav i.gray { background:#8f8e96 !important; }
  .sidebar .nav i.purple { background:#5855d6 !important; }*/
  .sidebar .nav .caret { margin-top: 13px; position: absolute; right: 30px; }
  .sidebar:after, .sidebar:before { display: block; content: ""; position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 2; }

.dashboard-home-link-pwa{display:none !important}
.pwa .dashboard-home-link{display:none !important}
.pwa .dashboard-home-link-pwa{display:block !important}

.main-panel { position: relative; z-index: 2; float: left; width: calc(100% - 30vh); padding: 15px 0 0 15px;}
  .pwa .main-panel { display:none}
  .pwa .main-panel ,.pwa .main-panel .container-fluid{ width:100%;padding:0}
  .main-panel > .content { padding: 30px 15px; min-height: calc(100% - 123px); }
  .main-panel > .footer { border-top: 1px solid #e7e7e7; }
  .main-panel .navbar { margin-bottom: 0; }
.sidebar,
.main-panel { /*max-height: 100%; height: 100%;*/ -webkit-transition-property: top,bottom; transition-property: top,bottom; -webkit-transition-duration: .2s,.2s; transition-duration: .2s,.2s; -webkit-transition-timing-function: linear,linear; transition-timing-function: linear,linear; -webkit-overflow-scrolling: touch; }
/*Paper*/
.view,.view * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
.view { width: 316px; height: 216px; margin: auto; position: relative; border: 8px solid #fff; box-shadow: 1px 1px 2px rgba(0,0,0,0.05); background: #333; -webkit-perspective: 500px; -moz-perspective: 500px; -o-perspective: 500px; -ms-perspective: 500px; perspective: 500px; direction: ltr !important; }
  .view .title { position: absolute; top: 5px; left: 5px; background: #000; z-index: 1000; color: #eee; font-size: 9pt; padding: 5px 10px; opacity: 0.7; cursor: default; }
  .view .slice { width: 60px; height: 100%; z-index: 100; -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; -o-transform-style: preserve-3d; -ms-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform-origin: left center; -moz-transform-origin: left center; -o-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center; -webkit-transition: -webkit-transform 150ms ease-in-out; -moz-transition: -moz-transform 150ms ease-in-out; -o-transition: -o-transform 150ms ease-in-out; -ms-transition: -ms-transform 150ms ease-in-out; transition: transform 150ms ease-in-out; }
  .view div.view-back { width: 50%; height: 100%; position: absolute; right: 0; background: #666; z-index: 0; }
.view-back span { display: block; float: right; padding: 5px 10px 5px; width: 100%; text-align: right; font-size: 14px; color: rgba(255,255,255,0.6); }
  .view-back span:first-child { padding-top: 20px; }
.view-back a.more { display: block; font-size: 18px; color: rgba(255,255,255,0.4); position: absolute; right: 10px; bottom: 15px; border: 2px solid rgba(255,255,255,0.3); border-radius: 50%; width: 30px; height: 30px; line-height: 22px; text-align: center; font-weight: 700; background: url(../img/go.png) no-repeat center center; }
/*.view-back a.edit { display: block; font-size: 18px; color: rgba(255,255,255,0.4); position: absolute; right: 10px; bottom: 50px; border: 2px solid rgba(255,255,255,0.3); border-radius: 50%; width: 30px; height: 30px; line-height: 22px; text-align: center; font-weight: 700; background: url(../../img/special_design/edit.png) no-repeat center center; }*/
  .view-back a.more:hover, .view-back a.edit:hover { color: #fff; border-color: #fff; }
.view-back span[data-icon]:before { content: attr(data-icon); font-family: 'icons'; color: #aaa; color: rgba(255,255,255,0.2); text-shadow: 0 0 1px rgba(255,255,255,0.2); padding-right: 5px; }
.view-back span.like[data-icon]:before { cursor: pointer; }
.view-back span.like:hover[data-icon]:before { color: #c6186e; }
.view .s2,
.view .s3,
.view .s4,
.view .s5 { -webkit-transform: translate3d(60px,0,0); -moz-transform: translate3d(60px,0,0); -o-transform: translate3d(60px,0,0); -ms-transform: translate3d(60px,0,0); transform: translate3d(60px,0,0); }
.view .s1 { background-position: 0px 0px; }
.view .s2 { background-position: -60px 0px; }
.view .s3 { background-position: -120px 0px; }
.view .s4 { background-position: -180px 0px; }
.view .s5 { background-position: -240px 0px; }
.view .overlay { width: 60px; height: 100%; opacity: 0; position: absolute; -webkit-transition: opacity 150ms ease-in-out; -moz-transition: opacity 150ms ease-in-out; -o-transition: opacity 150ms ease-in-out; -ms-transition: opacity 150ms ease-in-out; transition: opacity 150ms ease-in-out; }
.view:hover .overlay { opacity: 1; }
.view img { position: absolute; z-index: 0; -webkit-transition: left 0.3s ease-in-out; -o-transition: left 0.3s ease-in-out; -moz-transition: left 0.3s ease-in-out; -ms-transition: left 0.3s ease-in-out; transition: left 0.3s ease-in-out; }
.multiple2 { height: 316px; }
.multiple3 { height: 416px; }
.view .slice { background-size: 500% 100% !important; }
/*@media only screen and (max-width:1024px) {
    .view .slice { width: 150px !important; }
    .view .overlay { width: 150px !important; }

    .view .s2,
    .view .s3,
    .view .s4,
    .view .s5 { -webkit-transform: translate3d(149px,0,0); -moz-transform: translate3d(149px,0,0); -o-transform: translate3d(149px,0,0); -ms-transform: translate3d(149px,0,0); transform: translate3d(149px,0,0); }
    .view .s1 { background-position: 0px 0px !important; }
    .view .s2 { background-position: -150px 0px !important; }
    .view .s3 { background-position: -300px 0px !important; }
    .view .s4 { background-position: -450px 0px !important; }
    .view .s5 { background-position: -600px 0px !important; }

    .view:hover .s2 { -webkit-transform: translate3d(149px,0,0) rotate3d(0,1,0,-45deg) !important; -moz-transform: translate3d(149px,0,0) rotate3d(0,1,0,-45deg) !important; -o-transform: translate3d(149px,0,0) rotate3d(0,1,0,-45deg) !important; -ms-transform: translate3d(149px,0,0) rotate3d(0,1,0,-45deg) !important; transform: translate3d(149px,0,0) rotate3d(0,1,0,-45deg) !important; }
    .view:hover .s3,
    .view:hover .s5 { -webkit-transform: translate3d(149px,0,0) rotate3d(0,1,0,90deg) !important; -moz-transform: translate3d(149px,0,0) rotate3d(0,1,0,90deg) !important; -o-transform: translate3d(149px,0,0) rotate3d(0,1,0,90deg) !important; -ms-transform: translate3d(149px,0,0) rotate3d(0,1,0,90deg) !important; transform: translate3d(149px,0,0) rotate3d(0,1,0,90deg) !important; }
    .view:hover .s4 { -webkit-transform: translate3d(149px,0,0) rotate3d(0,1,0,-90deg) !important; -moz-transform: translate3d(149px,0,0) rotate3d(0,1,0,-90deg) !important; -o-transform: translate3d(149px,0,0) rotate3d(0,1,0,-90deg) !important; -ms-transform: translate3d(149px,0,0) rotate3d(0,1,0,-90deg) !important; transform: translate3d(149px,0,0) rotate3d(0,1,0,-90deg) !important; }
}*/
.view.effect1:hover .s2{
	-webkit-transform: translate3d(59px,0,0) rotate3d(0,1,0,-45deg);
	-moz-transform: translate3d(59px,0,0) rotate3d(0,1,0,-45deg);
	-o-transform: translate3d(59px,0,0) rotate3d(0,1,0,-45deg);
	-ms-transform: translate3d(59px,0,0) rotate3d(0,1,0,-45deg);
	transform: translate3d(59px,0,0) rotate3d(0,1,0,-45deg);
}
.view.effect1:hover .s3,
.view.effect1:hover .s5{
	-webkit-transform: translate3d(59px,0,0) rotate3d(0,1,0,90deg);
	-moz-transform: translate3d(59px,0,0) rotate3d(0,1,0,90deg);
	-o-transform: translate3d(59px,0,0) rotate3d(0,1,0,90deg);
	-ms-transform: translate3d(59px,0,0) rotate3d(0,1,0,90deg);
	transform: translate3d(59px,0,0) rotate3d(0,1,0,90deg);
}
.view.effect1:hover .s4{
	-webkit-transform: translate3d(59px,0,0) rotate3d(0,1,0,-90deg);
	-moz-transform: translate3d(59px,0,0) rotate3d(0,1,0,-90deg);
	-o-transform: translate3d(59px,0,0) rotate3d(0,1,0,-90deg);
	-ms-transform: translate3d(59px,0,0) rotate3d(0,1,0,-90deg);
	transform: translate3d(59px,0,0) rotate3d(0,1,0,-90deg);
}

.view.effect1 .s1 > .overlay {
	background: -moz-linear-gradient(right, rgba(0,0,0,0.05) 0%, rgba(0,0,0,0) 100%);
	background: -webkit-linear-gradient(right, rgba(0,0,0,0.05) 0%,rgba(0,0,0,0) 100%);
	background: -o-linear-gradient(right, rgba(0,0,0,0.05) 0%,rgba(0,0,0,0) 100%);
	background: -ms-linear-gradient(right, rgba(0,0,0,0.05) 0%,rgba(0,0,0,0) 100%);
	background: linear-gradient(right, rgba(0,0,0,0.05) 0%,rgba(0,0,0,0) 100%);
}

.view.effect1 .s2 > .overlay {
	background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255, 255, 255, 0.2) 100%);
	background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255, 255, 255, 0.2) 100%);
	background: -o-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255, 255, 255, 0.2) 100%);
	background: -ms-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255, 255, 255, 0.2) 100%);
	background: linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255, 255, 255, 0.2) 100%);
}

.view.effect1 .s3 > .overlay {
	background: -moz-linear-gradient(right, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.2) 100%);
	background: -webkit-linear-gradient(right, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.2) 100%);
	background: -o-linear-gradient(right, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.2) 100%);
	background: -ms-linear-gradient(right, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.2) 100%);
	background: linear-gradient(right, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.2) 100%);
}

.view.effect1 .s4 > .overlay {
	background: -moz-linear-gradient(left, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0) 100%);
	background: -webkit-linear-gradient(left, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0) 100%);
	background: -o-linear-gradient(left, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0) 100%);
	background: -ms-linear-gradient(left, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0) 100%);
	background: linear-gradient(left, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0) 100%);
}

.view.effect1 .s5 > .overlay {
	background: -moz-linear-gradient(left, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0) 100%);
	background: -webkit-linear-gradient(left, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%);
	background: -o-linear-gradient(left, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%);
	background: -ms-linear-gradient(left, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%);
	background: linear-gradient(left, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%);
}
.view.effect2 {
	-webkit-perspective: 800px;
	-moz-perspective: 800px;
	-o-perspective: 800px;
	-ms-perspective: 800px;
	perspective: 800px;
}
.view.effect2:hover .s1{
	-webkit-transition-delay: 200ms;
	-moz-transition-delay: 200ms;
	-o-transition-delay: 200ms;
	-ms-transition-delay: 200ms;
	transition-delay: 200ms;

	-webkit-transform: rotate3d(0,1,0,-3deg);
	-moz-transform: rotate3d(0,1,0,-3deg);
	-o-transform: rotate3d(0,1,0,-3deg);
	-ms-transform: rotate3d(0,1,0,-3deg);
	transform: rotate3d(0,1,0,-3deg);
}
.view.effect2:hover .s2{
	-webkit-transition-delay: 150ms;
	-moz-transition-delay: 150ms;
	-o-transition-delay: 150ms;
	-ms-transition-delay: 150ms;
	transition-delay: 150ms;

	-webkit-transform: translate3d(59px,0,0) rotate3d(0,1,0,-10deg);
	-moz-transform: translate3d(59px,0,0) rotate3d(0,1,0,-10deg);
	-o-transform: translate3d(59px,0,0) rotate3d(0,1,0,-10deg);
	-ms-transform: translate3d(59px,0,0) rotate3d(0,1,0,-10deg);
	transform: translate3d(59px,0,0) rotate3d(0,1,0,-10deg);
}
.view.effect2:hover .s3{
	-webkit-transition-delay: 100ms;
	-moz-transition-delay: 100ms;
	-o-transition-delay: 100ms;
	-ms-transition-delay: 100ms;
	transition-delay: 100ms;

	-webkit-transform: translate3d(59px,0,0) rotate3d(0,1,0,-16deg);
	-moz-transform: translate3d(59px,0,0) rotate3d(0,1,0,-16deg);
	-o-transform: translate3d(59px,0,0) rotate3d(0,1,0,-16deg);
	-ms-transform: translate3d(59px,0,0) rotate3d(0,1,0,-16deg);
	transform: translate3d(59px,0,0) rotate3d(0,1,0,-16deg);
}
.view.effect2:hover .s4{
	-webkit-transition-delay: 50ms;
	-moz-transition-delay: 50ms;
	-o-transition-delay: 50ms;
	-ms-transition-delay: 50ms;
	transition-delay: 50ms;

	-webkit-transform: translate3d(59px,0,0) rotate3d(0,1,0,-30deg);
	-moz-transform: translate3d(59px,0,0) rotate3d(0,1,0,-30deg);
	-o-transform: translate3d(59px,0,0) rotate3d(0,1,0,-30deg);
	-ms-transform: translate3d(59px,0,0) rotate3d(0,1,0,-30deg);
	transform: translate3d(59px,0,0) rotate3d(0,1,0,-30deg);
}
.view.effect2:hover .s5{
	-webkit-transform: translate3d(60px,0,0) rotate3d(0,1,0,-42deg);
	-moz-transform: translate3d(60px,0,0) rotate3d(0,1,0,-42deg);
	-o-transform: translate3d(60px,0,0) rotate3d(0,1,0,-42deg);
	-ms-transform: translate3d(60px,0,0) rotate3d(0,1,0,-42deg);
	transform: translate3d(60px,0,0) rotate3d(0,1,0,-42deg);
}

.view.effect2 .s4 > .overlay {
	background: -moz-linear-gradient(right, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0) 100%);
	background: -webkit-linear-gradient(right, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%);
	background: -o-linear-gradient(right, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%);
	background: -ms-linear-gradient(right, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%);
	background: linear-gradient(right, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%);
}

.view.effect2 .s5 > .overlay {
	background: -moz-linear-gradient(left, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0) 100%);
	background: -webkit-linear-gradient(left, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%);
	background: -o-linear-gradient(left, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%);
	background: -ms-linear-gradient(left, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%);
	background: linear-gradient(left, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%);
}

.view.effect2 div.view-back{
	background: #0a0a0a;
	background: -moz-linear-gradient(left, #0a0a0a 0%, #666666 100%);
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,#0a0a0a), color-stop(100%,#666666));
	background: -webkit-linear-gradient(left, #0a0a0a 0%,#666666 100%);
	background: -o-linear-gradient(left, #0a0a0a 0%,#666666 100%);
	background: -ms-linear-gradient(left, #0a0a0a 0%,#666666 100%);
	background: linear-gradient(left, #0a0a0a 0%,#666666 100%);
}
.view.effect3 {
	-webkit-perspective: 1000px;
	-moz-perspective: 1000px;
	-o-perspective: 1000px;
	-ms-perspective: 1000px;
	perspective: 1000px;
}

.view.effect3:hover .s1{
	-webkit-transform: rotate3d(0,1,0,-55deg);
	-moz-transform: rotate3d(0,1,0,-55deg);
	-o-transform: rotate3d(0,1,0,-55deg);
	-ms-transform: rotate3d(0,1,0,-55deg);
	transform: rotate3d(0,1,0,-55deg);
}

.view.effect3:hover .s2,
.view.effect3:hover .s5{
	-webkit-transform: translate3d(59px,0,0) rotate3d(0,1,0,20deg);
	-moz-transform: translate3d(59px,0,0) rotate3d(0,1,0,20deg);
	-o-transform: translate3d(59px,0,0) rotate3d(0,1,0,20deg);
	-ms-transform: translate3d(59px,0,0) rotate3d(0,1,0,20deg);
	transform: translate3d(59px,0,0) rotate3d(0,1,0,20deg);
}

.view.effect3:hover .s3{
	-webkit-transform: translate3d(59px,0,0) rotate3d(0,1,0,30deg);
	-moz-transform: translate3d(59px,0,0) rotate3d(0,1,0,30deg);
	-o-transform: translate3d(59px,0,0) rotate3d(0,1,0,30deg);
	-ms-transform: translate3d(59px,0,0) rotate3d(0,1,0,30deg);
	transform: translate3d(59px,0,0) rotate3d(0,1,0,30deg);
}

.view.effect3:hover .s4{
	-webkit-transform: translate3d(59px,0,0) rotate3d(0,1,0,40deg);
	-moz-transform: translate3d(59px,0,0) rotate3d(0,1,0,40deg);
	-o-transform: translate3d(59px,0,0) rotate3d(0,1,0,40deg);
	-ms-transform: translate3d(59px,0,0) rotate3d(0,1,0,40deg);
	transform: translate3d(59px,0,0) rotate3d(0,1,0,40deg);
}

.view.effect3 .s1 > .overlay {
	background: -moz-linear-gradient(left, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0) 100%);
	background: -webkit-linear-gradient(left, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%);
	background: -o-linear-gradient(left, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%);
	background: -ms-linear-gradient(left, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%);
	background: linear-gradient(left, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%);
}

.view.effect3 .s5 > .overlay {
	background: -moz-linear-gradient(right, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0) 100%);
	background: -webkit-linear-gradient(right, rgba(0,0,0,0.4) 0%,rgba(0,0,0,0) 100%);
	background: -o-linear-gradient(right, rgba(0,0,0,0.4) 0%,rgba(0,0,0,0) 100%);
	background: -ms-linear-gradient(right, rgba(0,0,0,0.4) 0%,rgba(0,0,0,0) 100%);
	background: linear-gradient(right, rgba(0,0,0,0.4) 0%,rgba(0,0,0,0) 100%);
}
.view.effect4 {
	-webkit-perspective: 1050px;
	-moz-perspective: 1050px;
	-o-perspective: 1050px;
	-ms-perspective: 1050px;
	perspective: 1050px;
}

.view.effect4 div {
	-webkit-transition: all 150ms ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

.view.effect4:hover .s3{
	-webkit-transform: translate3d(59px,0,0) rotate3d(0,1,0,-55deg);
	-moz-transform: translate3d(59px,0,0) rotate3d(0,1,0,-55deg);
	-o-transform: translate3d(59px,0,0) rotate3d(0,1,0,-55deg);
	-ms-transform: translate3d(59px,0,0) rotate3d(0,1,0,-55deg);
	transform: translate3d(59px,0,0) rotate3d(0,1,0,-55deg);
}

.view.effect4:hover .s4{
	-webkit-transform: translate3d(59px,0,0) rotate3d(0,1,0,110deg);
	-moz-transform: translate3d(59px,0,0) rotate3d(0,1,0,110deg);
	-o-transform: translate3d(59px,0,0) rotate3d(0,1,0,110deg);
	-ms-transform: translate3d(59px,0,0) rotate3d(0,1,0,110deg);
	transform: translate3d(59px,0,0) rotate3d(0,1,0,110deg);
}

.view.effect4:hover .s5{
	-webkit-transform: translate3d(59px,0,0) rotate3d(0,1,0,-110deg);
	-moz-transform: translate3d(59px,0,0) rotate3d(0,1,0,-110deg);
	-o-transform: translate3d(59px,0,0) rotate3d(0,1,0,-110deg);
	-ms-transform: translate3d(59px,0,0) rotate3d(0,1,0,-110deg);
	transform: translate3d(59px,0,0) rotate3d(0,1,0,-110deg);
}

.view.effect4 .s2 > .overlay {
	background: -moz-linear-gradient(right, rgba(0,0,0,0.05) 0%, rgba(0,0,0,0) 100%);
	background: -webkit-linear-gradient(right, rgba(0,0,0,0.05) 0%,rgba(0,0,0,0) 100%);
	background: -o-linear-gradient(right, rgba(0,0,0,0.05) 0%,rgba(0,0,0,0) 100%);
	background: -ms-linear-gradient(right, rgba(0,0,0,0.05) 0%,rgba(0,0,0,0) 100%);
	background: linear-gradient(right, rgba(0,0,0,0.05) 0%,rgba(0,0,0,0) 100%);
}

.view.effect4 .s3 > .overlay {
	background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255, 255, 255, 0.2) 100%);
	background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255, 255, 255, 0.2) 100%);
	background: -o-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255, 255, 255, 0.2) 100%);
	background: -ms-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255, 255, 255, 0.2) 100%);
	background: linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255, 255, 255, 0.2) 100%);
}

.view.effect4 .s4 > .overlay {
	background: -moz-linear-gradient(right, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.2) 100%);
	background: -webkit-linear-gradient(right, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0.2) 100%);
	background: -o-linear-gradient(right, rgba(0,0,0,0.6) 0%,rgba(0,0,0,0.2) 100%);
	background: -ms-linear-gradient(right, rgba(0,0,0,0.6) 0%,rgba(0,0,0,0.2) 100%);
	background: linear-gradient(right, rgba(0,0,0,0.6) 0%,rgba(0,0,0,0.2) 100%);
}

.view.effect4 .s5 > .overlay {
	background: -moz-linear-gradient(left, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0) 100%);
	background: -webkit-linear-gradient(left, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0) 100%);
	background: -o-linear-gradient(left, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0) 100%);
	background: -ms-linear-gradient(left, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0) 100%);
	background: linear-gradient(left, rgba(0,0,0,0.8) 0%,rgba(0,0,0,0) 100%);
}

.view.effect4 div.view-back{
	background: #0a0a0a;
	background: -moz-linear-gradient(left, #0a0a0a 0%, #666666 100%);
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,#0a0a0a), color-stop(100%,#666666));
	background: -webkit-linear-gradient(left, #0a0a0a 0%,#666666 100%);
	background: -o-linear-gradient(left, #0a0a0a 0%,#666666 100%);
	background: -ms-linear-gradient(left, #0a0a0a 0%,#666666 100%);
	background: linear-gradient(left, #0a0a0a 0%,#666666 100%);
}
/*Hover_Effect*/
.view_hf { width: 300px; height: 200px; margin: auto; border: 5px solid #fff; overflow: hidden; position: relative; text-align: center; box-shadow: 0px 0px 5px #aaa; cursor: default; }
  .view_hf .mask, .view_hf .content { width: 300px; height: 200px; position: absolute; overflow: hidden; top: 0; left: 0;padding: 0; }
  .view_hf img { display: block; position: relative; }
  .view_hf a.info { background: url(../img/hover_effect/link.png) center no-repeat; display: inline-block; text-decoration: none; padding: 0; text-indent: -9999px; width: 20px; height: 20px; }
.effect1 img { opacity: 1; -moz-transform: scale(1,1); -webkit-transform: scale(1,1); -o-transform: scale(1,1); -ms-transform: scale(1,1); transform: scale(1,1); -webkit-transition: all 0.2s ease-in; -moz-transition: all 0.2s ease-in; -o-transition: all 0.2s ease-in; -ms-transition: all 0.2s ease-in; transition: all 0.2s ease-in; }
.effect1 .mask { opacity: 0; overflow: visible; border-color: rgba(0,0,0,0.7) transparent transparent transparent; border-style: solid; border-width: 150px; width: 0; height: 0; -moz-transform: translateY(-125px); -webkit-transform: translateY(-125px); -o-transform: translateY(-125px); -ms-transform: translateY(-125px); transform: translateY(-125px); -moz-transition: -moz-transform 0.2s 0.1s ease-out, opacity 0.3s ease-in-out; -webkit-transition: -webkit-transform 0.2s 0.1s ease-out, opacity 0.3s ease-in-out; -o-transition: -o-transform 0.2s 0.1s ease-out, opacity 0.3s ease-in-out; -ms-transition: -ms-transform 0.2s 0.1s ease-out, opacity 0.3s ease-in-out; transition: transform 0.2s 0.1s ease-out, opacity 0.3s ease-in-out; }
.effect1 a.info { opacity: 0; -moz-transform: translateY(-125px); -webkit-transform: translateY(-125px); -o-transform: translateY(-125px); -ms-transform: translateY(-125px); transform: translateY(-125px); -moz-transition: -moz-transform 0.3s ease-in, opacity 0.1s ease-in-out; -webkit-transition: -webkit-transform 0.3s ease-in, opacity 0.1s ease-in-out; -o-transition: -o-transform 0.3s ease-in, opacity 0.1s ease-in-out; -ms-transition: -ms-transform 0.3s ease-in, opacity 0.1s ease-in-out; transition: transform 0.3s ease-in, opacity 0.1s ease-in-out; }
.effect1:hover img { opacity: 0.7; -moz-transform: scale(2,2); -webkit-transform: scale(2,2); -o-transform: scale(2,2); -ms-transform: scale(2,2); transform: scale(2,2); }
.effect1:hover .mask { opacity: 1; -webkit-transform: translateY(0px); -moz-transform: translateY(0px); -o-transform: translateY(0px); -ms-transform: translateY(0px); transform: translateY(0px); }
.effect1:hover a.info { opacity: 1; -moz-transform: translateY(100px); -webkit-transform: translateY(100px); -o-transform: translateY(100px); -ms-transform: translateY(100px); transform: translateY(100px); }
.effect2 .mask { opacity: 0; overflow: visible; border: 0px solid rgba(0,0,0,0.7); -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; }
.effect2 a.info { position: relative; top: -10px; opacity: 0; -moz-transform: scale(0,0); -webkit-transform: scale(0,0); -o-transform: scale(0,0); -ms-transform: scale(0,0); transform: scale(0,0); -webkit-transition: -webkit-transform 0.2s 0.1s ease-in, opacity 0.1s ease-in-out; -moz-transition: -moz-transform 0.2s 0.1s ease-in, opacity 0.1s ease-in-out; -o-transition: -o-transform 0.2s 0.1s ease-in, opacity 0.1s ease-in-out; -ms-transition: -ms-transform 0.2s 0.1s ease-in, opacity 0.1s ease-in-out; transition: transform 0.2s 0.1s ease-in, opacity 0.1s ease-in-out; }
.effect2:hover .mask { opacity: 1; border: 100px solid rgba(0,0,0,0.7); }
.effect2:hover a.info { opacity: 1; -moz-transform: scale(1,1); -webkit-transform: scale(1,1); -o-transform: scale(1,1); -ms-transform: scale(1,1); transform: scale(1,1); -moz-transition-delay: 0.3s; -webkit-transition-delay: 0.3s; -o-transition-delay: 0.3s; -ms-transition-delay: 0.3s; transition-delay: 0.3s; }
.effect3 .mask { opacity: 0; overflow: visible; border: 100px solid rgba(0,0,0,0.7); -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; }
.effect3 a.info { position: relative; top: -10px; opacity: 0; -webkit-transition: opacity 0.5s 0s ease-in-out; -moz-transition: opacity 0.5s 0s ease-in-out; -o-transition: opacity 0.5s 0s ease-in-out; -ms-transition: opacity 0.5s 0s ease-in-out; transition: opacity 0.5s 0s ease-in-out; }
.effect3:hover .mask { opacity: 1; border: 100px solid rgba(0,0,0,0.7); }
.effect3:hover a.info { opacity: 1; -moz-transition-delay: 0.3s; -webkit-transition-delay: 0.3s; -o-transition-delay: 0.3s; -ms-transition-delay: 0.3s; transition-delay: 0.3s; }
.effect4 .mask { position: absolute; /* Center the mask */ top: 50px; left: 100px; cursor: pointer; border-radius: 50px; border-width: 50px; display: inline-block; height: 100px; width: 100px; border: 50px solid rgba(0, 0, 0, 0.7); -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; opacity: 1; visibility: visible; -moz-transform: scale(4); -webkit-transform: scale(4); -o-transform: scale(4); -ms-transform: scale(4); transform: scale(4); -moz-transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; }
.effect4:hover .mask { opacity: 0; border: 0px solid rgba(0,0,0,0.7); visibility: hidden; }
.effect5 img { opacity: 0.2; -moz-transition: all 0.3s ease-in; }
.effect5 .mask { cursor: pointer; opacity: 1; visibility: visible; border: 100px solid rgba(0,0,0,0.7); -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; -moz-transition: all 0.4s cubic-bezier(0.940, 0.850, 0.100, 0.620); }
.effect5:hover .mask { border: 0px double rgba(0,0,0,0.7); opacity: 0; visibility: hidden; }
.effect5:hover img { opacity: 1; }
/*Responsive*/
.pwa .module.auto-height { height:auto !important}
.pwa body,.pwa .module *,.pwa .module .title{font-size:1.8vh !important;line-height:3vh !important}
@media only screen and (max-width:1024px) {
  #page_content{margin-top:calc(1em + 10vh) !important}
  /*Window*/
  #m_wnd{right:2% !important;left:2% !important}
  #m_wnd{width:96% !important}
  /*Page*/
  #page_content{/*width:98% !important;*/height:auto !important;padding:0 1%}
  #page_content *{font-size:3vw;line-height:4vw}
  .module{display:block !important;position:relative !important;width:100% !important;top:auto !important;left:auto !important;right:auto !important;bottom:auto !important;margin:4px auto !important}
  .module .button,.module .label{display:block;margin:auto;width:100% !important;text-align:center}
  .module .label{display:table}
  .module .label a{display:table-cell;width:100%;text-align:center;vertical-align:middle}
  .module .button{background:#FFF}
  .module .album2,.module .album4,.module .album5{display:block !important;margin:auto !important}
  .ss_fit,.album2{width:100% !important}/*.album2 a img{height:auto !important}*/
  .vote_container{width:100% !important}
  .google_map iframe{width:100%}
  /*Header*/
  /*div.head{height:auto !important;margin-bottom:10px}
  div.head div.box{width:98% !important;padding:0 1%;height:100%}
  div.head a.fr{max-width:30% !important;width:30%;height:100%}
  div.head a.fr img{max-width:100% !important;max-height:100% !important;height:80%;top:10%;position:absolute}
  div.head img.logo { margin-top:0}
  div.head {position:relative;position: relative;height: 12vw !important;}
  .header-user-info { position:absolute;top:0;bottom:0;left:28vw;display:table;height:100%}
  .header-info,.header-info-phone { display:none}
  .header-info-second { display:inline-block}*/
  /*Footer*/
  /*div.footer{height:auto !important;margin-top:10px;padding:5px 0 !important}
  div.footer div.box{width:98% !important;padding:0 1%}
  .section_box .section{display:block !important;margin:0 5% !important}
  div.footer div.section{width:80% !important}
  div.footer *{font-size:4vw !important;line-height:5vw !important}
  div.footer .design_social a{margin-bottom:3vw !important;display:inline-block !important}
  div.footer div.design_social a.social{width:8vw !important;height:8vw !important;border-radius:50% !important}
  div.footer div.design_social a.social img{width:5vw !important;height:5vw !important}*/
  /*Vertical-Menu*/
  #v_menu_body a{font-size:4vw;line-height:5vw}
  #v_menu_body.open { width: 64vw}
  /*Menu*/
  #cssmenu{height:100% !important;clear:both !important;display:block !important;overflow:hidden;width:100% !important;position:absolute;top:12vw !important;left:0;bottom:0;right:0;z-index:1000;visibility: hidden;opacity: 0;transition: visibility 0s, opacity 0.2s linear;}
  #cssmenu > ul,#cssmenu .menu-box{display:none}
  #cssmenu.open {visibility: visible;opacity: 1;}
  #cssmenu.open > ul,#cssmenu.open .menu-box{display:block}
  #cssmenu > ul,#cssmenu .menu-box > ul{float:none !important}
  #cssmenu .has-sub ul a{width:auto;height:auto;text-align:right;padding-right:4vw !important}
  #cssmenu .shopping_cart_link img { width:9vw;height:auto;padding:2vw !important}
  #cssmenu ul{margin:0 !important;padding:0 !important}
  #cssmenu li{float:none !important;display:block !important;margin:0 !important;padding:0 !important;visibility:visible !important}
  /*#cssmenu li:hover{border-right:1px solid #999 !important}*/
  #cssmenu li a{padding:8px 5px !important;display:block !important;line-height:25px !important/*;border-radius:0 !important*/}
  #cssmenu li a:hover,#cssmenu li.active a
  #cssmenu li li a:hover,#cssmenu li li.active a{background:none !important}
  #cssmenu .has-sub ul{display:block !important;position:relative !important;margin:0 !important;padding:0 !important;visibility:visible !important;opacity:1 !important;right:0 !important}
  #cssmenu .has-sub ul a{padding-right:6vw !important}
  #cssmenu .has-sub ul ul a{padding-right:8vw !important}
  #cssmenu ul ul{position:relative !important;top:0 !important;margin:0 !important;padding-top:8px !important;width:100% !important;background:none !important;border:none !important;box-shadow:none !important}
  #cssmenu ul ul ul{display:block !important;position:relative !important;right:0 !important;top:0 !important;margin:0 !important;visibility:visible !important;opacity:1 !important}
  #cssmenu .active a,#cssmenu li:hover > a{border-top:none !important}
  #cssmenu .fl{float:none !important;display:block !important}
  #cssmenu .has-sub ul li a{background:none !important;border:none !important}
  #cssmenu li a,#cssmenu .has-sub ul li a{border-bottom:1px solid #aaa !important;background:none !important}
  #cssmenu li:last-child a{border-bottom:none}
  #cssmenu > ul > li > ul:before,
  #cssmenu > ul > li.active:after,
  #cssmenu > ul > li:hover:after{display:none !important}
  .search_box{display:block !important;float:none !important;height:auto !important;clear:both;width:100% !important;text-align:center !important;margin:8px auto !important}
  form.search{display:block !important;clear:both;margin:auto}
  .fixed_menu{position:relative;top:auto;left:auto;margin-top:auto !important}
  #cssmenu a span{font-size:4vw !important;display:inline-block !important;padding:2vw !important}
  input#q{/*width:40vw !important;padding:2vw !important*/}
  /*input#btn_search{width:5.6vw !important;height:5.6vw !important}*/
  /*body,.module *,.module .title{font-size:1.8vh !important;line-height:3vh !important}*/
}
/*Mini Color Picker*/
.minicolors { position: relative; }
.minicolors-swatch {
	position: absolute;
	vertical-align: middle;
	background: url(jquery.minicolors.png) -80px 0;
	border: solid 1px #ccc;
	cursor: text;
	padding: 0;
	margin: 0;
	display: inline-block;
}

.minicolors-swatch-color {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}

.minicolors input[type=hidden] + .minicolors-swatch {
	width: 28px;
	position: static;
	cursor: pointer;
}

/* Panel */
.minicolors-panel {
	position: absolute;
	width: 173px;
	height: 152px;
	background: white;
	border: solid 1px #CCC;
	box-shadow: 0 0 20px rgba(0, 0, 0, .2);
	z-index: 99999;
	-moz-box-sizing: content-box;
	-webkit-box-sizing: content-box;
	box-sizing: content-box;
	display: none;
}

.minicolors-panel.minicolors-visible {
	display: block;
}

/* Panel positioning */
.minicolors-position-top .minicolors-panel {
	top: -154px;
}

.minicolors-position-right .minicolors-panel {
	right: 0;
}

.minicolors-position-bottom .minicolors-panel {
	top: auto;
}

.minicolors-position-left .minicolors-panel {
	left: 0;
}

.minicolors-with-opacity .minicolors-panel {
	width: 194px;
}

.minicolors .minicolors-grid {
	position: absolute;
	top: 1px;
	left: 1px;
	width: 150px;
	height: 150px;
	background: url(jquery.minicolors.png) -120px 0;
	cursor: crosshair;
}

.minicolors .minicolors-grid-inner {
	position: absolute;
	top: 0;
	left: 0;
	width: 150px;
	height: 150px;
	background: none;
}

.minicolors-slider-saturation .minicolors-grid {
	background-position: -420px 0;
}

.minicolors-slider-saturation .minicolors-grid-inner {
	background: url(jquery.minicolors.png) -270px 0;
}

.minicolors-slider-brightness .minicolors-grid {
	background-position: -570px 0;
}

.minicolors-slider-brightness .minicolors-grid-inner {
	background: black;
}

.minicolors-slider-wheel .minicolors-grid {
	background-position: -720px 0;
}

.minicolors-slider,
.minicolors-opacity-slider {
	position: absolute;
	top: 1px;
	left: 152px;
	width: 20px;
	height: 150px;
	background: white url(jquery.minicolors.png) 0 0;
	cursor: row-resize;
}

.minicolors-slider-saturation .minicolors-slider {
	background-position: -60px 0;
}

.minicolors-slider-brightness .minicolors-slider {
	background-position: -20px 0;
}

.minicolors-slider-wheel .minicolors-slider {
	background-position: -20px 0;
}

.minicolors-opacity-slider {
	left: 173px;
	background-position: -40px 0;
	display: none;
}

.minicolors-with-opacity .minicolors-opacity-slider {
	display: block;
}

/* Pickers */
.minicolors-grid .minicolors-picker {
	position: absolute;
	top: 70px;
	left: 70px;
	width: 12px;
	height: 12px;
	border: solid 1px black;
	border-radius: 10px;
	margin-top: -6px;
	margin-left: -6px;
	background: none;
}

.minicolors-grid .minicolors-picker > div {
	position: absolute;
	top: 0;
	left: 0;
	width: 8px;
	height: 8px;
	border-radius: 8px;
	border: solid 2px white;
	-moz-box-sizing: content-box;
	-webkit-box-sizing: content-box;
	box-sizing: content-box;
}

.minicolors-picker {
	position: absolute;
	top: 0;
	left: 0;
	width: 18px;
	height: 2px;
	background: white;
	border: solid 1px black;
	margin-top: -2px;
	-moz-box-sizing: content-box;
	-webkit-box-sizing: content-box;
	box-sizing: content-box;
}

/* Inline controls */
.minicolors-inline {
	display: inline-block;
}

.minicolors-inline .minicolors-input {
	display: none !important;
}

.minicolors-inline .minicolors-panel {
	position: relative;
	top: auto;
	left: auto;
	box-shadow: none;
	z-index: auto;
	display: inline-block;
}

/* Default theme */
.minicolors-theme-default .minicolors-swatch {
	top: 5px;
	left: 5px;
	width: 18px;
	height: 18px;
}
.minicolors-theme-default.minicolors-position-right .minicolors-swatch {
	left: auto;
	right: 5px;
}
.minicolors-theme-default.minicolors {
	width: auto;
	display: inline-block;
}
.minicolors-theme-default .minicolors-input {
	height: 20px;
	width: auto;
	display: inline-block;
	padding-left: 26px;
}
.minicolors-theme-default.minicolors-position-right .minicolors-input {
	padding-right: 26px;
	padding-left: inherit;
}

/* Bootstrap theme */
.minicolors-theme-bootstrap .minicolors-swatch {
	top: 4px;
	left: 5px;
	width: 28px;
	height: 28px;
	border-radius: 3px;
}
.minicolors-theme-bootstrap.minicolors-position-right .minicolors-swatch {
	left: auto;
	right: 3px;
}
.minicolors-theme-bootstrap .minicolors-input {
	padding-left: 44px;
}
.minicolors-theme-bootstrap.minicolors-position-right .minicolors-input {
	padding-right: 44px;
	padding-left: 12px;
}
/*Wiki*/
.wiki-box,.wiki-file{padding: 1vh;}
.wiki_summary { float:left;border: 1px solid #a2a9b1;background-color: #f8f9fa;padding:4px;width:20%}
.wiki_summary .odd { background:#ebebd2;padding:4px}
.wiki_summary .even { background:#f8f9fa;padding:4px}
  .wiki_summary .product_img { margin:auto;display:block}
.wiki hr { border-color: #ccc; }
.wiki img{max-width:100%}
.wiki .module{background:none;width:100%}
.wiki h1,.wiki .sub-title{font-weight:bold}
.wiki .sub-title{color:#666;font-size:11pt;margin:40px 0 5px 0;display:block}
.wiki_content {float:right;width:80%;padding-left:20px;overflow:hidden }
.wiki .heads{border: 1px solid #a2a9b1;background-color: #f8f9fa;padding:7px;display:table;margin:15px 0;line-height:28px}
.wiki .heads a{width: 100%;overflow: hidden;white-space: nowrap;}
.pwa .wiki_summary{float: none; width: 100%;}
.pwa .wiki_content{float: none;width: 100%;margin-top: 4vh;}
/*Count Down Timer*/
#count_down_box{display:block;margin:8px auto 0 auto;padding:4px;direction:ltr}
  #count_down_box .section { display: inline-block; padding: .25em; margin: 0 1%; width: 25% !important; background-color: white; border: 1px solid black; border-radius: 3px; font-weight: bold; font-size: 2em; color:#333 }
  #count_down_box .section-desc{ display: inline-block; padding: .25em; margin: 0 1%; width: 25% !important; font-size: 1em; color:#666}
/*Bizup-Card*/
.slide-container { margin: auto; width: 450px; text-align: center; direction:ltr !important; }
.bizup-card-wrapper { padding-top: 40px; padding-bottom: 40px; direction:ltr !important}
  .bizup-card-wrapper:focus { outline: 0; }
.clash-card { background: white; width: 260px; display: inline-block; margin: auto; border-radius: 19px; position: relative; text-align: center; box-shadow: 0px 5px 30px -12px black, 0px 0px 30px -12px black; z-index: 9999; }
.clash-card__image { position: relative; height: 200px; margin-bottom: 35px; border-top-left-radius: 14px; border-top-right-radius: 14px; }
.clash-card__image--barbarian img { width: 300px; position: absolute; top: -35px; left: -35px; }
.clash-card__image--archer img { width: 400px; position: absolute; top: -34px; left: -37px; }
.clash-card__image--giant img { width: 340px; position: absolute; top: -30px; left: -25px; }
.clash-card__image--goblin img { width: 370px; position: absolute; top: -21px; left: -37px; }
  .clash-card__image--wizard img { width: 345px; position: absolute; top: -28px; left: -10px; }
.clash-card__level { text-transform: uppercase; font-size: 12px; font-weight: 700; margin-bottom: 3px; }
.clash-card__level--0 { color: #EC9B3B; }
.clash-card__level--1 { color: #EE5487; }
.clash-card__level--2 { color: #F6901A; }
.clash-card__level--3 { color: #82BB30; }
.clash-card__level--4 { color: #4FACFF; }
.clash-card__unit-name { font-size: 26px; color: black; font-weight: 900; margin-bottom: 5px; }
.clash-card__unit-description { padding: 20px; margin-bottom: 10px;direction:rtl}
.clash-card__unit-stats--0 { background: #EC9B3B;display:block }
.clash-card__unit-stats--1 { background: #EE5487;display:block }
.clash-card__unit-stats--2 { background: #F6901A;display:block }
.clash-card__unit-stats--3 { background: #82BB30;display:block }
.clash-card__unit-stats--4 { background: #4FACFF;display:block }
.clash-card__unit-stats--0:hover,.clash-card__unit-stats--1:hover,.clash-card__unit-stats--2:hover,.clash-card__unit-stats--3:hover,.clash-card__unit-stats--4:hover {color:#fff}
.clash-card__unit-stats { color: white; font-weight: 700; border-bottom-left-radius: 14px; border-bottom-right-radius: 14px; padding: 20px 15px; }
  .clash-card__unit-stats sup { position: absolute; bottom: 4px; font-size: 45%; margin-left: 2px; }
  .clash-card__unit-stats .stat-value { text-transform: uppercase; font-weight: 400; font-size: 12px}
  .clash-card__unit-stats .no-border { border-right: none; }
.clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
.slick-prev { left: 100px; z-index: 999; }
.slick-next { right: 100px; z-index: 999; }
/*Bizup-Card Slider*/
.slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; }
.slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0; }
  .slick-list:focus { outline: none; }
  .slick-list.dragging { cursor: pointer; cursor: hand; }
.slick-slider .slick-track,
.slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
.slick-track { position: relative; top: 0; left: 0; display: block; }
  .slick-track:before,
  .slick-track:after { display: table; content: ''; }
  .slick-track:after { clear: both; }
.slick-loading .slick-track { visibility: hidden; }
.slick-slide { display: none; float: left; height: 100%; min-height: 1px; }
[dir='rtl'] .slick-slide { float: right; }
.slick-slide img { display: block; }
.slick-slide.slick-loading img { display: none; }
.slick-slide.dragging img { pointer-events: none; }
.slick-initialized .slick-slide { display: block; }
.slick-loading .slick-slide { visibility: hidden; }
.slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; }
.slick-arrow.slick-hidden { display: none; }
/*Bizup-Card Slick Them*/
@charset 'UTF-8';
/*Bizup-Card Slider*/
.slick-loading .slick-list { background: #fff url('./ajax-loader.gif') center center no-repeat; }
/*Bizup-Card Icons*/
/*@font-face { font-family: 'slick'; font-weight: normal; font-style: normal; src: url('./fonts/slick.eot'); src: url('./fonts/slick.eot?#iefix') format('embedded-opentype'), url('./fonts/slick.woff') format('woff'), url('./fonts/slick.ttf') format('truetype'), url('./fonts/slick.svg#slick') format('svg'); }*/
/*Bizup-Card Arrows*/
.slick-prev,
.slick-next { font-size: 0; line-height: 0; position: absolute; top: 50%; display: block; width: 20px; height: 20px; padding: 0; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); cursor: pointer; color: #333; border: none; outline: none; background: none;border-radius:50% }
  .slick-prev:hover,
  .slick-prev:focus,
  .slick-next:hover,
  .slick-next:focus { color: transparent; outline: none; background: none; }
  .slick-prev:hover:before,
  .slick-prev:focus:before,
  .slick-next:hover:before,
  .slick-next:focus:before { opacity: 1; }
  .slick-prev.slick-disabled:before,
  .slick-next.slick-disabled:before { opacity: .25; }
  .slick-prev:before,
  .slick-next:before { font-family: 'Pe-icon-7-stroke' !important; font-size: 22px;font-weight:bold; line-height: 1; opacity: .75; color: #333; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale}
.slick-prev { left: 56px; }
[dir='rtl'] .slick-prev { right: -25px; left: auto; }
.slick-prev:before { content:"\e687" }
[dir='rtl'] .slick-prev:before { content:"\e685" }
.slick-next { right: 56px; }
[dir='rtl'] .slick-next { right: auto; left: -25px; }
.slick-next:before { content:"\e685" }
[dir='rtl'] .slick-next:before { content:"\e687" }
.slick-dotted.slick-slider { margin-bottom: 30px; }
.slick-dots { position: absolute; bottom: -25px; display: block; width: 100%; padding: 0; margin: 0; list-style: none; text-align: center; }
  .slick-dots li { position: relative; display: inline-block; width: 20px; height: 20px; margin: 0 5px; padding: 0; cursor: pointer; }
  .slick-dots li button { font-size: 0; line-height: 0; display: block; width: 20px; height: 20px; padding: 5px; cursor: pointer; color: transparent; border: 0; outline: none; background: transparent; }
  .slick-dots li button:hover,
  .slick-dots li button:focus { outline: none; }
  .slick-dots li button:hover:before,
  .slick-dots li button:focus:before { opacity: 1; }
  .slick-dots li button:before { font-family: 'slick'; font-size: 6px; line-height: 20px; position: absolute; top: 0; left: 0; width: 20px; height: 20px; content: '•'; text-align: center; opacity: .25; color: black; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
  .slick-dots li.slick-active button:before { opacity: .75; color: black; }
  /*dashboard-home*/
.pwa .pwa-section { display:block !important;float:none !important;width:100% !important}
  h1.bizup-dashboard-title{font-weight:bold;text-align:right;color:#222;font-size:10pt !important;display:block;margin: 8px 8px 2px 0 !important;padding-bottom:10px;border-bottom:1px solid #eee}
  h1.bizup-dashboard-title img{height:24px}
.dashboard-notification-box a { display:block;border-radius:4px;margin:8px auto;width:80%;background:#3691ff;color:#fff;padding:4px;text-align:center}
.dashboard-notification-box a:hover { background:#46a1ff}
.dashboard-notification-box a.disabled { background:#aaa;color:#fff}
.dashboard-notification-box a.disabled:hover { background:#a1a1a1}
.bizup-chart { width: 100%; overflow: hidden}
.bizup-chart table,.google-visualization-table-table { display:none;}
.bizup-chart .bizup-chart-box{margin:auto}
.bizup-chart *,.pie_chart *{font-size:1.4rem !important;}
.geoChart .google-visualization-tooltip { text-align:left;direction:ltr}
.bizup-dashboard-val { text-align:center;font-size:13pt !important;color:#3791fe;margin-top:8px}
/*Social Media*/
.media-item{width:32%;height:250px;float:right;background:#000;padding:0;margin:auto 1% 1% auto }
.media-item .album4_box,.media-item .album4_box a,.media-item .album4_box a img{min-width:100%;min-height:100%;border:none}
.media-item video{width:100%;min-height:100%}
@media only screen and (max-width:1024px) {
  .media-item{height:150px}
}
/*Library*/
.library-link{/*display:block;*/text-align:center;margin-top:4px}
/*Grid-Menu*/
.more{padding:8px;width:100px}
.more-menu {width: 200px;}
.more-btn,
.more-menu-btn {
    background: none;
    border: 0 none;
    line-height: normal;
    overflow: visible;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    width: 100%;
    text-align: right;
    outline: none;
    cursor: pointer;
}

#more-btn{text-align:left}
.more-dot {    background-color: #aab8c2;    margin: 0 auto;    display: inline-block;    width: 7px;    height: 7px;    margin-right: 1px;    border-radius: 50%;    transition: background-color 0.3s;}
.more-menu {
    position: absolute;
    /*top: 100%;*/
    left:4px;
    z-index: 900;
    float: left;
    padding: 5px 0;
    margin-top: 9px;
    background-color: #fff;
    border: 1px solid #ccd8e0;
    border-radius: 4px;
    box-shadow: 1px 1px 3px rgba(0,0,0,0.25);
    opacity: 0;
    -webkit-transform: translate(0, 15px) scale(.95);
    transform: translate(0, 15px) scale(.95);
    transition: transform 0.1s ease-out, opacity 0.1s ease-out;
    pointer-events: none;
}
.more-menu-caret {    position: absolute;    top: -10px;    left: 12px;    width: 18px;    height: 10px;    float: left;    overflow: hidden;}
.more-menu-caret-outer,
.more-menu-caret-inner {    position: absolute;    display: inline-block;    margin-left: -1px;    font-size: 0;    line-height: 1;}
.more-menu-caret-outer {    border-bottom: 10px solid #c1d0da;    border-left: 10px solid transparent;    border-right: 10px solid transparent;    height: auto;    left: 0;    top: 0;    width: auto;    }
.more-menu-caret-inner {    top: 1px;    left: 1px;    border-left: 9px solid transparent;    border-right: 9px solid transparent;    border-bottom: 9px solid #fff;}
.more-menu-items {    margin: 0;    list-style: none;    padding: 0;}
.more-menu-item {    display: block;}
.more-menu-btn {    min-width: 100%;    color: #66757f;    cursor: pointer;    display: block;    font-size: 13px;    line-height: 20px;    padding: 8px 10px;    position: relative;    white-space: nowrap;}
.more-menu-item:hover {    background-color: #489fe5;}
.more-menu-item:hover .more-menu-btn {    color: #fff;}
.more-btn:hover .more-dot,.show-more-menu .more-dot {    background-color: #516471;}
.show-more-menu .more-menu {    opacity: 1;    -webkit-transform: translate(0, 0) scale(1);    transform: translate(0, 0) scale(1);    pointer-events: auto;}
/* bizup-shop-card */
.make-3D-space { position: relative; perspective: 800px; width: 300px; height: 300px;transform-style: preserve-3d; transition: transform 5s; display: inline-block }
.make-3D-space.pwa-shop-card-active{height: calc(70vh - 100px) !important;}
.make-3D-space.pwa-shop-card-active .bizup-shop-card{height: 100% !important;}
.pwa .make-3D-space { display: block;width:100%;height:auto;}
.bizup-shop-card-front, .bizup-shop-card-back { width: 295px; height: 200px; background: #fff; position: absolute; left: -5px; top: -5px; text-align: center; -webkit-transition: all 100ms ease-out; -moz-transition: all 100ms ease-out; -o-transition: all 100ms ease-out; transition: all 100ms ease-out; }
.pwa .bizup-shop-card-front, .pwa .bizup-shop-card-back { width: calc(100% + 10px);height:calc(70vh - 100px)}
.bizup-shop-card-back { display: none; transform: rotateY( 180deg ); }
.bizup-shop-card.animate .bizup-shop-card-back, .bizup-shop-card.animate .bizup-shop-card-front,
.pwa .bizup-shop-card .bizup-shop-card-back,.pwa .bizup-shop-card .bizup-shop-card-front{ top: 0px; left: -1px; -webkit-transition: all 100ms ease-out; -moz-transition: all 100ms ease-out; -o-transition: all 100ms ease-out; transition: all 100ms ease-out; }
.bizup-shop-card-back { left:0px !important}
.bizup-shop-card-front img { height:100%}
/*.pwa .bizup-shop-card-front img { min-height:unset;height:auto;width:30%;float:right;}*/
.pwa .bizup-shop-card-front{ position:relative;width:23vh;height:auto;float:right;/*display:table-cell;vertical-align:middle;*/padding:2%;overflow:hidden;left:auto;right:auto;top:auto}
.pwa .bizup-shop-card-front img { min-height:unset;width:auto;height:88%;/*margin-top:0;display:inline-block*/border-radius:8px; object-fit: cover;max-width:100%}
.pwa .stats{width:calc(100% - 23vh);float:left}
.bizup-shop-card { background:#fff; width: 285px; height: 290px; position: absolute; top: 10px; left: 10px; overflow: hidden; border: 1px solid #f1f1f1; border-radius: 6px; transform-style: preserve-3d; -webkit-transition: 100ms ease-out; -moz-transition: 100ms ease-out; -o-transition: 100ms ease-out; transition: 100ms ease-out; }
.bizup-shop-card.animate{ top: 5px; left: 5px; width: 295px; height: 300px}
.pwa .bizup-shop-card { width: 96%;left:2%;right:2%;height:23vh !important;position:relative;margin-bottom:1vh}
div.bizup-shop-card.flip-10 { -webkit-transform: rotateY( -10deg ); -moz-transform: rotateY( -10deg ); -o-transform: rotateY( -10deg ); transform: rotateY( -10deg ); transition: 50ms ease-out; }
div.bizup-shop-card.flip90 { -webkit-transform: rotateY( 90deg ); -moz-transform: rotateY( 90deg ); -o-transform: rotateY( 90deg ); transform: rotateY( 90deg ); transition: 100ms ease-in; }
div.bizup-shop-card.flip190 { -webkit-transform: rotateY( 190deg ); -moz-transform: rotateY( 190deg ); -o-transform: rotateY( 190deg ); transform: rotateY( 190deg ); transition: 100ms ease-out; }
div.bizup-shop-card.flip180 { -webkit-transform: rotateY( 180deg ); -moz-transform: rotateY( 180deg ); -o-transform: rotateY( 180deg ); transform: rotateY( 180deg ); transition: 150ms ease-out; }
.bizup-shop-card.animate,
.pwa .bizup-shop-card{ /*top: 5px; left: 5px; width: 295px; height: 300px;*/ box-shadow: 0px 13px 21px -5px rgba(0, 0, 0, 0.3); -webkit-transition: 200ms ease-out; -moz-transition: 200ms ease-out; -o-transition: 200ms ease-out; transition: 200ms ease-out; }
.pwa .bizup-shop-card{ /*top: 5px; left: 10px;  width: calc(100% - 20px);*/box-shadow:none }
.stats-container { background: #fff; position: absolute; top: 180px; left: 0; width: 100%; height: 200px; padding: 2vh; text-align: right; -webkit-transition: all 200ms ease-out; -moz-transition: all 200ms ease-out; -o-transition: all 200ms ease-out; transition: all 200ms ease-out; }
.bizup-shop-card.animate .stats-container,.pwa .bizup-shop-card .stats-container { top: 162px; -webkit-transition: all 200ms ease-out; -moz-transition: all 200ms ease-out; -o-transition: all 200ms ease-out; transition: all 200ms ease-out; }
/*.pwa .bizup-shop-card .stats-container{top:calc(70vh - 138px) !important}*/
.pwa .bizup-shop-card .stats-container{position:relative;top:auto;height:100%}
.bizup-shop-card_name { font-size: 12pt; color: #393c45;height:16pt;display:block;position: relative;}
.bizup-shop-card_name .bizup-shop-card_name-animate{position: absolute;white-space: nowrap;transform: translateX(0);transition: 2s;}
.shop .slider_item .bizup-shop-card_name .bizup-shop-card_name-animate{transform: translateX(75px);}
.bizup-shop-card:hover .bizup-shop-card_name .bizup-shop-card_name-animate{transform: translateX(calc(100% - 250px));}
.shop .slider_item:hover  .bizup-shop-card_name .bizup-shop-card_name-animate{transform: translateX(calc(100% - 50px));}
.pwa .module .stats-container .bizup-shop-card_name span { font-size: 2.2vh !important;line-height: 3.5vh !important;}
.pwa .bizup-shop-card_name.force-one-line{overflow: visible !important;white-space: unset !important;}
.pwa .bizup-shop-card_name span{position:relative !important;overflow:visible !important;white-space:unset !important}
.stats-container p { font-size: 16px; color: #b1b1b3; padding: 2px 0 0 0; margin: 0 }
.stats-container .bizup-shop-card_title { float: left; color: #a2a2a2; font-size: 1.8vh; font-weight: 600; padding: 0/*2vh 0*/}
.pwa .stats-container { padding:4% 0 4% 4%}
.pwa .stats-container .bizup-shop-card_title { font-size: 2.5vh; }
.pwa .module .stats-container .bizup-shop-card_title .price { font-size: 2.2vh !important; position:absolute;bottom:1vh;left:1vh}
.image_overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #48daa1; opacity: 0; }
.pwa .image_overlay { display:none}
.bizup-shop-card.animate .image_overlay { opacity: 0.7; -webkit-transition: all 200ms ease-out; -moz-transition: all 200ms ease-out; -o-transition: all 200ms ease-out; transition: all 200ms ease-out; }
.bizup-shop-card-options { padding: 2px 0 0; position: absolute; left: 2vh; right: 2vh; bottom: 2vh; display: block; width: calc(100% - 4vh); font-size: 9pt }
.pwa .bizup-shop-card-options { left: 1vh; right: 1vh;  bottom: 5vh; width: calc(100% - 2vh); }
.pwa .module .bizup-shop-card-options a{ font-size: 2.2vh !important; }
.pwa .bizup-shop-card-options a{float:none;display:block;text-align:left}
  .bizup-shop-card-options strong { font-weight: 700; color: #393c45; font-size: 14px; }
  .bizup-shop-card-options span { color: #969699; font-size: 14px; /*display:block;*/ margin-bottom: 8px; }
.bizup-shop-card-options a { font-weight:bold;/*padding:0 0 2px 16px*/}
.bizup-shop-card-view_more_image { text-align:center;display:block}
.bizup-shop-card-view_details { position: absolute; top: 62px; left: 50%; margin-left: -85px; border: 2px solid #fff; color: #fff; font-size: 19px; text-align: center; text-transform: uppercase; font-weight: 700; padding: 10px 0; width: 172px; border-radius: 6px; opacity: 0; -webkit-transition: all 200ms ease-out; -moz-transition: all 200ms ease-out; -o-transition: all 200ms ease-out; transition: all 200ms ease-out; }
  .bizup-shop-card-view_details:hover { background: #fff; color: #48cfad; cursor: pointer; }
  .pwa .bizup-shop-card-view_details { display:none !important}
.bizup-shop-card.animate .bizup-shop-card-view_details { opacity: 1; width: 152px; font-size: 15px; margin-left: -75px; top: 65px; -webkit-transition: all 200ms ease-out; -moz-transition: all 200ms ease-out; -o-transition: all 200ms ease-out; transition: all 200ms ease-out; }
div.shadow { width: 295px; height: 420px; opacity: 0; position: absolute; top: 0; left: 0; z-index: 3; display: none; background: -webkit-linear-gradient(left,rgba(0,0,0,0.1),rgba(0,0,0,0.2)); background: -o-linear-gradient(right,rgba(0,0,0,0.1),rgba(0,0,0,0.2)); background: -moz-linear-gradient(right,rgba(0,0,0,0.1),rgba(0,0,0,0.2)); background: linear-gradient(to right, rgba(0,0,0,0.1), rgba(0,0,0,0.2)); }
.bizup-shop-card-back div.shadow { z-index: 10; opacity: 1; background: -webkit-linear-gradient(left,rgba(0,0,0,0.2),rgba(0,0,0,0.1)); background: -o-linear-gradient(right,rgba(0,0,0,0.2),rgba(0,0,0,0.1)); background: -moz-linear-gradient(right,rgba(0,0,0,0.2),rgba(0,0,0,0.1)); background: linear-gradient(to right, rgba(0,0,0,0.2), rgba(0,0,0,0.1)); }
.flip-back { position: absolute; top: 20px; right: 20px; width: 30px; height: 30px; cursor: pointer; }
.cx, .cy { background: #d2d5dc; position: absolute; width: 0px; top: 15px; right: 15px; height: 3px; -webkit-transition: all 250ms ease-in-out; -moz-transition: all 250ms ease-in-out; -ms-transition: all 250ms ease-in-out; -o-transition: all 250ms ease-in-out; transition: all 250ms ease-in-out; }
.flip-back:hover .cx, .flip-back:hover .cy { background: #979ca7; -webkit-transition: all 250ms ease-in-out; -moz-transition: all 250ms ease-in-out; -ms-transition: all 250ms ease-in-out; -o-transition: all 250ms ease-in-out; transition: all 250ms ease-in-out; }
.cx.s1, .cy.s1 { right: 0; width: 30px; -webkit-transition: all 100ms ease-out; -moz-transition: all 100ms ease-out; -ms-transition: all 100ms ease-out; -o-transition: all 100ms ease-out; transition: all 100ms ease-out; }
.cy.s2 { -ms-transform: rotate(50deg); -webkit-transform: rotate(50deg); transform: rotate(50deg); -webkit-transition: all 100ms ease-out; -moz-transition: all 100ms ease-out; -ms-transition: all 100ms ease-out; -o-transition: all 100ms ease-out; transition: all 100ms ease-out; }
.cy.s3 { -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); -webkit-transition: all 100ms ease-out; -moz-transition: all 100ms ease-out; -ms-transition: all 100ms ease-out; -o-transition: all 100ms ease-out; transition: all 100ms ease-out; }
.cx.s1 { right: 0; width: 30px; -webkit-transition: all 100ms ease-out; -moz-transition: all 100ms ease-out; -ms-transition: all 100ms ease-out; -o-transition: all 100ms ease-out; transition: all 100ms ease-out; }
.cx.s2 { -ms-transform: rotate(140deg); -webkit-transform: rotate(140deg); transform: rotate(140deg); -webkit-transition: all 100ms ease-out; -moz-transition: all 100ms ease-out; -ms-transition: all 100ease-out; -o-transition: all 100ms ease-out; transition: all 100ms ease-out; }
.cx.s3 { -ms-transform: rotate(135deg); -webkit-transform: rotate(135deg); transform: rotate(135deg); -webkit-transition: all 100ease-out; -moz-transition: all 100ms ease-out; -ms-transition: all 100ms ease-out; -o-transition: all 100ms ease-out; transition: all 100ms ease-out; }
.carousel { width: 100%; height: 400px; overflow: hidden; position: relative; }
  .carousel ul { position: absolute; top: 0; left: 0; padding: 0 }
  .carousel li { width: 295px; height: 320px; float: left; overflow: hidden; }
  .carousel li img { min-width: 100%; height: 100%; margin-top: -20px }
.pwa .carousel { height: 80vh;}
.pwa .carousel li{height:72vh}
.arrows-perspective { width: 100%; height: 55px; position: absolute; top: 120px; transform-style: preserve-3d; transition: transform 5s; perspective: 335px; }
.pwa .arrows-perspective { width: calc(100% - 9px);top:30vh ;height: 8vh}
.carouselPrev, .carouselNext { width: 50px; height: 55px; background: #ccc; position: absolute; top: 0; transition: all 200ms ease-out; opacity: 0.9; cursor: pointer; }
.pwa .carouselPrev, .pwa .carouselNext {top:-32px; height: 8vh;width: 6vh;}
.carouselNext { top: 0; right: -26px; -webkit-transform: rotateY( -117deg ); -moz-transform: rotateY( -117deg ); -o-transform: rotateY( -117deg ); transform: rotateY( -117deg ); transition: all 200ms ease-out; }
  .carouselNext.visible { right: 0; opacity: 0.8; background: #efefef; -webkit-transform: rotateY( 0deg ); -moz-transform: rotateY( 0deg ); -o-transform: rotateY( 0deg ); transform: rotateY( 0deg ); transition: all 200ms ease-out; }
.carouselPrev { left: -26px; top: 0; -webkit-transform: rotateY( 117deg ); -moz-transform: rotateY( 117deg ); -o-transform: rotateY( 117deg ); transform: rotateY( 117deg ); transition: all 200ms ease-out; }
  .carouselPrev.visible { left: 0; opacity: 0.8; background: #eee; -webkit-transform: rotateY( 0deg ); -moz-transform: rotateY( 0deg ); -o-transform: rotateY( 0deg ); transform: rotateY( 0deg ); transition: all 200ms ease-out; }
.carousel .x, .carousel .y { height: 2px; width: 15px; background: #48cfad; position: absolute; top: 31px; left: 17px; -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); }
.carousel .x { -ms-transform: rotate(135deg); -webkit-transform: rotate(135deg); transform: rotate(135deg); top: 21px; }
.carousel .carouselNext .x { -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); }
.carousel .carouselNext .y { -ms-transform: rotate(135deg); -webkit-transform: rotate(135deg); transform: rotate(135deg); }
/*.pwa .carousel .x { top:calc(6.5vh - 32px)}
.pwa .carousel .y { top:calc(6.5vh - 22px)}*/
.pwa .carouselPrev .x,.pwa .carouselPrev .y {left:12px}
.pwa .carouselNext .x,.pwa .carouselNext .y {left:15px}
/*.pwa .carouselNext .x,.pwa .carouselNext .y {right:10px}*/
/*Global Search*/
.global-search-box{/*border-radius: 4px;border: 1px solid #bbb;*/margin:4px auto;position:relative}
.global-search-box input#txt_global_search{border:none;width:100%;text-align:right;padding:6px;background: none;box-shadow: none;border: 1px solid #ddd;}
.global-search-box #btn_global_search{position:absolute;top:6px;left:8px;cursor:pointer}
.global-search-title{color:#666;padding:24px 8px 6px 8px}
.global-search-title sub{color:#AAA}
.global-search-box .autolist_box{top:30px;right:0}
.global-search-box .autolist { width: auto;position:initial;padding:0;margin: 0;}
/*bizup-loading*/
/*.bizup-loading-box { min-height:200px}
.bizup-loading { position: absolute; top: calc(50% - 40px); left: calc(50% - 32px); width: 64px; height: 64px; border-radius: 50%; perspective: 800px; }
.inner { position: absolute; box-sizing: border-box; width: 100%; height: 100%; border-radius: 50%; }
  .inner.one { left: 0%; top: 0%; animation: rotate-one 1s linear infinite; border-bottom: 3px solid #666; }
  .inner.two { right: 0%; top: 0%; animation: rotate-two 1s linear infinite; border-right: 3px solid #666; }
  .inner.three { right: 0%; bottom: 0%; animation: rotate-three 1s linear infinite; border-top: 3px solid #666; }
@keyframes rotate-one {
  0% { transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg); }
  100% { transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg); }
}
@keyframes rotate-two {
  0% { transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg); }
  100% { transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg); }
}
@keyframes rotate-three {
  0% { transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg); }
  100% { transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg); }
}*/
/** Bar_Graph **/
.bar_chart .bar-chart-tab { padding:10px;text-align:center}
.bar_chart .bar-chart-body { text-align:center}
.graph-container {
    position: relative; /* required Y axis stuff, Graph Holder's left and bottom sides to be positions properly */
    display: inline-block; /* display: table may also work.. */
    padding: 0; /* let the bars position themselves */
    list-style: none; /* we don't want to see any default <ul> markers */
	margin: 40px auto 0 auto;
	font-size: 0.8em;
    /* Graph Holder's Background */
    background-image: -webkit-linear-gradient(left , rgba(255, 255, 255, .3) 100%, transparent 100%);
    background-image: -moz-linear-gradient(left , rgba(255, 255, 255, .3) 100%, transparent 100%);
    background-image: -o-linear-gradient(left , rgba(255, 255, 255, .3) 100%, transparent 100%);
    background-image: -ms-linear-gradient(left , rgba(255, 255, 255, .3) 100%, transparent 100%);
    background-image: linear-gradient(left , rgba(255, 255, 255, .3) 100%, transparent 100%);
    background-repeat: no-repeat;
    background-position: 0 -2.5em;
}
.graph-container:before {
    position: absolute;
    content: "";

    bottom: 0;
    left: -1.25em; /* skew pushes it left, so we move it a bit in opposite direction */

    width: 100%; /* make sure it is as wide as the whole graph */

    height: 2.5em;
    background-color: rgba(183, 183, 183, 1);

    /* Make it look perspective */
    -webkit-transform: skew(-45deg);
    -moz-transform: skew(-45deg);
    -o-transform: skew(-45deg);
    -ms-transform: skew(-45deg);
    transform: skew(-45deg);
}
.graph-container:after {
    position: absolute;
    content: "";

    top: 1.25em; /* skew pushes it up so we move it down a bit */
    left: -2.5em;

    width: 2.5em;
    background-color: rgba(129, 129, 129, 0.4);

    /* Make it look perspective */
    -webkit-transform: skew(0deg, -45deg);
    -moz-transform: skew(0deg, -45deg);
    -o-transform: skew(0deg, -45deg);
    -ms-transform: skew(0deg, -45deg);
    transform: skew(0deg, -45deg);
}
  .graph-container > li { float: left; position: relative; }
    .graph-container > li:nth-last-child(2) { margin-right: 2.5em; }
    .graph-container > li > span { position: absolute; left: 0; bottom: -2em; width: 80%; text-align: center; font-weight: bold; text-shadow: 1px 1px 1px rgba(255,255,255,0.7); color: #777; font-size: 1.5em; }
    .graph-container > li:last-child { width: 100%; position: absolute; left: 0; bottom: 0; }
.graph-marker-container > li { position: absolute; left: -2.5em; bottom: 0; width: 100%; margin-bottom: 2.5em; list-style: none; }
.graph-marker-container > li:before,
.graph-marker-container > li:after {
    content: "";
    position: absolute;
    border-style: none none dotted;
    border-color: rgba(100, 100, 100, .15);
    border-width: 0 0 .15em;
    background: rgba(133, 133, 133, .15);
}
.graph-marker-container > li:before {
    width: 3.55em;
    height: 0;
    bottom: -1.22em;
    left: -.55em;
    z-index: 2; /* be above .graph-container:after */

    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
.graph-marker-container li:after {
    width: 100%;
    bottom: 0;
    left: 2.5em;
}
.graph-marker-container span {
    position: absolute;
	font-weight: bold;
	text-shadow: 1px 1px 1px rgba(255,255,255,0.7);
    top: 1em;
    left: -3.5em; /* just to push it away from the graph.. */
    width: 3.5em; /* give it absolute value of left offset */

    font-size: 1.5em;
}
.bar-wrapper {
    overflow: hidden;
}
.bar-container {
    position: relative;
    margin-top: 2.5em; /* should be at least equal to the top offset of background casing */
    /* because back casing is positioned higher than actual bar */
    width: 12.5em; /* required, we have to define the width of a bar */
}
.bar-container:before {
    content: "";
    position: absolute;
    z-index: 3; /* to be above .bar-inner */

    bottom: 0;
    right: 0;

    /* Use bottom border to shape triangle */
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 0 2.5em 2.5em;
    border-color: transparent transparent rgba(183,183,183,1);
}
.bar-background {
    width: 10em;
    height: 100%;
    position: absolute;
    top: -2.5em;
    left: 2.5em;
    z-index: 1; /* just for reference */
}
.bar-background:before,
.bar-background:after {
    content: "";
    position: absolute;
}
.bar-background:before {
    bottom: -2.5em;
    right: 1.25em;
    width: 10em;
    height: 2.5em;
	-webkit-backface-visibility: hidden;
    -webkit-transform: skew(-45deg);
    -moz-transform: skew(-45deg);
    -o-transform: skew(-45deg);
    -ms-transform: skew(-45deg);
    transform: skew(-45deg);
}
.bar-background:after {
    top: 1.25em;
    right: 10em;
    width: 2.5em;
    height: 100%;
	-webkit-backface-visibility: hidden;
    /* skew only the Y-axis */
    -webkit-transform: skew(0deg, -45deg);
    -moz-transform: skew(0deg, -45deg);
    -o-transform: skew(0deg, -45deg);
    -ms-transform: skew(0deg, -45deg);
    transform: skew(0deg, -45deg);
}
.bar-foreground {
    z-index: 3; /* be above .bar-background and .bar-inner */
}
.bar-foreground,
.bar-inner {
    position: absolute;
    width: 10em;
    height: 100%;
    top: 0;
    left: 0;
}
.bar-foreground:before,
.bar-foreground:after,
.bar-inner:before,
.bar-inner:after {
    content: "";
    position: absolute;
}
.bar-foreground:before,
.bar-inner:before {
    top: -1.25em;
    right: -2.5em;
    width: 2.5em;
    height: 100%;
    background-color: rgba(160, 160, 160, .27);

    -webkit-transform: skew(0deg, -45deg);
    -moz-transform: skew(0deg, -45deg);
    -o-transform: skew(0deg, -45deg);
    -ms-transform: skew(0deg, -45deg);
    transform: skew(0deg, -45deg);
}
.bar-foreground:after,
.bar-inner:after {
    top: -2.5em;
    right: -1.25em;
    width: 100%;
    height: 2.5em;
    background-color: rgba(160, 160, 160, .2);

    -webkit-transform: skew(-45deg);
    -moz-transform: skew(-45deg);
    -o-transform: skew(-45deg);
    -ms-transform: skew(-45deg);
    transform: skew(-45deg);
}
.bar-inner {
    z-index: 2; /* to be above .bar-background */
    top: auto; /* reset position top */
    background-color: rgba(5, 62, 123, .6);
    height: 0;
    bottom: -2.5em;
    color: transparent; /* hide text values */

    -webkit-transition: height 0.8s ease-out, bottom 0.8s ease-out;
    -moz-transition: height 0.8s ease-out, bottom 0.8s ease-out;
    -o-transition: height 0.8s ease-out, bottom 0.8s ease-out;
    -ms-transition: height 0.8s ease-out, bottom 0.8s ease-out;
    transition: height 0.8s ease-out, bottom 0.8s ease-out;
}
.bar-inner:before {
    background-color: rgba(5, 62, 123, .6);
}
.bar-inner:after {
    background-color: rgba(47, 83, 122, .7);
}
input[name^="fill-"] + label {
	display: inline-block;
	margin: 0px;
	width: 65px;
	padding: 0px 6px;
	color: #777;
	line-height: 20px;
	font-size: 13px;
	text-shadow: 1px 1px 1px #fff;
	border: 1px solid #fff;
	background: #ffffff; /* Old browsers */
	background: -moz-linear-gradient(top, #ffffff 0%, #f6f6f6 47%, #ededed 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(47%,#f6f6f6), color-stop(100%,#ededed)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* IE10+ */
	background: linear-gradient(top, #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* W3C */
	box-shadow: 0px 1px 1px rgba(0,0,0,0.3);
}
/* Bar Chart COLOR */
.graph-container.blue .bar-inner,
.graph-container.blue .bar-inner:before { background-color: rgba(5, 62, 123, .6); }
.graph-container.blue .bar-inner:after { background-color: rgba(47, 83, 122, .7); }
.graph-container.green .bar-inner,
.graph-container.green .bar-inner:before { background-color: rgba(5, 123, 5, .3); }
.graph-container.green .bar-inner:after { background-color: rgba(63, 122, 47, .4); }
.graph-container.yellow .bar-inner,
.graph-container.yellow .bar-inner:before { background-color: rgba(183, 186, 11, .3); }
.graph-container.yellow .bar-inner:after { background-color: rgba(183, 186, 47, .4); }
.graph-container.red .bar-inner,
.graph-container.red .bar-inner:before { background-color: rgba(123, 5, 5, .6); }
.graph-container.red .bar-inner:after { background-color: rgba(123, 60, 47, .7); }
/* Bar Chart SIZE */
.graph-container.small .bar-container,
.graph-container.small:after,
.graph-container.small > li:last-child { height: 10em; }
.graph-container.large .bar-container,
.graph-container.large:after,
.graph-container.large > li:last-child { height: 30em; }
/* VARIABLES */
.graph-container > li .bar-container { margin-right: 1.5em; }
.graph-container > li:first-child { margin-left: 1.5em; }
.graph-container > li:nth-last-child(2) .bar-container { margin-right: 1em; }
.bar-background { background-color: rgba(160, 160, 160, .1); }
  .bar-background:before { background-color: rgba(160, 160, 160, .2); }
  .bar-background:after { background-color: rgba(160, 160, 160, .05); }
.bar-foreground { background-color: rgba(160, 160, 160, .1); }
.button-label { font-weight: bold; color: #aaa; line-height: 40px; text-shadow: 1px 1px 1px rgba(255,255,255,0.8); display: inline; margin: 0 10px 0 20px; }
  .button-label:before { content: " "; white-space: wrap; }
.main span:first-of-type { margin-left: 0px; }
/* RESPONSIVENESS */
@media screen and (max-width: 1125px) {
  .graph-container { font-size: 0.7em; }
}
@media screen and (max-width: 1050px) {
	.graph-container{ font-size: 0.6em; }
}
@media screen and (max-width: 900px) {
	.button-label{ margin: 0 10px 0 0; }
	.button-label:before { content:"\A"; white-space: pre;  }
	.main { padding: 20px 20px 40px; }
}
@media screen and (max-width: 765px) {
	.graph-container { font-size: 0.5em; }
}
@media screen and (max-width: 720px) {
	.graph-container { font-size: 0.45em; }
}
@media screen and (max-width: 630px) {
	.graph-container { font-size: 0.32em; }
}
@media screen and (max-width: 360px) {
	.graph-container { font-size: 0.22em; }
	.button-label{ margin: 0 5px 0 0;}
}
/** Project Management (Module) **/
.project-management-summary { float:right;width:50%}
.project-management-title {margin-right:40px}
.project-management { position: relative; flex: 1; white-space: nowrap; overflow-x: visible; display: flex; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
  .project-management .card-list { position: relative; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; max-height: 100%; overflow: hidden; display: flex; flex-direction: column; justify-content: space-around; margin: 0.75rem; border-radius: 0.5rem; padding: 1rem; background: #dee2e6; width: 250px }
  .project-management .card { position: relative;margin-bottom:12px;max-height:105px;overflow:hidden; display: flex; flex-direction: column; min-width: 0; word-wrap: break-word; background-color: #fff; background-clip: border-box; border: 1px solid #dee2e6; border-radius: 0.5rem; }
    .project-management .card:hover { max-height:none}
  .project-management .dropdown { position: absolute; top: -6px; left: 0;  }
  .project-management .btn-options { float: left; padding-left: 8px; color: #6c757d; background: none; border: none; cursor: pointer; display: flex; align-items: center; font-size: 2.4rem; }
  .project-management h5, .project-management h6 { float: right; margin-bottom: 0.75rem; font-weight: 500; line-height: 1.2; color: #212529; font-size: 1.4rem; }
  .project-management h6 { font-size: 1.2rem; padding-right: 8px; }
  .project-management .dropdown-menu { min-width: 130px !important; }
  .project-management .dropdown-menu-left { left: 2px;margin-top:-5px }
  .project-management .dropdown-item { display: block; padding:5px;text-align:right }
  .project-management .dropdown-item:hover { background:#ddd}
  .project-management .new { font-weight: 400; color: #007bff; text-decoration: none; font-size: 1.275rem;margin:4px 8px 0 0}
  .project-management .users { margin: 1.55rem; }
    .project-management .users a { display: inline-block; margin-left: -1.25rem; }
    .project-management .users img { border-color: #fff; background: #fff; width: 3.075rem; height: 3.075rem; }
  .project-management .card .card-body > .desc { margin: 1.55rem; font-size: 1.1rem; line-height: 2rem; }
.completed-stamp {position:absolute;top:4px;left:4px }
/** Download (Module) **/
.download-link{display:block;text-align:center;margin-top:4px}
.download-cell{width:120px;height:150px;padding:0;display:inline-block;text-align:center;margin:0 8px;overflow:hidden}
.download-cell img{width:100%;display:block}
  .download-cell .desc {color:#000;margin-top:4px }
/** Animated Completed Circle **/
.completed_circle_box { display:inline;vertical-align:middle;*vertical-align:text-bottom;}
.easypiechart { position: relative; text-align: center; }
.easypiechart .h2 { margin-left: 2px; margin-top: 2px; }
  .easypiechart .h2, .easypiechart b { display: inline-block; font-weight:bold;line-height: unset !important;}
  .easypiechart.without-text .h2, .easypiechart.without-text b { margin-top: 5%;}
.easypiechart canvas { position: absolute; top: 0; left: 0; }
.easypiechart .easypie-text { position: absolute; z-index: 1; line-height: 1; font-size: 60%; font-weight:bold; width: 100%; top: 62%}
.easypiechart img { margin-top: -4px; }
/** Notification **/
.ncf-container{font-size:14px;box-sizing:border-box;position:fixed;z-index:999999}
.ncf-container.nfc-top-left{top:2vh;left:2vh}
.ncf-container.nfc-top-right{top:2vh;right:2vh}
.ncf-container.nfc-bottom-right{bottom:2vh;right:2vh}
.ncf-container.nfc-bottom-left{bottom:2vh;left:2vh}
@media (max-width:767px){.ncf-container{left:0;right:0}}
.ncf-container .ncf{background:#fff;transition:.3s ease;position:relative;pointer-events:auto;overflow:hidden;margin:0 0 6px;padding:30px;width:300px;border-radius:3px 3px 3px 3px;box-shadow:0 0 12px #999;color:#000;opacity:.9;-ms-filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=90);filter:alpha(opacity=90);background-position:15px !important;background-repeat:no-repeat!important;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
.ncf-container .ncf:hover{box-shadow:0 0 12px #000;opacity:1;cursor:pointer}
.ncf-container .ncf .ncf-title{font-weight:bold;font-size:2.2vh;text-align:left;margin-top:0;margin-bottom:1vh;word-wrap:break-word}
.ncf-container .ncf .nfc-message{margin:0;text-align:right;word-wrap:break-word;font-size:2vh}
.ncf-container .success{background:#51a351;color:#fff;padding:2.5vh 2.5vh 2.5vh 10vh;background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAADsSURBVEhLY2AYBfQMgf///3P8+/evAIgvA/FsIF+BavYDDWMBGroaSMMBiE8VC7AZDrIFaMFnii3AZTjUgsUUWUDA8OdAH6iQbQEhw4HyGsPEcKBXBIC4ARhex4G4BsjmweU1soIFaGg/WtoFZRIZdEvIMhxkCCjXIVsATV6gFGACs4Rsw0EGgIIH3QJYJgHSARQZDrWAB+jawzgs+Q2UO49D7jnRSRGoEFRILcdmEMWGI0cm0JJ2QpYA1RDvcmzJEWhABhD/pqrL0S0CWuABKgnRki9lLseS7g2AlqwHWQSKH4oKLrILpRGhEQCw2LiRUIa4lwAAAABJRU5ErkJggg==")}
.ncf-container .info{background:#2f96b4;color:#fff;padding:2.5vh 2.5vh 2.5vh 10vh;background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGwSURBVEhLtZa9SgNBEMc9sUxxRcoUKSzSWIhXpFMhhYWFhaBg4yPYiWCXZxBLERsLRS3EQkEfwCKdjWJAwSKCgoKCcudv4O5YLrt7EzgXhiU3/4+b2ckmwVjJSpKkQ6wAi4gwhT+z3wRBcEz0yjSseUTrcRyfsHsXmD0AmbHOC9Ii8VImnuXBPglHpQ5wwSVM7sNnTG7Za4JwDdCjxyAiH3nyA2mtaTJufiDZ5dCaqlItILh1NHatfN5skvjx9Z38m69CgzuXmZgVrPIGE763Jx9qKsRozWYw6xOHdER+nn2KkO+Bb+UV5CBN6WC6QtBgbRVozrahAbmm6HtUsgtPC19tFdxXZYBOfkbmFJ1VaHA1VAHjd0pp70oTZzvR+EVrx2Ygfdsq6eu55BHYR8hlcki+n+kERUFG8BrA0BwjeAv2M8WLQBtcy+SD6fNsmnB3AlBLrgTtVW1c2QN4bVWLATaIS60J2Du5y1TiJgjSBvFVZgTmwCU+dAZFoPxGEEs8nyHC9Bwe2GvEJv2WXZb0vjdyFT4Cxk3e/kIqlOGoVLwwPevpYHT+00T+hWwXDf4AJAOUqWcDhbwAAAAASUVORK5CYII=")}
.ncf-container .error{background:#bd362f;color:#fff;padding:2.5vh 2.5vh 2.5vh 10vh;background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAHOSURBVEhLrZa/SgNBEMZzh0WKCClSCKaIYOED+AAKeQQLG8HWztLCImBrYadgIdY+gIKNYkBFSwu7CAoqCgkkoGBI/E28PdbLZmeDLgzZzcx83/zZ2SSXC1j9fr+I1Hq93g2yxH4iwM1vkoBWAdxCmpzTxfkN2RcyZNaHFIkSo10+8kgxkXIURV5HGxTmFuc75B2RfQkpxHG8aAgaAFa0tAHqYFfQ7Iwe2yhODk8+J4C7yAoRTWI3w/4klGRgR4lO7Rpn9+gvMyWp+uxFh8+H+ARlgN1nJuJuQAYvNkEnwGFck18Er4q3egEc/oO+mhLdKgRyhdNFiacC0rlOCbhNVz4H9FnAYgDBvU3QIioZlJFLJtsoHYRDfiZoUyIxqCtRpVlANq0EU4dApjrtgezPFad5S19Wgjkc0hNVnuF4HjVA6C7QrSIbylB+oZe3aHgBsqlNqKYH48jXyJKMuAbiyVJ8KzaB3eRc0pg9VwQ4niFryI68qiOi3AbjwdsfnAtk0bCjTLJKr6mrD9g8iq/S/B81hguOMlQTnVyG40wAcjnmgsCNESDrjme7wfftP4P7SP4N3CJZdvzoNyGq2c/HWOXJGsvVg+RA/k2MC/wN6I2YA2Pt8GkAAAAASUVORK5CYII=")!important}
.ncf-container button{position:relative;right:-.3em;top:-.3em;float:right;font-weight:bold;color:#fff;text-shadow:0 1px 0 #fff;opacity:.8;line-height:1;font-size:16px;padding:0;cursor:pointer;background:transparent;border:0}
.ncf-container button:hover{opacity:1}
/** Video **/
video.play {
    position: fixed; right: 0; bottom: 0;
    min-width: 100%; min-height: 100%;
    width: 100%; height: auto; z-index: 10000;
    background: #000;
    background-size: cover;
}
/**Menu App Horizontal**/
.navigation-menu,.navigation-menu * { direction:rtl}
.navigation-menu { position: fixed;bottom:0;left:0;right:0;width:100%;height: 6vh;z-index:101;border-top:1px solid #888;}
  .navigation-menu ul { list-style-type: none; padding: 0; margin: 0; background:#eee url(../img/menu-app-horizontal-bg.jpg); text-align: center; /*border-top:1px solid #111;*/}
.navigation-menu li { display: inline-block; width:32%; }
.navigation-menu a { cursor: pointer; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; padding: 1vh 0; text-align: center }
.navigation-menu img { stroke: #9386ea; width: 3vh; height: 3vh; margin: 0 10% 0 0; -webkit-transform: translateX(-35px); transform: translateX(-35px); -webkit-transition: 0.4s ease all; transition: 0.4s ease all; }
.navigation-menu a.active { color: white; }
  .navigation-menu a.active img { -webkit-transform: translateX(0px); transform: translateX(0px); }
.navigation-menu .link-text { color: #111; margin: 0.2vh 1.5vh 0 0; opacity: 0; -webkit-transition: 0.3s ease all; transition: 0.3s ease all; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; height: 4vh; font-size: 1.5rem; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; z-index: 1; }
.navigation-menu a.active .link-text { opacity: 1; -webkit-transition-delay: 0.1s; transition-delay: 0.1s; }
.navigation-menu .link-background { position: absolute; right: 0; top: 1vh; background: #d2d2c1; border-radius: 18px; width: 31%; height: 4vh; z-index: 0; margin-right: 1.5%; -webkit-transition: 0.4s cubic-bezier(0.7, 0, 0.38, 0.86) all; transition: 0.4s cubic-bezier(0.7, 0, 0.38, 0.86) all; }
/** PageIntro **/
.pageintro { position: relative; overflow: hidden; }
.pageintro-overlay { top: 0; left: 0; width: 100%; height: 100%; z-index: 10000; position: absolute; }
.pageintro-hole { position: absolute; border: 2px solid #2db84b; border-radius: 4px; box-shadow: 0 0 0 10000px rgba(0, 0, 0, 0.5); }
.pageintro-tooltip { width: 320px; padding: 20px; position: absolute; text-align: center; border: 1px solid #888; border-radius: 4px; background: #fff; box-shadow: 0 0 10px rgba(0, 0, 0, 0.4); transition: all .5s; }
.pageintro-actions { text-align: center; }
.pageintro-nav { padding: 0; margin: 10px 0; text-align: center; direction:rtl; }
  .pageintro-nav li { width: 10px; height: 10px; margin: 0 4px; display: inline-block; border: 1px solid #ccc; border-radius: 50%; cursor: pointer; }
    .pageintro-nav li:hover { border-color: #aaa; background: #ddd; }
    .pageintro-nav li.active { border-color: #888; background: #888; }
/** HDT Table **/
table.hdt_table { background: #f5f5f5; border-collapse: separate; box-shadow: inset 0 1px 0 #fff; font-size: 12px;  margin: 30px auto; text-align: right; width: 80%; }
table.hdt_table th.small {width:10% !important}
.hdt_table th { background: linear-gradient(#777, #444); border-left: 1px solid #555; border-right: 1px solid #777; border-top: 1px solid #555; border-bottom: 1px solid #333; box-shadow: inset 0 1px 0 #999; color: #fff; font-weight: bold; padding: 10px 15px; position: relative; text-shadow: 0 1px 0 #000; text-align: center; }
  .hdt_table th:after { background: linear-gradient(rgba(255,255,255,0), rgba(255,255,255,.08)); content: ''; display: block; height: 25%; left: 0; margin: 1px 0 0 0; position: absolute; top: 25%; width: 100%; }
  .hdt_table th:first-child { border-left: 1px solid #777; box-shadow: inset 1px 1px 0 #999; }
  .hdt_table th:last-child { box-shadow: inset -1px 1px 0 #999; }
.hdt_table td { border-right: 1px solid #fff; border-left: 1px solid #e8e8e8; border-top: 1px solid #fff; border-bottom: 1px solid #e8e8e8; padding: 8px 12px; position: relative; transition: all 300ms; }
  .hdt_table td:first-child { box-shadow: inset 1px 0 0 #fff; }
  .hdt_table td:last-child { border-right: 1px solid #e8e8e8; box-shadow: inset -1px 0 0 #fff; }
.hdt_table tr:last-of-type td { box-shadow: inset 0 -1px 0 #fff; }
  .hdt_table tr:last-of-type td:first-child { box-shadow: inset 1px -1px 0 #fff; }
  .hdt_table tr:last-of-type td:last-child { box-shadow: inset -1px -1px 0 #fff; }
.hdt_table tbody:hover td { color: transparent; text-shadow: 0 0 3px #aaa; }
.hdt_table tbody:hover tr:hover td { color: #444; text-shadow: 0 1px 0 #fff; }
.pwa .hdt_table th{ display:none}
.pwa .hdt_table tr{ border-bottom:2px solid #DDD}
.pwa .hdt_table tr:first-child{ border-bottom:none}
.pwa .hdt_table tr,.pwa .hdt_table td{ display:block}
.pwa .hdt_table audio { width:80%}
/** Plan **/
.plan-box { background-color: #fff; border-radius: 10px; border: 1px solid #e1f1ff;padding: 16px;  position: relative; width: 100%; z-index: 10;}
.plan-box *{font-size: 1vw !important;}
.plan-table { display: -webkit-box; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; }
@media (min-width: 900px) {
  .plan-table { -webkit-box-orient: horizontal; -webkit-box-direction: normal; flex-direction: row; }
}
.plan-table * { text-align: center; text-transform: uppercase; }
.plan-item { border-bottom: 1px solid #ddd; /*padding: 10px 25px;*/ }
.plan-item:last-child { border-bottom: none; }
@media (min-width: 900px) {
  .plan-item { border-bottom: none; border-left: 1px solid #e1f1ff; flex-basis: 100%; /*padding: 15px 50px;*/ }
  .plan-item:last-child { border-left: none; }
}
.plan-header { color: #888; letter-spacing: 1px;font-size: 1.5vw !important; }
.plan-features { color: #016FF9; letter-spacing: 1px; margin: 30px 0 25px; /*list-style-type: none*/}
.plan-features-item { border-top: 1px solid #e1f1ff; padding: 8px 0; }
.plan-features-item:last-child { border-bottom: 1px solid #e1f1ff; }
.plan-price { color: #016FF9; display: block;  }
.plan-button { font-size: 1vw !important;border: 1px solid #9dd1ff; border-radius: 6px; color: #348EFE; display: inline-block; margin: 25px auto 10px auto; padding: 10px 30px; text-decoration: none; -webkit-transition: all 150ms ease-in-out; transition: all 150ms ease-in-out; }
.plan-button:hover,
.plan-button:focus { background-color: #e1f1ff; }
.plan-button.is-featured { background-color: #48aaff; color: #fff; }
  .plan-button.is-featured:hover,
  .plan-button.is-featured:active { background-color: #269aff; }
.plan-header, .plan-features-item, .plan-price, .plan-button { overflow: hidden !important; white-space: nowrap !important }/*force-one-line*/
/** Live BG (Gradient Color) **/
.live-bg-gradient-color {
    position:fixed;top:0;left:0;right:0;bottom:0;z-index:-1;margin: 0;
    width:100vw;height: 100vh;
    background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
    background-size: 400% 400%;
    animation: gradient 15s ease infinite;
}

@keyframes gradient {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}
/** Live BG (Bubbles) **/
.bubbles{
  background:#29b6f6;
  position:fixed;top:0;left:0;right:0;bottom:0;z-index:-1;margin: 0;
  width:100vw;height: 100vh;
  overflow:hidden;
}
.bubble{
  position: absolute;
  bottom:-100px;
  width:40px;
  height: 40px;
  background:#f1f1f1;
  border-radius:50%;
  opacity:0.5;
  animation: rise 10s infinite ease-in;
}
.bubble:nth-child(1){
  width:40px;
  height:40px;
  left:10%;
  animation-duration:8s;
}
.bubble:nth-child(2){
  width:20px;
  height:20px;
  left:20%;
  animation-duration:5s;
  animation-delay:1s;
}
.bubble:nth-child(3){
  width:50px;
  height:50px;
  left:35%;
  animation-duration:7s;
  animation-delay:2s;
}
.bubble:nth-child(4){
  width:80px;
  height:80px;
  left:50%;
  animation-duration:11s;
  animation-delay:0s;
}
.bubble:nth-child(5){
  width:35px;
  height:35px;
  left:55%;
  animation-duration:6s;
  animation-delay:1s;
}
.bubble:nth-child(6){
  width:45px;
  height:45px;
  left:65%;
  animation-duration:8s;
  animation-delay:3s;
}
.bubble:nth-child(7){
  width:90px;
  height:90px;
  left:70%;
  animation-duration:12s;
  animation-delay:2s;
}
.bubble:nth-child(8){
  width:25px;
  height:25px;
  left:80%;
  animation-duration:6s;
  animation-delay:2s;
}
.bubble:nth-child(9){
  width:15px;
  height:15px;
  left:70%;
  animation-duration:5s;
  animation-delay:1s;
}
.bubble:nth-child(10){
  width:90px;
  height:90px;
  left:25%;
  animation-duration:10s;
  animation-delay:4s;
}
@keyframes rise{
  0%{
    bottom:-100px;
    transform:translateX(0);
  }
  50%{
    transform:translate(100px);
  }
  100%{
    bottom:1080px;
    transform:translateX(-200px);
  }
}
/** Live BG (Light Bar) **/
.live-bg-light-bar {
    position:fixed;top:0;left:0;right:0;bottom:0;
    z-index:-1;
    margin: 0;
    height: 100vh;
    background: radial-gradient(#43e4dd,#1f1013);
    -webkit-overflow-Y: hidden;
    -moz-overflow-Y: hidden;
    -o-overflow-Y: hidden;
    overflow-y: hidden;
    -webkit-animation: fadeIn 1 1s ease-out;
    -moz-animation: fadeIn 1 1s ease-out;
    -o-animation: fadeIn 1 1s ease-out;
    animation: fadeIn 1 1s ease-out;
}

.light {
    position: absolute;
    width: 0px;
    opacity: .75;
    background-color: white;
    box-shadow: #e9f1f1 0px 0px 20px 2px;
    opacity: 0;
    top: 100vh;
    bottom: 0px;
    left: 0px;
    right: 0px;
    margin: auto;
}

.x1{
  -webkit-animation: floatUp 4s infinite linear;
  -moz-animation: floatUp 4s infinite linear;
  -o-animation: floatUp 4s infinite linear;
  animation: floatUp 4s infinite linear;
   -webkit-transform: scale(1.0);
   -moz-transform: scale(1.0);
   -o-transform: scale(1.0);
  transform: scale(1.0);
}

.x2{
  -webkit-animation: floatUp 7s infinite linear;
  -moz-animation: floatUp 7s infinite linear;
  -o-animation: floatUp 7s infinite linear;
  animation: floatUp 7s infinite linear;
  -webkit-transform: scale(1.6);
  -moz-transform: scale(1.6);
  -o-transform: scale(1.6);
  transform: scale(1.6);
  left: 15%;
}

.x3{
  -webkit-animation: floatUp 2.5s infinite linear;
  -moz-animation: floatUp 2.5s infinite linear;
  -o-animation: floatUp 2.5s infinite linear;
  animation: floatUp 2.5s infinite linear;
  -webkit-transform: scale(.5);
  -moz-transform: scale(.5);
  -o-transform: scale(.5);
  transform: scale(.5);
  left: -15%;
}

.x4{
  -webkit-animation: floatUp 4.5s infinite linear;
  -moz-animation: floatUp 4.5s infinite linear;
  -o-animation: floatUp 4.5s infinite linear;
  animation: floatUp 4.5s infinite linear;
  -webkit-transform: scale(1.2);
  -moz-transform: scale(1.2);
  -o-transform: scale(1.2);
  transform: scale(1.2);
  left: -34%;
}

.x5{
  -webkit-animation: floatUp 8s infinite linear;
  -moz-animation: floatUp 8s infinite linear;
  -o-animation: floatUp 8s infinite linear;
  animation: floatUp 8s infinite linear;
  -webkit-transform: scale(2.2);
  -moz-transform: scale(2.2);
  -o-transform: scale(2.2);
  transform: scale(2.2);
  left: -57%;
}

.x6{
  -webkit-animation: floatUp 3s infinite linear;
  -moz-animation: floatUp 3s infinite linear;
  -o-animation: floatUp 3s infinite linear;
  animation: floatUp 3s infinite linear;
  -webkit-transform: scale(.8);
  -moz-transform: scale(.8);
  -o-transform: scale(.8);
  transform: scale(.8);
  left: -81%;
}

.x7{
  -webkit-animation: floatUp 5.3s infinite linear;
  -moz-animation: floatUp 5.3s infinite linear;
  -o-animation: floatUp 5.3s infinite linear;
  animation: floatUp 5.3s infinite linear;
  -webkit-transform: scale(3.2);
  -moz-transform: scale(3.2);
  -o-transform: scale(3.2);
  transform: scale(3.2);
  left: 37%;
}

.x8{
  -webkit-animation: floatUp 4.7s infinite linear;
  -moz-animation: floatUp 4.7s infinite linear;
  -o-animation: floatUp 4.7s infinite linear;
  animation: floatUp 4.7s infinite linear;
  -webkit-transform: scale(1.7);
  -moz-transform: scale(1.7);
  -o-transform: scale(1.7);
  transform: scale(1.7);
  left: 62%;
}

.x9{
  -webkit-animation: floatUp 4.1s infinite linear;
  -moz-animation: floatUp 4.1s infinite linear;
  -o-animation: floatUp 4.1s infinite linear;
  animation: floatUp 4.1s infinite linear;
  -webkit-transform: scale(0.9);
  -moz-transform: scale(0.9);
  -o-transform: scale(0.9);
  transform: scale(0.9);
  left: 85%;
}

@-webkit-keyframes floatUp{
  0%{top: 100vh; opacity: 0;}
  25%{opacity: 1;}
  50%{top: 0vh; opacity: .8;}
  75%{opacity: 1;}
  100%{top: -100vh; opacity: 0;}
}
@-moz-keyframes floatUp{
  0%{top: 100vh; opacity: 0;}
  25%{opacity: 1;}
  50%{top: 0vh; opacity: .8;}
  75%{opacity: 1;}
  100%{top: -100vh; opacity: 0;}
}
@-o-keyframes floatUp{
  0%{top: 100vh; opacity: 0;}
  25%{opacity: 1;}
  50%{top: 0vh; opacity: .8;}
  75%{opacity: 1;}
  100%{top: -100vh; opacity: 0;}
}
@keyframes floatUp{
  0%{top: 100vh; opacity: 0;}
  25%{opacity: 1;}
  50%{top: 0vh; opacity: .8;}
  75%{opacity: 1;}
  100%{top: -100vh; opacity: 0;}
}

@-webkit-keyframes fadeIn{
  from{opacity: 0;}
  to{opacity: 1;}
}

@-moz-keyframes fadeIn{
  from{opacity: 0;}
  to{opacity: 1;}
}

@-o-keyframes fadeIn{
  from{opacity: 0;}
  to{opacity: 1;}
}

@keyframes fadeIn{
  from{opacity: 0;}
  to{opacity: 1;}
}

@-webkit-keyframes fadeOut{
  0%{opacity: 0;}
  30%{opacity: 1;}
  80%{opacity: .9;}
  100%{opacity: 0;}
}

@-moz-keyframes fadeOut{
  0%{opacity: 0;}
  30%{opacity: 1;}
  80%{opacity: .9;}
  100%{opacity: 0;}
}

@-o-keyframes fadeOut{
  0%{opacity: 0;}
  30%{opacity: 1;}
  80%{opacity: .9;}
  100%{opacity: 0;}
}

@keyframes fadeOut{
  0%{opacity: 0;}
  30%{opacity: 1;}
  80%{opacity: .9;}
  100%{opacity: 0;}
}

@-webkit-keyframes finalFade{
  0%{opacity: 0;}
  30%{opacity: 1;}
  80%{opacity: .9;}
  100%{opacity: 1;}
}

@-moz-keyframes finalFade{
  0%{opacity: 0;}
  30%{opacity: 1;}
  80%{opacity: .9;}
  100%{opacity: 1;}
}

@-o-keyframes finalFade{
  0%{opacity: 0;}
  30%{opacity: 1;}
  80%{opacity: .9;}
  100%{opacity: 1;}
}

@keyframes finalFade{
  0%{opacity: 0;}
  30%{opacity: 1;}
  80%{opacity: .9;}
  100%{opacity: 1;}
}
/** Meter **/
.meter_main {width: 300px;height: 300px;margin: 40px auto 0 auto;cursor: pointer;-webkit-transition: -webkit-transform 0.1s;transition: -webkit-transform 0.1s;transition: transform 0.1s;transition: transform 0.1s, -webkit-transform 0.1s;border-radius: 400px;}
.meter_main.cold { background: -webkit-linear-gradient(285deg, #00a8ff 0%, #cc00ff 100%);background: linear-gradient(165deg, #00a8ff 0%, #cc00ff 100%);  box-shadow: 0 0 32px rgba(0, 0, 255, 0.6);}
.meter_main.warm {background: -webkit-linear-gradient(285deg, #caff00 0%, #ff1414 100%);background: linear-gradient(165deg, #caff00 0%, #ff1414 100%);box-shadow: 0 0 32px rgba(251, 255, 0, 0.6);}
.meter_screen {color: #fff;z-index: 99;-webkit-font-smoothing: antialiased;font-family: "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;background: #010101;width: 280px;height:280px;margin: 10px;border-radius: 100%;position: absolute;overflow: hidden;}
.meter_radial {position: absolute;margin: 20px;width: 240px;height: 240px;opacity: 0.5;}
.meter_radial .empty {position: absolute;width: 90%;height: 90%;background-color: #000;border-radius: 100%;left: 5%;top: 5%;pointer-events: none;}
.meter_radial .tick {position: absolute;width: 1.5px;height: 100%;left: 50%;margin-left: -1px;background: #fff;pointer-events: none;}
.meter_home {position: absolute;/*mix-blend-mode: screen;*/top: 0;left: 0;width: 100%;height: 100%;}
.meter_home h1 {position: relative;text-align: center;position: absolute;top: 60%;margin-top: -10px;/*line-height: 50px !important;*/text-align: center;font-size: 40px;width: 100%;letter-spacing: 5px;}
.meter_home .mph {color: #fff;opacity: 1;position: absolute;width: 100%;bottom: 55px;text-align: center;font-size: 16px;letter-spacing: 0.25px;text-transform: uppercase;font-weight: 100;}
.meter_home .status, .meter_home h2 {width: 100%;font-size: 16px;opacity: 1;letter-spacing: 0.25px;position: absolute;top: 110px;text-transform: uppercase;font-weight: 200;text-align: center;}
.meter_main.cold .meter_home .status, .meter_main.cold .meter_home h2 {color: #00a8ff;}
.meter_main.warm .meter_home .status, .meter_main.warm .meter_home h2 {color: #fbff00;}
.meter_home .icon img {width: 45px;opacity: 1;letter-spacing: 0.25px;position: absolute;top: 55px;left: 117px;text-transform: uppercase;color: #00a8ff;font-weight: bold;text-align: center;}
.meter_main.pressed, .meter_main:active {-webkit-transform: scale(0.9875);transform: scale(0.9875);opacity: 0.7;-webkit-transition: 0.3s;transition: 0.3s;}
/** Radar **/
:root { --color-900: #abff51; --color-300: #189317; --color-100: #30AC0C; --color-10: #0E2E0C; }
.radar-wrapper { width: 280px; height: 280px;margin:auto; position: relative; display: flex; align-items: center; justify-content: center; border-radius: 50%; box-shadow: .5rem 1rem 1rem rgba(0, 0, 0, .4); background-image: linear-gradient(135deg, #fff2, #10101133), radial-gradient(#141d22 64%, #0d0c0b 64.8%, #0d0c0b 65%, #707070 65.1%, #fff 68%, #707070 69.9%, #fff 71%, #fff 72%); }
.pwa .radar-wrapper { margin: 32px auto; }
.radar { position: relative; overflow: hidden; width: 260px; height: 260px; border-radius: 50%; background-image: radial-gradient(var(--color-100) 50%, var(--color-10) 80%, #000 90%); box-shadow: .1rem .6rem .6rem inset rgba(0, 0, 0, .24); }
.radar__grid { width: 100%; height: 100%; }
  .radar__grid::before { content: ''; display: block; width: 1px; height: 100%; background-color: var(--color-900); position: absolute; left: 50%; }
  .radar__grid::after { content: ''; display: block; height: 1px; width: 100%; background-color: var(--color-900); position: absolute; top: 50%; }
  .radar__grid > * { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transform-origin: center; border: 1px solid var(--color-900); border-radius: 50%; }
  .radar__grid > :nth-child(1) { width: 20%; height: 20%; }
  .radar__grid > :nth-child(2) { width: 40%; height: 40%; }
  .radar__grid > :nth-child(3) { width: 60%; height: 60%; }
  .radar__grid > :nth-child(4) { width: 80%; height: 80%; }
.scanner { position: absolute; top: 0; width: 100%; height: 100%; background-image: conic-gradient(transparent 0deg 93%, var(--color-900)); animation: scan 3s linear infinite; transform-origin: center; }
.radar__obj { position: absolute; border-radius: 50%; width: .5rem; height: .5rem; background-color: #fff; box-shadow: 0 0 1rem .34rem #fff, 0 0 2rem 1rem var(--color-900), 0 0 3rem 1.5rem var(--color-300); filter: saturate(1.45); animation: blink 3s ease-out infinite; opacity: 0; }
  .radar__obj::after { color: var(--color-900); font: normal .4rem/0 monospace; padding-left: 1rem; white-space: nowrap; }
.radar__obj--1 { top: 14%; left: 59%; transform: scale(1.7); animation-delay: .21346s; }
  .radar__obj--1::after { content: "C/133"; }
.radar__obj--2 {top: 55%;left: 54%;transform: scale(1.3);animation-delay: 1.125s;}
.radar__obj--2::after {content: "P/042";}
.radar__obj--3 {top: 51%;left: 18%;transform: scale(1.5667);animation-delay: 2.29970405918s;}
.radar__obj--3::after {content: "z/015";}
@keyframes scan {
  to { transform: rotate(360deg); }
}
@keyframes blink {
  0% { opacity: 0; }
  12.5% { opacity: 1; }
  40% { opacity: 0; }
}
/** Typewriter **/
.typewriter { border-left: solid 2px rgba(50,50,50,.75); white-space: nowrap; overflow: hidden; margin:4px;display:inline-block;width:auto}
.typewriter { animation: animated-text 4s steps(29,end) 1s 1 normal both, animated-cursor 600ms steps(29,end) infinite; }
@keyframes animated-text {
  from { max-width: 0; }
  to { max-width: 100%; }
}
@keyframes animated-cursor {
  from { border-left-color: rgba(50,50,50,.75); }
  to { border-left-color: transparent; }
}
/** Globe **/
.globe {
  background:url(../img/globe.jpg);
  background-size:cover;
  border:2px solid #000;
  border-radius:50%;
  width:200px;
  height:200px;
  animation: movimiento 10s linear 0s infinite;
  box-shadow:0 0 25px RGBA(255,255,255, 0.10),
             -4px -4px 2px #666 inset,
             2px 2px 4px #666 inset,
             -8px -8px 4px RGBA(0,0,0, 0.5) inset,
             4px 4px 8px RGBA(0,0,0, 0.45) inset;
  margin:auto;
  transform:rotateX(6deg) rotateY(6deg) rotateZ(6deg);
}

@keyframes movimiento {
  0% { background-position:0 0 }
  100% { background-position:430px 0 }
}

@keyframes stars {
  0% { background-position:0 0 }
  100% { background-position:0 100% }
}
/** Presentation **/
.presentation{text-align:center;font-size:4vh;display:flex;align-items:center;height:100%;overflow:hidden;}
.presentation .box{width:100%}
.presentation img { height:32%}
.pwa .presentation img{max-width:96%}

.presentation .up-down{animation-name: presentation-up-down;animation-duration: 3s;animation-iteration-count: infinite;animation-timing-function: ease-in-out;}
@-webkit-keyframes presentation-up-down {from { transform: translate(0,  -10%); }50%  { transform: translate(0, 10%); }    to   { transform: translate(0, -10%); }  }
/**Introduction**/
.introduction { background:#fff;width:100%;height:100%;overflow:hidden;padding:2%;}
.pwa .introduction.full_screen { position:fixed;top:0;right:0;bottom:0;left:0;z-index:332}
.introduction>div{width:100%;height:100%;}
.introduction .slide{width:100%;height:100%;text-align:center;display: flex;justify-content: center;align-items: center;}
.introduction .slide.active{}
.introduction .slide img{height:30%}
.pwa .introduction .slide img{height:15%}
.introduction .next,.introduction .prev,.introduction .start { position:absolute;bottom:20px;left:20px;z-index:2;min-width:80px}
.introduction .prev { left:auto;right:20px;}
.introduction .dots { position:absolute;bottom:28px;height:auto;text-align:center;z-index:1}
.introduction .dot { cursor: pointer; height: 15px; width: 15px; margin: 0 2px; background-color: #bbb; border-radius: 50%; display: inline-block; transition: background-color 0.6s ease; }
.introduction .dot.active, .introduction .dot:hover { background-color: #717171; }
/**Bizup-CMS-Update**/
.bizup-cms-update-box *{color:#444;cursor: default;}
.bizup-cms-update-box a{cursor: pointer;}
.bizup-cms-update-box div{border-radius: 4px;margin: 4px auto;padding: 8px}
.bizup-cms-update-box div.version{color:#888;font-weight: bold;font-size: 1.6vh !important;margin-top: 16px}
.bizup-cms-update-box span.cat{text-align: center;color:#aaa;display: inline-block;width: 80px;font-size: 1.5vh !important;font-weight: normal;}
.bizup-cms-update-box div.mobile{background:#fae5ff}
.bizup-cms-update-box div.design{background:#fffee5}
.bizup-cms-update-box div.improvement{background:#e5ebff}
.bizup-cms-update-box div.new-unit{background:#e5ffe7}
.bizup-cms-update-box div.security{background:#ffeae5}
.bizup-cms-update-num{color: #fff;border-radius: 4px;padding:3px 5px;display: inline-block;font-weight: bold;font-size: 1.8vh !important;margin-bottom:4px;}
/**Dashboard Recently Used**/
#dashboard_recently_used i{display:none}
/**Speedometer**/
.speedometer-box,.speedometer-box * {text-align: initial;}
.speedometer-box {width: 500px;max-width: 90%;margin: 0 auto;display: block;}
.speedometer-box label{color:#888;font-size: 1.2rem !important}
.speedometer {width: auto;margin:auto;position: relative;padding-top:12px}
.speedometer-hand {position: absolute;left: 45%;bottom: 6px;margin-left: -15px;z-index: 1;transition: all 2s ease-in-out;transform-origin: 94% 48%;}
.speedometer-speed {font-size: 3.2rem;font-weight: 700;/*line-height: 1;*/}
.speedometer-speed-val {min-width: 300px;display: inline-block;}
.speedometer-unit {font-size:1.4rem !important;font-weight: 500;color:#333333;text-align:center;position: relative;}
.speedometer-unit > span {position: absolute;width: 250px;margin: auto;right: 25%;display: inline-block;text-align: center;}
.speedometer .num {font-size: 1rem;font-weight: 600;position: absolute;}
.speedometer-min-max{margin:auto;width:253px;}
#num_1 {left: 25px;top: 80px;}
#num_2 {left: 37px;top: 56px;}
#num_3 {left: 55px;top: 35px;}
#num_4 {left: 87px;top: 25px;}
#num_5 {right: 55px;top: 35px;}
#num_6 {right: 37px;top: 56px;}
#num_7 {right: 25px;top: 80px;}
/* RESET STYLES
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.chart-skills {margin: 0 auto;padding: 0;list-style-type: none;}
.chart-skills *, .chart-skills::before {box-sizing: border-box;}
/* CHART-SKILLS STYLES
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.chart-skills {position: relative;width: 250px;height: 125px;overflow: hidden;}
.chart-skills::before,.chart-skills::after {position: absolute;}
.chart-skills::before {content: '';width: inherit;height: inherit;border: 45px solid rgba(211, 211, 211, .3);border-bottom: none;border-top-left-radius: 175px;border-top-right-radius: 175px;}
.chart-skills::after {content: '';left: 50%;bottom: 10px;transform: translateX(-50%);font-size: 1.1rem;font-weight: bold;color: cadetblue;}
.chart-skills li {position: absolute;top: 100%;left: 0;width: inherit;height: inherit;border: 45px solid;border-top: none;border-bottom-left-radius: 175px;border-bottom-right-radius: 175px;transform-origin: 50% 0;animation-fill-mode: forwards;animation-duration: .4s;animation-timing-function: linear;transform-style: preserve-3d;backface-visibility: hidden;}
.chart-skills li:nth-child(1) {z-index: 4;border-color: #ED7E3D;animation-name: rotate-one;}
.chart-skills li:nth-child(2) {z-index: 3;border-color: #F0D440;animation-name: rotate-two;animation-delay: .4s;}
.chart-skills li:nth-child(3) {z-index: 2;border-color: #8EC34A;animation-name: rotate-three;animation-delay: .8s;}
.chart-skills li:nth-child(4) {z-index: 1;border-color: #29B151;animation-name: rotate-four;animation-delay: 1.2s;}
/* ANIMATIONS
–––––––––––––––––––––––––––––––––––––––––––––––––– */
@keyframes rotate-one {100% {transform: rotate(45deg);}}
@keyframes rotate-two {
  0% {transform: rotate(45deg);}
  100% {transform: rotate(90deg);}
}
@keyframes rotate-three {
  0% {transform: rotate(90deg);}
  100% {transform: rotate(135deg);}
}
@keyframes rotate-four {
  0% {transform: rotate(135deg);}
  100% {transform: rotate(180deg);}
}

/**marquee**/
.marquee-container { width: 100%; height: 100%; overflow: hidden; position: relative; box-sizing: border-box; }
.marquee { top: 0; position: relative; box-sizing: border-box; animation: marquee 14s linear infinite;display:none }
.marquee:hover { animation-play-state: paused; }
@keyframes marquee {
  from { transform: translateY(0); }
  to { transform: translateY(-110%); }
}
/**loading**/
.bizup_loading { position:relative;width:100%;height:100%;text-align:center;}
.bizup_loading .middle {position:absolute;top:32%;width:100%;}
.bizup_loading img{ width:3%;min-width:20px;max-width:30px;margin:4%}
/**canvas chart**/
.bizup-canvas-chart {padding: 2px !important;}
