AddThis | Custom Buttons

<!DOCTYPE html> <html> <head><script type="text/javascript" src="/_static/js/bundle-playback.js?v=HxkREWBo" charset="utf-8"></script> <script type="text/javascript" src="/_static/js/wombat.js?v=txqj7nKC" charset="utf-8"></script> <script>window.RufflePlayer=window.RufflePlayer||{};window.RufflePlayer.config={"autoplay":"on","unmuteOverlay":"hidden"};</script> <script type="text/javascript" src="/_static/js/ruffle/ruffle.js"></script> <script type="text/javascript"> __wm.init("https://web.archive.org/web"); __wm.wombat("http://support.addthis.com/customer/portal/articles/381236-custom-buttons","20140702135923","https://web.archive.org/","web","/_static/", "1404309563"); </script> <link rel="stylesheet" type="text/css" href="/_static/css/banner-styles.css?v=S1zqJCYt" /> <link rel="stylesheet" type="text/css" href="/_static/css/iconochive.css?v=3PDvdIFv" />  <meta http-equiv="Content-type" content="text/html; charset=utf-8"/> <meta http-equiv="X-UA-Compatible" content="IE=8; IE=9"/> <script type="text/javascript">window.NREUM||(NREUM={});NREUM.info={"beacon":"beacon-1.newrelic.com","errorBeacon":"bam.nr-data.net","licenseKey":"bceadb921a","applicationID":"473944","transactionName":"JlpeF0ENCggEExtXTRZBXw5WEEkUDhNAVVRKXlI8UhASDQINUUcXFl1fFA==","queueTime":3,"applicationTime":148,"ttGuid":"","agentToken":null,"agent":"js-agent.newrelic.com/nr-411.min.js"}</script> <script type="text/javascript">(window.NREUM||(NREUM={})).loader_config={xpid:"VQcFVlRADAQDXVVW"};window.NREUM||(NREUM={}),__nr_require=function(t,e,n){function r(n){if(!e[n]){var o=e[n]={exports:{}};t[n][0].call(o.exports,function(e){var o=t[n][1][e];return r(o?o:e)},o,o.exports)}return e[n].exports}if("function"==typeof __nr_require)return __nr_require;for(var o=0;o<n.length;o++)r(n[o]);return r}({1:[function(t,e){function n(t,e,n){n||(n={});for(var r=o[t],a=r&&r.length||0,s=n[i]||(n[i]={}),u=0;a>u;u++)r[u].apply(s,e);return s}function r(t,e){var n=o[t]||(o[t]=[]);n.push(e)}var o={},i="nr@context";e.exports={on:r,emit:n}},{}],2:[function(t){function e(t,e,n,i,s){return u?u-=1:r("err",[s||new UncaughtException(t,e,n)]),"function"==typeof a?a.apply(this,o(arguments)):!1}function UncaughtException(t,e,n){this.message=t||"Uncaught error with no additional information",this.sourceURL=e,this.line=n}function n(t){r("err",[t,(new Date).getTime()])}var r=t("handle"),o=t(6),i=t(5),a=window.onerror,s=!1,u=0;t("loader").features.push("err"),window.onerror=e,NREUM.noticeError=n;try{throw new Error}catch(d){"stack"in d&&(t(1),t(2),"addEventListener"in window&&t(3),window.XMLHttpRequest&&XMLHttpRequest.prototype&&XMLHttpRequest.prototype.addEventListener&&t(4),s=!0)}i.on("fn-start",function(){s&&(u+=1)}),i.on("fn-err",function(t,e,r){s&&(this.thrown=!0,n(r))}),i.on("fn-end",function(){s&&!this.thrown&&u>0&&(u-=1)}),i.on("internal-error",function(t){r("ierr",[t,(new Date).getTime(),!0])})},{1:5,2:4,3:3,4:6,5:1,6:14,handle:"D5DuLP",loader:"G9z0Bl"}],3:[function(t){function e(t){r.inPlace(t,["addEventListener","removeEventListener"],"-",n)}function n(t){return t[1]}var r=t(1),o=(t(3),t(2));if(e(window),"getPrototypeOf"in Object){for(var i=document;i&&!i.hasOwnProperty("addEventListener");)i=Object.getPrototypeOf(i);i&&e(i);for(var a=XMLHttpRequest.prototype;a&&!a.hasOwnProperty("addEventListener");)a=Object.getPrototypeOf(a);a&&e(a)}else XMLHttpRequest.prototype.hasOwnProperty("addEventListener")&&e(XMLHttpRequest.prototype);o.on("addEventListener-start",function(t){if(t[1]){var e=t[1];"function"==typeof e?this.wrapped=e["nr@wrapped"]?t[1]=e["nr@wrapped"]:e["nr@wrapped"]=t[1]=r(e,"fn-"):"function"==typeof e.handleEvent&&r.inPlace(e,["handleEvent"],"fn-")}}),o.on("removeEventListener-start",function(t){var e=this.wrapped;e&&(t[1]=e)})},{1:15,2:1,3:14}],4:[function(t){var e=(t(3),t(1)),n=t(2);e.inPlace(window,["requestAnimationFrame","mozRequestAnimationFrame","webkitRequestAnimationFrame","msRequestAnimationFrame"],"raf-"),n.on("raf-start",function(t){t[0]=e(t[0],"fn-")})},{1:15,2:1,3:14}],5:[function(t){function e(t){var e=t[0];"string"==typeof e&&(e=new Function(e)),t[0]=n(e,"fn-")}var n=(t(3),t(1)),r=t(2);n.inPlace(window,["setTimeout","setInterval","setImmediate"],"setTimer-"),r.on("setTimer-start",e)},{1:15,2:1,3:14}],6:[function(t){function e(){o.inPlace(this,s,"fn-")}function n(t,e){o.inPlace(e,["onreadystatechange"],"fn-")}function r(t,e){return e}var o=t(1),i=t(2),a=window.XMLHttpRequest,s=["onload","onerror","onabort","onloadstart","onloadend","onprogress","ontimeout"];window.XMLHttpRequest=function(t){var n=new a(t);try{i.emit("new-xhr",[],n),o.inPlace(n,["addEventListener","removeEventListener"],"-",function(t,e){return e}),n.addEventListener("readystatechange",e,!1)}catch(r){try{i.emit("internal-error",r)}catch(s){}}return n},window.XMLHttpRequest.prototype=a.prototype,o.inPlace(XMLHttpRequest.prototype,["open","send"],"-xhr-",r),i.on("send-xhr-start",n),i.on("open-xhr-start",n)},{1:15,2:1}],7:[function(t){function e(){function e(t){if("string"==typeof t&&t.length)return t.length;if("object"!=typeof t)return void 0;if("undefined"!=typeof ArrayBuffer&&t instanceof ArrayBuffer&&t.byteLength)return t.byteLength;if("undefined"!=typeof Blob&&t instanceof Blob&&t.size)return t.size;if("undefined"!=typeof FormData&&t instanceof FormData)return void 0;try{return JSON.stringify(t).length}catch(e){return void 0}}function n(t){var n=this.params,r=this.metrics;if(!this.ended){this.ended=!0;for(var i=0;u>i;i++)t.removeEventListener(s[i],this.listener,!1);if(!n.aborted){if(r.duration=(new Date).getTime()-this.startTime,4===t.readyState){n.status=t.status;var a=t.responseType,d="arraybuffer"===a||"blob"===a||"json"===a?t.response:t.responseText,f=e(d);if(f&&(r.rxSize=f),this.sameOrigin){var c=t.getResponseHeader("X-NewRelic-App-Data");c&&(n.cat=c.split(", ").pop())}}else n.status=0;r.cbTime=this.cbTime,o("xhr",[n,r])}}}function r(t,e){var n=i(e),r=t.params;r.host=n.hostname+":"+n.port,r.pathname=n.pathname,t.sameOrigin=n.sameOrigin}t("loader").features.push("xhr");var o=t("handle"),i=t(1),a=t(5),s=["load","error","abort","timeout"],u=s.length,d=t(2);t(3),t(4),a.on("new-xhr",function(){this.totalCbs=0,this.called=0,this.cbTime=0,this.end=n,this.ended=!1,this.xhrGuids={}}),a.on("open-xhr-start",function(t){this.params={method:t[0]},r(this,t[1]),this.metrics={}}),a.on("open-xhr-end",function(t,e){"loader_config"in NREUM&&"xpid"in NREUM.loader_config&&this.sameOrigin&&e.setRequestHeader("X-NewRelic-ID",NREUM.loader_config.xpid)}),a.on("send-xhr-start",function(t,n){var r=this.metrics,o=t[0],i=this;if(r&&o){var d=e(o);d&&(r.txSize=d)}this.startTime=(new Date).getTime(),this.listener=function(t){try{"abort"===t.type&&(i.params.aborted=!0),("load"!==t.type||i.called===i.totalCbs&&(i.onloadCalled||"function"!=typeof n.onload))&&i.end(n)}catch(e){try{a.emit("internal-error",e)}catch(r){}}};for(var f=0;u>f;f++)n.addEventListener(s[f],this.listener,!1)}),a.on("xhr-cb-time",function(t,e,n){this.cbTime+=t,e?this.onloadCalled=!0:this.called+=1,this.called!==this.totalCbs||!this.onloadCalled&&"function"==typeof n.onload||this.end(n)}),a.on("xhr-load-added",function(t,e){var n=""+d(t)+!!e;this.xhrGuids&&!this.xhrGuids[n]&&(this.xhrGuids[n]=!0,this.totalCbs+=1)}),a.on("xhr-load-removed",function(t,e){var n=""+d(t)+!!e;this.xhrGuids&&this.xhrGuids[n]&&(delete this.xhrGuids[n],this.totalCbs-=1)}),a.on("addEventListener-end",function(t,e){e instanceof XMLHttpRequest&&"load"===t[0]&&a.emit("xhr-load-added",[t[1],t[2]],e)}),a.on("removeEventListener-end",function(t,e){e instanceof XMLHttpRequest&&"load"===t[0]&&a.emit("xhr-load-removed",[t[1],t[2]],e)}),a.on("fn-start",function(t,e,n){e instanceof XMLHttpRequest&&("onload"===n&&(this.onload=!0),("load"===(t[0]&&t[0].type)||this.onload)&&(this.xhrCbStart=(new Date).getTime()))}),a.on("fn-end",function(t,e){this.xhrCbStart&&a.emit("xhr-cb-time",[(new Date).getTime()-this.xhrCbStart,this.onload,e],e)})}window.XMLHttpRequest&&XMLHttpRequest.prototype&&XMLHttpRequest.prototype.addEventListener&&!/CriOS/.test(navigator.userAgent)&&e()},{1:8,2:11,3:3,4:6,5:1,handle:"D5DuLP",loader:"G9z0Bl"}],8:[function(t,e){e.exports=function(t){var e=document.createElement("a"),n=window.location,r={};e.href=t,r.port=e.port;var o=e.href.split("://");return!r.port&&o[1]&&(r.port=o[1].split("/")[0].split(":")[1]),r.port&&"0"!==r.port||(r.port="https"===o[0]?"443":"80"),r.hostname=e.hostname||n.hostname,r.pathname=e.pathname,"/"!==r.pathname.charAt(0)&&(r.pathname="/"+r.pathname),r.sameOrigin=!e.hostname||e.hostname===document.domain&&e.port===n.port&&e.protocol===n.protocol,r}},{}],handle:[function(t,e){e.exports=t("D5DuLP")},{}],D5DuLP:[function(t,e){function n(t,e){var n=r[t];return n?n.apply(this,e):(o[t]||(o[t]=[]),void o[t].push(e))}var r={},o={};e.exports=n,n.queues=o,n.handlers=r},{}],11:[function(t,e){function n(t){if(!t||"object"!=typeof t&&"function"!=typeof t)return-1;if(t===window)return 0;if(o.call(t,"__nr"))return t.__nr;try{return Object.defineProperty(t,"__nr",{value:r,writable:!0,enumerable:!1}),r}catch(e){return t.__nr=r,r}finally{r+=1}}var r=1,o=Object.prototype.hasOwnProperty;e.exports=n},{}],loader:[function(t,e){e.exports=t("G9z0Bl")},{}],G9z0Bl:[function(t,e){function n(){var t=p.info=NREUM.info;if(t&&t.agent&&t.licenseKey&&t.applicationID&&u&&u.body){p.proto="https"===c.split(":")[0]||t.sslForHttp?"https://":"http://",a("mark",["onload",i()]);var e=u.createElement("script");e.src=p.proto+t.agent,u.body.appendChild(e)}}function r(){"complete"===u.readyState&&o()}function o(){a("mark",["domContent",i()])}function i(){return(new Date).getTime()}var a=t("handle"),s=window,u=s.document,d="addEventListener",f="attachEvent",c=(""+location).split("?")[0],p=e.exports={offset:i(),origin:c,features:[]};u[d]?(u[d]("DOMContentLoaded",o,!1),s[d]("load",n,!1)):(u[f]("onreadystatechange",r),s[f]("onload",n)),a("mark",["firstbyte",i()])},{handle:"D5DuLP"}],14:[function(t,e){function n(t,e,n){e||(e=0),"undefined"==typeof n&&(n=t?t.length:0);for(var r=-1,o=n-e||0,i=Array(0>o?0:o);++r<o;)i[r]=t[e+r];return i}e.exports=n},{}],15:[function(t,e){function n(t,e,r,s){function nrWrapper(){try{var n,a=u(arguments),d=this,f=r&&r(a,d)||{}}catch(c){i([c,"",[a,d,s],f])}o(e+"start",[a,d,s],f);try{return n=t.apply(d,a)}catch(p){throw o(e+"err",[a,d,p],f),p}finally{o(e+"end",[a,d,n],f)}}return a(t)?t:(e||(e=""),nrWrapper[n.flag]=!0,nrWrapper)}function r(t,e,r,o){r||(r="");var i,s,u,d="-"===r.charAt(0);for(u=0;u<e.length;u++)s=e[u],i=t[s],a(i)||(t[s]=n(i,d?s+r:r,o,s,t))}function o(t,e,n){try{s.emit(t,e,n)}catch(r){i([r,t,e,n])}}function i(t){try{s.emit("internal-error",t)}catch(e){}}function a(t){return!(t&&"function"==typeof t&&t.apply&&!t[n.flag])}var s=t(1),u=t(2);e.exports=n,n.inPlace=r,n.flag="nr@wrapper"},{1:1,2:14}]},{},["G9z0Bl",2,7]);</script> <link href="https://web.archive.org/web/20140702135923cs_/http://assets03.desk.com/assets/portal_jqueryui_only-0b9cff0a93f6e674c863d5ae4e4ec6fd.css" media="screen" rel="stylesheet" type="text/css"/> <script src="https://web.archive.org/web/20140702135923js_/http://assets02.desk.com/assets/vendor-25eb61af4992cf238353ac316557ef65.js" type="text/javascript"></script> <script src="https://web.archive.org/web/20140702135923js_/http://assets01.desk.com/assets/customer_widget-baa68b3634ef5acd73315f57af8fa3b9.js" type="text/javascript"></script> <script src="https://web.archive.org/web/20140702135923js_/http://assets03.desk.com/assets/portal-33005ec4cf86e817fbe0e83e4327a70c.js" type="text/javascript"></script> <script src="https://web.archive.org/web/20140702135923js_/http://www.google.com/jsapi?key=ABQIAAAAQO2RPu5r12mVC40HMDIFHRQqrBpdv_jP_dFl8Cw_MxS37sDB3xTXnsXso23z1ROPVCqEVVv6cqz_cA" type="text/javascript"></script> <script src="https://web.archive.org/web/20140702135923js_/http://assets03.desk.com/assets/tracking-ba91ec11c4fdd4fab9e4a3d5d675422d.js" type="text/javascript"></script> <script src="https://web.archive.org/web/20140702135923js_/http://deskwww.s3.amazonaws.com/new/javascripts/deskanalytics.js" type="text/javascript"></script> <script src="https://web.archive.org/web/20140702135923js_/http://assets03.desk.com/assets/tracking/settings/production-6a6b78030e48bdca0ea4d2891776259c.js" type="text/javascript"></script> <meta content="authenticity_token" name="csrf-param"/> <meta content="7VXNKNo7oEHj7EYsIHxumT9uOaP2hmMa2exRHJnCH+c=" name="csrf-token"/> <link rel="SHORTCUT ICON" type="image/ico" href="https://web.archive.org/web/20140702135923im_/http://www.addthis.com/favicon.ico"/> <link rel="icon" type="image/png" href="https://web.archive.org/web/20140702135923im_/http://www.addthis.com/favicon.ico"/> <link rel="dns-prefetch" href="//web.archive.org/web/20140702135923/http://fonts.googleapis.com/"> <link href="//web.archive.org/web/20140702135923cs_/http://fonts.googleapis.com/css?family=Lato:300,700" rel="stylesheet" type="text/css"> <title> AddThis | Custom Buttons </title> <meta property="og:title" content="Custom Buttons"/> <meta property="og:type" content="article"/> <meta property="og:site_name" content="AddThis"/> <meta property="og:description" content="• Different Image • Image and Text • Just Text • API Reference These instructions only work with native AddThis but..."/> <style type="text/css"> /* Reset */ html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; font-size: 100%; font-family: inherit; vertical-align: baseline; outline: none; } html { font-size: 13px; height: 100%; } body { margin: 0; padding: 0; border: 0; font-family: 'Helvetica Neue', 'Helvetica', sans-serif; background: #F8F8F8; } h1, h2, h3, h4, h5, h6, p, address { color: #272727;} h3 { font-size: 22px; } h4 { font-size: 18px; } h5 { font-size: 14px; color: #414141; } a img { border: 0; } p { line-height: 18px; color: #535353; margin: 0 0 20px; } a { color: #254689; text-decoration: none; } a:link { color: #254689; } a:visited { color: #254689; } a:hover, a:focus { color: #254689; text-decoration: underline; } a:active { color: #254689; } html,body { height: 100%; } body { position: relative; background: #ecebe8; margin: 0; padding: 0; font-family: "lato","helvetica neue",helvetica,arial,sans-serif; font-size: 16px; font-weight: 300; color: #66625b; } a:link, a:visited { text-decoration: none; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; color: #f8694d; } a:hover { text-decoration: underline; color: #d7492e; } /* a[href*="//"]:not([href*="addthis.com"]) { */ a[href ^= "http"]:hover { text-decoration: none; border-bottom: 1px dotted #d7492e; } *, *:after, *::before { -moz-box-sizing: border-box; box-sizing: border-box; } /* CSS Animation ---------------------------------------------------------- */ @-webkit-keyframes fadein { 0%{ -webkit-transform: translateY(-20px); transform: translateY(-20px); -webkit-transform: scale(.85); transform: scale(.85); opacity: 0; } 100%{ -webkit-transform: translateY(0); transform: translateY(0); -webkit-transform: scale(1); transform: scale(1); opacity: 1; } } @-moz-keyframes fadein { 0%{ -moz-transform: translateY(-20px); transform: translateY(-20px); -moz-transform: scale(.85); transform: scale(.85); opacity: 0; } 100%{ -moz-transform: translateY(0); transform: translateY(0); -moz-transform: scale(1); transform: scale(1); opacity: 1; } } @-o-keyframes fadein { 0%{ -o-transform: translateY(-20px); transform: translateY(-20px); -o-transform: scale(.85); transform: scale(.85); opacity: 0; } 100%{ -o-transform: translateY(0); transform: translateY(0); -o-transform: scale(1); transform: scale(1); opacity: 1; } } @keyframes fadein { 0%{ transform: translateY(-20px); transform: scale(.85); opacity: 0; } 100%{ transform: translateY(0); transform: scale(1); opacity: 1; } } /* HEADER ---------------------------------------------------------- */ body > header { position: relative; background-image: url('https://web.archive.org/web/20140702135923im_/http://cache.addthiscdn.com/site/img/header-help.jpg'); background-color: #363432; background-repeat: no-repeat; background-position: 50% 90%; background-size: cover; height: 30%; min-height: 360px; overflow: hidden; } body > header:after { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAQAAAAngNWGAAAAGUlEQVQoz2NgOMPQQBQGIuLgqImjJg5rEwEAMuWxCNqASgAAAABJRU5ErkJggg=='); } body > header .addthis-logo { position: absolute; top: 30px; left: 5%; display: block; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJgAAAAaCAYAAABLupXyAAAFJElEQVR4Ae3bfWhVdRzH8e91LrMH5ya5aZaLyEqjGpVPMLXM0IiyBynDzLJFZIVBkqJGDyZOzeZDbKQ0I6sRGItlWppcMigCc3/YkzVbaQ+ibm5O3b1u9/T+4/7gy4/uufec3bmzu73htX/uX+ecz7jzh0dInFnF+ViEsjRbjhshPVMv4UcuDsHpJFEUQ3qm3oHNhdPJPoD44jjZ2IGwMhWSRhchrDwA8WkZwnGbIDZsQriDlkHiFiIcVwXxoaAz7rHwEOfD6WTVHRjYfbDbAUmjgdDNh/hUDVMtxIZadLRqSNxmmOohPhRCN6enDOxT2MVwWaYNrHdgc6c4zpPT4qZ2/sAcZyja8X8t7cYDW4CyBHTNKEtgbpoHlocyZfS5H9jePQ4RnWo5FwNbBFMTPobpIELdcGDuyOtY/A/MXWYPjPHgV5g24y7oboN4cAWKUYQBHRhYDm7BOAwP8MBCGIFJKEJ/SBpk4UoUx41AVncb2ATo7kA2GmB6H5JEHzyNOujOYhcmehhYEbahDbo6vIjsAA2sBL9DF8UWFEAsQ1Gr3A2xjMJ7OAG7JmxCYXcZ2Lsw/YssCCpgasVASALn4RO4FcOCFAY2AxG4tRvbAzCw9XDrD+R7/CP/YUSQrEaMD/bA+PrCKZjWQeImQTcPksBae0zYgVJUoB4OtScZWBEi0NWhAiuxG6ZYVw5MXUsbalCKzWiBrtzDwAbjDExRVKMUG7AfusPo7z6wn/ZZcLJJXUa7/Tmw+PF0DKwEurHWV95fMO2F2HCV9bCPYwxE6Yt1INeB7YZuFbIg1vCbQF0zMFUDRtv3AydhOuZhYLOhuxWihPAmdI+4Dsx3rz+XjoF9C1MdxPIGdDdALKXQzYDYEMIel4EVejjkfTQgA3sMYsNG6HJTHNh86K5O4ZjjnmAOzHFGQvcaxHIzdOshlr0ejjTudxlYCXRTIAn0xZEuHlgUF0BseBa6whQHdid0dZiFAf6PKY7+Y0GkVf2lEbM/B15+qqMDWw3dNRAbDsDUgH4Q5TRMlRAXg1wGtgKmszgf4mJrFw/sECSBOT4Hlo0fYNeG71GOmRgU7GMKLgRHYIqhNoFG6B6y/vWoewmSRGuCgVXCdBiSxPqAHrT6HxhwOb6GW+2owcigDuxe+G0nJC4E3WJIEpEEA9vo8YG/lZEDA0KYjHL8jESdxrggDqwGfotZp+pHYaqAuLg0xa/IKLIhLrZn8MBsuZiGNfgbun3BGpjjDEEbTF9iYBJLoHsFErcTpt8QgiTwhMvAHoRuMiSBC9GSgQObiOlx412u/SvoLg7SwBb6+A0ahph1Qt0HghegmwmxoT9+cRnYJYjCtMtlrItBGTewz2D6U91j2zPQ5Xkb2MLZDscQwKvz0jcwHhgOwHQGOZAUhBMcIwxGC0zN6jMjBzUpHLRuga4c/eyHh/YMHdgS6JbZI0MOvoHpUHD+w6HjFEP3ESRFJdBV2b9RVt/hHWxFM0ytLgMrQCN0R1CFSvwIUyQDB5aP49AdRBXexjY0Q/d8kAZWCd10SIpyrYcaQR4kbiWStRz19sAsY3AMbh3AuowbGDARjUilNQghAC99OE4WtiEc9zn6QTxYjbAyDaLcji8QhW4/ZkNQlcJLH/lYi6PQncAG5GGO/dKHR2EPL3B4feljKsJKgceXPvKxCvWwa8CHGGsftObhMJxOchYTIF2O4WI4RiEP4lMIg3EdhiEL0sMMwrW4Xg/VJvwQbv4QLEVZmq3ATZCeqdd/xsq7rw23FFcAAAAASUVORK5CYII='); background-image: none, url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2ZXJzaW9uPSIxLjEiIGlkPSJMYXllcl8xIiB4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjE1MnB4IiBoZWlnaHQ9IjI2cHgiIHZpZXdCb3g9IjAgMCAxNTIgMjYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDE1MiAyNiIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHBhdGggZmlsbD0iI0ZGNUMzRSIgZD0iTTI1LjM5NyAyMi44NzJjMCAxLjQwMy0xLjEzOCAyLjU0LTIuNTQgMi41NEgyLjU0MUMxLjEzOCAyNS40IDAgMjQuMyAwIDIyLjg3MlYyLjU1NSBjMC0xLjQwMiAxLjEzOC0yLjU0IDIuNTQxLTIuNTRoMjAuMzE2YzEuNDAyIDAgMi41IDEuMSAyLjUgMi41NFYyMi44NzJ6Ii8+PHBvbHlnb24gZmlsbD0iI0ZGRkZGRiIgcG9pbnRzPSIxOS45LDExIDE0LjUsMTEgMTQuNSw1LjYgMTAuOSw1LjYgMTAuOSwxMSA1LjUsMTEgNS41LDE0LjYgMTAuOSwxNC42IDEwLjksMjAgMTQuNSwyMCAxNC41LDE0LjYgMTkuOSwxNC42Ii8+PHBhdGggZmlsbD0iI0ZGRkZGRiIgZD0iTTE0Ni44MyAxNC4yOThjLTAuODItMC4xODctMS42NDQtMC4zMzgtMi4zNzktMC41MTVjLTEuNTU4LTAuMzcyLTIuNzM3LTAuODU3LTIuNzM3LTIuMDE0IGMwLTEuMzcgMS44NTctMS42MTQgMi44NjEtMS42MTRjMS41MjIgMCAyLjkgMC41IDMuMiAyLjEwMWgzLjYyM2MtMC40MjgtMy41MDEtMy4zNTItNC44NDItNi41OC00Ljg0MiBjLTIuODYxIDAtNi41NzggMS4wNjYtNi41NzggNC41MDhjMCAxIDAuMyAxLjggMC43IDIuNDY5YzAuOTI0IDEuMyAyLjYgMS44IDQuMyAyLjIgYzIuNTI5IDAuNiA1LjEgMC44IDUuMSAyLjYyYzAuMDkxIDEuNzk2LTIuMTk0IDIuMDY5LTMuNTAzIDIuMDY5Yy0xLjg1NyAwLTMuMzgyLTAuNzMtMy41NjMtMi43NGgtMy40NzMgYzAuMDYxIDMuNyAzIDUuNSA3IDUuNDgyYzMuMjU5IDAgNy4wMzYtMS4zNyA3LjAzNi01LjExN0MxNTEuOTE4IDE1LjggMTQ5LjQgMTQuOSAxNDYuOCAxNC4zIi8+PHBhdGggZmlsbD0iI0ZGRkZGRiIgZD0iTTQ0Ljc5NCAxLjg0aC00LjA1MWwtMy4zMDggOC42MmwtNS4wMzggMTMuMTI3aDMuOTI5bDIuMDQyLTUuNzU2aDguNjhsMi4wNDEgNS43NTZoNC4wODFsLTQuMjc4LTExLjEwNyBMNDQuNzk0IDEuODR6IE0zOS40MDIgMTQuOTM4bDEuMzUtMy44MzdsMS45MzktNS41MTRoMC4wOTJsMi4xODIgNi4yNjFsMS4wNzggMy4wODlIMzkuNDAyeiIvPjxwYXRoIGZpbGw9IiNGRkZGRkYiIGQ9Ik02NS44MSA5Ljg4MWgtMC4wNmMtMS4wNjctMS43MzYtMy4yNTktMi40NjgtNS4yNC0yLjQ2OGMtMi45MSAwLTUuNzY5IDEuNzk1LTYuNTg0IDUuOCBjLTAuMTQ5IDAuNzI5LTAuMjM4IDEuNTI0LTAuMjM4IDIuNDAzYzAgNC43IDIuNCA4LjQgNy40IDguNDA2YzEuOTgxIDAgMy45Ni0wLjc2MiA0Ljg3NC0yLjU2aDAuMDYydjIuMTMzaDMuMjg5di04LjY5NCBWMS44NEg2NS44MVY5Ljg4MXogTTY1LjkzMiAxNS42OThjMCAyLjc0Mi0xLjMxIDUuNTczLTQuNDE3IDUuNTczYy0zLjAxNSAwLTQuMzU0LTIuNjc5LTQuMzU0LTUuMzkxIGMwLTAuNzU3IDAuMDg1LTEuNTE2IDAuMjY5LTIuMjI1YzAuNTAzLTEuOTQ0IDEuNzU5LTMuNTAxIDQuMTQ3LTMuNTAxYzIuMzc5IDAgNCAxLjYgNC4zIDQuNCBDNjUuOTA4IDE0LjkgNjUuOSAxNS4zIDY1LjkgMTUuNyIvPjxwYXRoIGZpbGw9IiNGRkZGRkYiIGQ9Ik04NC40MiA5Ljg4MWgtMC4wNjFjLTEuMDY2LTEuNzM2LTMuMjU5LTIuNDY3LTUuMjM4LTIuNDY3Yy0zLjM0NSAwLTYuNjIxIDIuMzY2LTYuODA2IDcuNyBjLTAuMDA1IDAuMTU2LTAuMDE3IDAuMzA3LTAuMDE3IDAuNDY5YzAgNC43IDIuNCA4LjQgNy40IDguNDA2YzEuOTc5IDAgMy45NTgtMC43NjIgNC44NzMtMi41NmgwLjA2MXYyLjEzM2gzLjI5di03LjU4IFYxLjg0SDg0LjQyVjkuODgxeiBNODQuNTM3IDE1Ljg3OGMtMC4wNTYgMi42ODQtMS4zNzEgNS4zOTQtNC40MSA1LjM5NGMtMy4wMTcgMC00LjM1Ni0yLjY3OS00LjM1Ni01LjM5MSBjMC0wLjE2MyAwLjAwNC0wLjMyNyAwLjAxMi0wLjQ4OWMwLjEyOS0yLjY2OCAxLjMzMy01LjIzNiA0LjQwNi01LjIzNmMyLjY4IDAgNC40IDIuMSA0LjQgNS41IEM4NC41NDMgMTUuOCA4NC41IDE1LjggODQuNSAxNS45Ii8+PHBvbHlnb24gZmlsbD0iI0ZGRkZGRiIgcG9pbnRzPSI5My40LDUuMSAxMDAuMyw1LjEgMTAwLjMsMTYuMiAxMDAuMywyMy42IDEwNC4xLDIzLjYgMTA0LjEsMTYuMiAxMDQuMSw1LjEgMTExLDUuMSAxMTEsMS44IDkzLjQsMS44Ii8+PHBhdGggZmlsbD0iI0ZGRkZGRiIgZD0iTTEyMi4wNTQgNy40MTRjLTIuMDcgMC0zLjg2NyAxLjA2Ni00LjcyMSAyLjQ5N2gtMC4wNjFWMS44NEgxMTMuOHYxNC4yMDZ2Ny41NDFoMy40NzN2LTcuNjY1di0xLjYyNCBjMC0yLjMxNSAxLjQ5Mi00LjE0MyAzLjgwOC00LjE0M2MyLjA0MSAwIDMgMS4xIDMuMSAzLjUzM3YxLjg5MnY4LjAwN2gzLjQ3M3YtOC4yM3YtMi41ODIgQzEyNy42MjggOS4yIDEyNS41IDcuNCAxMjIuMSA3LjQiLz48cmVjdCB4PSIxMzEuNSIgeT0iMS44IiBmaWxsPSIjRkZGRkZGIiB3aWR0aD0iMy41IiBoZWlnaHQ9IjMuMyIvPjxwb2x5Z29uIGZpbGw9IiNGRkZGRkYiIHBvaW50cz0iMTMxLjUsMTUuMSAxMzEuNSwyMy42IDEzNSwyMy42IDEzNSwxNC44IDEzNSw3LjggMTMxLjUsNy44Ii8+PC9zdmc+'); background-repeat: no-repeat; width: 152px; height: 26px; line-height: 26px; padding: 0; text-indent: -9999em; overflow: hidden; float: left; zoom: 1; z-index: 2; opacity: 1; } body > header .addthis-logo:hover { opacity: .75; } body > header .container { position: relative; max-width: 1280px; margin: 0 auto; font-family: "Lato","Open Sans Light","helvetica neue",helvetica,arial,sans-serif; font-weight: 300; font-size: 3.2em; color: #fff; z-index: 1; } body > header .page-title { padding: 100px 0 40px 0; text-align: center; color: #fff; } body > header h1 { margin: 0 0 30px; padding: 0; text-shadow: 0 1px rgba(0,0,0,.5); line-height: 1; font-size: 3.2em; font-weight: 700; color: #fff; opacity: 0; opacity: 1\9; -webkit-animation: fadein .6s .5s 1 forwards ease-in; -moz-animation: fadein .6s .5s 1 forwards ease-in; -ms-animation: fadein .6s .5s 1 forwards ease-in; -o-animation: fadein .6s .5s 1 forwards ease-in; animation: fadein .6s .5s 1 forwards ease-in; cursor: default; } body > header h1 a:link, body > header h1 a:visited, body > header h1 a:hover { display: block; border: none !important; text-decoration: none !important; font-weight: 700 !important; color: #fff !important; } /* HEADER SEARCH ---------------------------------------------------------- */ body > header .header-right { position: relative; top: 25px; right: 5%; float: right; z-index: 2; } body > header .header-right a { display: inline-block; text-decoration: none; text-transform: uppercase; margin: 8px 0 0 20px; outline: none; font-size: 14px; color: #fff; float: left; opacity: 1; } body > header .header-right a:hover { text-decoration: none; opacity: .5; } body > header .support-search-big { background: none !important; } body > header #support-search { position: relative; display: inline-block; margin-left: 20px; } body > header #support-search #q { background: #fff; border: none; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; width: 160px; height: 32px; line-height: 32px; font-weight: 300; font-size: 16px; padding-left: 25px; margin-bottom: 5px; outline: none; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; color: #444; } body > header #support-search #q:focus { width: 280px; } body > header #support-search-submit { position: absolute; top: 10px; left: 10px; right: auto; background: url('https://web.archive.org/web/20140702135923im_/http://assets3.desk.com/images/portal/search.gif') no-repeat; border: 0; width: 13px; height: 18px; padding: 0; margin: 0; overflow: hidden; text-indent: 900px; cursor: pointer; } body > header .question-small { padding: 2px 8px; font-size: 12px; font-weight: 300; color: #999; color: rgba(255,255,255,.5); cursor: default; } /* FOOTER ---------------------------------------------------------- */ body > footer { background: #363432; margin-bottom: -1px; padding: 1.5em 0 2em 0; color: #ccc; color: rgba(255,255,255,.5); } body > footer p { margin: 0; padding: 0 200px 2px 0; font-family: "lato","helvetica neue",helvetica,arial,sans-serif !important; font-weight: 300 !important; font-size: 14px !important; color: #fff !important; color: rgba(255,255,255,.5) !important; } body > footer p a:link, body > footer p a:visited { color: #fff; color: rgba(255,255,255,.75); } body > footer .btn-getstarted { position: absolute; top: 0; right: 15px; display: inline-block; background: #fff; border-radius: 16px; height: 33px; line-height: 33px; padding: 0 16px; margin: 5px 10px 0 0; text-transform: uppercase; font-weight: 600; color: #333; float: right; } body > footer .btn-getstarted:hover { background: #FE6D4C; text-decoration: none; color: #fff; } /* MAIN CONTENT ---------------------------------------------------------- */ #company-support-portal { background-color: #ecebe8; background: -webkit-radial-gradient(circle,#f9f9f9,#e2e0dc); background: -moz-radial-gradient(circle,#f9f9f9,#e2e0dc); background: -ms-radial-gradient(circle,#f9f9f9,#e2e0dc); margin: 0; padding: 10px 0 0; line-height: 1.5em; } .wrapper { position: relative; max-width: 1280px; width: 90%; margin-right: auto; margin-left: auto; padding: 50px 15px; line-height: 1.5em; } .container-fluid { position: relative; max-width: 1280px; width: 90%; margin-right: auto; margin-left: auto; padding-left: 15px; padding-right: 15px; } .content-title { padding: 60px 0; text-align: center; } .content-title:first-of-type { padding-top: 0; } .content-title h2, .content-title h3 { margin: 0; padding: 0; font-size: 3em; line-height: 1em; cursor: default; } .topic-block, .topic-block-narrow { width: 33%; padding: 0 20px 40px; float: left; } .topic-block h4, .topic-block-narrow h4 { margin-bottom: 10px; } #support-main, #support-main-index { padding: 0 85px 50px 15px; min-height: 250px; margin: 0 auto; line-height: 1.8em; } #support-main { width: 80%; } #support-main.support-main { float: left; } #support-main h3 { margin: 20px 0; padding: 0; line-height: 1em; font-size: 3em; } #support-main .content { font-size: 1.2em; line-height: 1.5em; } #support-main .article-content { min-height: 380px; } #support-main .article-content h2 { margin: 2em 0 !important; font-size: 2em; } #support-main .article-content h3 { margin: 2em 0 1em 0 !important; font-size: 1.5em; } #support-main .article-content h2:first-of-type, #support-main .article-content h3:first-of-type { margin-top: 0 !important; } #support-main .title h3 { margin: 0 0 20px 0 !important; } #support-main .meta { margin: 4em 0; font-size: .8em; } #support-main .meta .name.agent { background: #f8694d; } #support-main .meta span { display: inline-block; margin-right: 1em; cursor: default; } #support-main .title .addthis_toolbox { height: 32px; margin-bottom: 2em; margin-top: 1em; /*position: relative; top: -50px; float: right;*/ } #support-main a.addthis_button_expanded { -webkit-transition: none !important; -moz-transition: none !important; -o-transition: color 0 ease-in; transition: none !important; } #support-main .article-content .full-width { width: 100%; max-width: 900px; } #support-main .article-content .full-width { border: 1px solid #ccc; } #support-main pre.prettyprint { /* default skin */ background: #fff; border-color: #c7c5bf; padding: 10px; margin: 10px 0; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -ms-word-break: break-all; word-break: break-all; word-wrap: break-word } #support-main b, #support-main strong, #support-main dt { color: #2b2b2b; } #support-main p { margin: 20px 0; padding: 0; line-height: 1.5em !important; font-weight: 300 !important; } #support-main dt { margin: 2em 0 0; font-weight: 700; } #support-main ul, #support-main ol { margin: 20px 0; } #support-main ul li, #support-main ol li { margin: 0 0 0 22px; padding: 0 0 5px 0; } #support-main h2 + ul, #support-main h3 + ul { margin: 0; } #support-main code, #support-main samp { /*font-family: Inconsolata, monospace, sans-serif;*/ font-weight: 300; color: #a0441c; } #support-main table { display: table; border-collapse: separate; width: 100%; } #support-main table thead th { border-bottom: 3px solid #a09d96; padding: 10px 0; text-align: left; color: #2b2b2b; } #support-main table tbody td { padding: 10px 0; word-break: break-all; word-break: break-word; font-size: .9em; } #support-main table tbody tr:nth-child(odd) { background: rgba(255,255,255,.4); } /* SUPPORT SIDE */ #support-side { width: 20%; padding-top: 30px; float: right; } #support-side #post-question-submit { height: 48px; line-height: 48px; min-width: 200px; margin-bottom: 2em; padding: 0; font-size: 16px; } #support-side h3 { margin-bottom: 20px !important; } #breadcrumbs { position: relative; top: -25px; } .atm-s a, #at_hover.atm-s a { font-family: helvetica,arial,sans-serif !important; } /* Top Content Search Form */ #support-search { position: relative; } #support-search-submit { position: absolute; top: 0; right: 0; background: #FE6D4C; border: none; border-radius: 0 4px 4px 0; height: 48px; line-height: 48px; padding: 0 20px; font-weight: 300; font-size: 16px; color: #fff; cursor: pointer; } #q2 { background: #fff; border: 1px solid #ccc; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; width: 99%; width: calc(100% - 90px); height: 48px; line-height: 48px; font-weight: 300; font-size: 16px; color: #444; } #question-mask2 { display: none; } /* RATE ARTICLE */ #rate_article { margin: 2em 0; } #rate_article > div { display: inline-block; } #rate_article .rate-link-down { margin-left: 2em; } #rate_article a { display: inline-block; background: #f8694d; border-radius: 3px; padding: 0 12px; margin-right: .5em; font-size: 1em; color: #fff; } #rate_article a:hover { background: #2b2b2b; border: none !important; text-decoration: none; } /* SEARCH DROPDOWN-RESULTS */ .ui-autocomplete { border-color: #a09d96; left: auto !important; right: 5%; padding: 0; } .ui-menu .ui-menu-item a { border-radius: 0; } /* .ui-menu .ui-menu-item:nth-child(odd) { background: #fbfaf6 } .ui-menu .ui-menu-item a { border-radius: 0; border: none; padding: 5px; } .ui-autocomplete a:hover, .ui-autocomplete a.ui-state-hover, li.featured a, .highlight { background: #e8f5f8 !important; border-color: #e8f5f8 !important; } */ .ui-menu-item .ui-autocomplete .article-autocomplete-subject { font-family: inherit !important; font-size: 1.1em; font-weight: 600; color: #f8694d !important; } .ui-menu-item .article-autocomplete-body { font-family: inherit !important; font-size: 1.1em; } /* SEARCH RESULTS */ #search-results { margin: 4em 0 0; } #search-results li { /* list-style: none; */ padding: 1em !important; margin: 0 !important; } #search-results li:nth-child(odd) { background: rgba(255,255,255,.4); } #search-results h4 a { font-weight: 700; } #search-results .meta { margin: 0; } #search-results .meta span { margin-right: 1em; } /* PAGINATION */ .pagination { margin: -2em 0 3em 0; } .pagination .current { display: inline-block; background: #363432; border: 1px solid ##363432; border-radius: 3px; min-width: 30px; margin: 0 5px; text-align: center; font-style: normal; color: #fff; } .pagination > a { display: inline-block; background: none; border: 1px solid rgba(255,255,255,.0); border-radius: 3px; min-width: 30px; margin: 0 5px; text-align: center; font-style: normal; } .pagination > a:hover { background: #f8694d; border-color: #f8694d; text-decoration: none; color: #fff; } .pagination .disabled { cursor: default; } /* QUESTIONS */ .question-details { margin-bottom: 4em; } .question-details h3 { margin: 0 !important; } .question-details .meta { margin: 1em 0 2em 0 !important; } .question .meta .name { display: inline-block; background: #a9d043; border-radius: 12px; margin-right: .5em; padding: 0 8px 3px 8px; line-height: 20px; font-weight: 300; color: #fff; cursor: default; } .question-ask { position: relative; padding-left: 80px; } .question .gravatar-wrapper { position: absolute; left: 0; } .question .gravatar-wrapper img { border: 1px solid #c7c5bf; border-radius: 3px; } #support-main .answer-details .meta { margin: 10px 0 0; padding-bottom: 1em; } .question .answer-details .meta .name { background: #a09d96; } .question .question-details .gravatar-wrapper { top: 0; } .question .replies { border-top: 3px solid #a09d96; padding-top: 2em; } .question .reply { position: relative; border-bottom: 1px solid #c7c5bf; padding: 40px 0 40px 80px; } .question .reply .gravatar-wrapper { top: 4px0; } .question .answer-body { padding-bottom: 2em; } .question .answer-rating { text-align: right; font-size: .8em; } .question .answer-rating > div { display: inline-block; margin-left: 1.5em; } .question .answer-rating > div span { cursor: default; } .question .answer-rating a:link, .question .answer-rating a:visited { display: inline-block; background: transparent; border: 1px solid #c7c5bf; border-radius: 3px; padding: 0 12px; margin-right: .5em; font-size: 1em; color: #66625b; } .question .answer-rating a:hover { background: #2b2b2b; border-color: #2b2b2b !important; text-decoration: none; color: #fff; } .question .agent-answer-label { color: #000; } .question .best-answer-green { position: absolute; top: 10px; right: 10px; background: #a9d043; border-radius: 16px; padding: 0 12px; font-size: 14px; color: #fff; cursor: default; } .question .best-answer-green a { display: block; color: #fff; cursor: pointer; } #question-best-answer { background: rgba(255,255,255,.6); } #question-best-answer .reply { border-bottom: none; } #support-main .form-notice { margin-bottom: 4em; } /* SUBMIT QUESTION */ #form { margin: 20px 0 50px 0; } #form .input-button { margin-top: -125px; float: right; } #form .input-button input[type="submit"] { position: relative; top: -138px; height: 120px; line-height: 120px; } .input-block { position: relative; background: #eeedea; border: 1px solid #dad7d0; border-radius: 4px; margin-bottom: 10px; padding: 20px; } .input-block.required:after { content: "required"; position: absolute; top: 10px; right: 10px; background: #ebccd1; border-radius: 12px; padding: 0 12px; line-height: 18px; text-transform: uppercase; font-size: 11px; font-weight: 300; color: #a94442; } .input-block label { display: block; font-weight: 700; color: #2b2b2b; } .input-block input[type="text"], .input-block input[type="email"], .input-block input[type="url"], .input-block textarea { background: #fff; border: 1px solid #dad7d0; border-radius: 3px; width: 100%; height: 48px; line-height: 48px; padding: 0 10px; outline: none; font-size: 24px; color: #2b2b2b; } .input-block input[type="text"]:focus, .input-block input[type="email"]:focus, .input-block input[type="url"]:focus, .input-block textarea:focus { border-color: #adaba6; } .input-block textarea { min-height: 160px; } .input-footer { position: relative; min-height: 115px; padding-top: 40px; } .input-footer input[type="submit"] { position: absolute; top: 40px; right: 0; height: 113px; line-height: 113px; } .recaptchatable { background: #fff; border: 1px solid #dad7d0 !important; } .recaptchatable a { font-size: 12px; color: #999 !important; } .recaptchatable #recaptcha_image { border: none !important; } #recaptcha_widget_div { width: 440px; margin-top: 2em; } #recaptcha_response_field { border-color: #dad7d0 !important; padding: 5px; outline: none; } #recaptcha_response_field:focus { border-color: #adaba6 !important; } .faux-file-field { padding: 10px 0; } /* TOGGLE */ #toggle .nav-tabs { height: 48px; border-bottom: 1px solid #666; margin: 1.5em 0; padding: 0 10px; } #toggle .nav-tabs a { position: relative; display: inline-block; background: none !important; border: none; height: 48px; line-height: 48px; padding: 1px 25px; } #toggle .nav-tabs a.active { background: none !important; border-left: 1px solid #666; border-right: 1px solid #666; border-top: 1px solid #666; border-bottom: 1px solid #ecebe8; border-radius: 4px 4px 0 0; padding: 0 25px; color: #000; } #toggle .nav-tabs a:hover { background: none !important; color: #2b2b2b !important; } #toggle .nav-tabs a.active:hover { color: #2b2b2b !important; } /* MY CASES */ table.mycases { width: 100%; border: 1px solid #dad7d0; border-collapse: collapse; border-spacing: 1px; } table.mycases thead th { border-bottom: 2px solid #a09d96; padding: 10px; font-weight: bold; font-size: .8em; text-align: left; color: #2b2b2b; } table.mycases tbody tr:nth-child(odd) { background-color: #fff; } table.mycases tbody tr:nth-child(even) { background-color: #f3f2ee; } table.mycases tbody td { border-bottom: 1px solid #dad7d0; padding: 8px 10px; vertical-align: top; border-collapse: collapse; -ms-word-break: break-all; word-break: break-all; word-break: break-word; line-height: 1.5em; font-size: .8em; } table.mycases tbody td td { border: none; } /* COMMON */ h1,h2,h3,h4,h5,h6 { color: #2b2b2b; cursor: default; } hr { border-top: 1px solid #c7c5bf; border-bottom: none; height: 1px; margin: 20px 0; overflow: hidden; } .pill-new { display: inline-block; background: #51c0df; border-radius: 12px; vertical-align: super; padding: 0 8px; line-height: 16px; font-weight: 300; font-size: 11px; color: #fff; cursor: default; } .bluebox { background: #d9edf7; border: 1px solid #bce8f1; border-radius: 3px; margin: 2em 0; padding: 1em; color: #31708f; } .pic-full { border: 1px solid #a09d96; width: 100%; } .view-more:link, .view-more:visited { /* color: #66625b; */ } b,strong { color: #2b2b2b; } .clear { clear: both; } .mt0 { margin-top: 0 !important; } /* MEDIA QUERIES ---------------------------------------------------------- */ @media only screen and (max-width: 479px) { body > header { min-height: 200px; } body > header h1 { font-size: 64px; } body > header .addthis-logo { width: 32px; } body > header #support-search #q:focus { widows: 240px; } body > header .question-small { display: none !important; } .content-title h2, .content-title h3 { font-size: 2em; } .topic-block, .topic-block-narrow { width: 100%; } #support-main, #support-side { width: 100%; padding: 15px; } #post-question-submit { padding: 0 32px; } body > footer .btn-getstarted { position: relative; top: 10px; right: auto; left: 0; float: none; } } </style>  <style type="text/css"> /* LINK COLOR */ a{ color: # !important; } /* BODY STYLES */ body{ font-family: Lucida Grande,Verdana,Arial,sans-serif !important; background: #F4F4F4 !important; color: #000000 !important; } .ui-autocomplete a:hover, .ui-autocomplete a.ui-state-hover, li.featured a, .highlight { background: #FFFAE1 !important; background-color: #FFFAE1 !important; } #support-main h5 a, #toggle .active { background: #E5E5E5 !important; color: #535353 !important; } #support-main .dashboard h5 a:hover, #toggle a:hover { background: #254689 !important; color: #ffffff !important; } #toggle a { background: #ffffff !important; } #form label.invalid { color: #FF0000 !important; } /* HEADER BACKGROUND COLOR */ #company-header{ background: #000000 !important; } /* TITLE BACKGROUND COLOR */ #support-header{ background: #E5E5E5 !important; } #support-header h2{ text-shadow: 0 1px 0 #ffffff !important; } #breadcrumbs{ color: #000000 !important; } /* FORM BACKGROUND COLOR */ .support-body, .question-body, #form, .pagination, .reply, .condensed{ background: #ffffff !important; } /* TEXT COLOR */ p{ font: 14pt Lucida Grande,Verdana,Arial,sans-serif !important; color: #535353 !important; } /* HEADING TEXT COLOR */ h2, h3, h4, h5{ color: #000000 !important; font-family: Lucida Grande,Verdana,Arial,sans-serif !important; } .ui-autocomplete{ background: #ffffff !important; font: 10pt Lucida Grande,Verdana,Arial,sans-serif !important; } .ui-autocomplete .article-autocomplete-subject{ color: #254689 !important; font: 10pt Lucida Grande,Verdana,Arial,sans-serif !important; } .article-autocomplete-body{ color: #666666 !important; font: 10pt Lucida Grande,Verdana,Arial,sans-serif !important; font-size: 90% !important; } .support-search-big #support-search-submit, #question_submit, #email_submit, #chat_submit, #answer_submit{ background: # url(/web/20140702135923im_/http://support.addthis.com/customer/portal/articles/381236-custom-buttons) !important; color: # !important; } .support-search-big{ background: #E5E5E5 !important; } /* Override for jquery spinner position */ .ui-autocomplete-loading { background-position: 85% !important; } </style> <style type="text/css"> /* CUSTOM CSS OVERRIDES */ body { position: relative; background: #ecebe8; margin: 0; padding: 0; font-family: "lato","helvetica neue",helvetica,arial,sans-serif; font-size: 16px; font-weight: 300; color: #66625b; } a:link, a:visited { font-family: "lato","helvetica neue",helvetica,arial,sans-serif !important; text-decoration: none; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; font-weight: 300; color: #f8694d; } a:hover { text-decoration: underline; color: #d7492e; } h2, h3, h4, h5 { font-family: "lato","helvetica neue",helvetica,arial,sans-serif !important; color: #2b2b2b !important; margin-bottom: 20px !important; cursor: default; } div, p, li { font-family: "lato","helvetica neue",helvetica,arial,sans-serif !important; color: #66625b; } b,strong { color: #2b2b2b; } input[type="submit"] { background: #FE6D4C; border: none; border-radius: 4px; height: 64px; line-height: 64px; outline: none; margin: 0 auto; padding: 0 80px; font-weight: 300; font-size: 24px; color: #fff; cursor: pointer; -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; transition: all 0.2s ease; } input[type="submit"]:hover { background: #e75a3a; } .support-body, .question-body, #form, .pagination, .reply, .condensed { background: none !important; } </style>  </head> <body> <div id="flash" class="flash_html"><div class="agent_notifier_msg a-flash flash_notice"> </div> </div> <header> <a class="addthis-logo" href="//web.archive.org/web/20140702135923/http://www.addthis.com/" title="AddThis">AddThis</a> <div class="header-right"> <form action="/web/20140702135923/http://support.addthis.com/customer/portal/articles/search" method="get" id="support-search" class="support-search-small"> <input id="q" maxlength="100" name="q" type="text" value=""/> <div id="question-mask" class="question-small">Enter a search term here.</div> <input id="support-search-submit" type="submit" value="Search"/> </form> </div> <div class="container page-title"> <h1><a href="/web/20140702135923/http://support.addthis.com/" title="AddThis Support">Support</a></h1> </div> </header> <div id="company-support-portal"> <div class="wrapper">   <div id="support-main" class="support-main"> <div id="breadcrumbs"> <a href="/web/20140702135923/http://support.addthis.com/">Home</a> &rsaquo; <a href="/web/20140702135923/http://support.addthis.com/customer/portal/topics/38604-customizing-addthis/articles">Customizing AddThis</a> &rsaquo; Custom Buttons </div> <div class="support-body"> <div class="content article"> <div class="title"> <h3>Custom Buttons</h3> <div class="addthis_toolbox addthis_default_style addthis_32x32_style"> <a class="addthis_button_preferred_1"></a> <a class="addthis_button_preferred_2"></a> <a class="addthis_button_preferred_3"></a> <a class="addthis_button_compact"></a> </div> </div> <div class="article-content"> <div class="mb20">• <a href="#different-image">Different Image</a><br/> • <a href="#image-and-text">Image and Text</a><br/> • <a href="#just-text">Just Text</a><br/> • <a href="#api">API Reference</a></div> <p class="note">These instructions only work with native AddThis buttons. For information about customizing third-party buttons such as Facebook Like or Tweet see our <a href="/web/20140702135923/http://support.addthis.com/customer/portal/articles/381237-third-party-buttons">third-party button reference</a>.</p> <p>You can use any image for your AddThis buttons. You can also use text, or a combination of image and button.</p> <hr/>  <h3>Different Image</h3> <p>Using a different image for an AddThis button is as easy as putting the <img> tag inside the button. For example:</p> <pre class="prettyprint"> <a class="addthis_button_compact"> <img src="http://s7.addthis.com/static/btn/sm-plus.gif" width="16" height="16" border="0" alt="Share" /></a> </pre> <div class="tryit"><a class="addthis_button_compact"><img align="top" alt="Share" border="0" height="16" src="https://web.archive.org/web/20140702135923im_/http://s7.addthis.com/static/btn/sm-plus.gif" width="16"/></a></div>   <p>Just replace http://s7.addthis.com/static/btn/sm-plus.gif with the URL of the image you'd like to use for that button</p> <hr/><br/> <a name="image-and-text"></a> <h3>Image and Text</h3> <p>Using an image with text is as easy as putting the text you'd like to use next to the <img> tag.</p> <pre class="prettyprint"> <a href="http://www.addthis.com/bookmark.php" class="addthis_button" style="text-decoration:none;"> <img src="http://s7.addthis.com/static/btn/sm-plus.gif" width="16" height="16" border="0" alt="Share" /> Share</a> </pre> <div class="tryit"><a class="addthis_button" href="https://web.archive.org/web/20140702135923/http://www.addthis.com/bookmark.php" style="text-decoration:none;"><img align="top" alt="Share" border="0" height="16" src="https://web.archive.org/web/20140702135923im_/http://s7.addthis.com/static/btn/sm-plus.gif" width="16"/> Share</a></div>   <hr/><br/> <a name="just-text"></a> <h3>Just Text</h3> <p>Having a button with just text requires you to put it inside some kind of tag. We recommend a <span> tag.</p> <pre class="prettyprint"> <a class="addthis_button_compact"><span>Bookmark or Share</span></a> </pre> <div class="tryit"><a class="addthis_button_compact"><span>Bookmark or Share</span></a></div>   <hr/><br/> <a name="api"></a> <h3>API Reference</h3> <p>Check out the full <a href="/web/20140702135923/http://support.addthis.com/customer/portal/articles/381263-addthis-client-api">Client API specification</a> to learn more.</p> <div class="meta">Last Updated: Sep 30, 2013 04:04PM EDT</div> </div> <div id="rate_article_container" style="display:none;"> <div id="rate_article"> <div> <a href="https://web.archive.org/web/20140702135923/http://support.addthis.com/customer/en/portal/articles/381236/rate?rating=1" class="rate_link" data-method="post" data-remote="true" rel="nofollow"> Yes </a> <span> I found this article helpful </span> </div> <div class="rate-link-down"> <a href="https://web.archive.org/web/20140702135923/http://support.addthis.com/customer/en/portal/articles/381236/rate?rating=0" class="rate_link" data-method="post" data-remote="true" rel="nofollow"> No</a> <span> I did not find this article helpful </span> </div> </div> </div> <script> $(document).ready(function() { $.get('/customer/en/portal/articles/381236/is_rateable.json', function(json) { if (json.is_rateable) { $("#rate_article_container").show(); } }); }); </script> </div> </div>  <div id="footer"> <br/> <a href="https://web.archive.org/web/20140702135923/http://www.desk.com/">Customer service software</a> powered by Desk.com </div> </div>   <div id="support-side">   <h3>General Topics</h3> <div class="kb"><a href="/web/20140702135923/http://support.addthis.com/customer/portal/topics/174668-getting-started/articles">Getting Started</a></div> <div class="kb"><a href="/web/20140702135923/http://support.addthis.com/customer/portal/topics/57025-plugins-for-blogs-cms/articles">Plugins for Blogs & CMS</a></div> <div class="kb"><a href="/web/20140702135923/http://support.addthis.com/customer/portal/topics/38604-customizing-addthis/articles">Customizing AddThis</a></div> <div class="kb"><a href="/web/20140702135923/http://support.addthis.com/customer/portal/topics/57074-buttons-counters/articles">Buttons & Counters</a></div> <div class="kb"><a href="/web/20140702135923/http://support.addthis.com/customer/portal/topics/38611-understanding-analytics/articles">Analytics</a></div> <div class="kb"><a href="/web/20140702135923/http://support.addthis.com/customer/portal/topics/90823-accounts-settings/articles">Accounts & Settings</a></div> <div class="kb"><a href="/web/20140702135923/http://support.addthis.com/customer/portal/topics/132578-toolbars/articles">Sharing Tools and Toolbars</a></div> <div class="kb"> </div> <h3>Developers</h3> <div class="api"><a href="/web/20140702135923/http://support.addthis.com/customer/portal/articles/381262-addthis-api-and-sdks">API and SDK Overview</a></div> <div class="api"><a href="/web/20140702135923/http://support.addthis.com/customer/portal/articles/381263-addthis-sharing-button-api">Sharing Button API</a></div> <div class="api"><a href="/web/20140702135923/http://support.addthis.com/customer/portal/articles/1200473-smart-layers-api">Smart Layers API</a> <small class="pill-new">New!</small></div> <div class="api"><a href="/web/20140702135923/http://support.addthis.com/customer/portal/articles/524574-welcome-bar-api">Welcome Bar API</a></div> <div class="api"><a href="/web/20140702135923/http://support.addthis.com/customer/portal/articles/521730-trending-content-box-api">Trending Content Box API</a></div> <div class="api"><a href="/web/20140702135923/http://support.addthis.com/customer/portal/articles/381268-content-feeds">Content Feeds</a></div> <div class="api"><a href="/web/20140702135923/http://support.addthis.com/customer/portal/articles/381264-addthis-analytics-api">Analytics API</a></div> <div class="api"><a href="/web/20140702135923/http://support.addthis.com/customer/portal/articles/381265-addthis-sharing-endpoints">Sharing Endpoints</a></div> <div class="api"><a href="/web/20140702135923/http://support.addthis.com/customer/portal/articles/381266-services-api-beta-?t=89322">Services API</a></div> <div class="api"><a href="/web/20140702135923/http://support.addthis.com/customer/portal/articles/381267-addthis-web-service-framework">Web Service Framework</a></div> <div class="api"><a href="/web/20140702135923/http://support.addthis.com/customer/portal/articles/381270-addthis-for-ios-quick-start-guide">iOS</a></div> <div class="api"><a href="/web/20140702135923/http://support.addthis.com/customer/portal/articles/381271-addthis-for-android-quickstart-guide">Android</a></div> <div class="api"><a href="/web/20140702135923/http://support.addthis.com/customer/portal/articles/381274-flash-installation">Flash</a></div> </div> <div style="clear:both;"></div> </div> </div>  <div id="fb-root"></div>  <div id="desk-external-variables-header" class="desk-external-variables"> <div id="read_only"></div> <div id="site-default_mailbox">help@addthis.com</div> <div id="desk_javascript_host">http://assets02.desk.com/</div> <div id="twitter_enabled">false</div> <div id="twitter_username">desk</div> <div id="system-snippets-loading">Loading</div> <div id="system-snippets-seconds_ago">seconds ago</div> <div id="system-snippets-a_minute_ago">a minute ago</div> <div id="system-snippets-minutes_ago">minutes ago</div> <div id="system-snippets-an_hour_ago">an hour ago</div> <div id="system-snippets-hours_ago">hours ago</div> <div id="system-snippets-a_day_ago">a day ago</div> <div id="system-snippets-days_ago">days ago</div> <div id="system-snippets-about">about</div> <div id="enable_gs">false</div> <div id="system-snippets-invalid_characters_found">Invalid characters found</div> <div id="site-search_autocomplete_articles_url">/customer/en/portal/articles/autocomplete</div> <div id="search-term"></div> </div> <footer> <div class="container-fluid"> <p>Want to choose whether you receive targeted advertising?  Go to our <a href="//web.archive.org/web/20140702135923/http://www.addthis.com/privacy/opt-out">opt-out</a> page.</p> <p>© 2014 AddThis.  Made with Love.</p> <a class="btn-getstarted" href="//web.archive.org/web/20140702135923/http://www.addthis.com/?r=0#widgets">Get Started</a> </div> </footer> <script type="text/javascript" src="//web.archive.org/web/20140702135923js_/http://s7.addthis.com/js/300/addthis_widget.js#pub=at_com"></script> <script src="//web.archive.org/web/20140702135923js_/http://google-code-prettify.googlecode.com/svn/loader/run_prettify.js?autoload=true&skin=default"></script> <script type="text/javascript" src="https://web.archive.org/web/20140702135923js_/http://assets02.desk.com/portal/desk.portal.shared.js"></script> <script type="text/javascript" src="https://web.archive.org/web/20140702135923js_/http://assets02.desk.com/portal/desk.portal.header.js"></script> <script type="text/javascript" src="https://web.archive.org/web/20140702135923js_/http://assets02.desk.com/portal/desk.portal.body.layout_footer.js"></script> </body> </html>

CINXE.COM

AddThis | Custom Buttons