/*
@font-face {
    font-family: 'FoundrySans Demi';
    src: url('/fonts/fs-demi.eot');
    src: url('/fonts/fs-demi.eot?#iefix') format('embedded-opentype'),
         url('/fonts/fs-demi.woff') format('woff'),
         url('/fonts/fs-demi.ttf') format('truetype'),
         url('/fonts/fs-demi.svg#FoundrySansDemi') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'FoundrySans Medium';
    src: url('/fonts/fs-medium.eot');
    src: url('/fonts/fs-medium.eot?#iefix') format('embedded-opentype'),
         url('/fonts/fs-medium.woff') format('woff'),
         url('/fonts/fs-medium.ttf') format('truetype'),
         url('/fonts/fs-medium.svg#FoundrySansMedium') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'FoundrySans Normal';
    src: url('/fonts/fs-normal.eot');
    src: url('/fonts/fs-normal.eot?#iefix') format('embedded-opentype'),
         url('/fonts/fs-normal.woff') format('woff'),
         url('/fonts/fs-normal.ttf') format('truetype'),
         url('/fonts/fs-normal.svg#FoundrySansNormal') format('svg');
    font-weight: normal;
    font-style: normal;
}
*/

/* Hide Door Builder Links
.nshow { display: none !important }
 */
 
.ss { clear: both; padding-top: 1.5em; text-align: center; }
.mo { display: none; }

/*
@media only screen
and (min-device-width : 768px) 
and (max-device-width : 1024px)
and (-webkit-min-device-pixel-ratio: 2) {
    body, nav { font-size: 120% !important }
}


@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 568px) {
    body, nav { font-size: 120% !important }
    #look { display: none }
}
*/

@media print {
    body, p, td, th, li { font-size: 10pt !important }
    h1 { font-size: 24pt !important }
    h2 { font-size: 18pt !important }
    h3 { font-size: 16pt !important }
    h4 { font-size: 14pt !important }
    a { color: #000 !important }

    #banner, #look, #teq, #vis, nav, .fi, article.np, section.right { display: none !important }
    header img, section { margin: 0 inherit !important }
    section.col { width: auto !important; clear: right !important; float: none !important }
    section.col article, article.page { padding: 0 !important }
    footer, footer a { background-color: transparent !important; color: #000 !important }

    .pr { padding-left: 350px !important }
    .pl img { max-height: 100px !important; max-width: 100px !important }
    .cnt, .pl, #pnl_lnk img { max-width: 320px !important }
    #pnl_lnk img, .cnt { max-height: 320px !important }
    .np, .ss { display: none !important }
}

/*
@media screen and (max-width: 999px) {
    nav ul { min-width: 0 !important }
    header article {  }
    section.col { width: auto !important; clear: right !important; float: none !important }
    section.right { margin-left: 0 !important }
    section.col article { padding-left: 40px !important; padding-right: 30px !important }
    .rw { max-width: 405px !important }
    nav.sitemap ul { width: 100% !important }
}

@media screen and (max-width: 713px) {
    #look { display: none }
    #banner { padding-top: 0 !important; height: 244px !important }
    #banner article { bottom: initial !important; top: 20px }
    #banner > div > a { position: absolute !important; bottom: 0 !important; left: 0 !important }
}

@media screen and (max-width: 547px) {
    header article { width: 80% !important }
    section.col article img { max-width: 60% }
    #banner > div > a { display: none !important }
}
*/

article, aside, header, footer, nav, section { display: block }

h1, h2, h3, h4, h5, h6 { font-family: "Foundry Sans W01_n7" }
h4, h5, h6 { font-family: "Foundry Sans W01_n7" }

h1, h2, h3, h4, h5, h6, p, td, th, li {
}

h1 { font-size: 36px; margin-bottom: 0.3em }
h2 { font-size: 26px; margin-bottom: -0.15em }
h3 { font-size: 24px; color: #555 }
h4 { font-size: 18px; color: #003a78 }

h2, p, td, th, li { line-height: 1.5em }

ul { list-style-type: disc }

a > img { border: none }
.clear { clear: both }
.right { float: right; clear: both }
img.left { float: left; margin-right: 10px; margin-bottom: 10px; margin-top: 1em; }


 
#hdmsg { position: absolute; color: #fff; background: #c00; padding: 3px 5px; 
	margin: 15px 3em 0 68px; z-index: 90; }
#hdmsg a { color: #fff; text-decoration: underline; }


/*
a[button=nav], a[button=pre], a[button=cnc] { background: #fff; display: inline-block; padding: 10px; color: #000; transition: 0.4s ease }
a[button=nav]:after { content: ' >'; display: inline-block; padding-left: 0.6em }
a[button=pre]:before { content: '< '; display: inline-block; padding-right: 0.6em }
a[button=cnc]:before { content: 'x '; display: inline-block; padding-right: 0.6em }
a[button]:hover { text-decoration: none; background: #1face5; color: #fff }
*/

a.bnav, a[button] { background: #003a78; display: inline-block; padding: 6px 10px; color: #fff;
	transition: 0.4s ease }
a.bnav:after, a[button=nav]:after { content: ' >'; display: inline-block; padding-left: 0.6em }
a[button=pre]:after { content: ' <'; display: inline-block; padding-left: 0.6em }
a[button=cnc]:after { content: ' x'; display: inline-block; padding-left: 0.6em }
a.bnav:hover, a[button]:hover { text-decoration: none; background: #1face5; color: #fff }

header {  position: relative; }
header a[button] { background: #fff; color: #333 }

.fblk {
	text-align: center;
	width: 142px;
	height: 220px;
	margin: 20px 40px 20px 0;
	float: left;
}

.group:after, section article:after, .cl:after, header article {
  content: '';
  display: table;
  clear: both;
}


label.req:after {
	content: "*";
	color: #c00;
}

span.req, p.req { color: #c00 !important }
span.req { font-size: 140%; cursor: help; font-weight: bold }
p.req {  }

.rq::-webkit-input-placeholder {
    color:    #c00;
}
.rq:-moz-placeholder {
   color:    #c00;
   opacity:  1;
}
.rq::-moz-placeholder {
   color:    #c00;
   opacity:  1;
}
.rq:-ms-input-placeholder {
   color:    #c00;
}



body {
	background: #fff;
	font-family: "Foundry Sans W01_n4";
	font-size: 15px;
	margin: 0;
}

header a[name=top] img { margin: 40px; position: relative; z-index: 210 }

    #banner {
        position: relative;
        background-position: bottom left;
        background-repeat: no-repeat;
        background-size: cover;
        /*
        background-image: url(/images/tmp/header-bg2.jpg);
        height: 14%;
        height: 450px;
        transition: 0.5s ease;
        */
        padding-top: 36%;
        width: 100%;
    }

    #banner > div > a { display: inline-block; font-size: 13px; color: #fff; padding: 5px; text-decoration: none; text-shadow: 1px 1px 2px #000; transition: 0.5s ease }
    #banner > div > a:hover { background: #1face5; text-shadow: none }

    header article, article.hdpnl {
        position: absolute;
        /*
        margin-bottom: -30px !important;
        */
        bottom: 30px;
        left: 0;
        padding: 15px 20px 19px 40px !important;
        width: 265px;
        background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyAQMAAAAk8RryAAAAA3NCSVQICAjb4U/gAAAABlBMVEX///////9VfPVsAAAAAnRSTlMAuyogpzwAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAWdEVYdENyZWF0aW9uIFRpbWUAMDQvMjMvMTSckcqlAAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M0BrLToAAAABJJREFUGJVj+A8GBxhG6UFBAwD3dFBkkOx0PwAAAABJRU5ErkJggg==);
        transition: 0.5s ease;
    }

        header article h2 { line-height: 1em; margin: 0.3em 0 -0.3em 0 }

nav {
    text-align: left;
    font-size: 17px;
    font-family: "Foundry Sans W01_n7"
}

    nav.sitemap { padding: 1em 30px 1em 73px; font-size: 14px; text-align: left }
    nav.sitemap > ul { border-top: 1px solid #333; padding-top: 1em !important }
    nav.sitemap ul { width: 100%; padding: 0 }
    nav.sitemap ul > li { vertical-align: top; margin: 0 4% 1em 0; white-space: nowrap }
    nav.sitemap ul > li:last-child { vertical-align: top; margin-right: 0 }
    nav.sitemap ul ul { text-align: left }
    nav.sitemap ul ul li { display: list-item; margin-bottom: 0 }
    nav.sitemap a { padding: 0 }

    nav.cl { padding-left: 66px }

    nav ul {
        display: inline-block;
        text-align: left;
        list-style: none;
        margin: 0;
        padding: 0;
    }

    nav li {
        display: inline-block;
        margin: 0;
    }

    nav a {
        padding: 7px 7px 8px 7px;
        display: inline-block;
        color: #000;
        text-decoration: none;
    }

        nav a:hover {
            color: #1face5;
        }

    ul.sn {
        font-size: 14px;
        display: none;
        height: auto;
        width: auto;
        max-width: none;
        min-width: 0;        
        position: absolute;
        z-index: 100;
        text-align: left;
        margin-top: -8px;
        padding: 0 5px;
        background: #fff;
        -webkit-box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 1);
        -moz-box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 1);
        box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 1);
    }

        ul.vl { width: 240px }
        ul.vl li { width: 100%; float: none; border-bottom: 1px solid #ddd }
        ul.vl:last-child { border-bottom: none }
        ul.vl a { text-align: left !important }

        ul.sn li { float: left; background: url(../png/ln.png) left 0 repeat-x; }
        ul.sn li:hover { background-position: right 0 }
        ul.sn a { margin: 0 !important; color: #1face5 !important; display: block; text-align: center; padding: 9px 14px 6px 14px; }
        ul.sn a:first-child:hover { text-decoration: underline }
        ul.sn img:hover { text-decoration: none }

        nav > ul > li > a:after {
            content: '';
            width: 22px;
            height: 9px;
            display: block;
            position: relative;
            margin-top: 2px;
            z-index: 200;
            left: 5px;
        }

        .tnh {
            color: #1face5;
        }

            .tnh:after {
                width: 90%;
                background: url(../png/sn.png) center top no-repeat;
            }

#look { position: absolute; top: 50px; width: 100%; /*max-width: 1540px*/ }
    #look h4, #look div { width: 272px }
    #look h4 { font-size: 17px; margin: 0 0 3px 53px }
    #look div { float: right; margin: 0 80px 0 0 }
    #look input { width: 160px; border: 1px solid #ccc; height: 17px; margin-bottom: 3px; font-size: 13px }
    #look input.lw { width: 140px; margin-top: 1px }
    a[button=box] { width: 19px; height: 19px; border: 1px solid #ccc; background: #fff; position: absolute; margin: 1px 0 0 -1px;
                    display: inline-block; text-align: center; text-decoration: none; line-height: 19px; padding: 0 }
    #look .req { font-size: 12px }


#vis { position: absolute; top: 50px; right: 265px; width: 150px; z-index: 205; }
    #vis img { float: right; margin-top: -0.25em; width: 60px; }
    #vis, #vis a { text-decoration: none; color: #666; }
    #vis h4 { margin: 0 0 0.5em 0; }
    #vis h4 a { color: #003a78 !important; }
    #vis span { font-size: 14px; }

#teq { position: absolute; top: 50px; right: 100px; width: 125px; z-index: 205; }
    #teq img { float: right; padding: 5px 5px 3px 0; width: 45px; filter: grayscale(1); }
    #teq, #teq a { text-decoration: none; color: #666; }
    #teq h4 { margin: 0 0 0.5em 0; }
    #teq h4 a { color: #003a78 !important; }
    #teq span { font-size: 14px; }


#hd_geq, #hd_teq, #hd_vis {
	position: absolute;
	top: 35px;
	width: 175px;
	z-index: 205;
	font-size: 16px;
}

#hd_geq a, #hd_teq a, #hd_vis a {
	color: #003a78 !important;
	text-decoration: none;
}

#hd_geq img, #hd_teq img, #hd_vis img {
	margin-left: 0.25em;
}

#hd_geq h4, #hd_teq h4, #hd_vis h4 {
	line-height: 1.1em;
	margin: 0 0 0.2em 0;
	font-weight: bold;
}

#hd_geq span, #hd_teq span, #hd_vis span {
	font-size: 14px;
}

#hd_geq span a, #hd_teq span a, #hd_vis span a {
	color: #555 !important;
}

#hd_geq {
	right: calc(80px + 150px + 175px);
}

#hd_teq {
	right: calc(80px + 150px);
	width: 150px;
}

#hd_vis {
	right: 40px;
}


nav#social {
    background: none;
    position: absolute;
    top: 40px;    
    width: 100%;
    /*
    max-width: 1540px;
    */
    z-index: 200;
}

    nav#social ul { text-align: right; width: auto; min-width: initial; max-width: none; float: right; margin-right: 30px; }
    nav#social a, nav#social a:hover { display: inline-block; padding: 0; width: 20px; height: 20px; background-color: none;
                   margin: 0; background-repeat: no-repeat }
    nav#social a:after { display: none }
    nav#social a { background-size: cover; transition: 0.5s ease }
    nav#social a:hover { width: 40px; height: 40px }

    .sm-bl, .sm-bl:hover { background-image: url(../png/si-bl.png);  }
    .sm-yt, .sm-yt:hover { background-image: url(../png/si-yt.png);  }


div#social {
	position: absolute;
	left: 73px;
	margin-top: 40px;
}

	div#social a { margin-right: 0.5em; }


div#icbs a {
    display: inline-block;
    width: 10px;
    height: 10px;
    background: #fff;
    margin-left: 0.5rem;
    box-shadow: #333 1px 1px 3px;
}

div#icbs {
    position: absolute;
    right: 20px;
    bottom: 14px;
    opacity: 0.7;
}

#bgcap, #banner { z-index: 10; position: relative; }

div#banner2 {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    transition: opacity 1s ease-in-out;
    opacity: 0;
    background-image: url(../jpg/3.jpg);
    opacity: 1;
    background-position: bottom left;
    background-repeat: no-repeat;
    background-size: cover;
}


form {
    display: block;
    margin: 0;
    padding: 0;
    background: #fff;
}

article {
    padding: 0 20px;
}

article a { color: #1face5; text-decoration: none }
    article a:hover { text-decoration: underline }

section.col {
    margin-top: 60px;
    width: 45%;
    float: left
}

section.col article { padding-right: 0; clear: both; margin-bottom: 30px }
section.right { margin-left: 5%; clear: right }
section.left article { padding-left: 73px }


aside {  }
aside.right { float: right; margin: 20px 20px 0 20px; }
aside article { margin-bottom: 20px; padding: 0 }

section article h1 { font-size: 33px; /*margin: 0.4em 0 -0.2em 0*/ }
section article h2 { font-size: 28px; margin: 0.4em 0 -0.4em 0 }
section article h3 { font-size: 24px; margin: 1.2em 0 -0.4em 0 }
section article p, section article a {  }
section article ul { padding-left: 20px; margin-left: 20px; font-size: 15px; }
section article a { color: #3771c5; text-decoration: none }
section article a:hover { text-decoration: underline }
section article a > img { border: 2px solid transparent; transition: 0.4s ease }
section article a > img:hover { border: 2px solid #1face5 }

article.page { padding: 30px 30px 0 73px; max-width: 2000px; }

img.asi { width: 100% !important; }


.chl input[type=checkbox] {
    width: 20px;
    display: block;
    float: left;
}
.close { display: block; margin-bottom: -0.8em; font-weight: bold }
.overTxtLabel { color: #666 }

.pi input { margin: 2px 0 }

.fi { float: right; clear: both; margin: 10px 30px }

footer {
    clear: both;
    font-size: 15px;
    color: #000;
    padding-bottom: 10px;
    text-align: center;
}

    footer p { color: #000; padding: 10px 0 }

	footer a {
		color: #000;
		text-decoration: none;
	}
	
	footer a:hover {
		color: #000;
		text-decoration: underline;
	}

    footer .title { font-family: "Foundry Sans W01_n7"; padding-bottom: 0.5em; font-size: 14px }



#ci {
    background: #1face5;
    padding: 9px 20px;
    font-size: 95%;
    text-align: center;
    position: relative;
    z-index: 300;
}

    #ci a, #ci
    {
        color: #fff;
        text-decoration: none;
    }

        #ci a:hover
        {
            text-decoration: underline;
        }

	#ci .x {
		display: block;
		float: right;
		margin-left: 0.75em;
		padding: 2px 3px;
		text-decoration: none;
		font-size: 15px;
		line-height: 10px;
		color: #fff !important;
		font-weight: bold;
	}

.feedburnerFeedBlock ul, .feedburnerFeedBlock li { padding: 0; margin: 1em 0; list-style: none; }
.feedburnerFeedBlock .headline { font-weight: normal !important; font-family: "Foundry Sans W01_n7"; 
                                font-size: 18px; color: #f00 }
.feedburnerFeedBlock .date { color: #333; font-size: 80%; margin-top: 0.25em; }
.feedburnerFeedBlock .date:before { content: 'Posted: '}
#creditfooter { display: none; }


#dbm { display: none; }
#tnav, label[for=tnav] { display: none; }
.nt { display: none; }

@media all and (min-width: 0px) {
    body { font-family:'Foundry Sans W01'; font-weight: 400 !important; font-style: normal !important }
    h1, h2, h3, h4, h5, h6, h4, h5, h6, nav, .feedburnerFeedBlock .headline { font-family:'Foundry Sans W01'; font-style: normal !important; font-weight: 700 !important }
}



/*Responsive Layouts*/
/*Smartphones*/

/*All responsive*/
@media 
    only screen and 
    (min-device-width : 300px) and 
    (max-device-width : 1023px) 
{
    body { font-size: 40px; overflow-x: hidden; }

    #look, nav#social { display: none; }
		
	#hd_geq, #hd_teq, #hd_vis { width: auto !important; top: 45px; }
	#hd_vis { right: 140px; }
	#hd_geq { right: 300px; }
	#hd_teq { right: 225px; }
	#hd_geq a:not(.img), #hd_teq a:not(.img), #hd_vis a:not(.img) { display: none; }
	#hd_geq img, #hd_teq img, #hd_vis img { height: 40px; width: auto; filter: grayscale(1); }
	
	div#social { left: 40px; margin-top: 15px; }
	div#social a { margin-right: 0; }
	div#social img { width: 64px; height: 64px; }

    .mo { display: initial !important; }
    #pp { position: absolute; top: 41px; right: 110px; }
    #pp img { height: 55px; }
	
	#pp { display: none !important; }

    label[for=tnav] { display: block; width: 102px; width: 80px; cursor: pointer; 
        margin-bottom: 10px; margin-top: -8px; float: right; background-color: #fff; font-size: 17px; }

    label[for=tnav]:after { content: '\2261'; position: absolute; right: 5px; font-weight: bold; line-height: 1em;
        display: block; color: #555; top: 25px; width: 100px; font-size: 80px; vertical-align: top; z-index: 200; }

    #tnav { display: inline-block; visibility: hidden; position: absolute; top: -100px; left: 0; }
    #tnav:checked ~ label {  }
    #tnav:checked ~ label:after {  }

    #tnav:checked ~ nav.cl { display: block !important; }
    nav.cl { display: none; z-index: 1000; }

    nav.cl, nav.cl ul, nav.cl li { padding: 0 !important; margin: 0 !important; background: none; }
    nav.cl { font-size: 40px; width: 490px; background-color: #fff; position: absolute; right: 0; 
         box-shadow: -15px 15px 30px 0px rgba(0,0,0,0.5); top: 110px; }
    nav.cl > ul { width: 100%; }
    nav.cl > ul > li { display: block; width: 100%; }
    nav.cl > ul > li > a { padding: 0 30px; }
    nav.cl li { border-bottom: 1px solid #777; border-collapse: collapse; width: 100%; }
    nav.cl li.tn:before { content: 'v'; float: right; padding-right: 30px; position: relative; z-index: 99; }
    nav.cl li a { width: 100%; }
    nav.cl li.tn > a { position: relative; z-index: 100; width: 375px; }

    nav.cl a.tnh:after { display: none; }

    nav.cl .tn a, nav.cl .tn { color: #000; }
    nav.cl .show a, nav.cl .show { color: #1face5 !important; }
    nav.cl > ul > li.show > ul.sn { display: block !important; }
    nav.cl ul.sn {  width: 100%; position: relative; background: transparent !important; right: auto !important; }
    nav.cl ul.sn li { background: none; }
    nav.cl ul.sn li img, nav.cl ul.rw li a:first-of-type { display: none; }
    nav.cl ul.sn li a { font-size: 35px; text-align: left; padding: 0.75em 0 0.75em 60px !important; }

    nav.cl ul:last-of-type > li:last-of-type,
    nav.cl ul.sn > li:last-of-type { border-bottom: none; }

    a[name=top] img { width: 285px; height: 78px; }
    a[name=top] img.anniversary { width: 360px; }

    #mbp { display: block; min-height: 300px; background-size: cover; margin-top: 0.75em; }

    section.left article.np { display: block !important; margin-bottom: 0; }

    section.col { width: 100%; float: none; overflow-x: hidden; }
    section.left article { padding: 0; }
    section.right { margin-left: 0; }
    section.col article { padding: 0; }

    section.left { margin: 0; }
    section.right { margin-top: 0; }
    section.col img { border-width: 0; float: none; width: 100%; margin: 0.75em 0 0 0; }
    section article h2 { font-size: 46px; }

    .ss { padding: 0.5em 0; }
    .ss > span { margin: 0 -2px; zoom: 1.9; }
    /*
    .ss { text-align: center; margin-bottom: 1em }
    .stButton > span > span:nth-child(1) { width: 150px !important; height: 44px !important; 
        background-size: contain; padding-top: 12px !important; }
    .stButton > span > span:nth-child(2) > span { height: 48px !important; width: 60px; }
    .stBubble_hcount { font-size: 30px !important; }
    .stButton, .stButton span { line-height: 52px !important }
    .st_googleplus_hcount { display: none; }
    */

    nav.sitemap { padding: 1em 0; }
    nav.sitemap a {  }
    nav.sitemap > ul > li { display: block; font-size: 30px; padding: 0 40px; }
    nav.sitemap ul > li { margin: 0; white-space: normal; }
    nav.sitemap .title { font-size: 35px; margin: 0; padding: 0.3em 0 0 0; }
    nav.sitemap > ul ul li { display: none; padding: 0.2em 0 0.2em 40px; }
    nav.sitemap > ul ul li:first-of-type { display: block; padding-left: 0; }
    nav.sitemap > ul ul.show li { display: block; }
    nav.sitemap > ul > li:last-of-type a { font-size: 35px; }

    article.page { padding-left: 40px; }
    article.page .pl img, article.page h1 img { height: 1.2em; position: relative; }
    article.page h1 { font-size: 60px; }
    article.page div.desc { height: 6.25em; overflow-y: hidden; clear: both; }
    /*
    article.page h1 + div.desc:before { content: 'show more...'; display: block; right: 40px;
        position: absolute; margin-top: 10em; height: 55px; font-size: 30px; color: #1face5; }
    */

    article.page h2 { font-size: 50px; }
    article.page h3 { font-size: 50px; }
    article.page p.right { display: none; }
    article.page select { font-size: 35px; }
    article.page a.sm { text-align: right; font-size: 30px; display: block; }
    article.page div.desc > p:first-of-type { margin-top: 0; }
    article.page div.fl + a.sm { display: none; }
    article.page div.fl { height: auto !important; }

    ul.items h4 { font-size: 40px; width: 100%; display: table; }
    ul.items h4 a { display: table-cell; vertical-align: middle; }
    ul.items h5 { line-height: 1.3em; }
    ul.items img { max-width: none; max-height: none; width: 100%; }

    /*article.page h1 img { float: left; margin: 0 30px 20px 0; }*/
    #pnl_lnk img { width: 100%; height: auto; max-width: none !important; max-height: none !important; }
    article.page div.colours { margin-top: -0.5em; }
    #pnlColour { line-height: 2.2em !important; height: 2.2em !important; }
    #pnlColour > img { width: 1.5em !important; height: 1.5em !important; margin-right: 0.5em !important; }
    article.page p.colours img { width: 81px; height: 81px; max-height: none; }
    .item { margin-right: 0.3em !important; font-size: 27px; }

    article.page p.np { display: none; }
    article.page div.pr h2 { font-size: 50px; }

    article.page p.handles img, article.page div.item img { width: 160px; height: auto; max-height: 160px; }

    input[type=button], input[type=submit], input[type=text], textarea { font-size: 30px; }
    input[type=radio], input[type=checkbox] { width: 40px; height: 40px; }

    section article a > img:hover { border: none; }

    p.tp, div.pr { width: 100% !important; }

    .w1, .w2, .w3, .w4, .w5 { font-size: 40px !important; }
    .w1 { width: 100% !important }
    .w2 { width: 280px !important }
    .w3 { width: 40% !important }
    .w4 { width: 52% !important }
    .w5 { width: 42% !important }

    .lls .np { display: block !important; }
    .lls h2 { font-size: 40px; }
    .lls h4 span { font-size: 35px; }
    .lls .mt img { width: 80%; }
    

    .top-help, .left-help, .right-help { display: block !important; }
    .right-help iframe { height: calc((100vw / 1.777) - 40px) !important; }


    article.page .summary { width: 80%; margin: 1em 10%; border-width: 2px; }
    article.page .summary h4 { font-size: 45px; }
    article.page .summary ul { margin-left: 40px; }
    article.page .summary .np { display: initial !important; }
    article.page .sel, a[button=sel] { border-width: 2px !important; }
    article.page .info { font-size: 20px; }
    a.i-eml, a.i-prn { width: 80px !important; height: 70px !important; background-size: contain; }
    #eml input[type=text] { font-size: 30px; }
    .shr { display: block !important; }

    #ci { word-wrap: normal; }
    #ci .x { font-size: 40px; }

    article.cp a > img { width: 100%; height: auto; }
    article.cp h1 + div { width: auto !important; margin: 0 !important; float: none !important; }

    iframe { width: 100%; margin: 1em 0 !important; }
    #recaptcha_widget_div { zoom: 1.4; }

    .fblk { width: 26%; height: 450px; font-size: 80%; }
    /*.fblk:nth-child(3n+3) { margin-right: 0 !important; }*/
    .fblk img { border-width: 2px !important; }

    article.cp table:not(.xtb), article.cp table:not(.xtb) tbody, article.cp table:not(.xtb) tr, article.cp table:not(.xtb) td,
    article table.rsp, article table.rsp tbody, article table.rsp tr, article table.rsp td { display: block; width: 100%; }
    article.cp table { clear: both; }
    article table input[type=text]:not(.qty), article table textarea { width: 90% !important; }

    #vis { top: 33px; right: 265px; width: 36px; }
    #vis h4, #vis span { display: none; }
    #vis img { display: none; }
    #vis a.img { display: inline-block; width: 55px; height: 55px; background: url('../svg/vis-2.svg') center center no-repeat; 
        background-size: contain; }

    #teq { top: 42px; right: 200px; width: 30px; }
    #teq h4, #teq span { display: none; }
    #teq img { display: none; }
    #teq a.img { display: inline-block; width: 42px; height: 42px; background: url('../png/teq.png') center center no-repeat; 
        background-size: contain; filter: grayscale(1); }
}

/*Mobile Specific*/
@media 
    only screen and 
    (min-device-width : 300px) and 
    (max-device-width : 699px)
{
    .nt { display: initial; }

    header aside { display: none; }
    section p, section ul, section h1, section h3, section h4,
    section.left article { display: none; }
    section article h2 { padding-left: 40px; }

    ul.items li { width: 45%; margin: 1em 0 0 0; padding: 0; }
    ul.items li:nth-child(2n+1) { margin-right: 5%; }

    article.page div.pl, article.page div.pr { width: 100%; float: none; margin: 0; padding: 0; }
    article.page div.pl div.cnt { width: 100%; height: auto; }

    #recaptcha_widget_div { zoom: 1.2; }

    #ci { font-size: 20px; }
}


/*iPhone 6*/
@media 
    only screen and 
    (min-device-width : 375px) and 
    (max-device-width : 667px) 
{

}


/*Tablets*/

/*All tablets*/
@media 
    only screen and 
    (min-device-width : 700px) and 
    (max-device-width : 1023px)
{
    #pp, .nt { display: none !important; }
    #look { display: block !important; }
    #look div { width: 500px; margin-right: 250px; }
    #look h4 { font-size: 35px; margin-left: 103px; width: auto; }
    #look input, #look span, #look label { font-size: 25px !important; }
    #look input { border-width: 2px; width: 305px; }
    #look input.lw { width: 266px; margin-right: 5px; }
    #look input, #look a { height: 20px; }
    #look a { font-size: 43px !important; line-height: 0.7em; height: 30px; width: auto; padding: 0 4px; 
        border-width: 2px; margin-top: 10px; }
    #look span { vertical-align: middle; display: inline-block; }
    header {  }
    
    #vis div { display: none; }
    #vis a.img { width: 65px; height: 65px; }

    nav.cl { width: 40%; }
    nav.sitemap > ul > li { display: inline-block; }
    nav.sitemap > ul > li > ul > li { display: block; padding-left: 0; }

    label[for=tnav] { width: 142px; width: 120px; }
    label[for=tnav]:after { font-size: 90px; }

    article.nshow h2 { font-size: 46px; }
    article.nshow p { font-size: 35px; }

    #banner { padding-top: 50%; }
    #banner > div > a { font-size: 25px; }

    div#icbs { zoom: 2; }

    header aside { margin-top: 2em; }
    header article { width: 50%; margin-top: 4em; line-height: 1.3em !important; zoom: 0.8; margin-top: 2em; margin-bottom: 2em;  }
    header article h2 { font-size: 40px; }

    .hi img { max-width: none !important; }

    section.col { width: 42%; }
    section.left { margin: 0 5%; }
    section.left, section.right { float: left; }
    section article {  }
    section article ul, .feedburnerFeedBlock .headline, 
    section article h3, section article h1 { font-size: 40px; }
    section article h4 { font-size: 46px; }

    article.cp a > img { width: 50%; height: auto; }

    ul.items li { width: 22.5%; margin: 1em 2% 0 0; padding: 0; }
    ul.items li:nth-child(4n+4) { margin-right: 0; }

    article.page h1 { margin-bottom: 1.2em; }
    
    article.page div.pl { width: 43%; float: left; }
    article.page div.pr { width: auto !important; padding-left: 47%; margin-top: -0.2em; }
    
    article.page div.pl div.cnt { width: 100%; height: auto; }
    article.page div.pr div.desc { clear: none; }
    article.page > a[button]:first-of-type { display: none; }
    article.page div.pr p.rt { display: initial; position: absolute; margin-top: -1.7em; 
        right: 30px; margin-bottom: 0.7em; }
}


/*Desktop Responsive*/

@media 
    only screen and (min-width: 820px) and (max-width: 1300px) and (-webkit-device-pixel-ratio: 1),
    only screen and (min-width: 820px) and (max-width: 1300px) and (max-resolution: 96dpi)
{
    /*a[name=top] img { border: 3px solid #1face5; }*/
    #banner { padding-top: 46%; }
}

@media 
    only screen and (min-width: 820px) and (max-width: 1069px) and (-webkit-device-pixel-ratio: 1),
    only screen and (min-width: 820px) and (max-width: 1069px) and (max-resolution: 96dpi)
{
    section.col { width: 42%; margin-left: 5%; }
    section.left, section.right { float: left; }
    section.col article { padding-left: 0; }
    section.col article img { width: 100% !important; }

    section.col, section.col article img { transition: 0.4s ease }
}

@media 
    only screen and (min-width: 320px) and (max-width: 1000px) and (-webkit-device-pixel-ratio: 1),
    only screen and (min-width: 320px) and (max-width: 1000px) and (max-resolution: 96dpi)
{
    nav.cl { padding-left: 40px; }
}

@media 
    only screen and (min-width: 320px) and (max-width: 819px) and (-webkit-device-pixel-ratio: 1),
    only screen and (min-width: 320px) and (max-width: 819px) and (max-resolution: 96dpi)
{
    section.left article.np { display: block; margin-bottom: 0; }
    section.col { width: 80%; float: none; overflow-x: hidden; margin: 60px auto 0 60px !important; }
    section.right { margin-left: 0; margin-top: 0 !important; }
    section.col article { padding: 0 40px; }

    section.left { margin: 0; }
    section.right { margin-top: 0; }
    section.col img { float: none; width: 100%; margin: 0.75em 0 0 0; }

    section.col, section.col article img { transition: 0.4s ease }
    
    a.bnav, a[button] { margin-bottom: 0.2em; }
    .fblk { margin-right: 20px; }
    
    .w1 { width: 100% !important }
    .w2 { width: 280px !important }
    .w3 { width: 40% !important }
    .w4 { width: 52% !important }
    .w5 { width: 42% !important }

    .lls .np { display: block !important; }
    .lls .mt img { width: 80%; }

    article table input[type=text]:not(.qty), article table textarea { width: 90% !important; }

    .pl, .cnt { width: 300px !important; }
    .cnt { height: 300px !important; }
    .pr { padding-left: 330px !important; }
    #pnl_lnk img { width: 100% !important; height: auto; max-width: none !important; max-height: none !important; }
}

@media 
    only screen and (min-width: 320px) and (max-width: 975px) and (-webkit-device-pixel-ratio: 1), 
    only screen and (min-width: 320px) and (max-width: 975px) and (max-resolution: 96dpi)
{
    #stksts { display: none; }
    #vis h4, #vis span { display: none; }
    #vis img { width: 80px !important; }
    header article { zoom: 0.8; }
}

@media 
    only screen and (min-width: 320px) and (max-width: 875px) and (-webkit-device-pixel-ratio: 1), 
    only screen and (min-width: 320px) and (max-width: 875px) and (max-resolution: 96dpi)
{
    #teq h4, #teq span { display: none; }
    #teq img { width: 60px !important; padding-top: 15px; } 
    #vis { right: 400px; }
}

@media 
    only screen and (min-width: 320px) and (max-width: 800px) and (-webkit-device-pixel-ratio: 1), 
    only screen and (min-width: 320px) and (max-width: 800px) and (max-resolution: 96dpi)
{
    body { overflow-x: hidden; }
    #look, #social { display: none; }

    /*.mo { display: initial !important; }
    #pp { position: absolute; top: 33px; right: 75px; display: block !important; }
    #pp img { height: 33px; }*/

    #pp { position: absolute; top: 33px; right: 75px; width: 36px; height: 33px; display: block !important;
        background: url(../svg/pp.svg) center center no-repeat; background-size: contain; margin-right: 0.5em; }
    #pp img { display: none; }

    #mbp { display: block; background-size: cover; margin-top: 0.75em; margin-bottom: 1em; }

    label[for=tnav] { display: block; width: 72px; width: 80px; cursor: pointer; 
        margin-bottom: 10px; margin-top: -8px; float: right; background-color: #fff; font-size: 17px; }

    label[for=tnav]:after { content: '\2261'; position: absolute; right: 5px; font-weight: bold; line-height: 1em;
        display: block; color: #555; top: 25px; width: 70px; font-size: 50px; vertical-align: top; z-index: 200; }

    #tnav { display: inline-block; visibility: hidden; position: absolute; top: -100px; left: 0; }
    #tnav:checked ~ label {  }
    #tnav:checked ~ label:after {  }

    #tnav:checked ~ nav.cl { display: block !important; }
    nav.cl { display: none; z-index: 1000; }

    nav.cl, nav.cl ul, nav.cl li { padding: 0 !important; margin: 0 !important; background: none; }
    nav.cl { width: 240px; background-color: #fff; position: absolute; right: 0; 
         box-shadow: -15px 15px 30px 0px rgba(0,0,0,0.5); top: 80px; }
    nav.cl > ul { width: 100%; }
    nav.cl > ul > li { display: block; width: 100%; }
    nav.cl > ul > li > a { padding: 0.5em 15px 0 15px; width: calc(100% - 30px) }
    nav.cl li { border-bottom: 1px solid #777; border-collapse: collapse; width: 100%; }
    nav.cl li.tn:before { content: 'v'; float: right; padding-right: 15px; padding-top: 0.25em; 
        position: relative; z-index: 99; }
    nav.cl li a { width: 100%; line-height: initial !important; }
    nav.cl li.tn > a { position: relative; z-index: 100; width: calc(100% - 55px);  }

    nav.cl a.tnh:after { display: none; }

    nav.cl .tn a, nav.cl .tn { color: #000; }
    nav.cl .show a, nav.cl .show { color: #1face5 !important; }
    nav.cl > ul > li.show > ul.sn { display: block !important; }
    nav.cl ul.sn {  width: 100%; position: relative; background: transparent !important; right: auto !important; }
    nav.cl ul.sn li { background: none; }
    nav.cl ul.sn li img, nav.cl ul.rw li a:first-of-type { display: none; }
    nav.cl ul.sn li a { text-align: left; padding: 0.75em 0 0.75em 30px !important; }

    nav.cl ul:last-of-type > li:last-of-type,
    nav.cl ul.sn > li:last-of-type { border-bottom: none; }

    #vis { top: 33px; right: 157px; width: 36px; }
    #vis img { display: none; }
    #vis a.img { display: inline-block; width: 36px; height: 36px; background: url('../svg/vis-2.svg') center center no-repeat; 
        background-size: contain; }

    #teq { top: 39px; right: 121px; width: 30px; }
    #teq img { display: none; }
    #teq a.img { display: inline-block; width: 27px; height: 27px; background: url('../png/teq.png') center center no-repeat; 
        background-size: contain; filter: grayscale(1); }
}

@media 
    only screen and (min-width: 320px) and (max-width: 425px) and (-webkit-device-pixel-ratio: 1),
    only screen and (min-width: 320px) and (max-width: 425px) and (max-resolution: 96dpi)
{
    a[name=top] img { width: 132px; height: 60px; margin-bottom: 30px !important; }
}

@media 
    only screen and (min-width: 320px) and (max-width: 649px) and (-webkit-device-pixel-ratio: 1),
    only screen and (min-width: 320px) and (max-width: 649px) and (max-resolution: 96dpi)
{
    #look, #banner, #social { display: none; }
    section.col { width: 100%; margin: 0 !important; }
    #dbm { display: block; }
    #mbp { display: block; min-height: 150px; background-size: cover; margin-top: 0.75em; }

    h1 { font-size: 28px; }

    nav.sitemap { padding: 1em 0; }
    nav.sitemap a { }
    nav.sitemap > ul > li { display: block; padding: 0 40px; }
    nav.sitemap ul > li { margin: 0; white-space: normal; }
    nav.sitemap .title { margin: 0; padding: 0.3em 0 0 0; cursor: pointer; }
    nav.sitemap > ul ul li { display: none; padding: 0.2em 0 0.2em 15px; }
    nav.sitemap > ul ul li:first-of-type { display: block; padding-left: 0; }
    nav.sitemap > ul ul.show li { display: block; }
    nav.sitemap > ul > li:last-of-type a { font-size: 35px; }


    article.page { padding: 0 40px; }
    article.page p.right { display: none; }
    article.page a.sm { text-align: right; display: block; }
    article.page div.desc > p:first-of-type { margin-top: 0; }
    article.page div.fl + a.sm { display: none; }
    article.page div.fl { height: auto !important; }
    article.page h1 img { height: 2.3em; }
    article.page div.desc { height: 7.1em; overflow-y: hidden; clear: both; }

    ul.items h4 { width: 100%; display: table; }
    ul.items h4 a { display: table-cell; vertical-align: middle; }
    ul.items h5 { line-height: 1.3em; }
    ul.items img { max-width: none; max-height: none; width: 100%; }

    #pnl_lnk img { width: 100%; height: auto; max-width: none !important; max-height: none !important; }
    article.page div.colours { margin-top: -0.5em; }
    #pnlColour { line-height: 2.2em !important; height: 2.2em !important; }
    #pnlColour > img { width: 1.5em !important; height: 1.5em !important; margin-right: 0.5em !important; }
    article.page p.colours img { width: 45px; height: 45px; max-height: none; }
    .item { margin-right: 0.3em !important;  }


    article.page p.np { display: none; }
    article.page p.handles img, article.page div.item img { width: 100px; height: auto; max-height: 100px; }


    p.tp, div.pr { width: 100% !important; }

    #pnl_lnk img { width: 100%; height: auto; max-width: none !important; max-height: none !important; }
    article.page div.colours { margin-top: -0.5em; }
    #pnlColour { line-height: 2.2em !important; height: 2.2em !important; }
    #pnlColour > img { width: 1.5em !important; height: 1.5em !important; margin-right: 0.5em !important; }
    article.page p.colours img { width: 45px; height: 45px; max-height: none; }
    .item { margin-right: 0.3em !important;  }

    article.page .summary { width: 80%; margin: 1em 10%; }
    article.page .summary ul { margin-left: 40px; }
    article.page .summary .np { display: initial !important; }
    .shr { display: block !important; }

    #ci { word-wrap: normal; }

    article.cp a > img { width: 100%; height: auto; }
    article.cp h1 + div { width: auto !important; margin: 0 !important; float: none !important; }

    iframe { width: 100%; margin: 1em 0 !important; }

    article.cp table:not(.xtb), article.cp table:not(.xtb) tbody, article.cp table:not(.xtb) tr, article.cp table:not(.xtb) td,
    article table.rsp, article table.rsp tbody, article table.rsp tr, article table.rsp td { display: block; width: 100%; }
    article.cp table { clear: both; }


    header aside { display: none; }
    section p, section ul, section h1, section h3, section h4, .fi,
    section.left article { display: none; }

    ul.items li { width: 45%; margin: 1em 0 0 0; padding: 0; }
    ul.items li:nth-child(2n+1) { margin-right: 5%; }

    article.page div.pl, article.page div.pr { width: 100% !important; float: none !important; margin: 0 !important; padding: 0 !important; }
    article.page div.pl div.cnt { width: 100% !important; height: auto !important; }

    .hi img { min-width: 0 !important; }
}