@charset "UTF-8";

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, menu, nav, output, ruby, section, summary, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    font-size: 100%;
    text-indent: 0;
}

body {
    text-align: right;
    direction: rtl;
    font-size: 16px;
    fonth-family: Nachlieli CLM, Arial, Tahoma;
    color: #666666;
}

body:lang(en){
    direction: ltr;
    font-family: 'Open Sans', sans-serif;
    text-align: left;
}


button, input[type="submit"], select {
    cursor: pointer;
}

textarea, input, label {
    margin: 0;
    padding: 0;
}

textarea, input.text {
}

label:focus, label.text:focus, input.text:focus {
    outline: none;
}

label {
    font-weight: bold;
}

h1 {
    font-size: 50px;
}

h2 {
    font-size: 30px;
}

h3 {
    font-size: 25px;
}

h4 {
    font-size: 21px;
}

h5 {
    font-size: 14px;
}

h6 {
    font-family: arial;
    font-size: 11px;
}

h2 strong, h3 strong {
    color: #1f2532;
}

img.fade {
    opacity: 0;
    -moz-transition: opacity 1s; /* Firefox 4 */
    -webkit-transition: opacity 1s; /* Safari and Chrome */
    -o-transition: opacity 1s;
    transition: opacity 1s;
}

img.fade.fast {
    -moz-transition: opacity 0.5; /* Firefox 4 */
    -webkit-transition: opacity 0.5; /* Safari and Chrome */
    -o-transition: opacity 0.5;
    transition: opacity 0.5;
}

.arial-font {
    font-family: arial;
}

.fs13 {
    font-size: 13px;
}

.digit, input[type="tel"] {
    font-family: arial;
}

h1.digit {
    font-size: 60px;
}

*, *:after, *:before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

a {
    color: #4e8fc7;
    outline: 0 none;
    text-decoration: none;
    cursor: pointer;
}

a.underline {
    text-decoration: underline;
}

a:visited, a.visited {
}

a:hover, a.hover {
    outline: medium none;
    color: #487db0;
}

a:active, a.active {
    color: #094261;
}

strong {
    font-weight: bold;
}

ul li {
    list-style-type: none;
}

ul.bullet li {
    list-style-type: circle;
}

input[type=file] {
    opacity: 0;
    z-index: -1;
    position: absolute;
}

input.error-border {
    border: 1px solid #ea4732;
}

input.hasError,textarea.hasError {
    border: 1px solid #ff3366 !important;
}

input.notallowed {
    cursor: not-allowed;
}

input.ng-invalid.submit {
    border: 1px solid #ea4732;
}

input.std[type=radio] {
    height: 21px;
    width: 21px;
    margin-left: 7px;
    vertical-align: -5px;
    margin-bottom: 10px;
}

.blbkg-wc {
    background: #487db0;
    color: #FFFFFF;
}
[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
  display: none !important;
}

.red {
    color: #ea4732
}

.pl-green {
    color: #70cbd2 !important;
}

.pl-red {
    color: #ea4732 !important;
}

.pl-grey {
    color: #5d5862;
}

.has-error {
    color: #ff3366;
    font-family: arial;
    font-size: 14px;
    margin-top: 3px;
    text-align: right;
}

.reg-form-cat .ng-invalid:focus {
    border: 1px solid #999999;
}

.ng-invalid:focus + .has-error, .ng-invalid:focus + .has-error + .has-error {
    display: none !important;
}

:focus {
    outline: none;
}

/*set class variables*/

.centered-element, .header-content, .footer-content, .main-content, .page-width, .drawer-content {
    margin: 0pt auto;
    width: 1100px;
    position: relative;
}

.p-relative {
    position: relative;
}

.hidden {
    display: none;
}

.align-center {
    text-align: center;
}

.align-right {
    text-align: right;
}

.align-left {
    text-align: left;
}

.inline-container * {
    display: inline-block;
}

.inline-blocks > div {
    display: inline-block;
}

.inline-blocks-top > div {
    display: inline-block;
    vertical-align: top;
}

.inline {
    display: inline-block;
}

.italic-light {
    font-style: italic;
    color: #969696;
}

.body-mask-paper {
    background: none repeat scroll 0 0 #F4F4F4;
}

.body-mask {
    height: auto;
    left: 0;
    min-height: 100%;
    position: fixed;
    top: 0;
    width: 100%;
}

.body-mask.grey {
    background-color: darkgrey;
}

.box-shadow-black {
    -webkit-box-shadow: 0px 0px 5px 0 black;
    box-shadow: 0px 0px 5px 0 black;
}

.box-shadow-white {
    -webkit-box-shadow: 0 0 1px -1px #677A7F;
    box-shadow: 0 0 1px -1px #677A7F;
}

.rtl {
    direction: rtl;
}

.ltr {
    direction: ltr;
}

.ltr-true {
    direction: ltr;
}

.lfloat {
    float: left;
}

.rfloat {
    float: right;
}

.radius10 {
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
}

.alert-red {
    color: #ff3e65;
}

::selection {
    background: #25C2FF;
    color: white;
}

input:-moz-placeholder {
    color: #d6d6d6;
    font-weight: normal;
}

input::-moz-placeholder {
    color: #D6D6D6;
    font-weight: normal;
}

input:-ms-input-placeholder {
    color: #D6D6D6;
    font-weight: normal;
}

input::-webkit-input-placeholder {
    color: #D6D6D6;
    font-weight: normal;
}

input.phrtl:-moz-placeholder {
    direction: rtl;
}

input.phrtl::-moz-placeholder {
    direction: rtl;
}

input.phrtl:-ms-input-placeholder {
    direction: rtl;
}

input.phrtl::-webkit-input-placeholder {
    direction: rtl;
}

textarea.phrtl:-moz-placeholder {
    direction: rtl;
}

textarea.phrtl::-moz-placeholder {
    direction: rtl;
}

textarea.phrtl:-ms-input-placeholder {
    direction: rtl;
}

textarea.phrtl::-webkit-input-placeholder {
    direction: rtl;
}

/*  body */

body.intercom-disable #intercom-container .intercom-launcher {
    visibility: hidden;
}

#intercom-container .intercom-launcher-button{

}

.intercom-button {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAWCAQAAABuvaSwAAAAzElEQVR4AY3Kr0qDcRSA4bNgmUkZSyr2YVkWwTtYEZNFxLQ0wajZZrJ4AcIQ1O4fLHoFpkXTTDIXNoQ9RtEf+p3nrW9EaLk28p+RKy0R2sYyxtrhTtZtmMiahNKbvgtDhXLumxdC3WX1vKTh2aOGBZ9V86kHsCl8VM1wb1fNBpl51Zxtw9y8Yg1y845efkZ+XrdFKcyU9hwqzcJA1iB0ZXVDzbGpKlNHaiGEpo6ed8CrA/s/6mgKEb47By+WRdnv+QxPFkVmPnGjLv7uC9s8WoTqo+lHAAAAAElFTkSuQmCC);
    background-size: 20px 20px;
    background-repeat: no-repeat;
    border-radius: 50%;
    bottom: 0;
    right: 0;
    width: 43px;
    height: 43px;
    cursor: pointer;
    background-position: 50%;
    background-color: #4E8FC7;
    border: 1px solid #4E8FC7;
    vertical-align: middle;
}

/* fade labels*/

.text-field {
    margin: 20px 0 0 15px;
    position: relative;
    width: 208px;
    vertical-align: top;
}

.fade-label {
    position: relative;
}

.fade-label label.text {
    background: none repeat scroll 0pt 0pt #FFFFFF;
    -webkit-border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -ms-border-radius: 5px 5px 5px 5px;
    -o-border-radius: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    color: #b9b9b9;
    display: block;
    font-weight: normal;
    height: 33px;
    padding: 0px 0px;
    width: 100%;
}

.fade-label label.text span {
    display: block;
    padding: 7px 10px 0pt;
    text-indent: 0pt;
}

.fade-label input.text {
    background: none repeat scroll 0 0 transparent;
    font-size: 17px;
    height: 33px;
    left: 0pt;
    position: absolute;
    top: 0;
}

input.text:focus, textarea.text:focus {
    border: 1px solid #52b266;
}

/* fade label - end */

input.text, textarea {
    padding: 5px 0px;
    text-indent: 8px;
    border-color: #999999;

}

textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"] {
    -moz-transition: border linear 0.2s, box-shadow linear 0.2s;
    -o-transition: border linear 0.2s, box-shadow linear 0.2s;
    transition: border linear 0.2s, box-shadow linear 0.2s;
}

textarea, input, .button, [type="checkbox"] + i, [type="radio"] + i, select + i {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    border: 1px solid #999999;
    color: #454A4E;
    padding: 6px 8px;
}

textarea, input {
    width: 100%;
}


.button {
    font-weight: bold;
    padding: 4px 0;
    cursor: pointer;
}

.button-text.slider {
    padding: 0 16px;
}

select {
    border: 0 none;
    padding: 4px 15px;
    position: relative;
    z-index: 1;
    background: none repeat scroll 0 0 transparent;
    color: #454A4E;
    margin: 0;
    outline: 0 none;
    width: 125%;
}

.select {
    display: inline-block;
    height: 34px;
    line-height: 34px;
    position: relative;
    width: 100%;
    overflow: hidden;
}

.select span {
    display: inline-block;
    overflow: hidden;
    vertical-align: top;
    width: 100%;
}

select + i {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}

select + i:after {
    -moz-border-bottom-colors: none;
    -moz-border-image: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    border-color: #4D4D4D transparent;
    border-style: solid;
    border-width: 5px 5px 0;
    bottom: 13px;
    content: "";
    display: block;
    position: absolute;
    left: 7px;
}

.cred {
    color: #ff3366;
}

.cblue {
    color: #4e8fc7;
}

.cgreen {
    color: #52b266;
}

.bgreen {
    background: rgba(82, 178, 102, 0.45) !important;
}

.cwhite {
    color: #FFFFFF;
}

.bkgred {
    background: #ff3366;
}

.bkgblue {
    background: #4e8fc7;
}

.bkggreen {
    background: #52b266;
}

.bkgwhite {
    background: #FFFFFF;
}

.blurImg {
    filter: blur(2px) opacity(0.7);
    -webkit-filter: blur(2px) opacity(0.7);
}

.boldblue{
    font-weight:bold;
    color:#4e8fc7;
}
.blurContrastImg {
    filter: brightness(0.5);
    -webkit-filter: brightness(0.5);
}

.filter.opacity {
    opacity: 0.7 !important;
}

.fixed-bar {
    position: fixed !important;
    left: 0;
    right: 0;
    z-index: 1000;
}

button.action {
    padding: 15px 25px;
    vertical-align: top;
    background: #52b266;
    border: none;
    font-size: inherit;
    color: #FFFFFF;
    border-radius: 3px;
    -webkit-transition: background 0.18s linear;
    -moz-transition: background 0.18s linear;
    -ms-transition: background 0.18s linear;
    -o-transition: background 0.18s linear;
    transition: background 0.18s linear;
    text-shadow: none;
}

button.action.thick {
    padding: 25px 30px;
}

button.action a, button.action a:hover {
    color: #FFFFFF
}

button.action:hover, button.action:active, button.action:focus:active {
    background: #5cd17b;
}

button.action:disabled {
    opacity: 0.8;
}

button.action:hover:disabled {
    background: #52b266;
}

button.action.blue {
    background: #4e8fc7;
}

button.action.blue:hover, button.action.blue:active, button.action.blue:focus:active {
    background: #569edc;
}

button.action.emptyblue {
    background: none;
    border: 1px solid #4e8fc7;
    color: #4e8fc7;
}

button.action.emptyblue:hover, button.action.emptyblue:active, button.action.emptyblue:focus:active {
    background: #569edc;
    border: 1px solid #569edc;
    color: #FFFFFF;
}

button.action.red {
    background: #ff3366;
}

button.action.red.empty {
    background: none;
    border: 1px solid #FF3366;
    color: #ff3366;
}

button.action.red:hover, button.action.red:active, button.action.red:focus:active {
    background: #D12A54;
    border: none;
    color: #ffffff;
}

button.action.gray {
    background: #E0E0E0;
    color: inherit;
}

button.action.gray:hover, button.action.gray:focus, button.action.gray:active {
    background: #D3D3D3;
}

button.action.framed {
    border: 2px solid #eeeeee;
    background: rgba(102, 102, 102, 0.75);
}

button.action.framed:hover, button.action.framed:active, button.action.framed:focus:active {
    border: 2px solid #eeeeee;
    background: rgba(102, 102, 102, 0.75);
}

button.action.outline {
    border: 1px solid #ccc;
    background: none;
    color: #666;
}

button.action.outline:hover {
    box-shadow: 0px 0px 9px -3px #999999;
    -webkit-box-shadoww: 0px 0px 9px -3px #999999;
    -o-box-shadow: 0px 0px 9px -3px #999999;
    -moz-box-shadoww: 0px 0px 9px -3px #999999;
}

button.action.fb {
    background: #4e69a2;
}

button.action.fb:hover, button.action.fb:active, button.action.fb:focus:active {
    background: #5681C1;
}

button.action-button.azure {
    background: none repeat scroll 0 0 #25c2ff;
}

button.action-button.salmon {
    background: none repeat scroll 0 0 #fa8072;
}

button.action-button.red {
    background: none repeat scroll 0 0 #ff3366;
}

button.action-button.grass {
    background-color: #cfde5a;
    border-color: #8e9c1f;
    color: #5f6815;
}

button.action-button.grass:hover {
    background-color: #bdd02a;
    border-color: #5f6815;
}

button.action-button {
    border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    font-size: 16px;
    border: medium none;
    color: white;
    text-shadow: none;
}

.dropdown-button > button.right {
    border-radius: 0px 3px 3px 0px;
    padding: 15px 20px;
    height: 45px;
}

.dropdown-button > button.left {
    border-radius: 3px 0px 0px 3px;
    margin-right: -1px;
    padding: 15px 20px;
    height: 45px;
}

.dropdown-button > button.left:before {
    font-family: FontAwesome;
    content: "\f107";
    font-size: 19px;
    font-weight: bold;
}

button.action-button.salmon:hover, button.action-button.salmon:active, button.action-button.salmon:focus:active,
button.action-button.red:hover, button.action-button.red:active, button.action-button.red:focus:active {
    background: none repeat scroll 0 0 #ff3366;
}

.button, [type="checkbox"] + i, [type="radio"] + i, select + i {
    -moz-border-bottom-colors: none;
    -webkit-border-image: none;
    -moz-border-image: none;
    border-image: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background: -webkit-linear-gradient(#FFFFFF, #C9C9C9) repeat scroll 0 0 transparent;
    background: -moz-linear-gradient(#FFFFFF, #C9C9C9) repeat scroll 0 0 transparent;
    background: -o-linear-gradient(#FFFFFF, #C9C9C9) repeat scroll 0 0 transparent;
    background: -ms-linear-gradient(#FFFFFF, #C9C9C9) repeat scroll 0 0 transparent;
    background: linear-gradient(#FFFFFF, #C9C9C9) repeat scroll 0 0 transparent;
    border-color: #DEDEDE #C8C8C8 #B0B0B0;
    border-style: solid;
    border-width: 1px;
    -webkit-box-shadow: none;
    box-shadow: none;
    text-shadow: 0 1px #FFFFFF;
    font-size: 16px;
    font-weight: normal;
    padding: 10px 20px;
    text-shadow: 0 1px #FFFFFF;
}

.button-hover, .button-focus, .button:focus, [type="checkbox"]:focus + i, [type="radio"]:focus + i, select:focus + i, .button:hover, [type="checkbox"]:hover + i, [type="radio"]:hover + i, select:hover + i {
    background: -moz-linear-gradient(#FFFFFF, #E5E5E5) repeat scroll 0 0 transparent;
    border-color: #DEDEDE #D4D4D4 #C8C8C8;
}

.button-active, .button-focus-active, .button:focus:active, [type="checkbox"]:focus:active + i, [type="radio"]:focus:active + i, select:focus:active + i, .button:active, [type="checkbox"]:active + i, [type="radio"]:active + i, select:active + i {
    background: -moz-linear-gradient(#CCCCCC, #EEEEEE) repeat scroll 0 0 transparent;
    border-color: #828282 #B4B4B4 #DFDFDF;
    box-shadow: 0 1px 0 1px rgba(0, 0, 0, 0.05) inset, 0 1px rgba(0, 0, 0, 0.1) inset;
}

.button-focus, .button:focus, [type="checkbox"]:focus + i, [type="radio"]:focus + i, select:focus + i {
    box-shadow: 0 0 4px 0 rgba(104, 189, 244, 0.9);
}

.button-disabled, .button.disabled, .button:disabled, [type="checkbox"]:disabled + i, [type="radio"]:disabled + i, select:disabled + i {
    box-shadow: none;
    cursor: default;
    text-shadow: none;
}

.button, .pagination a, .pagination span, input, textarea, [type="checkbox"] + i, [type="radio"] + i, select + i {
    border-radius: 3px 3px 3px 3px
}

i {
    display: block;
    font-style: italic;
}

.signin-button {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #dfdfdf));
    background: -moz-linear-gradient(top, #ededed 5%, #dfdfdf 100%);
    background: -webkit-linear-gradient(top, #ededed 5%, #dfdfdf 100%);
    background: -o-linear-gradient(top, #ededed 5%, #dfdfdf 100%);
    background: -ms-linear-gradient(top, #ededed 5%, #dfdfdf 100%);
    background: linear-gradient(to bottom, #ededed 5%, #dfdfdf 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#dfdfdf', GradientType=0);
    background-color: #ededed;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    border: 1px solid #dcdcdc;
    color: #15191A;
    padding: 5px 0;
}

.signin-button:hover {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #dfdfdf), color-stop(1, #ededed));
    background: -moz-linear-gradient(top, #dfdfdf 5%, #ededed 100%);
    background: -webkit-linear-gradient(top, #dfdfdf 5%, #ededed 100%);
    background: -o-linear-gradient(top, #dfdfdf 5%, #ededed 100%);
    background: -ms-linear-gradient(top, #dfdfdf 5%, #ededed 100%);
    background: linear-gradient(to bottom, #dfdfdf 5%, #ededed 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf', endColorstr='#ededed', GradientType=0);
    background-color: #dfdfdf;
}

.signin-button:active {
    position: relative;
    top: 1px;
}

.submit-button {
    border-color: #003c8b;
    border-color: #34bff3 rgba(0, 0, 0, 0.05) #003c8b;
    background: #34bff3;
    background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #34bff3), color-stop(100%, #074aa2));
    background: -webkit-linear-gradient(#34bff3, #074aa2);
    background: -moz-linear-gradient(#34bff3, #074aa2);
    background: -o-linear-gradient(#34bff3, #074aa2);
    background: linear-gradient(#34bff3, #074aa2);
    color: #ffffff;
    -webkit-box-shadow: inset 0 1px #60cbfa;
    -moz-box-shadow: inset 0 1px #60cbfa;
    box-shadow: inset 0 1px #60cbfa;
    font-weight: normal;
    padding: 4px 20px;
    text-shadow: 0 -1px rgba(0, 0, 0, 0.5);
    width: 100px;
}

.button.green {
    background-color: #5BB65B;
    background: -webkit-linear-gradient(#62C462, #51A351) repeat scroll 0 0 transparent;
    background: -moz-linear-gradient(#62C462, #51A351) repeat scroll 0 0 transparent;
    background: -o-linear-gradient(#62C462, #51A351) repeat scroll 0 0 transparent;
    background: -ms-linear-gradient(#62C462, #51A351) repeat scroll 0 0 transparent;
    background: linear-gradient(#62C462, #51A351) repeat scroll 0 0 transparent;
    background-repeat: repeat-x;
    border-color: #51A351 #51A351 #387038;
    color: #FFFFFF;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}

.button.green:hover, .button.green:focus, .button.green:active, .button.green.active {
    background: none;
    background-color: #51A351;
    color: #FFFFFF;
}

.button.green.disabled, .button.green[disabled] {
    background: none repeat scroll 0 0 #51A351 !important;
    border: medium none !important;
    color: #FFFFFF !important;
    opacity: 0.85;
    border-color: #51A351 #51A351 #387038 !important;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}

.blue-button-test {
    background: none repeat scroll 0 0 lightBlue;
    border: medium none;
    font-size: 18px;
    padding: 7px 20px;
    text-shadow: none;
}

.blue-button-test:hover {
    background: none repeat scroll 0 0 #0d84b2;
}

.blue-button {
    background: -webkit-linear-gradient(#34BFF3, #074AA2) repeat scroll 0 0 transparent;
    background: -moz-linear-gradient(#34BFF3, #074AA2) repeat scroll 0 0 transparent;
    background: -o-linear-gradient(#34BFF3, #074AA2) repeat scroll 0 0 transparent;
    background: -ms-linear-gradient(#34BFF3, #074AA2) repeat scroll 0 0 transparent;
    background: linear-gradient(#34BFF3, #074AA2) repeat scroll 0 0 transparent;
    border-color: #34BFF3 rgba(0, 0, 0, 0.05) #003C8B;
    -webkit-box-shadow: 0 1px #60CBFA inset;
    box-shadow: 0 1px #60CBFA inset;
    color: #FFFFFF;
    text-shadow: 0 -1px rgba(0, 0, 0, 0.5);
}

.blue-button:hover, .submit-button:hover {
    background: -webkit-linear-gradient(#48C5FA, #1788D4) repeat scroll 0 0 transparent;
    background: -moz-linear-gradient(#48C5FA, #1788D4) repeat scroll 0 0 transparent;
    background: -o-linear-gradient(#48C5FA, #1788D4) repeat scroll 0 0 transparent;
    background: -ms-linear-gradient(#48C5FA, #1788D4) repeat scroll 0 0 transparent;
    background: linear-gradient(#48C5FA, #1788D4) repeat scroll 0 0 transparent;
    border-color: #34BFF3 rgba(0, 0, 0, 0.1) #0568A6;
}

.blue-button:active, .blue-button:focus, .blue-button:focus:active, .submit-button:active, .submit-button:focus, .submit-button:focus:active {
    background: -webkit-linear-gradient(#0049A8, #0F8BD6) repeat scroll 0 0 transparent;
    background: -moz-linear-gradient(#0049A8, #0F8BD6) repeat scroll 0 0 transparent;
    background: -o-linear-gradient(#0049A8, #0F8BD6) repeat scroll 0 0 transparent;
    background: -ms-linear-gradient(#0049A8, #0F8BD6) repeat scroll 0 0 transparent;
    background: linear-gradient(#0049A8, #0F8BD6) repeat scroll 0 0 transparent;
    border-color: #011938 #063E6C #0F6CA0;
}

.blue-button-disabled, .blue-button.disabled, .blue-button:disabled, .submit-button:disabled {
    background: -moz-linear-gradient(#48C5FA, #1788D4) repeat scroll 0 0 transparent !important;
    border-color: #34BFF3 rgba(0, 0, 0, 0.1) #0568A6 !important;
    box-shadow: 0 1px #60CBFA inset !important;
    color: #93CAF9 !important;
    cursor: default;
}

.pink-button {
    background: #FEF7E6;
    border: 1px solid #F0DDBF;
    border-radius: 3px 3px 3px 3px;
    display: inline-block;
    height: 65px;
    margin-bottom: 40px;
    margin-right: 40px;
    overflow: hidden;
    position: relative;
    width: 135px;
}

.pink-button:hover, .pink-button:active, .pink-button:focus {
    background: #FEF2E0;
    box-shadow: none;
}

/* errors */

::-webkit-validation-bubble-message {
    background-color: red;
    padding: 1em;
}

.error {
    background-color: red;
}

.text-error {

}

.text-error-true {
    border: 1px solid #ff3366 !important;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    box-shadow: none !important;
}

.required-alert {
    color: #ff3366;
    display: none;
    font-size: 13px;
    text-align: right;
    position: absolute;
    margin-top: 3px;
}

.invalid-alert {
    color: #ff3366;
    font-size: 13px;
    text-align: right;
    position: absolute;
    margin-top: 3px;
}

/* sprites icons */

.apps.back {
    background-position: -1013px 20px;
    background-size: 1086px auto;
    height: 100px;
    width: 72px;
}

.apps.test {
    background-position: -430px 14px;
}

.apps.preview {
    background-position: -132px 14px;
}

.apps.save {
    background-position: -388px 13px;
}

.chart {
    position: relative;
}

.chart .toc {
    display: inline-block;
    vertical-align: top;
    margin-left: 20px;
    width: 250px;
    padding: 20px 0px;
}

.chart .toc ul {
}

.chart .toc ul li > div {
    passing: 0 0 0 15px;
}

.chart .toc ul li .qube {
    width: 13px;
    height: 15px;
    vertical-align: top;
    margin-left: 2px;
}

.chart .toc ul li span {

}

.chart .toc ul li .value {
    float: left;
}

.apps {
    background-image: url("../images/applications.png");
    background-repeat: no-repeat;
    background-size: 470px auto;
    height: 45px;
    width: 45px;
}

.circle {
    background-image: url("../images/circles.png");
    background-repeat: no-repeat;
    background-size: 110px auto;
    height: 52px;
    width: 52px;
}

.circle:hover {
    background-position: -59px 0;
}

.icon {
    background: url(../images/icon-sprite.png) no-repeat transparent;
}

.icon.bulb {
    background-position: -108px -190px;
    height: 40px;
    width: 33px;
}

.icon.x {
    background-position: -88px -192px;
    height: 10px;
    width: 10px;
    cursor: pointer;
}

.icon.notif {
    background-position: -84px -120px;
    height: 22px;
    width: 16px;
}

.back {
    background-position: -4px -93px;
    height: 49px;
    width: 49px;
}

.icon.birthday {
    background-position: -5px -232px;
    height: 18px;
    width: 20px;
}

.israel {
    background-position: -39px 0;
    height: 18px;
    width: 23px;
}

.close-drawer {
    background-position: -7px -20px;
    height: 28px;
    width: 29px;
}

.close {
    background: url("../images/close.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
    height: 22px;
    width: 22px;
}

.close-modal {
    background-image: url(../images/modal-sprite.png);
    background-position: -49px 0px;
    height: 21px;
    width: 13px;
    background-repeat: no-repeat;
    cursor: pointer;
}

.close-modal.left {
    position: absolute;
    left: 20px;
    top: 20px;
}

.modal-sprite.check {
    background-position: -137px 0px;
    height: 21px;
    width: 13px;

}

.modal-sprite.thumb-up {
    background-position: 2px -84px;
    width: 50px;
    height: 50px;
}

.modal-sprite.notif {
    background-position: -216px -33px;
    width: 28px;
    height: 27px;
}

.modal-sprite {
    background-image: url(https://b105ff616ffabf542041-4bd9cbd7c940079c5eb5fd18e93586b2.ssl.cf2.rackcdn.com/modal-sprite.v2.png);
    background-repeat: no-repeat;
}

.modal-sprite.thumb-up.blue {
    background-position: -154px -84px;
    width: 47px;
    height: 50px;
}

.modal-sprite.choose {
    height: 31px;
    width: 31px;
    background-repeat: no-repeat;
    background-position: -126px -32px;
}

.modal-sprite.choose.selected {
    background-position: -171px -32px;
}

.social-icon {
    background: url(../images/social-icons.png);
    background-repeat: no-repeat;
    height: 53px;
    width: 53px;
}

.social-icon.twitter {
    background-position: -66px 0px;
}

.social-icon.facebook {
    background-position: 0px 0px;
}

.social-icon.linkedin {
    background-position: -201px 0px;
}

.social-icon.twitter:hover {
    background-position: -66px -55px;
}

.social-icon.facebook:hover {
    background-position: 0px -55px;
}

.social-icon.linkedin:hover {
    background-position: -201px -55px;
}

.tour-sprite {
    background-image: url('https://b105ff616ffabf542041-4bd9cbd7c940079c5eb5fd18e93586b2.ssl.cf2.rackcdn.com/tour-sprite.v2.png');
    background-repeat: no-repeat;
}

.tour-sprite.birthday {
    height: 75px;
    width: 89px;
    background-position: -15px -220px;
}

.tour-sprite.contacts {
    height: 75px;
    width: 89px;
    background-position: -407px -3px;
}

.tour-sprite.sms {
    height: 79px;
    width: 92px;
    background-position: -30px -1px;
}

.tour-sprite.campaign {
    height: 75px;
    width: 90px;
    background-position: -212px -3px;
}

.tour-sprite.website {
    height: 75px;
    width: 89px;
    background-position: -407px -119px;
}

.tour-sprite.social {
    height: 100px;
    width: 105px;
    background-position: -2px -95px;
}

.tour-sprite.metrics {
    height: 77px;
    width: 99px;
    background-position: -217px -114px;
}

.instagram-sprite {
    background: url('https://b105ff616ffabf542041-4bd9cbd7c940079c5eb5fd18e93586b2.ssl.cf2.rackcdn.com/core-sprites-ad25df.png');
    background-position: 0 0;
    background-repeat: no-repeat;
}

.instagram-sprite.logo {
    background-position: -343px 2px;
    width: 170px;
    height: 53px;
}

.instagram-sprite.icon {
    background-position: -210px -121px;
    height: 60px;
    width: 60px;
}

/* confirm */

.areusure {
    background: rgba(255, 255, 255, 0.90);
    height: 100%;
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    text-align: center;
    padding: 45px;
}

.areusure .content {
}

.areusure .content button {
    margin-top: 15px;
    height: 40px;
    padding: 8px 30px;
}

.areusure .content button.ok {
}

.areusure .content button.cancel {
}

/* page */

.page-header .title, .page-header .actions {
    vertical-align: top;
    position: absolute;
}

.page-header .title {
    padding: 50px 0;
    font-size: 21px;
    font-weight: bold;
    right: 0;
    color: #1f2532;
}

.page-header .actions {
    left: 0;
}

.customers > .page-header,.provider > .page-header,
.deals > .page-header, .campaigns > .page-header, .campaign > .page-header {
    background: #ffffff;
    width: 100%;
    height: 132px;
    margin-top: 0px;
    margin-bottom: 25px;
    box-shadow: 0px 0px 2px 1px #EEEEEE;
    padding: 0 0;
}

.page-header .actions .row {
    padding: 40px 0 20px;
    text-align: right;
}

.page-header .actions a {
    display: inline-block;
    color: rgba(51, 60, 78, 0.59);
    position: relative;
    vertical-align: top;
    width: 120px;
    text-align: center;
    margin-right: -4px;
    height: 92px;
''
}

.page-header .actions a:first-child {
}

.page-header .actions a .action-icon {
    margin-bottom: 10px;
}

.page-header .actions a > .current {
    height: 3px;
    width: 0px;
    position: relative;
    bottom: -24px;
    opacity: 0;
    margin: auto;
}

.page-header a.action:hover > .current {
    border-bottom: 4px solid #DDDDDD;
}

.page-header a.action > .current.show {
    border-bottom: 4px solid #4e8fc7;
}

.page-header a.action:hover > .current,
.page-header a.action > .current.show {
    width: 100%;
    opacity: 1;
}

/* walkeme intro */

.walkme-intro {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
}

.walkme-intro .peep-hole {
    position: absolute;
    border: 1500px solid rgba(51, 60, 78, 0.5);
    height: 0px;
    width: 0;
    padding: 47px;
    border-radius: 50%;
}

.walkme-intro .intro-box .text {
    margin: 20px 0;
    border-bottom: 1px solid #eee;
    padding: 0 0 25px 0;
}

/* intro */
.intro-box {
    width: auto;
    height: auto;
    position: absolute;
    background: #ffffff;
    z-index: 1;
    padding: 15px 30px;
    box-shadow: 0 0 1px rgba(76, 86, 103, .25), 0 2px 18px rgba(31, 37, 50, .32);
    position: absolute;
    top: 31px;
    left: 30px;
    z-index: 10001;
    max-height: 300px;
    max-width: 420px;
}

.intro-box.main.blue {
    background: rgba(84, 192, 138, 0.95);
    position: fixed;
    left: 50%;
    margin-left: -550px;
    top: inherit;
    position: fixed;
    color: #fff;
    width: 290px;
    bottom: 90px;
    top: inherit;
    padding: 20px 31px 0px;
}

.intro-box.main.blue .text {
    font-size: 15px;
}

.intro-box.main {
    padding: 30px 40px;
}

.intro-box.main .text {
    margin-bottom: 20px;
    font-size: 19px;
}

.intro-box .close-modal {
    position: absolute;
    left: 22px;
    top: 126px;
}

.intro-box .intro-tri {
    width: 10px;
    height: 10px;
    border-left: 51px solid transparent;
    border-right: 0px solid transparent;
    border-top: 46px solid #FFFFFF;
    bottom: -36px;
    right: 0;
    position: absolute;
}

.intro-box .intro-tri.bottom.small {
    border-left: 30px solid transparent;
    border-right: 0px solid transparent;
    border-top: 36px solid #FFFFFF;
    bottom: -17px;
}

.intro-box .intro-tri.bottom.left.small {
    border-left: 0px solid transparent;
    border-right: 30px solid transparent;
    border-top: 36px solid #FFFFFF;
    bottom: -17px;
    left: 0;
    right: inherit;
}

.intro-box .intro-tri.bottom.small.blue {
    border-left: 30px solid transparent;
    border-right: 0px solid transparent;
    border-top: 36px solid #4e8fc7;
}

.intro-box .intro-tri.top.small {
    border-left: 30px solid transparent;
    border-right: 0px solid transparent;
    border-bottom: 36px solid #FFFFFF;
    bottom: 30px;
    border-top: none;
}

.intro-box .intro-tri.left {
    border-left: 0px solid transparent;
    border-right: 30px solid transparent;
    border-top: 36px solid #FFFFFF;
    right: inherit;
    left: 0;
}

.intro-box .intro-tri.middle.bottom {
    border-left: 25px solid transparent;
    border-right: 25px solid transparent;
    border-top: 36px solid #FFFFFF;
    right: inherit;
    left: 50%;
    margin-left: -13px;
}

.intro-box .intro-tri.middle.bottom.small.blue {
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 17px solid rgba(84, 192, 138, 0.95);
    right: inherit;
    left: 50%;
    margin-left: -10px;
}

.intro-box .intro-tri.side.right {
    border-left: 0px solid #FFFFFF;
    border-right: 50px solid #FFFFFF;
    border-bottom: 15px solid transparent;
    border-top: 15px solid transparent;
    right: -40px;
    left: inherit;
    top: 9px;
    transform: rotate(180deg);
}

.intro-box .intro-tri.left.small.mid {
    border-left: 30px solid transparent;
    border-right: 30px solid transparent;
    border-bottom: 36px solid #FFFFFF;
    border-top: none;
    top: 67px;
    z-index: 4;
    right: initial;
    left: -36px;
    transform: rotate(-90deg);
}

.intro-box .intro-tri.top.small.mid {
    border-left: 30px solid transparent;
    border-right: 30px solid transparent;
    border-bottom: 36px solid #FFFFFF;
    top: -15px;
    border-top: none;
    right: 50%;
    margin-right: -36px;
    z-index: -1;
}

.intro-box button {
    padding: 13px 30px;
}

/* Login */

.login-modal.signupAsk {
    padding: 20px 70px 120px;
    width: 500px;
    left: 50%;
    margin-right: -250px;
    height: 580px;
    position: fixed;
    overflow: hidden;
}

.login-modal.signupAsk button {
    margin-top: 30px;
    width: 100%;
}

.login-modal.signupAsk .fa.whatsapp {
    top: 0;
    vertical-align: -1px;
    font-size: 21px;
}

.login-modal input.field{
    border: 1px solid #BBBBBB;
    border-radius: 3px;
    height: 45px;
    padding:13px;
    color:#999;
}

.login-modal input.field:focus{
    border: 1px solid #52b266;
}

.login-modal {
    background-color: #FFFFFF;
    border-radius: 3px;
    box-shadow: 0 0px 10px rgba(0, 0, 0, 0.15), 0 0 0 4px #FFFFFF inset;
    height: auto;
    left: 50%;
    margin: 60px auto 0 -300px;
    opacity: 0;
    padding: 40px 80px 70px;
    position: relative;
    width: 600px;
}

.login-modal .register{
    margin-top: 110px;
}
.login-modal.flat{
    opacity:1;
    box-shadow: none;
}

.login-modal form {
    margin-top: 60px;
    padding: 0 0px 78px;
}

.login-modal .title {
}

.login-modal .field {
    position: relative;
    display: block;
    margin-top: 30px;
}

.login-modal input {
    width: 100%;
    padding: 3px 6px;
    height: 40px;
    font-size: 18px;
    border-radius: 0;
}

.login-modal input,
.login-modal input.text:focus {
    border: none;
    border-bottom: 1px solid #aaa;
}

.login-modal label.clicked,
.login-modal label.full {
    color: #4e8fc7;
    top: -8px;
    font-size: 15px;
    right: 0px;
}

.login-modal label {
    color: #C3C3C3;
    position: absolute;
    right: 0px;
    top: 7px;
    font-size: 18px;
    font-weight: normal;
}

.login-modal button {
    width: 50%;
    float: right;
    display: block;
}

.login-modal .footer {
    margin-top: 30px;
}

.login-modal .message.error {
    color: #ff3366;
    text-align: right;
    background: none;
    margin-top: 8px;
}

.login-modal .pwd-forget {
    position: absolute;
    left: 80px;
    bottom: 233px;
}


.login-modal .tpl-test{
    width: 85%;
    margin: auto;
}
.login-modal .tpl-test input{
    background: transparent;
}
.login-modal .tpl-test button{margin-top: 10px;}
.login-modal .tpl-test img{height: 120px;display: block;margin: 65px auto 40px;}
.login-modal .tpl-test img{    height: 100px; display: block; margin: 25px auto 10px;}
.login-modal .tpl-test a{}
.login-modal .tpl-test .text{
    margin: 80px 0 41px;
}

.login-modal .tpl-test .test-field{position:relative;}
.login-modal .tpl-test .test-field label{
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: -1;
}


/* page loader */

@-webkit-keyframes loadingrotate {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@keyframes loadingrotate {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@-webkit-keyframes loadingrotateCCW {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@keyframes loadingrotateCCW {
    100% {
        -webkit-transform: rotate(-360deg);
        transform: rotate(-360deg)
    }
}

@-webkit-keyframes loadingdash {
    0% {
        stroke-dasharray: 1, 200;
        stroke-dashoffset: 0
    }
    50% {
        stroke-dasharray: 150, 200;
        stroke-dashoffset: -50
    }
    100% {
        stroke-dasharray: 150, 200;
        stroke-dashoffset: -185
    }
}

@keyframes loadingdash {
    0% {
        stroke-dasharray: 1, 200;
        stroke-dashoffset: 0
    }
    50% {
        stroke-dasharray: 150, 200;
        stroke-dashoffset: -50
    }
    100% {
        stroke-dasharray: 150, 200;
        stroke-dashoffset: -185
    }
}

.load-overlay {
    width: 100%;
    height: 100%;
    /*background: rgba(255, 255, 255, 0.70);*/
    position: absolute;
    top: 0;
    left: 0;
    /*z-index: 1;*/
    padding: 75px 0;
}

.load-circle {
    position: relative;
    margin: 0 auto;
    width: 65px;
    height: 64px;
    zoom: 1;
}

.circular {
    -webkit-animation: loadingrotate 2s linear infinite;
    animation: loadingrotate 2s linear infinite;
    height: 64px;
    position: relative;
    width: 65px;
}

.slider .circular{
    position:fixed;
}

.path {
    stroke-dasharray: 1, 200;
    stroke-dashoffset: 0;
    -webkit-animation: loadingdash 1.5s ease-in-out infinite;
    animation: loadingdash 1.5s ease-in-out infinite;
    stroke-linecap: round;
    stroke: #b2b5c0;
}

.load-container {
    opacity: 0.3;
}

.load-complete-true {
    opacity: 1.0;
}

.page.load-true {
    opacity: 0.5;
}

.loader-container.mid {
    top: 50%;
}

/* loaders */

.loader {
    background-repeat: no-repeat;
    position: absolute;
    z-index: 1000;
}

.loader.ind {
    background-image: url("../images/loader-ind.gif");
    min-height: 35px;
    min-width: 35px;
}

.loader.blue.small {
    background-image: url("../images/loader-blue-smll.gif");
    min-height: 19px;
    min-width: 19px;
    -webkit-animation: none;
}

.loader-container {
    position: absolute;
    right: 50%;
    margin-right: -15px;
    top: 30%;
    z-index: 10;
}

.page-loader, .loader {
    -webkit-animation: loadingrotate 0.75s infinite linear;
    background-image: url("../images/stat-ball.png");
    background-repeat: no-repeat;
    position: fixed;
    top: 50%;
    width: 24px;
    padding: 0;
    margin: 0;
    height: 24px;
}

.gear-loading {
    width: 130px;
    height: 88px;
    position: relative;
    margin: auto;
}

.gear-loading > * {
    position: absolute;
}

.gear-loading .text {
    bottom: -40px;
    right: 18px;
}

.cw-circle-3s {
    animation: loadingrotate 3s infinite linear;
    -webkit-animation: loadingrotate 2s infinite linear;
}

.ccw-circle-2s {
    animation: loadingrotateCCW 3s infinite linear;
    -webkit-animation: loadingrotateCCW 3s infinite linear;
}

.static-loader {
    animation: loadingrotate 0.75s infinite linear;
    -webkit-animation: loadingrotate 0.75s infinite linear;
    position: absolute;
    right: 47%;
}

.h-preloader {
    background-image: url("../images/h-preloader.gif");
    height: 25px;
    width: 220px;
}

.loading6 {
    width: 38px;
    height: 38px;
    background: rgba(78, 143, 199, 0.67);
    border-radius: 50%;
    display: flex;
}

.loading6:before {
    content: '';
    width: 0;
    height: 0;
    margin: auto;
    border: 10px solid #fff;
    border-radius: 50%;
    animation: loading6-ani1 1.25s infinite;
    -webkit-animation: loading6-ani1 1.2s infinite;
}

@keyframes loading6-ani1 {
    70% {
        width: 40px;
        height: 40px;
    }
    100% {
        width: 40px;
        height: 40px;
        border-width: 0;
    }
}

@-webkit-keyframes loading6-ani1 {
    80% {
        width: 40px;
        height: 40px;
    }
    100% {
        width: 40px;
        height: 40px;
        border-width: 0;
    }
}

/* top menu */

.pageHeader .container {
    position: relative;
    z-index: 1000;
}

.menu.top {
    height: 75px;
    top: 0;
    text-align: justify;
    postion: absolute;
}

.menu .content {
    height: 100%;
    direction: ltr;
    position: relative;
}

.menu .item {
    color: white;
    height: 100%;
    vertical-align: middle;
}

.menu .item.title {
    padding: 23px 5px;

}

.menu .layer1, .menu .layer2, .menu nav {
    height: 53px;
    position: absolute;
    bottom: 0;
    width: 100%;
}

.menu.top, .menu .sub {
    background: none repeat scroll 0 0 #1f2532;
}

.palette .menu.top, .palette .menu .sub {
    background: none repeat scroll 0 0 #022430;
}

.palette .menu .item.link {
    display: none;
}

.sub.menu-border {

}

.menu .sub {
    direction: rtl;
    padding: 20px 20px 36px 36px;
    position: absolute;
    right: -5px;
    top: 41px;
    border-radius: 3px;
    box-shadow: 1px 3px 10px -4px #333;
}

.menu .sub.admin {
    right: 271px;
    direction: ltr;
}

.menu .sub * {
    display: block;
}

.menu .item.link span.fa.lock {
    padding: 0;
    float: right;
    margin-left: 7px;
    padding-top: 3px
}

.menu .item.link a {
    color: #EEEEEE;
    position: relative;
}

.menu .item.link {
    padding: 0;
    vertical-align: bottom;
    position: relative;
}

.menu .item.link a.fa.home {
    font-size: 29px;
    height: 45px;
    margin-top: -2px;
    padding: 10px 22px;
    width: 70px;
}

.menu .internal .item.menu-logo {
    width: 220px;
}

.menu .item.link.divider {
    margin: 20px 0 0;
    border-top: 1px solid #363636;
}

.menu .item.link a .fa.power-off {
    font-size: 15px;
    top: 0;
    padding: 2px 0;
    float: right;
}

.menu .item.link a.tab-menu {
    background: #757b8c;
    padding: 15px 25px 13px;
    border-radius: 3px 3px 0 0;
    margin: 7px 3px;
    -webkit-transition: all 0.18s linear;
    -moz-transition: all 0.18s linear;
    -ms-transition: all 0.18s linear;
    -o-transition: all 0.18s linear;
    transition: all 0.18s linear;
    cursor: pointer;
}

.menu .item.link a.tab-menu:hover {
    background: #acb1be;
}

.menu .item.link a.tab-menu.active, .menu .item.link a.tab-menu.active:hover {
    background: #FFFFFF;
    color: #666666;
}

.menu .item.link a {
    padding: 17px 0;
}

.menu .item.right.third a {
    padding: 13px;
    margin-top: -12px;
}

.menu .sub .item.link a {
    height: 35px;
}

.menu .item img {
    margin-right: 22px;
    margin-top: 7px;
}

.menu .item.right {
    cursor: pointer;
    height: 53px;
    position: absolute;
    right: 0;
}

.menu .item.right.second {
    right: 75px;
}

.menu .item.right.third {
    right: 445px;
    padding: 18px 0;
}

.menu .sub .item.link {
    padding: 0 0;
}

.menu .item.link a.hover-true, .menu .item.link a:hover, .menu .item.link a:active {
    color: #FFFFFF;
}

.menu .external .item.link a:hover {
    text-shadow: 0px 0px 1px #FFFFFF
}

.menu .external .item.link a {
    margin-left: 25px;
    margin-left: 25px;
    padding: 12px 0;
}

.mobile.main-menu {
    background: rgba(0, 0, 0, 0.5);
    height: 150%;
    width: 100%;
    position: fixed;
    z-index: 999;
}

.mobile.main-menu .menu-slider {
    width: 70%;
    height: 100%;
    background-color: #FFFFFF;
    transform: translateX(100%);
    -webkit-transform: translateX(100%);
    -ms-transform: translateX(100%);

}

.mobile.main-menu .menu-slider.open {
    transform: translateX(0%);
    -webkit-transform: translateX(0%);
    -ms-transform: translateX(0%);
}

.mobile.main-menu .menu-slider .top-area {
    height: 200px;
    width: 100%;
    background-color: #EEEEEE;
    padding: 160px 20px 0;
    text-align: right;
}

.mobile.main-menu .menu-slider ul {
    padding: 0;
}

.mobile.main-menu .menu-slider ul li {
    border-bottom: 1px solid #EEEEEE;
    width: 100%;
    padding: 15px 20px 15px;
}

.mobile.main-menu .menu-slider ul li a {
}

.mobile.main-menu .menu-slider ul li a span.fa {
    top: 2px;
    margin: 0 0 5px 0;
    padding: 0;
}

.arrow {
    cursor: pointer;
    margin-left: 5px;
    padding: 1px 0;
}

.arrow.down {
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 6px solid #FFFFFF;
}

.arrow.down.hover-true {
    border-top: 6px solid #FFFFFF;
}

/* pages */

.page {
    background: none repeat scroll 0 0 white;
    border: 1px solid #D8D8D8;
    margin-top: 130px;
    -webkit-border-radius: 3px 3px 3px 3px;
    -moz-border-radius: 3px 3px 3px 3px;
    border-radius: 3px 3px 3px 3px;
    padding: 25px 50px;
    min-height: 900px;

}

.page.load {
    opacity: 0;
    right: -10px;
}

.page.show {
    opacity: 1;
    right: 0px;
}

.page nav li .tri-r-1 {
    border-bottom: 15px solid transparent;
    border-left: 15px solid #D8D8D8;
    border-top: 15px solid transparent;
    height: 0;
    left: -20px;
    position: absolute;
    top: 15px;
    width: 0;
}

.page nav li .tri-r-2 {
    border-bottom: 14px solid transparent;
    border-left: 14px solid white;
    border-top: 14px solid transparent;
    height: 0;
    left: -21px;
    position: absolute;
    top: 16px;
    width: 0;
}

.page .title {
    border-bottom: 1px solid #D8D8D8;
    margin-bottom: 25px;
    height: 55px;
    font-size: 25px;
}

.screen-area {
    background: #FFFFFF;
    border-radius: 3px;
    padding: 35px 30px;
    border: 1px solid #F0F0F0;
}

.overlay {
    background: none repeat scroll 0 0 black;
    height: 100%;
    left: 0;
    opacity: 0.5;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1001;
}

.overlay-scroll {
    background: rgba(0, 0, 0, 0.6);
    height: 100%;
    width: 100%;
    display: flex;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 1001;
    overflow: auto;
}

.overlay-scroll.dark {
    background: rgba(0, 0, 0, 0.8);
}

.overlay-scroll.dark-blue {
    background-color: rgba(50, 58, 69, 0.8);
}

.overlay.white-ol {
    background-color: #FFFFFF;
    opacity: 0.4;
}

.overlay-scroll > .containter {
    margin: 0 auto;
    position: relative;
}

.overlay.white {
    background: none repeat scroll 0 0 #FFFFFF;
    height: 100%;
    left: 0;
    opacity: 0.85;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1001;
}

.select-wrapper {
    display: inline-block;
    width: 100%;
}

.select-wrapper * {
    display: inline-block;
}

.select-wrapper input[type=radio].first {
    margin: 0 1px 0 0px;
}

.select-wrapper input[type=radio] {
    width: 17px;
    height: 17px;
    vertical-align: -4px;
    margin: 0 10px 0 4px;
}

.select-wrapper input[type=radio]:disabled {
    cursor: not-allowed
}

.select-wrapper span {
}

.select-wrapper .comment {
    top: 0px;
    background: #F0F0F0;
    padding: 7px 10px 7px 15px;
    margin-right: 14px;
    border-radius: 15px;
    font-size: inherit;
    border: 1px solid #ddd;
}

.select-wrapper span.first {

}

.select-wrapper select {
    width: 110%;
    height: 100%;
}

.select-wrapper select option {
}

.pop-up-container {

}

.pop-up {
    background: none repeat scroll 0 0 white;
    border-radius: 5px 5px 5px 5px;
    box-shadow: 0 10px 30px #333333;
    padding-bottom: 15px;
    position: fixed;
    right: 50%;
    top: 140px;
    z-index: 5000;
}

.pop-up form {
    padding: 7px 25px 7px 25px;
}

.pop-up > .title, .pop-up form {
    width: 100%;
}

.pop-up > .title {
    background: none repeat scroll 0 0 #EEEEEE;
    font-size: 19px;
    margin: 0;
    height: auto;
    padding: 10px 25px 10px 25px;
    border-radius: 5px 5px 0 0;
}

.pop-up .close {
    left: 7px;
    position: absolute;
    top: 7px;
    cursor: pointer;
}

.pop-up.confirm {
    border: none;
    margin-right: -250px;
    width: 500px;
    padding: 7px 20px 50px;
    top: 200px;
}

.pop-up.animated {
    -webkit-transition: transform 0.1s, opacity 0.25s;
    -moz-transition: transform 0.1s, opacity 0.25s;
    transition: transform 0.1s, opacity 0.25s;
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
    opacity: 0;
    display: none;
}

.pop-up.animated.open {
    display: block;
}

.pop-up.animated.enter {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    opacity: 1;
}

.modal.open {
    display: block;
}

.confirm .close-modal {
    position: absolute;
    left: 10px;
    top: 5px;
}

.confirm .title {
    font-size: 18px;
    height: 35px;
    padding: 7px 17px;
    width: 100%;
    text-align: center;
    background: #FFF;
    border-bottom: 1px solid #CCCCCC;
}

.confirm .message, .confirm .action {
    padding: 7px 40px;
    text-align: center;
    margin: 0 3px;
}

.confirm .message {
    padding: 20px;
    margin: 10px 0;
}

.confirm .action .button {
    font-size: 16px;
    margin: 0 5px;
    padding: 4px 25px;
}

.pop-up.centered {
    min-width: 550px;
    width: auto;
    min-height: 400px;
    margin-right: -275px;
    padding: 10px 20px;
}

.pop-up.centered > .title {
    background: none;
    text-align: center;
    border-bottom: 1px solid #EEEEEE;
    padding: 10px 0 15px;
    letter-spacing: 1px;
    color: #1f2530;
}

.pop-up.centered a.close-modal {
    position: absolute;
    left: 20px;
    top: 10px;
}

/* side slider */

.slider {
    background: #FFFFFF;
    height: 100%;
    z-index: 2001;
    position: fixed;
    right: 0;
    left: auto;
    top: 0;
    bottom: 0;
    -webkit-transition: transform 0.3s;
    -moz-transition: transform 0.3s;
    -o-transition: transform 0.3s;
    -ms-transition: transform 0.3s;
    transform: translateX(100%);
    -webkit-transform: translateX(100%);
    -ms-transform: translateX(100%);
    width: 650px;
}

.slider-change, .sliderChange {
    -webkit-transition: transform 0.3s;
    -moz-transition: transform 0.3s;
    -o-transition: transform 0.3s;
    -ms-transition: transform 0.3s;
    transition: transform 0.3s;
    transform: translateX(0%);
    -webkit-transform: translateX(0%);
    -ms-transform: translateX(0%);
}

.slider.image.slider-change, .slider.badges-add.slider-change, .slider.image.sliderChange, .slider.badges-add.sliderChange {

}

.slider-change.med {
    width: 670px !important;
}

.slider-change.wide {
    width: 800px !important;
}

.slider .loader {
    top: 50px;
}

.slider .nav.nav-tabs {
    position: relative;
    display: block;
    padding: 20px 80px;
    right: 0;
    height: 65px;
    top: 0;
}

.slider .nav.nav-tabs > li {
    float: right;
}

.slider .nav.nav-tabs > li > a {
    background: none;
    border: none;
}

.slider .nav-tabs > li.active > a {
    border-bottom: 3px solid #5FC8F0;
}

.slider .nav-tabs > li.active > a:hover, .slider .nav-tabs > li.active > a:focus {
    background: none;
    border: none;
    cursor: pointer;
    border-bottom: 3px solid #5FC8F0;
}

.slider button.action {
    padding: 10px 20px 10px 30px;
    font-size: 16px;
    margin-top: -5px;
    position: relative;
    z-index: 2;
}

.slider button.action span {
    top: 8px;
    margin-left: 10px;
    font-size: 21px;
    position: absolute;
    display: block;
    left: 10px;
}

/* tooltip + validations*/

.input-help {
    display: none;
    background: none repeat scroll 0 0 #F78B83;
    border: 1px solid #F78B83;
    border-radius: 5px 5px 5px 5px;
    box-shadow: 0 1px 3px #AAAAAA;
    font-size: 0.875em;
    min-width: 140px;
    opacity: 0.95;
    padding: 10px;
    position: absolute;
    z-index: 100;
    left: 209px;
    top: 16px;
    font-size: 12px;
}

.input-help.ng {
    display: block;
}

.input-help.right {
    left: 209px;
    top: 16px;
}

.input-help.left {
    left: -229px;
    top: 16px;
}

.input-help.top {
    right: 0;
    top: -50px;
}

.input-help.right::before {
    content: "\25C0";
    position: absolute;
    top: 10px;
    left: -12px;
    font-size: 16px;
    line-height: 16px;
    color: #F78B83;
    text-shadow: none;
}

.input-help.top::after {
    content: "\25BC";
    position: absolute;
    top: 34px;
    left: 118px;
    font-size: 16px;
    line-height: 16px;
    color: #F78B83;
    text-shadow: none;
}

.input-help.left::after {
    color: #F78B83;
    content: "▶";
    font-size: 16px;
    left: 220px;
    line-height: 16px;
    position: absolute;
    text-shadow: none;
    top: 10px;
}

.input-help h4 {
    margin: 0;
    padding: 0;
    font-weight: normal;
    font-size: 1.1em;
}

.field-error.bottom {
    color: orangered;
    font-size: 15px;
    text-align: right;
}

input.ng-pristine + .input-help {
    display: none;
}

[ng\:cloak], [ng-cloak], .ng-cloak {
    display: none !important;
}

/* Hide the invalid box while the input has focus */
.ng-invalid:focus + .input-help {
    display: none;
}

.ng-invalid + .input-help {
    display: block;
}

/* notifications */

.notification {
    background-color: rgba(84, 192, 138, 0.95);
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    height: auto;
    max-width: 300px;
    min-width: 300px;
    padding: 35px 25px 70px;
    position: fixed;
    right: 20px;
    top: 40px;
    z-index: 20000;
    box-shadow: 0px 1px 2px 0px #ccc;
    color: #ffffff;
    opacity: 0;
    -ms-transform: translateY(-20px);
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
    -webkit-transition: transform linear 0.2s, opacity linear 0.2s;
    transition: transform linear 0.2s, opacity linear 0.2s;
    -moz-transition: transform linear 0.2s, opacity linear 0.2s;
    -ms-transition: transform linear 0.2s, opacity linear 0.2s;
    -o-transition: transform linear 0.2s, opacity linear 0.2s;
}

.notification.open {
    display: block;
}

.animate-enterance-top.enter {
    -ms-transform: translateY(0px);
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    opacity: 1;
}

.notification.error {
    background-color: rgba(255, 51, 102, 0.95);
}

.notification > div {
    padding: 6px 34px 10px 0;
    text-align: right;
}

.notification > div:lang(en) {
    padding: 0px 0px 10px 40px;
    text-align: left;
}

.ui-datepicker {
    width: 241px;
    margin: 4px -17px;
}

.ui-datepicker-calendar {
    direction: ltr;
}

.ui-datepicker-div .ui-datepicker {
    width: 250px;
    color: #333333;
}

.ui-datepicker td {
    border: 0 none;
    font-size: 14px;
    padding: 1px;
}

input.cal {
    background-image: url("../images/cal.gif");
    background-position: 183px 50%;
    background-repeat: no-repeat;
    text-indent: 10px;
}

/* ng animation*/

.fade-show-setup,
.fade-hide-setup {
    transition: all ease-in .5s;
}

.fade-show-setup,
.fade-hide-setup.fade-hide-start {
    opacity: 0;
}

.fade-hide-setup,
.fade-show-setup.fade-show-start {
    opacity: 1;
}

.slide {
    -webkit-transition: transform 0.3s;
    -moz-transition: transform 0.3s;
    -o-transition: transform 0.3s;
    -ms-transition: transform 0.3s;
    transition: transform 0.3s;
    transform: translateX(-100%);
    -webkit-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
}

.slide.open {
    transform: translateX(0%);
    -webkit-transform: translateX(0%);
    -ms-transform: translateX(0%);
}

.modal-animate.enter, .modal-animate.out {
    -webkit-transition: -webkit-transform .2s, opacity .2s;
}

.modal-animate.enter {
    transition: transform .2s, opacity .2s;
    opacity: 1;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}

.modal-animate {
    opacity: 0;
    filter: alpha(opacity=0);
    -webkit-transform: scale(.7);
    -ms-transform: scale(.7);
    transform: scale(.7);
}

.animate-enterance-pop {
    display: none;
    opacity: 0;
    transition: opacity 0.15s ease-in-out, transform 0.15s ease-in-out;
    -webkit-transition: opacity 0.15s ease-in-out, transform 0.15s ease-in-out;
    transform: scale(0.85) translateY(6px);
}

.animate-enterance-pop.open {
    display: block;
}

.animate-enterance-pop.enter {
    opacity: 1;
    transform: scale(1) translateY(0);
}

.animate-enterance-stretch {
    display: none;
    opacity: 0;
    max-height: 0;
    -webkit-transition: all 400ms cubic-bezier(.7, 0, .3, 1);
    transition: all 400ms cubic-bezier(.7, 0, .3, 1);
}

.animate-enterance-stretch.open {
    display: block;
}

.animate-enterance-stretch.enter {
    opacity: 1;
    max-height: 500px;
}

.animate-fade {
    display: none;
    opacity: 0;
    -webkit-transition: transform linear 0.1s, opacity linear 0.1s;
    transition: transform linear 0.1s, opacity linear 0.1s;
    -moz-transition: transform linear 0.1s, opacity linear 0.1s;
    -ms-transition: transform linear 0.1s, opacity linear 0.1s;
    -o-transition: transform linear 0.1s, opacity linear 0.1s;
}

.animate-fade.open {
    display: block;
}

.animate-fade.enter {
    opacity: 1;
}

.animate-enterance-top {
    display: none;
    opacity: 0;
    -ms-transform: translateY(-40px);
    -webkit-transform: translateY(-40px);
    transform: translateY(-40px);
}

.animate-enterance-top.open {
    display: block;
}

.animate-enterance-top.enter {
    -ms-transform: translateY(0px);
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    -webkit-transition: transform linear 0.1s, opacity linear 0.1s;
    transition: transform linear 0.1s, opacity linear 0.1s;
    -moz-transition: transform linear 0.1s, opacity linear 0.1s;
    -ms-transition: transform linear 0.1s, opacity linear 0.1s;
    -o-transition: transform linear 0.1s, opacity linear 0.1s;
    opacity: 1;
}

.animate-enterance-bottom {
    display: none;
    opacity: 0;
    -ms-transform: translateY(40px);
    -webkit-transform: translateY(40px);
    transform: translateY(40px);
}

.animate-enterance-bottom.open {
    display: block;
}

.animate-enterance-bottom.enter {
    -ms-transform: translateY(0px);
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    -webkit-transition: transform linear 0.1s, opacity linear 0.1s;
    transition: transform linear 0.1s, opacity linear 0.1s;
    -moz-transition: transform linear 0.1s, opacity linear 0.1s;
    -ms-transition: transform linear 0.1s, opacity linear 0.1s;
    -o-transition: transform linear 0.1s, opacity linear 0.1s;
    opacity: 1;
}

.trans-300ms{
    transition-duration: 0.3s !important;
    -moz-transition-durationn: 0.3s !important;
    -o-transition-durationn: 0.3s !important;
    -webkit-transition-duration: 0.3s !important;
}

.trans-400ms{
    transition-duration: 0.4s !important;
    -moz-transition-durationn: 0.4s !important;
    -o-transition-durationn: 0.4s !important;
    -webkit-transition-duration: 0.4s !important;
}

.animate-enterance-bottom.slow.enter {
    -ms-transform: translateY(0px);
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    -webkit-transition: transform linear 0.4s, opacity linear 0.4s;
    transition: transform linear 0.4s, opacity linear 0.4s;
    -moz-transition: transform linear 0.4s, opacity linear 0.4s;
    -ms-transition: transform linear 0.4s, opacity linear 0.4s;
    -o-transition: transform linear 0.4s, opacity linear 0.4s;
    opacity: 1;
}

.animate-enterance-right {
    display: none;
    opacity: 0;
    -ms-transform: translateX(-50px);
    -webkit-transform: translateX(-50px);
    transform: translateX(-50px);
}

.animate-enterance-right.open {
    display: inline-block;
}

.animate-enterance-right.enter {
    -ms-transform: translateX(0px);
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
    -webkit-transition: transform linear 0.2s, opacity linear 0.2s;
    transition: transform linear 0.2s, opacity linear 0.2s;
    -moz-transition: transform linear 0.2s, opacity linear 0.2s;
    -ms-transition: transform linear 0.2s, opacity linear 0.2s;
    -o-transition: transform linear 0.2s, opacity linear 0.2s;
    opacity: 1;
}

.animate-enterance-right100ms {
    display: none;
    opacity: 0;
    -ms-transform: translateX(-50px);
    -webkit-transform: translateX(-50px);
    transform: translateX(-50px);
    -webkit-transition: transform linear 0.2s, opacity linear 0.1s;
    transition: transform linear 0.1s, opacity linear 0.1s;
    -moz-transition: transform linear 0.1s, opacity linear 0.1s;
    -ms-transition: transform linear 0.1s, opacity linear 0.1s;
    -o-transition: transform linear 0.1s, opacity linear 0.1s;
}

.animate-enterance-right100ms.open {
    display: inline-block;
}

.animate-enterance-right100ms.enter {
    -ms-transform: translateX(0px);
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
    opacity: 1;
}

.animate-enterance-right.slow.enter {
    -ms-transform: translateX(0px);
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
    -webkit-transition: transform linear 0.4s, opacity linear 0.4s;
    transition: transform linear 0.4s, opacity linear 0.4s;
    -moz-transition: transform linear 0.4s, opacity linear 0.4s;
    -ms-transition: transform linear 0.4s, opacity linear 0.4s;
    -o-transition: transform linear 0.4s, opacity linear 0.4s;
    opacity: 1;
}

.animate-enterance-left {
    display: none;
    opacity: 0;
    -ms-transform: translateX(50px);
    -webkit-transform: translateX(50px);
    transform: translateX(50px);
}

.animate-enterance-left.open {
    display: inline-block;
}

.animate-enterance-left.enter {
    -ms-transform: translateX(0px);
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
    -webkit-transition: transform linear 0.2s, opacity linear 0.2s;
    transition: transform linear 0.2s, opacity linear 0.2s;
    -moz-transition: transform linear 0.2s, opacity linear 0.2s;
    -ms-transition: transform linear 0.2s, opacity linear 0.2s;
    -o-transition: transform linear 0.2s, opacity linear 0.2s;
    opacity: 1;
}

.animate-enterance-left.slow.enter {
    -ms-transform: translateX(0px);
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
    -webkit-transition: transform linear 0.4s, opacity linear 0.4s;
    transition: transform linear 0.4s, opacity linear 0.4s;
    -moz-transition: transform linear 0.4s, opacity linear 0.4s;
    -ms-transition: transform linear 0.4s, opacity linear 0.4s;
    -o-transition: transform linear 0.4s, opacity linear 0.4s;
    opacity: 1;
}

.animate-enterance-fade {
    display: none;
    opacity: 0;
}

.animate-enterance-fade.open {
    display: block;
}

.animate-enterance-fade.enter {
    -webkit-transition: opacity linear 0.2s;
    transition: opacity linear 0.2s;
    -moz-transition: opacity linear 0.2s;
    -ms-transition: opacity linear 0.2s;
    -o-transition: opacity linear 0.2s;
    opacity: 1;
}

.animate-enterance-fade.fast.enter {
    -webkit-transition: opacity linear 0.1s;
    transition: opacity linear 0.1s;
    -moz-transition: opacity linear 0.1s;
    -ms-transition: opacity linear 0.1s;
    -o-transition: opacity linear 0.1s;
    opacity: 1;
}

.animate-image-fade {
    -webkit-transition: opacity linear 1.5s;
    transition: opacity linear 1.5s;
    -moz-transition: opacity linear 1.5s;
    -ms-transition: opacity linear 1.5s;
    -o-transition: opacity linear 1.5s;
    opacity: 0;

}

.animate-image-fade.show {
    opacity: 1;
}

.animate-opslide-left {
    display: none;
    opacity: 0;
    -ms-transform: translateX(50px);
    -webkit-transform: translateX(50px);
    transform: translateX(-50px);
    -webkit-transition: transform linear 0.1s, opacity linear 0.1s;
    transition: transform linear 0.1s, opacity linear 0.1s;
    -moz-transition: transform linear 0.1s, opacity linear 0.1s;
    -ms-transition: transform linear 0.1s, opacity linear 0.1s;
    -o-transition: transform linear 0.1s, opacity linear 0.1s;
}

.animate-opslide-left.open {
    display: inline-block;
}

.animate-opslide-left.enter {
    -ms-transform: translateX(0px);
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
    opacity: 1;
}

/* admin*/

.admin {
    direction: ltr;
}

.admin.invref {
}

.admin.invref .pop-up {
    width: 650px;
    height: 500px;
    margin: auto;
    right: 50%;
    margin-right: -375px;
    padding: 20px 50px;
}

.admin.invref .pop-up h3 {
    text-align: center;
}

.admin.invref .pop-up .close-modal {
    position: absolute;
    top: 15px;
    left: 15px;
}

.admin.invref .pop-up form {
    padding: 50px 41px;
    text-align: left;
}

.admin.invref .pop-up form label {
}

.admin.invref .pop-up form input {
    height: 40px;
    margin-bottom: 10px;
}

.admin.invref .pop-up form button {
    display: inline-block;
    margin-top: 20px;
}

/* notif */

.setting-notif {
    border: 1px solid #C9C9C9;
    font-weight: bold;
    margin-top: -23px;
    padding: 16px;
    text-align: center;
    display: none;
}

.setting-notif.success, .setting-notif.pwd-save-success {
    background: #e6f8dd;
}

.setting-notif.error {
    background: #feeeee;
}

.message-box {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    color: white;
    padding: 10px 20px;
    margin: 10px 0;
    padding: 10px 20px;
}

.message-box.information {
    background-color: #7cc576;
}

.message-box.error {
    background: #ff3366;
    font-size: 14px;
    margin-top: -5px;
}

.message-box.error a {
    text-shadow: none;
    vertical-align: text-top;
}

.load-overlay.white {
    background: none repeat scroll 0 0 rgba(255, 255, 255, 0.5);
    height: 100%;
    opacity: 0.8;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1000;
}

.separator {
    border: 5px dashed beige;
    width: 100%;
}

.powered {
    bottom: 27px;
    color: #666666;
    direction: ltr;
    font-size: 12px;
    position: absolute;
    right: 30px;
}

.powered img {
    height: 12px;
}

img.flip {
    -moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    -ms-filter: "FlipH";
}

.sap-s1 {
    background-image: url("../images/dec-saparator-3.png");
    background-repeat: no-repeat;
    height: 14px;
    width: 600px;
}

.sap-s2 {
    background-image: url("../images/dec-saparator-2.png");
    background-repeat: no-repeat;
    height: 24px;
    width: 91px;
    margin: auto;
}

.rojo {
    color: #f27d73;
}

.ddmm {
    font-size: 12px;
    font-weight: normal;
}

.-tooltip .icon.bulb {
    float: left;
}

.-tooltip {
    background: none repeat scroll 0 0 #FFFFDD;
    border: 1px solid #EAD7D7;
    box-shadow: 1px 1px 3px #CCCCCC;
    display: none;
    height: auto;
    padding: 14px;
    position: absolute;
    left: -150px;
    width: 125px;
}

.-tooltip ul {
    margin-top: 58px;
}

.-tooltip ul li {
    list-style-type: circle;
    margin-bottom: 16px;
    margin-right: 8px;
    opacity: 0.3;
    text-shadow: 1px 1px #EEEEEE;
}

.-tooltip .current.true {
    opacity: 1;
}

.monospace {
    font-family: monospace;
}

/* actions icons */

.action-icon {
    background-image: url('https://b105ff616ffabf542041-4bd9cbd7c940079c5eb5fd18e93586b2.ssl.cf2.rackcdn.com/actions-sprite.v17.png');
    background-repeat: no-repeat;
    height: 37px;
    width: 39px;
    margin: 0 auto;
}

.action-icon.small {
    height: 22px;
    width: 27px;
}

.action-icon.small.campaign {
    background-position: -387px -116px;
    height: 28px;
}

.action-icon.small.search {
    background-position: -334px -115px;
    height: 28px;
}

.action-icon.small.cal {
    position: relative;
    background-position: -272px -115px;
    height: 28px;
}

.action-icon.small.customer {
    background-position: -209px -115px;
    height: 28px;
}

.action-icon.small.bday {
    background-position: -149px -115px;
    height: 28px;
}

.action-icon.small.sms {
    background-position: -26px -116px;
    height: 27px;
}

.action-icon.small.campaigns {
    background-position: -88px -115px;
    height: 28px;
}

.action-icon.contact-add {
    background-position: -367px -8px;
}

.action-icon.add-image {
    background-position: -367px -8px;
}

a.action:hover > .action-icon.contact-add {
    background-position: -367px -58px;
}

.action-icon.business-page {
    background-position: -18px -8px;
}

a.action:hover > .action-icon.business-page {
    background-position: -18px -58px;
}

.action-icon.facebook-page {
    background-position: -229px -8px;
}

a.action:hover > .action-icon.facebook-page {
    background-position: -229px -58px;
}

.action-icon.simple,
.action-icon.campaign-start {
    background-position: -89px -8px;
}

a.action:hover > .action-icon.simple,
a.action:hover > .action-icon.campaign-start {
    background-position: -89px -58px;
}

a.action:hover > .action-icon.campaign-start {
    background-position: -89px -58px;
}

.action-icon.group_sms,
.action-icon.group-sms {
    background-position: -298px -8px;
    width: 42px;
}

a.action:hover > .action-icon.group-sms:hover {
    background-position: -298px -58px;
}

.action-icon.birthday {
    background-position: -157px -8px;
}

a.action:hover > .action-icon.birthday {
    background-position: -157px -58px;
}

.action-icon.display-screens {
    background-position: -521px -4px;
    width: 40px;
}

a.action:hover > .action-icon.display-screens {
    background-position: -521px -54px;
}

.action-icon.customer_club,
.action-icon.customer-club {
    background-position: -675px -4px;
    width: 40px;
}

a.action:hover > .action-icon.customer_club,
a.action:hover > .action-icon.customer-club {
    background-position: -675px -54px;
}

.action-icon.event,
.action-icon.upcoming-events {
    background-position: -443px -4px;
    width: 40px;
}

a.action:hover > .action-icon.event,
a.action:hover > .action-icon.upcoming-events {
    background-position: -443px -54px;
}

.action-icon.customers-settings {
    background-position: -944px -3px;
    width: 40px;
}

a.action:hover > .action-icon.customers-settings {
    background-position: -944px -52px;
}

.action-icon.anniversary {
    background-position: -598px -4px;
    width: 40px;
}

.action-icon.triggered {
    background-position: -1228px -4px;
    width: 40px;
}

.action-icon.triggered {
    background-position: -1228px -4px;
    width: 40px;
}

a.action:hover > .action-icon.anniversary {
    background-position: -598px -54px;
}

.action-icon.content {
    background-position: -747px -4px;
    width: 40px;
}

.action-icon.images {
    background-position: -1300px -4px;
    width: 40px;
}

.action-icon.businesses {
    background-position: -1375px -4px;
    width: 40px;
    height: 37px;
}

a.action:hover > .action-icon.content {
    background-position: -747px -52px;
}

.action-icon.content_facebook,
.action-icon.fb-content {
    background-position: -810px -4px;
    width: 40px;
}

a.action:hover > .action-icon.fb-content {
    background-position: -810px -52px;
}

.action-icon.fb-promotion {
    background-position: -867px -4px;
    width: 46px;
}

a.action:hover > .action-icon.fb-promotion {
    background-position: -867px -52px;
}

.action-icon.sent {
    background-position: -1025px -4px;
    width: 40px;
}

a.action:hover > .action-icon.sent {
    background-position: -1025px -51px
}

.action-icon.automated {
    background-position: -1227px -4px;
    width: 40px;
}

a.action:hover > .action-icon.automated {
    background-position: -1227px -54px;
}

.action-icon.scheduled {
    background-position: -1162px -4px;
    width: 40px;
}

a.action:hover > .action-icon.scheduled {
    background-position: -1162px -53px;
}

.action-icon.draft {
    background-position: -1092px -4px;
    width: 40px;
}

a.action:hover > .action-icon.draft {
    background-position: -1092px -54px;
}

/* slider */

input[type=range] {
    -webkit-appearance: none;
    border: none;
    margin: 20px 0;
}

input[type=range]::-webkit-slider-runnable-track {
    height: 3px;
    background: #ddd;
    border: none;
    border-radius: 3px;
}


input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none;
    border: 1px solid #fff;
    height: 25px;
    width: 25px;
    border-radius: 50%;
    background: #a6c776;
    margin-top: -11px;
    cursor: pointer;
}

/* switch wrap */

.switch_wrap {
    cursor: pointer;
    font-family: arial;
}

.switch_wrap input[type="checkbox"] {
    display: none;
}

.switch_wrap input[type="checkbox"]:checked + .switch {
    background-color: #a6c776;
}

.switch_wrap input[type="checkbox"]:checked + .switch::before {
    display: block;
}

.switch_wrap input[type="checkbox"]:checked + .switch::after {
    display: none;
}

.switch_wrap input[type="checkbox"]:checked + .switch .bullet {
    left: -34px;
}

.switch_wrap .switch {
    position: relative;
    display: inline-block;
    width: 57px;
    height: 24px;
    line-height: 20px;
    margin-right: 1em;
    margin-top: -3px;
    vertical-align: middle;
    background-color: #dfd7c9;
    border-radius: 1em;
}

.switch_wrap .switch::before,
.switch_wrap .switch::after {
    content: 'פעיל';
    display: none;
    width: 50%;
    position: absolute;
    top: 1px;
    font-size: 11px;
    text-align: center;
    color: #6a8d37;
    left: 24px;
}

.switch_wrap .switch::after {
    content: 'כבוי';
    display: block;
    right: 24px;
    color: #b4a995;
}

.switch_wrap.clear .switch {
    width: 41px;
    margin-right: 0;
}

.switch_wrap.clear .switch::after {
    content: '';
}

.switch_wrap.clear .switch::before,
.switch_wrap.clear .switch::after {
    content: '  ';
}

.switch_wrap.clear input[type="checkbox"]:checked + .switch .bullet {
    left: -18px;
}

.switch_wrap.thick .switch {
    width: 65px;
    height: 30px;
    border-radius: 30px;
}

.switch_wrap.thick .switch::after {
    width: 80px;
}

.switch_wrap.thick .switch::before,
.switch_wrap.thick .switch::after {
    right: 4px;
    top: 4px;
}

.switch_wrap.thick .switch .bullet {
    height: 28px;
    width: 28px;
}

.switch_wrap.thick input[type="checkbox"]:checked + .switch .bullet {
    left: -36px;
}

.switch_wrap .switch .bullet {
    position: relative;
    display: block;
    width: 22px;
    height: 22px;
    top: 1px;
    left: -1px;
    background-color: #FFFFFF;
    border-radius: 50%;
    -webkit-transition: left 0.25s linear;
    -moz-transition: left 0.25s linear;
    -ms-transition: left 0.25s linear;
    -o-transition: left 0.25s linear;
    transition: left 0.25s linear;
}

.switch_wrap .switch .bullet::before,
.switch_wrap .switch .bullet::after {
    display: block;
    height: 15px;
    width: 3px;
    position: absolute;
    top: 5px;
    left: 50%;
    margin-left: -6px;
    border: 1px solid #cccccc;
    border-width: 0 1px;
    -webkit-box-shadow: 1px 0 0 white, 1px 0 0 white inset;
    box-shadow: 1px 0 0 white, 1px 0 0 white inset;
}

.switch_wrap .switch .bullet::after {
    margin-left: 2px;
}

.guide.new {
    background: #52b266;
    color: #FFFFFF;
    padding: 3px 8px;
    border: 2px solid #FFF;
    font-size: 12px;
    border-radius: 3px;
    width: 45px;
    display: inline-block;
}

.fa {
    font-family: FontAwesome, Nachlieli, Arial, Tahoma;
    font-size: 18px;
    font-style: normal;
    font-weight: normal;
    left: 0;
    padding-right: 0.5em;
    position: relative;
    text-decoration: inherit;
    top: 10px;
}

.fa.clear {
    top: 0;
    padding: 0;
    margin: 0 5px;
}

.fa.big {
    font-size: 21px;
}

.fa.star:before {
    content: "\f005";
}

.fa.bell:before {
    content: "\f0f3";
}

.fa.heart:before {
    content: "\f004";
}

.fa.bars:before {
    content: "\f0c9";
}

.fa.backward:before {
    content: "\f04a";
}

.fa.lightbulb:before {
    content: "\f0eb";
}

.fa.asterisk:before {
    content: "\f069";
}

.fa.logo-img:before {
    content: "\f1a5";
}

.fa.external-link:before {
    content: "\f08e";
}

.fa.sort-down:before {
    content: "\f0dd";
}

.fa.left:before {
    content: "\f053";
}

.fa.right:before {
    content: "\f054";
}

.fa.a-left:before {
    content: "\f104";
}

.fa.a-right:before {
    content: "\f105";
}

.fa.a-up:before {
    content: "\f106";
}

.fa.a-down:before {
    content: "\f107";
}

.fa.clock:before {
    content: "\f017";
}

.fa.file-upload:before {
    content: "\f0ee";
}

.fa.filter:before,
.fa.sort:before {
    content: "\f0b0";
}

.fa.sort-amount:before {
    content: "\f160";
}

.fa.list-ul:before {
    content: "\f0ca";
}

.fa.camera:before {
    content: "\f030";
}

.fa.font:before {
    content: "\f031";
}

.fa.home:before {
    content: "\f015";
}

.fa.download:before {
    content: "\f0e2";
}

.fa.paypal:before {
    content: "\f1ed";
}

.fa.cal:before {
    content: "\f073";
}

.fa.cal-check:before {
    content: "\f274";
}

.fa.plus-circle:before {
    content: "\f055";
}

.fa.plus:before {
    content: "\f067";
}

.fa.list:before {
    content: "\f0ca";
}

.fa.user-plus:before {
    content: "\f234";
}

.fa.saving:before {
    content: "\f0c7";
}

.fa.cal-empty:before {
    content: "\f133";
}

.fa.power-off:before {
    content: "\f011";
}

.fa.picture:before {
    content: "\f03e";
}

.fa.fork:before {
    content: "\f126";
}

.fa.crop:before {
    content: "\f125";
}

.fa.copy:before {
    content: "\f0c5";
}

.fa.clone:before {
    content: "\f24d";
}

.fa.paste:before {
    content: "\f0ea";
}

.fa.pencil:before {
    content: "\f040";
}

.fa.question:before, .fa.help:before {
    content: "\f059";
}

.fa.exclamation-triangle:before {
    content: "\f071";
}

.fa.location:before {
    content: "\f041";
}

.fa.backwoard:before {
    content: "\f049";
}

.fa.stop:before {
    content: "\f04d";
}

.fa.envelope:before {
    content: "\f003";
}

.fa.envelope-black:before {
    content: "\f0e0";
}

.fa.twitter:before {
    content: "\f099";
}

.fa.facebook:before {
    content: "\f09a";
}

.fa.facebook-official:before {
    content: "\f230";
}

.fa.question-circle:before {
    content: "\f059";
}

.fa.facebook-share:before {
    content: "\f1e0";
}

.fa.whatsapp:before {
    content: "\f232";
}

.fa.youtube:before {
    content: "\f167";
}

.fa.instagram:before {
    content: "\f16D";
}

.fa.other:before {
    content: "\f003";
}

.fa.linkedin:before {
    content: "\f0e1";
}

.fa.fa-quote-left:before {
    content: "\f10d";
}

.fa.globe:before {
    content: "\f0ac";
}

.fa.fa-quote-right:before {
    content: "\f10e";
}

.fa.long-arrow-left:before {
    content: "\f177";
}

.fa.chain-broken:before {
    content: "\f127";
}

.fa.user:before {
    content: "\f007";
}

.fa.close-icon:before {
    content: "\f057";
}

.fa.x-close:before {
    content: "\f00d";
}

.fa.share:before {
    content: "\f1e0";
}

.fa.users:before {
    content: "\f0c0";
}

.fa.pause:before {
    content: "\f04c";
}

.fa.play:before {
    content: "\f04b";
}

.fa.sync:before {
    content: "\f021";
}

.fa.phone:before {
    content: "\f095";
}

.fa.phone-sq:before {
    content: "\f098";
}

.fa.campaign:before {
    content: "\f02c";
}

.fa.preview:before {
    content: "\f06e";
}

.fa.eye-slash:before {
    content: "\f070";
}

.fa.link:before {
    content: "\f0c1";
}

.fa.mail:before {
    content: "\f183";
}

.fa.femail:before {
    content: "\f182";
}

.fa.loc:before {
    content: "\f124";
}

.fa.pencil:before {
    content: "\f040";
}

.fa.pencil-sq:before {
    content: "\f044";
}

.fa.chart:before {
    content: "\f201";
}

.fa.line-chart:before {
    content: "\f201";
}

.fa.facebook:before {
    content: "\f09a";
}

.fa.email:before {
    content: "\f003";
}

.fa.like:before {
    content: "\f087";
}

.fa.note:before {
    content: "\f15b";
}

.fa.click:before {
    content: "\f090";
}

.fa.setting:before {
    content: "\f013";
}

.fa.fa-send-o:before {
    content: "\f1d9";
}

.fa.fa-send:before {
    content: "\f1d8";
}

.fa.check:before {
    content: "\f00c";
}

.fa.check-sq:before {
    content: "\f046";
}

.fa.question:before {
    content: "\f059";
}

.fa.info:before {
    content: "\f05a";
}

.fa.info-circ:before {
    content: "\f05a";
}

.fa.comments:before {
    content: "\f0f6";
}

.fa.gift:before {
    content: "\f06b";
}

.fa.search:before {
    content: "\f002  חפש לקוח...";
}

.fa.theme:before {
    content: "\f002  הכנס מוטיב...";
}

.fa.trash:before {
    content: "\f014";
}

.fa.ban:before {
    content: "\f05e";
}

.fa.level-up:before {
    content: "\f148";
}

.fa.badge:before {
    content: "\f0a3";
}

.fa.building:before {
    content: "\f0f7";
}

.fa.move:before {
    content: "\f047";
}

.fa.remove:before {
    content: "\f00d";
}

.fa.heart:before {
    content: "\f004";
}

.fa.campaign:before {
    content: "\f02b";
}

.fa.tag:before {
    content: "\f02b";
}

.fa.rotate-left:before {
    content: "\f0e2";
}

.fa.rotate-right:before {
    content: "\f01e";
}

.fa.arrow-right:before {
    content: "\f061";
}

.fa.arrow-left:before {
    content: "\f060";
}

.fa.arrows:before {
    content: "\f07e";
}

.fa.arrows-v:before {
    content: "\f07d";
}


.fa.html-page:before {
    content: "\f1c9";
}

.fa.birthday-cake:before {
    content: '\f1fd';
}

.fa.barcode:before {
    content: "\f02a";
}

.fa.bar-chart:before {
    content: "\f080";
}

.fa.money:before {
    content: "\f0d6";
}

.fa.align-center:before {
    content: "\f037";
}

.fa.align-justify:before {
    content: "\f039";
}

.fa.align-left:before {
    content: "\f036";
}

.fa.align-right:before {
    content: "\f038";
}

.fa.italic:before {
    content: "\f033";
}

.fa.bold:before {
    content: "\f032";
}

.fa.arrow-circle-left:before {
    content: "\f0a8";
}

.fa.upload:before {
    content: "\f093";
}

.fa.lock:before {
    content: "\f023";
}

.fa.sms:before {
    content: "\f075";
}

.fa.sms-o:before {
    content: "\f086";
}

.fa.htmladd:before {
    content: "HTML";
}

.fa.search-plus:before {
    content: "\f00e";
}

.fa.search-minus:before {
    content: "\f010";
}

.fa.plus:before {
    content: "\f067";
}

.fa.minus:before {
    content: "\f068";
}

.fa.desktop:before {
    content: "\f108";
}

.fa.laptop:before {
    content: "\f109";
}

.fa.mobile:before {
    content: "\f10b";
}

.fa.switch-off:before {
    content: "\f106";
}

.fa.switch-on:before {
    content: "\f107";
}

.fa.twitter:before {
    content: "\f099";
}

.fa.linkedin:before {
    content: "\f08c";
}

.fa.google-plus:before {
    content: "\f0d5";
}

.white {
    color: white;
}

.typeahead,
.tt-query,
.tt-hint {
    width: 100%;
    height: 30px;
    padding: 8px 12px;
    font-size: 24px;
    line-height: 30px;
    border: 2px solid #ccc;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    outline: none;
}

.tt-menu {
    width: 100%;
}

.typeahead {
    background-color: #fff;
}

.typeahead:focus {
    border: 2px solid #0097cf;
}

.tt-query {
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}

.tt-hint {
    color: #999
}

.tt-dropdown-menu, .tt-dataset.tt-dataset-list {
    height: 100%;
    width: 100%;
    margin-top: 5px;
    padding: 10px 4px 20px;
    background-color: #fff;
    border: 1px solid #ccc;
    border: 1px solid rgba(0, 0, 0, 0.2);
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 3px;
    -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
    -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, .2);
}

.tt-suggestion {
    display: block;
    padding: 3px 20px;
    font-size: 18px;
    line-height: 24px;
    width: 100%;
    cursor: pointer;
    height: 30px;
    color: #666666;
}

.tt-suggestion strong {

}

.tt-suggestion:hover, .tt-suggestion.tt-cursor {
    color: #fff;
    background-color: rgba(78, 143, 199, 1);
    height: 30px;
}

.tt-dataset-list {
    height: 24px;
}

.tt-suggestion p {
    margin: 0;
    display: block;
    height: 24px;
}

/* search tophead bootstrap copy*/

.dropdown-menu.pull-right {
    left: auto;
    right: 0;
}

.dropdown-menu .divider {
    background-color: #E5E5E5;
    height: 1px;
    margin: 9px 0;
    overflow: hidden;
}

.dropdown-menu > li > a {
    clear: both;
    color: #333333;
    display: block;
    font-weight: normal;
    line-height: 1.42857;
    padding: 3px 20px;
    white-space: nowrap;
}

.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {
    background-color: #F5F5F5;
    color: #262626;
    text-decoration: none;
}

.dropdown-menu > .active > a, .dropdown-menu > .active > a:hover, .dropdown-menu > .active > a:focus {
    background-color: #428BCA;
    color: #FFFFFF;
    outline: 0 none;
    text-decoration: none;
}

.dropdown-menu > .disabled > a, .dropdown-menu > .disabled > a:hover, .dropdown-menu > .disabled > a:focus {
    color: #999999;
}

.dropdown-menu > .disabled > a:hover, .dropdown-menu > .disabled > a:focus {
    background-color: transparent;
    background-image: none;
    cursor: not-allowed;
    text-decoration: none;
}

.open > .dropdown-menu {
    display: block;
}

.open > a {
    outline: 0 none;
}

.dropdown-header {
    color: #999999;
    display: block;
    font-size: 12px;
    line-height: 1.42857;
    padding: 3px 20px;
}

.dropdown-backdrop {
    bottom: 0;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 990;
}

.pull-right > .dropdown-menu {
    left: auto;
    right: 0;
}

.customers .dropdown-button {
    position: absolute;
    top: -60px;
    right: 0px;
    width: 160px;
    z-index: 100;
}

.customers .dropdown-button span.fa {
    top: 3px;
    padding: 0;
    float: left;
    font-size: 12px;
    margin-left: -11px;

}

.dropdown-toggle span.fa {
    top: -3px;
    padding: 0;
    margin: 0 12px;
    font-size: 13px;
    float: none;
}

.customers .dropdown-menu.sub {
    right: 156px;
    top: 0px;
}

.customers .dropdown-menu.sub {

}

.customers .dropdown-menu.sub > li > a {

}

/* search */
.search {
    position: relative;
}

.search > span.fa {
    color: #CDCDCD;
    font-size: 17px;
    position: absolute;
    right: 1px;
    top: 11px;
    width: auto;
}

.search ul.dropdown-menu {
    right: 0;
    min-width: 225px;
}

.search ul.dropdown-menu li {
    font-size: 18px;
    width: 100%;
}

.search .dropdown-menu > .active > a, .search .dropdown-menu > .active > a:hover, .search .dropdown-menu > .active > a:focus {
    background-color: lightblue;
    color: #333333;
}

.search .dropdown-menu {
    background-clip: padding-box;
    background-color: #FFFFFF;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 4px 4px 4px 4px;
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.176);
    display: none;
    float: left;
    font-size: 14px;
    left: 0;
    list-style: none outside none;
    margin: 2px 0 0;
    min-width: 160px;
    padding: 5px 0;
    position: absolute;
    top: 100%;
    z-index: 1000;
}

/* feed */
.feed .dash-icon {
    background-position: -11px -185px;
    height: 24px;
    margin-left: 5px;
    width: 29px;
}

.feed .header {
    padding: 0 0 17px;
    font-weight: bold;
}

.feed ul {
    padding: 10px 0;
}

.feed-item {
    border-bottom: 1px solid #E9E9E9;
    padding: 15px 0;
    position: relative;
}

.feed-item .details {
    display: inline-block;
    width: 85%;
}

.feed-item .message {
    margin-bottom: 2px;
}

.feed-item .date {
    color: #969696;
    font-style: italic;
}

.feed .icon {
    display: inline-block;
    height: 30px;
    width: 37px;
    vertical-align: top;
}

.feed .icon.x {
    left: 12px;
    position: absolute;
    top: 10px;
    height: 10px;
    width: 10px;
}

.icon.customer-join {
    background-position: -76px -77px;
    height: 32px;
    width: 32px;
}

.icon.page-visit {
    background-position: -145px -143px;
    width: 39px;
}

.icon.campaign-birthday {
    background-position: -145px -105px;
    width: 39px;
}

.icon.campaign-anniverssary {
    background-position: -145px -71px;
    width: 39px;
}

.icon.campaign-published {
    background-position: -145px -6px;
    width: 39px;
}

.icon.content-published {
    background-position: -185px -37px;
    width: 39px;
}

.icon.feed-internal {
    background-position: -145px -42px;
    width: 39px;
}

.icon.customer-email-open {
    background-position: -107px -144px;
}

.icon.customer-join-sent {
    background-position: -107px -106px;
}

.icon.customer-join-sms {
    background-position: -107px -71px;
}

.icon.customer-added {
    background-position: -107px -40px;
}

.icon.customer-updated {
    background-position: -187px -75px;
}

.icon.sms-sent {
    background-position: -185px -143px;
    width: 39px;
}

.icon.google-import {
    background-position: -185px -107px;
    width: 39px;
}

.icon.user-update {
    background-position: -146px -43px;
    width: 39px;
}

/* bootstrap ui */

.tooltip {
    position: absolute;
    z-index: 1030;
    display: block;
    font-size: 12px;
    line-height: 1.4;
    opacity: 0;
    filter: alpha(opacity=0);
    visibility: visible
}

.tooltip.in {
    opacity: .9;
    filter: alpha(opacity=90)
}

.tooltip.top {
    padding: 5px 0;
    margin-top: -3px
}

.tooltip.right {
    padding: 0 5px;
    margin-left: 3px
}

.tooltip.bottom {
    padding: 5px 0;
    margin-top: 3px
}

.tooltip.left {
    padding: 0 5px;
    margin-left: -3px;
    direction: rtl;
}

.cust.tooltip {
}

.cust.tooltip.bottom .tooltip-arrow {
    top: -8px;
    left: 80%;
    margin-left: -16px;
    border-bottom-color: #FFFFFF;
    border-width: 0 15px 15px;
}

.cust.tooltip.bottom .tooltip-arrow.border {
    top: -11px;
    border-bottom-color: #dddddd;
}

.cust .tooltip-inner {
    background: #FFFFFF;
    color: inherit;
    box-shadow: 1px 1px 3px 1px #999999;
    padding: 40px 50px;
}

.modal-open {
    overflow: hidden
}

.modal {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1040;
    display: none;
    overflow: auto;
    overflow-y: hidden;
}

.modal.fade .modal-dialog {
    -webkit-transform: translate(0, -25%);
    -ms-transform: translate(0, -25%);
    transform: translate(0, -25%);
    -webkit-transition: -webkit-transform .3s ease-out;
    -moz-transition: -moz-transform .3s ease-out;
    -o-transition: -o-transform .3s ease-out;
    transition: transform .3s ease-out
}

.modal.in .modal-dialog {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    transform: translate(0, 0)
}

.modal-dialog {
    position: relative;
    z-index: 1050;
    width: auto;
    margin: 10px
}

.modal-content {
    position: relative;
    background-color: #fff;
    border: 1px solid #999;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 6px;
    outline: 0;
    -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
    box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
    background-clip: padding-box
}

.modal-backdrop {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1030;
    background-color: #000
}

.modal-backdrop.fade {
    opacity: 0;
    filter: alpha(opacity=0)
}

.modal-backdrop.in {
    opacity: .5;
    filter: alpha(opacity=50)
}

.modal-header {
    min-height: 16.428571429px;
    padding: 15px;
    border-bottom: 1px solid #e5e5e5
}

.modal-header .close {
    margin-top: -2px
}

.modal-title {
    margin: 0;
    line-height: 1.428571429
}

.modal-body {
    position: relative;
    padding: 20px
}

.modal-footer {
    padding: 19px 20px 20px;
    margin-top: 15px;
    text-align: right;
    border-top: 1px solid #e5e5e5
}

.modal-footer:before, .modal-footer:after {
    display: table;
    content: " "
}

.modal-footer:after {
    clear: both
}

.modal-footer:before, .modal-footer:after {
    display: table;
    content: " "
}

.modal-footer:after {
    clear: both
}

.modal-footer .btn + .btn {
    margin-bottom: 0;
    margin-left: 5px
}

.modal-footer .btn-group .btn + .btn {
    margin-left: -1px
}

.modal-footer .btn-block + .btn-block {
    margin-left: 0
}

@media screen and (min-width: 768px) {
    .modal-dialog {
        width: 600px;
        margin: 30px auto
    }

    .modal-content {
        -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5)
    }
}

.tooltip-inner {
    background-color: #1f2532;
    border-radius: 4px 4px 4px 4px;
    color: #FFFFFF;
    max-width: 250px;
    padding: 10px 17px 15px;
    text-align: right;
    text-decoration: none;
    font-size: 14px;
    opacity: 0.9;
}

.tooltip-arrow {
    position: absolute;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid
}

.tooltip.top .tooltip-arrow {
    bottom: 0;
    left: 50%;
    margin-left: -5px;
    border-top-color: #000;
    border-width: 5px 5px 0
}

.tooltip.top-left .tooltip-arrow {
    bottom: 0;
    left: 5px;
    border-top-color: #000;
    border-width: 5px 5px 0
}

.tooltip.top-right .tooltip-arrow {
    right: 5px;
    bottom: 0;
    border-top-color: #000;
    border-width: 5px 5px 0
}

.tooltip.right .tooltip-arrow {
    top: 50%;
    left: 0;
    margin-top: -5px;
    border-right-color: #000;
    border-width: 5px 5px 5px 0
}

.noCustomers h3 {
    color: salmon;
    margin: 15px;
}

.noCustomers img {
    height: 117px;
    opacity: 0.7;
}

.noCustomers {
    min-height: 310px;
    position: relative;
    text-align: center;
}

.noCustomers .action-button {
    margin: 30px 153px 40px;
    padding: 17px 30px;
    width: 295px;
}

.noCustomers .action-button:disabled {
    background: none repeat scroll 0 0 #FA8072 !important;
    color: white !important;
    opacity: 0.5;
}

.explain-no-customers img.attention {
    float: right;
    margin: 10px 23px;
    height: 40px;
}

.explain-no-customers img {
    height: 120px;
}

.explain-no-customers {
    position: relative;
    margin: 20px 110px 30px;
    height: auto;
}

.explain-no-customers .message {
    width: 700px;
    height: auto;
    padding: 25px 6px 25px 50px;
    border-radius: 3px;
    margin: 10px 0 50px;
    background: #FFF;
    border: 1px solid #e3e3e3;
}

.explain-no-customers img.diagram {
    margin: 5px 162px;
    display: none;
}

.explain-no-customers .divider {

    width: 350px;

    margin: 0 auto;
}

.explain-no-customers .text {
    padding: 10px 93px 15px 5px;
}

.tooltip.left .tooltip-arrow {
    top: 50%;
    right: 0;
    margin-top: -5px;
    border-left-color: #000;
    border-width: 5px 0 5px 5px
}

.tooltip.bottom .tooltip-arrow {
    top: 0;
    left: 50%;
    margin-left: -5px;
    border-bottom-color: #000;
    border-width: 0 5px 5px
}

.tooltip.bottom-left .tooltip-arrow {
    top: 0;
    left: 5px;
    border-bottom-color: #000;
    border-width: 0 5px 5px
}

.tooltip.bottom-right .tooltip-arrow {
    top: 0;
    right: 5px;
    border-bottom-color: #000;
    border-width: 0 5px 5px
}

/* bootstrap pagination */

.pagination {
    display: inline-block;
    padding-left: 0;
    margin: 20px 0;
    border-radius: 4px
}

.pagination > li {
    display: inline
}

.pagination > li > a, .pagination > li > span {
    position: relative;
    float: left;
    padding: 6px 12px;
    margin-left: -1px;
    line-height: 1.428571429;
    text-decoration: none;
    background-color: #fff;
    border: 1px solid #ddd
}

.pagination > li:first-child > a, .pagination > li:first-child > span {
    margin-left: 0;
    border-bottom-left-radius: 4px;
    border-top-left-radius: 4px
}

.pagination > li:last-child > a, .pagination > li:last-child > span {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px
}

.pagination > li > a:hover, .pagination > li > span:hover, .pagination > li > a:focus, .pagination > li > span:focus {
    background-color: #eee
}

.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
    z-index: 2;
    color: #fff;
    cursor: default;
    background-color: #428bca;
    border-color: #428bca
}

.pagination > .disabled > span, .pagination > .disabled > span:hover, .pagination > .disabled > span:focus, .pagination > .disabled > a, .pagination > .disabled > a:hover, .pagination > .disabled > a:focus {
    color: #999;
    cursor: not-allowed;
    background-color: #fff;
    border-color: #ddd
}

.pagination-lg > li > a, .pagination-lg > li > span {
    padding: 10px 16px;
    font-size: 18px
}

.pagination-lg > li:first-child > a, .pagination-lg > li:first-child > span {
    border-bottom-left-radius: 6px;
    border-top-left-radius: 6px
}

.pagination-lg > li:last-child > a, .pagination-lg > li:last-child > span {
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px
}

.pagination-sm > li > a, .pagination-sm > li > span {
    padding: 5px 10px;
    font-size: 12px
}

.pagination-sm > li:first-child > a, .pagination-sm > li:first-child > span {
    border-bottom-left-radius: 3px;
    border-top-left-radius: 3px
}

.pagination-sm > li:last-child > a, .pagination-sm > li:last-child > span {
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px
}

/* */
.dropdown {
    position: relative
}

.dropdown-toggle:focus {
    outline: 0
}

.btn-group, .btn-group-vertical {
    position: relative;
    display: inline-block;
    vertical-align: middle
}

.btn-group > .btn, .btn-group-vertical > .btn {
    position: relative;
    float: left
}

.btn-group > .btn:hover, .btn-group-vertical > .btn:hover, .btn-group > .btn:focus, .btn-group-vertical > .btn:focus, .btn-group > .btn:active, .btn-group-vertical > .btn:active, .btn-group > .btn.active, .btn-group-vertical > .btn.active {
    z-index: 2
}

.btn-group > .btn:focus, .btn-group-vertical > .btn:focus {
    outline: 0
}

.btn-group .btn + .btn, .btn-group .btn + .btn-group, .btn-group .btn-group + .btn, .btn-group .btn-group + .btn-group {
    margin-left: -1px
}

.btn-toolbar {
    margin-left: -5px
}

.btn-toolbar .btn-group, .btn-toolbar .input-group {
    float: left
}

.btn-toolbar > .btn, .btn-toolbar > .btn-group, .btn-toolbar > .input-group {
    margin-left: 5px
}

.btn-group > .btn:not(:first-child):not(:last-child):not(.dropdown-toggle) {
    border-radius: 0
}

.btn-group > .btn:first-child {
    margin-left: 0
}

.btn-group > .btn:first-child:not(:last-child):not(.dropdown-toggle) {
    border-bottom-right-radius: 0;
    border-top-right-radius: 0
}

.btn-group > .btn:last-child:not(:first-child), .btn-group > .dropdown-toggle:not(:first-child) {
    border-bottom-left-radius: 0;
    border-top-left-radius: 0
}

.btn-group > .btn-group {
    float: left
}

.btn-group > .btn-group:not(:first-child):not(:last-child) > .btn {
    border-radius: 0
}

.btn-group > .btn-group:first-child > .btn:last-child, .btn-group > .btn-group:first-child > .dropdown-toggle {
    border-bottom-right-radius: 0;
    border-top-right-radius: 0
}

.btn-group > .btn-group:last-child > .btn:first-child {
    border-bottom-left-radius: 0;
    border-top-left-radius: 0
}

.btn-group .dropdown-toggle:active, .btn-group.open .dropdown-toggle {
    outline: 0
}

.btn-group > .btn + .dropdown-toggle {
    padding-left: 8px;
    padding-right: 8px
}

.btn-group > .btn-lg + .dropdown-toggle {
    padding-left: 12px;
    padding-right: 12px
}

.btn-group.open .dropdown-toggle {
    -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125)
}

.btn-group.open .dropdown-toggle.btn-link {
    -webkit-box-shadow: none;
    box-shadow: none
}

.dropdown-menu {
    position: absolute;
    top: 3px;
    left: 0px;
    z-index: 1;
    display: none;
    float: left;
    min-width: 160px;
    padding: 10px 0px 10px 0px;
    margin: 2px 0 0;
    font-size: inherit;
    list-style: none;
    background-color: #fff;
    border: 1px solid #ccc;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 4px;
    -webkit-box-shadow: 0 2px 3px 0 #e0e0e0;
    box-shadow: 0 2px 3px 0 #e0e0e0;
    background-clip: padding-box;
}

.dropdown-menu.pull-right {
    right: 0;
    left: auto
}

.dropdown-menu .divider {
    height: 1px;
    margin: 9px 0;
    overflow: hidden;
    background-color: #e5e5e5
}

.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {

    text-decoration: none;
    background-color: #f5f5f5
}

.dropdown-menu > .active > a, .dropdown-menu > .active > a:hover, .dropdown-menu > .active > a:focus {

    text-decoration: none;
    background-color: #428bca;
    outline: 0
}

.dropdown-menu > .disabled > a, .dropdown-menu > .disabled > a:hover, .dropdown-menu > .disabled > a:focus {

}

.dropdown-menu > .disabled > a:hover, .dropdown-menu > .disabled > a:focus {
    text-decoration: none;
    cursor: not-allowed;
    background-color: transparent;
    background-image: none;
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false)
}

.open > div > .dropdown-menu {
    display: block
}

.open > a {
    outline: 0
}

.dropdown-header {
    display: block;
    padding: 3px 20px;
    font-size: 12px;
    line-height: 1.428571429;
    color: #999
}

.dropdown-backdrop {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 990
}

.pull-right > .dropdown-menu {
    right: 0;
    left: auto
}

.dropup .caret, .navbar-fixed-bottom .dropdown .caret {
    border-top: 0;
    border-bottom: 4px solid;
    content: ""
}

.dropup .dropdown-menu, .navbar-fixed-bottom .dropdown .dropdown-menu {
    top: auto;
    bottom: 100%;
    margin-bottom: 1px
}

/* popover*/
.popover {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1010;
    display: none;
    max-width: 276px;
    padding: 1px;
    text-align: left;
    white-space: normal;
    background-color: #fff;
    border: 1px solid #ccc;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 6px;
    -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    background-clip: padding-box
}

.popover.top {
    margin-top: -10px
}

.popover.right {
    margin-left: 10px
}

.popover.bottom {
    margin-top: 10px
}

.popover.left {
    margin-left: -10px
}

.popover-title {
    padding: 8px 14px;
    margin: 0;
    font-size: 14px;
    font-weight: normal;
    line-height: 18px;
    background-color: #f7f7f7;
    border-bottom: 1px solid #ebebeb;
    border-radius: 5px 5px 0 0
}

.popover-content {
    padding: 9px 14px
}

.popover .arrow, .popover .arrow:after {
    position: absolute;
    display: block;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid
}

.popover .arrow {
    border-width: 11px
}

.popover .arrow:after {
    border-width: 10px;
    content: ""
}

.popover.top .arrow {
    bottom: -11px;
    left: 50%;
    margin-left: -11px;
    border-top-color: #999;
    border-top-color: rgba(0, 0, 0, 0.25);
    border-bottom-width: 0
}

.popover.top .arrow:after {
    bottom: 1px;
    margin-left: -10px;
    border-top-color: #fff;
    border-bottom-width: 0;
    content: " "
}

.popover.right .arrow {
    top: 50%;
    left: -11px;
    margin-top: -11px;
    border-right-color: #999;
    border-right-color: rgba(0, 0, 0, 0.25);
    border-left-width: 0
}

.popover.right .arrow:after {
    bottom: -10px;
    left: 1px;
    border-right-color: #fff;
    border-left-width: 0;
    content: " "
}

.popover.bottom .arrow {
    top: -11px;
    left: 50%;
    margin-left: -11px;
    border-bottom-color: #999;
    border-bottom-color: rgba(0, 0, 0, 0.25);
    border-top-width: 0
}

.popover.bottom .arrow:after {
    top: 1px;
    margin-left: -10px;
    border-bottom-color: #fff;
    border-top-width: 0;
    content: " "
}

.popover.left .arrow {
    top: 50%;
    right: -11px;
    margin-top: -11px;
    border-left-color: #999;
    border-left-color: rgba(0, 0, 0, 0.25);
    border-right-width: 0
}

.popover.left .arrow:after {
    right: 1px;
    bottom: -10px;
    border-left-color: #fff;
    border-right-width: 0;
    content: " "
}

@-webkit-keyframes progress-bar-stripes {
    from {
        background-position: 40px 0
    }
    to {
        background-position: 0 0
    }
}

@keyframes progress-bar-stripes {
    from {
        background-position: 40px 0
    }
    to {
        background-position: 0 0
    }
}

.progress {
    height: 25px;
    margin-bottom: 20px;
    overflow: hidden;
    background-color: #f5f5f5;
    border-radius: 5px;
    -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
    border: 1px solid #dedede;
}

.progress-bar {
    float: right;
    width: 0;
    height: 100%;
    font-size: 12px;
    line-height: 20px;
    color: #fff;
    text-align: center;
    background-color: rgba(171, 171, 171, 0.45);
    -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
    -webkit-transition: width .6s ease;
    transition: width .8s ease
}

.progress-striped .progress-bar {
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-size: 40px 40px
}

.progress.active .progress-bar {
    -webkit-animation: progress-bar-stripes 2s linear infinite;
    animation: progress-bar-stripes 2s linear infinite
}

.progress-bar-success {
    background-color: #5cb85c
}

.progress-striped .progress-bar-success {
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent)
}

.progress-bar-info {
    background-color: #5bc0de
}

.progress-striped .progress-bar-info {
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent)
}

.progress-bar-warning {
    background-color: #f0ad4e
}

.progress-striped .progress-bar-warning {
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent)
}

.progress-bar-danger {
    background-color: #d9534f
}

.progress-striped .progress-bar-danger {
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent)
}

.collapse {
    display: none
}

.collapse.in {
    display: block
}

.collapsing {
    position: relative;
    height: 0;
    overflow: hidden;
    -webkit-transition: height .35s ease;
    transition: height .35s ease
}

/* Google places api*/
.pac-item {
    text-align: right;
}

.pac-item-query {
    margin-left: 5px;
}

/* file upload */
.upload {
    margin: 12px 0;
    vertical-align: top;
    width: 290px;
}

.upload .file-choose {
    font-size: 13px;
    font-weight: bolder;
    padding: 3px 0;
    position: absolute;
    right: 3px;
    text-align: center;
    top: 4px;
    width: 83px;
    z-index: 1;
}

.upload .submit {
    font-size: 14px;
    padding: 4px;
    width: 88px;
}

.upload .loader {
    position: absolute;
    right: 85px;
    top: 52px;
}

.upload .loader {
    right: 100px;
    bottom: 22px;
}

.upload .file-choose-fake {
    color: #636363;
    direction: ltr;
    font-style: italic;
    position: absolute;
    text-indent: 6px;
    top: 0;
    z-index: 0;
}

.pop-up.facebook_pages {
    height: auto;
    margin-right: -230px;
    top: 121px;
    width: 460px;
    min-height: 200px;
    border: 3px solid #EEEEEE;
}

.pop-up.facebook_pages .title {
    border-radius: 0;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    margin-bottom: 10px;
}

.connect .facebook span {
    margin-left: 13px;
    vertical-align: sub;
    color: #3b5998;
}

.facebook .attention {
    font-size: 15px;
    background: rgb(249, 226, 186);
    padding: 10px 20px 20px;
    border-radius: 5px;
    width: 430px;
    margin-top: 10px;
}

.facebook .attention .fa.info {
    font-size: 25px;
    margin: 0;
    padding: 0;
    top: 0;
    display: inline-block;
    margin-left: 10px;
}

.facebook .connected-page > div {
    vertical-align: 30px;
    padding: 10px 20px;
    color: #FFFFFF;
    font-size: 21px;
    text-shadow: 1px 1px #666;
}

.facebook .connected-page > img {
    height: 70px;
    border-radius: 10px;
}

.facebook .connected-page {
    padding: 11px 10px 5px;
    border-radius: 10px;
    background: rgba(59, 89, 152, 0.73);
    margin-top: 10px;
}

.facebook .connected-page * {
    display: inline-block;
}

.connect .facebook a {
    vertical-align: bottom;
}

.facebook_pages ul li {
    background: none repeat scroll 0 0 rgba(178, 182, 201, 0.14);
    border: 1px solid #DDDDDD;
    border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    cursor: pointer;
    height: auto;
    margin: 5px 10px;
    padding: 10px;
    text-align: right;
    width: 330px;
}

.facebook_pages ul li:hover {
    background: none repeat scroll 0 0 #CCCCCC;
}

.facebook_pages ul li img {
    height: 40px;
    margin: 0;
}

.facebook_pages ul li h3 {
    color: #333333;
    font-size: 15px;
    height: auto;
    vertical-align: top;
    width: 250px;
    margin-right: 6px;
}

.facebook_pages .fb-action {
    padding: 35px 51px 70px;
}

.facebook_pages .page-loader {
    top: 45%;
}

.sms-sending > div > .container {
    width: 850px;
    margin: auto;
    position: relative;
    height: 600px;
    display: block;
}

.pop-up.sms-send {
    margin-right: -500px;
    width: 100px;
    height: 80px;
    position: relative;
    top: 0px;
    padding: 10px 40px;
}

.pop-up.sms-send .send-confirm {
    height: 100%;
    width: 100%;
    background: rgba(255, 255, 255, 0.91);
    padding: 70px;
    text-align: center;
}

.pop-up.sms-send .send-confirm .diagram {
    border-radius: 50%;
    border: 3px solid #4e8fc7;
    width: 100px;
    height: 100px;
    margin: auto;
    color: #4e8fc7;
    padding: 21px;
}

.pop-up.sms-send .send-confirm .diagram .fa {
    font-size: 50px;
}

.pop-up.sms-send .send-confirm .text {
    margin-top: 30px;
    text-align: center;
}

.pop-up.sms-send .send-confirm .text span {
    font-weight: bold;
}

.pop-up.sms-send .comment div {
    opacity: 0.8;
    vertical-align: 1px;
}

.pop-up.sms-send .send-confirm .actions {
}

.pop-up.sms-send .close-modal {
    margin-top: -10px;
}

.pop-up.sms-send input[type=radio] {
    height: 21px;
    width: 21px;
}

.pop-up.sms-send .sender {
    width: 530px;
}

.pop-up.sms-send.thin .sender {
    width: 390px;
}

.pop-up.sms-send.thin.open {
    width: 850px;
    margin-right: -425px;
}

.pop-up.sms-send.open {
    width: 1000px;
    height: 560px;
}

.pop-up.sms-send select {
    padding: 7px;
    font-size: 16px;
    color: #999999;
}

.pop-up.sms-send .title span {

}

.pop-up.sms-send .title {
    border-radius: 3px;
    width: auto;
    background: #FFF;
    border-bottom: 1px solid #ddd;
    text-align: center;
    padding: 19px 0 20px;
}

.pop-up.sms-send .note {
    margin-top: 25px;
    min-height: 20px;
}

.pop-up.sms-send textarea, .pop-up.sms-send .actions button {
    width: 350px;
}

.pop-up.sms-send textarea {
    text-indent: 0;
    border: 1px solid rgba(221, 221, 221, 0.5);
    height: 150px;
    padding: 17px;
    font-size: 17px;
    width: 100%;
    background: rgba(239, 239, 239, 0.8);
    margin-top: 5px;
}

.pop-up.sms-send .note {
    margin-top: 25px;
    min-height: 20px;
    font-size: 15px;
}

.pop-up.sms-send .actions button {
    margin-top: 20px;
    width: 200px;
}

.pop-up.sms-send .actions button.cancel {
    width: 150px;
    margin-right: 10px;
}

.pop-up.sms-send .actions button:disabled {
    cursor: not-allowed;
}

.pop-up.sms-send .actions .comment > * {
    display: inline-block;
}

.pop-up.sms-send .actions .comment {
    display: block;
    margin-top: 30px;
    font-size: 15px;
}

.pop-up.sms-send .actions .comment > div {
    width: 380px;
    opacity: 0.7;
}

.pop-up.sms-send .actions .comment > div.highlight {
    opacity: 1;
}

.pop-up.sms-send .actions .comment span.fa {
    font-size: 26px;
    top: -5px;
    display: inline-block;
    height: 20px;
    padding: 0;
    margin-left: 4px;
}

.pop-up.sms-send textarea, .pop-up.sms-send .actions button {
}

.pop-up.sms-send #textarea_feedback {
    float: left;
    font-size: 15px;
    padding: 7px 14px 5px;
    background: #eee;
    border-radius: 3px;
    font-size: 14px;
}

.pop-up.sms-send .remove-link {

}

.pop-up.sms-send .remove-link .text {
    font-size: 14px;
    color: #52b266;
    text-align: justify;
    margin-top: 10px;
}

.pop-up.sms-send .remove-link * {
    display: inline-block
}

.pop-up.sms-send .remove-link input {
    width: 19px;
    height: 19px;
    vertical-align: middle;
    margin-left: 2px;
}

.pop-up.sms-send .remove-link input[type="checkbox"]:disabled {
    cursor: not-allowed;
}

.pop-up.sms-send .remove-link .bc-tooltip {
    width: 200px;
    hight: 100px;
    background: rgba(0, 0, 0, 0.7);
    position: absolute;
    right: -180px;
    padding: 10px;
    color: #FFFFFF;
    top: 170px;
}

.pop-up.sms-send .remove-link span {
    top: 2px;
    padding: 0;
    margin: 0 5px;
    color: #666;
    font-size: 21px;
}

.pop-up.sms-send textarea.empty {
    border: 1px solid rgba(255, 51, 102, 0.47);
}

.pop-up.sms-send textarea:-moz-placeholder {
    font-style: italic;
    font-weight: normal;
}

.pop-up.sms-send .to-edit {
    padding: 120px 30px;
    width: 380px;
    height: 129px;
    display: inline-block;
    margin: 30px;
}

.pop-up.sms-send textarea::-webkit-input-placeholder {
    font-family: Arial;
    font-weight: normal;
}

.pop-up.sms-send .ofv-values {
    border: 1px solid lightBlue;
    color: #999999;
    display: none;
    height: 173px;
    margin-right: 40px;
    margin-top: 49px;
    overflow-y: scroll;
    vertical-align: top;
    width: 350px;
}

.pop-up.sms-send ul.picks li {
    border-bottom: 1px dotted lightBlue;
    font-family: arial;
    font-size: 12px;
    padding: 10px 9px;
    width: 333px;
}

.pop-up.sms-send ul.picks li:hover {
    background: none repeat scroll 0% 0% lightblue;
    cursor: pointer;
    font-weight: bold;
}

.pop-up.sms-send .nav a {
    font-size: 15px;
    padding: 10px 7px;
}

.pop-up.sms-send .actions input {
    margin: 20px 0 30px;
}

.pop-up.sms-send .sms-tabs, .pop-up.sms-send form {
    display: inline-block;
    padding: 7px 0px 7px;
}

.pop-up.sms-send .textarea-wrapper {
    margin-top: 20px;
}

.pop-up.sms-send .textarea-wrapper * {
    display: inline-block;
}

.custom-scroll::-webkit-scrollbar {
    width: 12px;
}

.custom-scroll::-webkit-scrollbar-thumb, .sms-tabs ul.suggest::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 1px rgba(202, 202, 202, 0.90);
    background-color: #dfdfdf;
}

.groups ul::-webkit-scrollbar, .sms-tabs ul.suggest::-webkit-scrollbar {
    width: 12px;
}

.groups ul::-webkit-scrollbar-thumb, .sms-tabs ul.suggest::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 1px rgba(202, 202, 202, 0.90);
    background-color: #dfdfdf;
}

.sms-sending .groups.thin {
    right: -291px;
}

.sms-sending .groups {
    background: #FFFFFF;
    margin: 0px 55px -6px 0;
    height: 560px;
    width: 225px;
    padding: 10px 17px;
    right: -358px;
    top: 0px;
    position: absolute;
    border-radius: 5px;
    z-index: 10001;
}

.sms-sending .groups ul {
    padding: 30px 10px;
    overflow-y: scroll;
    height: auto;
    max-height: 450px;
    width: 189px;
    border-radius: 3px;
    overflow-x: hidden;
}

.sms-sending .groups ul.alert {
    border: 1px solid rgba(255, 51, 102, 0.47);
}

.sms-sending .groups ul li {
    height: 42px;
    width: 174px;
    display: inline-block;
    vertical-align: top;
    font-size: 15px;
}

.sms-sending .groups ul li input[type=checkbox] {
    vertical-align: -5px;
    margin-left: 2px;
    color: #333333;
    width: 19px;
    height: 19px;
}

.sms-sending .groups ul li span {
    margin-right: 24px;
    display: inline-block;
    color: #999999;
    font-size: 11px;
    display: block;
    font-style: italic;
}

.sms-sending .groups > span {
    width: 100%;
    text-align: center;
    display: block;
    border-bottom: 1px solid #DDD;
    padding-bottom: 9px;
    font-size: 19px;
    padding: 20px;
}

.sms-sending .groups .no-tags {
    padding: 36px 0 0 0;
    font-size: 15px;
    text-align: center;
    width: 180px;
    margin: auto;
}

.sms-sending .groups .no-tags .fa {
    font-size: 50px;
    color: #DBDADA;
    padding: 0 0;
    text-align: center;
    top: 0;
    margin-bottom: 14px;
    left: 8px;
}

.sms-sending .groups .no-tags .pop-text {
    margin-top: 10px;
}

.sms-sending .groups .no-tags .pop-title {
    color: #333333;
}

.sms-sending .groups .close-it {
    background: none;
    font-family: arial;
    right: 10px;
    top: 10px;
    position: absolute;
    cursor: pointer;
}

.sms-tabs .fa.clock {

}

.pop-up.sms-send .sms-tabs {
    height: 350px;
    vertical-align: top;
    width: 351px;
    position: absolute;
    left: 0;
    top: 11px;
}

.sms-tabs .tab-container {

}

.sms-tabs ul.suggest {
    padding: 20px 0px;
    position: absolute;
    width: 100%;
    height: 100%;
    overflow-y: scroll;
    overflow-x: hidden;
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    border-left: 1px solid #ddd;
}

.sms-tabs ul.suggest > li {
    font-size: 14px;
    cursor: pointer;
    border-bottom: 1px dotted #eee;
    padding: 10px 10px;
}

.sms-tabs ul.suggest.history > li {
    padding: 10px 20px;
    margin-right: 4px;
    width: 330px;
}

.sms-tabs ul.suggest > li:hover {
    background: lightblue;
}

.sms-tabs ul.suggest > li .sent {
    color: #c9c9c9;
    font-size: 13px;
    margin-top: 5px;
}

.no-sms {
    color: #CCCCCC;
    position: absolute;
    right: 73px;
    text-align: center;
    text-shadow: 0px 1px 0 #999999;
    top: 50px;
    font-size: 20px;
}

.sms-help.three {
    width: 229px;
    top: 100px;
    right: 800px;
    background-position: 606px 0px;
    height: 188px;
}

.sms-help.two {
    width: 195px;
    top: 351px;
    right: -199px;
    background-position: -210px 0px;
}

.sms-help.one {
    width: 195px;
    top: -3px;
    right: -209px;
    background-position: -410px 0px;
}

.sms-help {
    background-image: url('https://b105ff616ffabf542041-4bd9cbd7c940079c5eb5fd18e93586b2.ssl.cf2.rackcdn.com/sms-help-arrows.2.png');
    position: absolute;
    height: 188px;
    z-index: 1051;
}

.sms-no-cust {
    position: absolute;
    padding: 0px 80px 0 0;
    width: 440px;
    font-size: 15px;
    line-height: 21px;
    right: 0;
    top: 338px;
}

.nav {
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
}

.nav:before, .nav:after {
    display: table;
    content: " "
}

.nav:after {
    clear: both
}

.nav:before, .nav:after {
    display: table;
    content: " "
}

.nav:after {
    clear: both
}

.nav > li {
    position: relative;
    display: block
}

.nav > li > a {
    position: relative;
    display: block;
    padding: 10px 15px
}

.nav > li > a:hover, .nav > li > a:focus {
    text-decoration: none;
    background-color: #eee
}

.nav > li.disabled > a {
    color: #999
}

.nav > li.disabled > a:hover, .nav > li.disabled > a:focus {
    color: #999;
    text-decoration: none;
    cursor: not-allowed;
    background-color: transparent
}

.nav .open > a, .nav .open > a:hover, .nav .open > a:focus {
    background-color: #eee;
    border-color: #428bca
}

.nav .nav-divider {
    height: 1px;
    margin: 9px 0;
    overflow: hidden;
    background-color: #e5e5e5
}

.nav > li > a > img {
    max-width: none
}

.nav-tabs {
    border-bottom: 1px solid #ddd
}

.nav-tabs > li {
    float: left;
    margin-bottom: -1px
}

.nav-tabs > li > a {
    margin-right: 2px;
    line-height: 1.428571429;
    border: 1px solid transparent;
    border-radius: 3px 3px 0 0
}

.nav-tabs > li > a:hover {
    border-color: #eee #eee #ddd
}

.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
    color: #555;
    cursor: default;
    background-color: #fff;
    border: 1px solid #ddd;
    border-bottom-color: transparent
}

.nav-tabs.nav-justified {
    width: 100%;
    border-bottom: 0
}

.nav-tabs.nav-justified > li {
    float: none
}

.nav-tabs.nav-justified > li > a {
    margin-bottom: 5px;
    text-align: center
}

.nav-tabs.nav-justified > .dropdown .dropdown-menu {
    top: auto;
    left: auto
}


.external .nav {
    position: fixed;
    width: 100%;
    height: 110px;
    z-index: 100;
    top:0;
}

.external .nav.highlight {
    background: #FFFFFF;
    box-shadow: 1px 1px 3px 1px #CCCCCC;
}

.external .nav > div {
    margin-top: 30px;
}

.external .nav .logo {
    background: url(https://b105ff616ffabf542041-4bd9cbd7c940079c5eb5fd18e93586b2.ssl.cf2.rackcdn.com/Logo-sprite.v4.png);
    background-position: 0px -3px;
    height: 52px;
    width: 200px;
    float: left;
    margin-top: -1px;
    cursor: pointer;
}

.external .nav.highlight .logo {
    background-position: 0px -266px;
}

.external .nav.highlight.full .logo{
    background-position: -6px -125px;
}

.external .nav ul {
    margin-right: 170px;
    padding: 20px;
    position: absolute;
    direction: ltr;
}

.external .nav ul > li {
    display: inline-block;
    width: auto;
    margin-left: 30px;
}

.external .nav ul > li a, .nav ul > li span {
    color: white;
}

.external .nav ul > li span{
    vertical-align: -1px;
    font-size: 15px;
    display: inline-block;
}

.external .nav.highlight ul > li a {
    color: #666666;
}


.external .nav ul > li a:hover svg path{
    fill:#4e8fc7;;
}

.external .nav ul.local-icon{
    position: absolute; right: 0; margin-right: 0;padding: 15px 0;
}

.external .nav ul.local-sm{
    margin-right: 0;
    padding: 0;
    right: 0;
    top: 49px;
    border-radius: 5px;
    border: 1px solid #FFFFFF;
}
.external .nav ul.local-sm li:first-child{
    border-bottom: 1px solid #FFFFFF;
}
.external .nav ul.local-sm li a{
    width: 100%;
        padding: 8px 30px;
        display: block;
}
.external .nav ul.local-sm li{
    display: block;
    direction: rtl;
    width: 100%;
    margin-left: 0;
}

.external .nav ul.local-sm li:hover{
    color:#666666;
    background: rgba(255, 255, 238, 0.41);
}

.external .nav button {
    float: right;
}

.external .nav button {
    float: right;
}

@media (min-width: 768px) {
    .nav-tabs.nav-justified > li {
        display: table-cell;
        width: 1%
    }

    .nav-tabs.nav-justified > li > a {
        margin-bottom: 0
    }
}

.nav-tabs.nav-justified > li > a {
    margin-right: 0;
    border-radius: 4px
}

.nav-tabs.nav-justified > .active > a, .nav-tabs.nav-justified > .active > a:hover, .nav-tabs.nav-justified > .active > a:focus {
    border: 1px solid #ddd
}

@media (min-width: 768px) {
    .nav-tabs.nav-justified > li > a {
        border-bottom: 1px solid #ddd;
        border-radius: 4px 4px 0 0
    }

    .nav-tabs.nav-justified > .active > a, .nav-tabs.nav-justified > .active > a:hover, .nav-tabs.nav-justified > .active > a:focus {
        border-bottom-color: #fff
    }
}

.nav-pills > li {
    float: left
}

.nav-pills > li > a {
    border-radius: 4px
}

.nav-pills > li + li {
    margin-left: 2px
}

.nav-pills > li.active > a, .nav-pills > li.active > a:hover, .nav-pills > li.active > a:focus {
    color: #fff;
    background-color: #428bca
}

.nav-stacked > li {
    float: none
}

.nav-stacked > li + li {
    margin-top: 2px;
    margin-left: 0
}

.nav-justified {
    width: 100%
}

.nav-justified > li {
    float: none
}

.nav-justified > li > a {
    margin-bottom: 5px;
    text-align: center
}

.nav-justified > .dropdown .dropdown-menu {
    top: auto;
    left: auto
}

@media (min-width: 768px) {
    .nav-justified > li {
        display: table-cell;
        width: 1%
    }

    .nav-justified > li > a {
        margin-bottom: 0
    }
}

.nav-tabs-justified {
    border-bottom: 0
}

.nav-tabs-justified > li > a {
    margin-right: 0;
    border-radius: 4px
}

.nav-tabs-justified > .active > a, .nav-tabs-justified > .active > a:hover, .nav-tabs-justified > .active > a:focus {
    border: 1px solid #ddd
}

@media (min-width: 768px) {
    .nav-tabs-justified > li > a {
        border-bottom: 1px solid #ddd;
        border-radius: 4px 4px 0 0
    }

    .nav-tabs-justified > .active > a, .nav-tabs-justified > .active > a:hover, .nav-tabs-justified > .active > a:focus {
        border-bottom-color: #fff
    }
}

.tab-content > .tab-pane {
    display: none
}

.tab-content > .active {
    display: block
}

.nav-tabs .dropdown-menu {
    margin-top: -1px;
    border-top-right-radius: 0;
    border-top-left-radius: 0
}

.navbar {
    position: relative;
    min-height: 50px;
    margin-bottom: 20px;
    border: 1px solid transparent
}

.navbar:before, .navbar:after {
    display: table;
    content: " "
}

.navbar:after {
    clear: both
}

.navbar:before, .navbar:after {
    display: table;
    content: " "
}

.navbar:after {
    clear: both
}

@media (min-width: 768px) {
    .navbar {
        border-radius: 4px
    }
}

.navbar-header:before, .navbar-header:after {
    display: table;
    content: " "
}

.navbar-header:after {
    clear: both
}

.navbar-header:before, .navbar-header:after {
    display: table;
    content: " "
}

.navbar-header:after {
    clear: both
}

@media (min-width: 768px) {
    .navbar-header {
        float: left
    }
}

.navbar-collapse {
    max-height: 340px;
    padding-right: 15px;
    padding-left: 15px;
    overflow-x: visible;
    border-top: 1px solid transparent;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    -webkit-overflow-scrolling: touch
}

.navbar-collapse:before, .navbar-collapse:after {
    display: table;
    content: " "
}

.navbar-collapse:after {
    clear: both
}

.navbar-collapse:before, .navbar-collapse:after {
    display: table;
    content: " "
}

.navbar-collapse:after {
    clear: both
}

.navbar-collapse.in {
    overflow-y: auto
}

img.fader {
    border-radius: 5px 5px 5px 5px;
    display: none;
    height: 400px;
    left: 0px;
    position: absolute;
    top: 0px;
    width: 400px;
    z-index: 2;
}

img.fader.show {
    display: block;
    transition: opacity 1000ms ease;
}

img.fader.fadeOut {
    opacity: 0;
}

.pop-up.sms-invite {
    height: 510px;
    margin-right: -380px;
    width: 760px;
    top: 10%;
    border: 5px solid #EEEEEE;
}

.pop-up.sms-invite .title {
    border-radius: 0;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
}

.sms-invite form {
    padding: 45px 30px;
    text-align: center;
    width: 350px;
}

.sms-invite form .text-field {
    margin: 0;
    position: relative;
    vertical-align: top;
    width: 275px;
}

.sms-invite form .name .text-field, .sms-invite form .name .text-field input {
    width: 135px;
}

.sms-invite form .button {
    margin: 10px 0px;
    width: 150px;
}

.sms-invite .smartphone {
    position: absolute;
    top: 10px;
    left: -20px;
}

.sms-invite .smartphone img {
    position: absolute;
    left: 70px;
    top: 70px;
    height: 380px;
}

.sms-invite form textarea {
    border: 1px solid #999999;
    margin: 0;
    padding: 10px 10px 5px 5px;
    text-indent: 1px;
    width: 385px;
    height: 110px;
    font-size: 16px;
    line-height: 22px;
}

.sms-invite form .actions {
    position: relative;
    margin-top: 50px;
    width: 100px;
}

.sms-invite form .actions button {
    width: 180px;
}

.sms-invite form .loader {
    left: -80px;
    position: absolute;
    top: 24px
}

.sms-invite form input,
.sms-invite form .field-error {
    width: 275px;
}

.sms-invite form input {
    font-size: 17px;
    border: 1px solid #999999;
}

.sms-invite .invite-text {
    margin: 0;
    text-align: right;
    width: 300px;
    color: #666666;
    font-weight: 700;
    font-family: arial;
}

.sms-invite form .input-help.right {
    color: #333333;
    left: 380px;
    top: 101px;
}

.sms-invite .sms-display {
    font-size: 11px;
    position: absolute;
    left: 108px;
    top: 171px;
    width: 136px;
    background: white;
    padding: 10px;
    border-bottom: 2px solid #DDDDDD;
    min-height: 30px;
    font-family: arial;
}

.sms-invite .sms-display-name {
    position: absolute;
    left: 105px;
    top: 120px;
    background: #E6E6E6;
    font-size: 12px;
    padding: 1px 3px;
    font-family: arial;
    width: 90px;
    text-align: left;
}

.sms-invite .sms-display a {

}

.sms-invite .comment {
    width: 410px;
    margin-top: 20px;
}

.sms-invite .comment > div {
    width: 380px;
    font-size: 14px;
    color: #999;
}

.sms-invite .comment span.fa {
    font-size: 26px;
    top: -5px;
    display: inline-block;
    height: 20px;
    padding: 0;
    margin-left: 4px;
}

/* */

.tos {
    border-top: 1px solid #DDDDDD;
    padding-top: 30px;
    text-align: left;
    font-size: 13px;
    line-height: 18px;
    color: #999999;
    direction: ltr;
}

.tos a {
    color: #999999;
}

.tos a:hover {
    text-decoration: underline;
}

/* subscription*/

.subscription {
    margin-top: 110px;
    background: #FFFFFF;
    height: 1010px;
}

.subscription .container {
    margin-left: auto;
    margin-right: auto;
}

.subscription .container.payment {
    padding: 0 80px;
    min-height: 670px;
}

.subscription .container:before, .container:after {
    display: table;
    content: "";
}

.subscription .left-content {
    width: 450px;
    float: right;
    margin-left: 20px;
}

.subscription .right-sidebar {
    width: 392px;
    background-color: #fff;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    background-image: -moz-linear-gradient(right, #F3EEE5, #fff);
    background-image: -ms-linear-gradient(right, #F3EEE5, #fff);
    background-image: -webkit-gradient(linear, 100% 0, 0 0, from(#F3EEE5), to(#fff));
    background-image: -webkit-linear-gradient(right, #F3EEE5, #fff);
    background-image: -o-linear-gradient(right, #F3EEE5, #fff);
    background-image: linear-gradient(right, #F3EEE5, #ffffff);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffF3EEE5', endColorstr='#ffffffff', GradientType=1);
    float: right;
    padding: 5px 40px;
    height: 750px;

}

.subscription .sidebar-quote {
    padding: 20px;
    margin-top: 20px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.subscription form input[type=text] {
    border: 1px solid #CCCCCC;
    border-radius: 3px;
    height: 42px;
    width: 285px;
    font-size: 17px;
    color: #999999;
}

.subscription form .short, .subscription form input.short[type=text] {
    width: 120px;
}

.subscription form .medium {
    width: 130px;
}

.subscription form select {
    width: 220px;
    border: 1px solid #CCCCCC;
    border-radius: 3px;
    font-weight: normal;
    background: #FFF;
    font-size: 17px;
}

.subscription form .exp select {
    width: 100px;
    color: #999999;
    padding: 5px 2px;
    height: 42px;
}

.subscription form label {
    font-weight: normal;
    display: block;
    color: #333;
    font-size: 15px;
}

.subscription form .area {
    padding: 20px 40px 25px 0px;
    background: #FBFBFB;
    border-radius: 3px;
    border: 1px solid #ECEEF2;
    width: 620px;
    margin: auto
}

.subscription form .area.payPal {
    height: auto;
    padding: 20px 36px;
    text-align: center;
}

.subscription form .area.payPal .cc-name {
    margin-bottom: 30px;
}

.subscription form .area.payPal .instructions {
    font-size: 15px;
    color: #444444;
    padding-top: 16px;
}

.subscription form .area.payPal .instructions span {
    font-weight: bold;
}

.subscription form .area .ppclip {
    position: absolute;
}

.subscription form .area .ccDetails {
    padding: 30px 0;
    margin-bottom: 20px;
}

.subscription form .area .ccdet {
    color: #333;
    line-height: 28px;
    font-size: 15px;
}

.subscription form .area .ccdet span {
    margin-right: 50px;
}

.subscription form .field.name {
    margin-left: 10px;
    margin-top: 10px
}

.subscription form .field.name input {
    width: 135px
}

.subscription form .field {
    margin-top: 13px;
    margin-left: 40px;
}

.subscription form .fa {
    font-size: 21px;
    margin-left: 9px;
    top: 2px;
}

.subscription form {
    height: 100%;
    padding: 50px 90px;
}

.subscription form .actions .loader {
    top: 52px;
    position: absolute;
    right: 435px;
}

.subscription form .actions .contact-us {
    text-align: center;
    display: block;
    position: absolute;
    bottom: 0;
    width: 100%;
}

.subscription form .actions .secure {
    color: #52b266;
    font-size: 14px;
    margin-top: 10px
}

.subscription form .actions .secure span {
}

.subscription form .actions {
    margin-top: 20px;
    position: relative;
    height: 230px;
    text-align: center;
}

.subscription form .actions button {
    padding: 15px 30px;
    width: 200px;
}

.subscription form .message.error {
    background-color: rgba(255, 51, 102, 0.38);
    color: #1f2532;
}

.subscription form .message.success {
    background-color: #A7E5CF;
    border-color: #B1B6B4;
    color: #42534D;
}

.subscription form .message {
    width: 93%;
    padding: 10px 21px 10px 14px;
    margin-bottom: 5px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    font-size: 14px;
}

.subscription .FAQ h2 {
    font-size: 21px;
}

.subscription .FAQ h3 {
    font-size: 17px;
    margin-top: 30px;
    color: #333333;
}

.subscription .FAQ p {
    font-size: 16px;
    margin-top: 5px;
    margin-bottom: 20px;
    color: #969696;
}

.subscription .bottom {
    text-align: center;
    font-size: 14px;
    color: #999999;
    display: block;
    float: left;
    width: 100%;
    margin-top: 80px;
    border-top: 1px solid #EEEEEE;
    padding: 20px;
}

.subscription {
    width: 1000px;
    padding: 5px 20px 40px;
    min-height: 750px;
    position: relative;
    top: 60px;
    margin: 0px -500px;
    height: auto;
}

.subscription .plans-boxes {
    text-align: center;
    font-size: 15px;
    margin-top: 30px;
}

.subscription .plans-boxes .plan {
    position: relative;
    display: inline-block;
    width: 210px;
    padding: 20px 15px;
    border: 1px solid #AAAAAA;
    border-radius: 5px;
    text-align: center;
    margin-left: -7px;
    background: #ffffff;
    height: 490px;
    vertical-align: top;
}

.subscription .plans-boxes .plan.rec-true {
    width: 200px;
    z-index: 20;
    height: 540px;
    vertical-align: top;
    top: -23px;
    border: 1px solid rgb(82, 178, 102);
    background: #f6fdf7;
    padding-top: 41px;
}

.subscription .plans-boxes .plan.rec-true .recommended {
    color: #FFFFFF;
    background: #52b266;
    position: absolute;
    width: 169px;
    top: 0px;
    padding: 5px;
    border-radius: 0px 0px 3px 3px;
}

.subscription .plans-boxes .plan .price {
    font-size: 60px;
}

.subscription .plans-boxes .freetext {
    margin-top: 30px;
    line-height: 19px;
    letter-spacing: 0.5px;
    height: 124px;
}

.subscription .plans-boxes .plan .name {
    font-size: 17px;
    margin-bottom: 10px;
}

.subscription .plans-boxes .plan .price > span {
    font-size: 27px;
    margin-right: 3px;
}

.subscription .plans-boxes .plan .price > div {
    font-size: 17px;
}

.subscription .plans-boxes .plan ul {
    margin-top: 15px;
}

.subscription .plans-boxes .plan ul li {
    width: 100%;
    padding: 3px 10px;
    font-size: 15px;
    text-align: center;
}

.subscription .plans-boxes .plan ul li:nth-child(2n) {
}

.subscription .plans-boxes .plan .extra {
    margin-top: 7px;
    font-size: 14px;
}

.subscription .plans-boxes .plan .promote {
    margin-top: 35px;
    margin-bottom: 20px;
    font-size: 14px;
    color: #bbbbbb;
    height: 100px;
}

.subscription .plans-boxes .plan .button, .subscription form .actions button {
    padding: 15px 25px;
    vertical-align: top;
    background: #52b266;
    border: none;
    text-shadow: none;
    width: 220px;
    color: #FFFFFF;
    border-radius: 3px;
}

.subscription .plans-boxes .plan .button:disabled, .subscription form .actions button:disabled {
    color: #EEEEEE !important;
}

.subscription .plans-boxes .plan.rec-true .button {
    width: 170px;
    padding: 12px 10px;
    position: absolute;
    bottom: 10px;
}

.subscription .plans-boxes .plan .button:hover, .subscription .plans-boxes .plan .button:active, .subscription .plans-boxes .plan .button:focus {
    background: #64ba76;
}

.subscription .plans-boxes .footer {
    margin-top: 30px;
    font-style: italic;
}

.subscription .plans-boxes .footer span {
    color: #000000
}

.subscription .plans-boxes .plan a {
    font-family: arial;
    font-size: 17px;
}

.subscription .plans-boxes .clear {
    font-size: 17px;
}

.subscription .header .title1 {
    text-align: center;
    margin: 30px 0 0;
    font-size: 27px;
}

.subscription .header .title2 {
    text-align: center;
    margin: 10px;
    color: #999999;
}

.subscription .actions .title1 {
    margin: 30px 0 20px;
}

.subscription .actions .title1 strong {
    font-family: arial;
    color: #666666;
}

.subscription .actions .title1 span {
    margin-right: 10px;
    font-size: 12px;
}

.subscription .terms {
    font-size: 15px;
    margin-top: 6px;
    margin: 9px 0;
    padding: 0;
}

.subscription .terms input {
    height: 13px;
    float: right;
    width: 13px;
    margin: 1px 0 0 4px;
}

.subscription .terms a {
}

.subscription .pricing-header {
    margin: 0 auto 10px;
    padding: 15px 0px;
    text-align: center;
}

.subscription .title {
    background: #FFFFFF;
    margin-bottom: 0px;
    padding: 35px 80px 10px;
    font-size: 17px;
    color: #999999;
}

.promotion {
    padding: 10px 50px;
    text-align: center;

}

.promotion > .title {
    padding: 65px 0 45px;
    text-align: right;
    color: #666666;
    font-size: 19px;
    line-height: 29px
}

.promotion > h4 {
    text-align: center;
    font-weight: bold;
    font-size: 19px;
}

.promotion > .items {
    margin-top: 35px;
}

.promotion > .items ul li:first-child {
    margin-right: 0px;
}

.promotion > .items ul li {
    display: inline-block;
    width: 200px;
    vertical-align: top;
    margin-right: 20px;
    text-align: center;
}

.promotion > .items ul li img {
    width: 130px;
}

.promotion > .items ul li .text {
    margin-top: 30px;
    font-size: 17px;
    text-align: center;
}

.promotion button {
    margin: 50px;
    padding: 20px 50px;
}

.promotion .info {
    font-size: 15px;
    color: #999999;
}

.CC_sprites {
    background-image: url('https://b105ff616ffabf542041-4bd9cbd7c940079c5eb5fd18e93586b2.ssl.cf2.rackcdn.com/CC_spriet.png');
}

.CC_sprites.code {
    height: 35px;
    width: 140px;
    background-position: 90px 73px;
    position: absolute;
    top: 17px;
    right: 103px;
}

.CC_sprites.cards {
    margin-top: 5px;
    background-position: 0px 34px;
    width: 86px;
    height: 26px;
    position: absolute;
    top: 20px;
    left: 193px;
    opacity: 0.7;
}

.field a.tt-code {
    border-radius: 50%;
    background: #666666;
    color: #FFFFFF;
    position: absolute;
    right: 126px;
    top: 29px;
    padding: 2px 5px;
    font-size: 13px;
    height: 17px;
    width: 17px;
}

.field .tt-code-tip {
    position: absolute;
    background: white;
    width: 280px;
    height: 223px;
    top: -218px;
    padding: 20px;
    opacity: 0.90;
    border-radius: 5px;
    box-shadow: 0px 1px 7px 0px #666666;
    left: -240px;
}

.field .tt-code-tip::after {
    content: "\25BC";
    position: absolute;
    top: 220px;
    left: 217px;
    font-size: 15px;
    line-height: 16px;
    color: #FFFFFF;
    text-shadow: 0px 5px 8px #666;
}

.field .tt-code-tip span {
    color: #000;
    font-size: 15px;
    font-family: Arial;
}

.field .tt-code-tip img {
    height: 110px;
    float: right;
    margin-top: 11px;
}

.referral {
    position: absolute;
    right: 200px;
    top: 6px;
}

.referral .static-container {
}

.grace {
    position: absolute;
    right: 240px;
    top: 27px;
}

.referral .fa,
.grace .fa.bell {
    position: relative;
    font-size: 21px;
    color: #999;
    cursor: pointer;
}

.referral .link:hover .fa,
.grace .link:hover .fa.bell {
    color: #ccc;
}

.grace .link:hover a {
    color: #ff3366;
    text-decoration: underline;
}

.grace .fa.bell > .dot {
    height: 13px;
    width: 13px;
    background: #ff3366;
    border-radius: 50%;
    position: absolute;
    top: 6px;
    right: 6px;
    border: 2px solid #1f2532;
}

.referral .modal,
.grace .modal {
    width: 350px;
    background: #ffffff;
    text-align: center;
    border-radius: 2px;
    direction: rtl;
    padding: 40px 50px;
    position: absolute;
    right: 0;
    height: 250px;
    left: inherit;
    box-shadow: 0 0 1px rgba(76, 86, 103, .25), 0 2px 18px rgba(31, 37, 50, .32);
    top: 39px;
    text-align: right;
}

.referral .modal {
    height: 490px;
    width: 430px;
    padding: 30px;
}

.grace .modal > h4 {
    margin-bottom: 15px;
}

.grace .modal > div {
}

.grace .modal > button {
    margin-top: 25px;
}

/* ng-tags*/

div.tagsinput {
    border: 1px solid #CCC;
    background: #FFF;
    padding: 5px;
    width: 300px;
    height: 100px;
    overflow-y: auto;
}

div.tagsinput span.tag {
    border: 1px solid #a5d24a;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    display: block;
    float: right;
    padding: 5px;
    text-decoration: none;
    background: #cde69c;
    color: #638421;
    margin-right: 5px;
    margin-bottom: 5px;
    font-family: helvetica;
    font-size: 13px;
}

div.tagsinput span.tag a {
    font-weight: bold;
    color: #82ad2b;
    text-decoration: none;
    font-size: 11px;
}

div.tagsinput input {
    width: 80px;
    margin: 0px;
    font-family: helvetica;
    font-size: 13px;
    border: 1px solid transparent;
    padding: 5px;
    background: transparent;
    color: #000;
    outline: 0px;
    margin-right: 5px;
    margin-bottom: 5px;
}

div.tagsinput input:focus {
    border: transparent;
}

div.tagsinput div {
    display: block;
    float: right;
}

.tags_clear {
    clear: both;
    width: 100%;
    height: 0px;
}

input.typeahead {

}

.not_valid {
    background: #FBD8DB !important;
    color: #90111A !important;
}

a.help-circle.close {
    color: #315060;
    background: #FFFFFF;
    z-index: 1001;
    font-size: 25px;
    padding: 12px 17px;
}

a.help-circle {
    position: absolute;
    height: 50px;
    width: 50px;
    border-radius: 50%;
    background: #315060;
    right: -160px;
    top: 190px;
    color: white;
    font-size: 37px;
    font-weight: bold;
    padding: 6px 15px;
}

.admin.actions {
    position: absolute;
    top: 86px;
    right: -40px;
    height: 530px;
    width: 80px;
    text-align: right;
}

.admin.actions a {
    background: #FFFFFF;
    -webkit-transition: all 0.4s ease 0s;
    padding: 20px 2px;
    text-align: center;
    width: 180px;
    height: 60px;
    position: relative;
    display: block;
    margin-bottom: 18px;
    border-radius: 5px;
    border: 1px solid #CCCCCC;
    font-size: 15px;
}

.admin.actions a:hover {
    background: #dedede;
}

.admin.actions a.sure {
    background-color: #FF3366;
    color: #FFFFFF;
}

.help-design {
    position: absolute;
    z-index: 10001;
    top: 108px;
    left: -1px;
}

.overflow-hide {
    overflow: hidden;
}

@media screen and (max-width: 600px) {

    .centered-element.public, .header-content.public, .footer-content.public, .main-content.public, .drawer-content.public, page-width {
        width: 100%;
    }

    .menu .content {
        padding: 0 20px;
    }

    .menu .item.link {
        padding: 2px 30px;
    }

    .menu .item.link .fa {
        display: none;
    }

    .menu .item.link:not(.connect) {
        display: none;
    }

    .menu .search {
        color: #FFFFFF;
        width: 230px;
        display: block;
        position: absolute;
        right: 60px;
        top: 17px;
    }

    .menu .twitter-typeahead {
        width: 100%;
    }

    .menu .search .tt-menu {
        width: 130%;
    }

    .menu .search input {
        background-color: #1f2532;
        border: none;
        border-bottom: 1px solid #FFFFFF;
        color: #EEEEEE;
        height: 28px;
        width: 110%;
        padding: 10px;
        margin-left: 20px;
    }

    .menu .search .tt-suggestion {
        direction: rtl;
    }

    .menu .search .fa {
        color: #FFFFFF;
        top: 6px;
        left: initial;
        position: absolute;
        right: 6px;
    }

    .menu .search .fa:before {
        color: #FFFFFF;
        top: initial;
        left: initial;
        right: 0;
        font-size: 22px;
        right: -15px;
        top: -5px;
    }

    .menu .slider-handle {
        position: absolute;
        top: 6px;
        right: -5px;
    }

    .menu .slider-handle > span {
        color: #FFFFFF;
        font-size: 28px;
    }

    .menu .slider-handle.open {
        right: 3px;
    }

    .pop-up.confirm {
        width: 290px;
        margin-right: -145px;
        border-radius: 2px;
        border: none;
        padding-bottom: 10px;
    }

    .pop-up.confirm .close {
        display: none;
    }

    .pop-up.confirm .title {
        background: #FFFFFF;
        border-bottom: 2px solid #70cbd2;
        height: 50px;
        font-size: 17px;
        padding: 16px 20px;
        color: rgb(128, 138, 152);
    }

    .pop-up.confirm .message {
        font-size: 15px;
    }

    .pop-up.confirm .action {
        height: 45px;
        position: relative;
    }

    .pop-up.confirm .action button {
        font-size: 16px;
        margin: 0;
        padding: 4px 25px;
        background: none;
        box-shadow: none;
        border-radius: 0px;
        width: 146px;
        height: 45px;
        border-top: 1px solid #DDDDDD;
        color: #666666;
        position: absolute;
        border-bottom: none;
        border-right: none;
        border-left: none;
        text-shadow: none;
    }

    .pop-up.confirm .action button.no {
    }

    .pop-up.confirm .action button.yes {
        right: 0;
        width: 145px;
        border-left: 1px solid #DDDDDD;
    }

}

/* file upload*/

.logo-upload .load-circle {
    top: -5px;
    position: absolute;
    right: 200px;
}

.image-block img {
    width: 150px;
    border: 1px solid #EEEEEE;
}

.upload .file-choose {
    height: 27px;
    padding: 6px;
    width: 90px;
    background: #EEEEEE;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
}

.upload .submit {
    font-size: 17px;
    padding: 5px;
    width: 138px;
    position: absolute;
    top: 45px;
    right: -2px;
}

.upload .loader {
    position: absolute;
    right: 135px;
    top: 54px;
}

.upload input.file-choose-fake {
    width: 386px;
    font-size: 15px;
    color: #969696;
    height: 35px;
}

.error.file {
    background: none repeat scroll 0 0 transparent;
    color: darkRed;
    font-size: 14px;
    position: absolute;
    right: 160px;
    top: 55px;
    width: 339px;
}

.fade-show {
    -webkit-transition: all linear 0.2s;
    transition: all linear 0.2s;
}

.fade-show.ng-hide {
    opacity: 0;
}

.modal.fade {
    -webkit-transform: translate3d(0, -25%, 0);
    transform: translate3d(0, -25%, 0);
    -webkit-transition: -webkit-transform 0.3s ease-out;
    -moz-transition: -moz-transform 0.3s ease-out;
    -o-transition: -o-transform 0.3s ease-out;
    transition: transform 0.3s ease-out;
}

.modal.in {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

/* animations */

.animate-opacity {
    -webkit-transition: opacity linear 0.2s;
    transition: opacity linear 0.2s;
    -moz-transition: opacity linear 0.2s;
    -ms-transition: opacity linear 0.2s;
    -o-transition: opacity linear 0.2s;
}

.animate100ms {
    -webkit-transition: all linear 0.1s;
    transition: all linear 0.1s;
    -moz-transition: all linear 0.1s;
    -ms-transition: all linear 0.1s;
    -o-transition: all linear 0.1s;
}

.animate {
    -webkit-transition: all linear 0.2s;
    transition: all linear 0.2s;
    -moz-transition: all linear 0.2s;
    -ms-transition: all linear 0.2s;
    -o-transition: all linear 0.2s;
}

.animate-cancel, animateCancel {
    -webkit-transition: none !important;
    transition: none !important;
    -moz-transition: none !important;
    -ms-transition: none !important;
    -o-transition: none !important;
}

.animate300ms {
    -webkit-transition: all linear 0.3s;
    transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
}

.animate400ms {
    -webkit-transition: all linear 0.4s;
    transition: all linear 0.4s;
    -moz-transition: all linear 0.4s;
    -ms-transition: all linear 0.4s;
    -o-transition: all linear 0.4s;
}

.animate.trans-double {
    transition-duration: 0.4s;
    -webkit-transition-duration: 0.4s;
    -moz-transition-duration: 0.4s;
    -ms-transition-duration: 0.4s;
    -o-transition-duration: 0.4s;
}

.animate-fade-show {
    opacity: 1;
}

.animate-fade-show.ng-hide {
    -webkit-transition: all linear 0.5s;
    transition: all linear 0.5s;
    opacity: 0;
}

.gen-animation {
    -webkit-transition: all .1s ease-in-out;
    -moz-transition: all .1s ease-in-out;
    -ms-transition: all .1s ease-in-out;
    -o-transition: all .1s ease-in-out;
    transition: all .1s ease-in-out;
}

/* shaking*/

.kf-animation {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

@-webkit-keyframes shake-hor {
    0%, 100% {
        -webkit-transform: translateX(0);
    }
    10%, 30%, 50%, 70%, 90% {
        -webkit-transform: translateX(-7px);
    }
    20%, 40%, 60%, 80% {
        -webkit-transform: translateX(7px);
    }
}

@keyframes shake-hor {
    0%, 100% {
        transform: translateX(0);
    }
    10%, 30%, 50%, 70%, 90% {
        transform: translateX(-7px);
    }
    20%, 40%, 60%, 80% {
        transform: translateX(7px);
    }
}

.shakeHorizental {
    -webkit-animation-name: shake-hor;
    animation-name: shake-hor;
}

@-webkit-keyframes shake-hor-light {
    0%, 100% {
        -webkit-transform: translateX(0);
    }
    10%, 30%, 50%, 70%, 90% {
        -webkit-transform: translateX(-3px);
    }
    20%, 40%, 60%, 80% {
        -webkit-transform: translateX(3px);
    }
}

@keyframes shake-hor-light {
    0%, 100% {
        transform: translateX(0);
    }
    10%, 30%, 50%, 70%, 90% {
        transform: translateX(-3px);
    }
    20%, 40%, 60%, 80% {
        transform: translateX(3px);
    }
}

.shakeHorizentalLight {
    -webkit-animation-name: shake-hor-light;
    animation-name: shake-hor-light;
}

/* animate flip */

.panel .front {
    height: inherit;
    position: absolute;
    top: 0;
    z-index: 900;
    -webkit-transform: rotateX(0deg) rotateY(0deg);
    -moz-transform: rotateX(0deg) rotateY(0deg);
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -webkit-transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -ms-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}

.panel .back {
    height: inherit;
    position: absolute;
    top: 0;
    z-index: 1000;
    -webkit-transform: rotateY(-180deg);
    -moz-transform: rotateY(-180deg);
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -webkit-transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -ms-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}

.panel.flip .front {
    z-index: 900;
    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
}

.panel.flip .back {
    z-index: 1000;
    -webkit-transform: rotateX(0deg) rotateY(0deg);
    -moz-transform: rotateX(0deg) rotateY(0deg);
}

.twist {
    -webkit-transform: rotate(-180deg);
    -moz-transform: rotate(-180deg);
}

/*animate slide */

.animate-enter,
.animate-leave {
    -webkit-transition: 1025ms cubic-bezier(0.165, 0.840, 0.440, 1.000) all;
    -moz-transition: 1025ms cubic-bezier(0.165, 0.840, 0.440, 1.000) all;
    -ms-transition: 1025ms cubic-bezier(0.165, 0.840, 0.440, 1.000) all;
    -o-transition: 1025ms cubic-bezier(0.165, 0.840, 0.440, 1.000) all;
    transition: 1025ms cubic-bezier(0.165, 0.840, 0.440, 1.000) all;
}

.animate-enter {
    left: 100%;
}

.animate-enter.animate-enter-active {
    left: 0;
}

.animate-leave {
    left: 0;
}

.animate-leave.animate-leave-active {
    left: -100%;
}

.backgroundLoading {
    animation: green-bkg-loading 1s infinite linear;
    -webkit-animation: green-bkg-loading 1s infinite linear;
}

.backgroundLoadingSlow {
    animation: green-bkg-loading 2s infinite linear;
    -webkit-animation: green-bkg-loading 2s infinite linear;
}

@-webkit-keyframes green-bkg-loading {
    0% {
        opacity: .55;
    }
    50% {
        opacity: .98;
    }
    100% {
        opacity: .55;
    }
}
.heartBeatEffect{
    animation: opacity-upanddown 2s infinite linear;
    -webkit-animation: opacity-upanddown 2s infinite linear;
}

@-webkit-keyframes opacity-upanddown {
    0% {
        opacity: 1;
    }
    50% {
        opacity: 0.3;
    }
    100% {
        opacity: 1;

    }
}

.highlightArea {
    animation: highlight-text-area 1.25s infinite linear;
    -webkit-animation: highlight-text-area 1.25s infinite linear;
}

@-webkit-keyframes highlight-text-area {
    0% {
        opacity: 1;
        transform: scale(1);
    }
    50% {
        opacity: 1;
        transform: scale(1.03);
    }
    100% {
        opacity: 1;
        transform: scale(1);

    }
}
.mce-btn i {
    text-shadow: none !important;
}

.mce-panel {
    border: none !important;
    background-color: #F5F5F5 !important;
    background-image: none !important;
    background-repeat: no-repeat !important;
    filter: none;
    zoom: 1;
    padding: 0px 0 10px !important;
}

/* timepicker*/

.ui-timepicker-wrapper {
    overflow-y: auto;
    height: 150px;
    width: 6.5em;
    background: #fff;
    border: 1px solid #ddd;
    -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    outline: none;
    z-index: 10001;
    margin: 0;
}

.ui-timepicker-wrapper.ui-timepicker-with-duration {
    width: 13em;
}

.ui-timepicker-wrapper.ui-timepicker-with-duration.ui-timepicker-step-30,
.ui-timepicker-wrapper.ui-timepicker-with-duration.ui-timepicker-step-60 {
    width: 11em;
}

.ui-timepicker-list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.ui-timepicker-duration {
    margin-left: 5px;
    color: #888;
}

.ui-timepicker-list:hover .ui-timepicker-duration {
    color: #888;
}

.ui-timepicker-list li {
    padding: 3px 0 3px 5px;
    cursor: pointer;
    white-space: nowrap;
    color: #000;
    list-style: none;
    margin: 0;
}

.ui-timepicker-list:hover .ui-timepicker-selected {
    background: #fff;
    color: #000;
}

li.ui-timepicker-selected,
.ui-timepicker-list li:hover,
.ui-timepicker-list .ui-timepicker-selected:hover {
    background: #1980EC;
    color: #fff;
}

li.ui-timepicker-selected .ui-timepicker-duration,
.ui-timepicker-list li:hover .ui-timepicker-duration {
    color: #ccc;
}

.ui-timepicker-list li.ui-timepicker-disabled,
.ui-timepicker-list li.ui-timepicker-disabled:hover,
.ui-timepicker-list li.ui-timepicker-selected.ui-timepicker-disabled {
    color: #888;
    cursor: default;
}

.ui-timepicker-list li.ui-timepicker-disabled:hover,
.ui-timepicker-list li.ui-timepicker-selected.ui-timepicker-disabled {
    background: #f2f2f2;
}

/* search */
.search input {
    border: 1px solid #DDDDDD;
    width: 330px;
    box-shadow: none;
    font-size: inherit;
    padding-right: 34px;
}

.search .fa:before {
    font-family: fontAwesome;
    content: '\f002 ';
    position: absolute;
    z-index: 10;
    left: -33px;
    top: -13px;
    color: #CCCCCC;
    font-size: 18px;
}

.search input, .customers .button.gray {
    height: 38px;
}

.search input::-webkit-input-placeholder {
    color: #CCCCCC;
    font-weight: normal;
}

.search input::-moz-placeholder {
    color: #CCCCCC;
    font-weight: normal;
}

.search input:-ms-input-placeholder {
    color: #CCCCCC;
    font-weight: normal;
}

.search input:-moz-placeholder {
    color: #CCCCCC;
    font-weight: normal;
    text-indent: 25px;
}

/* cropper*/

/* cropit*/

.imageBox {
    position: relative;
    height: 500px;
    width: 700px;
    border: 1px solid #CCCCCC;
    background: #fff;
    overflow: hidden;
    background-repeat: no-repeat;
    cursor: move;
}

.imageBox .thumbBox {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 602px;
    height: 402px;
    margin-top: -200px;
    margin-left: -295px;
    box-sizing: border-box;
    border: 1px solid #EEEEEE;
    box-shadow: 0 0 0 1000px rgba(255, 255, 255, 0.85);
    background: none repeat scroll 0% 0% transparent;
}

.imageBox .spinner {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    text-align: center;
    line-height: 400px;
    background: rgba(255, 255, 255, 0.85);
}

.imag-crop .action.crop {
    margin-left: 130px;
    text-align: center;
    padding: 10px 40px;
}

.imag-crop .action.fa {
    width: 38px;
    height: 38px;
    background: #ffffff;
    vertical-align: top;
    color: #999;
    border: 1px solid #999999;
    padding: 0;
    top: 0;
    margin-left: 10px;
}

.imag-crop .action.fa:hover {
    background: #FFFFFF;

}

/* cropit*/

.imageBox, .imageBoxBadge {
    position: relative;
    height: 500px;
    width: 700px;
    border: 1px solid #CCCCCC;
    background: #fff;
    overflow: hidden;
    background-repeat: no-repeat;
    cursor: move;
}

.imageBoxBadge {
    background: #EEE6E6;

}

.imageBox .thumbBox,
.imageBoxBadge .thumbBox {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 602px;
    height: 402px;
    margin-top: -200px;
    margin-left: -295px;
    box-sizing: border-box;
    border: 1px solid #EEEEEE;
    box-shadow: 0 0 0 1000px rgba(255, 255, 255, 0.85);
    background: none repeat scroll 0% 0% transparent;
}

.imageBoxBadge,
.imageBoxBadge .thumbBox {
    border: 1px dashed #CCC;
}

.imageBox .spinner {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    text-align: center;
    line-height: 400px;
    background: rgba(255, 255, 255, 0.85);
}

.imag-crop .action.crop {
    margin-left: 130px;
    text-align: center;
    padding: 10px 40px;
}

.imag-crop .action.fa {
    width: 38px;
    height: 38px;
    background: #ffffff;
    vertical-align: top;
    color: #999;
    border: 1px solid #999999;
    padding: 0;
    top: 0;
    margin-left: 10px;
}

.imag-crop .action.fa:hover {
    background: #FFFFFF;

}

/* pulse scale */

.pulse {
    display: inline-block;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    /*border: 2px solid rgba(255, 255, 255, 0.35);*/
    border: 8px solid rgba(255,51,102,0.55);
    box-shadow: 0 0px 6px rgba(0, 0, 0, 0.25),
    inset 0 0px 3px rgba(0, 0, 0, 0.3);
    position: relative;
    cursor: pointer;
}


.pulse:after {
    position: absolute;
    content: '';
    width: 18px;
    height: 18px;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    background: rgba(255, 255, 255, 0.15);
    border: 1px solid rgba(255, 255, 255, 0.4);
    box-shadow: 0 0px 3px rgba(0, 0, 0, 0.5);
    border-radius: 50%;
}

.scale {
    animation-name: scale;
    animation-duration: 1.5s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
    -webkit-animation-name: scale;
    -webkit-animation-duration: 1.5s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: ease-in-out;

}

@-webkit-keyframes scale {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(0.85);
    }
    100% {
        transform: scale(1);
    }
}

@keyframes scale {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(0.85);
    }
    100% {
        transform: scale(1);
    }
}

/* intro */

.intro.instruct {
    background: rgba(72, 140, 245, 0.9);
    box-shadow: 0px 3px 8px -3px #888;
    height: auto;
    position: absolute;
    top: -11px;
    padding: 15px 20px 15px;
    border: 1px solid #4C93E6;
    text-align: center;
    line-height: 21px;
    font-size: 16px;
    color: #FFF;
    left: -158px;
    z-index: 0;
}

.intro.instruct:before {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-bottom: 12px solid rgba(72, 140, 245, 0.91);
    border-top: 12px solid transparent;
    border-left: 12px solid transparent;
    position: absolute;
    top: -23px;
    left: 50%;
    margin-left: -6px;
    border-right: 12px solid transparent;
}

.intro-ball {
    height: 15px;
    width: 15px;
    border-radius: 50%;
    background: #EEEEEE;
    margin-right: 10px;
    cursor: pointer;
}

.intro-ball:hover {
    background: #BBBBBB;
}

.intro-ball.bold-true {
    background: #CCCCCC;
}

.intro-cta .nav > div {
    display: inline-block;
}

.intro-cta .nav {
    text-align: center;
    display: block;
}

.intro-cta {
    height: auto;
    position: relative;
    width: 100%;
    padding: 20px;
}

.intro-cta > div {
    display: inline-block;
    position: relative;
    vertical-align: top;
}

.intro-cta .container {
    padding: 20px 15px;
    height: 230px;
    width: 600px;
}

.intro-cta .title-h1 {
    font-size: 21px;

}

.dashboard .main > div > .step,
.intro-cta .step, .intro-area ul .step {
    height: 60px;
    width: 60px;
    border: 5px solid rgba(0, 0, 0, 0.1);
    border-radius: 50%;
    padding: 4px 15px;
    font-size: 39px;
    color: rgba(0, 0, 0, 0.1);
    margin-left: 0px;
    font-weight: bold;
}

.intro-cta .title-h2 {
    width: 330px;
    margin-top: 10px;
    font-size: 15px;
    line-height: 21px;
}

.intro-cta .title-h3 {
    width: 310px;
    margin-top: 10px;
    font-size: 14px;
}

.intro-cta .bck img {
    width: 531px;
}

.intro-cta .diagram {
    position: absolute;
    left: 30px;
    bottom: 10px;
}

.intro-cta .example {
    left: 0;
    position: absolute;
    top: 0;
}

.intro-cta .icon.x {
    position: absolute;
    top: 0;
}

.intro-cta button {
    margin: 25px 0;
    padding: 13px 25px;
}

.intro-cta .close {
    cursor: pointer;
    position: absolute;
    right: 5px;
    top: 6px;
}

.intro-area {
    background: none repeat scroll 0 0 white;
    border-radius: 10px 10px 10px 10px;
    box-shadow: 0 0 7px 1px #333333;
    height: 510px;
    left: 50%;
    margin-left: -430px;
    position: absolute;
    top: 120px;
    width: 860px;
    z-index: 10001;
}

.intro-area ul {
    position: relative;
}

.intro-area ul .step {
    position: absolute;
    right: 16px;
    top: 37px;
    height: 80px;
    width: 80px;
    padding: 3px 19px;
    font-size: 60px;
    opacity: 0.4;
}

.intro nav {
    bottom: 40px;
    height: auto;
    left: 50%;
    margin-left: -40px;
    position: absolute;
    width: auto;
}

.intro .nav-ball {
    background: none repeat scroll 0 0 #CCCCCC;
    border-radius: 50%;
    cursor: pointer;
    float: left;
    height: 13px;
    margin: 0 7px;
    width: 13px;
}

.intro .nav-ball:hover {
    background: none repeat scroll 0 0 #999999;
}

.intro .nav-ball.on-true {
    background: none repeat scroll 0 0 #666666;
}

.intro-area > ul {
    padding: 50px 48px 50px 30px;
}

.intro li img {
}

.intro button {
    font-weight: normal;
    height: 45px;
    left: 72%;
    position: absolute;
    width: 190px;
    bottom: 30%;
    color: white;
}

.intro .close {
    border: 3px solid white;
    border-radius: 20px 20px 20px 20px;
    cursor: pointer;
    height: 27px;
    position: absolute;
    right: 12px;
    top: -10px;
    width: 27px;
}

.intro .close-modal {
    cursor: pointer;
    position: absolute;
    right: 12px;
    top: 5px;
    opacity: 0.6;
    z-index: 1;
}

.pac-container {
    z-index: 10050;
}

.pick-area .container > * {
    display: inline-block;
}

.pick-area a.dropdown-toggle {
    background: #FFFFFF;
    padding: 10px 10px;
    border-radius: 3px;
    border: 1px solid #CCCCCC;
    display: block;
    width: auto;
}

.pick-area ul.dropdown-menu {
    width: auto;
    text-align: right;
    margin: -4px 0;
    position: absolute;
    padding: 0;
    top: 45px;
    right: 0;
    left: initial;
}

.pick-area ul.dropdown-menu li {
}

.pick-area ul.dropdown-menu li a {
    border-bottom: 1px solid #EEEEEE;
    padding: 9px 15px;
}

.pick-area > ul > li {
    height: 50px;
}

.pick-area > ul > li:last-child {
    height: 100px
}

.pick-area li:last-child .plus.container {
    visibility: visible;
}

.pick-area .fa.x-close {
    float: left;
    color: #999999;
}

.pick-area .plus.container {
    border-right: 1px solid #CCCCCC;
    height: 27px;
    margin-right: 22px;
    visibility: hidden;
    right: 0;
    top: 48px;
    position: absolute;
    padding: 10px 0;
}

.pick-area .plus.container .sign {
    background: #FFFFFF;
    width: 30px;
    height: 30px;
    padding: 6px 7px;
    border-radius: 50%;
    border: 1px solid #CCCCCC;
    position: absolute;
    right: -15px;
}

.pick-area .plus.container .sign:hover {
    background: #F9F9F9;
}

.pick-area .plus.container .sign span {
    top: 0;
    padding: 0;
}

.dropdown-frame {
    background: #FFFFFF;
    border: 1px solid #CCCCCC;
    padding: 10px 15px 10px;
    box-shadow: 1px 1px 1px 1px #eee;
    border-radius: 3px;
    width: 220px;
}

.better-placeholder {
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

.better-placeholder::-webkit-input-placeholder {
    display: none;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
}

.better-placeholder::-moz-placeholder {
    display: none;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
}

.better-placeholder:-ms-input-placeholder {
    display: none;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
}

.better-placeholder:placeholder {
    display: none;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
}

.better-placeholder.better-placeholder-active {
    padding: 18px 12px 6px 12px;
    height: auto;
}

.has-error .better-placeholder-text {
    color: #a94442;
}

.has-error .better-placeholder-text.active {
    color: #a94442;
}

.has-success .better-placeholder-text {
    color: #3c763d;
}

.has-success .better-placeholder-text.active {
    color: #3c763d;
}

.has-warning .better-placeholder-text {
    color: #8a6d3b;
}

.has-warning .better-placeholder-text.active {
    color: #8a6d3b;
}

.better-placeholder-text {
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
    position: absolute;
    top: 2px;
    margin-left: 12px;
    line-height: 20px;
    height: 20px;
    color: #888;
    -webkit-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    transform-origin: 0 0;
    max-width: 85%;
    /* You have to fiddle with this and it .active replacement depending on size of field */
    margin-right: 12px;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
}

.better-placeholder-text.active {
    max-width: 110%;
    visibility: visible;
    -webkit-transform: scale(0.8);
    -ms-transform: scale(0.8);
    transform: scale(0.8);
    -webkit-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    transform-origin: 0 0;
    color: #428bca;
    top: -2px;
}

/* resizeble draggbel*/
.ui-resizable-handle {
    background: #ffffff;
    border: 1px solid #333;
    width: 10px;
    height: 10px;
    z-index: 2;
}

.ui-resizable-se {
    right: 0px;
    bottom: 0px;
}

/* landing */

.public.landing{
    font-family: Open Sans Hebrew;
}
.public.landing .main{
    margin-top: 160px;
    text-align: center;
    padding: 20px;
    position: relative;
    min-height: 1130px;
}

.public.landing .container{
    padding: 20px;
}
.public.landing h1{
    font-size: 41px;
    color: rgba(31, 37, 50, 0.65);
    margin-bottom: 130px;
}
.public.landing .main-image{
    width: 100%;
    text-align: center;
    margin: auto;
    height: 430px;
    overflow: hidden;
    border-radius: 3px;
    position: relative;
}
.public.landing  .main-image .fill{
    width: 100%;
    height: 100%;
    background: rgba(31, 37, 50, 0.22);
    z-index: 1;
    position: absolute;
    top: 0;
}
.public.landing  .main-image img{
    width: 100%;
    margin: -441px auto;
}
.public.landing .container  .text-box{
    position: absolute;
    z-index: 2;
    color: #FFFFFF;
    padding: 30px;
    line-height: 22px;
    letter-spacing: 1px;
    text-align: justify;
    opacity: 0.92;
}

.public.landing .container .contact{
    position: absolute;
    bottom: -170px;
    right: 80px;
}
.public.landing .container .text-box.top{
    top: -510px;
    height: 200px;
    width: 500px;
    background: #ff3366;
    z-index: 2;
}
.public.landing .container .text-box.bottom{
    background: #52b266;
    left: -20px;
    bottom: -348px;
    width: 620px;
    left: 40px;
    box-shadow: -2px 2px 13px 1px #ccc;
}

.public.landing .container .text-box ul{}
.public.landing .container .text-box ul li {
    display: inline-block;
    width: 220px;
    vertical-align: top;
    letter-spacing: normal;
    text-align: center;
    margin: 27px;
}
.public.landing .container .text-box ul li div{
    margin: 12px auto;
}
.public.landing .container .text-box ul li span{}

.public.landing .sprite{
    background: url('https://b105ff616ffabf542041-4bd9cbd7c940079c5eb5fd18e93586b2.ssl.cf2.rackcdn.com/home-sprite.v0.5.png');
    height: 60px;
    width: 60px;
}

.public.landing .sprite.dist{
    background-position: -83px -105px;
}

.public.landing .sprite.strategy{
    background-position: -153px -103px;
}

.public.landing .sprite.analytics{
    background-position: -22px -102px;
}

.public.landing .sprite.gallery{
    background-position: -227px -106px;
}

/*faq */

.faq-area {
    padding:0 0 100px;
}
.faq-area .faq-container > div:first-child {
    margin-left: 145px;
}
.faq-area .faq-container > div {
        display: inline-block;
        width: 435px;
        text-align: center;
}
.faq-area .faq-item {
        width: 510px;
        margin: 0 auto 40px;
        text-align: right;
        font-size: 17px;
}
.faq-area .faq-item h4 {
        font-size: 19px;
        color: #1f2530;
        border: 1px solid #E3E3E6;
        padding: 10px 20px;
        border-radius: 3px;
        margin-bottom: 20px;
        cursor: pointer;
        font-weight: bold;
        background: #F2F3F4;
}
.faq-area .faq-item h4:hover,
.faq-area .faq-item h4.open{
    color: #4e8fc7;
}
.faq-area .faq-item p {
    line-height: 21px;
    font-size: 16px;
    text-align: justify;
    margin-bottom: 70px;
    color: #999;
 }


@media screen and (max-width: 600px) {

    .centered-element, .header-content, .footer-content, .main-content, .page-width, .drawer-content {
        width: 100%;
    }

    .login-modal button{
        width: 100%;
    }
    .intro-ball {
        height: 15px;
        width: 15px;
        border-radius: 50%;
        background: #EEEEEE;
        margin-right: 10px;
        cursor: pointer;
    }

    .intro-ball:hover {
        background: #BBBBBB;
    }

    .intro-ball.bold-true {
        background: #CCCCCC;
    }

    .intro-cta .nav > div {
        display: inline-block;
    }

    .intro-cta .nav {
        text-align: center;
        display: block;
        margin-top: 20px;
    }

    .intro-cta {
        height: auto;
        position: relative;
        width: 100%;
        padding: 20px;
    }

    .intro-cta > div {
        display: inline-block;
        position: relative;
        vertical-align: top;
    }

    .intro-cta .container {
        padding: 70px 15px;
        height: 250px;
        width: 100%;

        text-align: center;
    }

    .intro-cta .title-h1 {
        font-size: 21px;

    }

    .intro-cta .step, .intro-area ul .step {
        height: 60px;
        width: 60px;
        border: 5px solid rgba(0, 0, 0, 0.1);
        border-radius: 50%;
        padding: 4px 15px;
        font-size: 39px;
        color: rgba(0, 0, 0, 0.1);
        margin-left: 0px;
        font-weight: bold;
    }

    .intro-cta .title-h2 {
        width: 100%;
        margin-top: 10px;
        font-size: 15px;
        line-height: 21px;
    }

    .intro-cta .title-h3 {
        width: 100%;
        margin-top: 10px;
        font-size: 14px;
    }

    .intro-cta .bck img {
        width: 531px;
    }

    .intro-cta .diagram {
        position: absolute;
        left: 0%;
        bottom: inherit;
        top: -60px;
        width: 100%;
    }

    .intro-cta .diagram img {
        height: 121px;
        left: 50%;
    }

    .intro-cta .example {
        left: 0;
        position: absolute;
        top: 0;
    }

    .intro-cta .icon.x {
        position: absolute;
        top: 0;
    }

    .intro-cta button {
        margin: 10px 0;
        padding: 13px 25px;
    }

    .intro-cta .close {
        cursor: pointer;
        position: absolute;
        right: 5px;
        top: 6px;
    }

    /* mobile */
    .intro-area {
        border-radius: 10px 10px 10px 10px;
        box-shadow: none;
        margin: 0 auto;
        position: relative;
        width: 320px;
        z-index: 10001;
        top: 0;
        left: 0;
        background: none;
        color: #FFFFFF;
        height: 100%;
    }

    /* mobile*/
    .intro nav {
        bottom: 25px;
        height: auto;
        width: 140px;
        margin-left: -70px;
    }

    .intro .nav-ball {
        background: none repeat scroll 0 0 #A9A9A9;
        border-radius: 50%;
        cursor: pointer;
        float: left;
        height: 13px;
        margin: 0 7px;
        width: 13px;
    }

    .intro .nav-ball:hover {
        background: none repeat scroll 0 0 #999999;
    }

    .intro .nav-ball.on-true {
        background: none repeat scroll 0 0 #FFFFFF;
    }

    /*mobile */
    .intro-area > ul {
        padding: 50px 10px;
        position: relative;
    }

    /*mobile*/
    .intro li img {
        max-width: 300px;
        position: absolute;
        bottom: 130px;
    }

    /*mobile*/
    .intro-area ul li .text {
        font-size: 19px;
        text-align: center;
        line-height: 28px;
        position: absolute;
        bottom: 10px;
    }

    .intro-area ul li {
        height: 410px;
        position: relative;
    }

    /* mobile */
    .intro button {
        height: 55px;
        position: absolute;
        width: 310px;
        margin: 0 auto;
        left: 0;
        bottom: 80px;
    }

    .intro .close {
        border: 3px solid white;
        border-radius: 20px 20px 20px 20px;
        cursor: pointer;
        height: 27px;
        position: absolute;
        right: 12px;
        top: -10px;
        width: 27px;
    }

    .menu.top {
        height: 50px;
    }

    .pageHeader .container {
        position: inherit;
    }

    .menu .item img {
        margin-top: 15px;
    }

    .menu .fa.left {
        color: #FFFFFF;
        padding: 0;
        top: 19px;
    }

    .menu .external .item.link a {
        padding: 20px 0;
    }

    .referral {
        right: inherit;
        top: 8px;
        left: 40PX;
    }

    .referral .modal {
        width: 100%;
        padding: 20px 10px;
        height: 100%;
        position: fixed;
        margin-top: 10px;
    }

    .notification {
        top: 62px;
        width: 94%;
        max-width: none;
        max-height: none;
        display: none;
    }

    .explain-no-customers img.diagram {
        display: none;
    }

    .promotion {
        padding: 10px 10px;
    }

    .subscription {
        min-height: inherit;
        height: auto;
        width: 100%;
        height: 100%;
        position: fixed;
        left: 0;
        margin: 0;
        top: 0;
        right: 0;
        overflow-y: scroll;
    }

    .promotion .info {
        display: none;
    }

    .promotion > .title {
        padding: 20px 0 20px;
    }

    .promotion > .items {
        margin-top: -5px;
        position: relative;
        display: block;
        height: 170px;
        margin: 0 0 50px;
    }

    .promotion > .items ul {
    }

    .promotion > .items ul li:first-child {
        margin-right: -43px;
        right: 0;
    }

    .promotion > .items ul li:last-child {
        top: 165px;
        right: 50%;
        margin-right: -100px;
    }

    .promotion > .items ul li {
        position: absolute;
        transform: scale(0.75);
        top: 50px;
        left: -44px;
        width: 200px;
    }

    .promotion > .items ul li:first-child .text {
    }

    .promotion > .items ul li .text {
        top: -100px;
        position: absolute;
    }

    .promotion > .items ul li:last-child .text {
        top: 160px;
    }

    .promotion button {
        margin: 50px;
        padding: 20px 20px;
        position: absolute;
        top: 499px;
        right: 50%;
        width: 153px;
        margin-right: -161px;
        font-size: 17px;
    }

    .promotion button.cancel {
        width: 158px;
        margin-right: 0;
    }

    .login-modal {
        left: 0;
        margin: 0;
        padding: 10px 30px;
        width: 100%;
        height: 100%;
        position: relative;
        overflow-y: auto;
        overflow-x: hidden;
        z-index: 1001;
        position: fixed;
        padding: 20px 30px;
    }

    .login-modal form {
        padding: 0;
        margin-top: 0;
    }

    .login-modal .field{
        margin-top: 25px;
    }

    .login-modal .field:first-child {

    }

    .login-modal input{
        height: 35px;
    }

    .login-modal .footer {
        margin-top: 20px;
        position: relative;
    }

    .login-modal .logo{
        display: none;
    }

    .login-modal .logo img {
        height: 0px;
    }

    .login-modal .pwd-forget{
        left: 50%;
        margin-left: -145px;
        bottom: 90px;
    }

    .login-modal .register{
        position: relative;
        margin-top: 150px;
    }

    .login-modal.signupAsk {
        padding: 20px 40px 120px;
        width: 100%;
        left: 0;
        margin: 0;
        height: 100%;
        position: fixed;
        overflow: hidden;
    }

    .login-modal .tpl-test img{    height: 100px; display: block; margin: 25px auto 10px;}
    .grace {
        right: 60px;
        top: 5px;
    }

    .external .nav ul.local-icon{
        position: absolute;
        right: 0;
        margin-right: 0;
        padding: 15px 0;
        width: 100%;
        text-align: right;
    }

    .external .nav ul.local-sm li a{
        color: #333;
        background: #FFF;
    }
}