Anybody knows how to create this snippet in vs code or atom?">
<html xmlns="">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="format-detection" content="telephone=no">
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=no;">
<meta http-equiv="X-UA-Compatible" content="IE=9; IE=8; IE=7; IE=EDGE" />

<title>Page title</title>

<style type="text/css">
@import url('');

/* Some resets and issue fixes /
#outlook a { padding:0; }
body{ width:100% !important; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; margin:0; padding:0; }
.ReadMsgBody { width: 100%; }
.ExternalClass {width:100%;}
.backgroundTable {margin:0 auto; padding:0; width:100% !important;}
table td {border-collapse: collapse;}
.ExternalClass * {line-height: 115%;}
End reset */

/*Display Block allows us to stack elements*/
[class="mobile-column"] {display: block;}
/*Some more stacking elements
*[class="mob-column"]{float: none !important; width: 100% !important;}

/*This bit allows us to hide stuff on mobile*/
*[class="hide"]{display: none !important;}

/*This sets element to 100% width and fixes the height too, a god send*/
*[class="100p"]{width: 100% !important; height: auto !important;}

/*This is for when column stack but need to have spacing underneath*/
*[class="condensed"]{padding-bottom: 40px !important; display: block;}

/*This forces the content to be center aligned on mobile*/
*[class="center"]{text-align: center !important; width: 100% !important; height: auto !important;}

/*100 percent width section with 20px padding*/
*[class="100pad"]{width: 100% !important; padding: 20px;}

/*same as above but padding left and right*/
*[class="100pad"]{width: 100% !important; padding: 0 20px 0 20px;}

/*Again same as above but for topand bottom*/
*[class="100padtopbottom"]{width: 100% !important; padding: 20px 0 20px 0;}

@media screen and (max-width: 630px) {



I tried to do as per the instruction but it doesn't get save beyond