html, body, ul, ol, li, form, fieldset, legend
{
margin: 0;
padding: 0;
}
h1, h2, h3, h4, h5, h6, p { margin-top: 0; }
fieldset,img { border: 0; }
legend { color: #000; }
li { list-style: none; }
sup { vertical-align: text-top; }
sub { vertical-align: text-bottom; }
table
{
border-collapse: collapse;
border-spacing: 0;
}
caption, th, td
{
text-align: left;
vertical-align: top;
font-weight: normal;
}
input, textarea, select
{
font-size: 110%;
line-height: 1.1;
}
abbr, acronym
{
border-bottom: .1em dotted;
cursor: help;
}
/*! Angular Moment Picker - v0.10.2 - http://indrimuska.github.io/angular-moment-picker - (c) 2015 Indri Muska - MIT */
.moment-picker-input{cursor:pointer}.moment-picker{position:absolute;z-index:1060}.moment-picker .moment-picker-container{color:#404040;min-width:15em;background:#fff;padding:4px;border:1px solid #f0f3f4;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;position:absolute;margin-top:4px;margin-left:-.5em;-webkit-box-shadow:0 2px 4px rgba(0,0,0,.075);-moz-box-shadow:0 2px 4px rgba(0,0,0,.075);box-shadow:0 2px 4px rgba(0,0,0,.075)}.moment-picker .moment-picker-container:after,.moment-picker .moment-picker-container:before{content:"";display:block;width:0;height:0;border:8px solid transparent;border-top:none;position:absolute;top:-9px;left:15px}.moment-picker .moment-picker-container:before{border-bottom-color:#f0f3f4;border-width:9px}.moment-picker .moment-picker-container:after{border-bottom-color:#fff;margin-top:1px;margin-left:1px}.moment-picker.inline{display:block;position:relative}.moment-picker.inline .moment-picker-container{position:relative;margin:0}.moment-picker.inline .moment-picker-container:after,.moment-picker.inline .moment-picker-container:before{content:none}.moment-picker.top .moment-picker-container{bottom:100%;margin-top:auto;margin-bottom:4px}.moment-picker.top .moment-picker-container:after,.moment-picker.top .moment-picker-container:before{border:8px solid transparent;border-bottom:none;top:auto;bottom:-9px}.moment-picker.top .moment-picker-container:before{border-top-color:#f0f3f4;border-width:9px}.moment-picker.top .moment-picker-container:after{border-top-color:#fff;margin-top:auto;margin-bottom:1px}.moment-picker.right .moment-picker-container{right:0;margin-left:auto;margin-right:-.5em}.moment-picker.right .moment-picker-container:after,.moment-picker.right .moment-picker-container:before{left:auto;right:15px}.moment-picker.right .moment-picker-container:after{margin-left:auto;margin-right:1px}.moment-picker table{border-collapse:collapse;border-spacing:0;min-width:100%;table-layout:fixed}.moment-picker th{font-weight:700}.moment-picker th:first-child,.moment-picker th:last-child{width:2em}.moment-picker td,.moment-picker th{padding:0;text-align:center;min-width:2em;height:2em;text-shadow:0 1px 0 hsla(0,0%,100%,.9);cursor:pointer;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px}.moment-picker td:hover,.moment-picker th:hover{background-color:#fafbfb;background-image:-webkit-gradient(linear,left top,left bottom,from(#f0f3f4),to(#fafbfb));background-image:-webkit-linear-gradient(#f0f3f4,#fafbfb);background-image:-moz-linear-gradient(#f0f3f4,#fafbfb);background-image:-o-linear-gradient(#f0f3f4,#fafbfb);background-image:linear-gradient(#f0f3f4,#fafbfb)}.moment-picker td.disabled,.moment-picker td.disabled:hover,.moment-picker th.disabled,.moment-picker th.disabled:hover{color:#abbbc7;background:none;cursor:default}.moment-picker td.today{background:#e4eef5;color:#404040;text-shadow:0 1px 0 hsla(0,0%,100%,.9)}.moment-picker td.selected{color:#fff;text-shadow:0 -1px 0 rgba(0,0,0,.3);border-color:#3ca0dd;background-color:#45b1e8;background-image:-webkit-gradient(linear,left top,left bottom,from(#45b1e8),to(#3097de));background-image:-webkit-linear-gradient(#45b1e8,#3097de);background-image:-moz-linear-gradient(#45b1e8,#3097de);background-image:-o-linear-gradient(#45b1e8,#3097de);background-image:linear-gradient(#45b1e8,#3097de)}.moment-picker td.highlighted{background-image:-webkit-radial-gradient(transparent,rgba(0,0,0,.15));background-image:-moz-radial-gradient(transparent,rgba(0,0,0,.15));background-image:-o-radial-gradient(transparent,rgba(0,0,0,.15));background-image:radial-gradient(transparent,rgba(0,0,0,.15))}.moment-picker .decade-view td,.moment-picker .year-view td{height:3.4em}.moment-picker .month-view .moment-picker-specific-views th{background:none;cursor:default}.moment-picker .month-view td{width:1.42857143em}.moment-picker .day-view td,.moment-picker .hour-view td{height:2.33333333em}.moment-picker .minute-view td{height:1.8em}.angular-tooltip{position:absolute;background:#000;z-index:9999;padding:3px;border:2px solid #000;color:#FFF;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;max-width:250px;border-radius:3px}.angular-tooltip:after,.angular-tooltip:before{border:solid transparent;content:" ";height:0;width:0;position:absolute;pointer-events:none}.angular-tooltip:before{border-color:transparent;border-width:8px}.angular-tooltip:after{border-color:transparent;border-width:5px}.angular-tooltip.angular-tooltip-top-center:after,.angular-tooltip.angular-tooltip-top-center:before,.angular-tooltip.angular-tooltip-top-middle:after,.angular-tooltip.angular-tooltip-top-middle:before,.angular-tooltip.angular-tooltip-top:after,.angular-tooltip.angular-tooltip-top:before{top:100%;left:50%}.angular-tooltip.angular-tooltip-top-center:before,.angular-tooltip.angular-tooltip-top-middle:before,.angular-tooltip.angular-tooltip-top:before{margin-left:-8px;border-top-color:#000}.angular-tooltip.angular-tooltip-top-center:after,.angular-tooltip.angular-tooltip-top-middle:after,.angular-tooltip.angular-tooltip-top:after{margin-left:-5px;border-top-color:#000}.angular-tooltip.angular-tooltip-top-right:after,.angular-tooltip.angular-tooltip-top-right:before{top:100%;right:calc(100% - 8px)}.angular-tooltip.angular-tooltip-top-right:before{margin-right:-8px;border-top-color:#000}.angular-tooltip.angular-tooltip-top-right:after{margin-right:-5px;border-top-color:#000}.angular-tooltip.angular-tooltip-right-top:after,.angular-tooltip.angular-tooltip-right-top:before{top:calc(100% - 8px);right:100%}.angular-tooltip.angular-tooltip-right-top:before{margin-top:-8px;border-right-color:#000}.angular-tooltip.angular-tooltip-right-top:after{margin-top:-5px;border-right-color:#000}.angular-tooltip.angular-tooltip-right-center:after,.angular-tooltip.angular-tooltip-right-center:before,.angular-tooltip.angular-tooltip-right-middle:after,.angular-tooltip.angular-tooltip-right-middle:before,.angular-tooltip.angular-tooltip-right:after,.angular-tooltip.angular-tooltip-right:before{top:50%;right:100%}.angular-tooltip.angular-tooltip-right-center:before,.angular-tooltip.angular-tooltip-right-middle:before,.angular-tooltip.angular-tooltip-right:before{margin-top:-8px;border-right-color:#000}.angular-tooltip.angular-tooltip-right-center:after,.angular-tooltip.angular-tooltip-right-middle:after,.angular-tooltip.angular-tooltip-right:after{margin-top:-5px;border-right-color:#000}.angular-tooltip.angular-tooltip-right-bottom:after,.angular-tooltip.angular-tooltip-right-bottom:before{bottom:calc(100% - 8px);right:100%}.angular-tooltip.angular-tooltip-right-bottom:before{margin-bottom:-8px;border-right-color:#000}.angular-tooltip.angular-tooltip-right-bottom:after{margin-bottom:-5px;border-right-color:#000}.angular-tooltip.angular-tooltip-bottom-right:after,.angular-tooltip.angular-tooltip-bottom-right:before{bottom:100%;right:calc(100% - 8px)}.angular-tooltip.angular-tooltip-bottom-right:before{margin-right:-8px;border-bottom-color:#000}.angular-tooltip.angular-tooltip-bottom-right:after{margin-right:-5px;border-bottom-color:#000}.angular-tooltip.angular-tooltip-bottom-center:after,.angular-tooltip.angular-tooltip-bottom-center:before,.angular-tooltip.angular-tooltip-bottom-middle:after,.angular-tooltip.angular-tooltip-bottom-middle:before,.angular-tooltip.angular-tooltip-bottom:after,.angular-tooltip.angular-tooltip-bottom:before{bottom:100%;left:50%}.angular-tooltip.angular-tooltip-bottom-center:before,.angular-tooltip.angular-tooltip-bottom-middle:before,.angular-tooltip.angular-tooltip-bottom:before{margin-left:-8px;border-bottom-color:#000}.angular-tooltip.angular-tooltip-bottom-center:after,.angular-tooltip.angular-tooltip-bottom-middle:after,.angular-tooltip.angular-tooltip-bottom:after{margin-left:-5px;border-bottom-color:#000}.angular-tooltip.angular-tooltip-bottom-left:after,.angular-tooltip.angular-tooltip-bottom-left:before{bottom:100%;left:calc(100% - 8px)}.angular-tooltip.angular-tooltip-bottom-left:before{margin-left:-8px;border-bottom-color:#000}.angular-tooltip.angular-tooltip-bottom-left:after{margin-left:-5px;border-bottom-color:#000}.angular-tooltip.angular-tooltip-left-bottom:after,.angular-tooltip.angular-tooltip-left-bottom:before{bottom:calc(100% - 8px);left:100%}.angular-tooltip.angular-tooltip-left-bottom:before{margin-bottom:-8px;border-left-color:#000}.angular-tooltip.angular-tooltip-left-bottom:after{margin-bottom:-5px;border-left-color:#000}.angular-tooltip.angular-tooltip-left-center:after,.angular-tooltip.angular-tooltip-left-center:before,.angular-tooltip.angular-tooltip-left-middle:after,.angular-tooltip.angular-tooltip-left-middle:before,.angular-tooltip.angular-tooltip-left:after,.angular-tooltip.angular-tooltip-left:before{top:50%;left:100%}.angular-tooltip.angular-tooltip-left-center:before,.angular-tooltip.angular-tooltip-left-middle:before,.angular-tooltip.angular-tooltip-left:before{margin-top:-8px;border-left-color:#000}.angular-tooltip.angular-tooltip-left-center:after,.angular-tooltip.angular-tooltip-left-middle:after,.angular-tooltip.angular-tooltip-left:after{margin-top:-5px;border-left-color:#000}.angular-tooltip.angular-tooltip-left-top:after,.angular-tooltip.angular-tooltip-left-top:before{top:calc(100% - 8px);left:100%}.angular-tooltip.angular-tooltip-left-top:before{margin-top:-8px;border-left-color:#000}.angular-tooltip.angular-tooltip-left-top:after{margin-top:-5px;border-left-color:#000}.angular-tooltip.angular-tooltip-top-left:after,.angular-tooltip.angular-tooltip-top-left:before{top:100%;left:calc(100% - 8px)}.angular-tooltip.angular-tooltip-top-left:before{margin-left:-8px;border-top-color:#000}.angular-tooltip.angular-tooltip-top-left:after{margin-left:-5px;border-top-color:#000}@import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,600");
body, * {
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-font-smoothing: antialiased;
}
body {
font-family: 'Source Sans Pro', sans-serif;
font-size: 16px;
font-weight: 400;
color: #515151;
}
@media (max-width: 520px) {
body {
margin: 0px;
}
}
.flexRow {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
@media (max-width: 520px) {
.flexRow {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
}
.flexRow .flexCol {
margin-right: 40px;
}
@media (max-width: 767px) {
.flexRow .flexCol {
margin-right: 0px;
}
}
.flexRow .flexCol:last-child {
margin-right: 0;
}
.flexRow .flexCol.full {
width: 100%;
}
h1 {
font-weight: 600;
font-size: 25px;
margin: 0 60px 10px;
}
@media (max-width: 767px) {
h1 {
margin: 0 0 10px;
}
}
b {
font-weight: 600;
}
.right {
text-align: right;
}
.capitalize {
text-transform: capitalize;
}
.uncapitalize {
text-transform: initial;
}
.bold {
font-weight: bold;
}
@media (max-width: 767px) {
.hiddenXs {
display: none;
}
}
.visibleXs {
display: none;
}
@media (max-width: 767px) {
.visibleXs {
display: block;
}
}
.buttonWraper {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.buttonWraper button {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
}
.buttonWraper button:not(:first-child) {
margin-left: 10px;
}
button {
-webkit-transition: background-color 0.5s, color 0.5s;
transition: background-color 0.5s, color 0.5s;
}
button.primary, button.secondary {
padding: 0 25px;
height: 40px;
border: none;
border-radius: 4px;
font-family: inherit;
font-size: inherit;
outline: none;
cursor: pointer;
}
button.primary {
background-color: #515151;
color: #dadada;
}
button.primary:hover {
background-color: #6b6b6b;
}
button.primary[disabled] {
background-color: #c5c5c5;
color: #FFFFFF;
cursor: not-allowed;
}
button.secondary {
background-color: transparent;
border: 1px solid #B4B4B4;
color: #686868;
}
button.secondary:hover {
border-width: 2px;
}
button.fullWidth {
width: calc(100vw - 120px);
height: 40px;
margin-left: 60px;
border-radius: 4px;
font-family: inherit;
font-size: 18px;
background-color: #dadada;
color: #515151;
outline: none;
border: none;
cursor: pointer;
margin-top: 10px;
}
button.fullWidth:hover {
background-color: #c1c1c1;
}
@media (max-width: 767px) {
button.fullWidth {
margin-left: 0px;
width: 100%;
}
}
button.next:after {
content: url(../img/arrow_right.svg);
margin-left: 10px;
}
button.loading:after {
content: url(../img/loading.svg);
margin-left: 10px;
}
button.loadingAndDisabled {
pointer-events: none;
}
button.loadingAndDisabled:after {
content: url(../img/loading.svg);
margin-left: 10px;
}
button.fullWidth.loading:after {
content: normal;
}
button.fullWidth.loading:before {
content: url(../img/loadingBlack.svg);
margin-right: 10px;
}
button.selectFile:after {
content: '...';
}
button.selectFile.ok:after {
content: url(../img/tick.svg);
padding-left: 5px;
}
section.welcome {
height: 100vh;
background-image: url(../img/cover.jpg);
background-size: cover;
}
@media (max-width: 767px) {
section.welcome {
background-size: contain;
}
}
section.welcome .flexRow {
height: 100%;
}
section.welcome .cover {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
width: 100%;
margin-right: 0;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
@media (max-width: 767px) {
section.welcome .cover {
height: 50%;
}
}
@media (max-width: 767px) {
section.welcome .cover img {
zoom: 50%;
}
}
section.welcome .login {
width: 500px;
background-color: rgba(255, 255, 255, 0.9);
margin-left: auto;
padding: 60px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
section.welcome .login h1 {
margin: 0 0 30px;
}
section.welcome .login .inputWrapper.last {
margin-bottom: 40px;
}
section.welcome .login button.connect {
margin-bottom: 20px;
}
section.welcome .login a {
color: inherit;
text-decoration: underline;
-webkit-text-decoration-color: #989898;
text-decoration-color: #989898;
}
section.welcome .login a.next:after {
content: url(../img/arrow_right.svg);
margin-left: 10px;
}
section.welcome .login a:hover {
text-decoration: underline;
}
section.welcome .login a.forgotPassword {
display: block;
margin-bottom: 40px;
}
section.welcome .login a.forgotPassword:after {
content: url(../img/lock.svg);
margin-left: 5px;
}
section.welcome .login hr.sep {
margin: 0 -60px 30px;
}
section.welcome .login p.desc {
margin-bottom: 20px;
}
.signupException, .loginException, .signupSuccess {
margin-top: 30px;
color: #d45555;
font-size: 12px;
line-height: 20px;
text-transform: uppercase;
}
.loginException {
margin: -20px 0 30px;
}
.signupSuccess {
color: #079a07;
}
header {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
height: 100px;
padding: 0 40px 0 60px;
background: #FFFFFF;
-webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.16);
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.16);
}
@media (max-width: 520px) {
header {
padding: 0 40px;
}
}
header i.logo {
-webkit-mask: url(../img/logo.svg);
mask: url(../img/logo.svg);
display: inline-block;
width: 145px;
height: 100px;
background: #515151;
-webkit-mask-size: contain;
mask-size: contain;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
margin-top: 26px;
}
header nav {
margin-left: auto;
}
header nav ul {
height: 100%;
}
header nav ul li {
height: 100%;
display: inline-block;
position: relative;
}
@media (max-width: 767px) {
header nav ul li {
position: static;
}
}
header nav ul li.active {
outline: 1px solid #dfdfdf;
}
header nav ul li.active:after {
content: '';
background-color: #ffffff;
height: 3px;
width: calc(100% - 2px);
display: inline-block;
position: absolute;
left: 1px;
bottom: -1px;
z-index: 2;
}
header nav ul li a {
height: 100%;
display: inline-block;
width: 80px;
background: #515151;
text-align: center;
cursor: pointer;
}
@media (max-width: 767px) {
header nav ul li a {
width: 50px;
}
}
header nav ul li a:hover {
background-color: #ff624b;
}
header nav ul li a.search {
-webkit-mask: url(../img/nav_search.svg);
mask: url(../img/nav_search.svg);
}
header nav ul li a.campaigns {
-webkit-mask: url(../img/nav_campaign.svg);
mask: url(../img/nav_campaign.svg);
}
header nav ul li a.user {
-webkit-mask: url(../img/nav_user.svg);
mask: url(../img/nav_user.svg);
}
header nav ul li a.dashboard {
-webkit-mask: url(../img/nav_dashboard.svg);
mask: url(../img/nav_dashboard.svg);
}
header nav ul li a.reports {
-webkit-mask: url(../img/nav_reports.svg);
mask: url(../img/nav_reports.svg);
}
header nav ul li a.adminOptions {
-webkit-mask: url(../img/nav_config.svg);
mask: url(../img/nav_config.svg);
}
header nav ul li a.smsApi {
-webkit-mask: url(../img/nav_sms_api.svg);
mask: url(../img/nav_sms_api.svg);
}
header nav ul li a.darkMode {
-webkit-mask: url(../img/icons/darkMode.svg);
mask: url(../img/icons/darkMode.svg);
}
header nav ul li a.edit {
-webkit-mask: url(../img/edit.svg);
mask: url(../img/edit.svg);
width: 20px;
height: 22px;
-webkit-mask-size: contain !important;
mask-size: contain !important;
}
header nav ul li a.undo {
-webkit-mask: url(../img/undo.svg);
mask: url(../img/undo.svg);
width: 20px;
height: 22px;
-webkit-mask-size: contain !important;
mask-size: contain !important;
}
header nav ul li a.save {
-webkit-mask: url(../img/save.svg);
mask: url(../img/save.svg);
width: 20px;
height: 22px;
-webkit-mask-size: contain !important;
mask-size: contain !important;
}
header nav ul li a.mask {
-webkit-mask-size: auto;
mask-size: auto;
-webkit-mask-position: 50%;
mask-position: 50%;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
}
section.content {
position: relative;
padding: 40px 0px;
height: calc(100vh - 100px);
overflow-y: auto;
overflow-x: hidden;
-webkit-box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.16);
box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.16);
}
@media (max-width: 767px) {
section.content {
padding: 40px;
}
}
.filter {
border: 2px dashed #868585;
margin: 0 60px;
border-radius: 5px;
padding: 10px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
@media (max-width: 767px) {
.filter {
margin: 0;
display: block;
margin-bottom: 20px;
}
}
.filter p {
width: 80%;
margin-bottom: 0;
line-height: 40px;
}
@media (max-width: 767px) {
.filter p {
width: auto;
}
}
.filter p span {
background-color: #e6e6e6;
padding: 6px 10px;
border-radius: 4px;
margin-right: 10px;
}
@media (max-width: 767px) {
.filter p span {
display: block;
margin-bottom: 10px;
}
}
.filter button {
margin-left: auto;
}
a.iconMask:after {
-webkit-mask-size: auto;
mask-size: auto;
-webkit-mask-position: 50%;
mask-position: 50%;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
display: inline-block;
background: #515151;
}
a.iconMask:hover:after {
background: #ff624b;
}
.campaign {
padding: 20px 60px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
@media (max-width: 767px) {
.campaign {
padding: 10px 0;
}
}
.campaign:hover {
background-color: #F7F7F7;
}
.campaign .campaignTypeIcon {
display: inline-block;
height: 45px;
width: 40px;
margin-right: 20px;
margin-left: 20px;
display: inline-block;
-webkit-mask-size: auto;
mask-size: auto;
-webkit-mask-position: 50%;
mask-position: 50%;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
background: #515151;
}
@media (max-width: 767px) {
.campaign .campaignTypeIcon {
margin-right: 10px;
margin-left: 30px;
zoom: 70%;
}
}
.campaign .campaignTypeIcon.voice {
-webkit-mask: url(../img/campaignTypeAudio.svg);
mask: url(../img/campaignTypeAudio.svg);
}
.campaign .campaignTypeIcon.sms {
-webkit-mask: url(../img/campaignTypeSms.svg);
mask: url(../img/campaignTypeSms.svg);
}
.campaign .campaignTypeIcon.external {
-webkit-mask: url(../img/campaignTypeExternal.svg);
mask: url(../img/campaignTypeExternal.svg);
}
.campaign .bulletStatus:before {
content: '';
width: 12px;
height: 12px;
display: inline-block;
border-radius: 100%;
background-color: gray;
}
.campaign .bulletStatus.running:before {
background-color: #78D672;
}
.campaign .bulletStatus.running span.status {
color: #78D672;
}
.campaign .bulletStatus.executed:before {
background-color: #0cb70c;
}
.campaign .bulletStatus.executed span.status {
color: #0cb70c;
}
.campaign .bulletStatus.pending:before {
background-color: #ff9900;
}
.campaign .bulletStatus.pending span.status {
color: #ff9900;
}
.campaign .bulletStatus.erroneous:before {
background-color: #EF6F65;
}
.campaign .bulletStatus.erroneous span.status {
color: #EF6F65;
}
.campaign p {
position: relative;
margin-bottom: 0px;
font-size: 18px;
width: 80%;
}
@media (max-width: 767px) {
.campaign p {
padding-left: 0;
font-size: 16px;
}
}
.campaign p .name {
font-size: 20px;
font-weight: 600;
}
@media (max-width: 767px) {
.campaign p .name {
font-size: 18px;
}
}
.campaign p span.status {
position: relative;
font-weight: 600;
}
.campaign p span.status span.popover {
position: absolute;
background-color: rgba(70, 70, 70, 0.93);
color: white;
font-size: 16px;
z-index: 1;
font-weight: normal;
bottom: 26px;
left: 0;
padding: 20px;
border-radius: 5px;
width: 400px;
}
.campaign p span.status span.popover span.title {
display: block;
font-weight: 600;
margin-bottom: 10px;
}
.campaign p span.status span.popover:after {
content: '';
height: 0;
position: absolute;
width: 0;
border: 10px solid transparent;
border-top-color: rgba(70, 70, 70, 0.93);
bottom: -20px;
left: 20px;
z-index: 4;
}
.campaign p span.status:hover {
text-decoration: underline;
}
.campaign p .bullet {
color: #515151;
display: inline-block;
text-align: center;
border-radius: 12px;
padding: 0 4px;
font-size: 15px;
line-height: 17px;
border: 2px solid #908c8c;
}
.campaign .progressWrapper {
height: 15px;
width: 100px;
border: 2px solid #515151;
border-radius: 15px;
margin-left: auto;
position: relative;
-webkit-transform: translateY(50%);
transform: translateY(50%);
margin: 0 60px;
}
.campaign .progressWrapper .progress {
background-image: url(../img/loadingBar.svg);
height: 100%;
border-top-left-radius: 7px;
border-bottom-left-radius: 7px;
border-right: 2px solid #515151;
}
.campaign .progressWrapper span {
position: absolute;
left: calc(100% + 10px);
top: -6px;
}
.campaign .optionsWrapper {
margin-left: auto;
white-space: nowrap;
}
.campaign .optionsWrapper a.moreOptions:after {
content: '';
-webkit-mask: url(../img/moreMenu.svg);
mask: url(../img/moreMenu.svg);
height: 30px;
width: 23px;
}
.campaign .optionsWrapper .menuWrapper {
display: inline-block;
position: relative;
}
.campaign .optionsWrapper .menuWrapper .menu {
position: absolute;
right: 0;
top: 29px;
border-radius: 4px 0 4px 4px;
background-color: #515151;
color: white;
z-index: 1;
}
.campaign .optionsWrapper .menuWrapper .menu ul li a {
display: inline-block;
padding: 0 23px;
height: 40px;
width: 100%;
line-height: 40px;
border-bottom: 1px solid #484848;
white-space: nowrap;
text-decoration: none;
color: white;
}
.campaign .optionsWrapper .menuWrapper .menu ul li a:hover {
background-color: #929292;
}
.campaign .optionsWrapper .menuWrapper .menu ul li a:hover div.childMenu {
display: block;
}
.campaign .optionsWrapper .menuWrapper .menu ul li a.rel {
position: relative;
}
.campaign .optionsWrapper .menuWrapper .menu ul li a div.childMenu {
display: none;
position: absolute;
top: -40px;
right: 100%;
padding-right: 5px;
}
.campaign .optionsWrapper .menuWrapper .menu ul li a div.childMenu ul {
border-radius: 4px;
background-color: #515151;
}
.campaign .optionsWrapper .menuWrapper .menu ul li a div.childMenu ul li span {
display: inline-block;
cursor: pointer;
padding: 0 23px;
height: 40px;
width: 100%;
line-height: 40px;
border-bottom: 1px solid #484848;
white-space: nowrap;
}
.campaign .optionsWrapper .menuWrapper .menu ul li a div.childMenu ul li span:hover {
background-color: #929292;
}
.campaign .optionsWrapper .menuWrapper .menu ul li a div.childMenu ul li:first-child span {
border-radius: 4px 4px 0 0;
}
.campaign .optionsWrapper .menuWrapper .menu ul li a div.childMenu ul li:last-child span {
border-radius: 0 0 4px 4px;
border-bottom: 0;
}
.campaign .optionsWrapper .menuWrapper .menu ul li:first-child a {
border-radius: 4px 0 0 0;
}
.campaign .optionsWrapper .menuWrapper .menu ul li:last-child a {
border-radius: 0 0 4px 4px;
border-bottom: 0;
}
.campaign .optionsWrapper a.report {
margin-left: 20px;
}
@media (max-width: 767px) {
.campaign .optionsWrapper a.report {
margin-left: 10px;
}
}
.campaign .optionsWrapper a.report:after {
content: '';
-webkit-mask: url(../img/report.svg);
mask: url(../img/report.svg);
height: 30px;
width: 23px;
}
.campaign .optionsWrapper a.report.disabled {
-webkit-filter: opacity(0.3);
filter: opacity(0.3);
pointer-events: none;
}
.campaign.justOne {
padding: 10px 20px;
margin-bottom: 30px;
border: 2px solid #d0d0d0;
border-radius: 8px;
}
p.emptyState {
margin: 20px 60px;
}
@media (max-width: 767px) {
p.emptyState {
margin: 20px 0px;
}
}
hr.sep {
border-bottom: none;
border-top: 1px solid #EBEBEB;
}
.highlight {
background-color: #e0e0e0;
}
.mgb {
margin-bottom: 20px;
}
.center {
text-align: center;
}
.window {
position: absolute;
padding: 40px 60px;
right: 0;
top: 100%;
background: #FFFFFF;
border: 1px solid #EBEBEB;
-webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.16);
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.16);
z-index: 2;
}
@media (max-width: 767px) {
.window {
padding: 20px 40px;
top: 100px;
}
}
.window h3.title {
font-size: 18px;
margin-bottom: 30px;
}
.window hr.sep {
margin-left: -60px;
margin-right: -60px;
}
.window p.warning {
background-color: #ffd8d8;
padding: 10px 20px;
}
.window .footer {
padding: 11px 0 0;
text-align: right;
}
.window .footer button {
margin-left: 10px;
}
.window .flexCol {
width: 280px;
}
@media (max-width: 767px) {
.window .flexCol {
width: 100%;
}
}
.window p.error {
color: #b15c5c;
}
.window.userMenu {
padding: 0;
}
.window.userMenu hr.sep {
margin: 0;
}
.window.userMenu a {
height: 60px;
line-height: 60px;
padding: 0 40px;
white-space: nowrap;
width: 320px;
background-color: white;
}
.window.userMenu a:hover {
background-color: #e8e8e8;
}
.window.newCampaign .blackListCheck {
text-align: right;
}
.window.newCampaign .blackListCheck a {
color: inherit;
font-style: italic;
font-weight: 600;
background-color: inherit;
}
.window.newCampaign button.lock {
pointer-events: none;
}
.window.newCampaign .validationBlock {
border-top: 1px solid #ebebeb;
border-bottom: 1px solid #ebebeb;
margin-left: -60px;
margin-right: -60px;
padding: 20px 60px;
max-height: 200px;
overflow-y: scroll;
}
.window.newCampaign .validationBlock.withErrors {
background-color: #ffd3d3;
}
.window.newCampaign .validationBlock::-webkit-scrollbar {
width: 8px;
background-color: #efefef;
}
.window.newCampaign .validationBlock::-webkit-scrollbar-thumb {
background-color: #7d7d7d;
}
.window.newCampaign .validationBlock .exceptions p {
margin-bottom: 10px;
}
.window.newCampaign .validationBlock .exceptions p:last-child {
margin-bottom: none;
}
.window.dashboard, .window.reports {
width: 70vw;
height: calc(100vh - 130px);
overflow-y: auto;
}
@media (max-width: 767px) {
.window.dashboard, .window.reports {
left: 0;
width: 100%;
}
}
.window.dashboard h1, .window.reports h1 {
margin: 0 0 40px;
}
@media (max-width: 767px) {
.window.dashboard h1, .window.reports h1 {
margin-bottom: 0;
}
}
.window.dashboard span.under, .window.reports span.under {
display: block;
font-size: 14px;
}
.window.dashboard .flexRow .flexCol, .window.reports .flexRow .flexCol {
width: 100%;
}
.window.dashboard .flexRow.twoColumns .flexCol, .window.reports .flexRow.twoColumns .flexCol {
width: 50%;
margin: 0;
position: relative;
}
@media (max-width: 767px) {
.window.dashboard .flexRow.twoColumns .flexCol, .window.reports .flexRow.twoColumns .flexCol {
width: 100%;
}
}
.window.dashboard .flexRow.twoColumns .flexCol.sepRight:after, .window.reports .flexRow.twoColumns .flexCol.sepRight:after {
content: '';
background-color: #EBEBEB;
width: 1px;
position: absolute;
right: 20px;
top: -40px;
height: calc(100% + 80px);
}
@media (max-width: 767px) {
.window.dashboard .flexRow.twoColumns .flexCol.sepRight:after, .window.reports .flexRow.twoColumns .flexCol.sepRight:after {
content: normal;
}
}
.window.dashboard hr.sep, .window.reports hr.sep {
margin-top: 40px;
margin-bottom: 40px;
}
@media (max-width: 767px) {
.window.dashboard hr.sep, .window.reports hr.sep {
margin-top: 30px;
margin-bottom: 30px;
}
}
.window.reports {
width: calc(100vw - 100px);
right: -320px;
}
.window.blackList {
width: 500px;
}
.window.blackList .editableList {
border: 1px solid #B4B4B4;
-webkit-box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.5);
box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.5);
border-radius: 3px;
padding: 10px;
max-height: 40vh;
overflow-y: auto;
}
.window.blackList .editableList ul li {
display: block;
height: 30px;
}
.window.blackList .editableList textarea {
width: 100%;
height: 100%;
border: 0;
outline: none;
font-family: inherit;
font-size: inherit;
color: inherit;
line-height: 30px;
}
.window.shortUrl {
width: 630px;
}
.window.shortUrl table {
width: 100%;
}
.window.shortUrl table tr:hover {
background-color: whitesmoke;
}
.window.shortUrl table th {
font-weight: 600;
background-color: #ececec;
padding: 10px;
text-transform: uppercase;
}
.window.shortUrl table td {
padding: 10px;
}
.window.shortUrl table td a {
width: 40px;
}
.window.shortUrl table td .inputWrapper {
margin-bottom: 0;
}
.window.shortUrl table td.editing {
padding: 0 10px;
}
.window.shortUrl table td.nowrap {
white-space: nowrap;
}
.window.shortUrl .editableList {
max-height: 50vh;
overflow-y: auto;
}
.inputWrapper {
margin-bottom: 20px;
}
.inputWrapper label {
display: inline-block;
padding-bottom: 5px;
}
.inputWrapper input {
height: 40px;
width: 100%;
border: 1px solid #B4B4B4;
-webkit-box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.5);
box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.5);
border-radius: 3px;
font-family: inherit;
padding: 0 10px;
color: #515151;
}
.inputWrapper input::-webkit-input-placeholder {
color: #D6D6D6;
letter-spacing: normal;
}
.inputWrapper input:-moz-placeholder {
color: #D6D6D6;
letter-spacing: normal;
}
.inputWrapper input[type=password] {
letter-spacing: 3px;
}
.inputWrapper span.hint {
display: none;
}
.inputWrapper span.hint.error {
display: inline-block;
color: #b15c5c;
font-size: 11px;
padding: 5px;
width: 100%;
text-transform: uppercase;
}
.inputWrapper button {
width: 100%;
}
.selectWrapper {
overflow: hidden;
position: relative;
padding: 0 10px;
height: 40px;
width: 100%;
border: 2px solid #ECECEC;
border-radius: 4px;
background-color: #ECECEC;
}
.selectWrapper:after {
content: '';
position: absolute;
top: 56%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
right: 10px;
width: 0;
height: 0;
border: 5px solid transparent;
border-top-color: #B4B4B4;
}
.selectWrapper select {
font-family: 'Source Sans Pro', sans-serif;
color: #515151;
text-transform: capitalize;
width: 100%;
height: 100%;
border: none;
-webkit-box-shadow: none;
box-shadow: none;
background: transparent;
background-image: none;
-webkit-appearance: none;
outline: none;
cursor: pointer;
-moz-appearance: none;
text-indent: 0.01px;
text-overflow: ellipsis;
}
.selectWrapper select:invalid {
color: #7b7b7b;
}
.moment-picker td {
vertical-align: middle;
}
.moment-picker td.selected {
border-color: #515151;
background-color: #515151;
background-image: -webkit-gradient(linear, left top, left bottom, from(#515151), to(#515151));
}
div.uploadBtn {
width: 100%;
height: 40px;
overflow: hidden;
position: relative;
border-radius: 4px;
background-color: #ECECEC;
border: 2px solid #ECECEC;
color: #515151;
cursor: pointer;
}
div.uploadBtn:hover {
background-color: #6b6b6b;
}
div.uploadBtn span {
position: absolute;
top: 0;
z-index: 0;
width: 100%;
height: 40px;
text-align: center;
line-height: 35px;
}
div.uploadBtn input {
display: block !important;
width: 100% !important;
height: 40px !important;
opacity: 0 !important;
overflow: hidden !important;
position: absolute;
z-index: 1;
cursor: pointer;
}
section.campaignPreview {
position: fixed;
top: 101px;
background-color: white;
right: 0;
-webkit-transform: translateX(100%);
transform: translateX(100%);
-webkit-transition: -webkit-transform 0.5s;
transition: -webkit-transform 0.5s;
transition: transform 0.5s;
transition: transform 0.5s, -webkit-transform 0.5s;
height: calc(100vh - 99px);
-webkit-box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.16);
box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.16);
padding: 40px 60px;
z-index: 1;
}
section.campaignPreview.previewing {
-webkit-transform: translateX(0);
transform: translateX(0);
}
section.campaignPreview h3.title {
font-size: 18px;
margin-bottom: 30px;
}
section.campaignPreview p {
margin-bottom: 30px;
}
section.campaignPreview hr.sep {
margin-left: -60px;
margin-right: -60px;
}
section.campaignPreview .footer {
padding: 11px 0 0;
text-align: right;
}
section.campaignPreview .footer button {
margin-left: 10px;
}
.tableWrapper {
height: 55vh;
overflow-y: auto;
}
.tableWrapper table {
margin-bottom: 20px;
width: 100%;
}
.tableWrapper table tr td, .tableWrapper table tr th {
padding: 0 10px;
white-space: nowrap;
}
.tableWrapper table tr th {
background-color: #ECECEC;
height: 40px;
line-height: 40px;
position: -webkit-sticky;
position: sticky;
top: -40px;
}
.tableWrapper table tr th.success {
background-color: #cee0ce;
}
.tableWrapper table tr th.error {
background-color: #eac5c5;
}
.tableWrapper table tr td {
padding: 10px;
}
.tableWrapper table tr td.wrap {
white-space: normal;
}
.tableWrapper table tr td.right {
text-align: right;
}
.tableWrapper table tr td.success {
color: #6f8a6f;
background-color: #d8f9d8;
}
.tableWrapper table tr td.error {
color: #bd8383;
background-color: #f3dddd;
}
.tableWrapper table tr td.smallPadding {
padding: 5px;
}
.tableWrapper table tr td.rel {
position: relative;
}
.tableWrapper button.paginator {
background-color: #dadada;
border: none;
}
.tableWrapper button.paginator:hover {
background-color: #c1c1c1;
}
.tableWrapper.report {
height: auto;
max-height: 70vh;
}
.tableWrapper.report table tr th {
top: 0;
padding: 20px 30px;
}
audio:focus {
outline: none;
}
a[tooltip] {
position: relative;
}
a[tooltip]:hover:before {
content: attr(tooltip);
position: absolute;
right: 0;
top: -50px;
background-color: #2b2b2b;
line-height: 20px;
white-space: nowrap;
padding: 5px 10px;
color: #FFFFFF;
}
.alert {
margin: 0 60px 10px;
padding: 20px;
background-color: #dadada;
border-radius: 4px;
}
@media (max-width: 767px) {
.alert {
margin: 0 0px 10px;
}
}
.alert.error {
background-color: #EF6F65;
color: white;
position: relative;
padding-left: 60px;
}
.alert.error:before {
content: url(../img/alert.svg);
position: absolute;
left: 20px;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.notif {
font-size: 16px;
background-color: #333333;
color: #fff;
padding: 20px 70px 20px 20px;
text-align: left;
max-width: 450px;
z-index: 99999;
position: fixed;
border-radius: 4px;
bottom: 30px;
right: 60px;
-webkit-box-shadow: 0px 0px 10px 2px #00000040;
box-shadow: 0px 0px 10px 2px #00000040;
}
.notif a.close {
color: #c3c3c3;
text-decoration: none;
font-size: 30px;
line-height: 35px;
background-color: transparent;
margin-left: 10px;
border-radius: 100%;
display: inline-block;
height: 35px;
width: 35px;
position: absolute;
top: 13px;
right: 20px;
text-align: center;
-webkit-transition: background-color 0.5s;
transition: background-color 0.5s;
}
.notif a.close:hover {
background-color: #757474;
color: white;
}
.notif.growl, .notif.growlTime {
bottom: auto;
top: 110px;
max-width: 580px;
}
.notif a.btn {
background-color: #969494;
padding: 10px 10px;
margin-left: 10px;
border-radius: 4px;
font-weight: 600;
cursor: pointer;
}
.angular-tooltip {
background: #515151;
border-color: #515151;
padding: 3px 5px;
opacity: 0;
-webkit-animation-name: appearAfterTwoSecons;
animation-name: appearAfterTwoSecons;
-webkit-animation-duration: 2s;
animation-duration: 2s;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
}
.angular-tooltip.angular-tooltip-top {
-webkit-transform: translateY(-15px);
transform: translateY(-15px);
}
.angular-tooltip.angular-tooltip-top:before, .angular-tooltip.angular-tooltip-top:after {
border-top-color: #515151;
}
.angular-tooltip.angular-tooltip-bottom:before, .angular-tooltip.angular-tooltip-bottom:after {
border-bottom-color: #515151;
}
@-webkit-keyframes appearAfterTwoSecons {
80% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes appearAfterTwoSecons {
80% {
opacity: 0;
}
100% {
opacity: 1;
}
}
.previewWrapper {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.previewWrapper .detail img.btnPreview {
vertical-align: middle;
margin-right: 10px;
}
.previewWrapper .detail img.btnPreview.disabled {
opacity: 0.4;
}
.previewWrapper .previewPhone {
width: 300px;
margin-left: 20px;
}
.previewWrapper .previewPhone .phoneWrapper {
position: relative;
top: 0px;
left: 0px;
width: 428px;
height: 889px;
background: none;
-webkit-transform-origin: 0 200px 0;
transform-origin: 0 200px 0;
-webkit-transform: scale(0.7);
transform: scale(0.7);
}
.previewWrapper .previewPhone .phoneWrapper img {
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
}
.previewWrapper .previewPhone .phoneWrapper iframe {
position: absolute;
top: 109px;
left: 26.5px;
width: 375px;
height: 669px;
border: 0px;
}
.smsMsg {
font-size: 23px;
padding: 20px;
}
.popup {
background: rgba(255, 255, 255, 0.75);
position: absolute;
left: 0;
top: 0;
bottom: 0;
right: 0;
z-index: 1;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.popup .box {
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background: #FFFFFF;
-webkit-box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.16);
box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.16);
height: 200px;
width: 40%;
border-radius: 8px;
text-align: center;
}
.popup .box p {
height: 50%;
line-height: 140px;
font-weight: 600;
}
.popup .box button {
margin: 0 10px;
}
a.refreshList {
position: absolute;
top: 43px;
right: 60px;
cursor: pointer;
}
a.refreshList::after {
content: '';
-webkit-mask: url(../img/refreshList.svg);
mask: url(../img/refreshList.svg);
background-color: #515151;
height: 30px;
width: 31px;
display: inline-block;
}
a.refreshList:hover::after {
background-color: #ff624b;
}
.reportWrapper canvas {
width: 100%;
}
.reportWrapper .withSep {
border-left: 3px solid #e2e2e2;
padding-left: 30px;
}
.reportWrapper .selectWrapper {
width: calc(100% - 60px);
margin-left: 30px;
margin-right: 30px;
}
.reportWrapper.flexRow .flexCol:first-child {
width: 30%;
}
.reportWrapper.flexRow .flexCol:last-child {
padding: 0;
width: 70%;
}
.loadingGauge {
height: 350px;
width: 350px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
div.main section.content {
-webkit-transition: background-color 2s;
transition: background-color 2s;
background-color: white;
}
div.main header {
-webkit-transition: background-color 2s;
transition: background-color 2s;
background-color: white;
}
div.main.themedark {
color: #F3F3F3;
}
div.main.themedark header {
background-color: #515151;
}
div.main.themedark header i.logo {
background: #d2d2d2;
}
div.main.themedark header nav ul li.active {
outline: 1px solid #313131;
background-color: #464646;
}
div.main.themedark header nav ul li.active:after {
background-color: #464646;
}
div.main.themedark header nav ul li a {
background: #d2d2d2;
}
div.main.themedark header nav ul li a:hover {
background: #ec8475;
}
div.main.themedark section.content {
background-color: #515151;
}
div.main.themedark section.content .campaign .campaignTypeIcon {
background: #d2d2d2;
}
div.main.themedark section.content .campaign a.iconMask:after {
background: #d2d2d2;
}
div.main.themedark section.content .campaign a.iconMask:hover:after {
background: #ec8475;
}
div.main.themedark section.content .campaign:hover {
background-color: #444444;
}
div.main.themedark section.content .campaign p.executed:before {
background-color: #87EC88;
}
div.main.themedark section.content .campaign p.executed span.status {
color: #87EC88;
}
div.main.themedark section.content .campaign span.popover {
background-color: rgba(130, 130, 130, 0.93);
}
div.main.themedark section.content .campaign span.popover:after {
border-top-color: rgba(130, 130, 130, 0.93);
}
div.main.themedark section.content .campaign .bullet {
border-color: #dcdcdc;
color: #efefef;
}
div.main.themedark .window {
background-color: #464646;
border-color: #313131;
}
div.main.themedark .window.userMenu a {
background-color: #464646;
border-color: #313131;
}
div.main.themedark .window.userMenu a:hover {
background-color: #4b4b4b;
}
div.main.themedark section.campaignPreview {
background-color: #464646;
border-color: #313131;
}
div.main.themedark button.primary {
background-color: #8486da;
color: #ffffff;
}
div.main.themedark button.fullWidth {
background-color: #6b6b6b;
color: #ffffff;
}
div.main.themedark button.secondary {
border: none;
background-color: #6b6b6b;
color: #ffffff;
}
div.main.themedark input[type='text'], div.main.themedark .inputWrapper input {
background-color: #585858;
border: 1px solid #313131;
color: #e8e8e8;
}
div.main.themedark input[type='text']::-webkit-input-placeholder, div.main.themedark .inputWrapper input::-webkit-input-placeholder {
color: gray;
}
div.main.themedark input[type='text']:-moz-placeholder, div.main.themedark .inputWrapper input:-moz-placeholder {
color: gray;
}
div.main.themedark .selectWrapper {
background-color: #585858;
border: none;
}
div.main.themedark .selectWrapper select {
color: #ffffff;
}
div.main.themedark hr.sep {
border-top: 1px solid #313131;
}
div.main.themedark a.refreshList::after {
background-color: #d2d2d2;
}
div.main.themedark a.refreshList:hover::after {
background-color: #ec8475;
}
div.main.themedark .tableWrapper table tr th {
background-color: #636363;
}
div.main.themedark .tableWrapper table tr th.success {
background-color: #7c987c;
}
div.main.themedark .tableWrapper table tr th.error {
background-color: #a77777;
}
div.main.themedark .tableWrapper table tr td.success {
color: #ffffff;
background-color: #657165;
}
div.main.themedark .tableWrapper table tr td.error {
color: #ffffff;
background-color: #866060;
}
div.main.themedark .filter p span {
background-color: #717171;
}
div.main.themedark span.tag {
background-color: #696969;
}
div.main.themedark .detail a {
color: #9698ff;
}
div.main.themedark .popover {
background: #464646;
border: 1px solid #313131;
-webkit-box-shadow: 0 0 24px 0 #383737;
box-shadow: 0 0 24px 0 #383737;
}
div.main.themedark .popover:before {
border-right: 1px solid #313131;
border-top: 1px solid #313131;
}
span.tag {
background-color: #c1c1c1;
font-size: 12px;
padding: 2px 7px;
font-weight: bold;
color: white;
border-radius: 4px;
}
span.tag.red {
background-color: #f59090;
}
i.warning {
display: inline-block;
margin-right: 5px;
width: 13px;
height: 12px;
}
i.warning::before {
content: url(../img/warningIcon.svg);
}
i.tick {
display: inline-block;
margin-right: 5px;
width: 13px;
height: 12px;
}
i.tick::before {
content: url(../img/tickBlack.svg);
}
i.icon {
width: 20px;
display: inline-block;
text-align: center;
margin-right: 10px;
}
i.icon.task::before {
content: url(../img/icons/task.svg);
}
i.icon.report::before {
content: url(../img/icons/report.svg);
}
.adminOptionsWrapper {
height: 100%;
}
.adminOptionsWrapper .sidebar {
width: 250px;
padding-right: 20px;
border-right: 2px solid #d6d6d6;
}
.adminOptionsWrapper .sidebar ul {
height: auto;
}
.adminOptionsWrapper .sidebar ul li {
display: block;
height: 30px;
line-height: 30px;
}
.adminOptionsWrapper .sidebar ul li a {
text-align: left;
width: auto;
background-color: transparent;
color: inherit;
}
.adminOptionsWrapper .menuContent {
width: 70%;
padding: 0 20px;
}
textarea.smscheck {
height: 100px;
width: 600px;
border: 1px solid #B4B4B4;
-webkit-box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.5);
box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.5);
border-radius: 3px;
font-family: inherit;
color: #515151;
padding: 10px;
margin-bottom: 30px;
}
.translatedSMS {
width: 600px;
}
.translatedSMS .text {
padding: 10px;
border: 2px solid #c3c3c3;
width: 100%;
background-color: #efefef;
border-radius: 4px;
}
.translatedSMS span.total {
text-align: right;
display: inline-block;
width: 100%;
}
.flexWrapper {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
.wrapperSearch {
padding: 10px;
position: relative;
}
.wrapperSearch:before {
content: url(../img/icons/search_icon.svg);
position: absolute;
top: 20px;
left: 23px;
}
.wrapperSearch input {
padding-left: 35px;
padding-right: 40px;
height: 40px;
width: 100%;
border: 1px solid #B4B4B4;
-webkit-box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.5);
box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.5);
border-radius: 3px;
font-family: inherit;
color: #515151;
}
.wrapperSearch input::-webkit-input-placeholder {
color: #D6D6D6;
letter-spacing: normal;
}
.wrapperSearch .dismiss {
position: absolute;
right: 23px;
top: 19px;
cursor: pointer;
}
div.popover {
position: absolute;
top: -12px;
right: 50px;
z-index: 2;
background: #FFFFFF;
border: 1px solid #DEDEDE;
-webkit-box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.17);
box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.17);
border-radius: 4px;
padding: 20px 30px;
max-height: 380px;
overflow-y: auto;
}
div.popover:before {
content: '';
width: 20px;
height: 20px;
background-color: inherit;
right: -10px;
display: inline-block;
position: absolute;
-webkit-transform: rotateZ(45deg);
transform: rotateZ(45deg);
border-right: 1px solid #DEDEDE;
border-top: 1px solid #DEDEDE;
}
div.popover .title {
border-bottom: 1px solid #DEDEDE;
padding-bottom: 20px;
margin-bottom: 10px;
}
div.popover .title a.close {
color: inherit;
text-decoration: none;
border-bottom: 2px solid;
}
div.popover .detailRow {
margin-bottom: 10px;
}
img.loadingCampaign {
width: 20px;
position: absolute;
margin-left: 3px;
}
/*# sourceMappingURL=styles.css.map */