/**
 * All of the CSS for your admin-specific functionality should be
 * included in this file.
 */
 @import url("../../includes/fontawesome/fontawesome.min.css"); 

/* esc grid */
 .esc-container{
   width:100%;
}
.esc-container:before, .esc-container:after, .esc-row:before, .esc-row:after, .esc-col-inner:before, .esc-col-inner:after{
   display: table;
   content: " ";
}
.esc-container:after, .esc-row:after, .esc-col-inner:after{
   clear: both;
}
.esc-sticky {
   position: fixed !important;
   top: 35px;
   width: auto;
   right:65px;
 }
 .analytics-value{
   display: inline-block;
    width: 50%;
    font-size: 14px;
    font-weight: 600;
    color: #134d6e;
    vertical-align: middle;
    line-height: 36px;
 }
 .graph{
   padding-left:30px;
 }
 .analytics .form-table tr:nth-child(even){
    background:#fff0eb;
 }
 .reset-analytics-value{
   float: right;
   background: #ff6318;
   color: #fff;
   padding: 8px 20px;
   border: 1px solid #ff6318;
   border-radius: 50px;
   cursor:pointer;
   text-transform:uppercase;
 }
 .analytics .form-table tr:nth-child(odd) {
   background: #f9f9f9;
}
 .reset-analytics-value:hover{
   background: #dd4800;
   border-color:#dd4800;
 }
 .analytics .form-table{
    width:100%;
}
.analytics .form-table th, .analytics .form-table td{
   padding: 15px 20px;
   color: #134d6e;
   text-transform: uppercase;
   font-size: 13px;
   vertical-align: middle;
}
#EscAdmin {
   position: fixed;
   bottom: 30px;
   z-index: 99999;
}
#EscAdmin .footer-icon{
   background: linear-gradient(45deg, #ff6116, #ef1638 );
    width: 22px;
    height: 22px;
    display: inline-block;
    vertical-align: middle;
}
#EscAdmin .footer-icon img{
   width:100%;
}
#EscAdmin a{
   text-decoration:none;
}
#EscAdmin .footer-bottom a{
   font-size:13px;
   color:inherit;
}
.esc-right {
   right: 30px;
}
.esc-left {
   left: 30px;
}
.esc-left .esc-btn-wrapper{
   text-align:left;
}
.icon-wrap-overlay{
   width: 100%;
   height: 100%;
   position: absolute;
   top: 0;
   background: #00000085;
   margin: auto;
   z-index: 99999;
   display: flex;
}
.icon-wrap{
   width: 70%;
   height: 408px;
   z-index: 999999;
   background: #fff;
   overflow: scroll;
   margin: auto;
}
.icon-wrap .icon{
   padding: 10px;
   border: 1px solid #f8f8f8;
   width: 20px;
   height: 20px;
   justify-content: center;
   align-items: center;
   display: inline-flex;
}
.icons-display{
   display: inline-flex;
   border-radius: 50%;
   width: 38px;
   height: 38px;
   background: #fff;
   padding: 5px;
   border: 1px solid #8c8f94;
   margin-right: 6px;
   justify-content: center;
   align-items: center;
   cursor: pointer;
}
.icon-wrap .icon:hover{
   background:var(--primary);
}
.icon-field span{
   min-height:11px;
}

/* Analytics Graph */

.bar-graph{
    position: relative;
    background: #fff;
    padding: 80px 30px 30px 60px;
}
.main-graph{
   height: 300px;
    position: relative;
    top: 0; 
}
.bar-graph-inner{
   position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: flex-end;
    bottom: 0px;
}
.bar-wrap {
   display: inline-block;
    width: 100%;
    position: relative;
    vertical-align: bottom;
    margin: 0 10px;
}
.bar-wrap .bar{
   background: #F63;
    width: 100%;
    height: 100%;
}
.graph-bg{
   width: 100%;
    height: 100%;
    display: block;
    position: relative;
    z-index: 0;
    bottom: 0;
    border-bottom: 1px solid #000;

}
.graph-bg span {
   height: 20%;
   display: block;
   border-top: 1px solid #d5d5d5;
}
.graph-desc{
   text-align: center;
   margin-top: 100px;
}
.graph-desc h4{
   font-size: 15px;
   text-transform: uppercase;
}
.bar-wrap span:first-child{
   transform: rotate(326deg);
    display: block;
    width: 120px;
    margin-top: -55px;
    position: absolute;
    font-weight: 600;
}
.bar-wrap span:last-child{
   transform: rotate(28deg);
    display: block;
    width: 120px;
    margin-top: 35px;
    position: absolute;
    font-weight: 500;
    line-height:13px;
}
.graph-title h2{
   font-size:17px;
   margin-bottom:20px;
   text-transform:uppercase;
}
.y-item{
   position: absolute;
    top: calc(50% - 70px);
    transform: rotate(270deg);
    left: -105px;
}
.esc-col50{
   width:50%;
   display:block;
   float:left;
}
.esc-col70{
   width:70%;
   display:block;
   float:left;
}
.esc-col30{
   width:30%;
   display:block;
   float:left;
   min-height: 1px;
}
.esc-col3{
   width:33.33%;
   display:block;
   float:left;
}
.esc-col-inner{
   padding:0 15px;
}
.esc-inner_row{
   margin-left: -15px;
    margin-right: -15px;
}
.about-esc-wrap{
   background: #fff;
    padding: 30px;
    margin-bottom: 30px;
}
.esc-btn{
   background: #2073a4;
    border-radius: 50px;
    padding: 10px 20px;
    color: #fff;
    border: 1px solid #2073a4;
    text-transform: uppercase;
    text-decoration:none;
    display:inline-block;
}
.esc-btn:hover{
   background:#134d6e;
   color:#fff;
}
.esc-description{
   margin-bottom: 10px;
   font-size: 15px;
    line-height: 25px;
}
.esc-description p{
   font-size:inherit;
}
.esc-description p a{
   color:#dd4800;
}
.esc-tab {
   background: #fff;
   padding: 30px;
   width: calc(100% - 60px);
   display: inline-block;
}
.esc-tab .nav-tab{
   border: 1px solid #eba685;
    background: #eba685;
    color: #ffffff;
    border-radius: 6px 6px 0px 0px;
    font-size:15px;
}
.esc-tab .nav-tab-active, .esc-tab .nav-tab:hover{
   background: #ff6318;
   border: 1px solid #ff6318;
}
.esc-tab .nav-tab-wrapper{
   border-bottom:none;
   margin-bottom:30px;
   border-bottom: 5px solid #ff6318;
}
.esc-tab .nav-tab-wrapper a{
   margin-right: 0.4em;
   margin-left: 0;
}
.esc-tab input[type=text], .esc-tab input[type=email], .esc-tab textarea{
   padding: 6px 15px;
   width: 100%;
}
.select-position {
   padding: 6px 15px !important;
   width: 100%;
   max-width:100% !important;
}
.esc-tab input[type=checkbox]{
   padding: 5px !important;
    width: 26px;
    height: 26px;
}
.esc-tab input[type=submit]{
   border: 1px solid #ff6318;
    background: #ff6318;
    color: #ffffff;
    font-size: 14px;
    padding: 7px 25px;
    border-radius: 50px;
    text-transform: uppercase;
    font-weight: 500;
}
.esc-tab input[type=submit]:hover{
   border: 1px solid #dd4800;
    background: #dd4800;
}
.wp-person a:focus .gravatar, a:focus, a:focus .media-icon img, a:focus .plugin-icon{
   box-shadow: 0 0 0 1px #ff6318, 0 0 2px 1px #ff6318;
}
#EscAdmin a:focus{
   box-shadow:none;
}
.icon-field input{
   width: calc(100% - 58px) !important;
}
.footer-icon{
   color:var(--esc-box-footer-icon-color);
}
#back-icon {
   position: relative;
   color: #fff;
   top: -14px;
   left: 0;
   width: 25px;
   height: 25px;
   display: block;
}
.back-default:before {
   content: "";
   width: 1px;
   height: 15px;
   position: absolute;
   background: #fff;
   transform: rotate(45deg);
}
.back-default:after {
   content: "";
   width: 1px;
   height: 15px;
   position: absolute;
   background: #fff;
   transform: rotate(-45deg);
   top: 10px;
}
.esc-item.style2 .esc-box-header .esc-desc span {
   color: var(--esc-box-icon-color);
   width: 70px;
   height: 70px;
   display: flex;
   justify-content: center;
   align-items: center;
   background: #ffffff;
   border-radius: 50px;
   margin-top: -54px;
   position: absolute;
   left: calc(50% - 40px);
   box-shadow: 0 2px 6px rgb(38 37 40 / 10%);
}
.esc-desc a{
   color:var(--primary-color);
   text-decoration:none;
}
.esc-desc span{
	display: inline-block;
    font-size: 30px;
    margin-bottom: 10px;
    font-weight: 600;
}
#mainScreen .esc-desc strong{
   font-size: 15px;
   width: 100%;
    display: block;
    margin-bottom: 10px;
}
.esc-item.style2 .esc-form-field input {
   font-size: 15px !important;
   color: black;
   display: block;
   border: 1px solid !important;
   line-height: 30px;
   height: 30px !important;
   -webkit-transition: border-color .2s,color .2s !important;
   transition: border-color .2s,color .2s !important;
   border-radius: 5px !important;
   padding: 0 10px !important;
   box-shadow: none;
   outline: 0;
   width: 100% !important;
   margin-right: 0;
   margin-bottom: 10px !important;
   border-color: #E9E9E9 !important;
}
.esc-item.style2 .esc-form-field textarea {
   color: black;
   font-size: 15px !important;
   width: 100%;
   height: 136px;
   margin-bottom: 10px !important;
   border-color: #E9E9E9 !important;
   padding: 10px;
   border-radius: 5px;
   font-weight: 400;
}
.esc-item.style2 .esc-form-field button {
   width: 100%;
   margin-left: 0;
   border-radius: 5px;
   background: var(--primary-color);
   border-color: var(--primary-color);
}
.esc-item.style2 .esc-form-wrapper .esc-form-field {
   display: block;
}
.esc-item.style2 .esc-box-header .esc-link-title {
   margin-top: 20px;
   font-weight: 500;
   margin-bottom: 10px;
   font-size: 15px;
   color: var(--secondary-color);
}
.esc-btn-wrapper {
   margin-top: 25px;
   text-align: right;
   width: 325px;
}
.esc-left .esc-btn-wrapper {
   text-align: left;
}
#EscPublic {
   position: fixed;
   bottom: 30px;
   z-index: 99999;
}
#EscBtn {
   border-radius: 50px;
   background: var(--primary-color);
   border-color: var(--primary-color);
   color: #fff;
   font-weight: 400;
   font-size: 16px;
   padding: 10px 20px;
   min-width: 54px;
   height: 54px;
   width: auto;
   border: 1px solid;
   cursor: pointer;
}
#EscBtn span.fa {
   padding-left: 10px;
}
#EscBtn span {
   padding-right: 10px;
}
.esc-box-header {
   padding: 35px 20px;
   background: var(--primary-color);
   margin-bottom: 50px;
}
#EscAdmin .esc-box-header {
   padding: 20px 20px;
   margin-bottom: 9px;
}
.esc-title {
   font-size: 20px !important;
   margin-top: 0;
   margin-bottom: 10px;
   color: #fff;
   line-height:28px;
   font-weight:400;
}
.esc-desc {
   background-color: white;
   box-shadow: 0 2px 6px rgb(38 37 40 / 10%);
   overflow: hidden;
   padding: 20px 15px;
   margin-bottom: -70px;
   font-size: 14px;
   font-weight: 300;
   line-height: 15px;
   color: var(--text-color);
}
.esc-desc .icon{
   color:var(--primary-color);
}
.esc-form-field {
   display: flex;
   justify-content: center;
   align-items: end;
}
.esc-form-field input {
   margin-top: 6px !important;
   margin-bottom: 0px !important;
   font-size: 14px !important;
   padding: 0 !important;
   width: 140px !important;
   height: 40px !important;
   border-bottom: 2px solid #d9d9d9 !important;
   border-top: 0 !important;
   border-right: 0 !important;
   border-left: 0 !important;
   border-radius: 0 !important;
   font-weight: 400 !important;
}
.esc-form-field button {
   width: calc(100% - 140px);
   padding: 0;
   margin-left: 10px;
   font-weight: 400;
   height: 36px !important;
   background: var(--primary-color);
   border-color: var(--primary-color);
   border: 1px solid;
   color: #fff;
}
.esc-box-footer {
   padding: 0 20px 20px;
   display: block;
   text-align:center;
}
.esc-links-wrapper {
   margin: 0 -5px;
}
.esc-link, .esc-plugin-link {
   width: calc(50% - 10px);
   background-color: white;
   box-shadow: 0 2px 6px rgb(38 37 40 / 10%);
   overflow: hidden;
   padding: 10px 0;
   height: 70px;
   float: left;
   color: var(--secondary-color);
   cursor: pointer;
   font-size: 12px;
   border-top: 3px solid transparent;
   -webkit-transition: border .2s,color .2s;
   transition: border .2s,color .2s;
   position: relative;
   margin: 5px;
   display: inline-grid;
   align-items: center;
   text-align:center;
}
.esc-plugin-link a, .footer-bottom a{
   text-decoration:none;
}
.style1 .esc-box-header {
   padding: 20px 20px;
   background: var(--primary-color);
   margin-bottom: 20px;
}
#esc-preview .esc-box-header {
   padding: 20px 20px;
   margin-bottom: 60px;
}
.esc-link span, .esc-plugin-link span {
   font-size: 24px;
   color: var(--esc-box-icon-color);
}
.esc-link-title {
   line-height: 15px;
   color: var(--secondary-color);
   padding:10px;
}
.esc-link:hover, .esc-plugin-link:hover {
   border-top: 3px solid var(--primary-color);
   color: black;
}
.footer-bottom {
   display: inline-block;
   margin-top: 20px;
   font-size: 12px;
   font-weight: 400;
   color: var(--text-color);
}
#EscAdmin .footer-bottom {
  padding:0 35px;
}
.esc-box {
   display:block;
   width: 320px;
   
   background-color: white;
   bottom: 100%;
   -webkit-transform-origin: center center;
   -ms-transform-origin: center center;
   transform-origin: center center;
   border-radius: 3px;
   text-align: center;
   box-shadow: 0 2px 10px rgb(38 37 40 / 25%);
   font-size: 15px;
  
}
.esc-preview-wrap{
   padding: 30px;
   border: 1px solid #e7e7e7;
   display: flex;
   align-items: center;
   justify-content: center;
   flex-direction: column;
   position:relative;
   background:#fff;
   z-index: 99;
}
.preview-title{
   font-size: 16px;
   text-transform: uppercase;
   font-weight: 600;
   text-align: center;
   margin-bottom: 20px;
   color: #2073a4;
}
.esc-form-field input::placeholder, .esc-form-field textarea::placeholder{
  color:#ccc;
  line-height:17px;
  font-weight:400;
   font-family: monospace;
}
/* Dashboard items */
.esc-dashboard-item{
   text-align:center;
    background: #fff;
}
.esc-dashboard-item span{
   display: block;
    font-size: 25px;
    margin-bottom: 20px;
    color: #f63;
}
.esc-dashboard-item a{
   font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    color: #000;
    display: block;
    padding: 30px 20px;
}
#EscBtn.EscBtnStyle span {
   padding: 0;
}
#EscBtn span {
   padding-right: 10px;
}
.EscBtnStyle span.text {
   display: none;
}
.EscBtnStyle span.icon:before {
   content: "";
   width: 1px;
   height: 32px;
   background: #fff;
   transform: rotate(45deg);
   display: inline-block;
}
.EscBtnStyle span.icon:after {
   content: "";
   width: 1px;
   height: 32px;
   background: #fff;
   transform: rotate(-45deg);
   display: inline-block;
}
.review-notice{
   border-left-color: rgb(241, 241, 241);
    padding: 0 !important;
}
.review-notice .star{
   display: flex;
   flex-direction: row-reverse;
   justify-content: left;
}
.review-notice .star span{
   color: #bbbbbb;
    font-size: 25px;
}
.review-notice .notice-dismiss:before{
   color:#fff !important;
   font-size:25px !important;
}
.review-inner{
   padding:20px 5px;
   display: inline-block;
}
.review-inner img{
   width:100%;
}
.review-notice span:hover ~ span, .review-notice span:hover{
   color:#ffc00e;
}
.review-notice h1{
   font-weight: 700;
}
.review-notice p{
   color:#000;
}
.review-btn{
   margin-top: 20px !important;
    margin-bottom: 20px !important;
}
.review-top-bar{
   background: #f63;
    color: #fff;
    padding: 15px 20px;
    font-size: 20px;
}
.review-btn a{
   padding: 10px 20px;
    background: #f63;
    color: #fff;
    text-decoration: none;
    border-radius: 5px;
}
.review-btn a:hover{
   background: rgb(219, 77, 29);
}
@media only screen and (max-width: 600px) {
   .esc-col50, .esc-col3{
      width:100%;
   }
   .esc-dashboard-item {
      margin-bottom:30px;
  }
  .bar-wrap span:last-child {
      transform: rotate(78deg);
      width: 94px;
      margin-top: 44px;
      margin-left: -26px;
   }
   .bar-wrap span:first-child {
      transform: rotate(291deg);
      width: 75px;
      margin-left: -14px;
  }
  .esc-sticky {
   position: relative !important;
   top: auto;
   width: auto;
   right: auto;
 }
   .esc-tab .nav-tab{
      font-size:13px;
   }
 }