@font-face
{ 
    font-family: 'roboto';
    src: url('/fonts/Roboto-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face
{ 
    font-family: 'RobotoMedium';
    src: url('/fonts/Roboto-Medium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Apple-SF-Regular';
    src: /*url('/fonts/SFUIDisplay-Regular.woff2') format('woff2'),*/
         url('/fonts/SFUIDisplay-Regular.woff') format('woff'),
         url('/fonts/SFUIDisplay-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Apple-SF-Medium';
    src: /*url('/fonts/SFUIDisplay-Medium.woff2') format('woff2'),*/
         url('/fonts/SFUIDisplay-Medium.woff') format('woff'),
         url('/fonts/SFUIDisplay-Medium.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

/*** Animation Loader ***/
.websimulatorloading{
    background: rgba(0,0,0,.3);
    z-index: 1003;
    color: #fff;
    line-height:60px;
    height: 60px;
    width: 60px;
    text-align: center;
    position: absolute;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    margin: auto;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}
.websimulatorloading .loader
{
        height: 30px;
        width: 100%;
        margin: auto;
        position: absolute;
        top: 0;
        bottom: 0;
    }
        .websimulatorloading .loader .circular {
            -webkit-animation: rotate 2s linear infinite;
     -moz-animation: rotate 2s linear infinite;
            -o-animation: rotate 2s linear infinite;
            animation: rotate 2s linear infinite;
            height: 100%;
            -webkit-transform-origin: center center;
            -ms-transform-origin: center center;
            -o-transform-origin: center center;
            transform-origin: center center;
            width: 100%;
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            margin: auto;
        }

        .websimulatorloading .loader .path {
            stroke-dasharray: 1,200;
            stroke-dashoffset: 0;
            -webkit-animation: dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite;
      -ms-animation: dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite;
            -o-animation: dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite;
            animation: dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite;
            stroke-linecap: round;
            stroke: #fff /*#d62d20 */;
        }

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

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

@keyframes rotate {
    100% {
        -webkit-transform: rotate(360deg);
       -moz-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
@-webkit-keyframes dash {
    0% {
        stroke-dasharray: 1,200;
        stroke-dashoffset: 0;
    }

    50% {
        stroke-dasharray: 89,200;
        stroke-dashoffset: -35px;
    }

    100% {
        stroke-dasharray: 89,200;
        stroke-dashoffset: -124px;
    }
}

@-o-keyframes dash {
    0% {
        stroke-dasharray: 1,200;
        stroke-dashoffset: 0;
    }

    50% {
        stroke-dasharray: 89,200;
        stroke-dashoffset: -35px;
    }
    100% {
        stroke-dasharray: 89,200;
        stroke-dashoffset: -124px;
    }
}
@keyframes dash {
    0% {
        stroke-dasharray: 1,200;
        stroke-dashoffset: 0;
    }
    50% {
        stroke-dasharray: 89,200;
        stroke-dashoffset: -35px;
    }
    100% {
        stroke-dasharray: 89,200;
        stroke-dashoffset: -124px;
    }
}

/*** Animation ***/
.slide-left25
{
    -webkit-animation-duration: 0.25s;
       -moz-animation-duration: 0.25s;
    -o-animation-duration: 0.25s;
    animation-duration: 0.25s;
    -webkit-animation-fill-mode: both;
       -moz-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-name: slideOutLeft25;
       -moz-animation-name: slideOutLeft25;
    -o-animation-name: slideOutLeft25;
    animation-name: slideOutLeft25;
    z-index: 1;
}

@-webkit-keyframes slideOutLeft25 {
    0% {
        -webkit-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    100% {
        -webkit-transform: translate3d(-50%, 0, 0);
       -moz-transform: translate3d(-50%, 0, 0);
        -o-transform: translate3d(-50%, 0, 0);
        transform: translate3d(-50%, 0, 0);
    }
}
@-o-keyframes slideOutLeft25 {
    0% {
        -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

  100% 
  {
        -webkit-transform: translate3d(-50%, 0, 0);
       -moz-transform: translate3d(-50%, 0, 0);
        -o-transform: translate3d(-50%, 0, 0);
        transform: translate3d(-50%, 0, 0);
    }
}
@keyframes slideOutLeft25 {
    0% {
        -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

  100% 
  {
        -webkit-transform: translate3d(-50%, 0, 0);
       -moz-transform: translate3d(-50%, 0, 0);
        -o-transform: translate3d(-50%, 0, 0);
        transform: translate3d(-50%, 0, 0);
    }
}

.slide-left100
{
    -webkit-animation-duration: 0.25s;
       -moz-animation-duration: 0.25s;
    -o-animation-duration: 0.25s;
    animation-duration: 0.25s;
    -webkit-animation-fill-mode: both;
       -moz-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-name: slideOutLeft100;
       -moz-animation-name: slideOutLeft100;
    -o-animation-name: slideOutLeft100;
    animation-name: slideOutLeft100;
}

@-webkit-keyframes slideOutLeft100 {
    0% {
        -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    100% {
        -webkit-transform: translate3d(-100%, 0, 0);
        -o-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }
}
@-o-keyframes slideOutLeft100 {
    0% {
        -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    100% {
        -webkit-transform: translate3d(-100%, 0, 0);
       -moz-transform: translate3d(-100%, 0, 0);
        -o-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }
}
@keyframes slideOutLeft100 {
    0% {
        -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    100% {
        -webkit-transform: translate3d(-100%, 0, 0);
       -moz-transform: translate3d(-100%, 0, 0);
        -o-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }
}

.slide-right25
{
    -webkit-animation-duration: 0.25s;
       -moz-animation-duration: 0.25s;
    -o-animation-duration: 0.25s;
    animation-duration: 0.25s;
    -webkit-animation-fill-mode: both;
       -moz-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-name: slideOutRight25;
       -moz-animation-name: slideOutRight25;
    -o-animation-name: slideOutRight25;
    animation-name: slideOutRight25;
    z-index: 1;
}

@-webkit-keyframes slideOutRight25 {
    0% {
        -webkit-transform: translate3d(-50%, 0, 0);
       -moz-transform: translate3d(-50%, 0, 0);
        -o-transform: translate3d(-50%, 0, 0);
        transform: translate3d(-50%, 0, 0);
    }

    100% {
        -webkit-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}
@-o-keyframes slideOutRight25 {
    0% {
        -webkit-transform: translate3d(-50%, 0, 0);
       -moz-transform: translate3d(-50%, 0, 0);
        -o-transform: translate3d(-50%, 0, 0);
        transform: translate3d(-50%, 0, 0);
    }

    100% {
        -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}
@keyframes slideOutRight25 {
    0% {
        -webkit-transform: translate3d(-50%, 0, 0);
       -moz-transform: translate3d(-50%, 0, 0);
        -o-transform: translate3d(-50%, 0, 0);
        transform: translate3d(-50%, 0, 0);
    }

    100% {
        -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.slide-right100
{
    -webkit-animation-duration: 0.25s;
       -moz-animation-duration: 0.25s;
    -o-animation-duration: 0.25s;
    animation-duration: 0.25s;
    -webkit-animation-fill-mode: both;
       -moz-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-name: slideOutRight100;
       -moz-animation-name: slideOutRight100;
    -o-animation-name: slideOutRight100;
    animation-name: slideOutRight100;
}

@-webkit-keyframes slideOutRight100 {
    0% {
        -webkit-transform: translate3d(-100%, 0, 0);
        -o-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }

    100% {
        -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}
@-o-keyframes slideOutRight100 {
    0% {
        -webkit-transform: translate3d(-100%, 0, 0);
       -moz-transform: translate3d(-100%, 0, 0);
        -o-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }

    100% {
        -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}
@keyframes slideOutRight100 {
    0% {
        -webkit-transform: translate3d(-100%, 0, 0);
       -moz-transform: translate3d(-100%, 0, 0);
        -o-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }

    100% {
        -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.androidAppBar
{
    font-family: 'RobotoMedium', sans-serif;
    font-size: 20px;
    height: 56px;
    position: relative;
    width: 100%;
    z-index: 1;

    box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2);
    -moz-box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2);
    -webkit-box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2);
}

.androidAppBarItem
{
    max-width: 60%;
    overflow: hidden;
    padding: 16px;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: initial;
}

.androidUpButton
{
    width: 56px;
}

.iosAppBarItem
{
    padding: 1em .5em;
}

.androidTabBar
{
    height: 48px;
    overflow: hidden;
    text-align: center;
    width: 100%;
    position: relative;
    z-index: 1;

    box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2);
    -moz-box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2);
    -webkit-box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2);
}

.androidTab,
.activeAndroidTab
{
    cursor: pointer;
    display: inline-block;
    height: 48px;
    max-width: 264px;
    opacity: 1;
    text-align: center;
}

.activeAndroidTab
{
    border-bottom-width: 2px;
    border-bottom-style: solid;
    height: 46px;
}

.androidTabLabel
{
    font-family: 'RobotoMedium', sans-serif;
    font-size: 14px;
    line-height: 2em;
    margin-top: 1em;
    opacity: .7;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
}

.activeAndroidTab > .androidTabLabel
{
    opacity: 1;
}

.android_tab_icon {
    width: 26px;
    height: 26px;
}

.iosStatusBarDark,
.iosStatusBarLight {
    height: 20px;
    text-align: center;
    width: 100%;
}

.iosStatusBarDark
{
    background-color: #000;
    color: #FFF;
}

.iosStatusBarLight
{
    background-color: #FFF;
    color: #000;
}

.iosStatusBarSignalDark,
.iosStatusBarSignalLight,
.iosStatusBarChargeDark,
.iosStatusBarChargeLight
{
    background-repeat: no-repeat;
    height: 20px;
    position: absolute;
    top: 0px;
    width: 100px;
}

.iosStatusBarSignalDark,
.iosStatusBarSignalLight
{
    left: 0px;
}

.iosStatusBarSignalDark
{
    background-image: url('/images/ios-status-bar/dark-theme/signal.png');
}

.iosStatusBarSignalLight
{
    background-image: url('/images/ios-status-bar/light-theme/signal.png');
}

.iosStatusBarChargeDark,
.iosStatusBarChargeLight
{
    background-position: right;
    right: 0px;
}

.iosStatusBarChargeDark
{
    background-image: url('/images/ios-status-bar/dark-theme/charge.png');
}

.iosStatusBarChargeLight
{
    background-image: url('/images/ios-status-bar/light-theme/charge.png');
}

.iosStatusBarClockDark,
.iosStatusBarClockLight
{
    font-family: "Apple-SF-Regular", Helvetica, Arial, sans-serif;
    font-size: 12px;
    line-height: 20px;
    margin: auto;
}

.iosNavigationBar,
.iosNavigationBarLandscape
{
    border-bottom-style: solid;
    border-bottom-width: 1px;
    height: 43px;
    left: 0px;
    padding: 0px;
    position: absolute;
    text-align: center;
    top: 20px;
    width: 100%;
    z-index: 1;
}

.iosNavigationBarLandscape
{
    top: 0px;
}

.iosNavigationBarTitle
{
    display: inline-block;
    font-family: "Apple-SF-Medium", Helvetica, Arial, sans-serif;
    font-size: 16px;
    line-height: 44px;
    margin: auto;
    width: auto;
}


#appBarTitle {line-height: 54px !important;} /* sl injection to fix X phone header emulator */

.customTabBar,
.iosTabBar
{
    color: #929292;
    height: 49px;
    overflow: hidden;
    text-align: center;
}

.iosTabBar
{
    border-top-style: solid;
    border-top-width: 1px;
}

.customTab,
.iosTab
{
    background-repeat: no-repeat;
    background-position: center 25%;
    -webkit-background-size: auto 50%;
    background-size: auto 50%;
	cursor:pointer;
    display: inline-block;
    height: 100%;
    position: relative;
    text-align: center;
}

.customTabBarLabel,
.iosTabBarLabel
{
    bottom: 3px;
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-size: x-small;
    left: 0px;
    position: absolute;
    right: 0px;
    text-align: center;
}

.iosBackButton
{
    background-repeat: no-repeat;
    cursor: pointer;
    display: inline-block;
    height: 100%;
    left: 0px;
    position: absolute;
    width: 66px;
}

    .customTab:hover,
    .iosBackButton:hover,
.iosTab:not(.activeIosTab):hover
{
        opacity: .8;
    }

.iosBackButton:active
{
        opacity: .2;
    }
.editor_container {

    min-height: 850px;
}

    .editor_container.scale_75 > td #iphone {
        -webkit-transform: scale(0.75);
        -ms-transform: scale(0.75);
        -o-transform: scale(0.75);
        transform: scale(0.75);
        min-height: 850px;
    }

    .editor_container.scale_50 > td #iphone {
        -webkit-transform: scale(0.5);
        -ms-transform: scale(0.5);
        -o-transform: scale(0.5);
        transform: scale(0.5);
        min-height: 850px;
    }

.simulator,
.simulatoriPhone6,
.simulatoriPhone6Plus,
.simulatoriPhoneX,
.simulatoriPhone11ProMax,
.simulatoriPad,
.simulatorKindle,
.simulatoriPhone,
.simulatorNexus4,
.simulatorNexus5,
.simulatorNexus6,
.simulatorPixel,
.simulatorGalaxyS10Plus,
.simulatorNexus7,
.simulatorNexus10,
.simulatorWebApp {
    width: 382px;
    height: 728px;
    background-repeat: no-repeat;
    position: relative;
    margin: 0 auto;
}

.simulatorWebApp
{
    background-color: #dedede;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
	width:370px;
	height:540px;
}
.simulatoriPhone6
{
    width: 450px;
    height: 895px;
}
.simulatoriPhone6Plus
{
    width: 483px;
    height: 978px;
    -webkit-background-size: 483px 978px;
    background-size: 483px 978px;
}
.simulatoriPad
{
	width:882px;
	height:1250px;
}

.simulatoriPhoneX {
    width: 483px;
    height: 978px;
    -webkit-background-size: 100% 100%;
    background-size: 100% 100%;
}

.simulatoriPhone11ProMax {
    width: 493px;
    height: 968px;
    -webkit-background-size: 100% 100%;
    background-size: 100% 100%;
}

.simulatoriPad {
    width: 882px;
    height: 1250px;
}

.simulatorKindle {
    width: 758px;
    height: 1074px;
    -webkit-background-size: 100% 100%;
    background-size: 100% 100%;
}

.simulatoriPhone {
    height: 800px;
}

.simulatorNexus4 {
    height: 830px;
    width: 430px;
}

.simulatorNexus5 {
    height: 791px;
    width: 403px;
}

.simulatorNexus6 {
    height: 859px;
    width: 454px;
}

.simulatorPixel {
    height: 940px;
    width: 458px;
}

.simulatorGalaxyS10Plus {
    height: 940px;
    width: 390px;
}

.simulatorNexus7 {
    width: 720px;
    height: 1263px;
}

.simulatorNexus10 {
    width: 1066px;
    height: 1548px;
}

.simulatorlandscape,
.simulatorlandscapeiPad,
.simulatorlandscapeKindle,
.simulatorlandscapeiPhone,
.simulatorlandscapeiPhone6,
.simulatorlandscapeiPhone6Plus,
.simulatorlandscapeiPhoneX,
.simulatorlandscapeiPhone11ProMax,
.simulatorlandscapeNexus4,
.simulatorlandscapeNexus5,
.simulatorlandscapeNexus6,
.simulatorlandscapePixel,
.simulatorlandscapeGalaxyS10Plus,
.simulatorlandscapeNexus7,
.simulatorlandscapeNexus10,
.simulatorlandscapeWebApp {
    width: 728px;
    height: 386px;
    background-repeat: no-repeat;
    position: relative;
}

.simulatorlandscapeWebApp
{
    background-color: #dedede;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
	width:540px;
	height:370px;
}

.simulatorlandscapeiPad
{
	width:1250px;
	height:882px;
}

.simulatorlandscapeKindle {
    width: 1074px;
    height: 758px;
}

.simulatorlandscapeiPhone {
    width: 800px;
}

.simulatorlandscapeiPhone6 {
    width: 882px;
    height: 433px;
}

.simulatorlandscapeiPhone6Plus {
    width: 958px;
    height: 475px;
    -webkit-background-size: 958px 475px;
    background-size: 958px 475px;
}

.simulatorlandscapeiPhoneX {
    width: 958px;
    height: 475px;
    -webkit-background-size: 958px 475px;
    background-size: 958px 475px;
}

.simulatorlandscapeiPhone11ProMax {
    width: 968px;
    height: 493px;
    -webkit-background-size: 968px 493px;
    background-size: 968px 493px;
}

.simulatorlandscapeNexus4
{
	height:450px;
	width:830px;
}

.simulatorlandscapeNexus5
{
	height:403px;
	width:791px;
}

.simulatorlandscapeNexus6
{
	height:454px;
	width:859px;
}

.simulatorlandscapePixel {
    height: 458px;
    width: 940px;
}

.simulatorlandscapeGalaxyS10Plus {
    height: 379px;
    width: 783px;
}

.simulatorlandscapeNexus7
{
	height:720px;
	width:1263px;
}

.simulatorlandscapeNexus10
{
	height:1075px;
	width:1548px;
}

.content
{
    height: 100%;
    overflow: hidden;
    width: 100%;
    
    /* Properties below are to overwrite publisher properties in custom.css. */
    margin: 0px;
    padding: 0px;
}

.contentframe
{
    min-height:100%;
    min-width:100%;
    overflow-x: hidden;
    overflow-y: scroll;
}

.codearea
{
    background-color: #e8e8e8;
    border: solid 1px #aaa;
    height: 100%;
    width: 100%;
}

.codediv
{
    display: none;
    height: 100%;
    position: absolute;
    width: 100%;
    z-index: 99;
}

.iformcurtain
{
    background-color: #d5d5d5;
    filter: alpha(opacity=80);
    height:100%;
    opacity: .8;
    position: absolute;
    visibility: hidden;
    width:100%;
}

.contentcontainer
{
    height: 100%;
    width: 100%;
    top: 0;
    -ms-overflow-style: none;
}
    .contentcontainer::-webkit-scrollbar {
        width: 0 !important;
    }

    .contentcontainer::-webkit-scrollbar-track {
        -webkit-border-radius: 0px;
        border-radius: 0px;
        background: rgba(0,0,0,0);
    }

    .contentcontainer::-webkit-scrollbar-thumb {
        -webkit-border-radius: 0px;
        border-radius: 0px;
        background: rgba(0,0,0,0);
    }

        .contentcontainer::-webkit-scrollbar-thumb:hover {
            background: rgba(0,0,0,0);
        }

        .contentcontainer::-webkit-scrollbar-thumb:window-inactive {
            background: rgba(0,0,0,0);
        }

.contentcontainereditmode,
.contentcontainereditmodeiPhone6,
.contentcontainereditmodeiPhone6Plus,
.contentcontainereditmodeiPhoneX,
.contentcontainereditmodeiPhone11ProMax,
.contentcontainereditmodeiPad,
.contentcontainereditmodeKindle,
.contentcontainereditmodeiPhone,
.contentcontainereditmodeNexus4,
.contentcontainereditmodeNexus5,
.contentcontainereditmodeNexus6,
.contentcontainereditmodePixel,
.contentcontainereditmodeGalaxyS10Plus,
.contentcontainereditmodeNexus7,
.contentcontainereditmodeNexus10,
.contentcontainereditmodeWebApp {
    border-style: none;
    height: 480px;
    left: 33px;
    overflow: hidden;
    position: absolute;
    top: 148px;
    width: 320px;
    overflow: hidden;
}

.contentcontainereditmodeWebApp
{
    border-radius: 5px;
    -moz-border-radius: 5px;
    left: 25px;
    top: 30px;
    height: 480px;
}

.contentcontainereditmodeKindle
{
	left:112px;
    top:112px; 
    height: 853px;
    width: 533px;
}

.contentcontainereditmodeiPad
{
	left:57px;
    top: 108px;
    height: 1024px;
    width: 768px;
}

.contentcontainereditmodeiPhone
{
	left:33px;
    top:118px;
    height: 568px;
}

.contentcontainereditmodeiPhone6
{
	left:38px;
    top:108px;
    height: 667px;
    width: 375px !important;
}

.contentcontainereditmodeiPhone6Plus
{
    left: 35px;
    top: 111px;
    height: 736px;
	width: 414px!important;
}

.contentcontainereditmodeiPhoneX {
    left: 35px;
    top: 75px;
    height: -webkit-calc(100% - 140px);
    height: calc(100% - 140px);
    width: -webkit-calc(100% - 70px) !important;
    width: calc(100% - 70px) !important;
}

.contentcontainereditmodeiPhone11ProMax {
    left: 40px;
    top: 90px;
    height: -webkit-calc(100% - 174px);
    height: calc(100% - 174px);
    width: -webkit-calc(100% - 79px) !important;
    width: calc(100% - 79px) !important;
}

    .contentcontainereditmodeiPhone11ProMax #iosStatusBar,
    .contentcontainereditmodelandscapeiPhone11ProMax #iosStatusBar{
        display: none !important;
    }

.contentcontainereditmodeNexus4 {
    left: 23px;
    top: 93px;
    height: 640px;
    width: 384px;
}

.contentcontainereditmodeNexus5 {
    left: 21px;
    top: 65px;
    height: 640px;
    width: 360px;
}

.contentcontainereditmodeNexus6 {
    left: 20px;
    top: 68px;
    height: 731px;
    width: 411px;
}

.contentcontainereditmodePixel {
    left: 22px;
    top: 95px;
    height: 731px;
    width: 411px;
}

.contentcontainereditmodeGalaxyS10Plus {
    left: 10px;
    top: 72px;
    height: 637px;
    width: 360px;
}

.contentcontainereditmodeNexus7 {
    left: 60px;
    top: 151px;
    height: 960px;
    width: 600px;
}

.contentcontainereditmodeNexus10 {
    left: 129px;
    top: 135px;
    height: 1280px;
    width: 800px;
}

.contentcontainereditmodelandscape,
.contentcontainereditmodelandscapeiPad,
.contentcontainereditmodelandscapeKindle,
.contentcontainereditmodelandscapeiPhone,
.contentcontainereditmodelandscapeiPhone6,
.contentcontainereditmodelandscapeiPhone6Plus,
.contentcontainereditmodelandscapeiPhoneX,
.contentcontainereditmodelandscapeiPhone11ProMax,
.contentcontainereditmodelandscapeNexus4,
.contentcontainereditmodelandscapeNexus5,
.contentcontainereditmodelandscapeNexus6,
.contentcontainereditmodelandscapePixel,
.contentcontainereditmodelandscapeGalaxyS10Plus,
.contentcontainereditmodelandscapeNexus7,
.contentcontainereditmodelandscapeNexus10,
.contentcontainereditmodelandscapeWebApp {
    left: 123px;
    top: 30px;
    position: absolute;
    background-color: #777;
    height: 320px;
    width: 480px;
}

.contentcontainereditmodelandscapeWebApp
{
    border-radius: 5px;
    -moz-border-radius: 5px;
    left: 30px;
    top: 30px;
    width: 480px;
}

.contentcontainereditmodelandscapeKindle
{
	left:112px;
    top:112px; 
    height: 533px;
    width: 853px;
}

.contentcontainereditmodelandscapeiPad
{
    left: 107px;
    top: 57px;
    height: 768px;
    width: 1024px;
}

.contentcontainereditmodelandscapeiPhone
{
    left: 118px;
    top: 30px;
    width: 568px;
}

.contentcontainereditmodelandscapeiPhone6
{
    left: 108px;
    top: 29px;
    width: 667px;
    height: 100%;
}

.contentcontainereditmodelandscapeiPhone6Plus
{
    left: 110px;
    top: 30px;
    width: 736px;
    height: 100%
}

.contentcontainereditmodelandscapeiPhoneX {
    left: 105px;
    top: 32px;
    width: 780px;
    height: 100%
}

.contentcontainereditmodelandscapeiPhone11ProMax {
    left: 90px;
    top: 39px;
    width: 794px;
    height: 100%;
}

#contentcontainer2.contentcontainereditmodelandscapeiPhone6 {
    height: 375px;
}

#contentcontainer2.contentcontainereditmodelandscapeiPhone6Plus {
    height: 414px;
}

#contentcontainer2.contentcontainereditmodelandscapeiPhoneX {
    height: 410px;
}

#contentcontainer2.contentcontainereditmodelandscapeiPhone11ProMax {
    height: 414px;
}

.contentcontainereditmodelandscapeiPhone11ProMax #conteintcontainer {
    height: 370px !important;
}

.contentcontainereditmodelandscapeNexus4 {
    left: 93px;
    top: 23px;
    height: 384px;
    width: 640px;
}

.contentcontainereditmodelandscapeNexus5 {
    left: 65px;
    top: 22px;
    height: 360px;
    width: 640px;
}

.contentcontainereditmodelandscapeNexus6 {
    left: 65px;
    top: 22px;
    height: 411px;
    width: 731px;
}

.contentcontainereditmodelandscapePixel {
    left: 95px;
    top: 22px;
    height: 411px;
    width: 731px;
}

.contentcontainereditmodelandscapeGalaxyS10Plus {
    left: 72px;
    top: 8px;
    height: 360px;
    width: 636px;
}

.contentcontainereditmodelandscapeNexus7 {
    left: 151px;
    top: 61px;
    height: 600px;
    width: 960px;
}

.contentcontainereditmodelandscapeNexus10 {
    left: 135px;
    top: 133px;
    height: 800px;
    width: 1280px;
}

.editabletopswitch,
.editabletopswitchiPad,
.editabletopswitchKindle,
.editabletopswitchiPhone,
.editabletopswitchiPhone6,
.editabletopswitchiPhone6Plus,
.editabletopswitchiPhoneX,
.editabletopswitchiPhone11ProMax,
.editabletopswitchNexus4,
.editabletopswitchNexus5,
.editabletopswitchNexus6,
.editabletopswitchPixel,
.editabletopswitchGalaxyS10Plus,
.editabletopswitchNexus7,
.editabletopswitchNexus10,
.editabletopswitchWebApp {
    left: 28px;
    top: 90px;
    height: 28px;
    width: 326px;
    position: absolute;
    overflow: hidden;
    background-image: url(../images/setting-grad.png);
    -webkit-border-radius: 1px;
    -moz-border-radius: 1px;
    border-radius: 1px;
    background: url(/images/background-whitecarbonfiber@2X.png) #C4C4C4;
    -webkit-background-size: 4px 4px;
    background-size: 4px;
    border: solid 1px #C4C4C4;
}
.modetoolboxitem
{
	border:solid 1px transparent;
	width:78px;
	height:24px;
    background-repeat: no-repeat;
}
.modetoolboxitem:hover
{
        background: rgba(255,255,255,0.6);
        border: solid 1px #B4B4B4;
        background-repeat: no-repeat;
        cursor: pointer;
        -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
        border-radius: 2px;
    }
.selmodetoolboxitem
{
	background-color:#f8f8f8;
	border:solid 1px #B4B4B4;
	width:78px;
	height:24px;
    background-repeat: no-repeat;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
}
.modetoolboxitemspan
{
    display: inline-block;
    padding: 1px;
    line-height: 10px;
    max-height: 10px;
    overflow: hidden
}
.modetoolboxitemspan:hover
{
        background: rgba(255,255,255,0.6);
        cursor: pointer;
    }
#layoutitem1,
#layoutitem2
{
    background-image: url(/images/cursor-layout.png);
}
#edititem1,
#edititem2
{
    background-image: url(/images/cursor-design.png);
}
#codeitem1,
#codeitem2
{
    background-image: url(/images/cursor-code.png);
}
.editabletopswitchWebApp
{
	left:24px; 
    top: 0px;
}

.editabletopswitchiPad
{
	left:53px; 
	top:75px;
	width:774px;
}

.editabletopswitchKindle
{
	left:112px; 
	top:82px;
	width:531px;
}

.editabletopswitchiPhone
{
    left: 28px;
    top: 85px;
}

.editabletopswitchiPhone6
{
    top: 75px;
    width: 378px;
    left: 35px;
}

.editabletopswitchiPhone6Plus
{
    top: 77px;
    left: 32px;
    width: 418px;
}

.editabletopswitchiPhoneX {
    top: 110px;
    left: 32px;
    width: 418px;
}

.editabletopswitchiPhone11ProMax {
    top: 110px;
    left: 32px;
    width: 418px;
}

.editabletopswitchNexus4
{
	left:23px; 
	top:63px;
	width:382px;
}

.editabletopswitchNexus5
{
	left:21px; 
	top:35px;
	width:358px;
}

.editabletopswitchNexus6
{
	left:20px; 
	top:38px;
	width:409px;
}

.editabletopswitchPixel {
    left: 20px;
    top: 38px;
    width: 409px;
}

.editabletopswitchGalaxyS10Plus {
    left: 20px;
    top: 38px;
    width: 409px;
}

.editabletopswitchNexus7
{
    left: 60px;
    top: 121px;
    width: 598px;
}

.editabletopswitchNexus10
{
	left:129px; 
	top:105px;
	width:798px;
}

.editablebottomswitch,
.editablebottomswitchiPad,
.editablebottomswitchKindle,
.editablebottomswitchiPhone,
.editablebottomswitchiPhone6,
.editablebottomswitchiPhone6Plus,
.editablebottomswitchNexus4,
.editablebottomswitchNexus5,
.editablebottomswitchNexus6,
.editablebottomswitchPixel,
.editablebottomswitchGalaxyS10Plus,
.editablebottomswitchNexus7,
.editablebottomswitchNexus10,
.editablebottomswitchWebApp
{
	left:29px; 
	top:606px;
    height: 28px;
    width:326px;
    position: absolute;
    overflow: hidden;
    -webkit-border-radius: 1px;
    -moz-border-radius: 1px;
    border-radius: 1px;
    background: url(/images/background-whitecarbonfiber@2X.png) #C4C4C4;
    -webkit-background-size: 4px 4px;
    background-size: 4px;
    border: solid 1px #C4C4C4;
}

.editablebottomswitchWebApp
{
	left:24px; 
	top:510px;
}

.editablebottomswitchiPad
{
	left:53px; 
	top:1135px;
	width:774px;
}

.editablebottomswitchKindle
{
	left:112px; 
	top:965px;
	width:531px;
}

.editablebottomswitchiPhone
{
    top: 689px;
    left: 28px;
}

.editablebottomswitchiPhone6
{
    top: 778px;
    width: 378px;
    left: 35px;
}

.editablebottomswitchiPhone6Plus
{
    top: 850px;
    left: 32px;
    width: 418px;
}

.editablebottomswitchNexus4
{
	left:23px; 
	top:733px;
	width:382px;
}

.editablebottomswitchNexus5
{
	left:21px; 
	top:705px;
	width:358px;
}

.editablebottomswitchNexus6
{
	left:20px; 
	top:798px;
	width:409px;
}

.editablebottomswitchPixel {
    left: 20px;
    top: 798px;
    width: 409px;
}

.editablebottomswitchGalaxyS10Plus {
    left: 20px;
    top: 798px;
    width: 409px;
}

.editablebottomswitchNexus7
{
    left: 60px;
    top: 1111px;
    width: 598px;
}

.editablebottomswitchNexus10
{
	left:129px; 
	top:1415px;
	width:798px;
}

.editabletopswitchlandscape,
.editabletopswitchlandscapeiPad,
.editabletopswitchlandscapeKindle,
.editabletopswitchlandscapeiPhone,
.editabletopswitchlandscapeiPhone6,
.editabletopswitchlandscapeiPhone6Plus,
.editabletopswitchlandscapeNexus4,
.editabletopswitchlandscapeNexus5,
.editabletopswitchlandscapeNexus6,
.editabletopswitchlandscapePixel,
.editabletopswitchlandscapeGalaxyS10Plus,
.editabletopswitchlandscapeNexus7,
.editabletopswitchlandscapeNexus10,
.editabletopswitchlandscapeWebApp
{
	left:123px; 
    top: -3px;
    height: 28px;
    width:479px;
    position: absolute;
    overflow: hidden;
    -webkit-border-radius: 1px;
    -moz-border-radius: 1px;
    border-radius: 1px;
    background: url(/images/background-whitecarbonfiber@2X.png) #C4C4C4;
    -webkit-background-size: 4px 4px;
    background-size: 4px;
    border: solid 1px #C4C4C4;
}

.editabletopswitchlandscapeWebApp
{
	left:29px; 
    top: 0px;
    width:480px;
}

.editabletopswitchlandscapeiPad
{
    left: 104px;
    top: 23px;
    width: 1029px;
}

.editabletopswitchlandscapeKindle
{
	left:112px; 
	top:82px;
	width:851px;
}

.editabletopswitchlandscapeiPhone
{
	left:115px; 
    top: -3px;
	width:572px;
}

.editabletopswitchlandscapeiPhone6
{
    left: 105px;
    top: -4px;
    width: 671px;
}

.editabletopswitchlandscapeiPhone6Plus
{
    left: 107px;
    top: -2px;
    width: 740px;
}

.editabletopswitchlandscapeNexus4
{
	left:93px; 
	top:-7px;
	width:638px;
}

.editabletopswitchlandscapeNexus5
{
	left:65px; 
    top: -8px;
	width:638px;
}

.editabletopswitchlandscapeNexus6
{
	left:65px; 
    top: -8px;
	width:729px;
}

.editabletopswitchlandscapePixel {
    left: 65px;
    top: -8px;
    width: 729px;
}

.editabletopswitchlandscapeGalaxyS10Plus {
    left: 65px;
    top: -8px;
    width: 729px;
}

.editabletopswitchlandscapeNexus7
{
	left:151px; 
	top:31px;
	width:958px;
}

.editabletopswitchlandscapeNexus10
{
	left:135px; 
	top:102px;
	width:1278px;
}

.editablebottomswitchlandscape,
.editablebottomswitchlandscapeiPad,
.editablebottomswitchlandscapeKindle,
.editablebottomswitchlandscapeiPhone,
.editablebottomswitchlandscapeNexus5,
.editablebottomswitchlandscapeNexus4,
.editablebottomswitchlandscapeNexus7,
.editablebottomswitchlandscapeNexus10,
.editablebottomswitchlandscapeWebApp
{
    transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
	left:500px; 
    top: 177px;
    height: 28px;
    width:320px; 
    position: absolute;
    overflow: hidden;
    background-image: url(../images/setting-grad.png);
}

.editablebottomswitchlandscapeiPad
{
	left:749px; 
	top:423px;
	width:768px;
}

.editablebottomswitchlandscapeKindle
{
	left:874px; 
	top:380px;
	width:600px;
}

.editablebottomswitchlandscapeiPhone
{
	left:585px;
}

.minglebody
{
	border-top:solid 1px #fff;
	background-color:#fff;
	padding-left:20px;
	padding-right:20px;
	min-height:308px;
	min-width:878px;
    -webkit-box-shadow: 0 0 1px rgba(0,0,0,.3);
	-moz-box-shadow: 0 0 1px rgba(0,0,0,.3);
    box-shadow: 0 0 1px rgba(0,0,0,.3);
    width: auto;
}

.androidStatusBar
{
    background-color: rgba(0, 0, 0, .2);
    background-image: url('/images/android-status-bar.png');
    background-position: center right;
    background-repeat: no-repeat;
    height: 25px;
}

.androidSystemBar
{
    background-color: #040404;
    background-image: url('/images/android-system-bar.png');
    background-position: center center;
    background-repeat: no-repeat;
    bottom: 0px;
    height: 48px;
    margin-bottom: 0px;
    position: absolute;
    text-align: center;
    width: 100%;
    z-index: 5;
}

.androidBackButton,
.androidBackButtonPlaceholder
{
    display: inline-block;
    height: 100%;
}

.androidBackButton
{
    background-color: #FFFFFF;
    -webkit-border-radius: 24px;
    border-radius: 24px;
    cursor: pointer;
    opacity: 0;
    width: 108px;
}

.androidBackButton:hover
{
        opacity: .1;
    }

.androidBackButton:active
{
        opacity: .19;
    }

.androidBackButtonPlaceholder
{
    width: 210px;
}

.slidepanelcontainer
{
    background-color: transparent;
    overflow: hidden;
	
    /* Properties below are to overwrite publisher properties in style.css. */
    left: initial;
    position: initial;
    top: initial;
    z-index: initial;
}

.slidePanelAndroid,
.slidePaneliPad,
.slidePaneliPhone,
.slidePaneliPhoneLandscape,
.slidePanelKindle,
.slidePanelWebApp
{
    background-color: #292929;
    height: 100%;
    left: 0px;
    overflow: hidden;
    position: absolute;
    width: 100%;
    z-index: 1;
}

.slidePaneliPad,
.slidePaneliPhone
{
    top: 64px; /* space for iOS status and navigation bars */
}

.slidePaneliPhoneLandscape
{
    top: 44px; /* space for iOS navigation bar */
}

.slidePanelWebApp
{
    top: 44px;
}

.contentcontainer {
    height: 100%;
    width: 100%;
    top: 0;
    -ms-overflow-style: none;
}

.slide-panel-iframe::-webkit-scrollbar {
    width: 0 !important;
}

.slide-panel-iframe::-webkit-scrollbar-track {
    -webkit-border-radius: 0px;
    border-radius: 0px;
    background: rgba(0,0,0,0);
}

.slide-panel-iframe::-webkit-scrollbar-thumb {
    -webkit-border-radius: 0px;
    border-radius: 0px;
    background: rgba(0,0,0,0);
}

    .slide-panel-iframe::-webkit-scrollbar-thumb:hover {
        background: rgba(0,0,0,0);
    }

    .slide-panel-iframe::-webkit-scrollbar-thumb:window-inactive {
        background: rgba(0,0,0,0);
    }

.slide-panel-iframe {
    min-height: 100%;
    min-width: 100%;
    overflow-y: scroll;
}
    .slide-panel-iframe.iPhone,
    .slide-panel-iframe.iPad {
        min-height: -webkit-calc(100% - 64px);
        min-height: calc(100% - 64px);
    }
    .slide-panel-iframe.landscape.iPhone,
    .slide-panel-iframe.landscape.iPad {
        min-height: -webkit-calc(100% - 44px);
        min-height: calc(100% - 44px);
    }
    .slide-panel-iframe.Android,
    .slide-panel-iframe.Kindle {
        min-height: -webkit-calc(100% - 129px);
        min-height: calc(100% - 129px);
    }
    .slide-panel-iframe.WebApp {
        min-height: -webkit-calc(100% - 44px);
        min-height: calc(100% - 44px);
    }

.simulator-props {
    padding: 15px 0;
    min-width: 410px;
    text-align: left;
}
.simulator-props .rotationicon
{
        cursor: pointer;
        height: 29px;
        margin: 0 10px 0 5px;
        vertical-align: top;
        width: 15px;
        -webkit-transition: all 0.4s ease-in-out;
	-moz-transition: all 0.4s ease-in-out;
        -o-transition: all 0.4s ease-in-out;
        transition: all 0.4s ease-in-out;
    }
        .simulator-props .rotationicon.landscape {
            filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
            -webkit-transform: rotate(-90deg);
            -ms-transform: rotate(-90deg);
            -o-transform: rotate(-90deg);
            transform: rotate(-90deg);
            margin: 0 15px 0 15px;
        }
        .simulator-props .rotationicon:hover {
            opacity: 0.9;
        }

.contentcontainereditmodeGalaxyS10Plus .androidStatusBar,
.contentcontainereditmodeGalaxyS10Plus .androidSystemBar,
.contentcontainereditmodelandscapeGalaxyS10Plus .androidStatusBar,
.contentcontainereditmodelandscapeGalaxyS10Plus .androidSystemBar {
    display: none;
}

.contentcontainereditmodeGalaxyS10Plus .slidePanelAndroid {
    height: 108%;
}

.simulatorlandscapeGalaxyS10Plus .slidePanelAndroid {
    height: 113%;
}

.contentcontainereditmodeGalaxyS10Plus .androidAppBar {
    top: 14px !important;
    height: 66px;
}

.contentcontainereditmodeGalaxyS10Plus .sidenav {
    margin-top: 60px !important;
}

.simulatorlandscapeGalaxyS10Plus .sidenav {
    margin-top: 43px !important;
}

.simulatorlandscapeGalaxyS10Plus .androidAppBar {
    top: 0 !important;
    height: 63px;
}

@media
(min-resolution: 2dppx),
(min-resolution: 192dpi),
(min-device-pixel-ratio: 2),
(-webkit-min-device-pixel-ratio: 2) {
    /*** portrait ***/
    .simulatoriPhone {
        background-image: url(/images/iphonewebsimulator@2x.png) !important;
        -webkit-background-size: 382px 800px;
        background-size: 382px 800px;
    }

    .simulatoriPhone6 {
        background-image: url(/images/iphone6websimulator@2x.png) !important;
        -webkit-background-size: 450px 895px;
        background-size: 450px 895px;
    }

    .simulatoriPhone6Plus {
        background-image: url(/images/iphone6pluswebsimulator@2x.png) !important;
        -webkit-background-size: 483px 978px;
        background-size: 483px 978px;
    }

    .simulatoriPhoneX {
        background-image: url(/images/iphonexwebsimulator.png) !important;
        -webkit-background-size: 100% 100%;
        background-size: 100% 100%;
    }

    .simulatoriPhone11ProMax {
        background-image: url(/images/iphone11promaxwebsimulator.png) !important;
        -webkit-background-size: 100% 100%;
        background-size: 100% 100%;
    }

    .simulatorNexus4 {
        background-image: url(/images/nexus4websimulator@2x.png) !important;
        -webkit-background-size: 430px 829px;
        background-size: 430px 829px;
    }

    .simulatorNexus5 {
        background-image: url(/images/nexus5websimulator@2x.png) !important;
        -webkit-background-size: 403px 791px;
        background-size: 403px 791px;
    }

    .simulatorNexus6 {
        background-image: url(/images/nexus6websimulator@2x.png) !important;
        -webkit-background-size: 454px 859px;
        background-size: 454px 859px;
    }

    .simulatorNexus7 {
        background-image: url(/images/nexus7websimulator@2x.png) !important;
        -webkit-background-size: 720px 1263px;
        background-size: 720px 1263px;
    }

    /*** landscape ***/
    .simulatorlandscapeiPhone {
        background-image: url(/images/iphonelandscapewebsimulator@2x.png) !important;
        -webkit-background-size: 800px 382px;
        background-size: 800px 382px;
    }

    .simulatorlandscapeiPhone6 {
        background-image: url(/images/iphone6landscapewebsimulator@2x.png) !important;
        -webkit-background-size: 882px 433px;
        background-size: 882px 433px;
    }

    .simulatorlandscapeiPhone6Plus {
        background-image: url(/images/iphone6pluslandscapeeditsimulator2@2x.png) !important;
        -webkit-background-size: 958px 475px;
        background-size: 958px 475px;
    }

    .simulatorlandscapeiPhoneX {
        background-image: url(/images/iphonexlandscapeeditsimulator.png) !important;
        -webkit-background-size: 958px 475px;
        background-size: 958px 475px;
    }

    .simulatorlandscapeiPhone11ProMax {
        background-image: url(/images/iphone11promaxlandscapeeditsimulator.png) !important;
        -webkit-background-size: 968px 493px;
        background-size: 968px 493px;
    }

    .simulatorlandscapeNexus4 {
        background-image: url(/images/nexus4landscapewebsimulator@2x.png) !important;
        -webkit-background-size: 829px 430px;
        background-size: 829px 430px;
    }

    .simulatorlandscapeNexus5 {
        background-image: url(/images/nexus5landscapewebsimulator@2x.png) !important;
        -webkit-background-size: 791px 403px;
        background-size: 791px 403px;
    }

    .simulatorlandscapeNexus6 {
        background-image: url(/images/nexus6landscapewebsimulator@2x.png) !important;
        -webkit-background-size: 859px 454px;
        background-size: 859px 454px;
    }

    .simulatorlandscapeNexus7 {
        background-image: url(/images/nexus7landscapewebsimulator@2x.png) !important;
        -webkit-background-size: 1263px 720px;
        background-size: 1263px 720px;
    }

    .simulatorKindle {
        background-image: url(/images/kindlewebsimulator@2x.png) !important;
        -webkit-background-size: 758px 1074px;
        background-size: 758px 1074px;
    }

    /*** portrait edit ***/
    .simulator-edit.simulatoriPhone {
        background-image: url(/images/iphoneeditsimulator2@2x.png) !important;
        -webkit-background-size: 382px 800px;
        background-size: 382px 800px;
    }

    .simulator-edit.simulatoriPhone6 {
        background-image: url(/images/iphone6editsimulator2@2x.png) !important;
        -webkit-background-size: 450px 895px;
        background-size: 450px 895px;
    }

    .simulator-edit.simulatoriPhone6Plus {
        background-image: url(/images/iphone6pluseditsimulator2@2x.png) !important;
        -webkit-background-size: 483px 978px;
        background-size: 483px 978px;
    }

    .simulator-edit.simulatoriPhoneX {
        background-image: url(/images/iphonexwebsimulator.png) !important;
        -webkit-background-size: 100% 100%;
        background-size: 100% 100%;
    }

    .simulator-edit.simulatoriPhone11ProMax {
        background-image: url(/images/iphone11promaxwebsimulator.png) !important;
        -webkit-background-size: 100% 100%;
        background-size: 100% 100%;
    }

    /*** landscape edit ***/
    .simulator-edit.simulatorlandscapeiPhone {
        background-image: url(/images/iphonelandscapeeditsimulator2@2x.png) !important;
        -webkit-background-size: 800px 382px;
        background-size: 800px 382px;
    }

    .simulator-edit.simulatorlandscapeiPhone6 {
        background-image: url(/images/iphone6landscapeeditsimulator2@2x.png) !important;
        -webkit-background-size: 882px 433px;
        background-size: 882px 433px;
    }

    .simulator-edit.simulatorlandscapeiPhone6Plus {
        background-image: url(/images/iphone6pluslandscapeeditsimulator@2x.png) !important;
        -webkit-background-size: 958px 475px;
        background-size: 958px 475px;
    }

    .iosStatusBarSignalDark {
        background-image: url('/images/ios-status-bar/dark-theme/signal@2x.png');
        -webkit-background-size: auto 20px;
        background-size: auto 20px;
    }

    .iosStatusBarSignalLight {
        background-image: url('/images/ios-status-bar/light-theme/signal@2x.png');
        -webkit-background-size: auto 20px;
        background-size: auto 20px;
    }

    .iosStatusBarChargeDark {
        background-image: url('/images/ios-status-bar/dark-theme/charge@2x.png');
        -webkit-background-size: auto 20px;
        background-size: auto 20px;
    }

    .iosStatusBarChargeLight {
        background-image: url('/images/ios-status-bar/light-theme/charge@2x.png');
        -webkit-background-size: auto 20px;
        background-size: auto 20px;
    }

    .androidStatusBar {
        background-image: url('/images/android-status-bar@2x.png');
        -webkit-background-size: 90px 25px;
        background-size: 90px 25px;
    }

    .androidSystemBar {
        background-image: url('/images/android-system-bar@2x.png');
        -webkit-background-size: 228px 20px;
        background-size: 228px 20px;
    }

    #layoutitem1, #layoutitem2 {
        background-image: url(/images/cursor-layout@2x.png);
        -webkit-background-size: 78px 24px;
        background-size: 78px 24px;
    }

    #edititem1, #edititem2 {
        background-image: url(/images/cursor-design@2x.png);
        -webkit-background-size: 78px 24px;
        background-size: 78px 24px;
    }

    #codeitem1, #codeitem2 {
        background-image: url(/images/cursor-code@2x.png);
        -webkit-background-size: 78px 24px;
        background-size: 78px 24px;
    }
}

.semi_block {
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    min-width: 42px;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 39px;
}

.semi_block_header {
    padding: 5px 0;
    font-size: small;
    margin-top: 17px;
    text-align: left;
    vertical-align: middle;
    cursor: pointer;
    background-color: #F0F0F0;
}

.semi_block.icon_white{
    display: none;
}

.first_fb.active .semi_block.icon_white{
    display: inherit;
}

.first_fb.active .semi_block.icon_black{
    display: none;
}

.first_toolbar{
    padding: 0 !important;
}

.first_fb.active {
    background-color: #3caa3a;
    color: #ffffff;
}

#minglebody_iconmenu{
    padding-bottom: 33px !important;
}

.semi_block_header.second_toolbar.active{
    background-color: #3caa3a;
    color: #ffffff;
}

.semi_block_header.second_toolbar.active .full_block.second_fb .semi_block.icon_white{
    display: inherit;
}

.semi_block_header.second_toolbar.active .full_block.second_fb .semi_block.icon_black{
    display: none;
}

.semi_block_header.third_toolbar.active{
    background-color: #3caa3a;
    color: #ffffff;
}

.semi_block_header.third_toolbar.active .full_block.third_fb .semi_block.icon_white{
    display: inherit;
}

.semi_block_header.third_toolbar.active .full_block.third_fb .semi_block.icon_black{
    display: none;
}

.first_fb{
    height: 39px;
    border-bottom: 1px solid white;
}

.full_block{
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}
.full_block > .modetoolboxitemspan{
    padding: 0 0 4px 10px;
    font-size: 12px!important;
}

#iphone{
    visibility: hidden;
}

.sidenav {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 1;
    top: 20px;
    left: 0;
    bottom: 100px;
    position: absolute;
    overflow-x: hidden;
    -webkit-transition: 0.33s;
    -o-transition: 0.33s;
    transition: 0.33s;
}

    .sidenav a {
        display: flex!important;
        align-items: center;
        text-decoration: none;
        font-size: 10px;
        color: #818181;
        display: block;
        -webkit-transition: 0.0s;
        -o-transition: 0.0s;
        transition: 0.0s;
        height: 36px;
        padding: 0 0 0 30px;
        position: relative;
    }
    .sidenav a > img{
        position: absolute;
        left: 6px;
        top: 50%;
        transform: translateY(-50%);
    }
    .sidenav div {
        text-decoration: none;
        font-size: 25px;
        color: #818181;
        -webkit-transition: 0.0s;
        -o-transition: 0.0s;
        transition: 0.0s;
    }

.sidenavitem {
    background-repeat: no-repeat;
    background-position: center;
}

.sidenavitemActive {
    background-repeat: no-repeat;
    background-position: center;
}

.sidenavitemText {
    margin-left: 24px;
}

.sidenavitemTextActive {
}

.sidenavitemImageActive {
}

.sidenavitemImage {
    width: 22px;
    height: 22px;
}

.sidenavHeader {
    width:auto; 
    height:150px; 
    margin:0px; 
    background-position: left top; 
    background-repeat: no-repeat;
    background-size: contain;
}


    .sidenav a:hover {
        color: #f1f1f1;
    }

@media screen and (max-height: 450px) {
    .sidenav a {
        font-size: 18px;
    }
}

.simulator_side {
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
     align-items: center;
}
#iPhoneXSize{
    margin-top: 10px;
}
img#rotationicon {
    vertical-align: middle;
}
@media screen and (min-width: 1020px) {
    #targetSelector + br {
        display: none;
    }
}

/*----------IE Fixes-----10-11-----*/
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    select.select::-ms-expand {
        display: none;
    }
}

.floating_menu_container {
    position: absolute;
    width: inherit;
    height: inherit;
    pointer-events: none;
}

.floating_menu_container > div {
    pointer-events: auto;
}

.floating_button {
    background-color: #ff00ff;
    width: 55px;
    height: 55px;
    border-radius: 50%;
    position: absolute;
    bottom: 65px;
    right: calc(2% + 10px);
    box-shadow: 3px 5px 8px rgba(0,0,0,0.16);
    z-index: 4;
}

    .floating_button.no_shadow {
        box-shadow: none;
    }

    .floating_button:hover {
        cursor: pointer;
        box-shadow: 0 0 11px rgba(33,33,33,.2);
    }

    .floating_button img {
        width: 25px;
        height: 25px;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

#floating_button_close_icon {
    width: 40px;
    height: 40px;
}

.floating_wrapper {
    position: absolute;
    width: calc(100% - 40px);
    height: 55%;
    background-color: #ffffff;
    bottom: 15px;
    left: 50%;
    transform: translateX(-50%);
    box-shadow: 3px 6px 5px 8px rgba(0,0,0,0.16);
    border-radius: 20px;
    padding: 10px;
    display: none;
    overflow: hidden;
    z-index: 2;
}

.floating_content {
    width: 100%;
    height: 100%;
    text-align: center;
    align-content: flex-start;
    text-decoration: none;
    box-sizing: content-box;
    display: inline-flex;
    flex-wrap: wrap;
    flex-flow: row wrap;
    justify-content: center;
    align-items: center;
    overflow: auto;
}

.floatingnav_item span {
    display: block;
    width: 100%;
    font-size: 14px;
    min-height: 14px;
    color: #444444;
    white-space: nowrap;
    overflow: hidden;
    text-align: center;
    text-overflow: ellipsis;
    font-weight: 600;
    font-family: 'roboto_medium';
}

.floatingnav_item img,
.floatingnav_item_h img {
    max-width: 40px;
    max-height: 40px;
}

.floating_wrapper_h {
    display: none;
    width: 100%;
    background-color: rgba(255,255,255,0.93);
    height: 100%;
    position: absolute;
    display: none;
    overflow: hidden;
    z-index: 2;
}

    .floating_wrapper_h .floating_header_container > img {
        margin: auto;
        max-height: 100px;
        max-width: 100px;
    }

.floating_header_container {
    display: inline-flex;
    height: 30%;
    width: 100%;
    justify-content: center;
}

.landscape .floating_header_container {
    display: inline-flex;
    height: 100%;
    width: 30%;
    justify-content: center;
}

.landscape .floating_content_h_outer {
    width: 70%;
    height: 100%;
}

.floating_content_h_outer {
    width: calc(100% + 1px);
    height: calc(80% - 38px);
    overflow: auto;
    display: inline-flex;
    justify-content: center;
    align-items: flex-start;
    align-content: center;
}

.floating_content_h {
    display: inline-flex;
    width: 100%;
    text-align: center;
    align-content: flex-start;
    text-decoration: none;
    box-sizing: content-box;
    flex-wrap: wrap;
    flex-flow: row wrap;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    align-items: center;
    padding-bottom: 20px;
}

.floatingnav_item_h {
    height: 100%;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .floatingnav_item_h > div > div {
        width: 61px;
        height: 40px;
        position: relative;
        margin-bottom: 5px;
    }

.floatingnav_item_h img {
    max-width: 40px;
    max-height: 40px;
}

.floatingnav_item_h span {
    display: block;
    width: 60px;
    text-align: center;
    font-size: 14px;
    color: #444444;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
    font-weight: 600;
    font-family: 'roboto_medium';
}

.floatingnav_item_parent,
.floatingnav_fantom_item_parent {
    width: 29%;
    min-width: 50px;
    max-width: 89px;
}

.floatingnav_fantom_item_parent {
    visibility: hidden;
    margin: 0 2% 0 2%;
}

.floatingnav_item_parent {
    margin: 2%;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    display: inline-flex;
}

    .floatingnav_item_parent::before {
        content: '';
        padding-top: 100%;
        float: left;
    }

    .floatingnav_item_parent::after {
        content: '';
        display: block;
        clear: both;
    }

.floatingnav_item_parent:hover {
    box-shadow: 0 0 11px rgba(33,33,33,.2);
}

.floatingnav_item {
    height: 100%;
    width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

    .floatingnav_item > div > div {
        height: 40px;
        position: relative;
        margin-bottom: 5px;
    }

.floating_wrapper.landscape {
    height: calc(100% - 40px);
}

.floating_content_h.landscape {
    margin: auto;
    margin-right: 60px;
}

.floating_wrapper_h.landscape {
    padding: 0;
    width: 100%;
    display: flex;
}

.landscape .floating_header_container > img {
    margin: auto;
    display: inline-flex;
}