/******FONTS*****/
@import url('https://fonts.googleapis.com/css?family=Lato|Open+Sans');

/****GENERAL TAGS****/
body {font-family: "Open Sans", sans-serif; font-size: 13px;color: #777777;  }
p {font-family: 'Open Sans', sans-serif; font-size: 12px;color: #777777;  }
/*img {width: 100%;}*/
a{color:#30c0d8; transition: 0.3s all linear }
a:hover, a:focus {color: #259fb3;text-decoration: none;}


/****CONTAINERS****/
.container {width: 1300px; max-width: 100%; margin-bottom: 30px}
.container-big {width: 100%; margin-bottom: 100px;}
.content { padding: 20px 20px 100px 20px; min-height: 100vh; min-height: calc(100vh - 48px);}
.content.nominheight{min-height: 0;}

/****** LOGIN ******/
.bg-gray { background-color: #dcdcdc; }
.vertical-middle { vertical-align: middle; }
.login-container .page-container .login-form { width: 450px; max-width: 100%; border-color: #ccc; }
.login-logo { margin: 10px; padding: 5px 20px 20px; display: inline-block; }
.login-form .btn-primary {background-color: #01c0da; border-color: #01c0da; font-size: 18px; }
.bg-img { position: absolute; top: 50%; transform: translateY(-50%); z-index: -1; }
.bg-img.left { left: 0; }
.bg-img.right {	right: 0; }


/****TITLES AND FONTS*****/
.content-title {position: relative; padding-bottom: 15px;}
.content-title:before{position: absolute; content: '';bottom: 0; width: 100px; height: 3px; background-color: #30c0d8 }
h1 {font-family: 'Poppins', Arial, sans-serif !important; color: #282d33}
h6{font-family: 'Poppins', Arial, sans-serif !important; }
h4{font-size: 16px;  color: #282d33;font-family: 'Poppins', Arial, sans-serif !important; }
h3{font-size: 14px;font-family: 'Poppins', Arial, sans-serif !important; }
.text-size-medium { font-size: 25px;  color: #282d33;  }
strong {color: #282d33}

/**** SECTION TITLE HEADER ****/
.sn-header-space{margin: 20px 0;}


/*****WELCOME*****/
.welcome-text {color: #777777; font-size: 12px; }
.welcome-text span{display: block;}
.welcome-text a{color: #30c0d8;}
.welcome-panel {min-height: 300px;}
.welcome-panel img { margin-bottom: 15px; width: 75px; padding-top: 10px; }
.welcome-panel .panel-title { font-size: 15px; color: #263238; }
.welcome-panel .panel-title span { color: #30c0d8; }
.welcome-panel .panel-title:before { position: absolute; content: ''; left: 50%; bottom: -8px; width: 100px; height: 2px; background-color: #ededed; transform: translateX(-50%); -o-transform: translateX(-50%); -ms-transform: translateX(-50%); -webkit-transform: translateX(-50%); }
.welcome-panel .panel-body { font-size: 12px; margin-top: 10px; color: #777777;}
.welcome-dropzone { min-height: 0; text-align: center; }
.welcome-dropzone .btn-primary { margin: 30px; background-color: #ff9228; border-color: #ff9228;}

/***WELCOME MSJ***/
.welcome-msj {padding-top:120px}

/*****EMPTY MESSAGE****/
.empty-dropzone {text-align: center; padding-top: 20px; padding-bottom: 20px}
.empty-dropzone img{ display: block; width: auto; margin: 20px auto }
.empty-dropzone .text-1 {color: #777777; margin-top: 10px; margin-bottom: 0;font-family: 'Poppins', Arial, sans-serif !important; font-weight: 300; font-size: 25px}
.empty-dropzone .text-2 {color: #8f8f8f; margin-top: 0; margin-bottom: 0;font-family: 'Poppins', Arial, sans-serif !important; font-weight: 300; font-size:16px}

/*****CLIENT LIST*****/
.content-top { position: relative; }
.content-top .content-title { padding-bottom: 5px; }
.content-top .btn-right { position: absolute; top: 23px; right: 10px; }
.client-filter, .client-list {font-size: 12px;}
.client-list .table-responsive { /*background-color: #fff;*/ border-radius: 5px; font-size: 13px}
.client-list .btn-primary {background-color: #fff; border-color: #d5d5d5; color:#333;}
.client-list i.icon-checkmark3 {color:#66BB6A;}
.client-list i.icon-cross2 {color:#F44336;}
.client-filter .form-group {margin-bottom: 10px}
.client-list .min-size {min-width: 125px}
.client-list .size {min-width: 150px}
.client-list .actions {min-width: 180px}
.client-list .datatable-header, .datatable-footer {padding: 20px 0 0 0;  }
.dataTables_paginate .paginate_button {min-width: 30px; height: 30px;line-height: 17px; }


/****** ELEMENTS - GENERAL******/

/****** TABS ******/
.content.big-tabs {  padding: 0 20px;  min-height: 0;}
.big-tabs.border { background: #ffffff; border-bottom: 1px solid #ddd}
.big-tabs .nav > li > a {position: relative;  display: block; padding: 10px 37px 10px 0;}
.big-tabs .nav-tabs { margin-bottom: 0;  border-bottom: 0;  }
.big-tabs .nav-tabs > li { font-size: 16px; font-family: 'Poppins', Arial, sans-serif}
.nav-tabs.nav-tabs-bottom > li > a::after {height: 3px; bottom: -1px }
.nav-tabs.nav-tabs-bottom > li.active > a::after {background-color: #30c0d8; width: 85%; }
.big-tabs .nav-tabs > li:nth-of-type(2) {margin-left:10px}
.big-tabs .nav-tabs > li:nth-of-type(3) {margin-left: 10px}
.big-tabs i {color: #cccccc}
.big-tabs button i {color: #263238}

/***** INPUTS*****/
.radio-inline, .checkbox-inline {font-family: 'Poppins', Arial, sans-serif !important; font-size: 12px; text-align: left; line-height: 30px;}
.checker span {color: #282d33; border: 2px solid #282d33;}
.choice span {border: 2px solid #282d33;}
.border-primary-600 {border-color: #282d33;}
.checker span::after {color: #263238;}

/*****BUTTONS***/
.btn-primary { font-size: 13px !important; background-color: #01c0da;border-color: #01c0da;  }
.btn-primary.orange { font-size: 13px !important; background-color: #ff9228; border-color: #ff9228;}
.btn-primary:hover {background-color: #2fb6cd;border: 1px solid #259fb3;  }
.btn-cancel { font-size: 13px; background-color: #fafafa ; border-color: #d5d5d5 ; color: #777777 ;}
.btn-default { color:  #263238;  background-color: #fcfcfc;  border-color: #ddd; max-width: 135px; padding: 7px 10px;  }
.btn-primary:active, .btn-primary.active, .open > .dropdown-toggle.btn-primary {background-color: #2fb6cd;border: 1px solid #259fb3; }
.btn-primary:active:hover, .btn-primary.active:hover, .open > .dropdown-toggle.btn-primary:hover, .btn-primary:active:focus, .btn-primary.active:focus, .open > .dropdown-toggle.btn-primary:focus, .btn-primary.focus:active, .btn-primary.active.focus, .open > .dropdown-toggle.btn-primary.focus {
	background-color: #2fb6cd;border: 1px solid #259fb3; }
.btn-primary:focus, .btn-primary.focus, .btn-primary:hover {background-color: #2fb6cd;border: 1px solid #259fb3;}

/****** SIDEBAR ******/
.sidebar {width: 220px}
.sidebar .navigation li{ text-transform: uppercase; }
.navigation li a:hover, .navigation li a:focus { background-color: #30c0d8; }
.navigation > li.active > a, .navigation > li.active > a:hover, .navigation > li.active > a:focus {background-color: #30c0d8;  color: #fff;  }
.sidebar-xs .sidebar-main .navigation > li > a > span {background-color: #30c0d8;  border: 1px solid #30c0d8; width: 170px; right: -170px}



/****** NAVBAR ******/
.navbar-inverse { background-color: #263238; z-index: 1002; }
.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus { color: #282d33}

/****** PAGINATION ******/
.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus { z-index: 3;  color: #30c0d8;  background-color: #FFFFFF;  border-color: #DDDDDD;  cursor: default;font-weight: 600;  }

/*****SELECT 2****/
.select2-selection--single .select2-selection__rendered { font-size: 13px;  }
.select2-results__option[aria-selected="true"] { background-color: #01c0da  }


/*****NAVIGATION*****/
.navigation { padding-top: 0 }

/*****MULTI SELCT*****/
.select2-selection--multiple .select2-selection__choice {background: #f1f1f1; color: #777777;}
.select2-selection--multiple .select2-selection__choice .select2-selection__choice__remove { float: left;margin-right: 7px;font-size: 20px;margin-top: 0;margin-left: 0;font-weight: 600; }


/**** TOPS FILTERS****/
/*.top-filters {width: 720px; float: right}*/
.top-filters .radio-inline, .checkbox-inline {font-family: "Open Sans", sans-serif !important}
.top-filters .radio .choice, .radio-inline .choice {top: 9px;}
.top-filters .btn-default {max-width: 100%; }
.top-filters .choice span {top: 8px !important}



/***OVERALL***/

/***** FILTERS****/
.container-big.overall label.text-semibold { text-align: right;}

/****TABLES****/
thead {color: #282d33}
.datatable-scroll-wrap { background: #ffffff;border-radius: 3px;border: 1px solid #dddddd; }
tr.multi-account { background:#f0f0f0; }


/*RESULTS*/
/*.overall .datatable-header {display : none}*/
/*.overall .datatable-footer {display: none }*/
.datatable-header { padding: 20px 0 0 0; }
.account{max-width: 160px;text-overflow: ellipsis;  white-space: nowrap;  overflow: hidden; }




/****CHART TOOLTIP****/
.toolText_big {width: 120px;}
.toolText_ctn {margin:10px auto 10px;  width:80%; overflow: hidden;}
.toolText_ctn img {float: left;}
.toolText_right{text-align: right;color:#444 ; font-family: 'Open Sans', sans-serif; font-size: 13px; float: right; line-height: 25px; margin-left: 10px;}
.toolText_title {text-align: center; font-size:14px; color: #8f8f8f; font-family: 'Open Sans', sans-serif; padding-top: 15px;}
.raphael-group-16-buttons {background-color: red !important;}
.toolText_center{width: 100%; display:block; text-align: center;color:#fafafa ; font-family: 'Open Sans', sans-serif; font-size: 13px; line-height: 25px;padding: 5px;}


/****ACTION CONTAINER*****/
.action-container label{ float: left; line-height: 30px; margin-right: 6px;}
/*.action-container2 label{ float: right; line-height: 30px; margin-left: 6px;}*/
/*.action-container input{ width: 45px; float: left; margin: 0 10px; text-align: center; }*/
/*.action-container span { float: left; line-height: 30px; }*/


/*****THUMNAILS*****/
.thumbnail .thumb i {color: #ffffff;}
.label.posts-count {background: #bbbbbb;margin-left: 10px; font-weight: 600; letter-spacing: 0.5px}
.active .label.posts-count {background: #30c0d8;margin-left: 10px;}

/****** MODALS ******/
.modal-header { background-color: #263238;  border: none;  padding: 15px 30px;  }
.modal-body h6 { color: #263238; font-weight: normal; display: inline-block; width: 100% }
.modal-body { overflow: hidden; padding: 15px 30px; }
.modal.in .modal-dialog { z-index: 1040; }
.modal-body .nav-tabs.nav-tabs-bottom > li.active > a::after {width: 100%;}

/****** ADD ACCOUNT ******/
.add-modal.modal.in .modal-dialog { top: 50%; transform: translateY(-50%); }
.add-modal .bg-primary { background-color: #263238 ; border: none; padding: 15px 30px; }
.add-modal .modal-body { padding: 15px 30px; }
.add-modal .modal-body h6 { color: #333; }
.add-modal .login-options { font-size: 12px; line-height: 25px; color: #777777 ; text-align: left }
.add-modal .checkbox-switchery.checkbox-inline{margin-bottom: 10px; width:30%; text-align: right}
.add-modal .checkbox-switchery.checkbox-inline label{width: 100%;}
.add-modal .switchery-double.switchery-sm .switchery {width: 75%;}
.add-modal .checkbox-inline + .checkbox-inline { margin-top: 8px; }
.add-modal .format-box {float: right; margin-top: 38px;}
.add-modal .format-box-right { margin-right: 40px;}
.add-modal .intelligent-filter .switchery-double.switchery-sm .switchery {width: 25%;}

/****** ADD TASK ******/
.add-task .modal-dialog {width: 750px;margin: 30px auto; max-width: 95%;  }
.add-task .modal-body {padding: 15px 30px 30px 30px;}
.add-task a {display: block}
.add-task a img {width:auto; height: 40px; filter: grayscale(100%); -webkit-filter: grayscale(100%); opacity: 0.2; transition: 0.2s all linear; margin-top: 10px;}
.add-task a:hover img{width:auto; height: 40px;  filter: grayscale(0); -webkit-filter: grayscale(0); opacity: 1;transition: 0.2s all linear}
.add-task .panel-heading h3{color:#bbbbbb ;margin-top: 0; margin-bottom: 0; line-height: 33px; }
.add-task .panel-heading .media-box{ width: 108px; margin: 0 auto; }
.add-task a:hover .panel-flat{border: 2px solid #01c0da;transition: 0.2s all linear}
.add-task a .panel-flat{border: 2px solid #dddddd;transition: 0.2s all linear}
.add-task .panel-heading {padding: 0 6px;}
.add-task .panel{-webkit-box-shadow: 0 1px 1px transparent;box-shadow: 0 1px 1px transparent;  }
.add-task .modal-body h6 span { color: #777777; font-size: 13px; }
.add-task .footer-note {padding-top: 18px;}
.add-task .footer-note a {display: inline-block;}

.add-task .source-tab {width: 20%; float: left;padding-left: 10px;padding-right: 10px;}
.add-task .action-ctn {width: 80%; float: left;padding-left: 10px;padding-right: 10px;}
.add-task .action-ctn .radio-inline, .add-task .action-ctn label {float: left;}
.add-task .radio + .radio, .add-task .checkbox + .checkbox {margin-top: 8px;}
.add-task .radio label, .add-task .checkbox label {padding-left: 14px;}
.add-task .radio .choice, .add-task .radio-inline .choice {top: 0 !important}
.add-task .multi-account {float: left; width: 100%}

.add-task .advanced {margin-bottom: 30px;}

/*ACTIVE*/
.add-task .panel-flat.active {border: 2px solid #01c0da}
.add-task .panel-flat.active .panel-heading h3{color:#282d33}
.add-task a .active img {width:auto; height: 40px; filter: grayscale(0);  -webkit-filter: grayscale(0);opacity: 1;transition: 0.2s all linear;}
.add-task .advanced .radio-inline .choice {top: 5px}
.advanced .panel-flat > .panel-heading {min-height: 108px;}

/*DELETE*/
.delete-modal label { color: #444444; font-size: 13px !important; }
.delete-modal .modal-body { top: 0; padding-top: 0;}
.delete-modal .modal-header { background-color: transparent; border: none; }
.delete-modal .modal-dialog { width: 400px; margin: 12% auto 0; max-width: 90%; }
.delete-modal .modal-body .title{ text-align: center;color: #8f8f8f; font-size: 18px; font-weight: 400; line-height: 27px; margin: 20px auto 0; }
.delete-modal .modal-img { margin: auto; width: 100px; }
.delete-modal .modal-img img { width: 100%; }
.delete-modal .modal-content { border: none !important; background: #ffffff;}
.delete-modal .modal-footer { border-top: none; padding-bottom: 20px; text-align: center; }


/****LABELS AND BARS**/
.bg-progress {background-color: #f0af51; border-color: #f0af51; color: #fff;}
.progress-bar.progress-bg {background-color: #f0af51 }

.bg-pending {background-color: #f0af51; border-color: #f0af51; color: #fff;}
.progress-bar.pending-bg {background-color: #f0af51 }

.bg-cancelled {background-color: #ca4747; border-color: #ca4747; color: #fff;}
.progress-bar.cancelled-bg {background-color: #ca4747 }

.bg-finished {background-color: #86bc63; border-color: #86bc63; color: #fff;}
.progress-bar.finished-bg {background-color: #86bc63 }

.bg-paused {background-color: #f0af51; border-color: #f0af51; color: #fff;}
.progress-bar.paused-bg {background-color: #f0af51 }

.bg-error {background-color: #ca4747; border-color: #ca4747; color: #fff;}
.progress-bar.error-bg {background-color: #ca4747 }

.bg-archive {background-color: #758db2; border-color:#758db2; color: #fff;}

/*****PANELS****/
.panel-flat  { float:left; width: 100%;}
.panel-flat > .panel-heading {width: 100%; float: left}
.task-grid .task-panel > .panel-heading { float: none}
.task-grid .task-panel > .panel-heading .panel-num{ float: left; color: #333; font-weight: 600; font-size: 15px;}
.task-grid .task-panel > .panel-heading .panel-title{ font-size: 13px; line-height: 24px}
.task-grid .task-panel > .panel-heading > .panel-title {margin-top: 0;margin-bottom: 0;}


/*PANEL LABEL MULTIACCOUNT**/
.panel-multi-account{ border: 1px solid #dddddd; position: relative; border-radius: 3px; padding: 8px 10px; margin-bottom: 10px; }
.panel-multi-account .icon-plus3 {position: absolute;right: 11px;top: 22px;color: #333333; }
.panel-multi-account .heading-elements {top: 27px;right: 31px;}

.manage-account .task-panel > .panel-heading { float: none}
.manage-account .task-panel .panel-body { min-height: 192px;}
.manage-account .task-panel .account-icon { float: left; font-size: 20px; margin-right: 10px; margin-top: 3px; color: #ddd; }
.manage-account .task-panel { min-height: 260px;}
.manage-account .task-panel .btn-default, .manage-account-hours .task-panel .btn-default { max-width: 120px; }
.manage-account .manage-dropzone { min-height: 260px; background-color: #f5f5f5; border-color: #d5d5d5; }

.manage-account-hours .task-panel .panel-title{ display: inline-block; font-size: 14px;}
.manage-account-hours .task-panel .schedule-container { width: 100%; }
.manage-account-hours .task-panel .schedule-container .day-box { width: 11%; float:left; min-width: 75px; text-align: left; }
.manage-account-hours .task-panel .schedule-container .hour-container { width: 89%; display: inline-block; overflow-x: auto;}
.manage-account-hours .task-panel .schedule-container .hour-container .hour-text, .manage-account-hours .task-panel .schedule-container .hour-container .hour-boxes-container {	width: 100%; }
.manage-account-hours .task-panel .schedule-row { height: 30px; margin-bottom: 3px; line-height: 30px; }
.manage-account-hours .task-panel .hour-container .schedule-row {width: 795px;}
.manage-account-hours .task-panel .hour-text-content{ display: inline-block; width: 30px; height: 30px; float: left; background-color: #fff; margin-left: 3px; text-align: center; }
.manage-account-hours .hour-box { width: 30px; height: 30px; float: left; background-color: #f5f5f5; margin-left: 3px; border-radius: 3px; border: 1px solid #d5d5d5; cursor: pointer }
.manage-account-hours .hour-label { float: left; line-height: 30px; margin: 0 15px; }
.manage-account-hours .task-panel .hour-box:hover:not(.active) { background-color: #86bc63; border-color: #86bc63; opacity: 0.5; }
.manage-account-hours .hour-box.active { background-color: #86bc63; border-color: #86bc63; }
.manage-account-hours .task-panel .manage-dropzone { min-height: 195px; background-color: #fff; }


/*EMAIL CONFIGURATION*/
.panel-email-config {border: 1px solid #dddddd;position: relative;border-radius: 3px; background: #ffffff; color:#282d33; height: 62px; line-height: 62px; color: #282d33;}
.panel-email-config a {color: #282d33;}
.panel-email-config .title{ line-height: 44px; margin-left: 15px;}
.panel-email-config .title .icon-big{ font-size: 20px}
.panel-email-config i.position{position: absolute;font-size: 22px;top: 20px;right: 12px;}
.panel-email-config-detail {padding: 20px;background: #ffffff;border: 1px solid #dddddd;border-radius: 3px;border-top-left-radius: 0;border-top-right-radius: 0;border-top: 0; margin-bottom: 10px;}


/***** SELECT BOX*****/
.select-box-list {float: left; width: 100%; margin-bottom: 10px;}
.select-box-list span{display: inline-block; float: left; color: #263238; line-height: 30px; width: 70px}
.select-box-list span.small{font-size: 11px;margin-left: 12px;color: #999999;}
.select-box-list ul {list-style: none; float: left;padding-left: 0;}
.select-box-list ul li {width: 30px; height: 30px;margin-left: 5px;border-radius: 3px;border: 1px solid #d5d5d5; cursor: pointer; float: left; transition: 0.2s all linear;}
.select-box-list ul li:hover {background-color: #86bc63;border-color: #86bc63;opacity: 0.5;}
.select-box-list ul li.active {background-color: #86bc63;border-color: #86bc63;}

/***** LABELS******/
.label.bg-grey-400 {background-color:#aeaeae;border-color: #aeaeae;color: #fff;text-transform: none;font-size: 12px;margin-bottom: 3px;}


/****** FOOTER ******/
.footer img{ width: 270px; }



/****** GENERAL ******/
.pad0 {padding-left: 0; padding-right: 0;}
.pad15 {padding-left: 15px; padding-right: 15px;}
.pad20 {padding: 20px;}
.top0{margin-top: 0;}
.top-10{top: -10px;}
.left10 {margin-left: 10px;}
.top5 {margin-top:5px}
.top10 {margin-top:10px}
.top15 {margin-top:15px}
.top20 {margin-top: 20px}
.top25 {margin-top: 25px}
.top30 {margin-top: 30px}
.top35{margin-top: 35px;}
.top40{margin-top: 40px;}
.top50{margin-top: 50px;}
.bottom0 {margin-bottom: 0;}
.bottom10 {margin-bottom: 10px;}
.bottom20 {margin-bottom: 20px;}
.bottom30 {margin-bottom: 30px;}
.bottom35{margin-bottom: 35px;}
.bottom40{margin-bottom: 50px;}
.bottom50{margin-bottom: 50px;}
.bottom100 {margin-bottom: 100px;}
.right0 {margin-right: 0;}
.right40{ margin-right: 40px; }
.left0 {margin-left: 0;}
.left5 {margin-left: 5px;}
.left15 {margin-left: 15px;}
.left35 {margin-left: 35px;}
.right20 {margin-right: 20px}
.footer { background-color: #fff; width: 100%; left: 0; bottom: 0; text-align: center; padding: 10px; z-index: 1;}
.text-blue {color: #30c0d8 !important}
.pos-relative { position: relative; }
.p-top0 {padding-top: 0 !important}
.p-top20 {padding-top: 20px;}
.p-right0 { padding-right: 0; }
.p-left0 { padding-left: 0; }
.separator { width: 100%; height: 1px; background: #dddddd; margin-top: 20px; margin-bottom: 20px}
.separator-xs { width: 100%; height: 1px; background: #dddddd; margin-top: 0; margin-bottom: 0}
.counter {font-family: 'Open Sans', sans-serif; text-align: right }
label {  margin-bottom: 7px;  font-weight: 400;  font-size: 13px;  color: #282d33;  }
.navbar .navbar-header .navbar-brand img.dash-logo {width: 124px; height: auto;}
.navbar-brand > img {margin-top: 3px;height: 16px; width: auto}
.position-left {margin-right: 2px;}
.button-back {font-size: 15px}
.bg-light-danger {background-color: #f2dede;}
.bg-light-warning {background-color: #fcf8e3;}
.bg-light-success {background-color: #dff0d8;}


/*FONTA*/
.h1, h1 {font-size: 22px;}


/*IMPUTS*/
/*CALENDAR*/
.range_inputs .cancelBtn.btn.btn-sm.btn-small.btn-default { max-width: 100%;  }

/*ICONS*/
[class^="icon-"], [class*=" icon-"] {font-size: 12px}



@media (max-width: 1366px){

	/*****WELCOME*****/
	.welcome-msj {padding-top: 75px;  }

	/*****TASK GRID*****/
	.task-grid .task-panel > .panel-heading > .panel-title {width: 65%;text-overflow: ellipsis;white-space: nowrap; overflow: hidden;  }
}

@media(max-width:1280px) {

	/****CONTAINERS****/
	.container {padding-left: 0; padding-right: 0}
	.container-big {padding-left: 15px; padding-right: 15px}

	.welcome-panel {min-height: 400px;}
	.welcome-msj {padding-top: 50px;  }

	/*MANAGE ACCOUNT*/
	.manage-account-hours .task-panel .schedule-container .hour-container {width: 88%;}
	.manage-account-hours .task-panel .hour-text-content {width: 27px; height: 27px}
	.manage-account-hours .hour-box {width: 27px;height: 27px;}
	.manage-account-hours .task-panel .hour-container .schedule-row {width: 720px;  }
}

@media(max-width:1024px) {
	.welcome-panel {min-height: 275px;}
}


@media(max-width:990px){

	/*****PANELS****/
	.manage-account-hours .task-panel .manage-dropzone { margin-top: 20px; margin-bottom: 20px; }
	.manage-account-hours .task-panel .account-status {position: absolute; top:1px; right: 0;}
	.manage-account-hours .task-panel .schedule-container .hour-container { width: calc(100% - 100px); }
	.manage-account-hours .task-panel .schedule-container .day-box { text-align: left; }
	.manage-account-hours .task-panel .schedule-box .panel-title { margin-left: 0; }

	.manage-account-hours .task-panel .hour-text-content {width: 26px; height: 26px}
	.manage-account-hours .hour-box {width: 26px;height: 26px;}
	.manage-account-hours .task-panel .hour-container .schedule-row {width: 700px;  }

	/***WELCOMEN MSJ***/
	.welcome-msj {padding-top: 7px;  }

	/***CLIENT LIST****/
	.client-list .btn-primary span {display: none;}
	.client-list .btn-primary i {margin-right: 0;}

	/***TOP FILTERS***/
	.top-filters {width: 100%}
	.top-filters.top50 {margin-top: 20px;}
	/*****MODAL***/
	/****** ADD TASK ******/
	/*ACTIVE*/
	.advanced .panel-flat > .panel-heading {min-height:auto}

	/*OVERALL*/
	/***** FILTERS****/
	.container-big.overall label.text-semibold { text-align: left;}

}

@media(max-width:768px) {

	/****CONTAINERS****/
	.content { margin-bottom: 0; padding-bottom: 120px; }


	/*****GENERAL****/
	.login-options, .login-options .text-right { text-align: left !important}

	/***WELCOME***/
	.welcome-msj {text-align: center !important; padding-bottom: 40px; padding-top: 20px}

	/***OVERALL**/
	.overall .text-center{padding-bottom: 10px; padding-top: 10px}

	/***OVERALL**/
	.pagination-container {text-align: center;}

	/*GRID*/
	.heading-elements, .breadcrumb-elements {display: block; margin-top: -8px;  }
	.heading-elements .heading-text {margin-top: 0;}
	/****MODALSS****/

	/****** ADD ACCOUNT ******/
	.add-modal.modal.in .modal-dialog { width: 575px; margin: 0 auto; }
	.add-modal h6.text-semibold { font-size: 14px}

	/**** ADD TASK ****/
	.add-task .source-tab {width: 50%;}
	.add-task .panel-heading .media-box {width: 98%;}
	.add-task a img {height: 30px; float: left;}
	.add-task .active img {height: 30px; }
	.add-task a:hover img {height: 30px;}
	.add-task .panel-heading h3 {line-height: 50px}

	/**** MODAL TABS****/
	.modal-body .nav-tabs::before {display: none;}
	.modal-body .nav-tabs.nav-justified > li {float: left; width: 50%;}
	.modal-body .nav-tabs.nav-justified {border-bottom: 1px solid #ddd; border: 0;}
	.modal-body .nav-tabs > li.active > a::after, .nav-tabs > li.active > a:hover::after, .nav-tabs > li.active > a:focus::after {bottom: 0; top: 100%;}
	.modal-body .nav-tabs.nav-justified > li > a, .nav-pills.nav-justified > li > a, .nav-tabs.text-center > li > a, .nav-pills.text-center > li > a, .nav-tabs.text-right > li > a, .nav-pills.text-right > li > a {text-align: center;background: transparent;}


	/****** ELEMENTS - GENERAL******/
	/****** TABS ******/
	.big-tabs .nav-tabs {  border-bottom: 0;  position: relative;  background-color: transparent;  padding: 0;  border: none;  border-bottom-width: medium;  border-bottom-style: none;  border-bottom-color: currentcolor;  border-radius: 0;  }
	.big-tabs .nav-tabs > li {float: none;  display: inline-block;  }
	.big-tabs .nav-tabs::before {content: '';  color: inherit;  font-size: 12px;  margin-top: 0;  margin-left: 0;  margin-bottom: 0 }
	.big-tabs .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus { border: 0; background-color: transparent;  }
	.big-tabs .nav-tabs.nav-tabs-bottom > li > a::after { height: 3px;  top: 100%; width: 80%  }
	.big-tabs .top30 {margin-top: 15px}
	.counter {padding-bottom: 15px;}
	.big-tabs .top40 {margin-top: 10px;}
	.big-tabs .nav-tabs > li:nth-of-type(2) {margin-left: 0;}
	.big-tabs .nav-tabs > li:nth-of-type(3) {margin-left: 0;}
	.big-tabs .nav-tabs > li > a:hover, .nav-tabs > li > a:focus {background-color: transparent;}

	/*SIDEBAR*/
	.sidebar {width: 100%; }

	/*****BUTTOM ADD*****/
	.btn.btn-primary.js-modal-add-task {margin-top: 20px}
}

@media(max-width:640px){
	/*****MODAL*****/
	/****** ADD ACCOUNT ******/
	.add-modal.modal.in .modal-dialog { width: 90%; }
	.add-modal .format-box-right { margin-right: 20px;}
}

@media(max-width:480px){

	/*****PANELS****/
	.manage-account .task-panel > .panel-heading .panel-title{ font-size: 12px; margin-top: 3px;}
	.manage-account-hours .task-panel .account-status {position: relative; top:initial; right: initial;}
	/*****BUTTONS*****/
	.content-top .btn-primary.btn-manage { position: relative; top: initial; right: initial; }

	/*****MODAL*****/
	/****** ADD ACCOUNT ******/
	.add-modal .checkbox-switchery.checkbox-inline { width: 100%; text-align: center; }
	.add-modal .checkbox-inline + .checkbox-inline { margin-left: 0; }
	.add-modal .intelligent-filter .checkbox-switchery.checkbox-inline {width: 100%;text-align: left;margin-left: 10px;}
	.add-modal .format-box { float: none; margin-top: 20px; text-align: center; }
	/**** ADD TASK ****/
	.add-task .source-tab {width: 100%;}
	.add-task .footer-note {line-height: 25px;}

	/*****MULTIACCOUNT****/
	.panel-multi-account {width: 100%; float: left}
	.panel-multi-account .heading-elements {position: initial;float:right;margin-top: 10px;  }
	.panel-multi-account .multiaccount-detail {float: left; width: 100%}
	.heading-elements, .breadcrumb-elements {display: block; margin-top: 5px;position: initial;float: right;}

	.task-grid .heading-elements  {position: initial; float: rigth; margin-top: 5px}
	.task-grid .panel-body{margin-top: 20px}

	/****** ELEMENTS - GENERAL******/
	/****** TABS ******/
	.big-tabs .nav-tabs > li {font-size: 12px;}
	.big-tabs .nav > li > a {padding-right: 18px;}

}

@media(max-width:360px){
	/****MEDIA ****/

	/*****BUTTONS*****/
	.manage-account-hours .task-panel .btn-primary { margin-left: 100px; margin-top: 10px; }

	/*TABLE BUTTONS*/
	.table .btn-default {float: none;display: block; margin-top: 10px;}
	.table .btn-default.left5 {float: none;display: block; margin-top: 10px; margin-left: 0}

}

/** CUSTOM **/
.loader-video-processing {
	position: relative;
	display: flex;
}
.loader-video-processing:before {
	display: block;
	content: '';
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
.loader-video-processing:after {
	display: block;
	content: '';
	position: absolute;
	top: calc(50% - 20px);
	left: calc(50% - 20px);
	width: 40px;
	height: 40px;
	border-radius: 40px;
	border: 5px solid rgb(217, 217, 217);
	animation: pulsate 1s ease-out;
	animation-iteration-count: infinite;
}
.loader-video-processing img {
	margin: auto;
	position: relative;
	z-index: 2;
}

.loader-cover {
	width: 100%;
	height: 100%;
	z-index: 6;
	display: none;
	position: absolute;
	left: 0;
	top: 0;
}

.loader-cover.popup-loader {
	background-color: rgba(0, 0, 0, 0.5);
}

.loader-cover.block-loader {
	background-color: transparent;
}

.loader-cover.chart-loader {
	background-color: rgba(245,245,245, 0.5);
}

.loader-cover.block-white-bg-loader {
	background-color: rgba(255, 255, 255, 0.3);
}

.loader-cover.container-loader {
	background-color: rgba(0, 0, 0, 0.2);
	z-index: 1001;
	position: fixed;
}

.css-loader-circle {
	z-index: 2;
	border-radius: 40px;
	height: 40px;
	left: 50%;
	margin: -20px 0 0 -20px;
	opacity: 0;
	position: absolute;
	top: 50%;
	width: 40px;
	animation: pulsate 1s ease-out;
	animation-iteration-count: infinite;
}

.loader-cover.container-loader .css-loader-circle,
.modal-backdrop .css-loader-circle,
.loader-cover.popup-loader .css-loader-circle {
	border: 5px solid #fff;
}

.loader-cover.block-loader .css-loader-circle,
.loader-cover.chart-loader .css-loader-circle,
.loader-cover.block-white-bg-loader .css-loader-circle {
	border: 5px solid rgb(217, 217, 217);
}

@keyframes pulsate {
	0% {
		transform: scale(.1);
		opacity: 0.0;
	}
	50% {
		opacity: 1;
	}
	100% {
		transform: scale(1.2);
		opacity: 0;
	}
}

.loading-post .popup-loader {
	display: block;
}

.sidebar-main {
	z-index: 1002;
}

.visible-task {display: block;}
.visible-task .panel-heading p {margin: 0;}
.visible-task .panel-heading p.transparent-color {color: transparent;}

.hidden-task {
	display: none;
}

.user-likes-style .form-control {
	width: 16.66666667%;
	float: left;
}

.user-likes-style .col-xs-6 {
	width: 50%;
	float: left;
}

.user-likes-style .help-block {
	float: left;
}

#map-canvas {
	/*width: 687px;*/
	width: 100%;
	height: 500px;
	overflow: hidden;
	background-color: #c0c0c0;
}

.daterangepicker.dropdown-menu {z-index: 1003;}
.last-grouped-task td {border-bottom: 2px solid #ddd;}

.static-block-loader {
	width: 100%;
	height: 350px;
	position: relative;
}

/*.uploadcare--dialog img {width: auto !important;}*/

.uploader-progress-bar {
	top: 70%;
	position: absolute;
	width: 80%;
	margin: auto 10%;
	background-image: none;
	font-size: 12px;
	line-height: 20px;
	/*-webkit-box-shadow: inset 0 -1px 0 rgba(100, 100, 100, .15);*/
	/*-moz-box-shadow: inset 0 -1px 0 rgba(100, 100, 100, .15);*/
	/*box-shadow: inset 0 -1px 0 rgba(100, 100, 100, .15);*/
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
}

.uploader-progress-bar progress[value] {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;

	/* Get rid of default border in Firefox. */
	border: none;

	/* For IE10 */
	color: #3399c4;
}

.uploader-progress-bar progress[value]::-webkit-progress-value {
	background-image: -webkit-linear-gradient(-45deg, transparent 33%, rgba(0, 0, 0, .1) 33%, rgba(0, 0, 0, .1) 66%, transparent 66%),
	-webkit-linear-gradient(top, rgba(255, 255, 255, .25), rgba(0, 0, 0, .25)),
	-webkit-linear-gradient(left, #5cb85c, #3399c4);

	border-radius: 2px;
	background-size: 35px 20px, 100% 100%, 100% 100%;

	-webkit-animation: animate-stripes 5s linear infinite;
	animation: animate-stripes 5s linear infinite;
}

@-webkit-keyframes animate-stripes {
	100% {
		background-position: -100px 0;
	}
}

@keyframes animate-stripes {
	100% {
		background-position: -100px 0;
	}
}

.uploader-progress-bar progress[value]::-moz-progress-bar {
	background-image: -moz-linear-gradient(
			135deg,
			transparent 33%,
			rgba(0, 0, 0, 0.1) 33%,
			rgba(0, 0, 0, 0.1) 66%,
			transparent 66%
	),
	-moz-linear-gradient(
			top,
			rgba(255, 255, 255, 0.25),
			rgba(0, 0, 0, 0.25)
	),
	-moz-linear-gradient(
			left,
			#5cb85c,
			#3399c4
	);

	border-radius: 2px;
	background-size: 35px 20px, 100% 100%, 100% 100%;
}

.uploader-progress-bar h3 {
	font-size: 14px;
}

.uploader-progress-bar p, .uploader-progress-bar h5 {
	font-size: 12px;
}

.uploader-progress-bar h3, .uploader-progress-bar h5 {
	color: #fff;
}

a.ui-slider-handle.ui-state-default.ui-corner-all {
	background-color: #0099e5;
}

#slider {
	width: 85%;
	margin: 5px 10px -1px;
	display: inline-block;
	top: 0;
}

#slider-val {
	text-align: center;
	margin-bottom: 20px;
}

[v-cloak].v-cloak-stage {
	display: none;
}
.extension-list-group {
	height: 200px;
	overflow-y: auto;
	position: relative;
}
.extension-cover {
	text-align: center;
	margin-top: 80px;
}

.vue-js-switch {
	display: inline-block;
	position: relative;
	overflow: hidden;
	vertical-align: middle;
	user-select: none;
	font-size: 10px;
	cursor: pointer;
}
.vue-js-switch .v-switch-input {
	opacity: 0;
	position: absolute;
	width: 1px;
	height: 1px;
}
.vue-js-switch .v-switch-label {
	position: absolute;
	top: 0;
	font-weight: 600;
	color: white;
}
.vue-js-switch .v-switch-label.v-left {
	left: 10px;
}
.vue-js-switch .v-switch-label.v-right {
	right: 10px;
}
.vue-js-switch .v-switch-core {
	display: block;
	position: relative;
	box-sizing: border-box;
	outline: 0;
	margin: 0;
	transition: border-color 0.3s, background-color 0.3s;
	user-select: none;
}
.vue-js-switch .v-switch-core .v-switch-button {
	display: block;
	position: absolute;
	overflow: hidden;
	top: 0;
	left: 0;
	transform: translate3d(3px, 3px, 0);
	border-radius: 100%;
	background-color: #fff;
}
.vue-js-switch.disabled {
	pointer-events: none;
	opacity: 0.6;
}

.disabled-select {
	background-color: #d5d5d5;
	opacity: 0.5;
	border-radius: 3px;
	cursor: not-allowed;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
}

select[readonly].select2-hidden-accessible + .select2-container {
	pointer-events: none;
	touch-action: none;
}

select[readonly].select2-hidden-accessible + .select2-container .select2-selection {
	background: #eee;
	box-shadow: none;
}

select[readonly].select2-hidden-accessible + .select2-container .select2-selection__arrow,
select[readonly].select2-hidden-accessible + .select2-container .select2-selection__clear {
	display: none;
}