@font-face {
    font-weight: 400;
    font-style: normal;
    font-family: SimplySquare;
    src: url(wysiwyg/foot/SimplySquare.woff) format('woff');
    font-display: swap
}

@font-face {
    font-weight: 400;
    font-style: normal;
    font-family: NixieOne;
    src: url(wysiwyg/foot/NixieOne.woff) format('woff');
    font-display: swap
}


@font-face {
    font-weight: 400;
    font-style: normal;
    font-family: Neoneon;
    src: url(wysiwyg/foot/Neoneon.woff) format('woff');
    font-display: swap
}

@font-face {
    font-weight: 400;
    font-style: normal;
    font-family: Grange;
    src: url(wysiwyg/foot/Grange.ttf) format('woff');
    font-display: swap
}


@font-face {
    font-weight: 400;
    font-style: normal;
    font-family: Elegant;
    src: url(wysiwyg/foot/Elegant.ttf) format('woff');
    font-display: swap
}




@font-face {
    font-weight: 400;
    font-style: normal;
    font-family: Funky;
    src: url(wysiwyg/foot/Funky.ttf) format('woff');
    font-display: swap
}



@font-face {
    font-weight: 400;
    font-style: normal;
    font-family: Hompton;
    src: url(wysiwyg/foot/Hompton.ttf) format('woff');
    font-display: swap
}

@font-face {
    font-weight: 400;
    font-style: normal;
    font-family: Monaco;
    src: url(wysiwyg/foot/Monaco.ttf) format('woff');
    font-display: swap
}

@font-face {
    font-weight: 400;
    font-style: normal;
    font-family: Scandi;
    src: url(wysiwyg/foot/lovelo-linebold-webfont.ttf) format('woff');
    font-display: swap
}

@font-face {
    font-weight: 400;
    font-style: normal;
    font-family: Vintage;
    src: url(wysiwyg/foot/Vintage.ttf) format('woff');
    font-display: swap
}

@font-face {
    font-weight: 400;
    font-style: normal;
    font-family: zorate;
    src: url(wysiwyg/foot/zorate.ttf) format('woff');
    font-display: swap
}


@font-face {
    font-weight: 400;
    font-style: normal;
    font-family: Valerio;
    src: url(wysiwyg/foot/Valerio.ttf) format('woff');
    font-display: swap
}


@font-face {
    font-weight: 400;
    font-style: normal;
    font-family: Stylish;
    src: url(wysiwyg/foot/Stylish.ttf) format('woff');
    font-display: swap
}



.font1,.Font1 {
    font-family: NixieOne;
    font-size: 30px
}

.font2,.Font2 {
    font-family: SimplySquare;
    font-size: 27px
}

.font3,.Font3 {
    font-family: Scandi;font-size: 30px;
}

.font4,.Font4 {
    font-family:Elegant ;font-size: 36px;
}

.font5,.Font5 {
    font-family: Funky  ;font-size: 34px;
}

.font6,.Font6 {
    font-family: Hompton ;font-size: 40px;
}

.font7,.Font7 {
    font-family: Monaco ;     font-size: 22px;
}

.font8,.Font8 {
    font-family: Grange ;font-size: 40px;
}

.font9,.Font9 {
    font-family: Vintage;font-size: 42px;
}

.font10,.Font10 {
    font-family:  zorate;font-size: 26px;
}

.font11,.Font11 {
    font-family: Valerio ;font-size: 50px;
}

.font12,.Font12 {
    font-family: Stylish ; font-size: 24px;
}




.Custom_Font .mageworx-swatch-option.text {font-size: 20px; padding: 5px 10px;}

.Custom_Font  .mageworx-swatch-option.text.font2 {font-size: 16px;}
.Custom_Font  .mageworx-swatch-option.text.font6 {font-size: 24px;}
.Custom_Font  .mageworx-swatch-option.text.font7 {font-size: 16px;}
.Custom_Font  .mageworx-swatch-option.text.font8 {font-size: 22px;}
.Custom_Font  .mageworx-swatch-option.text.font9 {font-size: 26px;}
.Custom_Font  .mageworx-swatch-option.text.font12 {font-size: 12px;}
.Custom_Font .mageworx-swatch-option.text.font11{font-size: 28px;}
/*page----custom-neon*/
.mageworx-swatch-option {
    border-radius: 3px;
}
.field.required.Custom_Textalign{margin-top:-10px;}
.field.Custom_Textalign label.label ,.field.Custom_Textalign #value{display:none!important;}
.field.Custom_Textalign .mageworx-swatch-option.text{font-size:0;text-align:center;line-height:1;max-width: 100% !important;
    padding: 10px;background: #f7f7f7;}
.field.Custom_Textalign .mageworx-swatch-option.text.left:after{content:"\f036";font:normal normal normal 16px/1 FontAwesome}
.field.Custom_Textalign .mageworx-swatch-option.text.center:after{content:"\f037";font:normal normal normal 16px/1 FontAwesome}
.field.Custom_Textalign .mageworx-swatch-option.text.right:after{content:"\f038";font:normal normal normal 16px/1 FontAwesome}

/*.field.Custom_Type .mageworx-swatch-option.selected,  */
/*.field.Custom_Type .mageworx-swatch-option:not(.disabled):hover,*/
/*.field.required.Custom_Textalign .mageworx-swatch-option.selected, */
/*.field.required.Custom_Textalign .mageworx-swatch-option:not(.disabled):hover,*/
/*.field.Custom_Size  .mageworx-swatch-option.selected,  */
/*.field.Custom_Size  .mageworx-swatch-option:not(.disabled):hover{outline:none!important;}*/
 
.field.Custom_Textalign .mageworx-swatch-container{width:calc(100% / 3);max-width:100%!important}
.field.Custom_Type .mageworx-swatch-container{width:calc(100% / 2);max-width:100%!important}
.field.Custom_Type .mageworx-swatch-option.text{max-width:100%!important;padding:10px;font-size:16px}
.field.Custom_Size .mageworx-swatch-container{width:calc(100% / 4);max-width:100%!important}
.field.Custom_Size .mageworx-swatch-option.text{max-width:100%!important;padding:10px;font-size:16px}
.field.required.Custom_Textalign .mageworx-swatch-option.selected,
.field.required.Custom_Type .mageworx-swatch-option.selected,
.field.Custom_Size .mageworx-swatch-option.selected
{color:#fff;background:#4d4dff!important;border:1px solid #4d4dff;outline:0!important}
.field.Custom_Width.required{width:49%;float:left}
.field.Custom_Height.required{width:49%;float:right}
/*.field.textarea.required.hiedcustom.price{display:none;}*/
div.swatch-attribute.size .mageworx-swatch-option, div.swatch-attribute.manufacturer .mageworx-swatch-option{    background: #fff;color:#444;font-weight: 400;}

div#imgesup{position:relative;z-index:9;padding:0 40px;width:100%;box-sizing:border-box;text-align:center;font-size:30px;padding-top:30%;height:50vw;max-height:800px;background:radial-gradient(circle,#45495d 0,rgb(30 30 32) 100%) center center/cover}
#text_box #text-top {
    display: none;
}
@media only screen and (min-width: 768px) {
    
  .Custom_Font  .mageworx-swatch-container{width:calc(100% / 6);max-width:100%!important}
  .Custom_Font .mageworx-swatch-option.text{max-width:100%!important;}
    
}

@media only screen and (max-width: 768px) {
    .field.Custom_Size .mageworx-swatch-container{width:calc(100% / 3);max-width:100%!important}
    .field.Custom_Size .mageworx-swatch-option.text{max-width:100%!important;padding:7px;font-size:14px}
     .Custom_Font  .mageworx-swatch-container{width:calc(100% / 4);max-width:100%!important}
  .Custom_Font .mageworx-swatch-option.text{max-width:100%!important;}
  div#imgesup{    height: 70vw;}
}

 
.custominfo .Left.text-center #text{text-align:left;display:inline-block;line-height:1.6}
.custominfo .text-center.Right #text{text-align:right;line-height:1.6;display:inline-block}
.custominfo .text-center.Center #text{text-align:center;display:inline-block;line-height:1.6;white-space:nowrap}

.custominfo #text{color:#fff}
.custominfo .Warm.White{text-shadow:rgb(255 255 255) 0 0 5px,rgb(255 255 255) 0 0 10px,#fffdcf 0 0 20px,#fffdcf 0 0 30px,#fffdcf 0 0 40px,#fffdcf 0 0 55px,#fffdcf 0 0 75px}
.custominfo .White{text-shadow:rgb(255 255 255) 0 0 5px,rgb(255 255 255) 0 0 10px,rgb(225 227 230) 0 0 20px,rgb(225 227 230) 0 0 30px,rgb(225 227 230) 0 0 40px,rgb(225 227 230) 0 0 55px,rgb(225 227 230) 0 0 75px}
.custominfo .Lemon.Yellow{text-shadow:rgb(255 255 255) 0 0 5px,rgb(255 255 255) 0 0 10px,rgb(255 249 124) 0 0 20px,rgb(255 249 124) 0 0 30px,rgb(255 249 124) 0 0 40px,rgb(255 249 124) 0 0 55px,rgb(255 249 124) 0 0 75px}
.custominfo .Golden.Yellow{text-shadow:rgb(255 255 255) 0 0 5px,rgb(255 255 255) 0 0 10px,rgb(255 214 46) 0 0 20px,rgb(255 214 46) 0 0 30px,rgb(255 214 46) 0 0 40px,rgb(255 214 46) 0 0 55px,rgb(255 214 46) 0 0 75px}
.custominfo .Orange{text-shadow:rgb(255 255 255) 0 0 5px,rgb(255 255 255) 0 0 10px,rgb(255 141 2) 0 0 20px,rgb(255 141 2) 0 0 30px,rgb(255 141 2) 0 0 40px,rgb(255 141 2) 0 0 55px,rgb(255 141 2) 0 0 75px}
.custominfo .Light.Red{text-shadow:rgb(255 255 255) 0 0 5px,rgb(255 255 255) 0 0 10px,rgb(255 117 117) 0 0 20px,rgb(255 117 117) 0 0 30px,rgb(255 117 117) 0 0 40px,rgb(255 117 117) 0 0 55px,rgb(255 117 117) 0 0 75px}
.custominfo .Red{text-shadow:rgb(255 255 255) 0 0 5px,rgb(255 255 255) 0 0 10px,rgb(255 42 77) 0 0 20px,rgb(255 42 77) 0 0 30px,rgb(255 42 77) 0 0 40px,rgb(255 42 77) 0 0 55px,rgb(255 42 77) 0 0 75px}
.custominfo .Pink{text-shadow:rgb(255 255 255) 0 0 5px,rgb(255 255 255) 0 0 10px,rgb(255 144 255) 0 0 20px,rgb(255 144 255) 0 0 30px,rgb(255 144 255) 0 0 40px,rgb(255 144 255) 0 0 55px,rgb(255 144 255) 0 0 75px}
.custominfo .Cotton.Candy{text-shadow:rgb(255 255 255) 0 0 5px,rgb(255 255 255) 0 0 10px,rgb(234 164 255) 0 0 20px,rgb(234 164 255) 0 0 30px,rgb(234 164 255) 0 0 40px,rgb(234 164 255) 0 0 55px,rgb(234 164 255) 0 0 75px}
.custominfo .Deep.Pink { text-shadow: rgb(255 255 255) 0 0 5px, rgb(255 255 255) 0 0 10px, rgb(248 0 255) 0 0 20px, rgb(249 0 255) 0 0 30px, rgb(243 2 255) 0 0 40px, rgb(247 1 255) 0 0 55px, rgb(249 0 255) 0 0 75px;}
.custominfo .Purple{text-shadow:rgb(255 255 255) 0 0 5px,rgb(255 255 255) 0 0 10px,rgb(140 89 255) 0 0 20px,rgb(140 89 255) 0 0 30px,rgb(140 89 255) 0 0 40px,rgb(140 89 255) 0 0 55px,rgb(140 89 255) 0 0 75px}
.custominfo .Deep.Blue{text-shadow:rgb(255 255 255) 0 0 5px,rgb(255 255 255) 0 0 10px,rgb(2 116 252) 0 0 20px,rgb(2 116 252) 0 0 30px,rgb(2 116 252) 0 0 40px,rgb(2 116 252) 0 0 55px,rgb(2 116 252) 0 0 75px}
.custominfo .Electric.Blue{text-shadow:rgb(255 255 255) 0 0 5px,rgb(255 255 255) 0 0 10px,rgb(99 170 255) 0 0 20px,rgb(99 170 255) 0 0 30px,rgb(99 170 255) 0 0 40px,rgb(99 170 255) 0 0 55px,rgb(99 170 255) 0 0 75px}
.custominfo .Ice.Blue{text-shadow:rgb(255 255 255) 0 0 5px,rgb(255 255 255) 0 0 10px,rgb(144 220 255) 0 0 20px,rgb(144 220 255) 0 0 30px,rgb(144 220 255) 0 0 40px,rgb(144 220 255) 0 0 55px,rgb(144 220 255) 0 0 75px}
.custominfo .Tropical.Blue{text-shadow:rgb(255 255 255) 0 0 5px,rgb(255 255 255) 0 0 10px,rgb(36 183 222) 0 0 20px,rgb(36 183 222) 0 0 30px,rgb(36 183 222) 0 0 40px,rgb(36 183 222) 0 0 55px,rgb(36 183 222) 0 0 75px}
.custominfo .Mint{text-shadow:rgb(255 255 255) 0 0 5px,rgb(255 255 255) 0 0 10px,rgb(128 255 217) 0 0 20px,rgb(128 255 217) 0 0 30px,rgb(128 255 217) 0 0 40px,rgb(128 255 217) 0 0 55px,rgb(128 255 217) 0 0 75px}
.custominfo .Green{text-shadow:rgb(255 255 255) 0 0 5px,rgb(255 255 255) 0 0 10px,rgb(133 255 170) 0 0 20px,rgb(133 255 170) 0 0 30px,rgb(133 255 170) 0 0 40px,rgb(133 255 170) 0 0 55px,rgb(133 255 170) 0 0 75px}
.custominfo .Deep.Green{text-shadow:rgb(255 255 255) 0 0 5px,rgb(255 255 255) 0 0 10px,rgb(11 215 72) 0 0 20px,rgb(11 215 72) 0 0 30px,rgb(11 215 72) 0 0 40px,rgb(11 215 72) 0 0 55px,rgb(11 215 72) 0 0 75px}
.custominfo .Multi.Color{color:#fff;animation:multicolor 10s infinite alternate}

  #text_box.Full.Color .text-box #text {
    position: relative;
    background: linear-gradient(45deg, rgb(20 255 233 / 60%), rgb(255 235 59 / 60%), rgb(255 0 225 / 60%), rgb(34 0 255 / 60%), rgb(255 0 0 / 60%), rgb(34 0 255 / 60%), rgb(255 0 225 / 60%), rgb(255 235 59 / 60%), rgb(20 255 233 / 60%));
    background-position: 0 0;
    color: transparent;
    -webkit-text-fill-color: rgb(255 255 255 / 50%);
    -webkit-background-clip: text;
    animation: linear 0s infinite;
    animation-duration: 5s, 15s;
    animation-name: full, change;
}  

#text_box.Full.Color .text-box #text-top {
    position: absolute;
    top: 1px;
    left: 0;
    z-index: -2;
    display: inline-block;
    width: 100%;
    background: linear-gradient(45deg, #14ffe9, #ffeb3b, #ff00e1, #20f, red, #20f, #ff00e1, #ffeb3b, #14ffe9);
    background-position: 0 0;
    color: transparent;
    transform: scale(1.1, 1.2);
    -webkit-background-clip: text;
    filter: blur(8px);
    animation: linear 0s infinite;
    animation-duration: 5s, 15s;
    animation-name: change;
    -webkit-text-fill-color: rgb(255 255 255 / 50%);
}
@keyframes multicolor  {
    0% {
        text-shadow: rgb(255 255 255) 0 0 5px,rgb(255 255 255) 0 0 10px,rgb(2 255 251) 0 0 20px,rgb(2 255 251) 0 0 30px,rgb(2 255 251) 0 0 40px,rgb(2 255 251) 0 0 55px,rgb(2 255 251) 0 0 75px;
        color: #fff
    }

    8% {
        text-shadow: rgb(255 255 255) 0 0 5px,rgb(255 255 255) 0 0 10px,rgb(107 227 255) 0 0 20px,rgb(107 227 255) 0 0 30px,rgb(107 227 255) 0 0 40px,rgb(107 227 255) 0 0 55px,rgb(107 227 255) 0 0 75px;
        color: #fff
    }

    16% {
        text-shadow: rgb(255 255 255) 0 0 5px,rgb(255 255 255) 0 0 10px,rgb(107 227 255) 0 0 20px,rgb(107 227 255) 0 0 30px,rgb(107 227 255) 0 0 40px,rgb(107 227 255) 0 0 55px,rgb(107 227 255) 0 0 75px;
        color: #fff
    }

    24% {
        text-shadow: rgb(255 255 255) 0 0 5px,rgb(255 255 255) 0 0 10px,rgb(42 101 255) 0 0 20px,rgb(42 101 255) 0 0 30px,rgb(42 101 255) 0 0 40px,rgb(42 101 255) 0 0 55px,rgb(42 101 255) 0 0 75px;
        color: #fff
    }

    30% {
        text-shadow: rgb(255 255 255) 0 0 5px,rgb(255 255 255) 0 0 10px,rgb(252 198 222) 0 0 20px,rgb(252 198 222) 0 0 30px,rgb(252 198 222) 0 0 40px,rgb(252 198 222) 0 0 55px,rgb(252 198 222) 0 0 75px
    }

    36% {
        text-shadow: rgb(255 255 255) 0 0 5px,rgb(255 255 255) 0 0 10px,rgb(255 87 176) 0 0 20px,rgb(255 87 176) 0 0 30px,rgb(255 87 176) 0 0 40px,rgb(255 87 176) 0 0 55px,rgb(255 87 176) 0 0 75px;
        color: #fff
    }

    42% {
        text-shadow: rgb(255 255 255) 0 0 5px,rgb(255 255 255) 0 0 10px,rgb(225 227 230) 0 0 20px,rgb(225 227 230) 0 0 30px,rgb(225 227 230) 0 0 40px,rgb(225 227 230) 0 0 55px,rgb(225 227 230) 0 0 75px;
        color: #fff
    }

    48% {
        text-shadow: rgb(255 255 255) 0 0 5px,rgb(255 255 255) 0 0 10px,rgb(242 255 20) 0 0 20px,rgb(242 255 20) 0 0 30px,rgb(242 255 20) 0 0 40px,rgb(242 255 20) 0 0 55px,rgb(242 255 20) 0 0 75px;
        color: #fff
    }

    55% {
        text-shadow: rgb(255 255 255) 0 0 5px,rgb(255 255 255) 0 0 10px,rgb(255 231 0) 0 0 20px,rgb(255 231 0) 0 0 30px,rgb(255 231 0) 0 0 40px,rgb(255 231 0) 0 0 55px,rgb(255 231 0) 0 0 75px;
        color: #fff
    }

    64% {
        text-shadow: rgb(255 255 255) 0 0 5px,rgb(255 255 255) 0 0 10px,rgb(255 194 0) 0 0 20px,rgb(255 194 0) 0 0 30px,rgb(255 194 0) 0 0 40px,rgb(255 194 0) 0 0 55px,rgb(255 194 0) 0 0 75px
    }

    73% {
        text-shadow: rgb(255 255 255) 0 0 5px,rgb(255 255 255) 0 0 10px,rgb(255 148 30) 0 0 20px,rgb(255 148 30) 0 0 30px,rgb(255 148 30) 0 0 40px,rgb(255 148 30) 0 0 55px,rgb(255 148 30) 0 0 75px;
        color: #fff
    }

    82% {
        text-shadow: rgb(255 255 255) 0 0 5px,rgb(255 255 255) 0 0 10px,rgb(255 0 0) 0 0 20px,rgb(255 0 0) 0 0 30px,rgb(255 0 0) 0 0 40px,rgb(255 0 0) 0 0 55px,rgb(255 0 0) 0 0 75px;
        color: #fff
    }

    91% {
        text-shadow: rgb(255 255 255) 0 0 5px,rgb(255 255 255) 0 0 10px,rgb(39 243 39) 0 0 20px,rgb(39 243 39) 0 0 30px,rgb(39 243 39) 0 0 40px,rgb(39 243 39) 0 0 55px,rgb(39 243 39) 0 0 75px;
        color: #fff
    }

    100% {
        text-shadow: rgb(255 255 255) 0 0 5px,rgb(255 255 255) 0 0 10px,rgb(193 89 255) 0 0 20px,rgb(193 89 255) 0 0 30px,rgb(193 89 255) 0 0 40px,rgb(193 89 255) 0 0 55px,rgb(193 89 255) 0 0 75px;
        color: #fff
    }
}
  


@keyframes change {
    0% {
        background-position: 0 0
    }

    100% {
        background-position: 800px 0
    }
}

@keyframes full {
    0% {
        filter: hue-rotate(0)
    }

    50% {
        filter: hue-rotate(360deg)
    }

    50% {
        filter: hue-rotate(-360deg)
    }
}