/*! HTML5 Boilerplate v4.3.0 | MIT License | http://h5bp.com/ */

/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html {
    color: #222;
    font-size: 1em;
    line-height: 1.4;
}

/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

/*
 * Remove the gap between images, videos, audio and canvas and the bottom of
 * their containers: h5bp.com/i/440
 */

audio,
canvas,
img,
svg,
video {
    vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
}

/* ==========================================================================
   Browse Happy prompt
   ========================================================================== */

.browsehappy {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}

/* ==========================================================================
   Author's custom styles
   Stephen Foggin
   ========================================================================== */

html{background:#ececec;height:100%;font-size:0.9em;font-family:Verdana;}

footer{position:relative;bottom:-22px;height:81px;}
#homePage footer{position:absolute;bottom:5em;left:2em;z-index:1000;width:958px;height:81px;}

#homePage{}
#standardPage{position:absolute;top:0;left:0;width:100%;padding-bottom:50px;}

.marginPage{background:url('../img/background/marine_bk_1920.jpg') repeat;}
.powerPage{background:url('../img/background/power_bk_1920.jpg') repeat;}
.defencePage{background:url('../img/background/defence_bk_1920.jpg') repeat;}
.sparesPage{background:url('../img/background/spares_bk_1920.jpg') repeat;}
.facilitiesPage{background:url('../img/background/facilities_bk.jpg') repeat;}
.infoPage{background:url('../img/background/info_bk_1920.jpg') repeat;}
.assetPage{background:url('../img/background/asset_reg_bk_1920.jpg') repeat;}
.engineiPage{background:url('../img/background/marine_bk_1920.jpg') repeat;}
.volvoPage{background:url('../img/background/volvo_bk.jpg') -160px 0 repeat;}
.gePage{background:url('../img/background/gemarine_bk.jpg') repeat;}
.newsPage{background:url('../img/background/news_bk_1920.jpg') repeat;}
.contactPage{background:url('../img/background/contact_bk_1920.jpg') repeat;}
.searchPage{background:url('../img/background/search_bk_1920.jpg') repeat;}

#wrapper{height:100%;width:960px;margin:0 auto;}
	header{position:absolute;top:0;left:0;height:136px;width:100%;z-index:100;background:#ececec;}
		header #logo{margin-left:51px;margin-top:11px;}
		header .searchForm{width:400px;position:relative;top:-100px;right:-250px;margin:0 auto;}
		header .inLink{width:49px;position:absolute;top:15px;right:65px;}
		header .twitterLink{width:49px;position:absolute;top:15px;right:0;}
		
article{font-family:arial;margin-top:673px;padding-top:15px;padding-bottom:25px;width:960px;overflow:auto;color:#fff;}
	article .title-holder{position:absolute;top:136px;left:0;height:104px;width:100%;margin:0;}
		article .title-holder div{width:960px;height:100%;margin:0 auto;position:relative;}
        article .title-holder div a{position:absolute;top:25px;}
		article .title-holder div h1{font-family:Verdana;font-size:47px;font-weight:normal;color:#fff;height:104px;line-height:104px;text-align:right;margin:0;direction:rtl;text-indent:240px;}
		
		.contactPage article .title-holder h1,
		.newsPage article .title-holder h1,
		.assetPage article .title-holder h1,
		.facilitiesPage article .title-holder h1,
		.infoPage article .title-holder h1,
		.sparesPage article .title-holder h1,
		.searchPage article .title-holder h1 {text-indent:100px;}
		
		.marginPage article .title-holder h1, 
		.powerPage article .title-holder h1, 
		.defencePage article .title-holder h1{text-indent:210px;}
		
		article .title-holder h1 div{position:absolute;top:50%;right:100px;margin-top:-41px;display:block;width:82px;height:81px;}
			article .title-holder h1 div.icons-small{left:0;width:470px;height:40px;margin-top:-20px;}
		article .title-holder h1 .volvoLogo{position:absolute;right:30px;margin-top:20px;}
		
		.assetPage article .title-holder h1 div.icons-small{left:-320px;}
		.facilitiesPage article .title-holder h1 div.icons-small{left:-30px;}
		.newsPage article .title-holder h1 div.icons-small{left:100px;}
		.infoPage article .title-holder h1 div.icons-small{left:160px;}
		
	article h2{margin-bottom:0;margin-left:40px;color:#f78f1e;font-size:0.9em;}
		article h2.royston-e{background:url("../img/royston-e.png") no-repeat;padding-left:30px;height:23px;line-height:23px;margin-top:35px;}
	article p{margin-top:0;padding-left:40px;padding-right:40px;}
		.infoPage article p{margin-left:30px;}
	article ul{list-style-image:url("../img/list-dot.png");}
	.infoPage article ul:not(.pdf-download){list-style-image:url("../img/list-dot-large.png");margin-left:25px;margin-top:-15px;margin-bottom:0;}
		.infoPage article ul:not(.pdf-download) li a,
		.infoPage article ul:not(.pdf-download) li a:link,
		.infoPage article ul:not(.pdf-download) li a:active,
		.infoPage article ul:not(.pdf-download) li a:visited{text-decoration:none;color:#f78f1e;font-weight:bold;}
		.infoPage article ul:not(.pdf-download) li a:hover{color:#fff;}
	article .pageLink{clear:both;display:block;background:url('../img/dot.gif') no-repeat;background-position:0 43%;text-decoration:none;color:#fff;margin-left:30px;margin-bottom:10px;padding-left:20px;}
		article .pageLink:hover{color:#f78f1e;} 

/* Custom .col settings */
.col{width:50%;float:left;}
.col .col{width:67%;} 
.col .col:last-child{width:33%;}

.infoPage article .col{margin-bottom:100px;/*width:auto;*/}
.assetPage article .title-holder + .col{width:68%;}
.assetPage article .col + .col{width:32%;}
.assetPage article .col + .col img{margin-top:35px;margin-left:20px;}
.facilitiesPage article .col{margin-right:30px;width:44%;}
.facilitiesPage article .col + .col, 
.facilitiesPage article .workshop-images + .col{margin-left:-55px;width:55%;}
.facilitiesPage article .workshop-images + .col{position:absolute;right:35px;}
.facilitiesPage article .workshop-text{position:absolute;right:35px;width:55%;}
.facilitiesPage article .workshop-images{z-index:2;}

.facilitiesPage article section{display:none;}

.powerPage article div.bg{padding-left:15px;}
.powerPage article div.bg div.col{width:48%;}
.powerPage article div.bg div.col ul{width:90%;}
.powerPage article div.bg div.col ul li{white-space:nowrap;}

/* Enginei - i style*/
#engineiLink {text-transform:lowercase;}
#engineiLink .i{text-transform:lowercase;font-style:italic;}

/* Lists */
ul{margin-top:0;margin-bottom:5px;margin-left:15px;}
.unstyle{list-style:none;margin-left:0;}

ul.pdf-download{list-style:none;margin-top:20px;}
	ul.pdf-download li{position:relative;height:37px;line-height:32px;background:url("../img/pdf.png") no-repeat;margin-left:-15px;padding-left:45px;}
		ul.pdf-download li a,
		ul.pdf-download li a:link,
		ul.pdf-download li a:active,
		ul.pdf-download li a:visited{color:#fff;text-decoration:none;font-weight:bold;margin-left:-10px;}
		ul.pdf-download li a:hover{color:#f78f1e;}

.call{font-size:1.1em;color:#f78f1e;}

/* Click class style*/
.click{color:#fff;}
.click:hover{cursor:pointer;color:#f78f1e;}
.asset-btn:hover{cursor:pointer;}
.backBtn:link,
.backBtn:active,
.backBtn:visited{color:#f78f1e;text-decoration:none;}
.backBtn:hover{color:#fff;}

/* Navigation Bar */
nav{position:relative;bottom:10px;z-index:100;font-size:11px;width:960px;margin: 0 auto;}
	nav ul{text-transform:uppercase;width:960px;list-style:none;}
		nav li{position:relative;float:left;display:block;}

	nav a{display:block;color:#666;text-decoration:none;padding-left:10px;padding-right:10px;white-space:nowrap;}
		nav a:visited{color:#666;}
		nav a:hover, nav a.current{color:#f78f1e;}
.ie7 nav{bottom:0px;}

nav #facilitiesLink{display:none;}

/* Slide Holder */
#slide{position:absolute;/*top:0;left:0;width:100%;*/z-index:0;}
#homePage #slide{top:0;left:0;width:100%;}
	#slide #slideHolder{position:relative;top:0;}
	#slide #slideHolder img{position:absolute;top:0;}

	/* Banner */
	#banner{position:absolute;top:50%;margin-top:-3.5em;height:15em;width:100%;z-index:100;}
		#banner div{width:100%;}
		#banner p{position:absolute;color:#fff;top:50%;margin-top:-1em;width:100%;text-align:center;}
			#banner p span{color:#f78f1e;}
#homePage p.homeText{position:absolute;bottom:9.5%;left:55%;z-index:999;width:20%;padding:10px;color:#fff;background:url('../img/bg/bannerbg.png');border:none;font-size:65.5%;}

#standardPage #slide{width:960px;height:434px;top:240px;} 

/* Text Holder styling */
.textHolder{position:absolute;bottom:0;left:0;width:483px;height:180px;color:#fff;font-family:arial;font-weight:bold;font-size:29px;display:none;}
	.textHolder p{width:450px;line-height:29px;margin-left:70px;}
	.textHolder span{color:#f78f1e;}

.contactPage .textHolder,
.newsPage .textHolder{width:400px;height:100px;}
.powerPage .textHolder{width:540px;height:125px;}
.defencePage .textHolder{width:500px;height:175px;}
.sparesPage .textHolder{width:460px;height:145px;}
.searchPage .textHolder{width:330px;height:145px;}
.facilitiesPage .textHolder{width:460px;height:165px;}
	.facilitiesPage .textHolder p{margin-left:30px;}
.infoPage .textHolder{width:330px;height:145px;}
	.infoPage .textHolder p{margin-left:35px;}
.assetPage .textHolder{width:430px;height:145px;}	
	.assetPage .textHolder p{margin-left:35px;}
.volvoPage .textHolder p{margin-left:35px;}	
	
.js #banner{position:absolute;}
	.js #banner p{display:block;}
	
.js #slideHolder{position:absolute;}
	.js #slideHolder img{position:absolute;left:0;top:0;width:100%;}

/* Footer styling */
footer{}
	footer ul{list-style:none;width:100%;margin:0 0 0 3px;padding:0;}
		footer li{margin:0;padding:0;}
		footer li{float:left;display:block;width:82px;height:81px;margin-right:25px;}
			.oldie footer li{margin-right:24px;}
		footer li:last-child{margin:0;}

/* background, dark, transparent */
section, section h2, article, .bg, #banner, .textHolder{background: url("../img/bg/bannerbg.png") repeat;}
.asset-login-holder fieldset, 
article .workshop-menu{background:url('../img/bg/lighterbg.png') repeat;}		
article .title-holder{background:url('../img/bg/titlebg.png') repeat-x;}		
		
/* icon holder */
footer li, .icons{background-image:url("../img/icons.png");background-repeat:no-repeat;}
.icons-small{background-image:url("../img/icons-small.png");background-repeat:no-repeat;}
.icons-small-70{background-image:url("../img/icons-small-70.png");background-repeat:no-repeat;}

.marine{background-position:0 bottom;}
	.marine.current{background-position:0 top;}
.gas1{background-position:-85px bottom;}
	.gas1.current{background-position:-85px top;}
.rail{background-position:-170px bottom;}
	.rail.current{background-position:-170px top;}
.defence{background-position:-255px bottom;}
	.defence.current{background-position:-255px top;}
.kw{background-position:-338px bottom;}
	.kw.current{background-position:-338px top;}
.radio{background-position:-423px bottom;}
	.radio.current{background-position:-423px top;}
.power{background-position:-508px bottom;}
	.power.current{background-position:-508px top;}
.water{background-position:-592px bottom;}
	.water.current{background-position:-592px top;}
.gas2{background-position:-676px bottom;}
	.gas2.current{background-position:-676px top;}
	
/* Workshop */
article .workshop{position:relative;}
article .workshop-menu{margin-top:-20px;}
article .workshop-menu h2{margin-top:0;margin-left:0;height:30px;line-height:30px;text-indent:80px;vertical-align:middle;}
article .workshop-menu ul{list-style:none;margin-top:11px;}
	article .workshop-menu ul li{position:relative;height:37px;line-height:32px;background:url("../img/workshop-dot.png") no-repeat;margin-left:-10px;padding-left:50px;}
	article .workshop-menu ul li:hover,article .workshop-menu ul li.current{color:#f78f1e;}
	
		article .workshop-menu ul li div{color:#fff;font-weight:bold;position:absolute;top:1px;left:2px;width:30px;text-align:center;}
		article .workshop-menu ul li a:link,
		article .workshop-menu ul li a:visited,
		article .workshop-menu ul li a:active{text-decoration:none;color:#fff;}
		article .workshop-menu ul li a:hover{color:#f78f1e;}
		article .workshop-menu ul li.current a{color:#f78f1e;}
		
article .workshop-images{position:absolute;top:-20px;left:422px;background:url('../img/bg/lighterbg.png') repeat;height:416px;width:508px;display:none;}
article .workshop-images div{width:508px;height:30px;position:absolute;top:0;}
article .workshop-images img{position:absolute;top:30px;}
	article .workshop-images .close{position:absolute;top:10px;right:14px;background:url('../img/close.png') no-repeat;width:14px;height:11px;cursor:pointer;}
	
.workshop-holder{width:829px;height:591px;z-index:100;background:url('../img/workshop/workshop.png') no-repeat;margin:0 auto 40px;position:relative;z-index:0;}
	.workshop-holder>div{width:829px;height:591px;position:relative;}
		.workshop-holder div.area-0{background:url('../img/workshop/Fuel-testing.png') no-repeat;}
		.workshop-holder div.area-1{background:url('../img/workshop/1-engine-refurbishment.png') no-repeat;}
		.workshop-holder div.area-2{background:url('../img/workshop/2-dyno.png') no-repeat;}
		.workshop-holder div.area-3{background:url('../img/workshop/3-honing.png') no-repeat;}
		.workshop-holder div.area-4{background:url('../img/workshop/4-turbo-refurbis.png') no-repeat;}
		.workshop-holder div.area-5{background:url('../img/workshop/5-spare-parts.png') no-repeat;}
		.workshop-holder div.area-6{background:url('../img/workshop/6-fuel-injection.png') no-repeat;}
		.workshop-holder div.area-7{background:url('../img/workshop/7-fuel-testing.png') no-repeat;}
		.workshop-holder div.area-8{background:url('../img/workshop/8-machining.png') no-repeat;}
		.workshop-holder div.area-9{background:url('../img/workshop/9-spray-booth.png') no-repeat;}
		.workshop-holder div.area-10{background:url('../img/workshop/10-cleaning.png') no-repeat;}
		
	.workshop-holder div div.dot{position:absolute;background:url("../img/workshop-dot.png") no-repeat -3px 1px;width:30px;height:32px;line-height:33px;display:none;}
		.workshop-holder div div.dot div{color:#fff;font-weight:bold;position:absolute;top:1px;left:0;width:30px;text-align:center;}
	
	.workshop-holder div div#dot-1{top:210px;right:250px;}
	.workshop-holder div div#dot-2{bottom:160px;left:430px;}
	.workshop-holder div div#dot-3{top:110px;right:275px;}
	.workshop-holder div div#dot-4{top:350px;right:160px;}
	.workshop-holder div div#dot-5{top:127px;left:220px;}
	.workshop-holder div div#dot-6{bottom:90px;left:60px;}
	.workshop-holder div div#dot-7{bottom:250px;left:190px;}
	.workshop-holder div div#dot-8{top:150px;right:190px;}
	.workshop-holder div div#dot-9{bottom:167px;right:210px;}
	.workshop-holder div div#dot-10{top:80px;right:335px;}
	
	.workshop-holder .close{position:absolute;top:10px;right:10px;background:url('../img/close.png') no-repeat;width:14px;height:11px;cursor:pointer;}

	.workshop-holder span{position:absolute;right:0;color:#ccc;}
	
	.uk-only{font-size:0.7em;}

/* logos holder */
#logos{position:absolute;top:155px;right:20px;background:url("../img/logo/volvo_shop_logo.png") no-repeat;z-index:1000;width:400px;height:69px;}

/* Logos areas to click */
#logos div{position:absolute;cursor:pointer;}
#logos .volvoArea{top:5px;left:0;width:320px;height:55px;}
#logos .geArea{top:-10px;right:0;background:url("../img/logo/gelogo.png") no-repeat;width:76px;height:69px;}
.sparesPage .spares-logos{margin-left:40px;}


/* Asset Register, login form */
.asset-login-holder{width:500px;height:125px;margin-left:70px;margin-top:30px;margin-bottom:20px;}
	.asset-login-holder .asset-logo{float:left;margin-top:15px;}
	.asset-login-holder fieldset{float:right;width:318px;height:165px;}
		.asset-login-holder fieldset div{margin-left:37px;margin-top:25px;}
			.asset-login-holder fieldset label{display:block;color:#848483;font-weight:bold;margin-top:-14px;}
			.asset-login-holder fieldset input{display:block;width:80%;color:#000;margin:0px;}
			.asset-login-holder fieldset img{display:block;margin-top:10px;margin-left:-1px;}

/* draggable text-boxes */
.facilitiesPage section{width:500px;height:400px;position:absolute;bottom:300px;right:100px;padding-top:40px;z-index:10;}
	.facilitiesPage section h2{width:100%;height:30px;line-height:30px;position:absolute;top:-10px;left:-40px;text-indent:40px;}
	.facilitiesPage section .close{position:absolute;top:10px;right:10px;background:url('../img/close.png') no-repeat;width:14px;height:11px;cursor:pointer;}

/* News Style page */
.newsPage{}
.newsPage section:nth-child(odd){background:none;}
.newsPage section h2{margin-bottom:10px;background:none;}
.newsPage section div{width:650px;float:left;}
.newsPage section img{float:left;margin-top:20px;margin-left:30px;}

/* contact Style page */
.contactPage{}
.contactPage section:nth-child(even){background:none;}
.contactPage section .address{margin-top:100px;margin-left:50px;width:400px;}
.contactPage section h2{margin-bottom:10px;background:none;}
.contactPage section div iframe{margin-left:50px;margin-top:20px;margin-bottom:20px;}
.contactPage section div p span,
.contactPage section div p a,
.contactPage section div p a:link,
.contactPage section div p a:visited{color:#f78f1e;text-decoration:none;}
.contactPage section div p a:hover{color:#fff;}

/* volvo Style page */
.volvoPage{}
.volvoPage article span{color:#f78f1e;}
.volvoPage article .volvoVisit{margin-left:60px;}
.volvoPage article .volvoAuthorized{margin-top:10px;}
.volvoPage article .pageLink{background:#f78f1e;color:#fff;font-size:1.2em;width:370px;height:50px;line-height:50px;margin-left:40px;}
.volvoPage article .pageLink:hover{color:#000}
.volvoPage article .col .col p{padding-right:5px;}
.volvoPage article .col .col p span{font-weight:bold;}
.volvoPage article .contactInfo{font-size:1.1em;}
.volvoPage article .col .col .contactInfo span{font-weight:normal;}
.volvoPage article .contactInfo a,
.volvoPage article .contactInfo a:link,
.volvoPage article .contactInfo a:visited{color:#f78f1e;text-decoration:none;}
.volvoPage article .contactInfo a:hover{color:#fff;}

/* Ge Marine Style page */
.gePage{}
.gePage .geLogo{position:absolute;top:5px;right:10px;}
.gePage .textHolder p{margin-left:30px;}
.gePage article div+p{font-weight:bold;}
.gePage article>p{color:#f78f1e;}
.gePage article>p+p{color:#fff;}
.gePage article span{color:#f78f1e;}
.gePage article .pageLink{background:#f78f1e;color:#fff;font-size:1.2em;width:370px;height:50px;line-height:50px;margin-left:40px;}
.gePage article .pageLink:hover{color:#000}
.gePage article .col+.col{width:340px;margin-left:90px;}
.gePage article .brochure-holder{font-size:1.1em;}
.gePage article .brochure-holder,
.gePage article .brochure-holder:active,
.gePage article .brochure-holder:visited,
.gePage article .brochure-holder:link{color:#fff;text-decoration:none;}
.gePage article .brochure-holder:hover{color:#f78f1e;}

.gePage article .brochure-holder div{background-image:url("../img/ge-marine/engines-sprite.png");background-repeat:no-repeat;width:275px;margin-top:20px;}
.v228-holder{height:240px;background-position:0 top;}
.l250-holder{height:280px;background-position:0 bottom;margin-bottom:10px;}

.gePage article .brochure-holder~p{padding-left:0;margin-top:30px;margin-left:-50px;width:310px;}
.gePage article .brochure-holder~p+p{font-size:1.2em;}
.gePage article .brochure-holder~p+p a,
.gePage article .brochure-holder~p+p a:active,
.gePage article .brochure-holder~p+p a:visited,
.gePage article .brochure-holder~p+p a:link{color:#f78f1e;text-decoration:none;}
.gePage article .brochure-holder~p+p a:hover{color:#fff;}

/* Accreditations popup */
.accreditationsPopup{background:url('../img/logo/accreditations.jpg') no-repeat;width:446px;height:579px;position:absolute;bottom:160px;left:10%;z-index:100;}
	.accreditationsPopup .close{position:absolute;top:10px;right:14px;background:url('../img/close.png') no-repeat;width:14px;height:11px;cursor:pointer;}

/* Represent popup */	
.representPopup{background:#333333 url('../img/logo/spares-logos.jpg') bottom no-repeat;width:416px;height:420px;position:absolute;bottom:160px;left:10%;z-index:100;}
	.representPopup .close{position:absolute;top:10px;right:14px;background:url('../img/close.png') no-repeat;width:14px;height:11px;cursor:pointer;}	
	
.marginPage .globe{margin-top:20px;margin-left:50px;}
.infoPage .globe{margin-top:20px;margin-left:70px;}
.contactPage .globe{margin-top:20px;margin-left:50px;margin-bottom:20px;}

.facilitiesLink{background:url('../img/royston-e.png') no-repeat 0 8px;display:block;position:relative;top:0px;left:30px;text-decoration:none;color:#000;padding-left:30px;height:37px;line-height:37px;width:320px;clear:both;white-space:nowrap;}
.facilitiesLink:hover{color:#fff;}
.facilitiesLink span{background-color:#f78f1e;padding:1px;height:50px;}

.sparesPage .facilitiesLink{left:25px;}

#player, #player1 {
    background-color:#000;margin-left:30px;
}

/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Hide from both screenreaders and browsers: h5bp.com/u
 */

.hidden {
    display: none !important;
    visibility: hidden;
}

/*
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
 */

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element to be focusable
 * when navigated to via the keyboard: h5bp.com/p
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

/*
 * Hide visually and from screenreaders, but maintain layout
 */

.invisible {
    visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

@media only screen and (min-width: 35em) {
    /* Style adjustments for viewports that meet the condition */
}

@media print,
       (-o-min-device-pixel-ratio: 5/4),
       (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 120dpi) {
    /* Style adjustments for high resolution devices */
}

/* ==========================================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

@media print {
    * {
        background: transparent !important;
        color: #000 !important; /* Black prints faster: h5bp.com/s */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links for images, or javascript/internal links
     */

    a[href^="javascript:"]:after,
    a[href^="#"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group; /* h5bp.com/t */
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}