@CHARSET "UTF-8";
/* toast ************************************/
.toast-bg {
position: absolute;
top: 20%;
width: 100%;
text-align: center;
z-index: 9000;
}
.toast {
display: inline-block;
background-color: rgba(0,0,0,0.8);
box-shadow: 0 0 10px rgba(0,0,0,0.6);
border-radius: 6px;
color: #fff;
padding: 10px 30px;
margin: 10px;
}
.toast.error {
background-color: rgba(200,0,0,0.8);
}
/*
* d-list
*/
.d-list {
border-style: none;
}
.d-list-item {
border-bottom: 1px solid #eeeeee;
padding: 2px 10px;
cursor: default;
}
.d-list-h .d-list-item {
display: inline-block;
border-bottom: 0px none;
border-right: 1px solid #eeeeee;
}
.d-list-item:hover {
background-color: #ffb88f;
}
.d-list-item-sel, .d-list-item-sel:hover {
background-color: #ff8844;
}
/*
* d-colorpicker
*/
.d-colorpicker {
font-size: 12px;
display: inline-block;
}
.d-colorpicker-div {
white-space: nowrap;
}
.d-colorpicker hr {
color: #fff;
}
.d-colorpicker-c {
display: inline-block;
margin: 1px;
width: 10px;
height: 10px;
cursor: pointer;
}
.d-colorpicker-c-sel {
}
.d-colorpicker input {
font-family: monospace;
font-size: 10px;
padding: 0 2px;
text-align: center;
width: 100%;
}
.d-colorpicker-recent {
float: right;
}
/*
General
*/
* {
box-sizing: border-box;
}
::-webkit-scrollbar {
width: 4px;
}
::-webkit-scrollbar-thumb {
border-radius: 2px;
background-color: rgba(0,0,0,0.2);
}
::-webkit-scrollbar-track {
background-color: transparent;
}
/*
::-webkit-scrollbar-thumb:window-inactive {
background-color: rgba(10,120,255,0.1);
}
*/
html {
font-family: 'Montserrat', sans-serif;
/*font-family: 'Open Sans', sans-serif;*/
font-size: 13px;
letter-spacing: 0.5px;
line-height: 20px;
height: 100%;
}
body {
margin: 0;
height: 100%;
color: #444;
background-color: #f6f6f6;
}
body.demo {
height: 100%;
background-color: transparent;
}
body.demo.mobile {
background-color: #000;
}
section {
padding: 30px 0;
clear: both;
}
.txt-s {
font-size: 11px;
letter-spacing: 0.5px;
}
.txt-m {
font-size: 13px;
letter-spacing: 0.5px;
}
.txt-l {
font-size: 20px;
letter-spacing: 1.5px;
}
.txt-caps-s {
font-size: 11px;
letter-spacing: 0.5px;
text-transform: uppercase;
}
.txt-caps-m {
font-size: 11px;
font-weight: bold;
letter-spacing: 2.5px;
text-transform: uppercase;
}
small { /* txt-s */
font-size: 11px;
letter-spacing: 0.5px;
opacity: 0.7;
}
h1, h2, h3 { /* txt-l */
font-size: 20px;
font-weight: normal;
letter-spacing: 1.5px;
text-transform: uppercase;
}
h4, h5 { /* txt-m */
font-size: 13px;
font-weight: normal;
letter-spacing: 0.5px;
text-transform: uppercase;
}
h6 { /* txt-s */
font-size: 11px;
font-weight: normal;
letter-spacing: 0.5px;
text-transform: uppercase;
}
h1 {
margin: 40px 0 30px;
}
h2 {
margin: 40px 0 20px;
}
h3 {
margin: 20px 0 15px;
}
h4 {
margin: 15px 0 10px;
}
h5 {
margin: 10px 0 5px;
}
h6 {
margin: 10px 0 5px;
}
p {
line-height: 24px;
}
ul, ol {
line-height: 24px;
}
/* Links */
a {
color: #0a78ff;
text-decoration: none;
}
a:hover {
color: #0759bd;
}
/*
Layout
*/
.a-top {
color: #29245c;
padding-top: 0;
padding-bottom: 0;
}
.a-top p {
margin: 20px 0;
}
.a-container {
max-width: 1200px;
margin: 0 auto;
padding: 5px;
position: relative;
}
.clear {
clear: both;
}
.center {
text-align: center;
}
.left {
text-align: left;
}
.right {
text-align: right;
}
.a-ib {
display: inline-block;
vertical-align: top;
}
.ib {
display: inline-block;
vertical-align: top;
position:relative;
}
.ib.w4 {
width: 4%;
}
.ib.w6 {
width: 6%;
}
.ib.w10 {
width: 10%;
}
.ib.w20 {
width: 20%;
}
.ib.w25 {
width: 25%;
}
.ib.w30 {
width: 30%;
}
.ib.w33 {
width: 33.3%;
}
.ib.w40 {
width: 40%;
}
.ib.w45 {
width: 45%;
}
.ib.w47 {
width: 47%;
}
.ib.w48 {
width: 48%;
}
.ib.w50 {
width: 50%;
}
.ib.w55 {
width: 55%;
}
.ib.w60 {
width: 60%;
}
.ib.w66 {
width: 66.6%;
}
.ib.w70 {
width: 70%;
}
div.flex {
display: flex;
clear: both;
}
div.flex div.f {
flex: 1;
}
div.flex div.f1 {
flex: 1;
}
div.flex div.f2 {
flex: 2;
}
.fr {
float: right;
}
hr {
height: 0;
border: none;
border-bottom: 1px solid #ccc;
}
.box {
padding: 10px;
line-height: 24px;
}
.a-box {
margin: 5px;
padding: 12px;
line-height: 22px;
border-radius: 8px;
background-color: #fff;
border: 1px solid #ccc;
color: #444;
}
ul.stack {
list-style: none;
margin: 0;
padding: 0;
}
ul.stack > li {
display: none;
}
ul.stack > li.sel {
display: block;
}
/******************************************** Tabs ************************/
.tabs {
}
.tabs ul.head {
padding: 30px;
padding-bottom: 20px;
margin: 0;
line-height: 40px;
background-color: #fff;
border-bottom: 1px solid #ccc;
}
.tabs ul.head li { /* txt-s */
display: inline-block;
margin-right: 50px;
color: #aaa;
text-transform: uppercase;
font-size: 11px;
cursor: pointer;
}
.tabs ul.head li:last-child {
margin-right: 0;
}
.tabs ul.head li svg.i {
margin-right: 10px;
}
.tabs ul.head li.sel {
color: #29245c;
}
.tabs ul.head li.sel svg.i {
fill: #29245c;
stroke: #29245c;
}
.tabs ul.body {
margin: 0;
padding: 0;
padding-bottom: 20px;
}
.tabs ul.body > li {
display: none;
}
.tabs ul.body > li.sel {
display: block;
}
.tabs ul.body .tabs ul.head {
background-color: transparent;
}
.tabs .t1 {
margin: 10px 30px 0;
}
.tabs .t2 {
position: relative;
margin-top: 10px;
padding: 15px;
padding-left: 50px;
background-color: #dee8f2;
display: none;
}
.tabs .t2_tip {
position: absolute;
top: 0;
left: 35px;
width: 0;
height: 0;
border-style: solid;
border-width: 10px 10px 0 10px;
border-color: #f6f6f6 transparent transparent transparent;
}
.tabs .t2.show {
display: block;
}
.tabs input[type='text'] {
width: 100%;
padding: 5px 10px;
font-size: 14px;
}
.tabs textarea {
width: 100%;
height: 80px;
}
.tabs label { /* txt-s */
text-transform: uppercase;
color: #aaa;
font-size: 11px;
}
/******************************************** Popup *******************************/
.popup-bg {
display: none;
position: fixed;
width: 100%;
height: 100%;
top: 0;
left: 0;
background-color: rgba(115,176,230,0.9);
text-align: center;
z-index: 5000;
}
.popup-bg.gray {
background-color: rgba(0,0,0,0.7);
}
.popup {
display: inline-block;
position: relative;
margin-top: 50px;
min-height: 300px;
max-width: 95%;
min-width: 30%;
text-align: left;
background-color: #f6f6f6;
}
.popup-close {
position: absolute;
top: 0;
right: 0;
margin-right: -40px;
margin-top: -40px;
cursor: pointer;
z-index: 2;
}
.popup-title {
background-color: #fff;
padding: 30px 30px 0;
color: #ccc;
text-transform: uppercase;
}
.popup-head {
padding: 20px 30px;
background-color: #fff;
border-bottom: 1px solid #ccc;
}
.popup-body {
padding: 20px 30px;
}
.popup-buttons {
padding: 20px 30px;
text-align: right;
}
/******************************************** AList *******************************/
ul.alist {
list-style: none;
margin: 0;
padding: 0;
background-color: #fff;
border: 1px solid #ccc;
}
ul.alist li {
margin: 0;
padding: 5px 20px;
border-top: 1px solid #ccc;
cursor: default;
}
ul.alist li:first-child {
border: none;
}
ul.alist li:hover,
ul.alist li.sel {
background-color: #ddd;
}
/*
Text Colors
*/
.indigo {
color: #29245c;
}
.dark-blue {
color: #4856ba;
}
.light-blue {
color: #6ca1d5;
}
.green {
color: #5caca7;
}
.lime {
color: #84b100;
}
.orange {
color: #ef871e;
}
.red {
color: #f93e36;
}
.purple {
color: #8b7cc9;
}
.light-grey {
color: #999999;
}
.dark-red {
color: #c00;
}
.bg-white {
background-color: #fff;
}
.bg-aaa {
background-color: #aaa;
color: #000;
}
.bg-ccc {
background-color: #ccc;
color: #000;
}
.bg-eee {
background-color: #eee;
color: #29245c;
}
.bg-green {
background-color: #84bd00;
color: #fff;
}
.bg-blue {
background-color: #485cc7;
color: #fff;
}
.bg-orange {
background-color: #ef9020;
color: #fff;
}
.bg-darkblue {
background-color: #29245c;
color: #fff;
}
.bg-violet {
background-color: #8b84d7;
color: #fff;
}
.bg-greenblue {
background-color: #4ccfc6;
color: #fff;
}
.bg-red {
background-color: #f93e36;
color: #fff;
}
/*
Messages
*/
.a-messages {
position: absolute;
top: 50px;
width: 600px;
left: 50%;
margin-left: -300px;
z-index: 2;
}
.a-info,
.a-warn,
.a-error {
text-align: center;
border-radius: 5px;
padding: 8px 32px;
}
.a-info {
background-color: #dfd;
color: #080;
border: 2px solid #080;
}
.a-warn {
background-color: #ffc;
color: #f60;
border: 2px solid #f60;
}
.a-error {
background-color: #fdd;
color: #800;
border: 2px solid #800;
}
/*
Help - Question mark
*/
a.questionmark {
display: inline-block;
vertical-align: middle;
width: 20px;
height: 20px;
line-height: 20px;
border-radius: 20px;
margin: 2px;
background-color: #0a78ff;
color: #fff;
font-size: 15px;
text-align: center;
}
/******************************************************************************
Form
*/
input {
padding: 16px 24px;
line-height: 20px;
font-family: 'Montserrat', sans-serif;
font-size: 16px;
color: #666;
border-radius: 4px;
border: 1px solid #ccc;
vertical-align: middle;
margin: 0;
}
input.s {
padding: 6px 16px;
font-size: 14px;
}
input:focus {
outline: 0px solid transparent;
}
input:disabled {
background-color: #eee;
}
textarea {
padding: 10px;
font-family: 'Montserrat', sans-serif;
font-size: 12px;
color: #888;
border: 1px solid #ccc;
border-radius: 4px;
}
select {
font-size: 16px;
padding: 4px;
color: #666;
border: 1px solid #ccc;
vertical-align: middle;
}
fieldset {
border: 1px solid #ccc;
}
legend {
color: #aaa;
}
/* Dropdown */
ul.dropdown {
position: absolute;
top: -2px;
left: -2px;
margin: 0;
padding: 0 30px;
min-width: 110%;
box-sizing: border-box;
white-space: nowrap;
text-align: left;
font-size: 11px;
line-height: 32px;
background-color: #fff;
color: #888;
border: 1px solid #eee;
box-shadow: 4px 4px 0px 0px rgba(0,0,0,0.2);
overflow-y: auto;
overflow-x: hidden;
z-index: 100;
max-height: 400px;
opacity: 0;
transform: scale(1,0);
transform-origin: center top;
transition: all 0.2s;
transition-delay: 0.3s;
}
ul.dropdown li {
list-style-type: none;
}
ul.dropdown li:hover {
color: #0a78ff;
}
span.b:hover:focus ul.dropdown,
span.bi:hover:focus ul.dropdown {
padding-top: 20px;
padding-bottom: 20px;
opacity: 1;
transform: scale(1,1);
transition-delay: 0s;
}
/*
Drop
*/
.a-button-drop {
display: none;
position: absolute;
width: 180px;
left: 0;
top: 100%;
background-color: #fff;
padding: 5px 0 0;
text-align: left;
font-size: 13px;
border: 1px solid #aaa;
box-shadow: 4px 4px 4px #333;
z-index: 20;
}
.a-button-drop small {
vertical-align: middle;
}
.a-button-drop a {
display: block;
padding: 2px 10px;
text-decoration: none;
border-bottom: 1px solid #eee;
}
.a-button-drop a:hover {
background-color: rgba(220,220,220,0.3);
}
/*
Tooltip
*/
.a-tt { /* txt-s */
display: none;
position: absolute;
padding: 5px 10px;
max-width: 260px;
z-index: 9999;
background-color: #222;
box-shadow: 0px 2px 6px rgba(0,0,0,0.4);
font-size: 11px;
line-height: 18px;
color: #fff;
}
.a-tt2 { /* txt-s */
position: absolute;
padding: 4px 10px;
max-width: 260px;
z-index: 9999;
background-color: #222;
box-shadow: 0px 2px 6px rgba(0,0,0,0.4);
border-radius: 3px;
font-size: 11px;
line-height: 18px;
color: #fff;
}
/* Callout tips */
.a-tip {
position: absolute;
padding: 20px;
background-color: #f8f8f8;
border: 1px solid #0a78ff;
border-radius: 4px;
box-shadow: 0 0 10px rgba(0,0,0,0.5);
font-size: 11px;
color: #444;
max-width: 260px;
z-index: 1000;
line-height: 20px;
}
.a-tip .b {
margin-top: 10px;
float: right;
}
.a-tip .t1,
.a-tip .t2
{
position: absolute;
top: -20px;
left: 50%;
margin-left: -20px;
width: 0;
height: 0;
border-style: solid;
border-width: 0 20px 20px 20px;
border-color: transparent transparent #0a78ff transparent;
z-index: 2;
}
.a-tip .t2 {
top: -19px;
border-color: transparent transparent #f8f8f8 transparent;
}
/*
Social Bar
*/
.a-socialbar {
margin-bottom: 10px;
height: 20px;
}
.a-socialbar .fb-like {
padding-left: 5px;
vertical-align: top;
}
.a-demobar .a-socialbar {
display: inline-block;
border-left: 1px solid #aaa;
padding-left: 10px;
margin-bottom: 0;
}
/*
Loader
*/
.a-loader,
.a-loader.white {
display: inline-block;
vertical-align: middle;
background-position: center center;
background-repeat: no-repeat;
background-size: contain;
width: 32px;
height: 32px;
}
.a-loader {
background-image: url('data:image/svg+xml;utf8,');
}
.a-loader.white {
background-image: url('data:image/svg+xml;utf8,');
}
.loader {
background-position: center center;
background-repeat: no-repeat;
background-size: 80% 80%;
background-image: url('data:image/svg+xml;utf8,');
}
/*
Close
*/
.a-close {
position: absolute;
right: 0;
top: 0;
width: 30px;
height: 30px;
line-height: 30px;
font-size: 30px;
color: #fff;
text-align: center;
opacity: 0.8;
cursor: default;
}
.a-close::before {
content: "\d7";
}
.a-close:hover {
opacity: 1;
}
/*
Dropdown
*/
.a-dropdown {
display: inline-block;
position: relative;
cursor: pointer;
margin: 5px;
padding: 5px 10px;
font-size: 11px;
line-height: 20px;
text-align: left;
color: #444;
background-color: #fff;
border: 1px solid #aaa;
border-radius: 6px;
}
.a-dropdown.select {
padding-right: 34px;
}
.a-dropdown.select > b {
font-weight: normal;
}
.a-dropdown.select > i {
position: absolute;
right: 1px;
top: 0;
height: 100%;
box-sizing: border-box;
padding: 3px;
border-left: 1px solid rgba(0,0,0,0.1);
font-size: 20px;
cursor: pointer;
}
.a-dropdown.icon {
padding: 4px;
}
.a-dropdown.icon > i {
display: inline-block;
opacity: 0.8;
transition: transform 0.1s;
}
.a-dropdown.icon > i:hover {
opacity: 1;
transform: scale(1.2);
}
.a-dropdown ul {
margin: 0;
padding: 0;
position: absolute;
left: 0;
top: 80%;
z-index: 20;
background-color: #fff;
box-shadow: 0 0 10px rgba(0,0,0,0.4);
display: none;
}
.a-dropdown ul.visible {
display: block;
}
.a-dropdown li {
list-style: none;
border-bottom: 1px solid #ccc;
padding: 4px 10px;
white-space: nowrap;
}
.a-dropdown li:last-child {
border: none;
}
.a-dropdown li:hover,
.a-dropdown li.sel {
background-color: #eee;
}
.a-dropdown li.hide {
display: none;
}
/********************************************************** Scroll */
.a-scroll2-parent {
overflow: hidden;
position: relative;
}
.a-scroll2 {
position: absolute;
top: 0;
right: 0;
width: 4px;
height: 100%;
border-radius: 4px;
background-color: rgba(0,0,0,0.2);
opacity: 0;
z-index: 1000;
transition: opacity 0.3s;
}
.a-scroll2-parent:hover .a-scroll2 {
opacity: 1;
}
/**********************************************************************************/
@media (max-width: 1024px) {
}
/**********************************************************************************/
@media (max-width: 768px) {
input {
padding-top: 12px;
padding-bottom: 12px;
}
}
/**********************************************************************************/
@media (max-width: 640px) {
.ib {
padding: 2px;
}
.hide640 {
display: none;
}
}
/* HTML Icons */
b.i {
display: inline-block;
width: 30px;
height: 30px;
font-size: 18px;
text-align: center;
color: #fff;
cursor: default;
vertical-align: middle;
}
b.i.close {
line-height: 25px;
font-size: 30px;
}
b.i.close.s {
width: 20px;
height: 20px;
line-height: 16px;
font-size: 20px;
}
b.i.times {
width: 20px;
height: 20px;
line-height: 20px;
font-size: 30px;
}
/* SVG Icons */
svg.i {
fill: #000;
stroke: #000;
vertical-align: middle;
box-sizing: content-box;
/*
box-shadow: 0 0 2px #000;
*/
}
svg.i.s12 {
width: 12px;
height: 12px;
}
svg.i.s16 {
width: 16px;
height: 16px;
}
svg.i.s20 {
width: 20px;
height: 20px;
}
svg.i.s24 {
width: 24px;
height: 24px;
}
svg.i.s26 {
width: 26px;
height: 26px;
}
svg.i.s28 {
width: 28px;
height: 28px;
}
svg.i.s30_24 {
width: 30px;
height: 24px;
}
svg.i.s32 {
width: 32px;
height: 32px;
}
svg.i.s35_28 {
width: 35px;
height: 28px;
}
svg.i.s48 {
width: 48px;
height: 48px;
}
svg.i.s60 {
width: 60px;
height: 60px;
}
svg.i.s60_20 {
width: 60px;
height: 20px;
}
svg.i.s72 {
width: 72px;
height: 72px;
}
svg.i.s100 {
width: 100px;
height: 100px;
}
svg.i.g222 {
fill: #222;
stroke: #222;
}
svg.i.g444 {
fill: #444;
stroke: #444;
}
svg.i.g666 {
fill: #666;
stroke: #666;
}
svg.i.g888 {
fill: #888;
stroke: #888;
}
svg.i.gaaa {
fill: #aaa;
stroke: #aaa;
}svg.i.gccc {
fill: #ccc;
stroke: #ccc;
}
svg.i.white {
fill: #fff;
stroke: #fff;
}
svg.i.blue {
fill: #0a78ff;
stroke: #0a78ff;
}
svg.i.darkblue {
fill: #29245c;
stroke: #29245c;
}
svg.i.lightblue {
fill: #6cace4;
stroke: #6cace4;
}
svg.i.green {
fill: #5caca7;
stroke: #5caca7;
}
svg.i.orange {
fill: #ef871e;
stroke: #ef871e;
}
svg.i.purple {
fill: #8b7cc9;
stroke: #8b7cc9;
}
svg.i.lime {
fill: #84b100;
stroke: #84b100;
}
/**********************************************************************************/
@media (max-width: 1024px) {
}
/**********************************************************************************/
@media (max-width: 768px) {
}
/**********************************************************************************/
@media (max-width: 640px) {
}
/*
Button
*/
button,
input[type="submit"],
span.b,
a.b {
display: inline-block;
vertical-align: bottom;
position: relative;
padding: 16px 56px;
margin: 0;
font-family: inherit;
font-size: 16px;
font-weight: normal;
line-height: 20px;
text-align: center;
letter-spacing: 0.5px;
color: #fff;
background-color: #0a78ff;
border: 2px solid #0a78ff;
border-radius: 4px;
cursor: pointer;
transition: box-shadow 0.1s linear;
}
button:hover,
input[type="submit"]:hover,
span.b:hover,
a.b:hover {
box-shadow: 3px 3px 0px 0px rgba(0,0,0,0.15);
}
button.disabled,
input[type="submit"].disabled,
span.b.disabled,
a.b.disabled {
background-color: #ddd;
border-color: #ddd;
cursor: default;
}
button.disabled:hover,
input[type="submit"].disabled:hover,
span.b.disabled:hover,
a.b.disabled:hover {
box-shadow: none;
}
button.white,
input[type="submit"].white,
span.b.white,
a.b.white {
background-color: #fff;
color: #0a78ff;
}
button.transp,
input[type="submit"].transp,
span.b.transp,
a.b.transp {
background-color: transparent;
color: #0a78ff;
border-color: #aaa;
}
button.transp_white,
input[type="submit"].transp_white,
span.b.transp_white,
a.b.transp_white {
background-color: transparent;
color: #fff;
border-color: #fff;
}
button.transp_white:hover,
input[type="submit"].transp_white:hover,
span.b.transp_white:hover,
a.b.transp_white:hover {
background-color: rgba(255,255,255,0.1);
}
button.s,
input[type="submit"].s,
span.b.s,
a.b.s {
padding: 6px 16px;
font-size: 14px;
}
button.xs,
input[type="submit"].xs,
span.b.xs,
a.b.xs {
padding: 4px 12px;
font-size: 13px;
border-width: 1px;
border-radius: 4px;
}
button.m,
input[type="submit"].m,
span.b.m,
a.b.m {
padding: 8px 24px;
}
button.load,
input[type="submit"].load,
span.b.load,
a.b.load {
background-position: center center;
background-repeat: no-repeat;
background-size: 80% 80%;
background-image: url('data:image/svg+xml;utf8,');
color: rgba(255,255,255,0.2);
}
button.white.load,
input[type="submit"].white.load,
span.b.white.load,
a.b.white.load {
background-position: center center;
background-repeat: no-repeat;
background-size: 80% 80%;
background-image: url('data:image/svg+xml;utf8,');
color: rgba(10,120,255,0.4);
}
/*
Button with icon
*/
a.bi,
span.bi {
position: relative;
vertical-align: bottom;
display: inline-block;
outline: none;
padding: 0 16px;
line-height: 50px;
height: 52px;
border: 1px solid transparent;
border-radius: 4px;
color: #0a78ff;
font-size: 13px;
transition: all 0.2s;
cursor: pointer;
}
a.bi:hover,
span.bi:hover {
background-color: #fff;
box-shadow: 3px 3px 0px rgba(0,0,0,0.15);
}
a.bi.s,
span.bi.s {
font-size: 14px;
padding: 0 8px;
line-height: 30px;
height: 32px;
}
a.bi.l,
span.bi.l {
font-size: 16px;
padding: 0 24px;
}
a.bi.blue,
span.bi.blue {
color: #fff;
background-color: #0a78ff;
border-color: #0a78ff;
}
a.bi.white,
span.bi.white {
border-color: #fff;
background-color: #fff;
}
a.bi.white:hover,
span.bi.white:hover {
box-shadow: 3px 3px 0px 0px rgba(0,0,0,0.05);
}
a.bi.icon,
span.bi.icon {
opacity: 0.8;
}
a.bi.icon:hover,
span.bi.icon:hover {
background-color: transparent;
box-shadow: none;
opacity: 1;
}
a.bi.icon svg:hover,
span.bi.icon svg:hover {
transform: scale(1.2);
}
/*
Button group
*/
span.bg {
display: inline-block;
margin: 5px;
font-family: inherit;
font-size: 0;
line-height: 20px;
text-align: center;
letter-spacing: 0.5px;
cursor: pointer;
transition: box-shadow 0.1s linear;
}
span.bg a {
display: inline-block;
padding: 8px 40px;
margin: 0;
font-size: 16px;
font-weight: normal;
color: #888;
background-color: transparent;
border: 2px solid #0a78ff;
border-right-width: 0;
cursor: pointer;
transition: box-shadow 0.1s linear;
}
span.bg a:first-child {
border-radius: 4px 0 0 4px;
}
span.bg a:last-child {
border-radius: 0 4px 4px 0;
border-right-width: 2px;
}
span.bg a.sel,
span.bg a:hover {
background-color: #fff;
color: #0a78ff;
}
/*
Button - round
*/
.a-b {
display: inline-block;
vertical-align: middle;
text-align: center;
height: 40px;
line-height: 40px;
width: 40px;
border: 1px solid #666;
border-radius: 100px;
cursor: pointer;
}
/**********************************************************************************/
@media (max-width: 1024px) {
}
/**********************************************************************************/
@media (max-width: 768px) {
button,
input[type="submit"],
span.b,
a.b {
padding: 12px 40px;
margin: 2px;
}
}
/**********************************************************************************/
@media (max-width: 640px) {
button,
input[type="submit"],
span.b,
a.b {
padding-left: 24px;
padding-right: 24px;
}
}
/*
Header
*/
header {
background-color: #f6f6f6;
}
header .a-container {
position: relative;
}
header img {
margin-top: 10px;
height: 32px;
}
.a-logo-company {
display: none;
}
nav {
position: absolute;
top: 18px;
right: 4px;
z-index: 100;
line-height: 30px;
}
nav a {
margin-left: 30px;
}
/*
Footer
*/
footer {
padding: 20px 0;
color: #888;
clear: both;
background-color: #111;
min-height: 250px;
}
footer h3 {
margin: 10px;
}
footer a {
color: #29f;
margin-right: 10px;
padding: 10px;
}
footer a:hover {
color: #3af;
}
.a-footer-social {
display: inline-block;
}
.a-footer-social a {
display: inline-block;
border-radius: 100px;
margin: 0;
}
.a-footer-social a:hover {
}
.a-footer-social a:hover svg.i {
fill: #ccc;
stroke: #ccc;
}
.a-footer-links {
}
.a-footer-terms {
}
.a-footer-terms a,
.a-footer-terms a:hover {
color: #888;
}
/** Cookies ****************************************/
.a-cookies {
color: #fff;
text-align: center;
padding: 10px 10%;
box-shadow: 0 0 5px #000;
position: fixed;
bottom: 0;
width: 100%;
z-index: 2;
display: none;
}
.a-cookies.show {
display: block;
}
.a-cookies a {
margin: 0;
padding: 0;
}
.a-cookies button {
padding: 2px 10px;
}
/**********************************************************************************/
@media (max-width: 1024px) {
}
/**********************************************************************************/
@media (max-width: 768px) {
nav {
position: relative;
text-align: right;
border-bottom: 1px solid #ccc;
}
}
/**********************************************************************************/
@media (max-width: 600px) {
nav .ib {
margin: 0;
}
nav .nav-help,
nav .nav-account {
display: none;
}
}
/*
Demo
*/
.a-top.demo {
min-height: 600px;
color: #888;
overflow: hidden; /* sometimes the hand cursor goes outside */
padding-top: 40px;
padding-bottom: 60px; /* to see the toolbar in no-frame scenario */
}
.a-top.demo .ib.ib1 {
position: relative;
}
.a-top.demo .ib.ib2 {
position: relative;
width: 67%;
margin-left: 3%;
}
.a-top.demo h1 {
position: relative;
text-transform: none;
margin: 0;
margin-bottom: 10px;
color: #29245c;
}
.a-demo-desc {
}
.a-demo-views {
}
.a-demo-views .ib {
vertical-align: baseline;
}
.a-demo-views strong {
color: #29245c;
font-size: 260%;
font-weight: normal;
}
.a-demo-appstore-apple, .a-demo-appstore-google {
background-image: url('img/a_sprite.6.png');
text-indent: -9999px;
display: block;
}
.a-demo-appstore-apple {
background-position: -180px -50px;
width: 135px;
height: 40px;
}
.a-demo-appstore-google {
background-position: -180px 0;
width: 130px;
height: 45px;
}
/********************** Edit demo ****************************************/
.a-demo-mydemos {
position: absolute;
top: 20px;
text-transform: uppercase;
}
.a-top.demo .ad-manage-vis {
position: relative;
top: -2px;
right: -2px;
}
.a-demo-edit {
margin: 10px 0 30px;
position: relative;
}
.a-demo-edit .bi {
margin-right: 10px;
}
.a-demo-edit .dropdown {
font-size: 15px;
line-height: 40px;
}
.a-demo-edit .over {
position: absolute;
width: 100%;
height: 100%;
top: 0;
background-color: rgba(246,246,246,0.4);
}
.a-demo-edit .over:active {
background-color: rgba(246,246,246,0.6);
}
.a-demo-edit-expired {
background-color: #f90;
color: #fff;
padding: 20px;
text-align: center;
}
/* Demo container ********************************************/
.a-demo-container {
position: relative;
width: 100%;
height: 100%;
}
.a-demo-container.fullscreen {
width: 100%;
height: 100%;
background-color: #fff;
}
/* Runner ********************************************/
.a-demo-runner {
position: relative;
width: 100%;
z-index: 2;
}
/* Progress ********************************************/
.a-demo-progress {
height: 3px;
margin-bottom: 7px;
width: 100%;
background-color: #ddd;
display: none;
}
.a-demo-progress b {
display: block;
height: 100%;
width: 0;
background-color: #f60;
transition: width 0.5s;
}
.a-demo-progress.show {
display: block;
}
/* Overview ********************************************/
.a-demo-overview {
position: absolute;
top: 40%;
left: 50%;
width: 240px;
margin-left: -120px;
text-align: center;
color: #fff;
border: 2px solid #fff;
box-shadow: 0 0 10px #000;
border-radius: 4px;
cursor: default;
z-index: 4000;
display: none;
}
.a-demo-overview.show {
display: block;
}
.a-demo-overview h5 {
margin: 0;
padding: 10px;
border-bottom: 2px solid #fff;
font-size: 12px;
font-weight: bold;
}
.a-demo-overview h6 {
margin: 0;
padding: 10px;
border-bottom: 1px solid #fff;
text-transform: none;
font-size: 12px;
font-weight: bold;
cursor: pointer;
}
.a-demo-overview h6:last-child {
border-bottom: none;
border-radius: 0 0 5px 5px;
}
.a-demo-overview h6:hover {
background-color: rgba(255,255,255,0.2);
}
/** Control bar ************************************/
#a-demo-cb {
background-color: rgba(0,0,0,0.9);
padding: 0 10px;
border-radius: 5px 5px 0 0;
box-shadow: 0 0 10px rgba(0,0,0,0.4);
color: #fff;
font-size: 14px;
position: absolute;
bottom: 0;
right: 0;
width: 60px;
height: 25px;
overflow: hidden;
z-index: 1000;
opacity: 0;
display: none;
transition: width 0.3s, height 0.3s, opacity 1s;
}
#a-demo-cb.show {
display: block;
}
#a-demo-cb:hover {
opacity: 1;
}
#a-demo-cb.open {
opacity: 1;
background-color: rgba(0,0,0,0.95);
padding: 10px;
width: 100%;
height: 50px;
}
#a-demo-cb b {
width: 100%;
font-size: 40px;
line-height: 5px;
}
#a-demo-cb.open b {
display: none;
}
#a-demo-cb ul {
list-style: none;
margin: 0;
padding: 0;
height: 100%;
display: none;
}
#a-demo-cb.open ul {
display: block;
}
#a-demo-cb li {
display: inline-block;
position: relative;
cursor: pointer;
padding: 5px 0;
width: 15%;
height: 30px;
line-height: 20px;
text-align: center;
}
#a-demo-cb li:hover {
background-color: rgba(255,255,255,0.2);
}
#a-demo-cb li.ap:before {
content: '\2713';
font-weight: bold;
margin-right: 5px;
}
#a-demo-cb li.ap.no:before {
visibility: hidden;
}
#a-demo-cb li.hs,
#a-demo-cb li.ca {
float: right;
}
#a-demo-cb li.hs:before,
#a-demo-cb li.ca:before {
content: '\2713';
font-weight: bold;
margin-right: 5px;
}
#a-demo-cb li.hs.no:before,
#a-demo-cb li.ca.no:before {
visibility: hidden;
}
#popup-cb .popup {
width: 80vw;
height: 80vh;
margin-top: 10vh;
}
#popup-cb iframe {
width: 100%;
height: 100%;
}
#popup-cb-v .popup {
margin-top: 10vh;
}
#popup-cb-v .videos {
width: 80vw;
height: 80vh;
padding: 5px;
font-size: 0;
overflow: hidden;
}
#popup-cb-v iframe {
border: none;
margin: 5px;
}
#popup-cb-v .videos.n1 iframe {
width: calc(100% - 10px);
height: calc(100% - 10px);
}
#popup-cb-v .videos.n2 iframe {
width: calc(50% - 10px);
height: calc(100% - 10px);
}
#popup-cb-v .videos.n4 iframe {
width: calc(50% - 10px);
height: calc(50% - 10px);
}
#popup-cb-v .videos.n6 iframe {
width: calc(33.3% - 10px);
height: calc(50% - 10px);
}
#popup-cb-v p {
display: none;
}
/** Full screen **********************************/
.a-demo-fullscreen2 {
display: none;
width: 100%;
height: 100%;
}
.a-demo-fullscreen2.show {
display: block;
}
.a-demo-fullscr {
position: absolute;
right: 0;
top: -40px;
z-index: 2;
cursor: pointer;
}
/**************** Cursor **************************/
.a-cursor-0 {
}
.a-cursor-1 {
background-image: url(img/hand-white.7.png);
background-position: left top;
background-repeat: no-repeat;
background-size: contain;
width: 70px;
height: 90px;
}
.a-cursor-2 {
background-image: url(img/mouse-arrow-black.4.png);
background-position: left top;
background-repeat: no-repeat;
background-size: contain;
width: 30px;
height: 50px;
}
.a-demo-touch {
position: absolute;
right: 0px;
top: 50%;
z-index: 2;
}
/* Demo Share ****************************************************************************/
.a-demo-share-popup .popup {
min-height: 520px;
}
.a-demo-share-popup a.download {
width: 300px;
}
.a-demo-share-popup a.download.dl:after {
content: 'Download Zip File';
}
.a-demo-share-popup a.download.gen:after {
content: 'Generate Zip File';
}
.a-demo-share-popup a.download.work:after {
content: 'Generating Zip File ..';
}
/* Demo Settings ****************************************************************************/
.a-demo-show-settings {
background-color: #ffd;
padding: 10px 20px;
border-radius: 4px;
color: #a00;
line-height: 30px;
margin: 30px 0;
}
.a-demo-share-public a {
}
#qr-code {
float: right;
margin-right: -20px;
margin-top: -20px;
}
/* Social */
.a-demo-social {
}
.a-demo-social a {
display: inline-block;
width: 32px;
height: 32px;
line-height: 32px;
margin-right: 6px;
text-align: center;
border-radius: 100px;
}
.a-demo-social a:hover {
}
.a-demo-social .share {
background-color: #0a78ff;
}
.a-demo-social .linkedin {
background-color: #0080b2;
}
.a-demo-social .twitter {
background-color: #00aced;
}
.a-demo-social .facebook {
background-color: #3b5999;
}
.a-demo-social .google {
background-color: #d44332;
}
/********************************************* Settings ******/
.a-demo-settings-popup #tabs-settings > ul.body {
height: 60vh;
overflow-y: auto;
overflow-x: hidden;
}
.a-demo-settings-popup .ib.icons {
text-align: center;
}
.a-demo-settings-popup img {
height: 80px;
}
img.a-demo-frame {
vertical-align: top;
margin-left: 40px;
margin-top: -5px;
height: initial;
max-width: 120px;
max-height: 120px;
}
/*
Demo Containers
*/
.a-demo-embedder {
}
.a-demo-mobile {
width: 100%;
height: 100%;
}
/* no overflow hidden - used when rotating device */
/* Demovis Popup */
.a-demovis-popup {
text-align: center;
}
.a-demovis-popup .popup-buttons {
text-align: center;
}
.a-demovis-tabs {
text-align: center;
width: 420px;
margin: 0 auto;
}
.a-demovis-tabs ul.body {
min-height: 180px;
}
.a-demovis-tabs ul.head li {
}
.a-demovis-tabs svg.i {
padding: 10px;
border-radius: 100px;
}
.a-demovis-tabs ul.head li.private svg.i {
stroke: #f84235;
fill: #f84235;
}
.a-demovis-tabs ul.head li.private.sel svg.i {
stroke: #fff;
fill: #fff;
background-color: #f84235;
}
.a-demovis-tabs ul.head li.unlisted svg.i {
stroke: #8b7cc9;
fill: #8b7cc9;
}
.a-demovis-tabs ul.head li.unlisted.sel svg.i {
stroke: #fff;
fill: #fff;
background-color: #8b7cc9;
}
.a-demovis-tabs ul.head li.public svg.i {
stroke: #84b100;
fill: #84b100;
}
.a-demovis-tabs ul.head li.public.sel svg.i {
stroke: #fff;
fill: #fff;
background-color: #84b100;
}
.a-demovis-tabs h3.private {
color: #f84235;
}
.a-demovis-tabs h3.unlisted {
color: #8b7cc9;
}
.a-demovis-tabs h3.public {
color: #84b100;
}
.a-demovis-tabs input {
text-align: center;
}
/* Get a Trial */
.a-get-trial {
text-align: center;
}
.a-get-trial h4 {
margin-bottom: 20px;
}
.a-get-trial a.b {
margin-top: 10px;
}
/*
PicApp
*/
.a-picapp-ads {
text-align: center;
max-height: 360px;
}
.a-picapp-ads h4 {
margin-bottom: 30px;
}
a.a-picapp-cont {
display: none;
position: relative;
transform: scale(0.6);
transform-origin: top left;
width: 200px;
height: 200px;
}
.a-picapp-cont img.b {
}
.a-picapp-cont img.scr {
position: absolute;
top: 0;
left: 0;
width: 200px;
height: 356px;
transform-origin: 0px 0px 0px;
transform: matrix3d(
0.543440250149697, -0.3989122142530073, 0, -0.00036369642794244943,
0.30538962284542726, 0.9048663235792523, 0, 0.000009176528766242358,
0, 0, 1, 0,
112, 128, 0, 1
);
}
a.a-picapp-cont2 {
display: none;
position: relative;
transform: scale(0.8);
transform-origin: top center;
height: 100px;
}
.a-picapp-cont2 img.b {
}
.a-picapp-cont2 img.scr {
position: absolute;
top: 0;
left: 0;
height: 200px;
width: 356px;
transform-origin: 0px 0px 0px;
transform: matrix3d(0.848315, 0, 0, 0, -0.324755, 0.366005, 0, -0.00129902, 0, 0, 1, 0, 99, 6, 0, 1)
}
/*
Section: Related
*/
.a-demo-related {
padding: 50px 0;
}
.a-demo-related h3 {
margin: 0 50px 50px;
}
/**********************************************************************************
Mobile
**********************************************************************************/
.a-runmobile {
display: none;
margin-top: 10px;
margin-bottom: 30px;
text-align: center;
width: 100%;
position: relative;
}
.a-runmobile b {
display: inline-block;
vertical-align: top;
width: 40px;
height: 40px;
margin-bottom: 10px;
background-image: url(img/arrow-down-darkblue.svg);
background-size: contain;
position: relative;
top: 10px;
left: -8px;
}
.a-runmobile .a-demo-prev {
width: 90%;
height: auto;
}
.a-runmobile .a-demo-prev:hover {
box-shadow: none;
}
.a-runmobile .a-demo-prev-img {
height: 400px;
width: 90%;
}
.a-addhome-panel {
position: absolute;
top: 20%;
width: 80%;
left: 10%;
padding: 5%;
box-sizing: border-box;
text-align: left;
background-color: rgba(250,250,250,0.9);
color: #444;
box-shadow: 0 0 20px rgba(0,0,0,0.5);
z-index: 2000;
}
.a-addhome-panel a.b {
float: right;
margin-top: 20px;
}
.a-addhome-panel ul {
list-style-type: none;
}
/**********************************************************************************/
@media (max-width: 1024px) {
}
/**********************************************************************************/
@media (max-width: 768px) {
.a-top.demo .ib.ib1 {
display: none;
}
.a-top.demo .ib.ib2 {
display: none;
}
.a-runmobile {
display: block;
}
}
/**********************************************************************************/
@media (max-width: 640px) {
}
/*
Main Page
*/
/*
Section Visuals
*/
.a-top.main {
overflow: hidden;
}
.a-top.main .ib {
position: relative;
}
.a-top.main .iframe-main {
position: relative;
left: -140px;
}
/*
Section Features
*/
.a-features2 {
overflow: hidden;
}
.a-features2 .ib {
padding: 0 20px;
}
.a-features2 .my-website {
display: inline-block;
vertical-align: bottom;
width: 100%;
height: 500px;
background-image: url('img/features-platforms-website.3.png');
background-repeat: no-repeat;
background-size: contain;
background-position: center bottom;
}
.a-features2 .devices {
display: inline-block;
vertical-align: bottom;
width: 80%;
height: 400px;
background-image: url('img/features-devices.png');
background-repeat: no-repeat;
background-size: contain;
background-position: center bottom;
}
.a-features2 .frames {
display: inline-block;
vertical-align: bottom;
width: 90%;
height: 480px;
background-image: url('img/features-frames.2.png');
background-repeat: no-repeat;
background-size: contain;
background-position: center bottom;
transform: scale(1.2);
}
.a-features2 ul {
padding: 20px;
}
/*
Section Gallery
*/
.a-main-gallery {
}
/**********************************************************************************/
@media (max-width: 1024px) {
}
/**********************************************************************************/
@media (max-width: 800px) {
}
/**********************************************************************************/
@media (max-width: 640px) {
.a-top.main .ib.w33 {
width: 100%;
}
.a-top.main .ib.w66 {
display: none;
}
.a-top.main .ib.w50 {
width: 100%;
}
.a-top.main .ib.w40 {
width: 100%;
}
.a-features2 .ib {
padding: 2px;
}
.a-features2 .ib.w50 {
width: 100%;
}
.a-features2 .ib.w40 {
width: 100%;
}
.a-features2 .frames {
transform: scale(1);
}
}
/*
Section Explore Top
*/
.a-top.explore {
position: relative;
}
.a-top.explore a.b {
float: right;
margin-top: 20px;
margin-bottom: -40px;
}
/*
Tags
*/
.a-tags {
text-align: center;
line-height: 40px;
background-color: #bbb;
}
a.a-tag {
margin: 5px;
text-decoration: none;
color: #fff;
border: 1px solid rgba(255,255,255, 0.5);
border-radius: 30px;
padding: 5px 10px;
}
a.a-tag:hover {
background-color: rgba(255,255,255,0.4);
}
/*
Section Explore
*/
.a-explore {
}
.a-explore h4 {
margin: 0 0 30px 40px;
}
.a-explore h4 a {
margin-left: 10px;
text-transform: none;
}
/*
Section Company
*/
.a-company {
min-height: 600px;
}
/*
Demo Prev
*/
.a-demo-prev-list {
}
.a-demo-prev {
width: 295px;
height: 360px;
margin: 10px 0;
text-align: center;
transition: transform 0.2s;
transform-origin: center bottom;
}
.a-demo-prev:hover {
transform: scale(1.05);
}
.a-demo-prev-img {
width: 280px;
height: 280px;
position: relative;
margin: 0 auto;
margin-bottom: 20px;
}
.a-demo-prev-img img {
position: absolute;
top: 0;
left: 0;
object-fit: cover;
object-position: top;
}
.a-demo-prev-img .thumb {
width: 80%;
margin-left: 10%;
height: 100%;
background-repeat: no-repeat;
background-size: contain;
background-position: center bottom;
}
.a-demo-prev-name {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.a-demo-prev small {
color: #888;
}
/**********************************************************************************
Max Width: 1024
**********************************************************************************/
@media (max-width: 1024px) {
}
/**********************************************************************************
Max Width: 768
**********************************************************************************/
@media (max-width: 768px) {
}
/**********************************************************************************
Max Width: 640
**********************************************************************************/
@media (max-width: 640px) {
}
/*
About Page
*/
.a-about-box {
margin: 40px 10px;
}
.a-about-box h3 {
margin: 0 0 10px 60px;
}
.a-about-box p {
margin-left: 60px;
}
.a-about-box .picture {
float: left;
margin-right: 20px;
}
.a-about-raluca,
.a-about-diana,
.a-about-daniel {
width: 150px;
height: 150px;
border-radius: 100px;
background-size: cover;
}
.a-about-raluca {
background-image: url('img/Raluca.png');
}
.a-about-diana {
background-image: url('img/Diana.png');
}
.a-about-daniel {
background-image: url('img/Daniel.png');
}
/*
Contact message
*/
.a-contact {
position: fixed;
bottom: 0;
right: 0;
background-color: #29245c;
color: #fff;
border-radius: 5px 0 0 0;
border-top: 2px solid #29245c;
border-left: 2px solid #29245c;
z-index: 200;
box-shadow: 0 0 1px 1px #fff;
}
.a-contact.show {
background-color: #fff;
color: #444;
}
.a-contact h6 {
margin: 0;
padding: 8px 16px;
border-radius: 8px 0 0 0;
cursor: pointer;
transition: all 0.3s;
}
.a-contact h6:hover {
background-color: #f6f6f6;
color: #29245c;
}
.a-contact p {
width: 0px;
height: 0;
overflow: hidden;
box-sizing: border-box;
padding: 0px;
margin: 0;
border-top: 1px solid #ccc;
transition: all 0.3s;
}
.a-contact.show p {
height: 330px;
width: 260px;
padding: 10px;
}
.a-contact .status {
margin: 10px 0;
}
.a-contact .status.ok {
color: #0a0;
}
.a-contact .status.err {
color: #e00;
}
.a-contact textarea {
width: 240px;
height: 100px;
}
/**********************************************************************************
Max Width: 1024
**********************************************************************************/
@media (max-width: 1024px) {
}
/**********************************************************************************
Max Width: 768
**********************************************************************************/
@media (max-width: 768px) {
}
/**********************************************************************************
Max Width: 500
**********************************************************************************/
@media (max-width: 500px) {
.a-contact {
display: none;
}
}
/*
Pricing Page
*/
.a-top.plans {
}
.a-top.plans a.b {
float: right;
}
.a-pricing {
padding-top: 20px;
}
.a-plans {
text-align: center;
}
.a-plans .ib {
padding-right: 10px;
}
.a-plans-h {
padding: 20px;
color: #fff;
}
.a-plans-h h3 {
font-size: 40px;
}
.a-plans-h i {
font-size: 40%;
font-weight: normal;
font-style: normal;
}
.a-plans-h p {
text-align: center;
}
.a-plans-h a.b {
margin: 20px 0;
}
.a-plans-h a.b.disabled {
visibility: hidden;
}
.a-plans-h small a {
color: #fff;
text-decoration: underline;
}
.a-plans-enterprise {
margin: 0 0 60px;
text-align: center;
}
.a-plans-enterprise a.b {
margin-top: 60px;
}
/*
Section features
*/
.a-plans-features {
}
.a-plans-features .ib {
padding-right: 6%;
padding-bottom: 40px;
}
.a-plans-features h2 {
text-align: left;
margin: 50px 0;
}
.a-plans-features b {
display: inline-block;
padding: 24px;
border-radius: 100px;
margin-bottom: 10px;
}
/*
Section Questions
*/
.a-faq {
}
.a-faq .ib {
}
.a-faq b {
line-height: 50px;
}
.a-faq img {
width: 100%;
}
/*
Section Quotes
*/
.a-quotes {
line-height: 28px;
}
.a-quotes small {
display: block;
padding-top: 10px;
}
.a-quotes a.b {
float: right;
margin-top: 30px;
z-index: 2;
}
.a-whos-using {
background-image: url('/css/img/whos_using.3.jpg');
background-size: contain;
background-repeat: no-repeat;
background-position: center;
height: 210px;
opacity: 0.8;
}
/**********************************************************************************/
@media (max-width: 1024px) {
}
/**********************************************************************************/
@media (max-width: 850px) {
.a-plans .ib {
width: 50%;
}
}
/**********************************************************************************/
@media (max-width: 768px) {
.a-faq .ib {
width: 100%;
}
.a-faq .ib.w4 {
display: none;
}
}
/**********************************************************************************/
@media (max-width: 640px) {
.a-plans-h {
padding: 10px;
}
.a-plans-h h3 {
font-size: 36px;
}
.a-plans-features .ib {
width: 50%;
padding: 10px;
}
.a-plans-features svg.s72 {
width: 56px;
height: 56px;
}
.a-quotes .ib {
width: 100%;
}
}
/*
USecases Page
*/
.a-top.case-studies {
}
.a-top.case-studies a.b {
float: right;
margin-top: 60px;
}
section.a-cs {
}
section.a-cs .f1:nth-child(2),
section.a-cs .f1:nth-child(3) {
margin-left: 20px;
}
section.a-cs img {
max-width: 100%;
max-height: 300px;
}
/**********************************************************************************
Max Width: 1024
**********************************************************************************/
@media (max-width: 1024px) {
}
/**********************************************************************************
Max Width: 768
**********************************************************************************/
@media (max-width: 768px) {
section.a-cs .flex {
flex-direction: column;
}
section.a-cs .f1:nth-child(2),
section.a-cs .f1:nth-child(3) {
margin-top: 30px;
}
}
/*
Section Singin
*/
.a-top.signin {
padding-top: 30px;
}
.a-top.signin .a-box {
padding: 30px;
width: 40%;
}
/*
Sign in with Facebook & Goolge
*/
.a-signin-fg {
display: none;
}
.a-signin-fg a {
display: inline-block;
width: 88px;
height: 40px;
line-height: 40px;
margin: 5px;
text-decoration: none;
color: #fff;
border-radius: 4px;
}
.a-signin-fg a.g {
background-color: #d44332;
}
.a-signin-fg a.f {
background-color: #335191;
}
/*
Form Signin
*/
form.a-signin {
}
form.a-signin input[type="text"],
form.a-signin input[type="email"],
form.a-signin input[type="password"],
form.a-signin input[type="submit"] {
width: 80%;
margin: 5px;
}
/*
Section Singup
*/
.a-top.signup {
padding-top: 30px;
}
.a-top.signup .a-box {
padding: 30px;
width: 60%;
}
form.a-signup {
}
form.a-signup input[type="text"],
form.a-signup input[type="email"],
form.a-signup input[type="password"],
form.a-signup input[type="submit"] {
width: 40%;
margin: 5px 2px;
}
p.a-godaddy-seal {
text-align: center;
margin: 80px 0;
}
.a-signin-form {
text-align: center;
}
.a-signup-form {
width: 430px;
margin: 0 auto;
}
.a-signup-form h3 {
margin: 5px 0 0 0;
}
/**********************************************************************************/
@media (max-width: 1024px) {
}
/**********************************************************************************/
@media (max-width: 800px) {
.a-top.signin .a-box {
width: 60%;
}
}
/**********************************************************************************/
@media (max-width: 640px) {
.a-top.signin .a-box {
width: 90%;
}
form.a-signin input[type="text"],
form.a-signin input[type="email"],
form.a-signin input[type="password"],
form.a-signin input[type="submit"] {
width: 100%;
margin: 5px 0;
}
form.a-signup input[type="text"],
form.a-signup input[type="email"],
form.a-signup input[type="password"],
form.a-signup input[type="submit"] {
width: 90%;
margin: 5px 0;
}
}
/*
User Page
*/
.a-user-demos {
min-height: 600px;
}
/**********************************************************************************
Max Width: 1024
**********************************************************************************/
@media (max-width: 1024px) {
}
/**********************************************************************************
Max Width: 768
**********************************************************************************/
@media (max-width: 768px) {
}
/*
Help Page
*/
.a-top.help {
}
.a-top.help input {
float: right;
position: relative;
top: 30px;
}
section.a-help2 {
}
.a-help2-categories {
}
.a-help2-cat {
padding: 20px 5px;
text-align: center;
white-space: nowrap;
overflow: hidden;
color: #888;
cursor: pointer;
}
.a-help2-cat.create:hover,
.a-help2-cat.create.sel {
color: #ef9020;
}
.a-help2-cat.create:hover svg,
.a-help2-cat.create.sel svg {
stroke: #ef9020;
}
.a-help2-cat.embed:hover,
.a-help2-cat.embed.sel {
color: #8b84d7;
}
.a-help2-cat.embed:hover svg,
.a-help2-cat.embed.sel svg {
stroke: #8b84d7;
}
.a-help2-cat.mobile:hover,
.a-help2-cat.mobile.sel {
color: #4ccfc6;
}
.a-help2-cat.mobile:hover svg,
.a-help2-cat.mobile.sel svg {
stroke: #4ccfc6;
}
.a-help2-cat.media:hover,
.a-help2-cat.media.sel {
color: #f93e36;
}
.a-help2-cat.media:hover svg,
.a-help2-cat.media.sel svg {
stroke: #f93e36;
}
.a-help2-cat.reports:hover,
.a-help2-cat.reports.sel {
color: #84bd00;
}
.a-help2-cat.reports:hover svg,
.a-help2-cat.reports.sel svg {
stroke: #84bd00;
}
.a-help2-articles {
padding-top: 30px;
border-top: 3px solid #ddd;
}
.a-help2-articles.create {
border-color: #ef9020;
}
.a-help2-articles.embed {
border-color: #8b84d7;
}
.a-help2-articles.mobile {
border-color: #4ccfc6;
}
.a-help2-articles.media {
border-color: #f93e36;
}
.a-help2-articles.reports {
border-color: #84bd00;
}
.a-help2-a {
width: 24%;
margin-right: 1%;
margin-bottom: 40px;
padding: 20px;
background-color: #fff;
}
.a-help2-a:hover {
box-shadow: 3px 3px 0px 0px rgba(0,0,0,0.1);
}
.a-help2-a h5 {
text-transform: none;
margin-top: 0;
line-height: 25px;
height: 75px;
overflow: hidden;
}
.a-help2-a p {
color: #888;
line-height: 25px;
height: 75px;
overflow: hidden;
}
.a-help2-a i {
font-style: normal;
background-color: #ff0;
}
/*
Section Manage Help - on two pages: help, manage
*/
.a-manage-help {
padding: 40px 0;
}
.a-manage-help img {
width: 100%;
}
/**********************************************************************************
Max Width: 1024
**********************************************************************************/
@media (max-width: 1024px) {
}
/**********************************************************************************
Max Width: 768
**********************************************************************************/
@media (max-width: 768px) {
}
/**********************************************************************************
Max Width: 640
**********************************************************************************/
@media (max-width: 640px) {
.a-help2-cat h5 {
display: none;
}
.a-help2-a {
width: 49%;
}
.a-manage-help .flex {
flex-direction: column;
}
.a-manage-help .f {
margin: 20px 10px;
}
}
/*
Demostore Page
*/
.a-demostore {
}
.a-demostore .left {
display: inline-block;
vertical-align: top;
width: 60%;
}
.a-demostore .right {
display: inline-block;
vertical-align: top;
width: 38%;
margin-left: 1%;
}
/**********************************************************************************
Max Width: 1024
**********************************************************************************/
@media (max-width: 1024px) {
}
/**********************************************************************************
Max Width: 768
**********************************************************************************/
@media (max-width: 768px) {
.a-demostore .right {
display: none;
}
}
/*
FrameApp
*/
/**********************************************************************************
Max Width: 1024
**********************************************************************************/
@media (max-width: 1024px) {
}
/**********************************************************************************
Max Width: 768
**********************************************************************************/
@media (max-width: 768px) {
}
/*
Enterprise
*/
/*
Header Company
*/
body.a-body-company {
}
body.a-body-company .a-logo {
display: none;
}
/* default logo in case nothing is defined */
body.a-body-company .a-logo-company {
display: inline-block;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
background-image: url(/company/AppDemoStore/ads_logo.4.png);
width: 172px;
height: 32px;
}
body.a-body-company .nav-gallery,
body.a-body-company .nav-pricing,
body.a-body-company .nav-help
{
display: none;
}
/*
Footer Company
*/
body.a-body-company footer h3,
body.a-body-company footer .a-footer-social,
body.a-body-company footer .a-footer-links,
body.a-body-company footer .a-footer-terms2 {
display: none;
}
/********************************************************
AppDemoStore
********************************************************/
body.a-body-company.AppDemoStore .a-logo-company {
background-image: url(/company/AppDemoStore/ads_logo.4.png);
width: 172px;
height: 32px;
}
/********************************************************
Lexmark
********************************************************/
body.a-body-company.Lexmark header {
border-top: 4px solid #3bf33b;
}
body.a-body-company.Lexmark .a-logo-company {
background-image: url(/company/Lexmark/logo.3.png);
width: 200px;
height: 53px;
}
/* remove share unwanted links */
body.a-body-company.Lexmark a.facebook,
body.a-body-company.Lexmark a.google {
display: none;
}
/* make demo preview smaller */
body.a-body-company.Lexmark .a-demo-prev {
width: 238px;
height: 270px;
}
body.a-body-company.Lexmark .a-demo-prev-img {
width: 220px;
height: 220px;
margin-bottom: 10px;
}
/********************************************************
Lexmark - channel
********************************************************/
body.a-body-company.channel header {
border-top: 4px solid #3bf33b;
}
body.a-body-company.channel .a-logo-company {
background-image: url(/company/Lexmark/logo.3.png);
width: 200px;
height: 53px;
}
/* remove share unwanted links */
body.a-body-company.channel a.facebook,
body.a-body-company.channel a.google {
display: none;
}
/* make demo preview smaller */
body.a-body-company.channel .a-demo-prev {
width: 238px;
height: 270px;
}
body.a-body-company.channel .a-demo-prev-img {
width: 220px;
height: 220px;
margin-bottom: 10px;
}
/********************************************************
Lexmark - Dell
********************************************************/
body.a-body-company.DellDemos .a-logo-company {
background-image: url(/company/DellDemos/dell_2016_logo.png);
width: 100px;
height: 100px;
}
/********************************************************
Lexmark DACH
********************************************************/
body.a-body-company.lexmark_dach header {
border-top: 4px solid #3bf33b;
}
body.a-body-company.lexmark_dach .a-logo-company {
background-image: url(/company/lexmark_dach/logo.3.png);
width: 200px;
height: 53px;
}
/********************************************************
Lexmark EMEA
********************************************************/
body.a-body-company.lexmark_emea header {
border-top: 4px solid #3bf33b;
}
body.a-body-company.lexmark_emea .a-logo-company {
background-image: url(/company/lexmark_emea/logo.3.png);
width: 200px;
height: 53px;
}
/********************************************************
Veeva
********************************************************/
body.a-body-company.Veeva .a-logo-company {
background-image: url(/company/Veeva/Veeva_logo.png);
width: 174px;
height: 40px;
}
/********************************************************
EditDigital
********************************************************/
body.a-body-company.EditDigital .a-logo-company {
background-image: url(/company/EditDigital/logo.png);
width: 213px;
height: 40px;
}
/********************************************************
SAP
********************************************************/
body.a-body-company.SAP .a-logo-company {
background-image: url(/company/SAP/sap_logo.1.png);
width: 122px;
height: 62px;
margin-top: 5px;
}
body.a-body-company.SAP_IT_Showroom .a-logo-company {
background-image: url(/company/SAP/sap_logo.1.png);
width: 122px;
height: 62px;
margin-top: 5px;
}
/********************************************************
KeyPlan
********************************************************/
body.a-body-company.KeyPlan .a-logo-company {
background-image: url(/company/KeyPlan/KeyPlan.png);
width: 200px;
height: 73px;
}
/********************************************************
EntrepreneursDurham
********************************************************/
body.a-body-company.EntrepreneursDurham .a-logo-company {
background-image: url(/company/EntrepreneursDurham/EntrepreneursDurham.png);
width: 200px;
height: 98px;
}
/********************************************************
Empreandes
********************************************************/
body.a-body-company.Empreandes .a-logo-company {
background-image: url(/company/Empreandes/Empreandes.png);
width: 160px;
height: 160px;
box-shadow: 0 0 1px #000;
}
/********************************************************
Siemens_Compas
********************************************************/
body.a-body-company.SiemensCompas .a-logo-company {
background-image: url(/company/SiemensCompas/siemens_logo.1.png);
width: 200px;
height: 90px;
margin-top: 5px;
}
/********************************************************
Life Time Health
********************************************************/
body.a-body-company.LifeTimeHealth .a-logo-company {
background-image: url(/company/LifeTimeHealth/LT_Health.png);
width: 160px;
height: 60px;
}
/********************************************************
Bocconi
********************************************************/
body.a-body-company.Bocconi .a-logo-company {
background-image: url(/company/Bocconi/bocconi_logo_381x80.png);
width: 190px;
height: 40px;
}
/* remove share links */
body.a-body-company.Bocconi div.a-demo-social {
display: none;
}
/********************************************************
Spherik
********************************************************/
body.a-body-company.Spherik .a-logo-company {
background-image: url(/company/Spherik/spherik.png);
width: 180px;
height: 56px;
}
/********************************************************
Dell EMC
********************************************************/
body.a-body-company.DellEMC .a-logo-company {
background-image: url(/company/DellEMC/DellEMC-logo.png);
width: 200px;
height: 50px;
}
body.a-body-company.DellEMC #a-demo-cb {
background-color: rgba(128, 128, 128, 0.95);
}
body.a-body-company.DellEMC #a-demo-cb.open {
background-color: rgba(128, 128, 128, 0.99);
}
/********************************************************
Dell Technologies (old DellEMC)
********************************************************/
body.a-body-company.DellTechnologies .a-logo-company {
background-image: url(/company/DellTechnologies/DellTech_Logo.png);
width: 250px;
height: 50px;
}
body.a-body-company.DellTechnologies #a-demo-cb {
background-color: rgba(128, 128, 128, 0.95);
}
body.a-body-company.DellTechnologies #a-demo-cb.open {
background-color: rgba(128, 128, 128, 0.99);
}
/********************************************************
Dell DellTransformation
********************************************************/
body.a-body-company.DellTransformation .a-logo-company {
background-image: url(/company/DellTechnologies/Dell-logo.png);
width: 90px;
height: 40px;
}
body.a-body-company.DellTransformation #a-demo-cb {
background-color: rgba(128, 128, 128, 0.95);
}
body.a-body-company.DellTransformation #a-demo-cb.open {
background-color: rgba(128, 128, 128, 0.99);
}
/** Show only for Dell **************************************/
.show-dell {
display: none;
}
body.a-body-company.DellTechnologies .show-dell,
body.a-body-company.DellTransformation .show-dell {
display: block;
}
.ad2-design-toolbar b.show-dell {
display: none;
}
body.a-body-company.DellTechnologies .ad2-design-toolbar b.show-dell,
body.a-body-company.DellTransformation .ad2-design-toolbar b.show-dell {
display: inline-block;
}
/********************************************************
RBS
********************************************************/
body.a-body-company.NatWest .a-logo-company {
background-image: url(/company/RBS/nw-logo.png);
width: 120px;
height: 120px;
}
body.a-body-company.RoyalBankOfScotland .a-logo-company {
background-image: url(/company/RBS/rbs-logo.2.png);
width: 200px;
height: 50px;
}
body.a-body-company.UlsterBank .a-logo-company {
background-image: url(/company/RBS/ub-logo.png);
width: 200px;
height: 50px;
}
/* Disable public demos */
body.a-body-company.RoyalBankOfScotland #tabs-vis2 ul.head li.public,
body.a-body-company.NatWest #tabs-vis2 ul.head li.public,
body.a-body-company.UlsterBank #tabs-vis2 ul.head li.public {
display: none;
}
/********************************************************
NatWest Departments
********************************************************/
/* Disable public demos */
body.a-body-company.CPBDigitalServices #tabs-vis2 ul.head li.public,
body.a-body-company.NWDigitalExperience #tabs-vis2 ul.head li.public {
display: none;
}
/********************************************************
RBS old
********************************************************/
body.a-body-company.RBSMobileExperience .a-logo-company {
background-image: url(/company/RBS/rbs-logo.2.png);
width: 200px;
height: 50px;
}
body.a-body-company.RBSICustomerExperience .a-logo-company {
background-image: url(/company/RBS/rbsi.png);
width: 200px;
height: 50px;
}
body.a-body-company.RBSEverydayBanking .a-logo-company {
background-image: url(/company/RBS/rbs-logo.2.png);
width: 200px;
height: 50px;
}
/********************************************************
USATruck
********************************************************/
body.a-body-company.USATruck .a-logo-company {
background-image: url(/company/USATruck/USATruck-logo.png);
width: 180px;
height: 60px;
}
/********************************************************
PingIdentity
********************************************************/
body.a-body-company.PingIdentity .a-logo-company {
background-image: url(/company/PingIdentity/Ping-Logo.svg);
width: 60px;
height: 60px;
}
/********************************************************
PropellerHealth
********************************************************/
body.a-body-company.PropellerHealth .a-logo-company {
background-image: url(/company/PropellerHealth/propeller_logo.png);
width: 180px;
height: 60px;
}
/********************************************************
SCB
********************************************************/
body.a-body-company.SCB .a-logo-company {
background-image: url(/company/SCB/scb-logo.png);
width: 90px;
height: 90px;
}
/********************************************************
Navattic Partner
********************************************************/
body.a-body-company.NavatticPartner .a-logo-company {
background-image: url(/company/NavatticPartner/navattic-glyph-white.png);
width: 90px;
height: 90px;
}
/*
Runner
*/
.ar-runner {
position: relative;
}
.ar-frame {
position: absolute;
top: 0px;
left: 0px;
}
.ar-corner {
position: absolute;
z-index: 2000;
/* needed in IE11 */
width: auto;
height: auto;
}
.ar-corner.c1 {
left: 0;
top: 0;
}
.ar-corner.c2 {
right: 0;
top: 0;
}
.ar-corner.c3 {
right: 0;
bottom: 0;
}
.ar-corner.c4 {
left: 0;
bottom: 0;
}
.ar-corner.ct {
top: 0;
left: 50%;
}
.ar-corner.cl {
left: 0;
top: 50%;
}
.ar-frame-p {
background-repeat: no-repeat;
position: absolute;
z-index: 2000;
}
.ar-home {
position: absolute;
/*
background-color: rgba(255,0,0,0.2);
*/
}
.ar-demo {
position: absolute;
}
/*
Runner Cursors
*/
.ar-cursor-0 .ar-runner {
cursor: auto;
}
.ar-cursor-1 .ar-runner {
cursor: url(img/hand-white.7.png) 14 7, auto;
}
.ar-cursor-2 .ar-runner {
cursor: url(img/mouse-arrow-black.4.png) 1 1, auto;
}
.ar-cursor-0 .ar-home,
.ar-cursor-0 .ar-tb-b,
.ar-cursor-0 .ar-tb-b2,
.ar-cursor-0 a,
.ar-cursor-0 .ar-o2.hs,
.ar-cursor-0 .ar-o2.bu,
.ar-cursor-0 .ar-o2.cb,
.ar-cursor-0 .ar-o2.rb {
cursor: pointer;
}
.ar-cursor-1 .ar-home,
.ar-cursor-1 .ar-tb-b,
.ar-cursor-1 .ar-tb-b2,
.ar-cursor-1 a,
.ar-cursor-1 .ar-o2.hs,
.ar-cursor-1 .ar-o2.bu,
.ar-cursor-1 .ar-o2.cb,
.ar-cursor-1 .ar-o2.rb {
cursor: url(img/hand-orange.7.png) 14 7, auto;
}
.ar-cursor-2 .ar-home,
.ar-cursor-2 .ar-tb-b,
.ar-cursor-2 .ar-tb-b2,
.ar-cursor-2 a,
.ar-cursor-2 .ar-o2.hs,
.ar-cursor-2 .ar-o2.bu,
.ar-cursor-2 .ar-o2.cb,
.ar-cursor-2 .ar-o2.rb {
cursor: url(img/mouse-arrow-orange.4.png) 1 1, auto;
}
/*
Loading
*/
.ar-demo-loading {
width: 100%;
height: 100%;
background-color: rgba(0,0,0,0.7);
z-index: 1000;
position: absolute;
top: 0;
left: 0;
}
.ar-demo-loading .a-loader {
position: absolute;
top: 50%;
left: 50%;
margin-top: -16px;
margin-left: -16px;
}
.ar-demo-loading h3 {
width: 100%;
position: absolute;
bottom: 10%;
text-align: center;
color: #eee;
font-size: 16px;
}
.ar-demo-loading b {
font-size: 18px;
}
/*
ADS
*/
.ar-ads {
position: absolute;
right: 0;
bottom: 0;
width: 0;
height: 0;
border-style: solid;
border-color: rgba(0,0,0,0.6) transparent;
border-bottom-width: 60px;
border-left-width: 140px;
border-top-width: 0;
border-right-width: 0;
}
.ar-ads a {
position: absolute;
right: 0;
top: 10px;
line-height: 22px;
text-decoration: none;
text-align: right;
font-size: 13px;
padding: 4px;
color: #eee;
letter-spacing: -0.5px;
}
/*
Toolbar
*/
.ar-toolbar {
width: 100%;
height: 26px;
line-height: 26px;
position: absolute;
opacity: 0;
color: #fff;
background-color: #000;
top: 100%;
height: 0;
overflow: hidden;
z-index: 3000;
transition: all 0.3s ease;
}
.ar-runner:hover .ar-toolbar {
height: 26px;
opacity: 0.7;
}
.ar-runner:hover .ar-toolbar:hover {
opacity: 1;
}
.ar-toolbar-left {
text-align: left;
position: absolute;
left: 0;
}
.ar-toolbar-center {
text-align: center;
}
.ar-toolbar-right {
text-align: right;
position: absolute;
right: 0;
}
.ar-tb-b, .ar-tb-b2 {
display: inline-block;
vertical-align: top;
width: 20px;
height: 20px;
margin: 3px;
opacity: 0.8;
}
.ar-tb-b:hover, .ar-tb-b2:hover {
opacity: 1;
}
.ar-tb-b {
}
.ar-tb-b2 {
}
.ar-tb-prev {
}
.ar-tb-next {
}
.ar-tb-screenno {
display: inline-block;
line-height: 24px;
vertical-align: top;
font-size: 11px;
margin: 0;
}
.ar-tb-ads {
font-size: 11px;
margin: 0 2px;
display: inline-block;
vertical-align: top;
line-height: 26px; /* same as toolbar height */
}
.ar-tb-ads a{
color: #fff;
}
.ar-tb-ads a:hover, .ar-tb-ads a:visited {
color: #fff;
}
/*
Demo
*/
.ar-screens {
position: absolute;
overflow: hidden;
-webkit-mask-image: -webkit-radial-gradient(white, black); /* needed in Safari to round the corners */
}
.ar-screen {
position: absolute;
top: 0px;
left: 0px;
display: none;
background-color: #000;
font-size: 0;
transition-property: left,top,opacity;
transition-duration: 0.3s;
transition-timing-function: ease-in-out;
transform: translate3d(0,0,0);
overflow: hidden;
}
.ar-screen .scroll-top {
position: absolute;
width: 100%;
top: 0;
background-position: top;
background-size: cover;
overflow: hidden;
z-index: 30; /* needs to be higher than z-index of components - e.g.: Hotspot is 20 */
}
.ar-screen .scroll-bot {
position: absolute;
width: 100%;
bottom: 0;
background-position: bottom;
background-size: cover;
overflow: hidden;
z-index: 30; /* needs to be higher than z-index of components - e.g.: Hotspot is 20 */
}
.ar-screen .scroll-mid {
position: relative; /* to be able to add controls - needed on mobile when the native scroll is used */
width: 100%;
height: 100%;
}
/*
relative - needs to be centered in 'fit screen' scenario
no absolute - won't work with native scrolling on mobile
*/
.ar-screen-img {
position: relative;
}
/* Demo Panel - Feedback & Leads */
.ar-demo-panel {
display: none;
position: absolute;
background-color: #222;
color: #ccc;
opacity:0.9;
width: 100%;
height: 100%;
overflow-y: auto;
text-align: center;
z-index: 3000;
cursor: auto;
}
.ar-demo-panel .panel {
display: none;
}
.ar-demo-panel h4 {
font-size: 16px;
margin: 40px 10% 20px;
color: #fff;
text-transform: initial;
}
.ar-demo-panel .status {
font-size: 12px;
color: #f90;
margin-top: 5px;
}
.ar-demo-panel input[type='text'],
.ar-demo-panel input[type='email'],
.ar-demo-panel textarea {
width: 80%;
max-width: 200px;
font-size: 12px;
margin: 5px;
vertical-align: top;
}
.ar-demo-panel div.submit {
padding: 0 10%;
font-size: 12px;
}
.ar-demo-panel span {
}
.ar-demo-panel button {
display: block;
margin: 15px 0;
margin-left: 50%;
transform: translateX(-50%);
}
/*
Ad
*/
a.ar-ad3 {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 20px;
line-height: 20px;
color: #fff;
font-size: 14px;
font-family: Arial;
text-align: center;
text-shadow: 0 0 2px #000;
background-color: rgba(0,0,0,0.6);
z-index: 200;
overflow: hidden;
transition: all 0.4s;
}
a.ar-ad3:hover {
color: #fff;
background-color: rgba(0,0,0,0.8);
}
/* Embedder Builder */
.ar-embedder-builder{
}
.ar-eb-size {
display: inline-block;
margin: 10px 30px;
vertical-align: bottom;
font-size: 11px;
text-align: center;
}
.ar-eb-size-box, .ar-eb-size-box-sel {
display: inline-block;
border: 3px solid #ccc;
border-radius: 8px;
}
.ar-eb-size-box:hover {
background-color: #fff;
}
.ar-eb-size-box-sel {
background-color: #fff;
border-color: #8b84d7;
}
.ar-embedder-builder input{
width: 96%;
}
/*
Scrolling
*/
.a-scroll {
width: 100%;
height: 100%;
position: absolute;
overflow: hidden;
background-color: rgba(0,0,0,0.2);
z-index: 2;
opacity: 0;
-moz-transition: opacity 0.5s;
-webkit-transition: opacity 0.5s;
-o-transition: opacity 0.5s;
transition: opacity 0.5s;
}
.a-scroll-v {
width: 6px;
top: 0;
right: 0;
}
.a-scroll-h {
height: 6px;
left: 0;
bottom: 0;
}
.a-scroll-thumb {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
background-color: rgba(0,0,0,0.6);
border-radius: 3px;
-moz-transition: top 0.5s, left 0.5s;
-webkit-transition: top 0.5s, left 0.5s;
-o-transition: top 0.5s, left 0.5s;
transition: top 0.5s, left 0.5s;
}
/* Objects *******************************************************************************************************/
.ar-o2 {
position: absolute;
font-family: Arial;
box-sizing: content-box; /* temporary */
display: none; /* by default all are hidden - show after timeout */
/* reset general line-height - let text have line-height depending on the size */
/*line-height: initial; - not supported in IE*/
line-height: normal;
}
.ar-o2.show {
display: block;
}
/* hotspot */
.ar-o2.hs {
border: 2px solid #ff5500;
opacity: 0.9;
background-repeat: no-repeat;
background-size: contain;
background-position: center;
z-index: 20; /* needs to come on top of Callout(10) */
}
div.ar-screens.hm-false .ar-o2.hs {
border-color: transparent !important;
}
div.ar-screens.no-hs .ar-o2.hs {
border-color: transparent !important;
}
div.ar-screens.no-ca .ar-o2.ca,
div.ar-screens.no-ca .ar-o2.ar {
display: none !important;
}
/* arrow */
.ar-o2.ar {
z-index: 2; /* on top of other elements */
}
/* arrow svg - let it pain outside the svg canvas - needed when the lineWidth is thick */
.ar-o2.ar svg {
overflow: visible;
}
/* timer */
.ar-o2.ti {
display: none;
}
/* textbox */
.ar-o2.tb {
border-style: solid;
border-width: 0;
}
.ar-o2.tb .text {
display: table-cell;
text-align: center;
vertical-align: middle;
box-sizing: border-box;
}
/* button */
.ar-o2.bu {
border-style: solid;
border-width: 0;
z-index: 2;
}
.ar-o2.bu .text {
display: table-cell;
text-align: center;
vertical-align: middle;
box-sizing: border-box;
}
/* button box */
.ar-o2.bub {
border-style: solid;
border-width: 0;
text-align: center;
z-index: 3;
}
.ar-o2.bub .b {
border-style: solid;
border-color: inherit;
border-width: 0;
cursor: default;
}
/* check & radio box */
.ar-o2.cb {}
.ar-o2.rb {}
/* callout */
.ar-o2.ca {
z-index: 10;
}
.ar-o2.ca .text {
display: table-cell;
text-align: center;
vertical-align: middle;
box-sizing: border-box;
}
.ar-o2.ca .tip1, .ar-o2.ca .tip2 {
position: absolute;
width: 0;
height: 0;
border-style: solid;
border-width: 0;
}
.ar-o2.ca .close1 {
position: absolute;
top: 0;
right: 0;
padding: 0 8px;
font-size: 160%;
}
.ar-o2.ca .close1:hover {
transform: scale(1.2);
}
/* link */
.ar-o2.li {
border-style: solid;
border-width: 0;
z-index: 2;
}
.ar-o2.li:hover {
/* text-decoration: underline; -- removed - we have hover colors */
}
.ar-o2.li .text {
display: table-cell;
text-align: center;
vertical-align: middle;
box-sizing: border-box;
}
.ar-o2.li a {
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
/* textinput */
.ar-o2.tin {
border-style: solid;
border-width: 0;
}
.ar-o2.tin input {
width: 100%;
height: 100%;
font-size: inherit;
font-family: inherit;
font-weight: inherit;
color: inherit;
background-color: transparent;
border-width: 0;
padding: 0;
margin: 0;
padding-left: 6%;
}
/* image & GIF */
.ar-o2.im {
background-size: contain;
background-repeat: no-repeat;
}
.ar-o2.gif {
}
.ar-o2.gif img {
max-width: 100%;
max-height: 100%;
}
.ar-o2.im.strans {
display: none;
}
.ar-o2.gif.strans {
display: none;
}
.ar-screen.trans .ar-o2.im.strans,
.ar-screen.trans .ar-o2.gif.strans {
display: block;
}
/* speech */
.ar-o2.sp {
display: none;
}
/* video */
.ar-o2.vi {
background-color: #000;
}
.ar-o2.vi iframe {
border: 0 none;
width: 100%;
height: 100%;
}
.ar-o2.vi video {
width: 100%;
height: 100%;
}
/* iframe */
.ar-o2.if {
/* enable scrolling in iOS */
-webkit-overflow-scrolling: touch;
background-color: #fff;
}
.ar-o2.if iframe {
width: 100%;
height: 100%;
border: 0 none;
}
/* demo */
.ar-o2.demo {
}
.ar-o2.demo iframe {
width: 100%;
height: 100%;
border: 0 none;
}
/* scroll */
.ar-o2.sc {
background-color: #aaa;
}
.ar-o2.sc .overflow {
width: 100%;
height: 100%;
overflow: hidden;
position: relative;
/* enable scrolling in iOS */
-webkit-overflow-scrolling: touch;
}
.ar-o2.sc .overflow:hover .a-scroll {
opacity: 1;
}
.ar-o2.sc .overflow img {
}
.ui-resizable-handle {
border: 1px solid #000;
background-color: rgba(0,200,255,1);
}
.ui-icon-gripsmall-diagonal-se {
background-image: none;
}
.ui-resizable-se {
width: 9px;
height: 9px;
right: -5px;
bottom: -5px;
}
.ui-resizable-n,
.ui-resizable-s {
width: 9px;
height: 9px;
left: 50%;
margin-left: -4px;
}
.ui-resizable-e,
.ui-resizable-w {
width: 9px;
height: 9px;
top: 50%;
margin-top: -4px;
}
/* both needed - jquery bug ?? */
.ui-draggable-disabled > .ui-resizable-handle,
.ui-resizable-disabled > .ui-resizable-handle {
visibility: hidden;
}
.ad-o.ui-resizable-disabled > b.del,
.ad-o.ui-draggable-disabled > b.del,
.ad-o.ui-resizable-disabled > b.del,
.ad-o.ui-draggable-disabled > b.del {
display: none;
}
.ad-o2.ui-resizable-disabled > b.del,
.ad-o2.ui-draggable-disabled > b.del,
.ad-o2.ui-resizable-disabled > .ad-o-handle,
.ad-o2.ui-draggable-disabled > .ad-o-handle {
display: none;
}
.ui-state-disabled, .ui-widget-content .ui-state-disabled, .ui-widget-header .ui-state-disabled {
opacity: 1;
}
/*
Manage
*/
.a-top.manage {
padding: 0;
text-align: center;
position: relative;
}
.a-top.manage h3 {
position: absolute;
width: 100%;
}
.ad-manage-page {
padding: 0;
}
/*
Manage buttons
*/
.ad-manage-buttons {
position: relative;
}
.ad-create-demo {
float: right;
}
.ad-manage-buttons span.bi {
margin-right: 30px;
}
/* Billing details */
.ad-billing-message {
background-color: #ddd;
padding: 10px;
margin: 0 10px;
text-align: center;
}
/*
Manage list
*/
.ad-manage {
min-height: 400px;
padding: 10px 0;
}
.ad-manage-list {
}
.ad-manage-list .hello {
margin-left: 60px;
}
.ad-manage-list .hello h2 {
}
.ad-manage-list .hello i {
background-color: #444;
color: #fff;
display: inline-block;
width: 20px;
height: 20px;
line-height: 20px;
text-align: center;
margin-right: 5px;
border-radius: 20px;
font-style: normal;
}
.ad-manage-demo.create {
text-align: center;
padding: 30px 20px;
cursor: pointer;
}
.ad-manage-demo.create.update {
background-color: #ef9020;
color: #fff;
}
.ad-manage-demo.create h1 {
text-align: left;
}
.ad-manage-demo.create p {
font-size: 18px;
}
.ad-manage-demo {
margin: 8px;
height: 280px;
overflow: hidden;
background-color: #fff;
position: relative;
color: #aaa;
text-align: left;
border-radius: 3px;
}
.ad-manage-demo:hover {
box-shadow: 3px 3px 0px 0px rgba(0,0,0,0.1);
}
.ad-manage-demo-head {
position: relative;
padding: 15px;
padding-bottom: 1px;
}
.ad-manage-demo-name {
display: block;
margin-right: 20px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.ad-manage-vis {
position: absolute;
top: 12px;
right: 15px;
}
.ad-manage-vis.private svg.i {
fill: #f84235;
stroke: #f84235;
}
.ad-manage-vis.unlisted svg.i {
fill: #8b7cc9;
stroke: #8b7cc9;
}
.ad-manage-vis.public svg.i {
fill: #84b100;
stroke: #84b100;
}
.ad-manage-demo-head p {
}
.ad-manage-demo-head .right {
float: right;
}
.ad-manage-demo-head .a-dropdown {
position: absolute;
right: 3px;
bottom: -5px;
background-color: transparent;
border-color: transparent;
}
.ad-manage-demo-head .a-dropdown ul {
left: initial;
right: 0px;
}
.ad-manage-demo-prev {
display: block;
text-align: center;
padding: 15px;
border-top: 1px solid #ddd;
clear: both;
}
.ad-manage-demo-prev .a-demo-prev-img .thumb {
background-position: center top;
}
/* Popup ***************************************************************************/
#popup-copy-user input[type=text] {
padding: 2px 5px;
font-size: 14px;
margin-top: 5px;
}
#popup-copy-user ul.alist {
max-height: 300px;
overflow: auto;
}
/**********************************************************************************/
@media (max-width: 960px) {
.ad-manage-list .ib {
width: 33%;
}
}
/**********************************************************************************/
@media (max-width: 750px) {
.ad-manage-list .ib {
width: 50%;
}
}
/**********************************************************************************/
@media (max-width: 640px) {
.ad-create-demo {
float: none;
text-align: right;
}
}
/**********************************************************************************/
@media (max-width: 490px) {
.ad-manage-list .ib {
width: 100%;
}
}
/* Enterprise Settings *********************************************************************************************************/
.ads-enterprise {
}
.ads-enterprise i {
background-color: #ddd;
border-radius: 4px;
font-size: 80%;
padding: 5px;
font-weight: bold;
font-style: normal;
margin-right: 5px;
}
.ads-enterprise i.a {
background-color: #6cace4;
color: #fff;
}
#template_select option:first-child {
color: #ccc;
}
/* Enterprise Demos ******************************************************************/
.ad-en-users {
min-height: 600px;
margin-top: 15px;
}
.ad-en-users .userh,
.ad-en-users .user {
margin-bottom: 2px;
color: #aaa;
}
.ad-en-users .userh span {
background-color: #ddd;
color: #666;
height: 35px;
line-height: 30px;
cursor: default;
}
.ad-en-users .userh b {
font-weight: normal;
}
.ad-en-users .userh b:hover {
color: #0a78ff;
}
.ad-en-users span {
display: inline-block;
vertical-align: top;
font-size: 12px;
background-color: #fff;
margin-right: 2px;
position: relative;
padding: 0 10px;
height: 35px;
line-height: 35px;
cursor: default;
}
.ad-en-users .user.sel span,
.ad-en-users .user:hover span {
background-color: #eee;
}
.ad-en-users .name {
width: 20%;
color: #000;
}
.ad-en-users .usern {
width: 15%;
}
.ad-en-users .email {
width: 20%;
color: #000;
}
.ad-en-users .login {
width: 15%;
text-align: right;
}
.ad-en-users .nod {
width: 15%;
text-align: right;
}
.ad-en-users .tags {
width: 13%;
}
/* Enterprise Demos ******************************************************************/
.ad-subs-demos {
width: 100%;
margin-top: 15px;
}
.ad-subs-demos .demo {
margin-bottom: 2px;
color: #aaa;
}
.ad-subs-demos td {
background-color: #fff;
margin-right: 2px;
position: relative;
padding: 5px 10px;
font-size: 12px;
}
.ad-subs-demos tr.h td {
background-color: #ddd;
color: #666;
height: 35px;
line-height: 30px;
cursor: default;
}
.ad-subs-demos tr.h b {
font-weight: normal;
}
.ad-subs-demos tr.h b:hover {
color: #0a78ff;
}
.ad-subs-demos input {
height: 100%;
vertical-align: top;
padding: 0 5px;
font-size: 12px;
}
.ad-subs-demos input.id {
width: 95%;
}
.ad-subs-demos input.iu {
width: 60%;
float: right;
}
.ad-subs-demos .name {
width: 35%;
padding-right: 30px;
}
.ad-subs-demos u {
font-style: normal;
background-color: #ff0;
text-decoration: none;
}
.ad-subs-demos .ad-manage-vis {
position: absolute;
top: 5px;
right: 10px;
}
.ad-subs-demos tr.h b.ad-manage-vis svg.i {
fill: #888;
stroke: #888;
}
.ad-subs-demos tr.h b.ad-manage-vis:hover svg.i {
fill: #0a78ff;
stroke: #0a78ff;
}
.ad-subs-demos .screens {
width: 10%;
text-align: right;
}
.ad-subs-demos .views {
width: 11%;
text-align: right;
}
.ad-subs-demos .last {
width: 10%;
text-align: right;
}
.ad-subs-demos .user {
width: 21%;
}
/* Merge *********************************/
#popup-merge-demos input {
width: 40vw;
}
#filter-demos {
position: fixed;
background-color: #fff;
padding: 10px 0;
box-shadow: 0 0 10px #000;
max-height: 120px;
overflow-y: scroll;
display: none;
}
#filter-demos div {
padding: 0 10px;
cursor: pointer;
}
#filter-demos div:hover {
background-color: #ddd;
}
#filter-demos i {
color: #aaa;
padding: 0 10px;
}
/*
Edit pages
*/
.ad-edit-page {
padding: 0;
background-color: #ccc;
height: 100%;
display: flex;
flex-direction: column;
}
.ad-editor-bar {
font-size: 0;
}
.ad-editor-bar h6 {
margin-left: 20px;
margin-top: 20px;
color: #ddd;
}
.ad-editor-bar input {
background-color: transparent;
border-radius: 0;
border: none;
border-bottom: 1px dashed rgba(255,255,255,0.4);
padding: 0 5px;
margin: 17px 5% 0;
width: 90%;
color: #fff;
font-size: 13px;
}
.ad-editor-bar ul {
margin: 0;
padding: 0;
text-align: center;
}
.ad-editor-bar li {
display: inline-block;
margin: 0;
padding: 0 20px;
height: 50px;
line-height: 50px;
}
.ad-editor-bar li.sel {
background-color: #ccc;
}
.b.ad-button-done {
border-radius: 0;
height: 50px;
line-height: 50px;
padding-top: 0;
padding-bottom: 0;
}
.b.ad-button-done:hover {
box-shadow: 0px 4px 0px 0px rgba(0,0,0,0.2);
}
.ad-button-close {
display: inline-block;
vertical-align: top;
padding: 10px 10px 0;
}
/**********************************************************************************/
@media (max-width: 1024px) {
}
/**********************************************************************************/
@media (max-width: 768px) {
}
/**********************************************************************************/
@media (max-width: 640px) {
}
.ad-o-handle {
position: absolute;
width: 8px;
height: 8px;
border: 1px solid #000;
opacity: 0.8;
background-color: #ffff00;
cursor: grab;
z-index: 91;
}
/* Properties buttons */
.ad-tb-p-slidercont {
display: inline-block;
white-space: nowrap;
font-size: 9px;
}
.ad-tb-p-slider {
display: inline-block;
width: 125px;
margin-left: 5px;
margin-right: 10px;
vertical-align: middle;
background-color: #ccc;
border: none;
height: 4px;
}
.ad-tb-p-slider .ui-slider-handle {
border-radius: 100px;
border: none;
background: #0a78ff;
width: 13px;
height: 13px;
top: -5px;
}
input.ad-tb-p-sliderval {
display: inline-block;
width: 20px;
font-size: 9px;
text-align: right;
padding: 0;
border-radius: 0;
border: 0 none;
border-bottom: 1px solid #ccc;
background-color: rgba(255,255,255,0);
}
input.ad-tb-p-sliderval:hover,
input.ad-tb-p-sliderval:focus {
box-shadow: 0 0 1px #000;
background-color: rgba(255,255,200,0.2);
}
/*
Transitions
*/
.ad-screen-transition .d-dropdown-pop {
width: 240px;
font-size: 10px;
left: -100px;
}
.ad-screen-transition hr {
border: none;
border-top: 1px solid #aaa;
}
.ad-screen-transition input {
width: 20px;
font-size: 10px;
}
.ad-trans {
padding: 2px;
border: 2px solid #eee;
display: inline-block;
}
.ad-trans:HOVER {
border-color: #0a78ff;
}
.ad-trans-sel {
border-color: #0a78ff;
}
.ad-trans-icon {
background-image: url('img/adsprite_transitions.2.png');
width: 32px;
height: 32px;
display: inline-block;
}
.ad-trans .no {
background-position: 0px 0px;
}
.ad-trans .fade {
background-position: -32px 0px;
}
.ad-trans .sli {
background-position: -64px 0px;
}
.ad-trans .slo {
background-position: -96px 0px;
}
.ad-trans .slb {
background-position: -128px 0px;
}
.ad-trans .sri {
background-position: -160px 0px;
}
.ad-trans .sro {
background-position: -192px 0px;
}
.ad-trans .srb {
background-position: -224px 0px;
}
.ad-trans .sui {
background-position: -256px 0px;
}
.ad-trans .suo {
background-position: -288px 0px;
}
.ad-trans .sub {
background-position: -320px 0px;
}
.ad-trans .sdi {
background-position: -352px 0px;
}
.ad-trans .sdo {
background-position: -384px 0px;
}
.ad-trans .sdb {
background-position: -416px 0px;
}
.ad-trans .loading-screen {
background-position: -448px 0px;
}
/*
Gestures
*/
.ad-hotspot-gesture {
width: 176px;
font-size: 10px;
}
.ad-gest {
width: 40px;
height: 40px;
margin: 2px;
padding: 2px;
border: 2px solid #eee;
display: inline-block;
background-size: contain;
}
.ad-gest.image {
width: 84px;
line-height: 30px;
text-align: center;
font-size: 12px;
font-weight: bold;
}
.ad-gest:HOVER {
border-color: #0a78ff;
}
.ad-gest.sel {
border-color: #0a78ff;
}
/*
Arrow Style
*/
.ad-arrow-style {
line-height: 0;
width: 120px;
}
.ad-arrow-style svg {
border: 2px solid transparent;
}
.ad-arrow-style svg.sel {
border-color: #0a78ff;
}
/*
Loader
*/
.ad-loader {
position: relative;
}
.ad-loader input {
opacity: 0;
position: absolute;
top: 0;
left: 0;
z-index: -1;
}
.ad-loader-button {
display: inline-block;
background-color: #ccc;
border-radius: 6px;
border: 1px solid #444;
font-size: 14px;
font-weight: bold;
text-shadow: 1px 1px 1px #fff;
padding-left: 20px;
padding-right: 5px;
line-height: 24px;
}
.ad-loader-button .a-loader {
width: 24px;
height: 24px;
margin: 2px;
visibility: hidden;
}
.ad-loader-working .ad-loader-button .a-loader {
visibility: visible;
}
/**********************************************************************************
Mobile
**********************************************************************************/
.ad-designer-mobile {
display: none;
}
.ad-designer-mobile h3 {
margin:200px 10px;
text-align:center;
}
/**********************************************************************************
Max Width: 1024
**********************************************************************************/
@media (max-width: 1024px) {
.ad-designer {
display: none;
}
.ad-designer-mobile {
display: block;
}
}
/**********************************************************************************
Max Width: 768
**********************************************************************************/
@media (max-width: 768px) {
}
.ad2-design-toolbar {
background-color: #fff;
display: flex;
}
.ad2-design-content {
flex: 1;
min-height: 0; /* needed in FF to keep the box from overflowing */
display: flex;
flex-direction: row;
position: relative;
}
.ad2-design-content > .over {
opacity: 0.4;
background-color: #eee;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: none;
z-index: 100;
}
.ad2-design-content.disabled > .over {
display: block;
}
.ad2-design-screens {
width: 200px;
overflow-y: auto;
font-size: 11px;
transition: width 0.3s ease;
line-height: 0;
background-color: #eee;
}
.ad2-design-content-right {
flex: 1;
display: flex;
flex-direction: row;
overflow-y: auto;
}
.ad2-design-canvas {
flex: 1;
border-top: 2px solid #ccc;
border-right: 2px solid #ccc;
padding-top: 5px;
position: relative;
transition: width 0.3s ease 0s;
}
.ad2-design-properties {
width: 305px;
font-size: 11px;
line-height: 16px;
margin-top: 5px;
}
/****************************************************************** Toolbar */
.ad2-design-toolbar-1 {
width: 200px;
font-size: 0;
background-color: #eee;
}
.ad2-design-toolbar-2 {
flex: 1;
position: relative;
border-left: 2px solid #ccc;
padding-left: 20px;
}
.ad2-design-toolbar-2 .a-tip {
left: 480px;
width: 280px;
margin-top: 5px;
}
.ad2-design-addscreens {
display: inline-block;
position: relative;
}
.ad2-design-addscreens .buttons {
position: absolute;
top: 100%;
left: 0;
width: 260px;
text-align: center;
padding: 20px 0;
background-color: #fff;
box-shadow: 0 5px 10px #000;
display: none;
z-index: 30;
}
.ad2-design-addscreens .buttons .tip {
font-size: 12px;
color: #888;
margin-top: 10px;
}
.ad2-design-addscreens .buttons.show {
display: block;
}
.ad2-design-addscreens .b {
width: 80%;
margin: 10px;
}
.ad2-design-toolbar b.add-screens {
background-color: #0a78ff;
width: 150px;
}
.ad2-design-toolbar b.add-screens:hover {
background-color: #0a78ff;
}
.ad2-design-mode {
display: inline-block;
vertical-align: top;
position: relative;
}
.ad2-design-toolbar b {
display: inline-block;
text-align: center;
width: 50px;
height: 48px;
line-height: 48px;
cursor: pointer;
vertical-align: top;
}
.ad2-design-toolbar b:hover {
background-color: #eee;
}
.ad2-design-toolbar .ads-gray {
background-image: url("/css/img/ads_logo_darkblue.svg");
background-position: center center;
background-repeat: no-repeat;
background-size: 60% auto;
}
/****************************************************************** Screens */
.ad2-design-screens-s {
height: 140px;
margin: 10px;
line-height: 20px;
position: relative;
background-color: #fff;
border-radius: 4px;
border: 1px solid #aaa;
cursor: default;
overflow: hidden;
}
.ad2-design-screens-s.sel {
background-color: #0a78ff; /*#29245c;*/
border-color: #0a78ff;
}
.ad2-design-screens-s > b {
display: block;
margin-top: 5px;
margin-left: 4%;
font-weight: normal;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.ad2-design-screens-s.sel > b {
color: #fff;
}
.ad2-design-screens-s > b u {
text-decoration: none;
}
.ad2-design-screens-s .bg {
width: 96%;
height: 90%;
margin: 5px auto;
background-position: center top;
background-repeat: no-repeat;
background-size: 100%;
}
.ad2-design-screens-s .a-dropdown {
position: absolute;
right: 0;
top: 0;
border-radius: 0;
margin: 0;
padding: 0;
padding-left: 5px;
background-color: #0a78ff;
border: none;
display: none;
}
.ad2-design-screens-s.sel .a-dropdown {
display: block;
}
.ad2-design-screens-s .a-dropdown ul {
left: inherit;
right: 0px;
line-height: 20px;
}
.ad2-design-screens-s .a-dropdown li {
padding: 2px 25px 2px 10px;
}
.ad2-design-screens-s .a-dropdown li b {
font-size: 18px;
position: absolute;
right: 0;
width: 20px;
text-align: center;
color: #666;
}
/** Screen fold ******************************************/
.ad2-design-screens-s .folder {
display: none;
}
.ad2-design-screens-s.fold {
box-shadow: 4px 5px #222, 8px 10px #888;
margin-bottom: 20px;
margin-left: 6px;
margin-right: 14px;
}
.ad2-design-screens-s .a-dropdown li:nth-child(3) {
display: none;
}
.ad2-design-screens-s.fold .a-dropdown li:nth-child(1),
.ad2-design-screens-s.fold .a-dropdown li:nth-child(2) {
display: none;
}
.ad2-design-screens-s.fold .a-dropdown li:nth-child(3) {
display: block;
}
.ad2-design-screens-s .a-dropdown li:nth-child(4) {
border-top: 1px solid #ccc;
}
.ad2-design-screens-s.fold .a-dropdown li:nth-child(4),
.ad2-design-screens-s.fold .a-dropdown li:nth-child(5),
.ad2-design-screens-s.fold .a-dropdown li:nth-child(6) {
color: #aaa;
}
.ad2-design-screens-s.f {
margin-left: 30px;
height: 120px;
}
.ad2-design-screens-s.f .a-dropdown li:nth-child(1),
.ad2-design-screens-s.f .a-dropdown li:nth-child(2) {
display: none;
}
.ad2-design-screens-s.f .a-dropdown li:nth-child(3) {
display: block;
}
/* - not used
.popup.fold {
min-height: 0;
}
.popup.fold ul.ad2-list {
display: inline-block;
max-width: 100%;
}
*/
/****************************************************************** Canvas */
.ad2-design-canvas-screens {
margin: auto;
border: 4px solid #29245c;
border-radius: 3px;
box-sizing: content-box;
margin-bottom: 10px;
position: relative;
background-color: #ddd;
}
.ad2-design-canvas-screens .off {
position: absolute;
height: 2px;
left: -10px;
right: -10px;
background-color: #0a78ff;
z-index: 10;
}
.ad2-design-canvas-s {
background-position: center center;
background-repeat: no-repeat;
background-size: contain;
position: relative;
width: 100%;
height: 100%;
/* background-color: #333; */
}
.ad2-design-canvas-s img {
display: block;
}
.ad2-design-canvas-o {
border: 2px solid red;
}
.ad2-design-canvas-gl {
position: absolute;
top: 0; left: 0;
width: 100%;
height: 100%;
display: none;
}
.ad2-design-canvas-s.gl .ad2-design-canvas-gl {
display: block;
}
.ad2-design-canvas-gl b {
position: absolute;
top: 0; left: 0;
background-color: #000;
}
.ad2-design-canvas-gl b.v {
width: 1px;
height: 100%;
}
.ad2-design-canvas-gl b.h {
height: 1px;
width: 100%;
}
/****************************************************************** Objects 2 */
.ad-o2 {
position: absolute !important; /* important needed because jQuery tries to overwrite it */
border-style: solid;
border-width: 0;
background-color: rgba(0,150,255,0.2);
box-shadow: 0 0 0 1px rgba(0,150,255,0.5);
box-sizing: content-box; /* temporary */
cursor: default;
}
.ad-o2:focus {
outline: 0px solid transparent;
}
.ad-o2 > .over {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
text-align: center;
z-index: 50;
}
.ad-o2 > .over.white {
background-color: rgba(255,255,255,0.6);
}
.ad-o2 > .over svg.i {
position: relative;
top: 50%;
margin-top: -14px;
}
.ad-o2 b.linked {
position: absolute;
top: 0;
right: 0;
width: 14px;
height: 14px;
border-radius: 3px;
background-color: #0a78ff;
color: #fff;
text-align: center;
line-height: 13px;
font-size: 10px;
opacity: 0.9;
z-index: 20;
}
.ad-o2 b.del {
font-weight: normal;
font-size: 24px;
line-height: 16px;
color: #e00;
position: absolute;
top: -14px;
right: -14px;
opacity: 0.6;
z-index: 51;
cursor: default;
}
.ad-o2 b.del:hover {
opacity: 1;
}
.ad-o2 textarea {
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
resize: none;
display: none;
z-index: 10; /* make sure it is on top */
}
/****************************************************************** Properties */
.ad2-design-properties-o {
position: fixed;
width: 300px;
}
.ad2-design-properties-desc {
margin: 0;
padding: 10px;
font-size: 11px;
color: #aaa;
letter-spacing: 0;
border-bottom: 1px solid #ccc;
background-color: #eee;
border-radius: 4px 4px 0 0;
position: relative;
}
.ad2-design-properties-desc h6 {
margin: 0 0 5px 0;
color: #29245c;
font-weight: bold;
}
.ad2-design-properties-desc a.questionmark {
position: absolute;
right: 0;
top: 0;
}
.ad2-design-properties-desc a.linked {
background-color: #0a78ff;
color: #fff;
border-radius: 4px;
font-size: 10px;
padding: 1px 4px;
margin-left: 10px;
text-transform: none;
position: relative;
top: -2px;
}
.ad2-design-properties-desc .star {
position: absolute;
width: 20px;
height: 20px;
line-height: 20px;
right: 0;
bottom: 0;
text-align: center;
color: #888;
font-size: 16px;
cursor: default;
}
.ad2-design-properties-desc .star:hover {
background-color: rgba(0,0,0,0.1);
}
.ad2-design-properties-desc .star.sel {
color: #0a78ff;
}
.ad2-design-properties-desc .a-dropdown {
border: 0 none;
margin: 0;
padding: 0 3px;
position: absolute;
right: 0;
bottom: 0;
border-radius: 0;
background-color: initial;
border-radius: 4px 4px 0 0;
}
.ad2-design-properties-desc .a-dropdown:hover {
background-color: #fff;
}
.ad2-design-properties-desc .a-dropdown i {
font-size: 30px;
line-height: 10px;
font-weight: bold;
font-style: normal;
}
.ad2-design-properties-desc .a-dropdown ul {
left: initial;
right: 0;
background-color: #fff;
}
.ad2-design-properties-cont {
overflow-y: auto;
overflow-x: hidden;
background-color: #fff;
border-radius: 0 0 4px 4px;
max-height: 71vh;
padding-bottom: 10px;
}
.ad2-prop {
padding: 8px 10px;
border-bottom: 1px solid #ddd;
color: #888;
background-color: #fff;
position: relative; /* for the tips */
}
.ad2-prop .label {
display: inline-block;
width: 90px;
margin-right: 5px;
text-transform: uppercase;
font-size: 9px;
vertical-align: middle;
}
.ad2-prop-sub {
position: relative;
}
.ad2-prop-sub .ad2-prop {
background-color: rgba(222, 232, 242, 0.5);
}
.ad2-prop-sub .tip {
position: absolute;
top: -1px;
left: 10px;
width: 0;
height: 0;
border-style: solid;
border-width: 10px 10px 0 10px;
border-color: #fff transparent transparent transparent;
z-index: 2;
}
.ad2-prop > .b {
width: 168px;
}
.ad2-prop .ad2-dropdown b {
width: 168px;
}
.ad2-prop .ad2-dropdown.l b,
.ad2-prop .ad2-dropdown.r b {
width: 84px;
}
.ad2-prop .ad2-color-picker {
margin-right: 16px;
}
.ad2-prop .ad2-color-picker:nth-child(3) .down {
margin-left: -20px;
}
.ad2-prop .ad2-color-picker:nth-child(4) .down {
margin-left: -50px;
}
.ad2-prop > input[type='text'],
.ad2-prop > textarea {
width: 168px;
font-size: 10px;
padding: 4px 12px;
vertical-align: middle;
}
.ad2-prop > input[type='text'].txt-check {
width: 140px;
margin-left: 5px;
}
.ad2-prop > input[type='checkbox'] {
width: 20px;
height: 20px;
}
.ad2-prop > .position {
}
.ad2-prop > .position > input[type='text'] {
display: inline-block;
width: 24px;
font-size: 9px;
text-align: right;
padding: 0;
border-radius: 0;
border: 0 none;
border-bottom-color: currentcolor;
border-bottom-style: none;
border-bottom-width: 0px;
border-bottom: 1px solid #ccc;
background-color: rgba(255,255,255,0);
margin-right: 6px;
line-height: 15px;
}
.ad2-prop span.b, a.b {
vertical-align: middle;
}
.ad2-prop .a-tip {
top: 110%;
left: 10%;
}
.ad2-note {
padding: 12px 10px;
color: #888;
border-top: 1px solid #ddd;
}
/** Popup - Golist *********************************/
#popup-golist-body input {
padding: 2px 10px;
font-size: 14px;
}
#popup-golist-body .ad2-dropdown b {
width: 170px;
padding-top: 6px;
padding-bottom: 6px;
}
#popup-golist-body b.i {
color: #888;
visibility: hidden;
}
#popup-golist-body div:hover b.i {
visibility: visible;
}
#popup-golist-body div:hover b.i:hover {
color: #c00;
}
#popup-golist-add {
margin: 5px 0;
}
/******************************************************************** Layout Empty */
.ad2-design-arrow {
position: absolute;
width: 200px;
height: 200px;
top: 70px;
left: 200px;
background-image: url(/css/img/arrow.blue.1.svg);
background-size: contain;
background-repeat: no-repeat;
z-index: 100;
display: none;
-webkit-transform: rotate(190deg);
transform: rotate(190deg);
}
.ad2-design-toolbar .over {
opacity: 0.4;
background-color: #fff;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: none;
}
.ad2-design-toolbar.empty .over {
display: block;
}
.ad2-design-toolbar.empty .ad2-design-arrow {
display: block;
}
.ad2-design-toolbar.empty .a-tip {
display: none;
}
/******************************************************************** Layout Grid */
.ad2-design-mode .list,
/*.ad2-design-mode .zoom,*/
.ad2-design-mode .grid {
position: absolute;
top: 0;
left: 0;
opacity: 0;
z-index: 0;
transition: opacity 0.3s ease;
}
.ad2-design-mode .grid {
opacity: 1;
z-index: 1;
}
.ad2-design-toolbar.grid .ad2-design-mode .list {
opacity: 1;
z-index: 1;
}
.ad2-design-toolbar.grid .ad2-design-mode .grid {
opacity: 0;
z-index: 0;
}
.ad2-design-toolbar.grid .over {
display: block;
}
.ad2-design-content.grid .ad2-design-screens {
width: 100%;
padding: 5px;
}
.ad2-design-content.grid .ad2-design-screens-s {
display: inline-block;
width: 19%;
margin: 0.5%;
height: 300px;
}
.ad2-design-content.grid .ad2-design-screens-s.f {
width: 9.5%;
margin: 0.2%;
height: 200px;
}
.ad2-design-content.grid .ad2-design-canvas {
overflow: hidden;
padding: 0;
width: 0;
}
.ad2-design-content.grid .ad2-design-properties {
display: none;
}
/******************************************************************** ADRunnerDialog */
.ad-runner-dialog-bg {
background-color: rgba(255,255,255,0.99);
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 100;
display: none;
}
.ad-runner-dialog {
position: absolute;
top: 30px;
bottom: 10px;
left: 10%;
right: 10%;
}
.ad-runner-dialog-bg .close {
position: absolute;
top: 0;
right: 20%;
margin-top: 5px;
margin-right: -40px;
cursor: pointer;
}
.ad-runner-dialog-bg .close:hover {
transform: scale(1.1);
}
/******************************************************************** Versions */
span.b.ad-demo-preview {
border: 0 none;
padding-left: 0;
padding-right: 0;
margin-right: 30px;
height: 50px;
}
span.b.ad-demo-preview:hover {
color: white;
box-shadow: none;
}
.ad-demo-versions {
position: relative;
display: inline-block;
padding-top: 21px;
cursor: default;
}
.ad-demo-versions b {
color: #aaa;
opacity: 0.8;
}
.ad-demo-versions b:hover {
opacity: 1;
}
.ad-demo-versions b .a-loader {
display: none;
width: 20px;
height: 20px;
position: absolute;
margin-left: 5px;
}
.ad-demo-versions b.loading .a-loader {
display: inline-block;
}
.ad-demo-versions .list {
display: none;
color: #444;
width: 240px;
max-height: 200px;
background-color: #fff;
box-shadow: 0 5px 10px #000;
overflow-y: auto;
position: absolute;
top: 99%;
z-index: 100;
}
.ad-demo-versions:hover .list {
display: block;
}
.ad-demo-versions .list > div {
padding: 5px;
border-bottom: 1px solid #ccc;
}
.ad-demo-versions .list > div:hover {
background-color: #eee;
}
.ad-demo-versions-label {
color: #f33;
}
/**********************************************************************************
Mobile
**********************************************************************************/
/**********************************************************************************
Max Width: 1024
**********************************************************************************/
@media (max-width: 1024px) {
.ad2-design-toolbar i {
font-size: 26px;
width: 44px;
height: 44px;
line-height: 44px;
}
}
/**********************************************************************************
Max Width: 768
**********************************************************************************/
@media (max-width: 768px) {
.ad2-design-screens {
width: 30%;
}
.ad2-design-canvas {
width: 70%;
}
.ad2-design-properties {
display: none;
}
.ad2-design-toolbar-1 {
width: 30%;
}
.ad2-design-toolbar-2 i {
display: none;
}
}
.ad2-color-picker {
position: relative;
display: inline-block;
vertical-align: middle;
}
.ad2-color-picker b {
display: inline-block;
width: 30px;
height: 30px;
line-height: 30px;
border-radius: 100px;
box-shadow: 0 0 1px rgba(0,0,0,0.5);
cursor: pointer;
text-align: center;
color: #fff;
font-size: 16px;
font-weight: normal;
transition: all 0.3s;
}
.ad2-color-picker b:hover {
box-shadow: 0 0 4px rgba(0,0,0,0.8);
}
.ad2-color-picker .down {
display: none;
position: absolute;
padding: 5px;
box-shadow: 0 0 4px rgba(0,0,0,0.5);
background-color: #fff;
z-index: 20;
}
.ad2-color-picker .down.show {
display: block;
}
.ad2-color-picker.down-fixed .down {
position: fixed;
}
/********************************************************** ad2-dropdown */
.ad2-dropdown {
display: inline-block;
vertical-align: middle;
position: relative;
color: #888;
font-size: 10px;
cursor: pointer;
}
.ad2-dropdown b {
display: inline-block;
vertical-align: middle;
font-weight: normal;
padding: 4px 10px;
padding-right: 26px;
border: 1px solid #ccc;
border-radius: 4px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.ad2-dropdown:hover b {
color: #0a78ff;
z-index: 2;
}
.ad2-dropdown.l b {
border-radius: 4px 0 0 4px;
}
.ad2-dropdown.r b {
border-radius: 0 4px 4px 0;
left: -1px;
}
.ad2-dropdown.maxw-100 b {
max-width: 100px;
}
.ad2-dropdown i {
position: absolute;
right: 8px;
top: 4px;
}
.ad2-dropdown .down {
display: none;
position: absolute;
padding: 5px;
box-shadow: 0 0 4px rgba(0,0,0,0.5);
background-color: #fff;
z-index: 20;
}
.ad2-dropdown .down.show {
display: block;
}
.ad2-dropdown ul {
display: none;
position: absolute;
left: 0;
margin: 0;
padding: 0;
list-style: none;
background-color: #fff;
border: 1px solid #ccc;
box-shadow: 0 0 2px rgba(0,0,0,0.4);
white-space: nowrap;
z-index: 20;
max-height: 300px;
max-width: 180px;
overflow-y: auto;
overflow-x: hidden;
}
.ad2-dropdown ul.show {
display: block;
}
.ad2-dropdown li {
padding: 2px 14px;
border-bottom: 1px solid #eee;
}
.ad2-dropdown li:last-child {
border: none;
}
.ad2-dropdown li.sel {
color: #0a78ff;
}
.ad2-dropdown li:hover {
background-color: rgba(10,120,255,0.6);
color: #fff;
}
/********************************************************** ad2-list */
ul.ad2-list {
margin: 0;
padding: 0;
list-style: none;
background-color: #fff;
border: 1px solid #ccc;
box-shadow: 0 0 2px rgba(0,0,0,0.4);
white-space: nowrap;
max-height: 300px;
max-width: 180px;
overflow-y: auto;
overflow-x: hidden;
}
ul.ad2-list li {
padding: 2px 25px 2px 10px;
border-bottom: 1px solid #eee;
cursor: default;
}
ul.ad2-list li:last-child {
border: none;
}
ul.ad2-list li.sel {
background-color: #ddd;
}
ul.ad2-list li:hover {
background-color: rgba(10,120,255,0.4);
}
/*
Frame Selector
*/
ul.stack.ad-frames {
text-align: center;
flex: 1;
overflow-y: scroll;
}
.ad-frames ul.head {
background-color: transparent;
}
.ad-frames ul.head li {
color: #29245c;
}
.ad-frames ul.head li.sel {
color: #0a78ff;
}
.ad-frames .tabs ul.body {
text-align: left;
}
/*
ATabPanel
*/
.a-tabpanel {
}
/* First level */
ul.a-tabs1 {
padding: 0;
margin: 0;
height: 50px;
line-height: 50px;
}
ul.a-tabs1 > li {
display: inline-block;
vertical-align: bottom;
width: 25%;
height: 40px;
line-height: 40px;
box-sizing: border-box;
position: relative;
text-align: center;
font-size: 20px;
border: 1px solid #aaa;
cursor: pointer;
transition: all 0.2s;
opacity: 0.8;
}
ul.a-tabs1 > li:hover {
background-color: #fff;
}
ul.a-tabs1 > li.sel {
background-color: #fff;
border-bottom-style: none;
height: 50px;
padding-top: 10px;
opacity: 1;
}
/* Second level */
ul.a-tabs2 {
padding: 0;
margin: 0;
}
ul.a-tabs2 > li {
display: inline;
padding: 2px 20px;
border-bottom: 2px solid #aaa;
font-size: 16px;
cursor: pointer;
opacity: 0.8;
}
ul.a-tabs2 > li:hover {
border-bottom: 2px solid #f90;
}
ul.a-tabs2 > li.sel {
border-bottom: 2px solid #f90;
opacity: 1;
}
ul.a-panels2 {
margin-top: 30px;
padding: 5px;
}
ul.a-panels2 > li {
display: none;
}
ul.a-panels2 > li.sel {
display: block;
}
.ad-createdemo-frames-phone {
display: inline-block;
vertical-align: top;
width: 20%;
margin: 20px 0;
text-align: center;
position: relative;
overflow: hidden;
transition: all 0.2s;
}
.ad-createdemo-frames-phone:hover {
background-color: #ddd;
}
.ad-createdemo-frames-phone.sel {
background-color: #eee;
transform: scale(1.1);
z-index: 2;
}
.ad-createdemo-frames-img {
height: 200px;
line-height: 200px;
padding: 10px;
margin-bottom: 2px;
position: relative;
}
.ad-createdemo-frames-res {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
line-height: 200px;
text-align: center;
color: #fff;
font-size: 11px;
}
.ad-createdemo-frames-res.no-frame {
font-size: 0;
border: 3px dashed #888;
transform: scale(0.6);
}
/* fixes for not-centered frames */
#afs-watches-all .ad-createdemo-frames-phone:nth-child(4) .ad-createdemo-frames-res {
padding-left: 50px;
}
#afs-watches-all .ad-createdemo-frames-phone:nth-child(5) .ad-createdemo-frames-res {
padding-right: 55px;
}
.ad-createdemo-frames-img img {
max-width: 90%;
max-height: 100%;
vertical-align: middle;
/* needed for IE9 */
height: auto;
width: auto;
}
.ad-createdemo-frames-phone .txt-caps-s {
color: #29245c;
}
.ad-createdemo-frames-phone.sel .txt-caps-s {
color: #0a78ff;
}
.ad-createdemo-frames-o {
position: absolute;
top: 10px;
right: 10px;
cursor: pointer;
display: none;
}
.ad-createdemo-frames-phone.sel .ad-createdemo-frames-o {
display: block;
}
/**********************************************************************************
Mobile
**********************************************************************************/
/**********************************************************************************
Max Width: 1024
**********************************************************************************/
@media (max-width: 1024px) {
.ad-createdemo-frames-phone {
width: 24%;
}
}
/**********************************************************************************
Max Width: 768
**********************************************************************************/
@media (max-width: 768px) {
.ad-createdemo-frames-phone {
width: 32%;
}
}
/**********************************************************************************
Max Width: 640
**********************************************************************************/
@media (max-width: 640px) {
ul.a-tabs1 > li {
font-size: 16px;
}
ul.a-tabs2 > li {
font-size: 14px;
padding: 2px 5px;
}
.ad-createdemo-frames-phone {
width: 49%;
}
}
/*
Download Page
*/
.ad-download-error {
color: #c00;
font-weight: bold;
}
.ad-download-panel {
text-align: center;
max-width:600px;
margin:30px auto;
padding:5px;
border:1px solid #aaa;
border-radius:10px;
}
/**********************************************************************************
Max Width: 1024
**********************************************************************************/
@media (max-width: 1024px) {
}
/**********************************************************************************
Max Width: 768
**********************************************************************************/
@media (max-width: 768px) {
}
/**********************************************************************************
Max Width: 640
**********************************************************************************/
@media (max-width: 640px) {
}
/*
Analytics
*/
.ad-analytics {
}
.ad-analytics .ad-date-range-container {
float: right;
position: relative;
top: -29px;
}
/*
Analytics Views
*/
.ad-analytics-th {
margin-top: 20px;
font-size: 16px;
padding: 5px;
border-bottom: 1px solid #aaa;
}
.ad-analytics-tr1 {
background-color: #fafafa;
padding: 5px;
border-bottom: 1px solid #aaa;
font-size: 12px;
}
.ad-analytics-tr0 {
background-color: #eeeeee;
padding: 5px;
border-bottom: 1px solid #aaa;
font-size: 12px;
}
.ad-analytics-tr-views {
float: right;
}
/*
Analytics Paths
*/
.ad-analytics-tree {
position: relative;
}
.ad-analytics-tree-head {
margin-bottom: 15px;
white-space: nowrap;
}
.ad-analytics-tree-head-level {
display: inline-block;
text-align: center;
overflow: hidden;
}
.ad-analytics-block {
}
.ad-analytics-block-in {
display: inline-block;
vertical-align: top;
position: relative;
}
.ad-analytics-screen {
display: inline-block;
position: relative;
color: #fff;
font-size: 12px;
cursor: pointer;
}
.ad-analytics-screen img {
width: auto; /* for IE */
}
.ad-analytics-screen-hover {
font-size: 14px;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0.6;
}
.ad-analytics-screen-hover:hover {
opacity: 1;
}
.ad-analytics-screen-i {
font-weight: bold;
font-size: 16px;
background-color: #000;
position: absolute;
top: 0;
left: 0;
padding: 2px;
}
.ad-analytics-screen-c {
background-color: #000;
position: absolute;
bottom: 0;
left: 0;
width: 100%;
text-align: center;
}
.ad-analytics-line-h {
display: inline-block;
background-color: #DF5000;
height: 3px;
width: 20px;
vertical-align: top;
position: relative;
}
.ad-analytics-arrow {
display: inline-block;
width: 0;
height: 0;
border-style: solid;
border-color: transparent #DF5000;
border-width: 6px 0 6px 12px;
vertical-align: top;
position: relative;
}
.ad-analytics-line-v {
display: inline-block;
background-color: #DF5000;
width: 3px;
height: auto;
position: absolute;
}
.ad-analytics-paths {
display: inline-block;
position: relative;
}
.ad-analytics-paths-more {
display: none;
}
.ad-analytics-paths-butmore {
position: absolute;
text-align: center;
left: -10px;
width: 20px;
height: 20px;
line-height: 18px;
padding-left: 1px;
font-size: 20px;
font-weight: bold;
cursor: pointer;
color: #df5000;
background-color: #fff;
border: 2px solid #df5000;
border-radius: 10px;
}
.ad-analytics-paths-butmore b {
position: relative;
top: -5px;
}
/*
Leads
*/
.ad-date-range {
display: inline-block;
padding: 5px;
}
.ad-date-range input {
font-size: 12px;
}
.ad-date-range button {
font-size: 12px;
}
.ad-leads-table {
width: 100%;
}
.ad-leads-table th {
padding: 10px;
background-color: #8b84d7;
color: #fff;
border-bottom: 1px solid #aaa;
text-align: left;
}
.ad-leads-table td {
padding: 5px;
background-color: #eee;
border-bottom: 1px solid #aaa;
}
/*
User Settings
*/
a.logout {
float: right;
margin-top: 10px;
}
.ad-uset-t {
}
.ad-uset-l {
font-style: italic;
vertical-align: top;
padding: 10px;
border-right: 2px solid #eeeeee;
}
.ad-uset-s {
padding: 10px;
}
#tabs-account ul.head {
background-color: initial;
padding: 10px;
}
#tabs-account ul.head li {
font-size: 14px;
}
#tabs-account ul.body {
min-height: 500px;
}
#tabs-account.tabs input[type="text"] {
width: initial;
margin: 5px 0;
}
#tabs-account.tabs button {
margin-top: 10px;
float: right;
}
#tabs-account.tabs label {
margin-right: 10px;
}
.ad-receipts-table {
width: 100%;
margin: 20px 0;
border-collapse: collapse;
}
.ad-receipts-table tr {
border-bottom: 1px solid #ccc;
}
.ad-receipts-table tr:first-child {
border-top: 1px solid #ccc;
}
.ad-receipts-table td {
padding: 10px;
}
.ad-receipts-table td:nth-child(3) {
text-align: right;
}
#ad-us-join {
border: 2px solid #f90;
background-color: #fda;
border-radius: 6px;
padding: 20px;
}
#ad-us-join p {
font-size: 20px;
}
#ad-us-join button {
float: right;
}
/**********************************************************************************
Mobile
**********************************************************************************/
/**********************************************************************************
Max Width: 1024
**********************************************************************************/
@media (max-width: 1024px) {
}
/**********************************************************************************
Max Width: 768
**********************************************************************************/
@media (max-width: 768px) {
}
/*
Section Reports Top
*/
.ad-top-reports {
}
.ad-report-demos {
}
.ad-report-demos .header {
background-color: #eee;
border: 1px solid #ccc;
font-size: 14px;
padding: 2px 0;
line-height: 30px;
}
.ad-report-demos .header input[type='checkbox'] {
width: 20px;
height: 20px;
}
.ad-report-demos input,
.ad-report-demos submit {
font-size: 14px;
padding: 4px 8px;
}
.ad-report-demos .d {
margin: 5px 0;
padding: 3px 0;
border-bottom: 1px solid #aaa;
}
.ad-report-demos i.count {
float: right;
font-style: normal;
}
/**********************************************************************************
Max Width: 1024
**********************************************************************************/
@media (max-width: 1024px) {
}
/**********************************************************************************
Max Width: 768
**********************************************************************************/
@media (max-width: 768px) {
}
/**********************************************************************************
Max Width: 640
**********************************************************************************/
@media (max-width: 640px) {
}
/*
Subscribe Page
*/
.ad-subscribe {
text-align: center;
padding: 0;
}
.ad-subscribe-form {
margin: 20px auto;
width: 60%;
padding: 40px;
font-weight: bold;
font-size: 16px;
}
#tabs-subscribe ul.head li {
font-size: 16px;
}
#tabs-subscribe ul.head li i {
font-size: 14px;
color: #aaa;
}
.ad-subscribe-form input {
}
.ad-subscribe img.cc {
width: 140px;
border: none;
margin: 10px;
}
.ad-subscribe img.paypal,
.ad-subscribe img.braintree {
border-radius: 3px;
margin: 0 5px;
vertical-align: middle;
background-color: #fff;
border: 1px solid #ddd;
}
.ad-subscribe img.paypal {
height: 28px;
padding: 5px;
}
.ad-subscribe img.braintree {
height: 28px;
}
/**************************** Subscription */
.ad-subscription-links {
display: inline-block;
padding: 40px;
font-size: 16px;
}
.ad-subscription-links .links {
display: flex;
margin: 20px 0;
}
.ad-subscription-links .link {
flex: 1;
padding: 20px;
}
.ad-subscription-links .link:first-child {
color: #0c0;
}
.ad-subscription-links .link:last-child {
color: #f90;
}
.ad-subscription-links a {
width: 200px;
padding-left: 0;
padding-right: 0;
margin-bottom: 10px;
}
/**************************** Subscribe Change */
.ad-subscribe-change li {
margin: 20px 0;
list-style: none;
}
.ad-subscribe-change b {
font-size: 160%;
margin-left: -23px;
margin-right: 10px;
}