#wpfooter{position: relative;}
.fnt-famalies .wp-list-table .column-author, .fnt-famalies .wp-list-table .column-categories { text-align: center; }
.fnt-sub-page a, .fnt-famalies a { cursor: pointer; }
.fnt-main-page { float: left; width: 90%; margin: 30px 5%; padding: 10px 0; position: relative;}
.fnt-famalies { float: left; width: 100%;  margin: 15px 0; position: relative;}
.fnt-famalies .widefat thead tr th { line-height: 40px;  padding: 0 10px; font-weight: bold; }
.fnt-famalies .column-status, .fnt-famalies .column-move, .fnt-famalies .column-del {  padding: 0 10px;  text-align:center;}
/*.fnt-move-bar { border-bottom: 3px solid #000; border-top: 3px solid #000; display: inline-block; height: 3px; width: 25px; }*/
.font-row tr td, .font-family-row tr td , .font-row-block tr td { line-height: 35px; padding: 0 10px;}
.delete-font, .delete-font-style, .delete-block_single {color: #000; font-size: 25px; display:block; }
/*.fnt-move-bar::before { background: #000 ; content: ""; display: block; height: 3px; margin: -9px 0 0; width: 25px; }     */

.fnt-move-bar { padding-left: 1.25em; position: relative;}
.fnt-move-bar::before { background: #000; box-shadow: 0 6px 0 0 #000, 0 12px 0 0 #000; content: ""; height: 3px; left: 0; position: absolute; top: 4px; width: 25px;}

.update-status, .update-style-status, .update-block-status,.update-status_single { background: none; border: 1px solid #000; display: inline-block; height: 15px; vertical-align: middle; width: 15px; }
.update-status.enable::after, .update-style-status.enable::after, .update-block-status.enable::after,.update-status_single.enable::after { background: #000; content: ""; float: left; height: 13px; margin: 1px 0 0 -3px; position: relative; transform: skew(-40deg); width: 3px; }
.update-status.enable::before, .update-style-status.enable::before,.update-block-status.enable::before,.update-status_single.enable::before { background: #000; content: ""; float: left; height: 13px; margin: 1px 0 0 6px;  position: relative; transform: skew(40deg);  width: 3px; }
.fnt-sub-page {float: left; width: 99%; display: block;  position: relative;}
.fnt-sub-page .postbox { float: left; padding: 0 5%; width: 90%;  background: #fff; min-width:0; }
.fnt-container{width: 100%;  float: left; background: none;}
.font-family-container { float: left; width: 49%; margin-right: 1%; }
.font-family-frm { float: left;  }
.font-family-frm h3.hndle{margin: 0 0 5px 0; border: none; }
.font-family-frm .font-input {margin: 0 0 30px;float: left;width: 100%;}      
.font-style-top { float: left; margin: 10px 0 25px; width: 100%; }
.font-style-container {float: left; width: 49%; margin-left: 1%;}

.font-style-popup #poststuff{min-width:0; position: relative;}
.fnt-admin-input { padding: 3px 8px; font-size: 1.7em; line-height: 100%; height: 1.7em; width: 100%; outline: 0; margin: 0 0 3px; background-color: #fff; }
.font-style-popup input[type='file']{ border: 1px solid #ddd; -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.07); box-shadow: inset 0 1px 2px rgba(0,0,0,.07); background-color: #fff; color: #32373c; outline: 0; -webkit-transition: 50ms border-color ease-in-out; transition: 50ms border-color ease-in-out; }
.error.notice.fnt-family-eror { float: none; margin: 15px auto 10px; width: 97%; }

.over-view-testing-blocks { float: left; width: 100%; }
.over-view-testing-blocks > li { background: #fff; border: 1px solid #ccc; float: left; padding: 10px 1%; width: 98%; margin: 10px 0; }
table.over-view-table { margin: 10px 0; width: 100%; }
.overview-small-block { text-align: center; width: 60px; }
.overview-mid-block { text-align: center; width: 95px; }
.overview-big-block { width: 160px; }
table.over-view-table thead tr { text-align: left; }
table.over-view-table tbody tr { text-align: center; }
table.over-view-table select, table.over-view-table input { max-width:100%; width:100%}
table.over-view-table thead { color: hsl(0, 0%, 0%); font-weight: bold;}
.preview-text-block { float: left; margin: 10px 0; width: 100%; }
.preview-text-block label { color: #000; float: left; font-weight: bold; margin: 10px 0 5px; width: 100%; }
.preview-text-block textarea { float: left; width: 100%; }
.overview-left { float: left; margin: 0 2%;  width: 90%;}
.overview-right { float: left; line-height: 210px; text-align: center; width: 6%; }
.fnt-error { border: 1px solid #f00!important; }
#save_overview_block{ float: left; }
.testing-main-block { float: left;  width: 90%;  background-color: #fff;  border: 1px solid #ccc;  padding: 10px 5%; margin: 0px 0 25px; }
.included-families span { padding: 0px 12px; font-size: 15px; font-weight: bold; margin: 8px 0; float: left; }
.fnt-main-page input[type="checkbox"]:checked:before { content: "";  display: block;  height: 12px; background-color: #000; width: 2px; transform: skew(37deg); margin: 1px 0 0 6px;}
.fnt-main-page input[type="checkbox"]:checked:after { content: ""; width: 2px; display: block; background-color: #000; height: 12px; transform: skew(-35deg); margin: 1px 0 0 6px; }
.included-families {border: 1px solid #ddd; -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.07); box-shadow: inset 0 1px 2px rgba(0,0,0,.07); background-color: #fff; -webkit-transition: 50ms border-color ease-in-out; transition: 50ms border-color ease-in-out; float: left;}
#ajaxloader4 { display: none; position: absolute;  width: 30px; height: 30px; left: 50%; top: 50%; margin: -30px 0 0 -15px; border: 8px solid #fff; border-right-color: transparent; border-radius: 50%; box-shadow: 0 0 25px 2px #eee;  -webkit-animation: spin 1s linear infinite; -moz-animation: spin 1s linear infinite; -ms-animation: spin 1s linear infinite;  -o-animation: spin 1s linear infinite; animation: spin 1s linear infinite; }
#ajaxloader4::after{width: 13px;height: 13px;margin: 1px;border-width: 8px;border-top-color: transparent;border-left-color: transparent;}
.fnt-famalies-loader,.fnt-famalies-loader-pop { background: rgba(0, 0, 0, 0.4); bottom: 0; left: 0; position: absolute; top: 0; width: 100%;}

@-webkit-keyframes spin
{
    from { -webkit-transform: rotate(0deg); opacity: 0.4; }
    50%  { -webkit-transform: rotate(180deg); opacity: 1; }
    to   { -webkit-transform: rotate(360deg); opacity: 0.4; }
}

@-moz-keyframes spin
{
    from { -moz-transform: rotate(0deg); opacity: 0.4; }
    50%  { -moz-transform: rotate(180deg); opacity: 1; }
    to   { -moz-transform: rotate(360deg); opacity: 0.4; }
}

@-ms-keyframes spin
{
    from { -ms-transform: rotate(0deg); opacity: 0.4; }
    50%  { -ms-transform: rotate(180deg); opacity: 1; }
    to   { -ms-transform: rotate(360deg); opacity: 0.4; }
}

@-o-keyframes spin
{
    from { -o-transform: rotate(0deg); opacity: 0.4; }
    50%  { -o-transform: rotate(180deg); opacity: 1; }
    to   { -o-transform: rotate(360deg); opacity: 0.4; }
}

@keyframes spin
{
    from { transform: rotate(0deg); opacity: 0.2; }
    50%  { transform: rotate(180deg); opacity: 1; }
    to   { transform: rotate(360deg); opacity: 0.2; }
}

/*Tablle Setting*/
.fnt-families-table tr ,table.fnt-style-table tr{width: 100%; float:left; border-bottom: 1px solid #ccc; }
.fnt-families-table tbody tr {background: #ffffff;}

table.fnt-families-table td, 
table.fnt-families-table th,
table.fnt-style-table td, 
table.fnt-style-table th
{
    display: inline-block; width: 12%; border: none;
    text-align: center;
}

table.fnt-families-table td.column-title,
table.fnt-families-table th.column-title
{
    width: 48%;
     text-align: left;
}

table.fnt-families-table td.column-title strong {
    margin: 0;
}

table.fnt-families-table,
table.fnt-style-table{
    background: transparent;
    box-shadow: none;
    border: none;
}

table.fnt-style-table tbody{border: 1px solid #ccc; border-bottom: none;display: block;float: left;border-top: none;width: 100%}
table.fnt-style-table td.column-title,
table.fnt-style-table th.column-title
{
    width: 43%;
    text-align:  left;
}

table.fnt-families-table td.block-title,
table.fnt-families-table th.block-title ,
table.fnt-families-table td.list-block-link,
table.fnt-families-table th.list-block-link 
{
    width: 26%;
    text-align: left!important;
}
a.fnt-cancel { float: none;  line-height: 25px;  padding: 0 15px; color: #000; text-decoration: none; font-size: 15px; }
a.fnt-cancel:hover { opacity: 0.7; }
.font-row { float: left; width: 100%; border: 1px solid #ccc; border-top: none; border-bottom: none; }
tbody.font-row-block { float: left; width: 100%; border: 1px solid #ccc;  border-top: none; border-bottom: none; }