/* Modal Box */
.toolTipBox, .toolTipTxt {
    display: none;
}

.toolTip, .formTip {
    position: absolute;
    z-index: 1020;
    display: none;
    *margin-left: -15px;
    background: #FFFFC5;
    border: 2px solid #ECE07C;
}

.toolTipCon, .formTipCon {
    padding: 12px 15px 12px 12px;
    position: relative;
    z-index: 1005;
    display: table-cell;
    left: 0;
    text-align: left;
    top: 0;
    display: block;
}

.toolTipCon .content {
    width: 275px;
}

.toolTipCon h4 {
    margin: 0;
    padding: 3px 0;
    font-size: 13px;
}

.topArrow, #formTip .bottomArrow, .leftArrow, .rightArrow, .bottomArrow {
    z-index: 1001;
    overflow: hidden;
}

.topArrow, #formTip .bottomArrow {
    background-position: -324px -38px;
    bottom: -11px;
    width: 14px;
    height: 14px;
    left: 50%;
    margin-left: -11px;
}

.leftArrow {
    background-position: -313px -41px;
    top: 50%;
    width: 12px;
    right: -11px;
    height: 16px;
    margin-top: -7px;
}

.rightArrow {
    background-position: -303px -42px;
    top: 50%;
    width: 11px;
    left: -10px;
    height: 16px;
    margin-top: -8px;
}

.bottomArrow {
    background-position: -343px -38px;
    height: 12px;
    left: 50%;
    margin-left: -10px;
    margin-top: -11px;
    top: 0;
    width: 15px;
}

/* ToolTip */
.tooltipDiv a {
    margin: 30px;
}

.tooltipDiv img {
    border: 0;
    cursor: pointer;
    vertical-align: middle;
    position: relative;
    top: -1px;
    margin: 0 10px;
}

.tooltipDiv div {
    float: left;
    margin: 20px 10px 10px 10px;
}

#toolTip.tipAdv {
    display: none;
    position: absolute;
    z-index: 1000;
    width: auto;
    background: none;
    border: none;
}

#toolTipClose {
    display: none;
}

/* Form ToolTip */
#formTip .bottomArrow {
    top: auto;
}

/* Tooltips for Design Editor */
#textTip, #imageTip {
    z-index: 9999;
}

/* css arrow */

#imageSnapTipArrow {
    display: none;
}
.toolTipCon {
    position: relative;
}
.toolTipCon:after,
.toolTipCon:before {
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}
.toolTipCon:after {
    border-color: rgba(255, 255, 197, 0);
    border-width: 7px;
}
.toolTipCon:before {
    border-color: rgba(236, 224, 124, 0);
    border-width: 10px;
}
.bottomArrow + .toolTipCon:after,
.bottomArrow + .toolTipCon:before {
    bottom: 100%;
    left: 50%;
}
.bottomArrow + .toolTipCon:after {
    border-bottom-color: #FFFFC5;
    margin-left: -7px;
}
.bottomArrow + .toolTipCon:before {
    border-bottom-color: #ECE07C;
    margin-left: -10px;
}
.leftArrow + .toolTipCon:after,
.leftArrow + .toolTipCon:before {
    left: 100%;
    top: 50%;
}
.leftArrow + .toolTipCon:after {
    border-left-color: #FFFFC5;
    margin-top: -7px;
}
.leftArrow + .toolTipCon:before {
    border-left-color: #ECE07C;
    margin-top: -10px;
}
.rightArrow + .toolTipCon:after,
.rightArrow + .toolTipCon:before {
    right: 100%;
    top: 50%;
}
.rightArrow + .toolTipCon:after {
    border-right-color: #FFFFC5;
    margin-top: -7px;
}
.rightArrow + .toolTipCon:before {
    border-right-color: #ECE07C;
    margin-top: -10px;
}
.topArrow + .toolTipCon:after,
.topArrow + .toolTipCon:before {
    top: 100%;
    left: 50%;
}
.topArrow + .toolTipCon:after {
    border-top-color: #FFFFC5;
    margin-left: -7px;
}
.topArrow + .toolTipCon:before {
    border-top-color: #ECE07C;
    margin-left: -10px;
}