/*Generic styles for eKomi Theme*/

#flash-messages{
    margin-right: 15px;
    margin-top: 30px;
}

.noScroll{
    overflow: hidden;
}

.insertSaveIcon:before{
    content: "\f0c7";
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    margin-right:3px;
}

.fa-ekomi:before{
    content: url(../images/icons/e.png);
}

.button{
    white-space: nowrap;
}

.button.action-delete{
    vertical-align: top;
}

.button .fa::before{
    color: inherit;
}

.dimensions--avatar{
    max-width:41px;
    max-height:41px;
    width:auto;
    height:auto;
}

.mb4 {
    margin-bottom: 4px !important;
}

.mb15 {
    margin-bottom: 15px !important;
}

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

.p5{
    padding:5px !important;
}

.mt20 {
    margin-top: 20px !important;
}

.no-border{
    border:0 !important;
}

.pv3{
    padding:3px 0 !important;
}

.no-bg{
    background: none !important;
}

.no-shadow{
    box-shadow: none !important;
}

.get-widget-code .fa-code{
    font-size: 14px;
    color:#b9b9b9;
    font-weight: bold;
}

.block{
    display: block !important;
}

.ellipses{
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.list-searchbar input:first-child{
    vertical-align: middle;
    margin: 0;
}

.list-searchbar button{
    height: 2.4375rem;
}

.dimensions--flag{
    width: 23px;
    height: 17px;
    border: 1px solid grey;
    border-radius: 2px;
}

.empty.collection-empty{
    display: none;
}

.button:focus {
    outline: 0;
}

.no-transform{
    transform: none !important;
}

/*Layout*/

.easyadmin.sw_admin .wrapper,
.easyadmin.role_super_admin .wrapper,
.easyadmin.role_user .wrapper{
    background: #fff;
}

.main-sidebar, .wrapper{
    background: #fff;
}

#main{
    padding-right:0;
}

.list-widget #main{
    padding-left: 0;
}

.easyadmin.sw_admin .wrapper #main,
.easyadmin.role_super_admin .wrapper #main,
.easyadmin.role_user .wrapper #main{
    padding-right:15px;
}

.fixed .content-wrapper {
    padding-top: 85px;
}

.wrapper .content-wrapper{
    margin:0 auto;
}

.easyadmin.sw_admin .wrapper .content-wrapper,
.easyadmin.role_super_admin .wrapper .content-wrapper,
.easyadmin.role_user .wrapper .content-wrapper{
    /*padding-left:230px;*/
    margin: 0 auto;
}

@media (max-width: 768px){
    .easyadmin.sw_admin .wrapper .content-wrapper,
    .easyadmin.role_super_admin .wrapper .content-wrapper,
    .easyadmin.role_user .wrapper .content-wrapper{
        padding-left:0;
    }
}


/* Table Listing styles */

table.ekomi-table-listing tbody tr:nth-child(even){
    background: #f5f6f7;
}

.list-widget .table-responsive,
.list-template .table-responsive{
    overflow: hidden;
}

.list-placeholder .table-responsive{
    padding-bottom:15px;
}

body.list .table.ekomi-table-listing thead tr th {
    border-bottom: 2px solid #d9dce0;
}

.table.ekomi-table-listing{
    border-collapse: separate;
    border-spacing: 2px;
    padding:0;
}

.table.ekomi-table-listing tbody td{
    border:0;
}

.table.ekomi-table-listing th a{
    color: #5B6671;
    font-weight: bold;

}

.table.ekomi-table-listing th a:first-letter{
    text-transform: capitalize;
}

body.list table tbody td.actions .action-make_default{
    font-weight: normal;
}

body.list table tbody td.actions a i{
    vertical-align: middle;
}

body.easyadmin.list.list-language .flag-icon-listing img{
    height: 17px;
    width: 21px;
}

#size_filter, #listing-type{
    min-width: 200px;
    max-width: 290px;
}

#listing-type{
    max-width: 267px;
}

.language-translations{
    white-space: nowrap;
}

.language-translations li{
    padding: 0 13px;
    position: relative;
    max-width: 100px;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 72px;
    display: inline-block;
}

.language-translations li:not(:last-child):after{
    border: 1px solid;
    display: block;
    content: '';
    float: right;
    position: absolute;
    right: 0;
    height: 70%;
    top: 50%;
    transform: translateY(-50%);
}

.language-translations .tooltip{
    border:0;
    box-shadow: unset;
    opacity:1;
    background: transparent;
    max-width: none;
    line-height: 1.3;
    z-index: 810;   /* 1 lesser than the site header */
}

.language-translations .tooltip-inner{
    padding: 8px 15px;
    background-color: #2DA137;
    max-width: 310px;
    border-top-right-radius: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 100px;
}

.language-translations .tooltip::before{
    display: none;
}

.language-translations .close-tooltip{
    position: absolute;
    color: #fff;
    right: -16px;
    background: #2DA137;
    width: 16px;
    text-align: center;
    border-radius: 0 4px 4px 0;
    top: 5px;
    cursor: pointer;
    font-size: 19px;
    height: 20px;
    line-height: 1;
}

.language-translations .close-tooltip:hover{
    opacity:0.9;
}

.language-translations  .language-default a{
    font-weight:bold;
}

.language-translations .tooltip .tooltip-arrow{
    border-bottom-color: #2DA137;
}

@media (max-width: 768px) {
    .language-translations {
        float: right;
    }
}

/*Pagination*/

body.list .pagination > li > a{
    color:#0a0a0a;
    display: block;
    padding: .1875rem .625rem;
    border-radius: 6px;
    border: 0;
}

body.list .pagination > li i{
    padding:0;
    font-size: 12px;
    font-weight: normal;
}

body.list .pagination > li:not(.disabled) i::before{
    color:#000;
}

.pagination > li i.fa-angle-left,
.pagination > li i.fa-angle-double-left{
    margin-right: 0.5rem;
}

.pagination > li i.fa-angle-right,
.pagination > li i.fa-angle-double-right{
    margin-left: 0.5rem;
}

body.list .pagination > li > a:hover {
    background: #e6e6e6;
    color: #000;
}

.list-pagination strong{
    color: #0a0a0a;
    font-weight: normal;
}

@media (min-width: 768px){
    .pagination > li > a, .pagination > li > span {
        padding: 0;
    }
}

/*Header and footer styles*/

.top-bar-right .menu.dropdown{
    height:67.125px;
    display: table;
}

.site-header--ekomi{
    position: fixed;
    width: 100%;
    background: #fff;
    z-index: 1000;
}

.menu-navbar{
    position: relative;
    z-index: 30;
}

.menu-navbar .top-bar{
    position: relative;
    z-index: 32;
}

.site-footer--ekomi{
    position: relative;
    z-index: 900;
    background: #fff;
    max-width: 100%;
}


/*Forms*/

#main .available-placeholders,
#main .available-resources{
    padding-top: 16px;
}

form label.control-label.required:after{
    color: inherit;
}

.edit.edit-templateresource img.resource-images{
    max-width: 150px;
    max-height: 50px;
    margin-bottom: 15px;
}

.available-placeholders,
.available-resources {
    display: none;
}


/*sidebar*/

.menu-navbar .main-sidebar{
    position: absolute;
    z-index: 31;
    padding-left: 15px;
    background: #fff;
}

.menu-navbar .main-sidebar .sidebar{
    background: #f5f6f7;
}

@media (min-width: 768px){
    .main-sidebar {
        padding-top: 85px;
    }
}

.sidebar-menu li a{
    font-weight: 500;
    color: #bdc3ca;
    font-size: 16px;
}

.sidebar-menu > li:hover > a,
.sidebar-menu .treeview-menu > li:hover > a{
    background: #fefefe;
    color: #278a2f;
    border-left-color: transparent;
    /*border:0;*/
}

.sidebar-menu > li.active > a,
.sidebar-menu .treeview-menu > li.active > a,
.sidebar-collapse .sidebar-menu > li.active.submenu-active > a,
.sidebar-collapse .sidebar-menu > li:hover .treeview-menu > li.active > a{
    color: #5b6671;
    background: transparent;
    border-left-color: transparent;
    /*border: 0;*/
}

aside{
    display: none;
}

.easyadmin.sw_admin aside,
.easyadmin.role_super_admin aside,
.easyadmin.role_user aside{
    display: block;
}

/**
    `Templates and widgets Styles
**/

.widget-data a.thumbnail:hover,
.template-slide a.thumbnail:hover{
    border-color: #278a2f;
    box-shadow: 0 0 6px 1px #278a2f;
}

.list-template .panel-body{
    padding:0;
}

.template-category-nav-tabs{
    border-bottom: 1px solid #bcbcbc;
    margin:0;
}

.nav.template-category-nav-tabs li a {
    border: 0;
    padding: 1.25rem 1.5rem;
    font-weight: 500;
    color: #bdc3ca;
    font-size: 16px;
    background: transparent;
    line-height: 1;
    margin:0;
}

.nav.template-category-nav-tabs li a:hover {
    opacity: 1;
    background: #fefefe;
    color: #278a2f;
}

.nav.template-category-nav-tabs li.active a,
.nav.template-category-nav-tabs li.active a:hover,
.nav.template-category-nav-tabs li.active a:focus:hover{
    color: #5b6671;
    background: transparent;
}

.heading--category-slider {
    margin-bottom: 7px;
    font-weight: bold;
    font-size: 15px;
}


.template_categories select{
    text-transform: capitalize;
}

.template-category-nav-tabs li.active::before {
    content: ' ';
    border-bottom: 3px solid #2DA137;
    float: left;
    width: 60%;
    margin: auto 20%;
    position: relative;
    top: 50px;
}

.list-template .panel .panel-heading{
    padding-left: 0;
    padding-right: 0;
}

.nav.template-category-nav-tabs li:first-child a{
    padding-left: 15px;
}

.nav.template-category-nav-tabs li:first-child{
    margin-left: -15px;
}

.nav.template-category-nav-tabs li:first-child::before{
    margin: auto 17%;
}

@media print, screen and (max-width: 450px) {
    .template-category-nav-tabs{
        text-align: center;
    }
    .template-category-nav-tabs li{
        display: inline-block;
        float: none;
    }

    .nav.template-category-nav-tabs li:first-child::before{
        margin: auto 20%;
    }
    .nav.template-category-nav-tabs li a,
    .nav.template-category-nav-tabs li:first-child a{
        padding: 1.25rem 0.7rem;
    }

    .nav.template-category-nav-tabs li:first-child{
        margin-left: 0;
    }
}

@media print, screen and (min-width: 40em){
    .template-category-nav-tabs li.active::before {
        border-bottom: 6px solid #2DA137;
    }
}

.templates-slider {
    background: #f5f6f7;
    padding: 0 30px;
    min-height: 307px;
    border: #d5d5d5 1px solid;
    overflow: hidden;
    margin: 0 auto;
}

.templates-slider .template-slide{
    height: 100%;
}

.templates-slider .template-slide,
.widgets-listing .widget {
    background: #fff;
    padding: 0 15px 0 15px;
}

.widgets-listing .widget{
    max-height: 327px;
}

.templates-slider .slick-track {
    height: 100%;
}

.templates-slider .slick-list {
    padding-top: 20px;
    background: #fff;
    min-height: 307px;
}

.templates-slider .thumbnail,
.widget .thumbnail {
    display: inline-block;
    text-align: center;
    border: 1px solid #e1e1e1;
    min-height: 200px;
    margin: 0 auto;
    position: relative;
    width: 100%;
    border-radius: 0;
}

.templates-slider .thumbnail img,
.widget .thumbnail img{
    max-height: 80%;
    max-width: 80%;
    display: inline-block;
    top: 50%;
    position: absolute;
    left: 50%;
    transform: translate(-50%,-50%);
    width: auto;
    height: auto;
}

.widget .thumbnail img {
    max-height: 70%;
    max-width: 70%;
}

.templates-slider .template-dimension:hover,
.widget .widget-dimension:hover{
    color: #000;
    cursor: pointer;
}

.templates-slider .template-dimension,
.widget .widget-dimension{
    margin-top: 8px;
    margin-bottom: 8px;
    line-height: 1;
    color: #b2b2b2;
    font-size: 14px;
}

.templates-slider  .template-name,
.widget .widget-name{
    height: 20px;
}

.templates-slider .template-actions .languages a,
.widget .widget-actions .languages a{
    padding: 5px 3px;
}

.templates-slider .template-actions a,
.widget .widget-actions a{
    display: inline-block;
}

.widget .widget-actions {
    display: block;
    text-align: center;
    margin: 0;
}

.templates-slider .template-actions{
    line-height:0;
}

.templates-slider .template-actions .admin-actions > a,
.widget .widget-actions .actions > a{
    border-right: #ccc 1px solid;
    padding: 0 15px;
    cursor: pointer;
    height: 16px;
}

.templates-slider .template-actions .admin-actions > a:last-child,
.widget .widget-actions .actions > a:last-child{
    border:0;
}

.templates-slider .slide-prev {
    background-image: url(../images/icons/icon-arrow-left.png);
}

.templates-slider .slide-next {
    background-image: url(../images/icons/icon-arrow-right.png);
}

.templates-slider .slider-control {
    background-repeat: no-repeat;
    height: 100%;
    top: 0;
    width: 30px;
    font-size: 0;
}

.templates-slider .slide-prev {
    left: 0;
}

.templates-slider .slide-next {
    right: 0;
}

.templates-slider .slide-next,
.templates-slider .slide-prev {
    position: absolute;
    cursor: pointer;
    z-index: 999;
    background-position: center center;
}

.templates-slider .slick-disabled{
    visibility: hidden;
}

.block-no-template{
    background: #e1e1e1 none repeat scroll 0 0;
    border: 1px solid #d5d5d5;
    height: 100px;
    overflow: hidden;
    padding: 0 30px;
}

.block-no-template .prompt {
    background: #fafafa none repeat scroll 0 0;
    border: 1px solid #d5d5d5;
    height: 100%;
    border-top: 0;
    border-bottom: 0;
    padding: 30px;
    font-style: italic;
    color: grey;
}

.widgets-listing .widget{
    min-height:290px;
    width:25%;
}

.widget .widget-actions a img{
    vertical-align: baseline;
}

@media screen and (max-width: 960px) {
    .widgets-listing .widget{
        width:33.33%;
    }
}

@media screen and (max-width: 680px) {
    .widgets-listing .widget{
        width:50%;
    }
}

@media screen and (max-width: 480px) {
    .widgets-listing .widget{
        width:100%;
    }
}

.dfw-info-list{
    top: 50%;
    transform: translateY(-50%);
    position: absolute;
    right: -1px;
    z-index: 99;
    cursor:default;
}

.dw-feature {
    width: 40px;
    height: 40px;
    color: #fff !important;
    font-weight: bold;
    font-size: 20px;
    right: 0;
    margin-top: 2px;
}

.facebook_compatible .fa::before{
    color:#fff;
}

.facebook_compatible{
    background: #475993;
    padding: 10px;
    color:#fff !important;
}

.enable_rich_snippet.dw-feature img {
    width: 100%;
    max-width: 100%;
    max-height: 100%;
    position: relative;
}

/* Widget preview overlay styles */
.template-preview-overlay{
    top: 0;
    left:0;
    bottom: 0;
    right: 0;
    background-color: #fff;
    position: fixed;
    z-index: 1000;
    display: none;
    border: 16px solid whitesmoke;
}

.template-preview-overlay .close-preview {
    /*top: 5px;*/
    /*right: 5px;*/
    z-index: 1000;
    /*position: absolute;*/
    background: white;
    height: 37px;
    width: 37px;
    border-radius: 19px;
    overflow: hidden;
    line-height: 37px;
    text-align: center;
    box-shadow: #999 -1px 1px 7px;
    cursor: pointer;
    top: 21px;
    right: 33px;
    position: fixed;
}

.template-preview-overlay .close-preview .fa:before{
    color: #337ab7;
}

.template-preview-overlay .spinner {
    display: none;
    position: absolute;
    transform: translate(-50%,-50%);
    top: 50%;
    left: 50%;
    text-align:center;
    z-index:1234;
    overflow: auto;
}

.template-preview-overlay .spinner img{
    height: 60px;
    width: 60px;
}

.template-preview-overlay #widget-container {
    overflow:visible;
    z-index:99999;
}

.template-preview-overlay .vhc{
    left: 50%;
    position: absolute !important;
    top: 50%;
    transform: translate(-50%, -50%);
}

.template-preview-overlay .hc{
    left: 50%;
    position: absolute !important;
    transform: translateX(-50%);
}

.template-preview-overlay .ba{
    bottom:0 ;
}

.get-widget-code > a{
    vertical-align: sub;
}

.template-slide .template-status{
    display: inline-block;
}

/* Widget based preview styling*/

#widget-display{
    overflow: auto;
}

#widget-display a:hover{
    opacity: 1;
}


/* UI Dialog styles*/

.ui-dialog .ui-dialog-buttonset button{
    border :1px solid grey !important;
    border-radius: 0;
}

.ui-dialog{
    z-index: 1001;
}

/* Header CSS Section starts */
.menu > li > .language-select {
    padding: 0 20px 0 0;
    margin: 0 0 0 20px;
    max-width: 80px;
    border: 0;
    border-right: 2px solid #2DA137;
    border-radius: 0;
    box-sizing: border-box;
    line-height: 10px;
    height: 22px;
    color: #2DA137;
    font-weight: normal;
    font-size: inherit;
}
/* Header CSS Section ends */

/* Needed to override z-index because of some other overlapping elements. */
.template-preview-overlay {
    z-index: 99999;
}

.top-bar .menu:first-child>li:first-child>a{
    border:0;
}

.top-bar .menu:first-child>li:nth-child(2)>a{
    border-right:2px solid #2DA137;
}

.no-js [data-responsive-toggle] {
    display: none;
}

@media print,
screen and (max-width: 639px){
    .top-bar .menu:first-child>li:nth-child(2)>a{
        border:0;
    }
}


.form-horizontal .control-label{
    text-align: left;
}

body.edit .form-horizontal #form-actions-row,
body.new .form-horizontal #form-actions-row{
    margin-left: 0;
}

.pl15{
    padding-left: 15px !important;
}

.edit-widget .button,
.new-widget .button,
.edit-template .button,
.new-template .button{
    vertical-align: top;
}

#toolbox-tools-resources ul,
#toolbox-tools-placeholder ul{
    max-height: 500px;
    overflow-y: auto;
}

.nowrap{
    white-space: nowrap
}

.header-separator {
    border-right:2px solid #2DA137 !important;
}
