
@font-face {
    font-family:'metric-semibold';
    src:url('http://www.belkin.com/resources/fonts/MetricWeb/MetricWeb-Semibold.eot');
    src:url('http://www.belkin.com/resources/fonts/MetricWeb/MetricWeb-Semibold.eot?#iefix') format('embedded-opentype'),
    url('http://www.belkin.com/resources/fonts/MetricWeb/MetricWeb-Semibold.woff') format('woff'),
    url('http://www.belkin.com/resources/fonts/MetricWeb/MetricWeb-Semibold.ttf') format('truetype'),
    url('http://www.belkin.com/resources/fonts/MetricWeb/MetricWeb-Semibold.svg#webfont') format('svg');
    font-weight:normal;
    font-style:normal;
}

@font-face {
    font-family:'metric-regular';
    src:url('http://www.belkin.com/resources/fonts/MetricWeb/MetricWeb-Regular.eot');
    src:url('http://www.belkin.com/resources/fonts/MetricWeb/MetricWeb-Regular.eot?#iefix') format('embedded-opentype'),
    url('http://www.belkin.com/resources/fonts/MetricWeb/MetricWeb-Regular.woff') format('woff'),
    url('http://www.belkin.com/resources/fonts/MetricWeb/MetricWeb-Regular.ttf') format('truetype'),
    url('http://www.belkin.com/resources/fonts/MetricWeb/MetricWeb-Regular.svg#webfont') format('svg');
    font-weight:normal;
    font-style:normal;
}
div, a, p, h1, body{
	box-sizing: border-box;
}
body {
    margin:0 10px;
	font-family: Arial,Helvetica,sans-serif;
	font-size: 12px;
	line-height: 1.2;
	height:100%;
}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
    border: 0 none;
    margin: 0;
    padding: 0;
    vertical-align: baseline;
}
a img, a:hover img{
     border:none;
}
a {
	color: #ABA6A2;
	outline: medium none;
	text-decoration: none;
}
/*a:visited {
color: #73D34B; /* Belkin Green 
}*/
a:hover {
	color: #73D34B; /* Belkin Green */
}
a:focus {
	outline: none;
}
:focus {
	-moz-outline-style: none;
}
*:focus {
	outline: none;
}
/* Improve readability when focused and hovered in all browsers: h5bp.com/h */
a:hover, a:active {
	outline: none;
}

/* CHAT PAGE */

.mainContent{
    width:720px;
    margin:49px auto;
    overflow: hidden;
    min-height: 400px;
}
.main-banner{
    margin-bottom:34px;
}
.welcome-pod{
    width:61%;
    float:left;
    
    padding: 0 56px 0 86px;
    background: url('../img/chat-icon.png') no-repeat 20px 4px;
}
.welcome-pod h1{
    font-family: 'metric-semibold', Arial, sans-serif;
    font-size:20px;
    font-weight: normal;
    margin-bottom: 0;
    text-transform: uppercase;

}
.welcome-pod p{
    font-family: Arial, sans-serif;
    font-size:14px;
    color:#656565;
    margin-top: 0;
}
.chat-pod{
    width:39%;
    float:left;
    border-left:1px solid #a59c95;
}
.chat-pod p{
    padding-left:10px;
}
.no-agent{
    border: none; 
    pointer-events: none;
    cursor: default;
    color: #a49b92;
    text-decoration: none;
    display: block;
    padding: 13px 0;
    font-size: 14px;
}
.agent{
    border: none; 
    cursor: pointer;
    display: inline-block;
    padding: 20px 30px 20px 0;
    font-family: 'metric-semibold', Arial, sans-serif;
    font-size:18px;
    background: url('../img/chat-now-arrow.png') no-repeat right center;
    color:#000;
    text-decoration: none;

}

/* 404 PAGE */

.page-404 {
    text-align: center;
	height:240px;
}
.page-404 h1 {
    color: #000000;
    font-family: metric-semibold,Arial,sans-serif;
    font-size: 34px;
    font-weight: normal;
    text-align: center;
}
.page-404 p {
    color: #000000 !important;
    line-height: 1.5em;
    text-align: center;
}
.footer-sub-links{
	border-top: 1px solid #D7D4CF;
	width:982px;
	margin:30px auto 10px;
}
.footer-sub-links .copyright {
    color: #ABA6A2;
    margin-left: 20px;
	margin-top:10px;
	font-size: 12px;
}
.belkin-logo a{
	width:982px;
	height:62px;
	display:block;
	background:url(https://www.belkin.com/medias/belkin-logo.svg?context=bWFzdGVyfGltYWdlc3wzNDkxfGltYWdlL3N2Zyt4bWx8aW1hZ2VzL2gwOC9oZjgvODg5NzI5NzAyMzAwNi5zdmd8NjA2MWMyOThhNTYxNzZjNDhiZTU3OTRhZjFiNzM0OTI4YmZjNGNkNjAzYzBlZDEwMmFkYjIyYzA2MmEyZWEyOQ) no-repeat 0 0;
	margin: 21px auto 40px;
	text-indent:-9999px;
	border-bottom: 1px solid #E7E6E2;
}
.belkin-logo a:hover {
    background: url(https://www.belkin.com/medias/belkin-logo.svg?context=bWFzdGVyfGltYWdlc3wzNDkxfGltYWdlL3N2Zyt4bWx8aW1hZ2VzL2gwOC9oZjgvODg5NzI5NzAyMzAwNi5zdmd8NjA2MWMyOThhNTYxNzZjNDhiZTU3OTRhZjFiNzM0OTI4YmZjNGNkNjAzYzBlZDEwMmFkYjIyYzA2MmEyZWEyOQ) no-repeat scroll 0 0 transparent;
}
.copy-content{
	width:800px;
	margin:0 auto;
}
.copy-content p{
	font-family:metric-semibold, Arial, sans-serif;
	font-weight:normal;
	font-size:20px;
	text-align:center;
	margin: 10px 20px;
	
}
#tv-spots div.icon {
    margin-top: 35px;
}

div.icon h2 {
    color: #000000;
    font-family: metric-semibold,Arial,sans-serif;
    font-size: 21px;
    font-weight: normal;
    line-height: 1em;
    margin: 0;
    text-transform: uppercase;
}
div.icon {
    background-image: url("img/icon_sprite.gif");
    background-repeat: no-repeat;
    margin: 0;
    min-height: 35px;
    padding: 13px 20px 0 50px;
    width: 418px;
}
.icon-tv {
    background-position: 0 -210px;
}

#tv-spots ol {
    list-style: none outside none;
    margin: 5px 0 0 0;
	overflow: hidden;
    padding: 0px;
}
#tv-spots{
	margin: 0 auto;
	width:375px;
	padding:0px;
}
#tv-spots ol li {
    float: left;
    list-style: none outside none !important;
    margin: 0 0 0 15px;
	list-style-type: square;
    margin-bottom: 10px;
    padding: 0;
}
#tv-spots ol li:first-child{
	margin:0 0 0 0 !important;
}
#tv-spots ol li h3 {
    font-size: 12px;
    text-align: center;
}

@media screen and (max-width: 640px) {
    body{
        padding:0 10px;
    }
    .footer-sub-links, .copy-content, .belkin-logo a{
        width: auto;
    }
    .welcome-pod, .chat-pod{
        float:none;
        width:100%;
    }
    .welcome-pod{
        padding-right:0;
    }
    .chat-pod{
        border-left: 0;
        // border-top: 1px solid #a59c95;
        margin-top: 20px;
        padding-left: 75px;
    }
    .mainContent{
        width: auto;
    }
}