.minified #main {
    margin-left: 0px!important;
    padding-left: 45px;
    margin-top: 49px;
}
.ui-widget-overlay {
    background: #AAA;
    height: 100%;
    z-index: 949!important;
    position: fixed;
    top: 0;
    left: 0;
}

.ui-widget-overlay {
    opacity: .3;
    filter: alpha(opacity=30);
    width: 100%;
}
.ui-front {
    z-index: 100;
}
.ui-dialog {
    -webkit-box-shadow: 0 5px 15px rgba(0,0,0,.5);
    box-shadow: 0 5px 15px rgba(0,0,0,.5);
    border: 1px solid #999;
    border: 1px solid rgba(0,0,0,.2);
}
.ui-dialog {
    position: absolute;
    top: 0;
    left: 0;
    padding: 0;
    width: 300px;
    overflow: hidden;
    background-clip: padding-box;
    background-color: #fff;
    border-radius: 6px;
    -moz-box-shadow: 0 3px 7px rgba(0,0,0,.3);
    outline: medium none;
    z-index: 1050;
}
.ui-corner-all {
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}
.ui-widget-content {
    border: 1px solid #aaa;
    background: #fff;
    color: #404040;
}
.ui-widget {
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 13px;
}
.ui-slider-horizontal .ui-slider-handle {
    top: -.35em;
    margin-left: -.6em;
    background-color: #357F35;
    border-color: #CCC;
    border-radius: 10px;
}
.ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .wijmo-wijmenu .ui-state-default {
    text-shadow: none;
}
.ui-slider-horizontal .ui-slider-handle {
    top: -.3em;
    margin-left: -.6em;
    background-color: #fff;
    border-color: #CCC;
}
.ui-slider .ui-slider-handle {
    position: absolute;
    z-index: 2;
    width: 16px;
    height: 18px;
    cursor: default;
}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
    color: #333;
    background-color: #fff;
    font-weight: 400;
    border: 1px solid #ccc;
}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
    background: 0 0;
}
.ui-widget :active {
    outline: 0;
}
.ui-widget .ui-widget {
    font-size: 13px;
}
.ui-slider-horizontal {
    height: 10px;
    background: #495FCC;
    border: none;
}

.ui-slider-horizontal {
    height: 10px;
    background: #D5D5D5;
    border: none;
}
.ui-slider {
    position: relative;
    text-align: left;
}
.ui-resizable {
    position: relative;
}
.ui-icon {
    width: 16px;
    height: 16px;
    background-image: url(../img/jqueryui/ui-icons_222222_256x240.png);
}
.ui-resizable-se {
    cursor: se-resize;
    width: 12px;
    height: 12px;
    right: 1px;
    bottom: 1px;
}
.ui-resizable-handle {
    position: absolute;
    font-size: .1px;
    z-index: 99999;
    display: block;
}
.ui-icon {
    display: block;
    text-indent: -99999px;
    overflow: hidden;
    background-repeat: no-repeat;
}
.frame ul,
.hsframe ul,
.hsframeIcon ul,
.pages {
    list-style: none
}

.center,
.containTextArea {
    text-align: center
}

.tabs-left>.tab-content {
    margin-left: 125px!important;
    background-color: #fff
}

.border-image-guide {
    border: 1px solid #D2D0D0
}

.with-70-percen {
    width: 70%
}

.max-with-30 {
    max-width: 30px
}

.max-width-70,
.max-with-70 {
    max-width: 70px
}

.with-30 {
    width: 30px
}

.with-90-percen {
    width: 90%
}

.text-guide-tab {
    color: #004DFF!important;
    padding-right: 5px
}

#___plusone_0 {
    width: 58px!important;
    height: 69px!important;
    padding: 4px!important;
    margin-bottom: 5px!important
}

.Ina,
.b1,
.google-plus-icon,
.google-plus-iframe {
    width: 57px!important
}

.google-plus-container {
    position: absolute;
    right: 0;
    top: 0;
    width: 57px!important
}

.google-plus-iframe {
    z-index: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -khtml-opacity: 0;
    opacity: 0
}

.google-plus-icon {
    z-index: -1;
    height: 20px;
    background: url(http://static.educations.com/masterpages/pics/icons/social/gplusbw.png) no-repeat;
    position: absolute;
    top: 0;
    right: 0
}

.add-frame-area,
.add-icon-area,
.jcrop-holder img,
img.jcrop-preview {
    background-color: #fff
}

.g-plusone-area {
    display: block!important;
    padding-top: 4px
}

.display-inline-flex {
    display: inline-flex
}

.jcrop-holder {
    float: none!important
}

.add-frame-area {
    width: 150px;
    height: 160px;
    border-top: 3px solid #000
}

.add-icon-area {
    width: 75px;
    height: 70px;
    margin-left: 5px
}

#iconArea,
.contentarea {
    width: 1200px
}

.fb_iframe_widget iframe {
    position: absolute!important;
    bottom: 0!important;
    right: 0!important
}

.float-left {
    float: left
}

.padding-top-10 {
    padding-top: 10px
}

#iconArea {
    overflow: auto;
    padding-bottom: 5px;
    padding-top: 5px;
    background-color: #8a8484;
    max-height: 600px!important
}

#iconArea::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
    background-color: #F5F5F5
}

#iconArea::-webkit-scrollbar {
    width: 10px;
    height: 7px;
    background-color: #F5F5F5
}

.inline-group-custom {
    margin: 6px -11px -10px 0!important
}

#iconArea::-webkit-scrollbar-thumb {
    background-color: #0ae;
    background-image: -webkit-gradient(linear, 0 0, 0 100%, color-stop(.5, rgba(255, 255, 255, .2)), color-stop(.5, transparent), to(transparent))
}

.ui-dialog {
    z-index: 51111
}

.ui-widget-overlay {
    z-index: 11100!important
}

.max-height-70 {
    max-height: 70px
}

.ui-rotatable-handle {
    position: absolute;
    background-color: #FFF;
    opacity: .7;
    padding: 3px;
    border-radius: 3px;
    height: 19px!important;
    width: 19px;
    background-size: 70%;
    background-repeat: no-repeat;
    background-position: 4px 4px;
    left: 0;
    bottom: 0
}
.ui-rotatable-handle-beacon {
    position: absolute;
    background-color: #FFF;
    opacity: .7;
    padding: 3px;
    border-radius: 3px;
    height: 15px!important;
    width: 15px;
    background-size: 70%;
    background-repeat: no-repeat;
    background-position: 4px 4px;
    left: 0;
    bottom: 0
}
.ui-dialog .ui-dialog-content {
    min-height: 45px!important;
}

.ui-dialog .ui-dialog-content {
    position: relative;
    border: 0;
    padding: .5em 1em;
    background: 0 0;
    overflow: auto;
}
.ui-dialog .ui-dialog-titlebar {
    padding: 0 10px;
    background: #fff;
    border-bottom-color: #eee;
}
.ui-draggable .ui-dialog-titlebar {
    cursor: move;
}
.ui-dialog .ui-dialog-titlebar {
    position: relative;
    border: 0 0 0 1px solid;
    border-color: #fff;
    font-size: 18px;
    text-decoration: none;
    -webkit-border-bottom-right-radius: 0;
    -moz-border-radius-bottomright: 0;
    border-bottom-right-radius: 0;
    -webkit-border-bottom-left-radius: 0;
    -moz-border-radius-bottomleft: 0;
    border-bottom-left-radius: 0;
    border-bottom: 1px solid #ccc;
}
.ui-corner-all {
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}
.ui-widget-header {
    font-weight: 700;
    background-color: #F5F5F5;
    border-color: #DDD;
    color: #333;
}
.ui-helper-clearfix {
    display: block;
    min-height: 0;
}
.z-index-99 {
    z-index: 99
}
.ui-dialog .ui-dialog-titlebar-close {
    margin-top: -16px;
    margin-right: 4px;
}
.ui-dialog .ui-dialog-titlebar-close {
    position: absolute;
    right: .3em;
    top: 50%;
    width: 19px;
    margin: -12px 0 0 0;
    padding: 1px;
    height: 18px;
    font-size: 20px;
    font-weight: 700;
    line-height: 13.5px;
    text-shadow: 0 1px 0 #fff;
    filter: alpha(opacity=25);
    -khtml-opacity: .25;
    -moz-opacity: .25;
    opacity: .25;
    background: 0 0;
    border: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    color: red;
}
.colorpicker-area{
	width: 100%;
}
.ui-widget button, .ui-widget input, .ui-widget select, .ui-widget textarea {
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: inherit;
}
.ui-dialog-titlebar-close:before {
    content: "\f00d";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: 400;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 13px;
}

*, :after, :before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.imageMaterialArea {
   /* width: 220px;
    max-height: 900px;*/
    text-align: center;
    position: absolute;
    cursor: move
}

.containTextArea {
    position: absolute;
    cursor: move;
    width: 120%
}

.bottom-0 {
    bottom: 0
}

.cursor-text {
    cursor: text
}

.textCollage {
    padding: 0 0 22px 0px;
    min-width: 80px;
    width: max-content;
    display: inline-flex;
}

.imageMaterial {
    width: 200px
}

.imageIcon {
    padding-bottom: 5px
}

.area-on-image-right {
    position: absolute;
    right: 0
}

.imageFrameArea {
    position: inherit;
    z-index: 999999;
    -webkit-background-size: contain!important;-moz-background-size: contain!important; -o-background-size: contain!important;background-size: contain!important;background-position: center!important;
}
.imageFrameAreaFull {
    position: inherit;
    z-index: 999999;
    -webkit-background-size: 100% 100% !important;-moz-background-size: 100% 100% !important; -o-background-size: 100% 100% !important;background-size: 100% 100% !important;background-position: center!important;
}

.imageFrameArea:after {
    content: '';
    top: 0;
    right: 0;
    bottom: 0;
    left: 0
}

#backgroundForScreen {
    /*background: url(../images/transparent.png)*/
    background : white;
}

.padding-bottom-300 {
    padding-bottom: 300px
}

.padding-bottom-500 {
    padding-bottom: 500px
}

.frame-horizontal {
    width: 1600px;
    height: 900px
}

.frame-vertical {
    width: 900px;
    height: 1600px
}

.smart-form .ui-widget-content .ui-spinner-input {
    height: 18px
}

.center-span {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    width: 100%;
    height: 20px;
    font-weight: 600
}

.jarviswidget>header {
    height: auto!important
}

.img-are-view {
    display: flex;
    display: -webkit-box;
    overflow: auto
}

.padding-left-10 {
    padding-left: 10px
}

.margin-area-image {
    margin: -8px 2px 0!important
}

.max-width-20 {
    max-width: 20%
}

.margin-0-0-30 {
    margin: 0 0 30px
}

.margin-top-20 {
    margin-top: 20px
}

.margin-top-5 {
    margin-top: 5px
}

.height-400 {
    height: 400px
}

.width-percen-80 {
    width: 80%
}

.width-percen-100 {
    width: 100%
}

.background-color-f5f5f5 {
    background-color: #f5f5f5
}

.background-color-1D9C73 {
    background-color: #1D9C73;
    color: #1D9C73
}

.background-color-3D84F0 {
    background-color: #3D84F0;
    color: #fff
}

.color-fff {
    color: #fff!important
}

.font-size-13em {
    font-size: 1.3em
}

.label {
    font-weight: 700!important
}

.height-25 {
    height: 25px!important
}

.margin-0-2 {
    margin: 0 2px
}

.line-height-27 {
    line-height: 27px!important
}

.padding-top-18 {
    padding-top: 18px!important
}

.custom-header-create-image {
    height: 15px;
    background-color: #2977EF;
    margin-bottom: 5px;
    background-image: -webkit-gradient(linear, 0 0, 0 100%, color-stop(.5, rgba(255, 255, 255, .1)), color-stop(.5, transparent), to(transparent))
}

.header-custom {
    background-color: #FFF!important;
    background-image: none!important
}

#logo-group>span {
    display: inline-block;
    height: auto!important;
    float: left
}

#logo {
    display: inline-block;
    width: auto;
    margin-top: 0;
    margin-left: 9px
}

#logo img {
    width: 187px;
    height: auto;
    padding-left: 3px
}

.link-to-image {
    background-color: #739E73;
    color: #fff
}

.background-color-fff {
    background-color: #fff
}

.link-share-image {
    color: #080808;
    border: 1px solid #95e09b;
    padding: 2px 5px;
    margin-bottom: 5px;
    font-weight: 700;
    background-color: #e6fde4
}

.link-text {
    color: #000;
    font-weight: 700
}

.custom-background {
    background-image: linear-gradient(to bottom, #3D84F0, #FFF)!important
}

#custom-scroll::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
    background-color: #F5F5F5
}

#custom-scroll::-webkit-scrollbar {
    width: 5px;
    height: 10px;
    background-color: #F5F5F5
}

#custom-scroll::-webkit-scrollbar-thumb {
    background-color: #0ae;
    background-image: -webkit-gradient(linear, 0 0, 0 100%, color-stop(.5, rgba(255, 255, 255, .2)), color-stop(.5, transparent), to(transparent))
}

.jarviswidget-ctrls .button-icon {
    min-width: 25px;
    height: 25px;
    float: left;
    position: relative;
    font-family: Arial, Helvetica, sans-serif;
    border-left: none;
    line-height: 27px;
    font-size: 120%
}

.border-top-create-image {
    border-top: 3px solid #3D84F0!important;
    border-radius: 5px!important
}

.color-red {
    color: #B73939
}

.background-black {
    background-color: #000
}

.custom-icon-caret {
    margin-left: auto;
    margin-right: auto;
    display: table;
    color: #3D84F0
}

.color-3D84F0 {
    color: #3D84F0
}

.color-5b835b {
    color: #5b835b
}

.position-inherit {
    position: inherit
}

.button-for-logo {
    display: none
}

.hovershowdiv:hover .button-for-logo {
    display: inherit;
    position: absolute;
    z-index: 999;
    right: 10px
}

.display-inline-block,
.slider-handle {
    display: inline-block
}

.ui-slider-horizontal {
    height: 10px;
    background: #495FCC;
    border: none
}

.ui-slider-horizontal .ui-slider-handle {
    top: -.35em;
    margin-left: -.6em;
    background-color: #357F35;
    border-color: #CCC;
    border-radius: 10px
}

.delete-logo,
.opacity-logo {
    border-radius: 2px;
    padding: 3px
}

.delete-logo {
    background-color: #FFF;
    color: #D80707
}

.opacity-logo {
    background-color: #F5F5F5;
    color: #0747D8
}

.text-align-right {
    text-align: right!important
}

#clickTotopButon,
.MessageBoxMiddle,
.align-center,
.slider-handle {
    text-align: center
}

.ui-icon {
    width: 19px;
    color: #541515;
    background-color: #fff;
    height: 19px;
    opacity: .7;
    border-radius: 3px;
    background-position: -61px -220px
}

#imageLogo,
#imageLogolocal {
    z-index: 100;
    position: absolute;
    margin: auto;
    cursor: move;
    padding: 5px
}

#textOnImage,
#textOnImageLocal {
    z-index: 101;
    position: absolute;
    margin: auto;
    cursor: move;
    padding: 5px
}

#textOnImageArea,
#textOnImageAreaLocal {
    float: left;
    cursor: text;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

.choose-video {
    background-color: #169bd5;
    color: #fff;
    border: 1px solid #169bd5
}

.well {
    min-height: 20px;
    padding: 19px!important;
    background-color: #f5f5f5!important;
    border-radius: 2px!important
}

.padding-6-12 {
    padding: 6px 12px!important
}

.display-right-bottom {
    bottom: 2px;
    right: 2px
}

.display-right-top {
    top: 2px;
    right: 2px
}

.display-right-middle {
    top: 0;
    bottom: 0;
    right: 2px
}

.display-center-middle {
    top: 0;
    bottom: 0;
    right: 0;
    left: 0
}

.display-center-top {
    top: 0;
    left: 0;
    right: 0
}

.display-center-bottom {
    left: 0;
    bottom: 0;
    right: 0
}

.display-left-middle {
    top: 0;
    bottom: 0;
    left: 0
}

.display-left-top {
    top: 0;
    left: 0
}

.display-left-bottom {
    bottom: 0;
    left: 0
}

.top-0 {
    top: 0
}

.height-38 {
    height: 38px
}

.custom-video-choose {
    margin-top: 100px;
    padding: 41px 101px!important
}

.custom-video-choosed {
    padding: 25px 101px!important
}

.width-40-percen {
    width: 40%!important;
    overflow: visible
}

.overflow-visible {
    overflow: visible!important
}

.padding-left20-right20 {
    padding-left: 20px;
    padding-right: 20px
}

.slider-handle {
    position: absolute;
    width: 20px;
    height: 20px;
    border: 1px solid #FFF;
    background: #1D9C73;
    font-family: FontAwesome;
    font-style: normal;
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    line-height: 18px;
    font-size: 10px;
    color: #8A4444;
    text-shadow: 0 1px 0 rgba(77, 77, 77, .5);
    filter: progid: DXImageTransform.Microsoft.BasicImage(rotation=1);
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg)
}

#MsgBoxBackCamera,
#captureProgressArea,
.none-display,
.timerTest .clearDiv,
.timerTest .hours,
.timerTest .minutes {
    display: none
}

#clickTotopButon,
#toTop {
    color: #fff;
    bottom: 5px;
    right: 2px;
    z-index: 9999
}

.imgsize {
    width: 30%
}

.slider-handle:before {
    content: ""
}

.margin-left-right-5-5 {
    margin-left: 5px;
    margin-right: 5px
}

.margin-left-right-2-2 {
    margin-left: 2px;
    margin-right: 20px
}

.ui-spinner-down:active,
.ui-spinner-down:focus,
.ui-spinner-down:hover {
    background: #0C6D4E
}

.ui-spinner-down {
    background: #1D9C73
}

.ui-spinner-up:hover {
    background: #1B5282
}

.ui-spinner-up {
    background: #3276B1;
    border-radius: 0
}

.menu-on-top .menu-item-parent {
    max-width: none;
    min-width: 50px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: center;
    font-size: 13px
}

.no-background {
    background: 0 0!important
}

.max-width-100 {
    max-width: 100%
}

.max-width-80 {
    max-width: 80%
}

.pointer {
    cursor: pointer
}

.flag.flag-vi {
    background-position: -16px -165px
}

#draggable {
    width: 150px;
    height: 150px;
    padding: .5em
}

.ui-resizable-helper {
    border: 2px dotted #00F
}

.padding-right-5 {
    padding-right: 5px
}

.padding-right-3-left-3 {
    padding-right: 3px;
    padding-left: 3px
}

.padding-right-2-left-2 {
    padding-right: 2px;
    padding-left: 2px
}

.nav-tabs.bordered+.tab-content {
    border: none
}

.background-color-E6E6E6 {
    background-color: #E6E6E6
}

.no-radinus {
    border-radius: 0!important;
    -webkit-border-radius: 0!important
}

#portlet-header {
    cursor: move
}

.ui-widget-overlay {
    opacity: 0!important
}

.ui-dialog {
    border-radius: 1px;
    opacity: .8
}

.ui-dialog .ui-dialog-content {
    min-height: 45px!important
}

.custom-background-camera {
    background-image: linear-gradient(to bottom, #D8D7D7, #FFF)!important
}

.background-color-D8D7D7 {
    background-color: #D8D7D7
}

.background-color-e8e8e8 {
    background-color: #e8e8e8
}

.divMessageBoxOpacity {
    background: rgba(14, 14, 14, 0)
}

.timerTest .seconds {
    font-size: 45px
}

.MessageBoxContainerBottom {
    top: 98%
}

.MessageBoxMiddleFull {
    position: relative;
    left: 0;
    width: 100%
}

.progress-camera {
    background: #474544;
    -webkit-box-shadow: none
}

.custom-padding-camera {
    padding: 0!important
}

.bg-color-blue {
    background-color: #34D2E2!important
}

#toTop {
    padding-right: 7px;
    position: fixed
}

#clickTotopButon {
    padding: 1px 14px;
    background: #3E59A5;
    display: none;
    margin-bottom: 5px;
    border-radius: 50%;
}

.custom-display-percen {
    width: 40%!important;
    overflow: visible
}

.custom-display-percen-60 {
    width: 60%!important;
    overflow: visible;
    z-index: 99999999;
    opacity: .95
}

.button-main {
    background: #fff;
    color: #3276b1;
    border-radius: 0;
    border: 1px solid #cacaca;
    -webkit-box-shadow: inset 0 0 0 rgba(0, 0, 0, .05)
}

@media (min-width:480px) {
    .small-screen {
        display: none
    }
    .large-screen {
        display: inline-block
    }
}

@media (max-width:480px) {
    .small-screen {
        display: inline-block
    }
    .large-screen {
        display: none
    }
}

@media (min-width:979px) {
    #ribbon,
    .show-mobile {
        display: none
    }
    .hide-mobile {
        display: inline-block
    }
    .menu-on-top #main {
        margin-left: 0!important;
        margin-top: 100px!important
    }
    .menu-on-top aside#left-panel nav>ul>li>a {
        display: inline-block;
        height: auto;
        text-shadow: none!important;
        font-size: 13px;
        text-decoration: none;
        line-height: 20px;
        padding: 10px 9px!important
    }
    .menu-on-top nav>ul>li>a:after {
        content: "\f0dd"!important;
        top: 59%!important;
        color: #c5c3c3!important;
        left: 46%
    }
    .menu-on-top nav ul ul,
    .menu-on-top nav ul ul ul {
        background: #fff!important;
        border: none;
        padding: 0!important;
        -moz-box-shadow: inset 0 -4px 0 0 #bd2a2a;
        -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
        box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
        border-bottom: none;
        border-top: none;
        width: 200px;
        border-radius: 0;
        margin-left: 0
    }
    .menu-on-top nav ul ul .active>a {
        color: #fff!important
    }
    nav ul ul li {
        margin: 0;
        padding: 0;
        border-bottom: 1px solid #e0e0e0
    }
}

@media (max-width:979px) {
    .menu-on-top aside#left-panel nav {
        height: auto!important
    }
    .show-mobile {
        display: inline-block
    }
    .hide-mobile {
        display: none!important
    }
    .menu-on-top nav>ul>li.active>a {
        color: #fff!important
    }
    .fa-lg {
        font-size: 1.33333333em;
        line-height: .75em;
        vertical-align: 29%
    }
}

@media only screen and (max-width:1350px) {
    .wrap {
        display: inline-block;
        max-width: 800px!important
    }
    .contentarea {
        width: 950px!important
    }
}

@media (min-width:768px) {
    .mini-90-percent {
        width: 65%;
        max-height: 750px
    }
}
    @media (max-width:768px) {
        .custom-video-choose,
        .custom-video-choosed {
            padding: 10px 5px!important
        }
        .custom-video-choose {
            margin-top: 30px
        }
        .custom-display-percen {
            width: 90%!important;
            overflow: visible
        }
        #toTop {
            padding: 5px 6px
        }
        .visible-mobile {
            display: none!important
        }
        .show-mobile {
            display: inherit!important
        }
        .responsive-max-width-40 {
            max-width: 40%
        }
        .responsive-max-width-35 {
            max-width: 35%
        }
        .wrap {
            display: inline-block;
            max-width: 500px!important
        }
        .frame {
            height: 103px!important
        }
        .frame ul li {
            float: left!important;
            width: 180px!important
        }
        .add-frame-area {
            width: 110px!important;
            height: 114px!important
        }
        .hsframe ul li,
        .hsframeIcon ul li {
            width: 73px!important
        }
        .contentarea {
            width: 610px!important
        }
        .max-height-70 {
            max-height: 50px!important
        }
        .add-icon-area {
            width: 53px!important;
            height: 51px!important
        }
    }
    @media only screen and (max-width:768px) {
        .custom-display-camera {
            max-width: 400px;
            height: auto
        }
        .jcrop-holder img,
        img.jcrop-preview {
            max-width: 400px
        }
        #target {
            width: 400px
        }
        #frameImage {
            display: inline;
            float: left
        }
        #outimg {
            float: left
        }
        .custom-background-camera img,
        .mini-90-percent {
            width: 90%;
            max-height: 500px
        }
        .downloadandshare {
            font-size: 12px!important
        }
    }
    @media only screen and (max-width:600px) {
        .custom-display-camera,
        .jcrop-holder img,
        img.jcrop-preview {
            max-width: 350px
        }
        .text-mobile-left {
            text-align: left!important
        }
        #target {
            width: 350px
        }
        .button-action {
            font-size: 9px
        }
    }
    .frame-checkbok,
    .hsframe ul li,
    .hsframeIcon ul li,
    .srch-text {
        text-align: center
    }
    .frame ul li,
    .pages {
        padding: 0;
        text-align: center
    }
    @media only screen and (max-width:480px) {
        .custom-display-camera,
        .jcrop-holder img,
        img.jcrop-preview {
            max-width: 320px
        }
        .frame ul li,
        .jcrop-holder {
            float: left!important
        }
        #target {
            width: 320px
        }
        .frame {
            height: 80px!important
        }
        .frame ul li {
            width: 120px!important
        }
        .add-frame-area {
            width: 92px!important;
            height: 90px!important
        }
        .wrap {
            display: inline-block;
            max-width: 275px!important
        }
        .contentarea {
            width: 365px!important
        }
        .pages {
            display: none!important
        }
        .play-video-gif {
            margin-top: -28px!important;
            margin-left: -19px!important;
            height: 45px!important;
            width: 45px!important;
            line-height: 48px!important;
            font-size: 14px!important
        }
        .font-mobile-11 {
            font-size: 11px
        }
    }
    @media only screen and (max-width:320px) {
        .custom-display-camera,
        .jcrop-holder img,
        img.jcrop-preview {
            max-width: 300px
        }
        .frame ul li,
        .jcrop-holder {
            float: left!important
        }
        #target {
            width: 300px
        }
        .frame {
            height: 50px!important
        }
        .frame ul li {
            width: 80px!important
        }
        .add-frame-area {
            width: 62px!important;
            height: 64px!important
        }
        .wrap {
            display: inline-block;
            max-width: 230px!important
        }
        .pages {
            display: none!important
        }
        .contentarea {
            width: 240px!important
        }
    }
    .frame ul li,
    .hsframe ul li,
    .hsframeIcon ul li {
        float: left;
        cursor: pointer
    }
    .pages li,
    .wrap {
        display: inline-block
    }
    .wrap {
        max-width: 1050px
    }
    .frame {
        height: 140px;
        line-height: 140px;
        overflow: hidden
    }
    .frame ul {
        margin: 0;
        padding: 0;
        height: 100%;
        font-size: 50px
    }
    .frame ul li {
        width: 200px;
        height: 100%;
        margin: 0 1px 0 0;
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
        color: #ddd
    }
    .frame ul li.active {
        color: #fff
    }
    .scrollbar {
        margin: 0 0 1em;
        height: 3px;
        background: #ccc;
        line-height: 0
    }
    .scrollbar .handle {
        width: 100px;
        height: 100%;
        background: #292a33;
        cursor: pointer
    }
    .scrollbar .handle .mousearea {
        position: absolute;
        top: -9px;
        left: 0;
        width: 100%;
        height: 20px
    }
    .pages {
        margin: 20px 0
    }
    .pages li {
        width: 14px;
        height: 14px;
        margin: 0 4px;
        text-indent: -999px;
        border-radius: 10px;
        cursor: pointer;
        overflow: hidden;
        background: #fff;
        box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .2)
    }
    .pages li:hover {
        background: #aaa
    }
    .pages li.active {
        background: #666
    }
    .no-ie .coverflow {
        -webkit-perspective: 800px;
        -ms-perspective: 800px;
        perspective: 800px;
        -webkit-perspective-origin: 50% 50%;
        -ms-perspective-origin: 50% 50%;
        perspective-origin: 50% 50%;
        overflow-y: show
    }
    .no-ie .coverflow ul {
        -webkit-transform-style: preserve-3d;
        -ms-transform-style: preserve-3d;
        transform-style: preserve-3d
    }
    .no-ie .coverflow ul li {
        position: relative;
        margin: 0 -20px;
        -webkit-transform: rotateY(60deg) scale(.9);
        -ms-transform: rotateY(60deg) scale(.9);
        transform: rotateY(60deg) scale(.9);
        -webkit-transition: -webkit-transform .3s ease-out;
        transition: transform .3s ease-out;
        background-color: #FBFBFB
    }
    .no-ie .coverflow ul li.active {
        z-index: 10;
        -webkit-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1)
    }
    #coverenlargearea,
    #coverflowoverlay {
        position: fixed;
        opacity: 0;
        z-index: -1
    }
    .no-ie .coverflow ul li.active~li {
        -webkit-transform: rotateY(-60deg) scale(.9);
        -ms-transform: rotateY(-60deg) scale(.9);
        transform: rotateY(-60deg) scale(.9)
    }
    #coverflowoverlay {
        width: 100%;
        height: 100%;
        background: gray;
        left: 0;
        top: 0
    }
    #coverenlargearea {
        left: 50%;
        top: 50%;
        max-width: 95%;
        height: auto;
        -ms-transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        background: #fff;
        transition: all .2s ease-in
    }
    .hsframe ul,
    .hsframe ul li,
    .hsframeIcon ul {
        height: 100%;
        padding: 0
    }
    #coverenlargearea img {
        display: block
    }
    .contentShareInput,
    .display-inline-block,
    .frame-checkbok,
    .hsarea,
    .hsframe,
    .hsframe ul,
    .hsframeIcon,
    .hsframeIcon ul {
        display: inline-block
    }
    #coverenlargearea #desc {
        position: absolute;
        bottom: 0;
        background: #fff;
        padding: 4px;
        width: 100%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        font-size: 120%
    }
    .font-size-30 {
        font-size: 30px
    }
    .hsarea {
        overflow: hidden;
        margin: 5px
    }
    .hsframe {
        width: 100%;
        height: 100%;
        overflow: hidden
    }
    .hsframe ul {
        margin: 0
    }
    .hsframe ul li {
        margin: 0 5px 5px 0
    }
    .hsframeIcon ul {
        margin: 0
    }
    .hsframeIcon ul li {
        width: 90px;
        height: 90px;
        margin: 0 5px 5px 0;
        padding: 0;
        border: 1px solid #93f193;
        border-radius: 2px
    }
    .hsscrollbar .hshandle .hsmousearea {
        position: absolute;
        top: -9px;
        left: 0;
        width: 100%;
        height: 20px
    }
    .play-video-gif,
    .play-video-gif-right {
        left: 50%;
        text-align: center;
        overflow: hidden;
        text-transform: uppercase
    }
    .hsscrollbar .hshandle {
        width: 100px;
        height: 100%;
        background: #292a33;
        cursor: pointer
    }
    .hsscrollbar {
        margin: 0 0 1em;
        height: 2px;
        background: #ccc;
        line-height: 0
    }
    .srch-photo {
        height: 194px
    }
    .srch-text {
        margin-left: 5px;
        margin-right: 5px;
        margin-bottom: 2px
    }
    #content {
        padding: 0!important;
        position: relative
    }
    .contentShareInput {
        max-width: 600px;
        margin: 21px
    }
    .animation-choose-image {
        -webkit-animation: spin 15s infinite linear;
        -moz-animation: spin 15s infinite linear;
        -o-animation: spin 15s infinite linear;
        animation: spin 15s infinite linear
    }
    .margin-contentShare {
        margin: 10px 0 5px
    }
    .smart-form .row {
        margin: 0!important
    }
    .background-color-3a3633 {
        background-color: #3a3633;
        margin-left: 1px
    }
    .downloadandshare {
        padding: 5px 6px;
        margin: 5px;
        font-size: 14px
    }
    .margin-10 {
        margin: 10px
    }
    .button-action {
        padding: 5px;
        margin: 5px;
        font-weight: 700
    }
    .image-content-area,
    .padding-bottom-15 {
        padding-bottom: 15px
    }
    .image-opacity-default {
        position: absolute;
        opacity: .5
    }
    .max-width-90-percent {
        max-width: 90%
    }
    .width-100-percent {
        width: 100%
    }
    .play-video-gif {
        position: absolute;
        top: 50%;
        margin-top: -36px;
        margin-left: -36px;
        height: 72px;
        width: 72px;
        background: rgba(0, 0, 0, .8);
        line-height: 72px;
        font-size: 20px;
        color: #fff;
        font-weight: 700;
        border-radius: 50%
    }
    .title-gif,
    .title-gif: hover {
        font-weight: 600
    }
    .position-relative {
        position: relative
    }
    .position-absolute {
        position: absolute
    }
    .play-click {
        width: 100%;
        height: 100%;
        top: 0
    }
    .title-gif {
        color: #000
    }
    .title-gif: hover,
    a:focus,
    a:hover {
        color: #18b2e0;
        text-decoration: none
    }
    .title-gif-right {
        font-size: 15px;
        word-wrap: break-word
    }
    .google-plus {
        background-color: #db4437!important;
        border-color: #db4437!important;
        margin-left: 5px!important
    }
    .image-content-area {
        border-bottom: 1px solid #c7c7c7
    }
    .background-color-ffffff {
        background-color: #fff!important
    }
    .padding-bottom-10 {
        padding-bottom: 10px
    }
    .loader {
        display: none;
        border: 6px solid #f3f3f3;
        border-radius: 50%;
        border-top: 6px solid #3498db;
        width: 50px;
        height: 50px;
        -webkit-animation: spin 2s linear infinite;
        animation: spin 2s linear infinite;
        margin: 10px
    }
    .face-right-area,
    .g-plus-right-area {
        border-radius: 50%
    }
    @-webkit-keyframes spin {
        0% {
            -webkit-transform: rotate(0)
        }
        100% {
            -webkit-transform: rotate(360deg)
        }
    }
    @keyframes spin {
        0% {
            transform: rotate(0)
        }
        100% {
            transform: rotate(360deg)
        }
    }
    .padding-left-right-5-percent {
        padding-left: 5%!important;
        padding-right: 5%!important
    }
    .padding-left-right-4-percent {
        padding-left: 4%!important;
        padding-right: 4%!important
    }
    .face-right-area {
        padding: 5px 10px
    }
    .social-right-padding {
        padding: 7px 0 0!important
    }
    .image-content-area-right {
        border-bottom: 1px solid #c7c7c7
    }
    .play-video-gif-right {
        position: absolute;
        top: 50%;
        margin-top: -28px;
        margin-left: -19px;
        height: 45px;
        width: 45px;
        background: rgba(0, 0, 0, .8);
        line-height: 48px;
        font-size: 14px;
        color: #fff;
        font-weight: 700;
        border-radius: 50%
    }
    nav ul .active>a {
        color: #fff!important;
        position: relative;
    }
    .padding-10 {
        padding: 10px
    }
    @media (min-width:1200px) {
        .container {
            width: 1000px
        }
    }
    .more-pic-area {
        background: #545353;
        padding-top: 25px;
        margin-left: 1px
    }
    .width-more-image {
        width: 95%
    }
    #image-area-created {
        max-width: 95%;
        max-height: 750px
    }
    .plus-1-area {
        width: 120px;
        padding-left: 10px;
    }
    .adsense-area{
        width: 100%;
    }
    .adsense-bacground{
        z-index: 1;
        position: absolute;
    }
    .z-index-2{
        z-index: 2;
    }

#header {
    display: inline-block;
    height: 49px;
    width: 100%;
    margin: 0;
    /* padding: 0 13px 0 0; */
    background-color: #f3f3f3;
    background-image: -moz-linear-gradient(top,#f3f3f3,#e2e2e2);
    background-image: -webkit-gradient(linear,0 0,0 100%,from(#f3f3f3),to(#e2e2e2));
    background-image: -webkit-linear-gradient(top,#f3f3f3,#e2e2e2);
    background-image: -o-linear-gradient(top,#f3f3f3,#e2e2e2);
    background-image: linear-gradient(to bottom,#f3f3f3,#e2e2e2);
    background-repeat: repeat-x;
    position: fixed;
    z-index: 905;
    top: 0;
}
#left-panel {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 904;
}
h2 {
    letter-spacing: -1px;
    font-size: 22px;
    margin: 0px 0;
    padding: 20px 0;
    line-height: normal;
}
@media (min-width:767px) {
    .adsense-mobile{
        display: none;
    }
    .adsense-web{
        display: block;
    }
    .adsense-fixed {
        position: fixed;
        left: 50%;
        top: 50%;
        z-index: 1;
        -webkit-transform: translate(-100%,-50%);
        -moz-transform: translate(-100%,-50%);
        -ms-transform: translate(-100%,-50%);
        -o-transform: translate(-100%,-50%);
        transform: translate(-100%, -50%);
    }
}
@media (max-width:767px) {
    .adsense-mobile{
        display: block;
    }
    .adsense-web{
        display: none;
    }
    .top-mobile-adsense{
        padding-top: 10px;
    }
    .adsense-fixed{
        position: fixed;
        left: 50%;
        top: 50%;
        z-index: 1;
        -webkit-transform: translate(-50%,-50%);
        -moz-transform: translate(-50%,-50%);
        -ms-transform: translate(-50%,-50%);
        -o-transform: translate(-50%,-50%);
        transform: translate(-50%,-50%);
        padding-top: 25px;
    }
}


/*css grid for new*/

.wrapper {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 10px;
}

@media (max-width: 1000px) {
    .wrapper {
      display: grid;
     grid-template-columns: repeat(2, 1fr);
      grid-gap: 10px;
    }

}

@media (max-width: 450px) {
  .wrapper {
      display: grid;
      grid-template-columns: repeat(1, 1fr);;
      grid-gap: 10px;
    }
}

.image-content-area-new {
    background-color: #dcdcdc;
    border: 1px solid #c7c7c7;
}
.padding-bottom-300{
    padding-bottom: 300px;
}
.font-size-18{
    font-size: 18px;
}
.button-loadmore{
    width: 100%;
    margin-top: 20px;
    margin-bottom: 20px;
    padding: 10px;
    font-weight: 700;
}
.adsense-new{
    background: #3a3633;
    padding-bottom: 5px;
    padding-top: 5px;
    margin-top: 5px;
    margin-bottom: 5px;
}
.display-none-face{
    display: none!important;
}
.max-height-500{
    max-height: 500px;
}
.width-40-percent{
    width: 40%
}
.width-65-percent{
    width: 65%
}
.text-collage-fist-page{
    font-size: 30px;
    font-weight: 600;
    color: #2958c7;
}
.custom-display-popupFrameArea{
    width: 100%!important;
    overflow: visible;
    z-index: 99999999;
    opacity: .95;
    text-align: center;
}
.height-125{
    height: 125px;
}
.device-item{
	padding: 10px;
	height: 100px!important;
}
.beacon-item{
	padding: 10px;
	max-height: 100px;
}
.line-area{
	margin: 0px 0px 20px 0px;
}