#header,#main {padding:0;width:100%;overflow:hidden}
#content,#footer {margin:0 auto;width:100%}
#header,#main,.bottom,.sq,.top,input {width:100%}
body,input {font-family:Helvetica,Arial,sans-serif;font-weight:400}
*,input {margin:0}
#footer,p,a {color:#585858}
.tr:hover,a {text-decoration:none}
.tr:hover,table tr[data-href] {cursor:pointer}
.td,input {text-align:center;vertical-align:middle}
.table,table,td,th {border-collapse:collapse}
#footer,header {position:relative}
#content,#header,#main,.bottom,.converter,.share,header,nav,.leaderboard-bottom {overflow:hidden}
.brand,.value,body,h1,h2,h3,input,table th {font-weight:400}
body {letter-spacing:0;-webkit-font-smoothing:antialiased}
#main {margin:0 auto;background:#F5F5F5}
#header {text-align:center;margin:0 auto;background:#cc3d0e}
#footer {text-align:center;background:#FFF;padding:0}
.sq {float:left;text-align:center}
input {padding:7px;display:inline-block;border:2px solid #DADADA;border-radius:4px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;font-size:28px}
input:focus {border-color:#cc3d0e;box-shadow:none;outline:0}
p {text-align:center;font-size:18px;margin:10px 0}
.center,.left,.right {float:left}
.left,.right {width:45%}
.center {width:10%;text-align:center}
.converter {border:1px solid transparent;padding:1px 3px 0;margin:10px auto;width:95%}
#top-row,.bottom-row {overflow:hidden}
#top-row .center {line-height:56px}
.bottom-row .center h3 {color:#F5F5F5}
#main .converted,.value,a:hover,table tr:hover {color:#cc3d0e}
table {width:100%;margin:30px 0 40px}
table td {text-align:center;width:50%;padding:4px 0}
table th {padding:8px 0}
table,td,th {border:1px solid #CCC}
h1,h2,h3 {text-align:center;color: #222222;margin:50px 15px 25px;}
h1,h2 {font-size:24px}
h3 {font-size:22px}
#main .converted {font-size:36px;margin:0 auto;padding:10px;text-align:center;font-weight:400;display:block;line-height:1.1}
.value {font-size:22px;margin:20px auto 0;text-align:center;display:block}
table tr:hover {background-color:#F5F5F5}
table tr:first-child:hover {background-color:#FFF;color:#9b9b9b}
.convert-button {padding:12px 0;margin:10px 0 0;float:left;text-align:center;border-radius:4px;font-size:20px;color:#FFF;background:#cc3d0e;width:100%}
.convert-button:hover {opacity:0.9;color:#FFF}
.convert-tag {margin:0 0 2px;text-align:center;color:#585858;display:block;width:100%}
#height,#length,#width {float:left}
#height,#length {width:33%}
#width {width:32%;margin:0 1%}
.tags .convert-tag {float:left;font-size:16px}
.tags .convert-tag:first-child,.tags .convert-tag:last-child {width:33%}
.tags .convert-tag:nth-child(2) {width:32%;margin-left:1%;margin-right:1%}
.length-width #length {width:49%!important;float:left;margin-right:1%!important}
.length-width #width {width:49%!important;float:left;margin-left:1%!important;margin-right:0}
.length-width .convert-tag {width:49%!important}
.length-width .convert-tag:nth-child(1) {margin-right:1%}
.length-width .convert-tag:nth-child(2) {margin-left:1%;margin-right:0}
.head,.tr {display:table-row}
.hide-tr {display:none}
.tr:hover {background-color:#F7F7F7}
.td {display:table-cell;border:1px solid #CCC;padding:10px 8px;width:50%;font-size:14px}
.table {display:table;width:99%;border-spacing:15px;margin:20px auto 35px}
nav {width:100%}
.hide {display:none}
input::-webkit-inner-spin-button,input::-webkit-outer-spin-button {-webkit-appearance:none;margin:0}
input[type=number] {-moz-appearance:textfield}
#main span.dimensions {font-size:36px}
nav ul,nav:active ul {display:block;border:0;right:0;width:100%;margin:0 auto;padding:0}
nav ul li {margin:0;list-style:none}
nav ul li a {font-size:18px;color:#FFF}
nav li {text-align:left;padding:10px 15px;margin:0}
nav:hover ul {display:block}
nav {background:#cc3d0e;margin:0 auto;float:left;padding:0;display:none}
.menu-icon {color:#fff;float:left;margin:10px;display:block}
.brand,.brand:hover,a.menu-icon:hover,h1.title,nav ul li a:hover {color:#FFF}
nav ul li:first-child {margin-top:15px}
nav ul li:last-child {display:block;margin-bottom:20px}
header {margin:0 auto}
.social-icon {padding:0 10px}
.share {background:#FFF;margin:0 auto;padding:21px 0;float:left;display:none;width:100%}
.show {display:block}
.wide-skyscraper-left,.wide-skyscraper-right {min-width:160px;height:600px;position:absolute;display:none}
#header-title,.info {overflow:hidden;width:100%}
.wide-skyscraper-left {top:402px;left:-210px}
.wide-skyscraper-right {top:402px;right:-210px}
.info {margin: 0}
.info p {padding:0 20px;line-height:1.5}
#header-title {text-align:left;margin:0 auto;padding:0}
h1.title {margin:16px 15px 13px;font-size:18px;float:left;display:none}
.brand {font-size:24px;float:left;margin:11px 0 11px 5px}
.leaderboard-bottom{margin-top:30px}
.hide{display:none}
.footer {margin:30px 15px;font-size:16px}
.icons{width:252px;overflow:hidden;margin:0 auto}
.share a,.menu-icon,.share-icon {background:url(/img/icons.png) no-repeat;width:32px;height:32px;display:block;text-indent:100%;white-space:nowrap;overflow:hidden}
.share a {margin: 2px 5px;float: left}
.menu-icon,.share-icon {margin:9px}
.menu-icon {float: left}
.share-icon {float: right;}
#facebook-icon {background-position-x:-0px}
#twitter-icon {background-position-x:-96px}
#whatsapp-icon {background-position-x:-32px}
#messenger-icon {background-position-x:-64px}
#pinterest-icon {background-position-x:-128px}
#linkedin-icon{background-position-x:-160px}
#share-icon{background-position-x:-192px}
#menu-icon{background-position-x:-224px}
@media screen and (min-width:768px) {
header, #content,#footer, nav ul,nav:active ul {width:730px;}
.sq-left, .sq-right {width:50%;}
#footer{padding-top:10px} 
.converter {width:70%}
h1.title {display:block}
.hide-tr {display:table-row}
#main .converted {font-size:42px;padding:15px}
h1,h2 {font-size:28px}
h3 {font-size:24px}
.table {margin:30px auto 35px}
.td {font-size:16px}
.hide{display:block}}
@media screen and (min-width:1160px) {
.wide-skyscraper-left,.wide-skyscraper-right {display:block}}