textcraft.net
Open in
urlscan Pro
91.191.208.194
Public Scan
Submitted URL: http://textcraft.net/
Effective URL: https://textcraft.net/
Submission: On January 11 via api from US — Scanned from DE
Effective URL: https://textcraft.net/
Submission: On January 11 via api from US — Scanned from DE
Form analysis 3 forms found in the DOM
Name: gen_fields — POST
<form name="gen_fields" id="gen_fields" method="POST" action="" onsubmit="ProcessGen(); return false;">
<input type="hidden" id="anim_type" value="none">
<!--
<input type='hidden' id='font_style' name='font_style' value='font9'>
-->
<input type="hidden" id="font_style" name="font_style" value="font1">
<input type="hidden" id="font_style2" name="font_style2" value="font6">
<input type="hidden" id="font_style3" name="font_style3" value="font6">
<input type="hidden" id="font_size" name="font_size" value="x">
<input type="hidden" id="font_size2" name="font_size2" value="t">
<input type="hidden" id="font_size3" name="font_size3" value="t">
<input type="hidden" id="border_size" name="border_size" value="1">
<input type="hidden" id="border_size2" name="border_size2" value="1">
<input type="hidden" id="border_size3" name="border_size3" value="1">
<input type="hidden" id="glow_halo" name="glow_halo" value="0">
<input type="hidden" id="perspective_effect" name="perspective_effect" value="1">
<input type="hidden" id="drop_shadow" name="drop_shadow" value="1">
<input type="hidden" id="fit_lines" name="fit_lines" value="0">
<input type="hidden" id="truecolour_images" name="truecolour_images" value="0">
<input type="hidden" id="glossy" name="glossy" value="0">
<input type="hidden" id="lighting" name="lighting" value="0">
<div id="lower_outerbox" style="margin-top:35px;">
<div class="clearer" style="height:0px"> </div>
<div style="width:978px; height:20px; margin-bottom:18px; border:0px solid #0f0;">
<div id="fittowidth_slider" style="margin-left:5px; visibility: hidden;">
<!-- margin is 459 - (default width / 2) = 459-250 = 209 -->
<div id="fittowidth1" class="fittowidth" style="margin-left:209px; background: url(https://static1.textcraft.net/img/fittowidth1.png) no-repeat">
</div>
<div id="fittowidth2" class="fittowidth" style="background: url(https://static1.textcraft.net/img/fittowidth2.png) repeat-x; width:500px">
</div>
<div id="fittowidth3" class="fittowidth" style="background: url(https://static1.textcraft.net/img/fittowidth3.png) no-repeat">
</div>
</div> <!-- end fit to width slider div -->
<div class="clearer" style="height:0px"> </div>
</div>
<div class="clearer" style="height:0px"> </div>
<div id="options-box">
<div id="linestyle-box" style="height:504px; background:url(https://static1.textcraft.net/img/controls-bg1k.png) top left no-repeat; background-position:-580px 0px;"><!-- 366px + 57px + 50px-->
<div class="clearer" style="height:0px"> </div>
<div style="margin:16px 0 0 18px;">
<div id="textsize1" style="margin-top:0px">
<div id="sizebutton-t" class="optionwidth3a" onmouseover="SetSizeHigh(this,'t')" onmouseout="SetSizeLow(this,'t')" onclick="SetSizeSelected('t',1)">
<div class="buttonicon-textsize" style="background-position:0px 0px;"></div>
<div class="buttonicon-textsize-text" id="textsize-t" style="background-position:0px 0px;"></div>
</div>
<div id="sizebutton-s" class="optionwidth3a" onmouseover="SetSizeHigh(this,'s')" onmouseout="SetSizeLow(this,'s')" onclick="SetSizeSelected('s',1)">
<div class="buttonicon-textsize" style="background-position:-24px 0px;"></div>
<div class="buttonicon-textsize-text" id="textsize-s" style="background-position:0px -25px;"></div>
</div>
<div id="sizebutton-m" class="optionwidth3a" onmouseover="SetSizeHigh(this,'m')" onmouseout="SetSizeLow(this,'m')" onclick="SetSizeSelected('m',1)">
<div class="buttonicon-textsize" style="background-position:-48px 0px;"></div>
<div class="buttonicon-textsize-text" id="textsize-m" style="background-position:0px -50px;"></div>
</div>
<div style="line-height:1px; height:1px; font-size: 0em; clear: both;">
</div>
<div id="sizebutton-l" class="optionwidth3a" onmouseover="SetSizeHigh(this,'l')" onmouseout="SetSizeLow(this,'l')" onclick="SetSizeSelected('l',1)" style="background-position: 0px 0px;">
<div class="buttonicon-textsize" style="background-position:-72px 0px;"></div>
<div class="buttonicon-textsize-text" id="textsize-l" style="background-position:-50px -75px;"></div>
</div>
<div id="sizebutton-x" class="optionwidth3a_default" onmouseover="SetSizeHigh(this,'x')" onmouseout="SetSizeLow(this,'x')" onclick="SetSizeSelected('x',1)" style="background-position: -172px 0px;">
<div class="buttonicon-textsize" style="background-position:-96px 0px;"></div>
<div class="buttonicon-textsize-text" id="textsize-x" style="background-position:0px -100px;"></div>
</div>
<div id="sizebutton-x2" class="optionwidth3a" onmouseover="SetSizeHigh(this,'x2')" onmouseout="SetSizeLow(this,'x2')" onclick="SetSizeSelected('x2',1)">
<div class="buttonicon-textsize" style="background-position:-120px 0px;"></div>
<div class="buttonicon-textsize-text" id="textsize-x2" style="background-position:0px -125px;"></div>
</div>
<!-- Extra size buttons for paid members -->
<div id="pro-size" style="display:none;">
<div style="line-height:1px; height:1px; font-size: 0em; clear: both;"></div>
<div id="sizebutton-x3" class="optionwidth3a" onmouseover="SetSizeHigh(this,'x3')" onmouseout="SetSizeLow(this,'x3')" onclick="SetSizeSelected('x3',1)">
<div class="buttonicon-textsize" style="background-position:-144px 0px;"></div>
<div class="buttonicon-textsize-text" id="textsize-x3" style="background-position:0px -150px;"></div>
</div>
<div id="sizebutton-x4" class="optionwidth3a" onmouseover="SetSizeHigh(this,'x4')" onmouseout="SetSizeLow(this,'x4')" onclick="SetSizeSelected('x4',1)">
<div class="buttonicon-textsize" style="background-position:-168px 0px;"></div>
<div class="buttonicon-textsize-text" id="textsize-x4" style="background-position:0px -175px;"></div>
</div>
<div id="sizebutton-x5" class="optionwidth3a" onmouseover="SetSizeHigh(this,'x5')" onmouseout="SetSizeLow(this,'x5')" onclick="SetSizeSelected('x5',1)">
<div class="buttonicon-textsize" style="background-position:-192px 0px;"></div>
<div class="buttonicon-textsize-text" id="textsize-x5" style="background-position:0px -200px;"></div>
</div>
</div> <!-- end pro-size div -->
<!-- Direct users to Textcraft Pro page for larger text sizes -->
<div id="pro-size-ad">
<div style="line-height:1px; height:1px; font-size: 0em; clear: both;"></div>
<a href="/tx-pro.php" target="_blank">
<div id="sizebutton-ad" class="optionwidthad" onmouseover="SetSizeAdHigh(this)" onmouseout="SetSizeAdLow(this)" ontouchstart="SetSizeAdHigh(this)" onclick="SetSizeAdSelected(this);">
<div class="buttonicon-textsize" style="background-position:-144px 0px;"></div>
<div class="buttonicon-ad-text" id="textsize-ad" style="background-position:0px 0px;"></div>
</div>
</a>
</div> <!-- end pro-size-ad div -->
</div>
<div id="textborder" style="margin-left:17px">
<div id="borderbutton-1" class="optionwidth3c_default" onmouseover="SetBorderHigh(this,'1')" onmouseout="SetBorderLow(this,'1')" onclick="SetBorderSelected('1',1)" style="background-position: -430px 0px;">
<div class="buttonicon-bordersize" style="background-position:0px -28px;"></div>
<div class="buttonicon-bordersize-text" id="bordersize-1" style="background-position:-50px -225px;"></div>
</div>
<div id="borderbutton-2" class="optionwidth3c" onmouseover="SetBorderHigh(this,'2')" onmouseout="SetBorderLow(this,'2')" onclick="SetBorderSelected('2',1)">
<div class="buttonicon-bordersize" style="background-position:-24px -28px;"></div>
<div class="buttonicon-bordersize-text" id="bordersize-2" style="background-position:0px -250px;"></div>
</div>
<div id="borderbutton-3" class="optionwidth3c" onmouseover="SetBorderHigh(this,'3')" onmouseout="SetBorderLow(this,'3')" onclick="SetBorderSelected('3',1)">
<div class="buttonicon-bordersize" style="background-position:-48px -28px;"></div>
<div class="buttonicon-bordersize-text" id="bordersize-3" style="background-position:0px -275px;"></div>
</div>
<div style="line-height:1px; height:1px; font-size: 0em; clear: both;">
</div>
<div id="borderbutton-5" class="optionwidth3c" onmouseover="SetBorderHigh(this,'5')" onmouseout="SetBorderLow(this,'5')" onclick="SetBorderSelected('5',1)">
<div class="buttonicon-bordersize" style="background-position:-72px -28px;"></div>
<div class="buttonicon-bordersize-text" id="bordersize-5" style="background-position:0px -300px;"></div>
</div>
<div id="borderbutton-8" class="optionwidth3c" onmouseover="SetBorderHigh(this,'8')" onmouseout="SetBorderLow(this,'8')" onclick="SetBorderSelected('8',1)">
<div class="buttonicon-bordersize" style="background-position:-96px -28px;"></div>
<div class="buttonicon-bordersize-text" id="bordersize-8" style="background-position:0px -325px;"></div>
</div>
<div id="pro-border" style="display:none;">
<div id="borderbutton-13" class="optionwidth3c" onmouseover="SetBorderHigh(this,'13')" onmouseout="SetBorderLow(this,'13')" onclick="SetBorderSelected('13',1)">
<div class="buttonicon-bordersize" style="background-position:-96px -28px;"></div>
<div class="buttonicon-bordersize-text" id="bordersize-13" style="background-position:0px -350px;"></div>
</div>
<div style="line-height:1px; height:1px; font-size: 0em; clear: both;">
</div>
<div id="borderbutton-18" class="optionwidth3c" onmouseover="SetBorderHigh(this,'18')" onmouseout="SetBorderLow(this,'18')" onclick="SetBorderSelected('18',1)">
<div class="buttonicon-bordersize" style="background-position:-96px -28px;"></div>
<div class="buttonicon-bordersize-text" id="bordersize-18" style="background-position:0px -375px;"></div>
</div>
<div id="borderbutton-24" class="optionwidth3c" onmouseover="SetBorderHigh(this,'24')" onmouseout="SetBorderLow(this,'24')" onclick="SetBorderSelected('24',1)">
<div class="buttonicon-bordersize" style="background-position:-96px -28px;"></div>
<div class="buttonicon-bordersize-text" id="bordersize-24" style="background-position:0px -400px;"></div>
</div>
</div> <!-- end pro-border div -->
<div id="border-swatches" style="margin-top:5px;height:35px; border:0px solid #f0f;">
<div id="colorswatch1" style="overflow:hidden;">
<input id="color1" name="color1" value="" style="display:none; margin: 4px 0 0 0;width:9ex;color:white;background-color:black;border:1px solid #777;padding: 2px;" onchange="cs1.setrgb(this.value);"
onkeypress="if (event.keyCode == 13){return false;}">
<div id="color_select_icon1" class="color_select_icon" style="display:block; margin:3px 0 0 1px;">
<img id="color1_img" src="https://static1.textcraft.net/img/colorpick/color_select_icon2a.png" onclick="SwatchColourSelect(cs1,1);" style="float:left; margin-left:2px; cursor:pointer;">
<div id="color1_display" class="color_display" onclick="SwatchColourSelect(cs1,1);" style="cursor: pointer; background: rgb(44, 38, 46);"></div>
</div>
</div>
<div id="colorswatch2" style="overflow: hidden; display: none;">
<input id="color2" name="color2" value="" style="display:none; margin: 4px 0 0 0;width:9ex;color:white;background-color:black;border:1px solid #777;padding: 2px;" onchange="cs2.setrgb(this.value);"
onkeypress="if (event.keyCode == 13){return false;}">
<div id="color_select_icon2" class="color_select_icon" style="display:block; margin:3px 0 0 1px;">
<img id="color2_img" src="https://static1.textcraft.net/img/colorpick/color_select_icon2a.png" onclick="SwatchColourSelect(cs2,2);" style="float:left; margin-left:2px; cursor:pointer;">
<div id="color2_display" class="color_display" onclick="SwatchColourSelect(cs2,2);" style="background: rgb(33, 30, 78);"></div>
</div>
</div>
<div id="colorswatch3" style="overflow: hidden; display: none;">
<input id="color3" name="color3" value="" style="display:none; margin: 4px 0 0 0;width:9ex;color:white;background-color:black;border:1px solid #777;padding: 2px;" onchange="cs3.setrgb(this.value);"
onkeypress="if (event.keyCode == 13){return false;}">
<div id="color_select_icon3" class="color_select_icon" style="display:block; margin:3px 0 0 1px;">
<img id="color3_img" src="https://static1.textcraft.net/img/colorpick/color_select_icon2a.png" onclick="SwatchColourSelect(cs3,3);" style="float:left; margin-left:2px; cursor:pointer;">
<div id="color3_display" class="color_display" onclick="SwatchColourSelect(cs3,3);" style="background: rgb(235, 212, 6);"></div>
</div>
</div>
<div class="clearer" style="height:0px"> </div>
</div>
<div class="clearer" style="height:0px"> </div>
<!-- Filler for Textcraft Pro border sizes -->
<div id="pro-border-ad">
<div id="borderbutton-ad" class="optionwidthad2">
<div class="buttonicon-bordersize" style="background-position:-120px -28px;"></div>
<div class="buttonicon-ad-text" id="bordersize-ad" style="background-position:0px -45px;"></div>
</div>
</div> <!-- end pro-border-ad div -->
<!--
<div id="borderbutton-5" class='optionwidth3c' onmouseover="SetBorderHigh(this,'5')" onmouseout="SetBorderLow(this,'5')" onclick="SetBorderSelected('5',1)" >
<div style="position:absolute;top:-1px;left:4px;">XXL</div>
</div>
-->
</div>
<div class="clearer" style="height:5px; border:0px solid #f00;"> </div>
<!-- fontcolbox -->
<div id="fontcolbox" style="border:0px solid #fff">
<!-- Font colour options -->
<input type="hidden" id="font_colour" name="font_colour" value="0">
<input type="hidden" id="font_colour2" name="font_colour2" value="4">
<input type="hidden" id="font_colour3" name="font_colour3" value="2">
<input type="hidden" id="font_page" name="font_page" value="0">
<input type="hidden" id="font_page2" name="font_page2" value="5">
<input type="hidden" id="font_page3" name="font_page3" value="5">
<!--
https://stackoverflow.com/questions/2987706/touchend-event-doesnt-work-on-android
https://code.google.com/p/android/issues/detail?id=19827#makechanges
-->
<div id="leftarrow" class="fontcolarrow" style="background:url(https://static1.textcraft.net/img/left_arrow3d.png); margin-left: 4px;" onmouseover="SetArrowHigh(this,'left')" onmouseout="SetArrowLow(this,'left')"
onclick="SetArrow(this,'left')">
</div>
<div id="colouroptions" style="margin-top:7px; margin-left:4px; z-index:100; border:0px solid #f00">
<div id="optionload-progress" style="position: absolute; top: 0px; left: 0px; z-index: 100; display: none;">
<!--
<img src='https://static1.textcraft.net/img/big-progress.gif' style='margin:41px 0 0 202px;'>
-->
<img src="https://static1.textcraft.net/img/small-progress.gif" style="margin:47px 0 0 210px;">
</div>
<div id="hidden_optionload"><img src="https://static1.textcraft.net/backgrounds/font1-bg4.jpg?v=1" onload="setFontColourBGLoaded('font1')"></div>
<img src="https://static1.textcraft.net/img/charsel3.png" id="charsel" style="left: -3px; top: 0px;">
<!-- div backgrounds -->
<div id="font-colour0" class="font-colour" onclick="SelectFontColour('0',0)" style="background-image: url("https://static1.textcraft.net/backgrounds/font1-bg4.jpg?v=1"); background-position: 0px 0px;"></div>
<div id="font-colour1" class="font-colour" onclick="SelectFontColour('1',0)" style="background-image: url("https://static1.textcraft.net/backgrounds/font1-bg4.jpg?v=1"); background-position: -55px 0px;"></div>
<div id="font-colour2" class="font-colour" onclick="SelectFontColour('2',0)" style="background-image: url("https://static1.textcraft.net/backgrounds/font1-bg4.jpg?v=1"); background-position: -110px 0px;"></div>
<div id="font-colour3" class="font-colour" onclick="SelectFontColour('3',0)" style="background-image: url("https://static1.textcraft.net/backgrounds/font1-bg4.jpg?v=1"); background-position: -165px 0px;"></div>
<div id="font-colour4" class="font-colour" onclick="SelectFontColour('4',0)" style="background-image: url("https://static1.textcraft.net/backgrounds/font1-bg4.jpg?v=1"); background-position: -220px 0px;"></div>
<div id="font-colour5" class="font-colour" onclick="SelectFontColour('5',0)" style="background-image: url("https://static1.textcraft.net/backgrounds/font1-bg4.jpg?v=1"); background-position: -275px 0px;"></div>
<div id="font-colour6" class="font-colour" onclick="SelectFontColour('6',0)" style="background-image: url("https://static1.textcraft.net/backgrounds/font1-bg4.jpg?v=1"); background-position: -330px 0px;"></div>
<div id="font-colour7" class="font-colour" onclick="SelectFontColour('7',0)" style="background-image: url("https://static1.textcraft.net/backgrounds/font1-bg4.jpg?v=1"); background-position: -385px 0px;"></div>
<div class="clearer" style="height:2px;"></div>
<div id="font-colour8" class="font-colour" onclick="SelectFontColour('8',0)" style="background-image: url("https://static1.textcraft.net/backgrounds/font1-bg4.jpg?v=1"); background-position: 0px -55px;"></div>
<div id="font-colour9" class="font-colour" onclick="SelectFontColour('9',0)" style="background-image: url("https://static1.textcraft.net/backgrounds/font1-bg4.jpg?v=1"); background-position: -55px -55px;"></div>
<div id="font-colour10" class="font-colour" onclick="SelectFontColour('10',0)" style="background-image: url("https://static1.textcraft.net/backgrounds/font1-bg4.jpg?v=1"); background-position: -110px -55px;"></div>
<div id="font-colour11" class="font-colour" onclick="SelectFontColour('11',0)" style="background-image: url("https://static1.textcraft.net/backgrounds/font1-bg4.jpg?v=1"); background-position: -165px -55px;"></div>
<div id="font-colour12" class="font-colour" onclick="SelectFontColour('12',0)" style="background-image: url("https://static1.textcraft.net/backgrounds/font1-bg4.jpg?v=1"); background-position: -220px -55px;"></div>
<div id="font-colour13" class="font-colour" onclick="SelectFontColour('13',0)" style="background-image: url("https://static1.textcraft.net/backgrounds/font1-bg4.jpg?v=1"); background-position: -275px -55px;"></div>
<div id="font-colour14" class="font-colour" onclick="SelectFontColour('14',0)" style="background-image: url("https://static1.textcraft.net/backgrounds/font1-bg4.jpg?v=1"); background-position: -330px -55px;"></div>
<div id="font-colour15" class="font-colour" onclick="SelectFontColour('15',0)" style="background-image: url("https://static1.textcraft.net/backgrounds/font1-bg4.jpg?v=1"); background-position: -385px -55px;"></div>
<div class="clearer" style="height:2px;"></div>
</div> <!-- end colouroptions -->
<div id="rightarrow" class="fontcolarrow" style="background:url(https://static1.textcraft.net/img/right_arrow3d.png); margin-left: 0px;" onmouseover="SetArrowHigh(this,'right')" onmouseout="SetArrowLow(this,'right')"
onclick="SetArrow(this,'right')">
</div>
</div> <!-- end fontcolbox -->
<div class="clearer" style="height:3px"> </div>
<div id="pagedots">
<div id="pagedot7" class="pagedot" style="background-position: 0px 0px;"></div>
<div id="pagedot6" class="pagedot" style="background-position: 0px 0px;"></div>
<div id="pagedot5" class="pagedot" style="background-position: 0px 0px;"></div>
<div id="pagedot4" class="pagedot" style="background-position: 0px 0px;"></div>
<div id="pagedot3" class="pagedot" style="background-position: 0px 0px;"></div>
<div id="pagedot2" class="pagedot" style="background-position: 0px 0px;"></div>
<div id="pagedot1" class="pagedot" style="background-position: 0px 0px;"></div>
<div id="pagedot0" class="pagedot" style="background-position: -9px 0px;"></div>
</div>
<div class="clearer"></div>
<!-- styleoptionsbox -->
<div id="styleoptionsbox">
<div id="style-opt" style="margin-top:3px;">
<!-- new fontblock image is 57px higher, textcraft pro also adds 50px to controls-bg1 background
Edit: Not any more
-->
<img src="https://static1.textcraft.net/img/fontblock7.png" border="0" alt="font styles" style="width:542px; height:186px; margin-left:5px; -webkit-tap-highlight-color: rgba(0,0,0,0);">
<div id="fontselleft" style="display: block; left: 0px; top: -2px;">
<img src="https://static1.textcraft.net/img/fontsel-left2.png">
</div>
<div id="fontselright" style="display: block; left: 174px; top: -2px;">
<img src="https://static1.textcraft.net/img/fontsel-right2.png">
</div>
<div class="style-opt-button2" style="top:0px; left:0px; width:191px; height:32px;" onclick="SetFontStyle2("font1",1); return false;"></div>
<div class="style-opt-button2" style="top:0px; left:192px; width:104px; height:32px;" onclick="SetFontStyle2("font2",1); return false;"></div>
<div class="style-opt-button2" style="top:0px; left:297px; width:151px; height:32px;" onclick="SetFontStyle2("font3",1); return false;"></div>
<div class="style-opt-button2" style="top:0px; left:449px; width:86px; height:32px;" onclick="SetFontStyle2("font4",1); return false;"></div>
<div class="style-opt-button2" style="top:33px; left:0px; width:136px; height:28px;" onclick="SetFontStyle2("font5",1); return false;"></div>
<div class="style-opt-button2" style="top:33px; left:137px; width:138px; height:28px;" onclick="SetFontStyle2("font6",1); return false;"></div>
<div class="style-opt-button2" style="top:33px; left:276px; width:128px; height:28px;" onclick="SetFontStyle2("font7",1); return false;"></div>
<div class="style-opt-button2" style="top:33px; left:405px; width:130px; height:28px;" onclick="SetFontStyle2("font8",1); return false;"></div>
<div class="style-opt-button2" style="top:62px; left:0px; width:120px; height:29px;" onclick="SetFontStyle2("font18",1); return false;"></div>
<div class="style-opt-button2" style="top:62px; left:121px; width:153px; height:29px;" onclick="SetFontStyle2("font19",1); return false;"></div>
<div class="style-opt-button2" style="top:62px; left:275px; width:122px; height:29px;" onclick="SetFontStyle2("font20",1); return false;"></div>
<div class="style-opt-button2" style="top:62px; left:398px; width:137px; height:29px;" onclick="SetFontStyle2("font21",1); return false;"></div>
<div class="style-opt-button2" style="top:92px; left:0px; width:140px; height:28px;" onclick="SetFontStyle2("font22",1); return false;"></div>
<div class="style-opt-button2" style="top:92px; left:141px; width:131px; height:28px;" onclick="SetFontStyle2("font23",1); return false;"></div>
<div class="style-opt-button2" style="top:92px; left:273px; width:126px; height:28px;" onclick="SetFontStyle2("font24",1); return false;"></div>
<div class="style-opt-button2" style="top:92px; left:400px; width:135px; height:28px;" onclick="SetFontStyle2("font25",1); return false;"></div>
<div class="style-opt-button2" style="top:121px; left:0px; width:103px; height:29px;" onclick="SetFontStyle2("font26",1); return false;"></div>
<div class="style-opt-button2" style="top:121px; left:104px; width:120px; height:29px;" onclick="SetFontStyle2("font27",1); return false;"></div>
<div class="style-opt-button2" style="top:121px; left:225px; width:117px; height:29px;" onclick="SetFontStyle2("font28",1); return false;"></div>
<div class="style-opt-button2" style="top:121px; left:343px; width:101px; height:29px;" onclick="SetFontStyle2("font29",1); return false;"></div>
<div class="style-opt-button2" style="top:121px; left:445px; width:90px; height:29px;" onclick="SetFontStyle2("font30",1); return false;"></div>
<div class="style-opt-button2" style="top:151px; left:0px; width:106px; height:29px;" onclick="SetFontStyle2("font31",1); return false;"></div>
<div class="style-opt-button2" style="top:151px; left:107px; width:107px; height:29px;" onclick="SetFontStyle2("font32",1); return false;"></div>
<div class="style-opt-button2" style="top:151px; left:215px; width:103px; height:29px;" onclick="SetFontStyle2("font33",1); return false;"></div>
<div class="style-opt-button2" style="top:151px; left:319px; width:82px; height:29px;" onclick="SetFontStyle2("font34",1); return false;"></div>
<div class="style-opt-button2" style="top:151px; left:399px; width:140px; height:29px;" onclick="SetFontStyle2("font35",1); return false;"></div>
<!--
<div class="style-opt-button2" style="top:65px; left:0px; width:62px; height:27px;" onclick='SetFontStyle2("font9",1); return false;'></div>
<div class="style-opt-button2" style="top:65px; left:75px; width:47px; height:27px;" onclick='SetFontStyle2("font10",1); return false;'></div>
<div class="style-opt-button2" style="top:65px; left:135px; width:62px; height:27px;" onclick='SetFontStyle2("font11",1); return false;'></div>
<div class="style-opt-button2" style="top:65px; left:214px; width:60px; height:27px;" onclick='SetFontStyle2("font12",1); return false;'></div>
<div class="style-opt-button2" style="top:65px; left:287px; width:51px; height:27px;" onclick='SetFontStyle2("font13",1); return false;'></div>
<div class="style-opt-button2" style="top:65px; left:354px; width:67px; height:27px;" onclick='SetFontStyle2("font14",1); return false;'></div>
<div class="style-opt-button2" style="top:65px; left:436px; width:86px; height:27px;" onclick='SetFontStyle2("font15",1); return false;'></div>
-->
</div>
</div>
<div class="clearer" style="height:0px"> </div>
</div>
<div id="multilinepagenum" style="top:385px;">1</div>
</div> <!-- end linestyle-box -->
<div class="clearer" style="height:0px"> </div>
<div id="textoptions" style="margin-top:0px;"><!--
<div id='textoptions' style="margin-top:0px;">
-->
<div class="clearer" style="height:24px"> </div>
<!-- 1st line of options -->
<div id="checkbox4" class="checkbox" onclick="SetCheckboxSelected('4')" onmouseover="SetCheckboxHigh('4')" onmouseout="SetCheckboxLow('4')">
</div>
<div id="optiontext" style="width:295px; float:left"><span onclick="SetCheckboxSelected('4'); return false;" onmouseover="SetCheckboxHigh('4')" onmouseout="SetCheckboxLow('4')">fit lines to max width</span></div>
<div id="optiontext" style="width:158px; margin-top: 4px; float:left; border:0px solid #fff">
<div class="slider">
<script language="JavaScript">
var A_TPL = {
'b_vertical': false,
'b_watch': true,
'n_controlWidth': 150,
'n_controlHeight': 22,
/*
'n_sliderWidth': 24,
'n_sliderHeight': 22,
'n_pathLeft' : 0,
'n_pathTop' : 3,
*/
'n_sliderWidth': 30,
'n_sliderHeight': 28,
'n_pathLeft': -2,
'n_pathTop': 0,
'n_pathLength': 150 - 22,
's_imgControl': 'https://static1.textcraft.net/img/horiz_slider_bg_tc4a.png',
's_imgSlider': 'https://static1.textcraft.net/img/horiz_slider_fg_tc7b.png',
'n_zIndex': 1
}
var A_INIT = {
's_form': 'gen_fields',
's_name': 'sliderValue',
'n_minValue': 100,
'n_maxValue': 900,
'n_value': 500,
'n_step': 1
}
slider_1 = new slider(A_INIT, A_TPL);
</script>
<div style="width:150px;height:22px;border:0; background-image:url(https://static1.textcraft.net/img/horiz_slider_bg_tc4a.png); background-size:150px 22px;" id="sl0base"><img
src="https://static1.textcraft.net/img/horiz_slider_fg_tc7b.png" width="30" height="28" border="0" style="position: relative; left: 62px; top: 0px; z-index: 1; cursor: pointer; visibility: visible;" name="sl0slider" id="sl0slider"
onmousedown="return f_sliderMouseDown(0)" ontouchstart="return f_sliderMouseDown(0)"></div>
</div><!-- end slider div -->
</div>
<div id="optiontext" style="width:55px; float:left; border:0px solid #fff">
<input name="sliderValue" id="sliderValue" type="text" size="3" value="500">
</div>
<div class="clearer" style="height:10px"> </div>
<!-- 2nd line of options -->
<div id="checkbox2" class="checkbox_on" onclick="SetCheckboxSelected('2')" onmouseover="SetCheckboxHigh('2')" onmouseout="SetCheckboxLow('2')">
</div>
<div id="optiontext" style="width:170px; float:left"><span onclick="SetCheckboxSelected('2'); return false;" onmouseover="SetCheckboxHigh('2')" onmouseout="SetCheckboxLow('2')">drop shadow</span></div>
<div id="checkbox3" class="checkbox" onclick="SetCheckboxSelected('3')" onmouseover="SetCheckboxHigh('3')" onmouseout="SetCheckboxLow('3')">
</div>
<div id="optiontext" style="width:70px; float:left"><span onclick="SetCheckboxSelected('3'); return false;" onmouseover="SetCheckboxHigh('3')" onmouseout="SetCheckboxLow('3')">glow</span></div>
<div id="optionwidth4_default" onmouseover="SetGlowHigh(this,'2')" onmouseout="SetGlowLow(this,'2')" onclick="SetGlowSelected(this,'2')">
<div style="position:absolute;top:1px;left:9px;"><img src="https://static1.textcraft.net/img/glow-icon-small3.png"></div>
</div>
<div id="optionwidth4" onmouseover="SetGlowHigh(this,'3')" onmouseout="SetGlowLow(this,'3')" onclick="SetGlowSelected(this,'3')">
<div style="position:absolute;top:-1px;left:1px;"><img src="https://static1.textcraft.net/img/paint-icon4.png"></div>
</div>
<div id="colorswatch" style="margin-left:5px;">
<input id="color0" name="color0" value="" style="display:none; margin: 4px 0 0 0;width:9ex;color:white;background-color:#181818;border:1px solid #777;padding: 2px;" onchange="cs0.setrgb(this.value);"
onkeypress="if (event.keyCode == 13){return false;}">
<div id="color_select_icon0" class="color_select_icon">
<img id="color0_img" src="https://static1.textcraft.net/img/colorpick/color_select_icon2a-dark.png" onclick="SwatchColourSelect(cs0,0);" style="float:left; margin-left:2px; cursor:default;">
<div id="color0_display" class="color_display" style="margin: 9px 0px 0px 10px; cursor: default; background: rgb(44, 38, 46);" onclick="SwatchColourSelect(cs0,0);"></div>
</div>
</div>
<div class="clearer" style="height:6px"> </div>
<!-- 3rd line of options -->
<div id="checkbox1" class="checkbox_on" onclick="SetCheckboxSelected('1')" onmouseover="SetCheckboxHigh('1')" onmouseout="SetCheckboxLow('1')">
</div>
<div id="optiontext" style="width:180px; float:left; border:0px solid #f00"><span onclick="SetCheckboxSelected('1'); return false;" onmouseover="SetCheckboxHigh('1')" onmouseout="SetCheckboxLow('1')">3d-style view</span></div>
<div id="checkbox5" class="checkbox" onclick="SetCheckboxSelected('5')" onmouseover="SetCheckboxHigh('5')" onmouseout="SetCheckboxLow('5')" style="margin-left:6px;">
</div>
<div id="optiontext" style="float:left; border:0px solid #f00"><span onclick="SetCheckboxSelected('5'); return false;" onmouseover="SetCheckboxHigh('5')" onmouseout="SetCheckboxLow('5')">24-bit colour images</span></div>
<div class="clearer" style="height:9px; border:0px solid #f00;"> </div>
<div id="styledb-save" class="styledb" style="position:relative;">
<div id="loadsettings-overlay" style="position:absolute;display:none;margin:0px 0 0 250px;z-index:1000;">
<!--
<img src='https://static1.textcraft.net/img/big-progress.gif' style='margin:-2px 0 0 0;'>
<img src='https://static1.textcraft.net/img/big-progress.gif' style='margin:34px 0 0 170px;'>
<img src='https://static1.textcraft.net/img/small-progress.gif' style='margin:34px 0 0 170px;'>
<div id="loadsettings-img" style='margin:40px 0 0 160px;'>
-->
<div id="loadsettings-img" style="margin:0 0 0 282px;">
<img src="https://static1.textcraft.net/img/small-progress.gif">
</div>
</div>
<div id="styledb-text" style="width:550px; height:60px; display:none;">
<div style="float:left; height:22px;">
<div style="float:left; width:180px;" id="savestyle-heading"> Save this style </div>
<div id="savestyle-errormsg" style="width:360px;"> </div>
</div>
<div class="clearer" style="height:8px;"></div>
<div id="savestyle-controls" style="border:0px solid #0ff">
<!-- <form method='POST' action='' onsubmit='SaveStyle(); return false;'> -->
<div id="savestyle" style="width:80px;">
<div style="margin-top:7px">Style name:</div>
</div>
<div id="savestyle" style="width:200px;">
<div id="stylename-bg" style="position:relative;">
<div style="position:absolute; top:3px; left:4px;">
<input type="text" name="text" value="mystyle" id="stylename" onfocus="ClearSaveStyletext(); return false;" onkeypress="if (event.keyCode == 13){SaveStyle(); return false;}">
</div>
</div>
</div>
<!--
<div id='savestyle' style="margin-left:3px; width:82px; text-align:right; border:0px solid #fff">
<div style="margin-top:7px; margin-right:4px;">Your name:</div>
</div>
<div id='savestyle' style="width:115px; margin-left:1px;">
<div id="yourname-bg" style="position:relative;">
<div style="position:absolute; top:3px; left:4px;">
<input type='text' name='text' value='myname' id='yourname'" onfocus="ClearSaveStyletext(); return false;" onKeyPress="if (event.keyCode == 13){SaveStyle(); return false;}">
</div>
</div>
</div>
-->
<div id="savestyle-progress"> </div>
<div id="savestyle" style="width:110px; margin-left:7px; margin-top:-1px;">
<div id="savestylebutton" onmouseover="SetSaveStyleButtonHigh(this)" onmouseout="SetSaveStyleButtonLow(this)" onclick="SaveStyle();">
<div style="margin-top:8px"> Save style </div>
</div>
</div>
<div id="savestyle" style="width:110px; margin-left:7px; margin-top:-1px;">
<div id="savestylebutton" style="background-position: -220px 0px;" onmouseover="SetProfilePageButtonHigh(this)" onmouseout="SetProfilePageButtonLow(this)" onclick="window.open('/'+_username,'_blank');">
<div style="margin-top:8px"> Your profile </div>
</div>
</div>
<div class="clearer"> </div>
</div><!-- end savestyle-controls -->
<div id="savestyle-success" style="border:0px solid #0ff;">
</div><!-- end savestyle-success -->
</div><!-- end styledb-text -->
<div id="styledb-loaded" style="width:545px; height:60px; border:0px solid #0ff; font-size:.7em; letter-spacing:normal;">Use Textcraft to make your own Minecraft and 8-bit style text and logos.<br>
<div class="clearer" style="height:1px; width:540px; border-bottom:1px dotted #555;"> </div>
<div style="font-size:12px; letter-spacing:normal; margin-top:2px; border-top:0px solid #888; color:#888;">Click on one of the styles below to load it, or create your own by changing the settings above. See the guide below for more
details on each option.</div>
<script type="text/javascript">
_pageloadedstyle = 0;
</script>
</div><!-- end styledb-loaded -->
</div><!-- end styledb div -->
</div><!-- end textoptions div -->
<div class="clearer" style="border: solid 0px #f0b;"> </div>
<div style="display:none">
<div id="optionwidth2a"><label style="cursor:pointer">
<input type="checkbox" name="non_trans" onclick="ProcessGen()" style="vertical-align: middle;height:20px"> Solid Bg. </label>
</div>
<div id="optionwidth2a" style="margin-right:0px"><label style="cursor:pointer">
<input type="checkbox" name="glitter_border" checked="yes" onclick="ProcessGen()" style="vertical-align: middle;height:20px;"> Comment Borders </label>
</div>
</div>
</div> <!-- end of options-box div -->
<div id="multilinesel" style="background-position: -15px 0px;">
</div>
<div id="input-box" style="border:0px solid #ff0; min-height:774px; background:url(https://static1.textcraft.net/img/controls-bg2n.png) top left no-repeat;">
<div style="margin:16px 0 0 5px; border:0px solid #ff0">
<div class="clearer"> </div>
<div id="yourtext-bg" style="border: 0px solid rgb(255, 0, 0); position: relative; background-position: 0px 0px;">
<div class="notranslate" style="position:absolute; line-height:38px; height:38px; top:7px; left:7px; border:0px solid #f0f">1.</div>
<div style="position:absolute; top:3px; left:27px; border:0px solid #f0f">
<input type="text" name="text" value="" placeholder="Your text here" id="yourtext" dir="auto" spellcheck="false" autocomplete="off" oninput="checkUnicode(this,1);" onfocus="UpdateMultiDisplay(1,1); checkUnicode(this,1); return false;"
style="background-color: rgb(204, 204, 204); border-color: rgb(204, 204, 204);">
</div>
</div>
<div class="clearer"> </div>
<div style="float:left; width:240px; border:0px solid #f00;">
<div id="yourtext2-bg" style="border: 0px solid rgb(255, 0, 255); position: relative; background-position: -226px 0px;"><!--
<div style="display:inline; margin-left:8px;">
2. <input type='text' name='text2' value='' id='yourtext2' onfocus="UpdateMultiDisplay(2,1); return false;">
</div>
-->
<div class="notranslate" style="position:absolute; line-height:32px; height:32px; top:6px;
left:7px; border:0px solid #f0f">2.</div>
<div style="position:absolute; top:3px; left:27px; border:0px solid #f0f">
<input type="text" name="text2" value="" id="yourtext2" dir="auto" spellcheck="false" autocomplete="off" oninput="checkUnicode(this,2);" onfocus="UpdateMultiDisplay(2,1); checkUnicode(this,2); return false;"
style="background-color: rgb(138, 138, 138); border-color: rgb(138, 138, 138);">
</div>
</div>
<div class="clearer"> </div>
<div id="yourtext3-bg" style="border: 0px solid rgb(255, 0, 255); position: relative; background-position: -226px 0px;">
<!--
<div style="display:inline; margin-left:8px;">
3. <input type='text' name='text3' value='' id='yourtext3' onfocus="UpdateMultiDisplay(3,1); return false;">
</div>
-->
<div class="notranslate" style="position:absolute; line-height:32px; height:32px; top:6px;
left:7px; border:0px solid #f0f">3.</div>
<div style="position:absolute; top:3px; left:27px; border:0px solid #f0f">
<input type="text" name="text3" value="" id="yourtext3" dir="auto" spellcheck="false" autocomplete="off" oninput="checkUnicode(this,3);" onfocus="UpdateMultiDisplay(3,1); checkUnicode(this,3); return false;"
style="background-color: rgb(138, 138, 138); border-color: rgb(138, 138, 138);">
</div>
</div>
</div>
<div id="createbutton" onmouseover="SetCreateButtonHigh(this)" onmouseout="SetCreateButtonLow(this)" onclick="SetCreateSelected(this);">
<div style="margin-top:24px"> Create </div>
</div>
<input type="hidden" name="submittype" value="text" id="submittype">
<input type="submit" value="Make text" style="border:0px; width:0px; height:0px; overflow:hidden; font-size:0px; line-height:0px;">
<div class="clearer"></div>
<div id="multiline-bg"><!--
<div id="multiline-bg">
-->
<div id="multibutton" style="" onmouseover="SetMultiButtonHigh(this)" onmouseout="SetMultiButtonLow(this)" onclick="SetMultiSelected(this);">
</div>
<div id="multiline-text">Use different styles for each line of text</div>
</div>
<div class="clearer" style="height:0px"></div>
<div id="borderscale-bg" style="display:none">
<div id="borderscalebutton" style="" onmouseover="SetBorderscaleButtonHigh(this)" onmouseout="SetBorderscaleButtonLow(this)" onclick="SetBorderscaleSelected();">
</div>
<div id="borderscale-text">Adjust border size along with text size</div>
</div>
<div class="clearer"> </div>
<div id="downloadbutton" style="margin-left:15px;" onmouseover="SetDownloadButtonHigh(this)" onmouseout="SetDownloadButtonLow(this)" onclick="SetDownloadSelected(this); return false;">
<div style="margin-top:15px; margin-left:10px; border:0px solid #5f5; float:left;">
<img src="https://static1.textcraft.net/img/downarrow-green2.png">
</div>
<div class="notranslate" style="margin-top:11px; margin-left:4px; border:0px solid #55f; float:left; color: #ccc; /*text-shadow:#aad 0 0 .04em;*/"> download</div>
</div>
<div class="extrabutton" id="extrabutton1" onmouseover="SetExtraButtonHigh(this)" onmouseout="SetExtraButtonLow(this)" onclick="SetUploadSelected(this)">
<div style="margin-top:15px; margin-left:10px; border:0px solid #5f5; float:left;">
<img src="https://static1.textcraft.net/img/uparrow-blue2.png">
<!--
<div style="margin-top:13px; margin-left:2px; color: #ddd; /*text-shadow:#dad 0 0 .04em;*/">
<img src='https://static1.textcraft.net/img/imgur-upload2.png'>
-->
</div>
<div class="notranslate" style="margin-top:11px; margin-left:4px; border:0px solid #55f; float:left; color: #ccc; /*text-shadow:#aad 0 0 .04em;*/"> host</div>
</div>
<div class="extrabutton" id="extrabutton2" onmouseover="SetExtraButtonHigh(this)" onmouseout="SetExtraButtonLow(this)" onclick="SetViewSelected(this);">
<div style="margin-top:15px; margin-left:10px; border:0px solid #5f5; float:left;">
<img src="https://static1.textcraft.net/img/monitor-small.png">
</div>
<div class="notranslate" style="margin-top:11px; margin-left:6px; float:left; color: #ccc; /*text-shadow:#daa 0 0 .04em;*/"> view</div>
</div>
<div class="clearer" style="height:1px"></div>
<div id="download-note" style="height:13px; padding-top:1px;">
<span style="color:#888; tesxt-decoration:underline;">** Note:</span> Please use <span class="notranslate">"download"</span> or <span class="notranslate">"host"</span> to keep your images
</div>
<div class="clearer" style="height:0px"></div>
<a href="/tx-pro.php" target="_blank" style="outline:none">
<div id="txpro-small-main" style="border:0px solid #fff; margin: 22px 0px 0px 19px" onmouseover="SetTxproAdHigh(this)" onmouseout="SetTxproAdLow(this)" ontouchstart="SetTxproAdHigh(this)" onclick="SetTxproAdSelected(this)">
</div>
</a>
<div id="largerect-main" style="display:block; height:auto; clear:both; float: none; border:0px; margin-top:0px;">
<div id="style-opt-unicode" style="margin-top:28px; border:0px solid #fff;">
<img src="https://static1.textcraft.net/img/fontblock6-unicode.png" border="0" alt="font styles" style="width:335px; height:60px; margin-left:5px; -webkit-tap-highlight-color: rgba(0,0,0,0);">
<div id="fontselleft-unicode" style="display: none;">
<img src="https://static1.textcraft.net/img/fontsel-left2.png">
</div>
<div id="fontselright-unicode" style="display: none;">
<img src="https://static1.textcraft.net/img/fontsel-right2.png">
</div>
<!-- Unicode fonts 9-15,17 -->
<div class="style-opt-button2" style="top:0px; left:0px; width:74px; height:28px;" onclick="SetFontStyle2("font13",1); return false;"></div>
<div class="style-opt-button2" style="top:0px; left:75px; width:91px; height:28px;" onclick="SetFontStyle2("font17",1); return false;"></div>
<div class="style-opt-button2" style="top:0px; left:167px; width:87px; height:28px;" onclick="SetFontStyle2("font12",1); return false;"></div>
<div class="style-opt-button2" style="top:0px; left:255px; width:82px; height:28px;" onclick="SetFontStyle2("font11",1); return false;"></div>
<div class="style-opt-button2" style="top:29px; left:0px; width:86px; height:28px;" onclick="SetFontStyle2("font14",1); return false;"></div>
<div class="style-opt-button2" style="top:29px; left:87px; width:111px; height:28px;" onclick="SetFontStyle2("font15",1); return false;"></div>
<div class="style-opt-button2" style="top:29px; left:199px; width:80px; height:28px;" onclick="SetFontStyle2("font9",1); return false;"></div>
<div class="style-opt-button2" style="top:29px; left:280px; width:57px; height:28px;" onclick="SetFontStyle2("font10",1); return false;"></div>
</div><!-- end style-opt-unicode -->
<div class="clearer"></div>
<div id="lighting-opt" style="margin-top:2px; border:1px solid #fff; display:none;">
<!-- 4th line of options -->
<div id="checkbox7" class="checkbox" onclick="SetCheckboxSelected('7')" onmouseover="SetCheckboxHigh('7')" onmouseout="SetCheckboxLow('7')" style="margin-left:6px;">
</div>
<div id="optiontext" style="width:120px; float:left; border:0px solid #f00"><span onclick="SetCheckboxSelected('7'); return false;" onmouseover="SetCheckboxHigh('7')" onmouseout="SetCheckboxLow('7')">lighting</span></div>
<div id="lightbutton-1" class="optionwidth6_default" onmouseover="SetLightHigh(this,'1')" onmouseout="SetLightLow(this,'1')" onclick="SetLightSelected(this,'1')">
<!--
<div style="position:absolute;top:1px;left:9px;"><img src="https://static1.textcraft.net/img/glow-icon-small3.png"></div>
-->
</div>
<div id="lightbutton-2" class="optionwidth6" onmouseover="SetLightHigh(this,'2')" onmouseout="SetLightLow(this,'2')" onclick="SetLightSelected(this,'2')">
</div>
<div class="clearer" style="height:2px"></div>
<div id="lightbutton-3" class="optionwidth6" onmouseover="SetLightHigh(this,'3')" onmouseout="SetLightLow(this,'3')" onclick="SetLightSelected(this,'3')">
</div>
<div id="lightbutton-4" class="optionwidth6" onmouseover="SetLightHigh(this,'4')" onmouseout="SetLightLow(this,'4')" onclick="SetLightSelected(this,'4')">
</div>
<div id="lightbutton-5" class="optionwidth6" onmouseover="SetLightHigh(this,'5')" onmouseout="SetLightLow(this,'5')" onclick="SetLightSelected(this,'5')">
</div>
<div id="lightbutton-6" class="optionwidth6" onmouseover="SetLightHigh(this,'6')" onmouseout="SetLightLow(this,'6')" onclick="SetLightSelected(this,'6')">
</div>
<div class="clearer" style="height:2px"></div>
</div><!-- end lighting-opt -->
<div class="clearer" style="height:12px"></div>
<div id="txpro-block-pro" style="margin-top:9px; border:0px solid #fff; display:none;">
<div class="clearer" style="height:6px"></div>
<span style="font-size:25px; color:#707070; color:#7C80A9;">Image Details</span>
<div class="clearer" style="height:20px"></div>
<div id="imgdetail"> dimensions: <div class="imgdetail_value" id="imgdetail_dimensions">n/a</div><br> file size: <div class="imgdetail_value" id="imgdetail_filesize">n/a</div><br> colour format: <div class="imgdetail_value"
id="imgdetail_colourdepth">n/a</div><br>
<!--
colour count: <div class="imgdetail_value" id="imgdetail_numcolours">n/a</div><br>
-->
</div>
<div class="clearer" style="height:20px"></div>
<div id="imgdetail-status"><span style="color:#777"></span></div>
<!--
<div id="imgdetail-status"><span style="color:#777">Image details are displayed here</span></div>
-->
</div> <!-- end txpro-block-pro div -->
<!--
<div id="txpro-block" style="margin-top:5px; border:0px solid #fff;">
-->
<div id="txpro-block" style="width:340px; height:200px; margin-left:-3px; margin-top:1px; border:0px solid #fff; position:absolute"><!-- textcraft-main1a -->
<ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-8959601970688211" data-ad-slot="8369035851" data-ad-format="auto" data-full-width-responsive="false"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
<!--
<a href="/tx-pro.php" target="_blank" style="text-decoration:none">
<div id="txpro-block-text">
<img src="https://static1.textcraft.net/img/txpro-header-small.png" style="position:absolute; width:340px; height:49px; margin:15px 0 0 2px;">
<img src="https://static1.textcraft.net/img/new-sticker-small.png" style="position:absolute; width:58px; height:57px; margin:90px 0 0 281px;">
<div style="position:absolute; margin-left:39px; margin-top:80px; font-size:18px; line-height:26px; color:#aaa">
<ul>
<li><span style="color:#eee">3 new extra large font sizes</span></li>
<li>Hi-res textures & glow</li>
<li>See more details & examples</li>
</ul>
</div>
<div id="txprobutton" style="position:absolute; margin:171px 0 0 104px" onmouseover="SetTxproButtonHigh(this)" onmouseout="SetTxproButtonLow(this)">
<div style="margin-top:15px; margin-left:10px; width:60px; float:left">
GO
</div>
<div style="margin-top:5px; float:left">
<img src="https://static1.textcraft.net/img/chevron1.png">
</div>
</div>
</div>
</a>
-->
</div><!-- end txpro-block -->
<div class="clearer"></div>
</div><!-- end largerect_main -->
</div>
</div> <!-- end of input-box div -->
<div class="clearer"> </div>
<div id="topstyles" style="margin:-1px 0 0 5px;">
<div class="clearer"> </div>
<div id="styledb-search" class="styledb">
<div style="position:relative; width:930px; height:116px;">
<div id="styledb-searchprogress" style="width: 930px; height: 94px; position: absolute; top: 0px; left: 0px; z-index: 100; display: none;">
<img src="https://static1.textcraft.net/img/big-progress.gif" style="margin:30px 0 0 450px;">
</div>
<div id="styledb-results" style="width:930px; height:114px; position: absolute; top:0; left:0;">
<div class="styleresult notranslate"
onclick="SetStyleResultTouch(0); LoadStyleSettings("Youtube%20Thumbnail","youtube-thumbnail","jasonejohnson31","https://static1.textcraft.net/styles/j/a/jasonejohnson31/youtube-thumbnail","2653","https://static1.textcraft.net/styles/j/a/jasonejohnson31/youtube-thumbnail.png","https://static1.textcraft.net/styles/j/a/jasonejohnson31/youtube-thumbnail-thumb.png","https://static1.textcraft.net/styles/j/a/jasonejohnson31/youtube-thumbnail-icon.png","https://static1.textcraft.net/styles/j/a/jasonejohnson31/youtube-thumbnail-yourtext.png?v=1")"
onmouseover="SetStyleResultHigh("0")" onmouseout="SetStyleResultLow("0")">
<div style="height:60px"><img src="https://static1.textcraft.net/styles/j/a/jasonejohnson31/youtube-thumbnail-thumb.png"></div>
<div class="clearer"></div>
<div class="stylestats" id="stylestats-0">
<div id="loadedstyle-0" style="vertical-align:top; width:86px; height:23px; overflow:hidden; border:0px solid #f00; font-size:10px; line-height:11px; margin-top:4px;">Youtube Thumbnail</div>
<div class="clearer"></div>
<div style="color:#98a; height:11px; line-height:11px; overflow:hidden; font-size:1.0em; margin-top:1px;">by: jasonejohnson31</div>
<div class="clearer"></div>
<div style="color:#696990; margin-top:0px; height:13px; line-height:13px; overflow:hidden; font-size:1.1em;">hits: 2653</div>
</div>
</div>
<div class="styleresult notranslate"
onclick="SetStyleResultTouch(1); LoadStyleSettings("Pokemon","pokemon","Textcraft","https://static1.textcraft.net/styles/t/e/textcraft/pokemon","2197","https://static1.textcraft.net/styles/t/e/textcraft/pokemon.png","https://static1.textcraft.net/styles/t/e/textcraft/pokemon-thumb.png","https://static1.textcraft.net/styles/t/e/textcraft/pokemon-icon.png","https://static1.textcraft.net/styles/t/e/textcraft/pokemon-yourtext.png?v=1")"
onmouseover="SetStyleResultHigh("1")" onmouseout="SetStyleResultLow("1")">
<div style="height:60px"><img src="https://static1.textcraft.net/styles/t/e/textcraft/pokemon-thumb.png"></div>
<div class="clearer"></div>
<div class="stylestats" id="stylestats-1">
<div id="loadedstyle-1" style="vertical-align:top; width:86px; height:23px; overflow:hidden; border:0px solid #f00; font-size:14px; line-height:16px; margin-top:3px;">Pokemon</div>
<div class="clearer"></div>
<div style="color:#98a; height:11px; line-height:11px; overflow:hidden; font-size:1.1em; margin-top:2px;">by: Textcraft</div>
<div class="clearer"></div>
<div style="color:#696990; margin-top:0px; height:13px; line-height:13px; overflow:hidden; font-size:1.1em;">hits: 2197</div>
</div>
</div>
<div class="styleresult notranslate"
onclick="SetStyleResultTouch(2); LoadStyleSettings("GTA%20Wasted","gta-wasted","PedroBlocks24","https://static1.textcraft.net/styles/p/e/pedroblocks24/gta-wasted","1386","https://static1.textcraft.net/styles/p/e/pedroblocks24/gta-wasted.png","https://static1.textcraft.net/styles/p/e/pedroblocks24/gta-wasted-thumb.png","https://static1.textcraft.net/styles/p/e/pedroblocks24/gta-wasted-icon.png","https://static1.textcraft.net/styles/p/e/pedroblocks24/gta-wasted-yourtext.png?v=1")"
onmouseover="SetStyleResultHigh("2")" onmouseout="SetStyleResultLow("2")">
<div style="height:60px"><img src="https://static1.textcraft.net/styles/p/e/pedroblocks24/gta-wasted-thumb.png"></div>
<div class="clearer"></div>
<div class="stylestats" id="stylestats-2">
<div id="loadedstyle-2" style="vertical-align:top; width:86px; height:23px; overflow:hidden; border:0px solid #f00; font-size:14px; line-height:16px; margin-top:3px;">GTA Wasted</div>
<div class="clearer"></div>
<div style="color:#98a; height:11px; line-height:11px; overflow:hidden; font-size:1.0em; margin-top:2px;">by: PedroBlocks24</div>
<div class="clearer"></div>
<div style="color:#696990; margin-top:0px; height:13px; line-height:13px; overflow:hidden; font-size:1.1em;">hits: 1386</div>
</div>
</div>
<div class="styleresult notranslate"
onclick="SetStyleResultTouch(3); LoadStyleSettings("Gta%20vice%20city","gta-vice-city","ayoub26","https://static1.textcraft.net/styles/a/y/ayoub26/gta-vice-city","1338","https://static1.textcraft.net/styles/a/y/ayoub26/gta-vice-city.png","https://static1.textcraft.net/styles/a/y/ayoub26/gta-vice-city-thumb.png","https://static1.textcraft.net/styles/a/y/ayoub26/gta-vice-city-icon.png","https://static1.textcraft.net/styles/a/y/ayoub26/gta-vice-city-yourtext.png?v=1")"
onmouseover="SetStyleResultHigh("3")" onmouseout="SetStyleResultLow("3")">
<div style="height:60px"><img src="https://static1.textcraft.net/styles/a/y/ayoub26/gta-vice-city-thumb.png"></div>
<div class="clearer"></div>
<div class="stylestats" id="stylestats-3">
<div id="loadedstyle-3" style="vertical-align:top; width:86px; height:23px; overflow:hidden; border:0px solid #f00; font-size:10px; line-height:11px; margin-top:4px;">Gta vice city</div>
<div class="clearer"></div>
<div style="color:#98a; height:11px; line-height:11px; overflow:hidden; font-size:1.1em; margin-top:1px;">by: ayoub26</div>
<div class="clearer"></div>
<div style="color:#696990; margin-top:0px; height:13px; line-height:13px; overflow:hidden; font-size:1.1em;">hits: 1338</div>
</div>
</div>
<div class="styleresult notranslate"
onclick="SetStyleResultTouch(4); LoadStyleSettings("Grand%20Theft%20Auto","grand-theft-auto","GWSheridan","https://static1.textcraft.net/styles/g/w/gwsheridan/grand-theft-auto","1017","https://static1.textcraft.net/styles/g/w/gwsheridan/grand-theft-auto.png","https://static1.textcraft.net/styles/g/w/gwsheridan/grand-theft-auto-thumb.png","https://static1.textcraft.net/styles/g/w/gwsheridan/grand-theft-auto-icon.png","https://static1.textcraft.net/styles/g/w/gwsheridan/grand-theft-auto-yourtext.png?v=1")"
onmouseover="SetStyleResultHigh("4")" onmouseout="SetStyleResultLow("4")">
<div style="height:60px"><img src="https://static1.textcraft.net/styles/g/w/gwsheridan/grand-theft-auto-thumb.png"></div>
<div class="clearer"></div>
<div class="stylestats" id="stylestats-4">
<div id="loadedstyle-4" style="vertical-align:top; width:86px; height:23px; overflow:hidden; border:0px solid #f00; font-size:10px; line-height:11px; margin-top:4px;">Grand Theft Auto</div>
<div class="clearer"></div>
<div style="color:#98a; height:11px; line-height:11px; overflow:hidden; font-size:1.1em; margin-top:1px;">by: GWSheridan</div>
<div class="clearer"></div>
<div style="color:#696990; margin-top:0px; height:13px; line-height:13px; overflow:hidden; font-size:1.1em;">hits: 1017</div>
</div>
</div>
<div class="styleresult notranslate"
onclick="SetStyleResultTouch(5); LoadStyleSettings("3D%20Text","3d-text","TextDesigner","https://static1.textcraft.net/styles/t/e/textdesigner/3d-text","781","https://static1.textcraft.net/styles/t/e/textdesigner/3d-text.png","https://static1.textcraft.net/styles/t/e/textdesigner/3d-text-thumb.png","https://static1.textcraft.net/styles/t/e/textdesigner/3d-text-icon.png","https://static1.textcraft.net/styles/t/e/textdesigner/3d-text-yourtext.png?v=1")"
onmouseover="SetStyleResultHigh("5")" onmouseout="SetStyleResultLow("5")">
<div style="height:60px"><img src="https://static1.textcraft.net/styles/t/e/textdesigner/3d-text-thumb.png"></div>
<div class="clearer"></div>
<div class="stylestats" id="stylestats-5">
<div id="loadedstyle-5" style="vertical-align:top; width:86px; height:23px; overflow:hidden; border:0px solid #f00; font-size:14px; line-height:16px; margin-top:3px;">3D Text</div>
<div class="clearer"></div>
<div style="color:#98a; height:11px; line-height:11px; overflow:hidden; font-size:1.0em; margin-top:2px;">by: TextDesigner</div>
<div class="clearer"></div>
<div style="color:#696990; margin-top:0px; height:13px; line-height:13px; overflow:hidden; font-size:1.1em;">hits: 781</div>
</div>
</div>
<div class="styleresult notranslate"
onclick="SetStyleResultTouch(6); LoadStyleSettings("YouTube%20style","youtube-style","TeemoPolska","https://static1.textcraft.net/styles/t/e/teemopolska/youtube-style","770","https://static1.textcraft.net/styles/t/e/teemopolska/youtube-style.png","https://static1.textcraft.net/styles/t/e/teemopolska/youtube-style-thumb.png","https://static1.textcraft.net/styles/t/e/teemopolska/youtube-style-icon.png","https://static1.textcraft.net/styles/t/e/teemopolska/youtube-style-yourtext.png?v=1")"
onmouseover="SetStyleResultHigh("6")" onmouseout="SetStyleResultLow("6")">
<div style="height:60px"><img src="https://static1.textcraft.net/styles/t/e/teemopolska/youtube-style-thumb.png"></div>
<div class="clearer"></div>
<div class="stylestats" id="stylestats-6">
<div id="loadedstyle-6" style="vertical-align:top; width:86px; height:23px; overflow:hidden; border:0px solid #f00; font-size:10px; line-height:11px; margin-top:4px;">YouTube style</div>
<div class="clearer"></div>
<div style="color:#98a; height:11px; line-height:11px; overflow:hidden; font-size:1.0em; margin-top:1px;">by: TeemoPolska</div>
<div class="clearer"></div>
<div style="color:#696990; margin-top:0px; height:13px; line-height:13px; overflow:hidden; font-size:1.1em;">hits: 770</div>
</div>
</div>
<div class="styleresult notranslate"
onclick="SetStyleResultTouch(7); LoadStyleSettings("FriDAY%20NiGHT%20FUNKiN%27","friday-night-funkin-","kalmax0328","https://static1.textcraft.net/styles/k/a/kalmax0328/friday-night-funkin-","695","https://static1.textcraft.net/styles/k/a/kalmax0328/friday-night-funkin-.png","https://static1.textcraft.net/styles/k/a/kalmax0328/friday-night-funkin--thumb.png","https://static1.textcraft.net/styles/k/a/kalmax0328/friday-night-funkin--icon.png","https://static1.textcraft.net/styles/k/a/kalmax0328/friday-night-funkin--yourtext.png?v=1")"
onmouseover="SetStyleResultHigh("7")" onmouseout="SetStyleResultLow("7")">
<div style="height:60px"><img src="https://static1.textcraft.net/styles/k/a/kalmax0328/friday-night-funkin--thumb.png"></div>
<div class="clearer"></div>
<div class="stylestats" id="stylestats-7">
<div id="loadedstyle-7" style="vertical-align:top; width:86px; height:23px; overflow:hidden; border:0px solid #f00; font-size:10px; line-height:11px; margin-top:4px;">FriDAY NiGHT FUNKiN'</div>
<div class="clearer"></div>
<div style="color:#98a; height:11px; line-height:11px; overflow:hidden; font-size:1.1em; margin-top:1px;">by: kalmax0328</div>
<div class="clearer"></div>
<div style="color:#696990; margin-top:0px; height:13px; line-height:13px; overflow:hidden; font-size:1.1em;">hits: 695</div>
</div>
</div>
<div class="styleresult notranslate"
onclick="SetStyleResultTouch(8); LoadStyleSettings("Roblox","roblox","jasonejohnson31","https://static1.textcraft.net/styles/j/a/jasonejohnson31/roblox","687","https://static1.textcraft.net/styles/j/a/jasonejohnson31/roblox.png","https://static1.textcraft.net/styles/j/a/jasonejohnson31/roblox-thumb.png","https://static1.textcraft.net/styles/j/a/jasonejohnson31/roblox-icon.png","https://static1.textcraft.net/styles/j/a/jasonejohnson31/roblox-yourtext.png?v=1")"
onmouseover="SetStyleResultHigh("8")" onmouseout="SetStyleResultLow("8")">
<div style="height:60px"><img src="https://static1.textcraft.net/styles/j/a/jasonejohnson31/roblox-thumb.png"></div>
<div class="clearer"></div>
<div class="stylestats" id="stylestats-8">
<div id="loadedstyle-8" style="vertical-align:top; width:86px; height:23px; overflow:hidden; border:0px solid #f00; font-size:14px; line-height:16px; margin-top:3px;">Roblox</div>
<div class="clearer"></div>
<div style="color:#98a; height:11px; line-height:11px; overflow:hidden; font-size:1.0em; margin-top:2px;">by: jasonejohnson31</div>
<div class="clearer"></div>
<div style="color:#696990; margin-top:0px; height:13px; line-height:13px; overflow:hidden; font-size:1.1em;">hits: 687</div>
</div>
</div>
<div class="styleresult notranslate"
onclick="SetStyleResultTouch(9); LoadStyleSettings("MEGA%20MAN%20X%20STYLE","mega-man-x-style","pixelizer","https://static1.textcraft.net/styles/p/i/pixelizer/mega-man-x-style","569","https://static1.textcraft.net/styles/p/i/pixelizer/mega-man-x-style.png","https://static1.textcraft.net/styles/p/i/pixelizer/mega-man-x-style-thumb.png","https://static1.textcraft.net/styles/p/i/pixelizer/mega-man-x-style-icon.png","https://static1.textcraft.net/styles/p/i/pixelizer/mega-man-x-style-yourtext.png?v=1")"
onmouseover="SetStyleResultHigh("9")" onmouseout="SetStyleResultLow("9")">
<div style="height:60px"><img src="https://static1.textcraft.net/styles/p/i/pixelizer/mega-man-x-style-thumb.png"></div>
<div class="clearer"></div>
<div class="stylestats" id="stylestats-9">
<div id="loadedstyle-9" style="vertical-align:top; width:86px; height:23px; overflow:hidden; border:0px solid #f00; font-size:10px; line-height:11px; margin-top:4px;">MEGA MAN X STYLE</div>
<div class="clearer"></div>
<div style="color:#98a; height:11px; line-height:11px; overflow:hidden; font-size:1.1em; margin-top:1px;">by: pixelizer</div>
<div class="clearer"></div>
<div style="color:#696990; margin-top:0px; height:13px; line-height:13px; overflow:hidden; font-size:1.1em;">hits: 569</div>
</div>
</div>
</div>
</div>
<div class="clearer" style="height:3px; width:919px; margin-left:4px; border-bottom:1px dotted #3b3b3b;"> </div>
<div id="styledb-text" style="width:617px; height:40px; margin-left:4px; margin-top:1px; font-size:1em; border:0px solid #fff;">
<div id="yourstyles" style="display:none;">
<div id="dbopt4" class="styledb-option" onmouseover="SetStyleListOptHigh(this,4)" onmouseout="SetStyleListOptLow(this,4)" onclick="SetStyleListOptSelected(4,1)"> your styles </div>
<div id="styledb-separator">
<img src="https://static1.textcraft.net/img/separator.png">
</div>
</div>
<div id="dbopt1" class="styledb-option" style="color:#969;" onmouseover="SetStyleListOptHigh(this,1)" onmouseout="SetStyleListOptLow(this,1)" onclick="SetStyleListOptSelected(1,1)"> most popular </div>
<div id="styledb-separator">
<img src="https://static1.textcraft.net/img/separator.png">
</div>
<div style="display:none">
<div id="dbopt5" class="styledb-option" onmouseover="SetStyleListOptHigh(this,5)" onmouseout="SetStyleListOptLow(this,5)" onclick="SetStyleListOptSelected(5,1)"> most popular all </div>
<div id="styledb-separator">
<img src="https://static1.textcraft.net/img/separator.png">
</div>
<div id="dbopt6" class="styledb-option" onmouseover="SetStyleListOptHigh(this,6)" onmouseout="SetStyleListOptLow(this,6)" onclick="SetStyleListOptSelected(6,1)"> random </div>
<div id="styledb-separator">
<img src="https://static1.textcraft.net/img/separator.png">
</div>
</div>
<div id="dbopt2" class="styledb-option" onmouseover="SetStyleListOptHigh(this,2)" onmouseout="SetStyleListOptLow(this,2)" onclick="SetStyleListOptSelected(2,1)"> newest </div>
<div id="styledb-separator">
<img src="https://static1.textcraft.net/img/separator.png">
</div>
<a href="/styles.php" target="top200" style="color:#999; text-decoration:none;" onmouseover="this.style.color='#ddd';" onmouseout="this.style.color='#999';"><div id="dbopt5" class="styledb-option" onmouseover="SetStyleListOptHigh(this,5)" onmouseout="SetStyleListOptLow(this,5)">
all top styles
</div>
</a>
</div><!-- end styledb-text div -->
<!--
<div id='styledb-text' style="width:246px; height:40px; font-size:1em; border:0px solid #f00;">
-->
<div id="styledb-text" style="width:308px; height:40px; margin-top:1px; font-size:1em; border:0px solid #f00;">
<div id="dbopt3" class="styledb-option" style="width:120px; text-align:right; cursor:default;"> search: </div>
<div id="searchbox-bg" style="position:relative;margin-left:3px;margin-top:3px;">
<div style="position:absolute; top:3px; left:4px;">
<input type="text" name="text" value="" id="searchbox" onfocus="DisplayLastSearch(); return false;" onkeypress="if (event.keyCode == 13){SetStyleListOptSelected(3,1); return false;}">
</div>
</div>
<div id="searchboxbutton" onmouseover="SetSearchboxButtonHigh(this)" onmouseout="SetSearchboxButtonLow(this)" onclick="SetSearchboxButtonSelected(this)">
</div>
</div><!-- end styledb-text div -->
</div><!-- end styledb div -->
</div>
<div id="leaderboard-mid" style="position:relative;">
<div class="clearer" style="height:13px"></div>
<div id="featured-style-results" style="width:930px; height:114px; position: absolute; top:16px; left:20px;">
<div class="styleresult notranslate"
onclick="LoadStyleSettings("Marshmallow","marshmallow","MT_hello","https://static1.textcraft.net/styles/m/t/mt_hello/marshmallow","526","https://static1.textcraft.net/styles/m/t/mt_hello/marshmallow.png","https://static1.textcraft.net/styles/m/t/mt_hello/marshmallow-thumb.png","https://static1.textcraft.net/styles/m/t/mt_hello/marshmallow-icon.png","https://static1.textcraft.net/styles/m/t/mt_hello/marshmallow-yourtext.png?v=1")">
<div style="height:60px"><img src="https://static1.textcraft.net/styles/m/t/mt_hello/marshmallow-thumb.png"></div>
<div class="clearer"></div>
<div class="stylestats-basic" id="stylestats-0">
<div id="loadedstyle-0" style="vertical-align:top; width:86px; height:27px; overflow:hidden; border:0px solid #f00; font-size:12px; line-height:13px; margin-top:4px;">Marshmallow</div>
<div class="clearer"></div>
</div>
</div>
<div class="styleresult notranslate"
onclick="LoadStyleSettings("gta%20mission%20passed","gta-mission-passed","eminzorla","https://static1.textcraft.net/styles/e/m/eminzorla/gta-mission-passed","463","https://static1.textcraft.net/styles/e/m/eminzorla/gta-mission-passed.png","https://static1.textcraft.net/styles/e/m/eminzorla/gta-mission-passed-thumb.png","https://static1.textcraft.net/styles/e/m/eminzorla/gta-mission-passed-icon.png","https://static1.textcraft.net/styles/e/m/eminzorla/gta-mission-passed-yourtext.png?v=1")">
<div style="height:60px"><img src="https://static1.textcraft.net/styles/e/m/eminzorla/gta-mission-passed-thumb.png"></div>
<div class="clearer"></div>
<div class="stylestats-basic" id="stylestats-1">
<div id="loadedstyle-1" style="vertical-align:top; width:86px; height:27px; overflow:hidden; border:0px solid #f00; font-size:12px; line-height:13px; margin-top:4px;">gta mission passed</div>
<div class="clearer"></div>
</div>
</div>
<div class="styleresult notranslate"
onclick="LoadStyleSettings("Diamond%20Text","diamond-text","PedroBlocks24","https://static1.textcraft.net/styles/p/e/pedroblocks24/diamond-text","420","https://static1.textcraft.net/styles/p/e/pedroblocks24/diamond-text.png","https://static1.textcraft.net/styles/p/e/pedroblocks24/diamond-text-thumb.png","https://static1.textcraft.net/styles/p/e/pedroblocks24/diamond-text-icon.png","https://static1.textcraft.net/styles/p/e/pedroblocks24/diamond-text-yourtext.png?v=1")">
<div style="height:60px"><img src="https://static1.textcraft.net/styles/p/e/pedroblocks24/diamond-text-thumb.png"></div>
<div class="clearer"></div>
<div class="stylestats-basic" id="stylestats-2">
<div id="loadedstyle-2" style="vertical-align:top; width:86px; height:27px; overflow:hidden; border:0px solid #f00; font-size:12px; line-height:13px; margin-top:4px;">Diamond Text</div>
<div class="clearer"></div>
</div>
</div>
<div class="styleresult notranslate"
onclick="LoadStyleSettings("Metal%20Slug","metal-slug","Gone_Gold","https://static1.textcraft.net/styles/g/o/gone_gold/metal-slug","408","https://static1.textcraft.net/styles/g/o/gone_gold/metal-slug.png","https://static1.textcraft.net/styles/g/o/gone_gold/metal-slug-thumb.png","https://static1.textcraft.net/styles/g/o/gone_gold/metal-slug-icon.png","https://static1.textcraft.net/styles/g/o/gone_gold/metal-slug-yourtext.png?v=1")">
<div style="height:60px"><img src="https://static1.textcraft.net/styles/g/o/gone_gold/metal-slug-thumb.png"></div>
<div class="clearer"></div>
<div class="stylestats-basic" id="stylestats-3">
<div id="loadedstyle-3" style="vertical-align:top; width:86px; height:27px; overflow:hidden; border:0px solid #f00; font-size:14px; line-height:16px; margin-top:3px;">Metal Slug</div>
<div class="clearer"></div>
</div>
</div>
<div class="styleresult notranslate"
onclick="LoadStyleSettings("jpeg","jpeg","CRAFTED","https://static1.textcraft.net/styles/c/r/crafted/jpeg","399","https://static1.textcraft.net/styles/c/r/crafted/jpeg.png","https://static1.textcraft.net/styles/c/r/crafted/jpeg-thumb.png","https://static1.textcraft.net/styles/c/r/crafted/jpeg-icon.png","https://static1.textcraft.net/styles/c/r/crafted/jpeg-yourtext.png?v=1")">
<div style="height:60px"><img src="https://static1.textcraft.net/styles/c/r/crafted/jpeg-thumb.png"></div>
<div class="clearer"></div>
<div class="stylestats-basic" id="stylestats-4">
<div id="loadedstyle-4" style="vertical-align:top; width:86px; height:27px; overflow:hidden; border:0px solid #f00; font-size:14px; line-height:16px; margin-top:3px;">jpeg</div>
<div class="clearer"></div>
</div>
</div>
<div class="styleresult notranslate"
onclick="LoadStyleSettings("GTA5","gta5","zqueenofrandom","https://static1.textcraft.net/styles/z/q/zqueenofrandom/gta5","364","https://static1.textcraft.net/styles/z/q/zqueenofrandom/gta5.png","https://static1.textcraft.net/styles/z/q/zqueenofrandom/gta5-thumb.png","https://static1.textcraft.net/styles/z/q/zqueenofrandom/gta5-icon.png","https://static1.textcraft.net/styles/z/q/zqueenofrandom/gta5-yourtext.png?v=1")">
<div style="height:60px"><img src="https://static1.textcraft.net/styles/z/q/zqueenofrandom/gta5-thumb.png"></div>
<div class="clearer"></div>
<div class="stylestats-basic" id="stylestats-5">
<div id="loadedstyle-5" style="vertical-align:top; width:86px; height:27px; overflow:hidden; border:0px solid #f00; font-size:14px; line-height:16px; margin-top:3px;">GTA5</div>
<div class="clearer"></div>
</div>
</div>
<div class="styleresult notranslate"
onclick="LoadStyleSettings("pixel%20art","pixel-art","snegos","https://static1.textcraft.net/styles/s/n/snegos/pixel-art","359","https://static1.textcraft.net/styles/s/n/snegos/pixel-art.png","https://static1.textcraft.net/styles/s/n/snegos/pixel-art-thumb.png","https://static1.textcraft.net/styles/s/n/snegos/pixel-art-icon.png","https://static1.textcraft.net/styles/s/n/snegos/pixel-art-yourtext.png?v=1")">
<div style="height:60px"><img src="https://static1.textcraft.net/styles/s/n/snegos/pixel-art-thumb.png"></div>
<div class="clearer"></div>
<div class="stylestats-basic" id="stylestats-6">
<div id="loadedstyle-6" style="vertical-align:top; width:86px; height:27px; overflow:hidden; border:0px solid #f00; font-size:14px; line-height:16px; margin-top:3px;">pixel art</div>
<div class="clearer"></div>
</div>
</div>
<div class="styleresult notranslate"
onclick="LoadStyleSettings("lava%20text","lava-text","looooooool","https://static1.textcraft.net/styles/l/o/looooooool/lava-text","329","https://static1.textcraft.net/styles/l/o/looooooool/lava-text.png","https://static1.textcraft.net/styles/l/o/looooooool/lava-text-thumb.png","https://static1.textcraft.net/styles/l/o/looooooool/lava-text-icon.png","https://static1.textcraft.net/styles/l/o/looooooool/lava-text-yourtext.png?v=1")">
<div style="height:60px"><img src="https://static1.textcraft.net/styles/l/o/looooooool/lava-text-thumb.png"></div>
<div class="clearer"></div>
<div class="stylestats-basic" id="stylestats-7">
<div id="loadedstyle-7" style="vertical-align:top; width:86px; height:27px; overflow:hidden; border:0px solid #f00; font-size:14px; line-height:16px; margin-top:3px;">lava text</div>
<div class="clearer"></div>
</div>
</div>
<div class="styleresult notranslate"
onclick="LoadStyleSettings("Herobrine","herobrine","snegos","https://static1.textcraft.net/styles/s/n/snegos/herobrine","325","https://static1.textcraft.net/styles/s/n/snegos/herobrine.png","https://static1.textcraft.net/styles/s/n/snegos/herobrine-thumb.png","https://static1.textcraft.net/styles/s/n/snegos/herobrine-icon.png","https://static1.textcraft.net/styles/s/n/snegos/herobrine-yourtext.png?v=1")">
<div style="height:60px"><img src="https://static1.textcraft.net/styles/s/n/snegos/herobrine-thumb.png"></div>
<div class="clearer"></div>
<div class="stylestats-basic" id="stylestats-8">
<div id="loadedstyle-8" style="vertical-align:top; width:86px; height:27px; overflow:hidden; border:0px solid #f00; font-size:14px; line-height:16px; margin-top:3px;">Herobrine</div>
<div class="clearer"></div>
</div>
</div>
</div>
<!--
<div id='featured-style-text'>new<br>featured<br>styles</div>
-->
<div id="featured-style-text">other<br>popular<br>styles</div>
</div> <!-- end leaderboard-mid div -->
<div class="clearer"> </div>
<!--
<div class='clearer' style="height:13px"> </div>
<div style="width:179px; border:0px solid #fff; height:80px; margin-left:23px; margin-top:5px; float:left; font-size:11px;
color:#777;">
Advertisements
<div class='clearer' style="height:6px;"> </div>
<a href="https://www.projectwonderful.com/advertisehere.php?id=70024&type=5&tag=33544" id="advertise-here"
style="font-size:13px; color:#aaa;" target="_blank">Advertise your Minecraft server on Textcraft!<br><span style="color:#a79; margin-top:3px;
display:block; ">Click here for details</span></a>
</div>
<div style="width:728px; height:90px; float:left; border:0px solid #0ff; margin:0 0 0 15px; opacity:.9;">
-->
<!--
</div>
</div>
-->
<div class="clearer"> </div>
<style>
#leaderboard-mid2 {
width: 967px;
width: 959px;
height: auto;
margin: 7px 0 0 5px;
border: 4px solid rgba(60, 60, 60, 0.7);
border: 4px solid rgba(60, 60, 60, 1);
border-radius: 20px;
background: none;
background-color: rgba(44, 44, 44, 1);
}
</style>
<div id="leaderboard-mid2">
<div class="clearer" style="height:1px"></div>
<!--
<div style="width:728px; margin-top:5px; margin-left:11px; padding:2px 10px 8px 12px; border:0px solid #fff">
-->
<div style="width:959px; margin-top:5px; margin-left:11px; padding:2px 10px 8px 12px; border:0px solid #fff">
<!-- textcraft-leaderboard2 -->
<ins class="adsbygoogle" style="display:inline-block; width: 920px; height:120px;" data-ad-client="ca-pub-8959601970688211" data-ad-slot="2561349050">
</ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
<div class="clearer" style="height:1px"></div>
</div>
<div class="clearer"> </div>
<div id="howto" style="margin:0 0 0 5px; text-align:right;">
<div id="howto-top"></div>
<div class="clearer"></div>
<div id="howto-mid"> <!-- weird hack -->
<div id="howto-mid-inner">
<div id="your-loc">
<div style="float:left; margin-left:10px; margin-top:5px; margin-bottom:5px;"><img src="https://static1.textcraft.net/img/info-small2a.png"></div>
<div style="float:left; margin-left:15px; margin-top:4px; margin-right:10px; color:#ccc; font-size:11px; line-height:13px; width:200px; text-align:left;">Your location: <span style="color:#a8d">DE</span>
<div class="clearer" style="border-bottom:1px dotted #777"></div><span style="color:#858585;">You can write using German characters with the 'Designosaur' font.<br><br></span>
</div>
</div>
<div class="clearer"> </div>
<div id="howto-welcome">
<div style="font-size:1.9em;color:#ccc;text-shadow:0.05em 0.05em 0.05em #606060;">Welcome to Textcraft</div>
</div>
<div class="clearer" style="height:5px;"> </div>
<div style="width:510px; font-size:12px; line-height:16px; color:#aaa; margin:5px 20px 0 0; float:right;"> Design your own logo or text for your website, blog, YouTube videos, screenshots, forum sig., artwork, Minecraft server, wallpaper,
computer games etc. <span style="color:#777;"> Textcraft is a free online text and logo maker, and is also compatible with iPad and Android tablets.</span>
<br> See the guide below and also the <a href="/faq.php" style="color:#769; text-decoration:none;" onmouseover="this.style.textDecoration="underline";" onmouseout="this.style.textDecoration="none";">faq</a> for more
details. <br>
<br>
<span style="color:#cc7">New!</span> <span style="color:#888; font-size:10px">v2.1</span> Added Pokémon and GTA fonts, some bugfixes (see
<a href="/about.php" style="color:#769; text-decoration:none;" onmouseover="this.style.textDecoration="underline";" onmouseout="this.style.textDecoration="none";">about</a> page for details). <br>
<span style="color:#888; font-size:10px">v2.0</span> More fonts, textures, and Textcraft Pro option for extra large font sizes. <br>
<span style="color:#888; font-size:10px">v1.1</span> Added Chinese, Japanese, Korean, Hindi, Arabic, Greek and Cyrillic fonts. <!--
See the FAQ page for
more information.
We have used some resources
kindly made available by others, please see the credits section below for details. If you like this site, please consider mentioning or
linking back to us. Thank you!
(We'll be adding more fonts based on your feedback).-->
</div>
<div class="clearer"> </div>
<!--
<div class='clearer' style="border-top:1px dashed #555"> </div>
-->
<div id="howto-block">
<!--
<span id="toggle_all" style="position:absolute; bottom:5px; right:10px;"></span>
-->
<span id="toggle_all" style="position:absolute; bottom:5px; right:12px;"><span class="toggle-all notranslate">Show all text</span></span>
<div id="howto1">
<div id="howto-icon"></div>
<div id="howto-textheading">Enter your text</div>
<div class="clearright"> </div>
<div id="howto-text" class="toggle"> Type your text into the box shown as <span class="notranslate">"Your text here"</span>. You can have a single line of text, or up to 3 lines. Press "Create" to create your graphic using the current
settings. When you're happy with the result, click on <span class="notranslate">"Download"</span> to download the file. <div class="toggle-text" style="display: none;">
<div class="howto-clearer2"></div> Use the <span class="notranslate">"host"</span> button to upload the image to Imgur, or you can also click on <span class="notranslate">"View"</span> while you're designing your text to see how it
looks like against different types of backgrounds.
</div>
<span class="toggle-control-show notranslate">(more.. )</span>
</div>
<div class="howto-clearer"></div>
<div id="howto-icon" style="background-position:-64px 0px;"></div>
<div id="howto-textheading">Text & Border Size</div>
<div class="clearright"> </div>
<div id="howto-text" class="toggle"> Use the text size buttons to change the size of each line of text. You can change the size of each line by first clicking on the text box for that line, and then using the size buttons. <span
class="howto-clearer2" style="display:block;"></span> Change the size of the border around the text by using the border size buttons. <div class="toggle-text" style="display: none;">
<div class="howto-clearer2"></div> You can also change the colour of the border by clicking on the colour swatch here. Whenever you change the font size or border size of the text, the image will automatically update.
</div>
<span class="toggle-control-show notranslate">(more.. )</span>
</div>
<div class="howto-clearer"></div>
<div id="howto-icon" style="background-position:-128px 0px;"></div>
<div id="howto-textheading">Text Styles</div>
<div class="clearright"> </div>
<div id="howto-text" class="toggle"> You can choose a different colour and font style for each line of text. Select a font by clicking on the font name, eg. "Square". The available colour and texture styles for that font will appear.
<span class="howto-clearer2" style="display:block;"></span> Scroll through the styles by using the right and left arrows. <span class="howto-clearer2" style="display:block;"></span> Select a style by clicking on it, and press the
"Create" button to update your text using your new selection. <span class="howto-clearer2" style="display:block;"></span>
<span class="howto-item">Hint: </span> Styles for each font are a combination of textures and solid colours. Click on the right or left arrows to get to the page with solid colours. <div class="toggle-text" style="display: none;">
<div class="howto-clearer2"></div> You can have different font styles and colours for each line of text - see details for the "Multiline" option.
</div>
<span class="toggle-control-show notranslate">(more.. )</span>
</div>
<div class="howto-clearer"></div>
<div id="howto-icon" style="background-position:-192px 0px;"></div>
<div id="howto-textheading">Settings</div>
<div class="clearright"> </div>
<div id="howto-text" class="toggle"> Textcraft lets you apply some special settings to add some wow to your text. Click the "Create" button after changing these settings to update your text.<span class="howto-clearer2"
style="display:block;"></span>
<span class="howto-item">drop shadow: </span>The drop shadow option creates a darker shadow underneath your text. This can really help add depth to your text. <span class="howto-clearer2" style="display:block;"></span>
<span class="howto-item">3d style: </span>This option will change the perspective of the text to look as if it's receding into the distance. It's not the same as a full 3d render, but can look good for Minecraft and some other styles
of text. <span class="howto-clearer2" style="display:block;"></span>
<span class="howto-item notranslate">glow: </span>Two different glow options are available: <span class="howto-clearer2" style="display:block;"></span>
<span style="float:left;"><img src="https://static1.textcraft.net/img/small-glow-icon.png"></span>
<span style="float:left; margin:2px 0 0 7px; color:#bbb">Localized Glow</span>
<span class="howto-clearer" style="display:block; height:0px;"></span>
<span style="margin-left:28px; display:block;"> This creates an unusual glow that takes it's colour from the nearby edges of your text. This can look great with some styles such as lava, but may need some experimenting with. </span>
<span class="howto-clearer2" style="display:block;"></span>
<span style="float:left; margin-left:-6px;"><img src="https://static1.textcraft.net/img/small-paint-icon.png"></span>
<span style="float:left; margin:3px 0 0 0px; color:#bbb">Coloured Glow</span>
<span class="howto-clearer" style="display:block; height:0px;"></span>
<span style="margin-left:29px; display:block;"> This is a glow using a specified colour. Select the colour you want to use with the swatch to the right. <span class="howto-clearer2" style="display:block;"></span> Note that very dark
colours won't work here since the colour selected is an "addition" to the overall glow, so you may need to use a strong colour with this option. </span>
<span class="howto-clearer2" style="display:block; height:10px;"></span> Note: Glow will usually only apply to the first line of text - see the multi-line option for more details. <div class="toggle-text" style="display: none;">
<span class="howto-clearer2" style="display:block;"></span>
<span class="howto-item">fit lines to max width: </span>This is a useful setting if you need your text to be created at a specific width, for example to fit as a logo on a page. This setting will ensure that the longest line of text
is no bigger than the width you specify. Click to enable this option, then use the slider beside it to select your maximum width. A ruler will appear underneath your text as a guide to the selected width. <span
class="howto-clearer2" style="display:block;"></span>
<span class="howto-item">24-bit colour images: </span>Specifies whether to create the image with 24-bit colour. Leave it turned off for smaller, optimized file sizes, or enable it for higher colour fidelity in large images.
</div>
<span class="toggle-control-show notranslate">(more.. )</span>
</div>
<div class="clearer"> </div>
</div>
<div id="howto2">
<div id="howto-icon" style="background-position:-256px 0px;"></div>
<div id="howto-textheading">Minecraft style text</div>
<div class="clearright"> </div>
<div id="howto-text"> Use the Minecrafter and Minecraftia fonts for classical Minecraft style text, or use one of the existing text styles such as "Minescript" or "Achievement Get". <span class="howto-clearer2"
style="display:block;"></span> Hint: You can get the Creeper face using the Minecrafter font by entering an upper-case "A". </div>
<div class="howto-clearer"></div>
<div id="howto-icon" style="background-position:-320px 0px;"></div>
<div id="howto-textheading">Other text styles</div>
<div class="clearright"> </div>
<div id="howto-text"> Textcraft has a built-in style database which you can search or add to with your own style settings. <span class="howto-clearer2" style="display:block;"></span> The most popular styles for this month are displayed
initially, or you can view the newest or top 200 styles in addition to searching by style name or submitter name. Click on the sample "Tt" text icon to load that specific style. <span class="howto-clearer2"
style="display:block;"></span>
<a href="/signup.php" style="color:#769; text-decoration:none;" onmouseover="this.style.textDecoration="underline";" onmouseout="this.style.textDecoration="none";">Signup</a> for a free account to save new styles
you create. <div class="howto-clearer"></div> After logging in, you have the option of saving new styles by using the "Save style" dialog box. <span class="howto-clearer2" style="display:block;"></span> Enter a stylename of your
choice, then click the Save button. The style will be saved to your profile, so you can access it later. You can currently save up to 50 styles, but there is no limit on the amount of text you can create using these styles. <span
class="howto-clearer2" style="display:block;"></span> You can also share the URL of your profile page to show your creations to others, or use it as a group page.
</div>
<div class="howto-clearer"></div>
<div id="howto-icon" style="background-position:-384px 0px;"></div>
<div id="howto-textheading">Multi-line option</div>
<div class="clearright"> </div>
<div id="howto-text" class="toggle"> This buttons controls whether "multi-line" mode is enabled or not. The default is switched on for multi-line mode. This means that you can have different styles of text on each line 1 to 3. <span
class="howto-clearer2" style="display:block;"></span> Click on the text input box for each line to indicate that you want to change settings for that line. The styles box to the left will update with the current style for that
particular line. You can change the text style and size settings individually for each line. <div class="toggle-text" style="display: none;">
<div class="howto-clearer2"></div> Multi-line mode off - Click the multi-line button to switch it off. Now any style settings you select will apply the same to each line of text, so for example, each line will have the same font
size, font style, border size and colour etc. Also each line will have glow, if glow was selected. When multi-line mode is switched on, for stylistic reasons, only the first line may have a glow effect.
</div>
<span class="toggle-control-show notranslate">(more.. )</span>
</div>
<div class="howto-clearer"></div>
<div id="howto-icon" style="background-position:-448px 0px;"></div>
<div id="howto-textheading">Hints & Tips</div>
<div class="clearright"> </div>
<div id="howto-text" class="toggle">
<span class="howto-item">* </span>Keep transparency details by saving the file instead of copying and pasting - each image created on Textcraft contains a .PNG alpha channel which means it will smoothly blend into any other graphic,
as long as you save the file directly from Textcraft (either using the <span class="notranslate">"Download"</span> button or right-click and "Save as.." in your web browser). <span class="howto-clearer2" style="display:block;"></span>
<span class="howto-item">* </span>Not happy with the available sizes of text, or need to slightly tweak the font size? <span class="howto-clearer2" style="display:block;"></span> First select a large text size, then use the "fit to
max. width" option to reduce the generated text size down to the right size. <span class="howto-clearer2" style="display:block;"></span>
<span class="howto-item">* </span>Need hex colours? - you can specify the exact colour you want for borders and glow by editing the hex value displayed in the colour swatch popup. <div class="toggle-text" style="display: none;">
<div class="howto-clearer2"></div>
<span class="howto-item">* </span>Use 24-bit colour images for hi-fidelity work and extra software compatibility - usually having the 24-bit colour option off is better for web optimized images, however you might want to use the
24-bit option for large images with dropshadows or if you're using older graphics applications which don't fully support 8-bit PNG files with transparency (eg. old versions of Paint Shop Pro and Photoshop).
</div>
<span class="toggle-control-show notranslate">(more.. )</span>
</div>
<span class="howto-clearer2" style="display:block;"></span>
<br>
</div>
<div class="clearer" style="height:15px;"></div>
</div> <!-- end howto-block -->
<div class="clearer"></div>
<div id="attribution-new">
<div class="clearer" style="height:10px;"> </div>
<div style="float:left; width:20px; border:0px solid;"> </div>
<div style="float:left;">
<div style="float:left">
<div id="attrib-heading"> Font list </div>
<div id="attrib-block2" style="margin-top:1px;">
<div id="fontcredit-list" class="notranslate"> Minecraft, 8-bit and blocky fonts: <div id="fontcredit-listitem"> Minecrafter v3, Zephyrean, Stonecraft, Square, ArcadePix, Minecraftia, Blocked, Umbrage, White Rabbit, Karmatic Arcade,
Gputeks</div>
</div>
<div id="fontcredit-list" class="notranslate"> Unicode fonts: <div id="fontcredit-listitem"> Japanese, Chinese (Simplified), Korean, Arabic, Hindi, Greek, Cyrillic, Hebrew, Chinese (Traditional)</div>
</div>
<div id="fontcredit-list" class="notranslate"> Misc fonts: <div id="fontcredit-listitem"> Designosaur, Flipbash, League Gothic, Augustus, Metro, Telegrafico, ChunkFive, Helsinki, Minstrel, Osaka, Pacifico, Pokémon, Swagger, Pokémin,
Aero, Pricedown</div>
</div>
</div> <!-- end attrib-block div -->
<!--
<div class='clearer'> </div>
<div id="fontdl">
See the <a href="/download-fonts.php" target="_blank">font download page</a> for full credits<br> and download links</div>
-->
</div> <!-- end float left div -->
</div> <!-- end outer float left div -->
<div style="float:left;">
<div style="float:left; margin-left:35px;">
<div id="attrib-heading"> Image credits </div>
<div id="attrib-block" style="width:280px; border:0px solid #f00;">
<div id="fontcredit-font" style="width:140px; border:0px solid #f00"> Background pic No.12: </div>
<div id="fontcredit-source" class="notranslate" style="width:140px;">
<span style="color:#779">rayced</span><br>
</div>
<div class="clearer"> </div>
<div id="fontcredit-font" style="width:140px; border:0px solid #f00; margin-top:1px;"> Textures: </div>
<div id="fontcredit-source" class="notranslate" style="width:140px; margin-top:1px; color:#bbb">
<a href="http://www.spiralgraphics.biz/packs/" target="_blank">Spiral Graphics</a><br>
<a href="https://web.archive.org/web/20210211055809if_/http://www.grsites.com/archive/textures/" target="_blank">GR Sites</a><br>
<a href="https://forum.minetest.net/viewtopic.php?id=16" target="_blank">Cisoun's Texture Pack </a><br> (via <a href="https://www.minetest.net" target="_blank">Minetest</a>)
</div>
</div> <!-- end attrib-block div -->
</div> <!-- end float left div -->
<div style="float:left; margin-left:0px;">
<div id="attrib-heading"> Other credits </div>
<div id="attrib-block" style="width:265px; border:0px solid #f00;">
<div id="fontcredit-font" style="width:50px; border:0px solid #f00; margin-top:1px;"> Misc.: </div>
<div id="fontcredit-source" class="notranslate" style="width:100px; border:0px solid #0f0; margin-top:1px;">
<!--<a href="http://webtreats.mysitemyway.com" target="_blank">Webtreats</a><br>-->
<span style="color:#779">Webtreats</span><br>
<a href="https://icons8.com" target="_blank">icons8</a><br>
<a href="http://www.famfamfam.com" target="_blank">famfamfam</a><br>
<a href="https://dribbble.com/loriskumo" target="_blank">Loris Grillet</a><br>
<a href="https://www.minecraftforum.net/topic/892789-minecrafter-3-font-simply-easy/" target="_blank">MadPixel</a><br>
</div>
<div id="fontcredit-source" class="notranslate" style="width:100px; border:0px solid #0f0; margin-top:1px;">
<a href="https://minecraftforum.net" target="_blank">Minecraft forum</a><br>
<a href="https://imgur.com" target="_blank">Imgur</a><br>
<a href="https://mojang.com" target="_blank">Mojang</a><br>
<a href="https://dafont.com" target="_blank">dafont</a><br>
</div>
</div> <!-- end attrib-block div -->
</div> <!-- end float left div -->
<div class="clearer" style="height:12px;"></div>
<div id="fontdl2" style="margin-top:10px; margin-left:51px;"> See the <a href="/download-fonts.php" target="_blank">font download page</a> for full credits and font download links </div>
<div class="clearer" style="height:4px;"></div>
<div id="fontdl2" style="margin-top:10px; margin-left:96px;"> Visit the <a href="https://www.facebook.com/textcraft.net/">
Textcraft Facebook page</a> for news & updates <a href="https://www.facebook.com/textcraft.net/">
<img src="https://static1.textcraft.net/img/square-facebook-40.png" style="vertical-align:middle; margin-left:10px;">
</a>
<!--
<div style="width:468px; height:60px; margin:13px 0 0px 35px; border:0px solid #fff;">
</div>
-->
</div>
</div> <!-- end outer float left div -->
<div class="clearer" style="height:10px; border-bottom:1px dashed #444"> </div>
<div id="lower-badges">
<div style="float:left; margin-top:17px; margin-top:4px;">
<div style="float:left;">
<a href="/faq.php#touchscreen">
<img src="https://static1.textcraft.net/img/pixel-android-small.png">
<img src="https://static1.textcraft.net/img/tablet-icon-small2.png" style="margin:0px 0 0 2px">
</a>
</div>
<div id="debug-android" style="float:left; margin-left:10px; vertical-align:middle; margin-top:5px; font-size:14px;">
<a href="/faq.php#touchscreen">
Android/iPad and touchscreen compatible
</a>
</div>
</div> <!-- end float -->
<div style="float:left; margin-top:17px; margin-top:4px; margin-left:175px;">
<div id="debug-android" style="float:left; margin-left:10px; vertical-align:middle; margin-top:5px; font-size:14px;">
<a href="https://glowtxt.com">
Check out our Glowtxt text generator:
</a>
</div>
<div style="float:left; margin-top:-2px;">
<a href="https://glowtxt.com" target="_blank">
<img src="https://static1.glowtxt.com/img/glowtxt-small.png">
</a>
</div>
</div> <!-- end float -->
</div> <!-- end float left div -->
<div class="clearer"> </div>
</div><!-- end attribution div -->
</div> <!-- end howto-mid-inner -->
<div class="clearer"></div>
</div> <!-- end howto-mid -->
</div> <!-- end howto div -->
<div class="clearer"></div>
<div id="howto-footer" style="margin-left:5px;"></div>
<style>
#cc-main {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-webkit-text-size-adjust: 100%;
background: transparent;
color: var(--cc-primary-color);
font-family: var(--cc-font-family);
font-size: 16px;
font-weight: 400;
line-height: 1.15;
position: relative;
text-rendering: optimizeLegibility
}
#cc-main :after,
#cc-main :before,
#cc-main a,
#cc-main button,
#cc-main div,
#cc-main input,
#cc-main span {
all: unset;
box-sizing: border-box
}
#cc-main a,
#cc-main button,
#cc-main input {
-webkit-appearance: none;
appearance: none;
cursor: pointer;
font-family: inherit;
font-size: 100%;
line-height: normal;
margin: 0;
outline: revert;
outline-offset: 2px;
overflow: hidden
}
#cc-main table,
#cc-main tbody,
#cc-main td,
#cc-main th,
#cc-main thead,
#cc-main tr {
all: revert;
color: inherit;
font-family: inherit;
font-size: inherit;
font-weight: inherit
}
:root {
--cc-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
--cc-modal-border-radius: .6em;
--cc-btn-border-radius: .5em;
--cc-modal-transition-duration: .25s;
--cc-btn-gap: 5px;
--cc-link-color: var(--cc-btn-primary-bg);
--cc-modal-margin: 1em;
--cc-bg: #fff;
--cc-primary-color: #2c2f31;
--cc-secondary-color: #5e6266;
--cc-btn-primary-bg: #30363c;
--cc-btn-primary-color: #fff;
--cc-btn-primary-border-color: var(--cc-btn-primary-bg);
--cc-btn-primary-hover-bg: #000;
--cc-btn-primary-hover-color: #fff;
--cc-btn-primary-hover-border-color: var(--cc-btn-primary-hover-bg);
--cc-btn-secondary-bg: #eaeff2;
--cc-btn-secondary-color: var(--cc-primary-color);
--cc-btn-secondary-border-color: var(--cc-btn-secondary-bg);
--cc-btn-secondary-hover-bg: #d4dae0;
--cc-btn-secondary-hover-color: #000;
--cc-btn-secondary-hover-border-color: #d4dae0;
--cc-separator-border-color: #f0f4f7;
--cc-toggle-on-bg: var(--cc-btn-primary-bg);
--cc-toggle-off-bg: #667481;
--cc-toggle-on-knob-bg: #fff;
--cc-toggle-off-knob-bg: var(--cc-toggle-on-knob-bg);
--cc-toggle-enabled-icon-color: var(--cc-bg);
--cc-toggle-disabled-icon-color: var(--cc-bg);
--cc-toggle-readonly-bg: #d5dee2;
--cc-toggle-readonly-knob-bg: #fff;
--cc-toggle-readonly-knob-icon-color: var(--cc-toggle-readonly-bg);
--cc-section-category-border: var(--cc-cookie-category-block-bg);
--cc-cookie-category-block-bg: #f0f4f7;
--cc-cookie-category-block-border: #f0f4f7;
--cc-cookie-category-block-hover-bg: #e9eff4;
--cc-cookie-category-block-hover-border: #e9eff4;
--cc-cookie-category-expanded-block-bg: transparent;
--cc-cookie-category-expanded-block-hover-bg: #dee4e9;
--cc-overlay-bg: rgba(0, 0, 0, .541);
--cc-webkit-scrollbar-bg: var(--cc-section-category-border);
--cc-webkit-scrollbar-hover-bg: var(--cc-btn-primary-hover-bg);
--cc-footer-bg: var(--cc-btn-secondary-bg);
--cc-footer-color: var(--cc-secondary-color);
--cc-footer-border-color: #e4eaed;
--cc-pm-toggle-border-radius: 4em
}
#cc-main.cc--rtl {
direction: rtl
}
#cc-main .cm__title,
#cc-main a,
#cc-main b,
#cc-main em,
#cc-main strong {
font-weight: 600
}
#cc-main .cc__link,
#cc-main a {
background-image: linear-gradient(currentColor, currentColor);
background-position: 0 100%;
background-repeat: no-repeat;
background-size: 0 1px;
color: var(--cc-link-color);
font-weight: 600;
position: relative;
transition: background-size .25s, color .25s ease
}
#cc-main .cc__link:hover,
#cc-main a:hover {
background-size: 100% 1px;
color: var(--cc-primary-color)
}
#cc-main .cm__desc,
#cc-main .pm__body {
overscroll-behavior: auto contain;
scrollbar-width: thin
}
@media screen and (min-width:640px) {
#cc-main ::-webkit-scrollbar,
#cc-main ::-webkit-scrollbar-thumb,
#cc-main ::-webkit-scrollbar-track {
all: revert
}
#cc-main ::-webkit-scrollbar-thumb {
-webkit-background-clip: padding-box;
background-clip: padding-box;
background: var(--cc-toggle-readonly-bg);
border: .25em solid var(--cc-bg);
border-radius: 1em
}
#cc-main ::-webkit-scrollbar-thumb:hover {
background: var(--cc-toggle-off-bg)
}
#cc-main ::-webkit-scrollbar {
background: transparent;
width: 12px
}
}
html.disable--interaction.show--consent,
html.disable--interaction.show--consent body {
height: auto !important;
overflow: hidden !important
}
.cc--darkmode {
--cc-bg: #161a1c;
--cc-primary-color: #ebf3f6;
--cc-secondary-color: #aebbc5;
--cc-btn-primary-bg: #c2d0e0;
--cc-btn-primary-color: var(--cc-bg);
--cc-btn-primary-border-color: var(--cc-btn-primary-bg);
--cc-btn-primary-hover-bg: #98a7b6;
--cc-btn-primary-hover-color: #000;
--cc-btn-primary-hover-border-color: var(--cc-btn-primary-hover-bg);
--cc-btn-secondary-bg: #242c31;
--cc-btn-secondary-color: var(--cc-primary-color);
--cc-btn-secondary-border-color: var(--cc-btn-secondary-bg);
--cc-btn-secondary-hover-bg: #353d43;
--cc-btn-secondary-hover-color: #fff;
--cc-btn-secondary-hover-border-color: var(--cc-btn-secondary-hover-bg);
--cc-separator-border-color: #222a30;
--cc-toggle-on-bg: var(--cc-btn-primary-bg);
--cc-toggle-off-bg: #525f6b;
--cc-toggle-on-knob-bg: var(--cc-btn-primary-color);
--cc-toggle-off-knob-bg: var(--cc-btn-primary-color);
--cc-toggle-enabled-icon-color: var(--cc-btn-primary-color);
--cc-toggle-disabled-icon-color: var(--cc-btn-primary-color);
--cc-toggle-readonly-bg: #343e45;
--cc-toggle-readonly-knob-bg: #5f6b72;
--cc-toggle-readonly-knob-icon-color: var(--cc-toggle-readonly-bg);
--cc-section-category-border: #1e2428;
--cc-cookie-category-block-bg: #1e2428;
--cc-cookie-category-block-border: var(--cc-section-category-border);
--cc-cookie-category-block-hover-bg: #242c31;
--cc-cookie-category-block-hover-border: #232a2f;
--cc-cookie-category-expanded-block-bg: transparent;
--cc-cookie-category-expanded-block-hover-bg: var(--cc-toggle-readonly-bg);
--cc-overlay-bg: rgba(0, 0, 0, .541);
--cc-webkit-scrollbar-bg: var(--cc-section-category-border);
--cc-webkit-scrollbar-hover-bg: var(--cc-btn-primary-hover-bg);
--cc-footer-bg: #0c0e0f;
--cc-footer-color: var(--cc-secondary-color);
--cc-footer-border-color: #060809
}
.cc--darkmode #cc-main {
color-scheme: dark
}
#cc-main .cm {
background: var(--cc-bg);
border-radius: var(--cc-modal-border-radius);
box-shadow: 0 .625em 1.875em rgba(0, 0, 2, .3);
display: flex;
flex-direction: column;
max-width: 24em;
opacity: 0;
overflow: hidden;
position: fixed;
transform: translateY(1.6em);
visibility: hidden;
z-index: 1
}
#cc-main .cm--top {
top: var(--cc-modal-margin)
}
#cc-main .cm--middle {
top: 50%;
transform: translateY(calc(-50% + 1.6em))
}
#cc-main .cm--bottom {
bottom: var(--cc-modal-margin)
}
#cc-main .cm--center {
left: var(--cc-modal-margin);
margin: 0 auto;
right: var(--cc-modal-margin);
width: unset
}
#cc-main .cm--left {
left: var(--cc-modal-margin);
margin-right: var(--cc-modal-margin)
}
#cc-main .cm--right {
margin-left: var(--cc-modal-margin);
right: var(--cc-modal-margin)
}
#cc-main .cm__body {
display: flex;
flex-direction: column;
justify-content: space-between;
position: relative
}
#cc-main .cm__btns,
#cc-main .cm__links,
#cc-main .cm__texts {
padding: 1em 1.3em;
width: unset
}
#cc-main .cm__texts {
display: flex;
flex: 1;
flex-direction: column;
justify-content: center;
padding-bottom: 0
}
#cc-main .cm__title {
font-size: 1.05em
}
#cc-main .cm__title+.cm__desc {
margin-top: 1.1em
}
#cc-main .cm__desc {
color: var(--cc-secondary-color);
font-size: .9em;
line-height: 1.5;
max-height: 40vh;
overflow-x: visible;
overflow-y: auto;
padding-bottom: 1em
}
#cc-main .cm__btns {
border-top: 1px solid var(--cc-separator-border-color);
display: flex;
flex-direction: column;
gap: var(--cc-btn-gap);
justify-content: center
}
#cc-main .cm__btn-group {
display: grid;
gap: var(--cc-btn-gap);
grid-auto-columns: minmax(0, 1fr)
}
#cc-main .cm--bar:not(.cm--inline) .cm__btn-group--uneven,
#cc-main .cm--wide .cm__btn-group--uneven {
display: flex;
flex: 1;
justify-content: space-between
}
#cc-main .cm--bar:not(.cm--inline).cm--flip .cm__btn-group--uneven,
#cc-main .cm--wide.cm--flip .cm__btn-group--uneven {
flex-direction: row-reverse
}
#cc-main .cm__btn {
background: var(--cc-btn-primary-bg);
border: 1px solid var(--cc-btn-primary-border-color);
border-radius: var(--cc-btn-border-radius);
color: var(--cc-btn-primary-color);
font-size: .82em;
font-weight: 600;
min-height: 42px;
padding: .5em 1em;
text-align: center
}
#cc-main .cm__btn:hover {
background: var(--cc-btn-primary-hover-bg);
border-color: var(--cc-btn-primary-hover-border-color);
color: var(--cc-btn-primary-hover-color)
}
#cc-main .cm__btn--secondary {
background: var(--cc-btn-secondary-bg);
border-color: var(--cc-btn-secondary-border-color);
color: var(--cc-btn-secondary-color)
}
#cc-main .cm__btn--secondary:hover {
background: var(--cc-btn-secondary-hover-bg);
border-color: var(--cc-btn-secondary-hover-border-color);
color: var(--cc-btn-secondary-hover-color)
}
#cc-main .cm__btn--close {
border-radius: 0;
border-bottom-left-radius: var(--cc-btn-border-radius);
border-right: none;
border-top: none;
display: none;
font-size: 1em;
height: 42px;
min-width: auto !important;
overflow: hidden;
padding: 0 !important;
position: absolute;
right: 0;
top: 0;
width: 42px
}
#cc-main .cm__btn--close:after,
#cc-main .cm__btn--close:before {
background: var(--cc-btn-primary-color);
content: "";
height: .9em;
left: 0;
margin: 1px auto auto;
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%) rotate(45deg);
transition: all .15s ease;
width: 1.5px
}
#cc-main .cm__btn--close:after {
transform: translateY(-50%) rotate(-45deg)
}
#cc-main .cm__btn--close:hover:after,
#cc-main .cm__btn--close:hover:before {
background: var(--cc-btn-primary-hover-color)
}
#cc-main .cm__btn--close.cm__btn--secondary:after,
#cc-main .cm__btn--close.cm__btn--secondary:before {
background: var(--cc-btn-secondary-color)
}
#cc-main .cm__btn--close.cm__btn--secondary:hover:after,
#cc-main .cm__btn--close.cm__btn--secondary:hover:before {
background: var(--cc-btn-secondary-hover-color)
}
#cc-main .cm__btn--close+.cm__texts .cm__title {
padding-right: 2em
}
#cc-main .cm--inline .cm__btn-group {
grid-auto-flow: column
}
#cc-main .cm__footer {
background: var(--cc-footer-bg);
border-top: 1px solid var(--cc-footer-border-color);
color: var(--cc-footer-color);
padding: .4em 0 .5em
}
#cc-main .cm__links {
display: flex;
flex-direction: row;
padding-bottom: 0;
padding-top: 0
}
#cc-main .cm__link-group {
display: flex;
flex-direction: row;
font-size: .8em;
gap: 1.3em;
width: 100%
}
#cc-main .cm--flip .cm__btn:last-child {
grid-row: 1
}
#cc-main .cm--inline.cm--flip .cm__btn:last-child {
grid-column: 1
}
#cc-main .cm--box .cm__btn--close {
display: block
}
#cc-main .cm--box.cm--flip .cm__btns {
flex-direction: column-reverse
}
#cc-main .cm--box.cm--wide {
max-width: 36em
}
#cc-main .cm--box.cm--wide .cm__btns {
flex-direction: row;
justify-content: space-between
}
#cc-main .cm--box.cm--wide .cm__btn-group {
grid-auto-flow: column
}
#cc-main .cm--box.cm--wide .cm__btn {
min-width: 120px;
padding-left: 1.8em;
padding-right: 1.8em
}
#cc-main .cm--box.cm--wide.cm--flip .cm__btns {
flex-direction: row-reverse
}
#cc-main .cm--box.cm--wide.cm--flip .cm__btn:last-child {
grid-column: 1
}
#cc-main .cm--cloud {
max-width: 54em;
width: unset
}
#cc-main .cm--cloud .cm__body {
flex-direction: row
}
#cc-main .cm--cloud .cm__texts {
flex: 1
}
#cc-main .cm--cloud .cm__desc {
max-height: 9.4em
}
#cc-main .cm--cloud .cm__btns {
border-left: 1px solid var(--cc-separator-border-color);
border-top: none;
max-width: 23em
}
#cc-main .cm--cloud .cm__btn-group {
flex-direction: column
}
#cc-main .cm--cloud .cm__btn {
min-width: 19em
}
#cc-main .cm--cloud.cm--flip .cm__btn-group,
#cc-main .cm--cloud.cm--flip .cm__btns {
flex-direction: column-reverse
}
#cc-main .cm--cloud.cm--inline .cm__btn-group {
flex-direction: row
}
#cc-main .cm--cloud.cm--inline .cm__btn {
min-width: 10em
}
#cc-main .cm--cloud.cm--inline.cm--flip .cm__btn-group {
flex-direction: row-reverse
}
#cc-main .cm--bar {
--cc-modal-transition-duration: .35s;
border-radius: 0;
left: 0;
margin: 0;
max-width: unset;
opacity: 1;
right: 0;
transform: translateY(0);
width: 100vw
}
#cc-main .cm--bar.cm--top {
top: 0;
transform: translateY(-100%)
}
#cc-main .cm--bar.cm--bottom {
bottom: 0;
transform: translateY(100%)
}
#cc-main .cm--bar .cm__body,
#cc-main .cm--bar .cm__links {
margin: 0 auto;
max-width: 55em;
width: 100%
}
#cc-main .cm--bar .cm__body {
padding: .5em 0 .9em
}
#cc-main .cm--bar .cm__btns {
border-top: none;
flex-direction: row;
justify-content: space-between
}
#cc-main .cm--bar .cm__btn-group {
grid-auto-flow: column
}
#cc-main .cm--bar .cm__btn {
min-width: 120px;
padding-left: 2em;
padding-right: 2em
}
#cc-main .cm--bar.cm--flip .cm__btns {
flex-direction: row-reverse
}
#cc-main .cm--bar.cm--flip .cm__btn:last-child {
grid-column: 1
}
#cc-main .cm--bar.cm--inline .cm__body,
#cc-main .cm--bar.cm--inline .cm__links {
max-width: 74em
}
#cc-main .cm--bar.cm--inline .cm__body {
flex-direction: row;
padding: 0
}
#cc-main .cm--bar.cm--inline .cm__btns {
flex-direction: column;
justify-content: center
}
#cc-main .cm--bar.cm--inline.cm--flip .cm__btns {
flex-direction: column-reverse
}
#cc-main .cc--anim .cm,
#cc-main .cc--anim.cm-wrapper:before {
transition: opacity var(--cc-modal-transition-duration) ease, visibility var(--cc-modal-transition-duration) ease, transform var(--cc-modal-transition-duration) ease
}
#cc-main .cc--anim .cm__btn,
#cc-main .cc--anim .cm__close {
transition: background-color .15s ease, border-color .15s ease, color .15s ease
}
.disable--interaction #cc-main .cm-wrapper:before {
background: var(--cc-overlay-bg);
bottom: 0;
content: "";
left: 0;
opacity: 0;
position: fixed;
right: 0;
top: 0;
visibility: hidden;
z-index: 0
}
.show--consent #cc-main .cc--anim .cm {
opacity: 1;
transform: translateY(0);
visibility: visible !important
}
.show--consent #cc-main .cc--anim .cm--middle {
transform: translateY(-50%)
}
.show--consent #cc-main .cc--anim .cm--bar {
transform: translateY(0)
}
.show--consent #cc-main .cc--anim.cm-wrapper:before {
opacity: 1;
visibility: visible
}
#cc-main.cc--rtl .cm__btn--close {
border-bottom-left-radius: unset;
border-bottom-right-radius: var(--cc-btn-border-radius);
left: 0;
right: unset
}
#cc-main.cc--rtl .cm__btn--close+.cm__texts .cm__title {
padding-left: 2em;
padding-right: unset
}
@media screen and (max-width:640px) {
#cc-main {
--cc-modal-margin: .5em
}
#cc-main .cm {
max-width: none !important;
width: auto !important
}
#cc-main .cm__body {
flex-direction: column !important;
padding: 0 !important
}
#cc-main .cm__btns,
#cc-main .cm__links,
#cc-main .cm__texts {
padding-left: 1.1em !important;
padding-right: 1.1em !important
}
#cc-main .cm__btns {
border-left: none !important;
border-top: 1px solid var(--cc-separator-border-color) !important;
max-width: none !important
}
#cc-main .cm__btn-group,
#cc-main .cm__btns {
flex-direction: column !important;
min-width: auto !important
}
#cc-main .cm__btn-group {
display: flex !important
}
#cc-main .cm__btn {
flex: auto !important
}
#cc-main .cm__link-group {
justify-content: center !important
}
#cc-main .cm--flip .cm__btn-group,
#cc-main .cm--flip .cm__btns {
flex-direction: column-reverse !important
}
}
#cc-main .pm-wrapper {
position: relative;
z-index: 2
}
#cc-main .pm {
background: var(--cc-bg);
border-radius: var(--cc-modal-border-radius);
box-shadow: 0 .625em 1.875em rgba(0, 0, 2, .3);
display: flex;
flex-direction: column;
opacity: 0;
overflow: hidden;
position: fixed;
visibility: hidden;
width: 100%;
width: unset;
z-index: 1
}
#cc-main .pm__body,
#cc-main .pm__footer,
#cc-main .pm__header {
padding: 1em 1.5em
}
#cc-main .pm__header {
align-items: center;
border-bottom: 1px solid var(--cc-separator-border-color);
display: flex;
gap: 2em;
justify-content: space-between
}
#cc-main .pm__title {
align-items: center;
display: flex;
flex: 1;
font-weight: 600
}
#cc-main .pm__close-btn {
background: var(--cc-btn-secondary-bg);
border: 1px solid var(--cc-btn-secondary-border-color);
border-radius: var(--cc-btn-border-radius);
height: 40px;
position: relative;
transition: all .15s ease;
width: 40px
}
#cc-main .pm__close-btn:after,
#cc-main .pm__close-btn:before {
background: var(--cc-btn-secondary-color);
content: "";
height: .9em;
left: 0;
margin: auto;
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%) rotate(45deg);
transition: all .15s ease;
width: 1.5px
}
#cc-main .pm__close-btn:after {
transform: translateY(-50%) rotate(-45deg)
}
#cc-main .pm__close-btn:hover {
background: var(--cc-btn-secondary-hover-bg);
border-color: var(--cc-btn-secondary-hover-border-color)
}
#cc-main .pm__close-btn:hover:after,
#cc-main .pm__close-btn:hover:before {
background: var(--cc-btn-secondary-hover-color)
}
#cc-main .pm__body {
flex: 1;
overflow-y: auto;
overflow-y: overlay
}
#cc-main .pm__section,
#cc-main .pm__section--toggle {
border-radius: var(--cc-btn-border-radius);
display: flex;
flex-direction: column;
margin-bottom: .5em
}
#cc-main .pm__section--toggle .pm__section-desc-wrapper {
border: 1px solid var(--cc-cookie-category-block-border);
border-radius: var(--cc-btn-border-radius);
border-top: none;
border-top-left-radius: 0;
border-top-right-radius: 0;
display: none;
margin-top: 0 !important;
overflow: hidden
}
#cc-main .pm__section {
border: 1px solid var(--cc-separator-border-color);
padding: 1em;
transition: background-color .25s ease, border-color .25s ease
}
#cc-main .pm__section:first-child {
border: none;
margin-bottom: 2em;
margin-top: 0;
padding: 0;
transition: none
}
#cc-main .pm__section:not(:first-child):hover {
background: var(--cc-cookie-category-block-bg);
border-color: var(--cc-cookie-category-block-border)
}
#cc-main .pm__section-toggles+.pm__section {
margin-top: 2em
}
#cc-main .pm__section--toggle {
background: var(--cc-cookie-category-block-bg);
border-top: none;
margin-bottom: var(--cc-btn-gap)
}
#cc-main .pm__section--toggle .pm__section-title {
align-items: center;
background: var(--cc-cookie-category-block-bg);
border: 1px solid var(--cc-cookie-category-block-border);
display: flex;
justify-content: space-between;
min-height: 58px;
padding: 1.1em 5.4em 1.1em 1.2em;
position: relative;
transition: background-color .25s ease, border-color .25s ease;
width: 100%
}
#cc-main .pm__section--toggle .pm__section-title:hover {
background: var(--cc-cookie-category-block-hover-bg);
border-color: var(--cc-cookie-category-block-hover-border)
}
#cc-main .pm__section--toggle .pm__section-desc {
margin-top: 0;
padding: 1em
}
#cc-main .pm__section--toggle.is-expanded {
--cc-cookie-category-block-bg: var(--cc-cookie-category-expanded-block-bg);
--cc-cookie-category-block-border: var(--cc-cookie-category-expanded-block-hover-bg)
}
#cc-main .pm__section--toggle.is-expanded .pm__section-title {
border-bottom-left-radius: 0;
border-bottom-right-radius: 0
}
#cc-main .pm__section--toggle.is-expanded .pm__section-arrow:before {
margin-top: 0;
transform: translateY(-20%) rotate(225deg)
}
#cc-main .pm__section--toggle.is-expanded .pm__section-desc-wrapper {
display: flex
}
#cc-main .pm__section--expandable .pm__section-title {
cursor: pointer;
padding-left: 3.4em
}
#cc-main .pm__section--expandable .pm__section-arrow {
background: var(--cc-toggle-readonly-bg);
border-radius: 100%;
display: flex;
height: 20px;
justify-content: center;
left: 18px;
pointer-events: none;
position: absolute;
width: 20px
}
#cc-main .pm__section--expandable .pm__section-arrow:before {
border: solid var(--cc-btn-secondary-color);
border-width: 0 2px 2px 0;
content: "";
margin-top: -1px;
padding: 2px;
position: absolute;
top: 50%;
transform: translateY(-50%) rotate(45deg);
z-index: 1
}
#cc-main .pm__section-title-wrapper {
align-items: center;
display: flex;
position: relative
}
#cc-main .pm__section-title-wrapper+.pm__section-desc-wrapper {
margin-top: .85em
}
#cc-main .pm__section-title {
border-radius: var(--cc-btn-border-radius);
font-size: .95em;
font-weight: 600
}
#cc-main .pm__badge {
align-items: center;
background: var(--cc-btn-secondary-bg);
border-radius: 5em;
color: var(--cc-secondary-color);
display: flex;
flex: none;
font-size: .8em;
font-weight: 600;
height: 23px;
justify-content: center;
margin-left: 1em;
min-width: 23px;
overflow: hidden;
padding: 0 .6em 1px;
position: relative;
text-align: center;
white-space: nowrap;
width: auto
}
#cc-main .pm__service-counter {
background: var(--cc-btn-primary-bg);
color: var(--cc-btn-primary-color);
padding: 0;
width: 23px
}
#cc-main .pm__service-counter[data-counterlabel] {
padding: 0 .6em 1px;
width: auto
}
#cc-main .section__toggle,
#cc-main .section__toggle-wrapper,
#cc-main .toggle__icon,
#cc-main .toggle__label {
border-radius: var(--cc-pm-toggle-border-radius);
height: 23px;
width: 50px
}
#cc-main .section__toggle-wrapper {
cursor: pointer;
position: absolute;
right: 18px;
z-index: 1
}
#cc-main .toggle-service {
height: 19px;
position: relative;
right: 0;
width: 42px
}
#cc-main .toggle-service .section__toggle,
#cc-main .toggle-service .toggle__icon,
#cc-main .toggle-service .toggle__label {
height: 19px;
width: 42px
}
#cc-main .toggle-service .toggle__icon {
position: relative
}
#cc-main .toggle-service .toggle__icon:after {
height: 19px;
width: 19px
}
#cc-main .toggle-service .section__toggle:checked~.toggle__icon:after {
transform: translateX(23px)
}
#cc-main .toggle-service .toggle__icon-off:after,
#cc-main .toggle-service .toggle__icon-off:before {
height: 9px;
margin: .1px 2px 0 auto;
width: 1.7px
}
#cc-main .toggle-service .toggle__icon-on:before {
border-width: 0 1.7px 1.7px 0;
margin: -3.8px auto 0 6px;
padding: 1.3px 1.3px 6px
}
#cc-main .pm__section--toggle:nth-child(2) .section__toggle-wrapper:after {
display: none !important
}
#cc-main .section__toggle {
border: 0;
cursor: pointer;
display: block;
left: 0;
margin: 0;
position: absolute;
top: 0
}
#cc-main .section__toggle:disabled {
cursor: not-allowed
}
#cc-main .toggle__icon {
background: var(--cc-toggle-off-bg);
box-shadow: 0 0 0 1px var(--cc-toggle-off-bg);
display: flex;
flex-direction: row;
pointer-events: none;
position: absolute;
transition: all .25s ease
}
#cc-main .toggle__icon:after {
background: var(--cc-toggle-off-knob-bg);
border: none;
border-radius: 100%;
box-shadow: 0 1px 2px rgba(24, 32, 3, .36);
content: "";
display: block;
height: 23px;
left: 0;
position: absolute;
top: 0;
transition: transform .25s ease, background-color .25s ease;
width: 23px
}
#cc-main .toggle__icon-off,
#cc-main .toggle__icon-on {
align-items: center;
display: flex;
flex: 1;
height: 100%;
justify-content: center;
position: relative;
text-align: center;
transform: translateZ(0);
transition: opacity .15s ease
}
#cc-main .toggle__icon-on {
left: 0;
opacity: 0;
z-index: 1
}
#cc-main .toggle__icon-on:before {
border: solid var(--cc-toggle-on-bg);
border-width: 0 2px 2px 0;
content: "";
display: inline-block;
margin: -4.5px auto 0 7px;
padding: 1.5px 1.5px 7px;
position: absolute;
top: 50%;
transform: rotate(45deg) translate(-50%)
}
#cc-main .toggle__icon-off {
opacity: 1;
z-index: 1
}
#cc-main .toggle__icon-off:after,
#cc-main .toggle__icon-off:before {
background: var(--cc-toggle-off-bg);
content: "";
display: block;
height: .7em;
margin: .5px 2px 0 auto;
position: absolute;
top: 50%;
transform-origin: center;
width: 2px
}
#cc-main .toggle__icon-off:before {
transform: translateY(-50%) rotate(45deg)
}
#cc-main .toggle__icon-off:after {
transform: translateY(-50%) rotate(-45deg)
}
#cc-main .section__toggle:checked~.toggle__icon {
background: var(--cc-toggle-on-bg);
box-shadow: 0 0 0 1px var(--cc-toggle-on-bg)
}
#cc-main .section__toggle:checked~.toggle__icon:after {
background-color: var(--cc-toggle-on-knob-bg);
transform: translateX(27px)
}
#cc-main .section__toggle:checked~.toggle__icon .toggle__icon-on {
opacity: 1
}
#cc-main .section__toggle:checked~.toggle__icon .toggle__icon-off {
opacity: 0
}
#cc-main .section__toggle:checked:disabled~.toggle__icon {
background: var(--cc-toggle-readonly-bg);
box-shadow: 0 0 0 1px var(--cc-toggle-readonly-bg)
}
#cc-main .section__toggle:checked:disabled~.toggle__icon:after {
background: var(--cc-toggle-readonly-knob-bg);
box-shadow: none
}
#cc-main .section__toggle:checked:disabled~.toggle__icon .toggle__icon-off:after,
#cc-main .section__toggle:checked:disabled~.toggle__icon .toggle__icon-off:before,
#cc-main .section__toggle:checked:disabled~.toggle__icon .toggle__icon-on:before {
border-color: var(--cc-toggle-readonly-knob-icon-color)
}
#cc-main .toggle__label {
opacity: 0;
overflow: hidden;
pointer-events: none;
position: absolute;
top: 0;
z-index: -1
}
#cc-main .pm__section-desc-wrapper {
color: var(--cc-secondary-color);
display: flex;
flex-direction: column;
font-size: .9em
}
#cc-main .pm__section-services {
display: flex;
flex-direction: column
}
#cc-main .pm__section-services+div,
#cc-main .pm__section-services+table {
border-top: 1px solid var(--cc-cookie-category-block-border)
}
#cc-main .pm__service {
align-items: center;
display: flex;
gap: 1em;
justify-content: space-between;
padding: .4em 1.2em;
position: relative;
transition: background-color .15s ease
}
#cc-main .pm__service:hover {
background-color: var(--cc-cookie-category-block-hover-bg)
}
#cc-main .pm__service-header {
align-items: center;
display: flex;
width: 100%
}
#cc-main .pm__service-icon {
border: 2px solid;
border-radius: 100%;
height: 8px;
margin-left: 7px;
margin-right: 20px;
margin-top: 1px;
min-width: 8px
}
#cc-main .pm__service-title {
font-size: .95em;
width: 100%;
word-break: break-word
}
#cc-main .pm__section-desc {
line-height: 1.5em
}
#cc-main .pm__section-table {
border-collapse: collapse;
font-size: .9em;
margin: 0;
overflow: hidden;
padding: 0;
text-align: left;
width: 100%
}
#cc-main .pm__table-head>tr {
border-bottom: 1px dashed var(--cc-separator-border-color);
color: var(--cc-primary-color);
font-weight: 600
}
#cc-main .pm__table-tr {
transition: background-color .15s ease
}
#cc-main .pm__table-tr:hover {
background: var(--cc-cookie-category-block-hover-bg)
}
#cc-main .pm__table-td,
#cc-main .pm__table-th {
padding: .625em .625em .625em 1.2em;
vertical-align: top
}
#cc-main .pm__footer {
border-top: 1px solid var(--cc-separator-border-color);
justify-content: space-between
}
#cc-main .pm__btn-group,
#cc-main .pm__footer {
display: flex;
gap: var(--cc-btn-gap)
}
#cc-main .pm__btn {
background: var(--cc-btn-primary-bg);
border: 1px solid var(--cc-btn-primary-border-color);
border-radius: var(--cc-btn-border-radius);
color: var(--cc-btn-primary-color);
flex: auto;
font-size: .82em;
font-weight: 600;
min-height: 42px;
min-width: 110px;
padding: .5em 1.5em;
text-align: center;
transition: background-color .15s ease, border-color .15s ease, color .15s ease
}
#cc-main .pm__btn:hover {
background: var(--cc-btn-primary-hover-bg);
border-color: var(--cc-btn-primary-hover-border-color);
color: var(--cc-btn-primary-hover-color)
}
#cc-main .pm__btn--secondary {
background: var(--cc-btn-secondary-bg);
border-color: var(--cc-btn-secondary-border-color);
color: var(--cc-btn-secondary-color)
}
#cc-main .pm__btn--secondary:hover {
background: var(--cc-btn-secondary-hover-bg);
border-color: var(--cc-btn-secondary-hover-border-color);
color: var(--cc-btn-secondary-hover-color)
}
#cc-main .pm--box {
height: calc(100% - 2em);
left: var(--cc-modal-margin);
margin: 0 auto;
max-height: 37.5em;
max-width: 43em;
right: var(--cc-modal-margin);
top: 50%;
transform: translateY(calc(-50% + 1.6em))
}
#cc-main .pm--box.pm--flip .pm__btn-group,
#cc-main .pm--box.pm--flip .pm__footer {
flex-direction: row-reverse
}
#cc-main .pm--bar {
--cc-modal-transition-duration: .35s;
border-radius: 0;
bottom: 0;
height: 100%;
margin: 0;
max-height: none;
max-width: 29em;
opacity: 1;
top: 0
}
#cc-main .pm--bar .pm__section-table,
#cc-main .pm--bar .pm__table-body,
#cc-main .pm--bar .pm__table-td,
#cc-main .pm--bar .pm__table-th,
#cc-main .pm--bar .pm__table-tr {
display: block
}
#cc-main .pm--bar .pm__table-head {
display: none
}
#cc-main .pm--bar .pm__table-tr:not(:last-child) {
border-bottom: 1px solid var(--cc-separator-border-color)
}
#cc-main .pm--bar .pm__table-td {
display: flex;
justify-content: space-between
}
#cc-main .pm--bar .pm__table-td:before {
color: var(--cc-primary-color);
content: attr(data-column);
flex: 1;
font-weight: 600;
min-width: 100px;
overflow: hidden;
padding-right: 2em;
text-overflow: ellipsis
}
#cc-main .pm--bar .pm__table-td>div {
flex: 3
}
#cc-main .pm--bar:not(.pm--wide) .pm__body,
#cc-main .pm--bar:not(.pm--wide) .pm__footer,
#cc-main .pm--bar:not(.pm--wide) .pm__header {
padding: 1em 1.3em
}
#cc-main .pm--bar:not(.pm--wide) .pm__btn-group,
#cc-main .pm--bar:not(.pm--wide) .pm__footer {
flex-direction: column
}
#cc-main .pm--bar:not(.pm--wide).pm--flip .pm__btn-group,
#cc-main .pm--bar:not(.pm--wide).pm--flip .pm__footer {
flex-direction: column-reverse
}
#cc-main .pm--bar:not(.pm--wide) .pm__badge {
display: none
}
#cc-main .pm--bar.pm--left {
left: 0;
transform: translateX(-100%)
}
#cc-main .pm--bar.pm--right {
right: 0;
transform: translateX(100%)
}
#cc-main .pm--bar.pm--wide {
max-width: 35em
}
#cc-main .pm--bar.pm--wide .pm__body,
#cc-main .pm--bar.pm--wide .pm__footer,
#cc-main .pm--bar.pm--wide .pm__header {
padding: 1em 1.65em
}
#cc-main .pm--bar.pm--wide.pm--flip .pm__btn-group,
#cc-main .pm--bar.pm--wide.pm--flip .pm__footer {
flex-direction: row-reverse
}
#cc-main .pm-wrapper:before {
background: var(--cc-overlay-bg);
bottom: 0;
content: "";
left: 0;
opacity: 0;
position: fixed;
right: 0;
top: 0;
visibility: hidden;
z-index: 1
}
#cc-main .cc--anim .pm,
#cc-main .cc--anim.pm-wrapper:before {
transition: opacity var(--cc-modal-transition-duration) ease, visibility var(--cc-modal-transition-duration) ease, transform var(--cc-modal-transition-duration) ease
}
.show--preferences #cc-main .cc--anim .pm {
opacity: 1;
visibility: visible !important
}
.show--preferences #cc-main .cc--anim .pm--box {
transform: translateY(-50%)
}
.show--preferences #cc-main .cc--anim .pm--bar {
transform: translateX(0)
}
.show--preferences #cc-main .cc--anim.pm-wrapper:before {
opacity: 1;
visibility: visible
}
#cc-main.cc--rtl .pm__section-arrow {
left: unset;
right: 18px
}
#cc-main.cc--rtl .section__toggle-wrapper {
left: 18px;
right: unset;
transform-origin: left
}
#cc-main.cc--rtl .toggle-service {
left: 0
}
#cc-main.cc--rtl .pm__service-icon {
margin-left: 20px;
margin-right: 5px
}
#cc-main.cc--rtl .pm__section--toggle .pm__section-title {
padding-left: 5.4em;
padding-right: 1.2em
}
#cc-main.cc--rtl .pm__section--expandable .pm__section-title {
padding-right: 3.4em
}
#cc-main.cc--rtl .pm__badge {
margin-left: unset;
margin-right: 1em
}
#cc-main.cc--rtl .toggle__icon:after {
transform: translateX(27px)
}
#cc-main.cc--rtl .toggle-service .toggle__icon:after {
transform: translateX(23px)
}
#cc-main.cc--rtl .section__toggle:checked~.toggle__icon:after {
transform: translateX(0)
}
#cc-main.cc--rtl .toggle__icon-off:after,
#cc-main.cc--rtl .toggle__icon-off:before,
#cc-main.cc--rtl .toggle__icon-on:before {
margin-left: 2px;
margin-right: unset
}
#cc-main.cc--rtl .pm__table-td,
#cc-main.cc--rtl .pm__table-th {
text-align: right
}
#cc-main.cc--rtl .pm__table-td {
padding-left: unset;
padding-right: 1.2em
}
#cc-main.cc--rtl .pm__table-td:before {
padding-left: 2em;
padding-right: unset
}
@media screen and (max-width:640px) {
#cc-main .pm {
border-radius: 0;
bottom: 0;
height: auto;
left: 0;
max-height: 100%;
max-width: none !important;
right: 0;
top: 0;
transform: translateY(1.6em)
}
#cc-main .pm__body,
#cc-main .pm__footer,
#cc-main .pm__header {
padding: .9em !important
}
#cc-main .pm__badge {
display: none
}
#cc-main .pm__section-table,
#cc-main .pm__table-body,
#cc-main .pm__table-td,
#cc-main .pm__table-th,
#cc-main .pm__table-tr {
display: block
}
#cc-main .pm__table-head {
display: none
}
#cc-main .pm__table-tr:not(:last-child) {
border-bottom: 1px solid var(--cc-separator-border-color)
}
#cc-main .pm__table-td {
display: flex;
justify-content: space-between
}
#cc-main .pm__table-td:before {
color: var(--cc-primary-color);
content: attr(data-column);
flex: 1;
font-weight: 600;
min-width: 100px;
overflow: hidden;
padding-right: 2em;
text-overflow: ellipsis
}
#cc-main .pm__table-td>div {
flex: 3
}
#cc-main .pm__btn-group,
#cc-main .pm__footer {
flex-direction: column !important
}
#cc-main .pm__btn-group {
display: flex !important
}
#cc-main .pm--flip .pm__btn-group,
#cc-main .pm--flip .pm__footer {
flex-direction: column-reverse !important
}
.show--preferences #cc-main .cc--anim .pm {
transform: translateY(0) !important
}
}
/* Font / colour scheme */
:root {
--cc-font-family: 'Roboto', sans-serif;
/*
--cc-btn-primary-bg:#eaeff2;
--cc-btn-primary-hover-bg:#d4dae0;
--cc-btn-secondary-bg:#0074cc;
--cc-btn-secondary-hover-bg:#0063bf;
*/
--cc-btn-primary-bg: #0074cc;
--cc-btn-primary-hover-bg: #0063bf;
--cc-btn-secondary-bg: #eaeff2;
--cc-btn-secondary-hover-bg: #d4dae0;
--cc-btn-reject-bg: #e2f3ff;
--cc-btn-reject-bg: #cae9ff;
--cc-btn-reject-border: #3f8bc5;
--cc-btn-reject-hover-bg: #0063bf;
--cc-btn-gap: 7px;
--cc-toggle-readonly-bg: #c4ccd0;
--cc-toggle-on-bg: #5eba7d;
--cc-cancel-color: #0074cc;
}
#cc-main {
text-align: center;
}
#cc-main p {
line-height: 1.5em;
margin-bottom: 10px;
color: var(--cc-secondary-color);
}
#cc-main .pm__section-title {
text-align: left;
}
#cc-main .pm__section:first-child {
margin-bottom: 1.5em;
}
#cc-main .pm__section-desc-wrapper {
font-size: 0.82em;
}
#cc-main .pm__section-desc {
text-align: left;
padding: 0 1.5em 0 0;
}
/* Stronger box shadow */
#cc-main .cm {
box-shadow: 0px 2px 10px 0px rgb(20 20 20 / 80%);
box-shadow: 0px 4px 16px 0px rgb(20 20 20 / 75%);
}
/* Larger button height on desktop */
#cc-main .cm__btn {
font-size: 0.9em;
min-height: 52px;
}
/* Accept button on right when flipped */
#cc-main .cm--inline.cm--flip .cm__btn:last-child {
grid-column: auto !important;
border: 0px solid !important;
}
#cc-main .cm--inline.cm--flip .cm__btn:first-child {
grid-column: auto !important;
/* border:2.5px solid var(--cc-btn-reject-border);*/
border: 0px solid !important;
color: var(--cc-btn-primary-bg);
background-color: var(--cc-btn-reject-bg);
}
/* Hack to remove it again from first button */
#cc-main .cm--inline.cm--flip .cm__btn--secondary {
/* border:0px solid !important;*/
color: var(--cc-btn-secondary-color) !important;
background-color: var(--cc-btn-secondary-bg) !important;
}
/* Hide x icon on sliders */
#cc-main .toggle__icon-off {
opacity: 0;
}
/* Make customise confirm button same colour as primary buttons */
#cc-main .pm__btn--secondary {
background-color: var(--cc-btn-primary-bg);
border-color: var(--cc-btn-primary-border-color);
color: var(--cc-btn-primary-color);
}
#cc-main .pm__btn--secondary:hover {
background-color: var(--cc-btn-primary-hover-bg);
border-color: var(--cc-btn-primary-hover-border-color);
color: var(--cc-btn-primary-hover-color);
}
#cc-main .pm__btn {
font-size: 0.9em;
min-height: 58px;
}
#cc-main .pm__footer {
border-top: 0px;
}
/* Cancel link on customise panel */
#cc-main .pm__footer_cancel {
padding: 0.8em 0 0.3em 0;
font-size: 13px;
font-size: 0.85em;
}
#cc-main .pm__footer_cancel a {
color: var(--cc-cancel-color);
font-weight: 500;
}
/* Larger font and buttons sizes when width<640 (both mobile and desktop) */
@media screen and (max-width: 640px) {
/* Stronger box shadow */
#cc-main .cm {
box-shadow: 0px 4px 18px 0px rgb(20 20 20 / 75%);
}
#cc-main .cm {
font-size: 5vh;
font-size: 32px;
}
#cc-main .cm__title {
font-size: 1.15em;
}
#cc-main .cm__desc {
font-size: 1.05em;
max-height: 55vh;
padding-bottom: 0.5em;
}
#cc-main .cm__btn-group,
#cc-main .cm__btns {
flex-direction: row !important;
flex-grow: 1;
gap: 4.5%;
}
/* Reorder buttons side by side */
#cc-main .cm--flip .cm__btns {
flex-direction: row-reverse !important;
flex-grow: 1;
gap: 4.5%;
}
/* Accept button on right when flipped */
#cc-main .cm--flip .cm__btn-group {
flex-direction: row !important;
flex-grow: 1;
}
/* First (left side) button should make up 26% of width */
#cc-main .cm--flip .cm__btn-group:last-child {
flex-basis: 22% !important;
}
#cc-main .cm__btn {
font-size: 1.05em;
min-height: 3.5em;
flex-basis: 50% !important;
}
#cc-main .cm__btn--secondary {
font-size: 1.05em;
min-height: 3.5em;
flex-basis: 50% !important;
}
/* Customise settings panel */
#cc-main .pm {
font-size: 34px;
}
#cc-main .pm__btn {
font-size: 1.05em;
min-height: 3.9em;
margin-top: 0.3em;
}
#cc-main .pm__section-desc-wrapper {
font-size: 0.9em;
}
}
/* Only scale up icons and description text if mobile */
@media screen and (max-width: 640px) and (hover:none) {
#cc-main .pm__title {
font-size: 1.15em;
}
#cc-main .pm__section-title {
font-size: 1.05em;
}
/* Fix the icons on the customise panel when mobile site is not mobile-friendly */
/* toggle icons - edit: we can just scale up the wrapper instead of trying to adjust individual component width/height */
#cc-main .section__toggle-wrapper {
transform: scale(2);
right: 1.4em;
}
#cc-main .pm__section-desc-wrapper {
font-size: 1em;
}
/*
#cc-main .section__toggle,#cc-main .section__toggle-wrapper,#cc-main .toggle__icon,#cc-main .toggle__label {
width:3.04em;
height:1.4em;
}
#cc-main .toggle__icon:after {
width:1.4em;
height:1.4em;
}
#cc-main .section__toggle:checked~.toggle__icon:after {
transform: translateX(1.6em);
}
#cc-main .toggle__icon-on:before {
transform: scale(1.6);
}
*/
/* dropdown arrows */
#cc-main .pm__section--expandable .pm__section-arrow {
transform: scale(2);
left: 1.2em;
}
/* close button */
#cc-main .pm__close-btn {
padding: 1.1em;
border-radius: 100%;
transform: scale(1.2);
}
#cc-main .pm__btn {
font-size: 1.15em;
/* min-height: 58px;*/
}
#cc-main .pm__footer_cancel {
padding: 1.4em 0 0.7em 0;
font-size: 1em;
}
}
/* Adjust font size down again when width<640 but desktop device */
@media screen and (max-width: 640px) and (hover: hover) {
#cc-main .cm {
font-size: 14px;
}
#cc-main .pm {
font-size: 15px;
}
#cc-main .pm__footer_cancel {
font-size: 0.9em;
}
}
</style>
<script defer="" src="/cookie3/dist/cookieconsent.umd.js" onload="cc_init(1,0)"></script>
<script>
const cc_isInStandaloneMode = () => (window.matchMedia('(display-mode: standalone)').matches) || (window.navigator.standalone) || document.referrer.includes('android-app://');
function cc_init(autoShow, defaultEnabled) {
cc_config = {
cookie: {
name: 'cc_cookie01',
},
lazyHtmlGeneration: true,
hideFromBots: false,
guiOptions: {
consentModal: {
layout: 'box inline',
position: 'bottom left',
flipButtons: true
},
preferencesModal: {
layout: 'bar',
position: 'left',
equalWeightButtons: false,
flipButtons: true
}
},
onFirstConsent: () => {
console.log('onFirstAction fired');
},
onConsent: () => {
console.log('onConsent fired ...');
},
onChange: () => {
console.log('onChange fired ...');
},
categories: {
necessary: {
readOnly: true,
enabled: true
},
analytics: {
autoClear: {
cookies: [{
name: /^(_ga|_gid)/ // regex: match all cookies starting with '_ga' or '_gid'
}]
}
},
targeting: {
autoClear: {
cookies: [{
name: 'test_cookie' // string: exact cookie name
}, {
name: /^__gads/
}, {
name: /^__gsas/
}, {
name: /^__gpi/
}, {
name: /^__utm/
}, {
name: /^_opt_/
}, {
name: /^_gcl/
}, {
name: /^_gac/
}, {
name: 'NID'
}, {
name: 'DSID'
}, {
name: 'id'
}, {
name: 'GED_PLAYLIST_ACTIVITY'
}, {
name: 'ACLK_DATA'
}, {
name: 'AMP_TOKEN'
}, {
name: '_clck'
}, {
name: 'FPAU'
}, {
name: 'ANID'
}, {
name: 'AEC'
}, {
name: 'AID'
}, {
name: 'IDE'
}, {
name: 'TAID'
}, {
name: 'FPGCLDC'
}, {
name: 'FLC'
}, {
name: 'RUL'
}, {
name: 'FPGCLAW'
}, {
name: 'FPGCLGB'
}, {
name: '1p_JAR'
}, {
name: 'Conversion'
}, {
name: 'PAIDCONTENT'
}, {
name: 'CONSENT'
}]
}
}
},
language: {
default: 'en',
translations: {
en: {
consentModal: {
title: 'Cookie preferences',
description: 'Textcraft uses cookies for basic functionality, ads (including ad personalisation) and analytics purposes. <br><br>\
For more information, select "Customise". Otherwise you can choose to reject all non-essential cookies, or select "Accept all" to accept cookies.',
/* You can choose to customise or reject these cookies, or select "Accept all" to accept cookies.',*/
acceptAllBtn: 'Accept all',
acceptNecessaryBtn: 'Reject all',
showPreferencesBtn: 'Customise',
footer: ' '
/* footer: `
<a href="#link">Privacy Policy</a>
<a href="#link">Impressum</a>
`*/
},
preferencesModal: {
title: 'Customise cookie settings',
/* acceptAllBtn: 'Accept all',*/
acceptNecessaryBtn: 'Reject all',
savePreferencesBtn: 'Confirm choices',
closeIconLabel: 'Close',
sections: [{
title: 'Cookie usage',
description: '<p>Textcraft uses cookies for functionality such as displaying ads (both personalised and non-personalised) and site performance measurement.<br><br> \
These cookies may be set by the 3rd party services we use, such as Google Analytics and Google Adsense. You can see how Google \
uses this information on their <a href="https://policies.google.com/technologies/partner-sites">Privacy & Terms page</a>.</p><br> \
<p>You can choose which categories of cookies are enabled in the panel below. \
You can also change your cookie preferences at any time via the link in our <a href="/privacy.php" class="cc__link" target="_blank">privacy policy</a>.</p>'
}, {
title: 'Strictly necessary cookies',
description: 'These are cookies necessary for essential site functionality, such as session management.',
linkedCategory: 'necessary'
}, {
title: 'Performance and analytics cookies',
description: 'These cookies allow us to count visits and traffic sources so we can measure and improve the performance of our site, using Google Analytics. All information these cookies collect is aggregated and anonymous.',
linkedCategory: 'analytics'
}, {
title: 'Advertising and targeting cookies',
description: 'These cookies are used for displaying ads and making ads more relevant to you. They may be set through our site by us or by our advertising partners. They do not store directly personal information, but are based on uniquely identifying your browser and internet device.',
linkedCategory: 'targeting'
}]
}
}
}
},
/* Insert a cancel link at the bottom of the Cookie preferences dialog when it's added to the DOM*/
/* https://github.com/orestbida/cookieconsent/issues/397 */
onModalReady: ({
modalName,
modal
}) => {
//alert("modal name is "+modalName);
if (modalName === 'preferencesModal') {
cancel_html = "<div class='pm__footer_cancel'>";
cancel_html += "<a href='' onclick='CookieConsent.hidePreferences(); return false;'>Cancel and return</a>";
cancel_html += "</div>";
footer = modal.querySelector('.pm__footer');
elem = footer.firstElementChild;
elem.innerHTML = cancel_html;
}
},
// After OnConsent event triggered, if ad cookies weren't accepted, we might want to show something else in their place
// (this could also be implemented as the ad background in the page HTML)
onConsent: () => {
if (!CookieConsent.acceptedCategory('targeting')) {
//alert("ad cookies not accepted");
}
},
// Log consent for troubleshooting
onFirstConsent: () => {
logConsent("FirstConsent");
},
onChange: () => {
logConsent("Change");
}
};
// Configure the autoShow and mode options according to the autoShow param we were passed
// 'autoShow' determines whether we show the dialog when a consent decision has not yet been made
// 'mode' determines whether we opt-in or not to running the scipts if a consent decision has not yet been made
//
// When we receive an autoShow value of 0 to cc_init, we haven't detected an EU cookie consent country, so don't
// automatically show the dialog, and also opt-in to running optional category scripts (unless we already have a consent cookie which says otherwise)
// When we receive an autoShow value of 1 to cc_init, we have detected an EU cookie consent country, so show the consent
// dialog if consent decision has not been made yet (no consent cookie), and don't automatically run optional category scripts.
if (autoShow == 1) {
cc_config.autoShow = true;
} else {
cc_config.autoShow = false;
}
// We also need to set the categories as 'enabled' by default in this case, in order for them to run with 'opt-out' set
// Note: Only do this if defaultEnabled is set
if (defaultEnabled == 1) {
cc_config.mode = 'opt-out';
cc_config.categories.analytics.enabled = true;
cc_config.categories.targeting.enabled = true;
} else {
cc_config.mode = 'opt-in';
}
// console.log(cc_config);
CookieConsent.run(cc_config);
}
function logConsent(action) {
// Retrieve all the fields
const cookie = CookieConsent.getCookie();
const preferences = CookieConsent.getUserPreferences();
// In this example we're saving only 4 fields
const userConsent = {
action: action,
consentId: cookie.consentId,
revision: cookie.revision,
acceptType: preferences.acceptType,
acceptedCategories: preferences.acceptedCategories,
rejectedCategories: preferences.rejectedCategories,
location: window.location.href,
standalone: cc_isInStandaloneMode()
};
// Send the data to backend
fetch('/cookieconsent-log.php', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify(userConsent)
});
}
</script>
<div class="footer" align="center" style="margin-top:-5px">
<br>
<a href="/about.php">about</a> - <a href="/faq.php">faq</a> - <a href="/contact.php">contact</a> - <a href="/privacy.php">usage terms / privacy</a> - <a href="/styles.php">popular styles</a> - <a href="/download-fonts.php">download fonts</a> -
<a href="/tx-pro.php">textcraft pro</a>
<br>
<div class="footer-copy"> © 2024 moonstarnetworks.com </div>
</div>
<div class="clearer" style="height:0px"> </div>
<div class="clearer" style="height:12px"> </div>
<!-- end of container -->
<!-- Google Analytics -->
<script type="text/plain" data-category="analytics"> window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
ga('create', 'UA-3301414-7', 'auto');
var pixelRatio = (window.devicePixelRatio >= 1.5) ? "retina" : "normal";
//ga('set', 'Pixel Ratio', pixelRatio);
ga('set', 'dimension1', pixelRatio);
ga('send', 'pageview');
</script>
<script async="" src="https://www.google-analytics.com/analytics.js" type="text/plain" data-category="analytics"></script>
<!-- End Google Analytics -->
<script type="text/plain" data-category="analytics"> (function() {
var script = document.createElement('script');
script.src = '/corewebvitals.js';
script.onload = function() {
// When loading `web-vitals` using a classic script, all the public
// methods can be found on the `webVitals` global namespace.
// webVitals.onCLS(console.log);
// webVitals.onFID(console.log);
// webVitals.onLCP(console.log);
webVitals.onCLS(sendToGoogleAnalytics);
webVitals.onFID(sendToGoogleAnalytics);
webVitals.onLCP(sendToGoogleAnalytics);
}
document.head.appendChild(script);
}())
function sendToGoogleAnalytics({name, delta, id}) {
// Assumes the global `ga()` function exists, see:
// https://developers.google.com/analytics/devguides/collection/analyticsjs
ga('send', 'event', {
eventCategory: 'Web Vitals',
eventAction: name,
// The `id` value will be unique to the current page load. When sending
// multiple values from the same page (e.g. for CLS), Google Analytics can
// compute a total by grouping on this ID (note: requires `eventLabel` to
// be a dimension in your report).
eventLabel: id,
// Google Analytics metrics must be integers, so the value is rounded.
// For CLS the value is first multiplied by 1000 for greater precision
// (note: increase the multiplier for greater precision if needed).
eventValue: Math.round(name === 'CLS' ? delta * 1000 : delta),
// Use a non-interaction event to avoid affecting bounce rate.
nonInteraction: true,
// Use `sendBeacon()` if the browser supports it.
transport: 'beacon',
// OPTIONAL: any additional attribution params here.
// See: https://web.dev/debug-performance-in-the-field/
// dimension1: '...',
// dimension2: '...',
// ...
});
}
</script>
</div> <!-- end lower_outerbox -->
</form>Name: download_fields — GET download.php
<form name="download_fields" id="download_fields" action="download.php" method="GET" style="display:inline">
<input type="hidden" name="filename" id="filename" value="">
<input type="hidden" name="downloadname" id="downloadname" value="">
<input type="hidden" name="animtype" id="animtype" value="">
</form>POST //translate.googleapis.com/translate_voting?client=te
<form id="goog-gt-votingForm" action="//translate.googleapis.com/translate_voting?client=te" method="post" target="votingFrame" class="VIpgJd-yAWNEb-hvhgNd-aXYTce"><input type="text" name="sl" id="goog-gt-votingInputSrcLang"><input type="text"
name="tl" id="goog-gt-votingInputTrgLang"><input type="text" name="query" id="goog-gt-votingInputSrcText"><input type="text" name="gtrans" id="goog-gt-votingInputTrgText"><input type="text" name="vote" id="goog-gt-votingInputVote"></form>Text Content
▼ 1 fit lines to max width drop shadow glow 3d-style view 24-bit colour images Save this style Style name: Save style Your profile Use Textcraft to make your own Minecraft and 8-bit style text and logos. Click on one of the styles below to load it, or create your own by changing the settings above. See the guide below for more details on each option. Solid Bg. Comment Borders 1. 2. 3. Create Use different styles for each line of text Adjust border size along with text size download host view ** Note: Please use "download" or "host" to keep your images lighting Image Details dimensions: n/a file size: n/a colour format: n/a Youtube Thumbnail by: jasonejohnson31 hits: 2653 Pokemon by: Textcraft hits: 2197 GTA Wasted by: PedroBlocks24 hits: 1386 Gta vice city by: ayoub26 hits: 1338 Grand Theft Auto by: GWSheridan hits: 1017 3D Text by: TextDesigner hits: 781 YouTube style by: TeemoPolska hits: 770 FriDAY NiGHT FUNKiN' by: kalmax0328 hits: 695 Roblox by: jasonejohnson31 hits: 687 MEGA MAN X STYLE by: pixelizer hits: 569 your styles most popular most popular all random newest all top styles search: Marshmallow gta mission passed Diamond Text Metal Slug jpeg GTA5 pixel art lava text Herobrine other popular styles Your location: DE You can write using German characters with the 'Designosaur' font. Welcome to Textcraft Design your own logo or text for your website, blog, YouTube videos, screenshots, forum sig., artwork, Minecraft server, wallpaper, computer games etc. Textcraft is a free online text and logo maker, and is also compatible with iPad and Android tablets. See the guide below and also the faq for more details. New! v2.1 Added Pokémon and GTA fonts, some bugfixes (see about page for details). v2.0 More fonts, textures, and Textcraft Pro option for extra large font sizes. v1.1 Added Chinese, Japanese, Korean, Hindi, Arabic, Greek and Cyrillic fonts. Show all text Enter your text Type your text into the box shown as "Your text here". You can have a single line of text, or up to 3 lines. Press "Create" to create your graphic using the current settings. When you're happy with the result, click on "Download" to download the file. Use the "host" button to upload the image to Imgur, or you can also click on "View" while you're designing your text to see how it looks like against different types of backgrounds. (more.. ) Text & Border Size Use the text size buttons to change the size of each line of text. You can change the size of each line by first clicking on the text box for that line, and then using the size buttons. Change the size of the border around the text by using the border size buttons. You can also change the colour of the border by clicking on the colour swatch here. Whenever you change the font size or border size of the text, the image will automatically update. (more.. ) Text Styles You can choose a different colour and font style for each line of text. Select a font by clicking on the font name, eg. "Square". The available colour and texture styles for that font will appear. Scroll through the styles by using the right and left arrows. Select a style by clicking on it, and press the "Create" button to update your text using your new selection. Hint: Styles for each font are a combination of textures and solid colours. Click on the right or left arrows to get to the page with solid colours. You can have different font styles and colours for each line of text - see details for the "Multiline" option. (more.. ) Settings Textcraft lets you apply some special settings to add some wow to your text. Click the "Create" button after changing these settings to update your text. drop shadow: The drop shadow option creates a darker shadow underneath your text. This can really help add depth to your text. 3d style: This option will change the perspective of the text to look as if it's receding into the distance. It's not the same as a full 3d render, but can look good for Minecraft and some other styles of text. glow: Two different glow options are available: Localized Glow This creates an unusual glow that takes it's colour from the nearby edges of your text. This can look great with some styles such as lava, but may need some experimenting with. Coloured Glow This is a glow using a specified colour. Select the colour you want to use with the swatch to the right. Note that very dark colours won't work here since the colour selected is an "addition" to the overall glow, so you may need to use a strong colour with this option. Note: Glow will usually only apply to the first line of text - see the multi-line option for more details. fit lines to max width: This is a useful setting if you need your text to be created at a specific width, for example to fit as a logo on a page. This setting will ensure that the longest line of text is no bigger than the width you specify. Click to enable this option, then use the slider beside it to select your maximum width. A ruler will appear underneath your text as a guide to the selected width. 24-bit colour images: Specifies whether to create the image with 24-bit colour. Leave it turned off for smaller, optimized file sizes, or enable it for higher colour fidelity in large images. (more.. ) Minecraft style text Use the Minecrafter and Minecraftia fonts for classical Minecraft style text, or use one of the existing text styles such as "Minescript" or "Achievement Get". Hint: You can get the Creeper face using the Minecrafter font by entering an upper-case "A". Other text styles Textcraft has a built-in style database which you can search or add to with your own style settings. The most popular styles for this month are displayed initially, or you can view the newest or top 200 styles in addition to searching by style name or submitter name. Click on the sample "Tt" text icon to load that specific style. Signup for a free account to save new styles you create. After logging in, you have the option of saving new styles by using the "Save style" dialog box. Enter a stylename of your choice, then click the Save button. The style will be saved to your profile, so you can access it later. You can currently save up to 50 styles, but there is no limit on the amount of text you can create using these styles. You can also share the URL of your profile page to show your creations to others, or use it as a group page. Multi-line option This buttons controls whether "multi-line" mode is enabled or not. The default is switched on for multi-line mode. This means that you can have different styles of text on each line 1 to 3. Click on the text input box for each line to indicate that you want to change settings for that line. The styles box to the left will update with the current style for that particular line. You can change the text style and size settings individually for each line. Multi-line mode off - Click the multi-line button to switch it off. Now any style settings you select will apply the same to each line of text, so for example, each line will have the same font size, font style, border size and colour etc. Also each line will have glow, if glow was selected. When multi-line mode is switched on, for stylistic reasons, only the first line may have a glow effect. (more.. ) Hints & Tips * Keep transparency details by saving the file instead of copying and pasting - each image created on Textcraft contains a .PNG alpha channel which means it will smoothly blend into any other graphic, as long as you save the file directly from Textcraft (either using the "Download" button or right-click and "Save as.." in your web browser). * Not happy with the available sizes of text, or need to slightly tweak the font size? First select a large text size, then use the "fit to max. width" option to reduce the generated text size down to the right size. * Need hex colours? - you can specify the exact colour you want for borders and glow by editing the hex value displayed in the colour swatch popup. * Use 24-bit colour images for hi-fidelity work and extra software compatibility - usually having the 24-bit colour option off is better for web optimized images, however you might want to use the 24-bit option for large images with dropshadows or if you're using older graphics applications which don't fully support 8-bit PNG files with transparency (eg. old versions of Paint Shop Pro and Photoshop). (more.. ) Font list Minecraft, 8-bit and blocky fonts: Minecrafter v3, Zephyrean, Stonecraft, Square, ArcadePix, Minecraftia, Blocked, Umbrage, White Rabbit, Karmatic Arcade, Gputeks Unicode fonts: Japanese, Chinese (Simplified), Korean, Arabic, Hindi, Greek, Cyrillic, Hebrew, Chinese (Traditional) Misc fonts: Designosaur, Flipbash, League Gothic, Augustus, Metro, Telegrafico, ChunkFive, Helsinki, Minstrel, Osaka, Pacifico, Pokémon, Swagger, Pokémin, Aero, Pricedown Image credits Background pic No.12: rayced Textures: Spiral Graphics GR Sites Cisoun's Texture Pack (via Minetest) Other credits Misc.: Webtreats icons8 famfamfam Loris Grillet MadPixel Minecraft forum Imgur Mojang dafont See the font download page for full credits and font download links Visit the Textcraft Facebook page for news & updates Android/iPad and touchscreen compatible Check out our Glowtxt text generator: about - faq - contact - usage terms / privacy - popular styles - download fonts - textcraft pro © 2024 moonstarnetworks.com # ok # ok # ok # ok Originaltext Diese Übersetzung bewerten Mit deinem Feedback können wir Google Übersetzer weiter verbessern Cookie preferences Textcraft uses cookies for basic functionality, ads (including ad personalisation) and analytics purposes. For more information, select "Customise". Otherwise you can choose to reject all non-essential cookies, or select "Accept all" to accept cookies. Reject allAccept all Customise