
/* Stylesheet The Travelling Bears 7th March 2015 
*/



body,
	html   {
	margin:0;
	padding:0;
	border:0;
	font-family: Arial, Tahoma, sans-serif;
	font-size: 1em;
	COLOR: #404040;
	background-color: rgb(250, 250, 250);
}

h1, h2 { font-family: Arial Narrow, sans-serif;
}

h1 {
	font-size: 6em;	
	color: rgb(111, 49, 111);
	margin-bottom: 1.5em;
	padding-top: 0.8em;
}

h2 {
	font-weight: 300;
	font-family: 'Arial',sans-serif;
	font-size: 4.6em;
	padding-left: 1.6em;
	position: relative;
	text-shadow: 1px 2px 9px #222;
	color: #fefefe;
}

p	{
	line-height: 1.4em;
}

.h1header {
	font-family: Arial Narrow, sans-serif;
	font-size: 6em;	
	color: rgb(111, 49, 111);
	}

.h1header2 {
	font-family: Arial Narrow, sans-serif;
	font-size: 5.5em;	
	color: rgb(240, 240, 240);
	}

A {
	COLOR: #5000FF;
	font-size: 1.0em;
	FONT-FAMILY: Arial, Lucida sans Unicode, Helvetica, sans-serif;
	TEXT-ALIGN: left;
	TEXT-DECORATION: none;
}

A:hover {
	COLOR: #303030;
	FONT-FAMILY: Arial, Lucida sans Unicode, Helvetica, sans-serif;
	TEXT-ALIGN: left;
	TEXT-DECORATION: underline;
}

A.note {
	COLOR: #808080;
	font-size: 1.0em;
	FONT-FAMILY: Lucida sans Unicode, Arial, Helvetica, sans-serif;
	TEXT-ALIGN: left;
	TEXT-DECORATION: none;
}

A.note:hover {
	COLOR: #A0A0A0;
	FONT-FAMILY: Lucida sans Unicode, Arial, Helvetica, sans-serif;
	TEXT-ALIGN: left;
	TEXT-DECORATION: underline;
}

/* --- Navigation Bar --------------------------------------------- */


ul	{
	list-style-type: none;
	padding: 0;
	margin: 0;
	width: 26em;
	}

nav {
	background: rgba(0, 75, 151,0.7);
	width: 100%;
	position: relative;
	z-index: 1000;
	height: 3.8em;
	text-align: center;
}

nav ul {
	display: inline-block;
	padding-top: 0.3em;
	padding-bottom: 1em;
}

nav ul li {
	position: relative;
	float: left;
	margin: 0;
}

nav ul li a {
	font-family: 'Arial Narrow',sans-serif;
	font-size: 20px;
	font-weight: 400;
	color: #e0e0e0;
	text-decoration: none;
	padding: 15px;
}

nav ul li a:hover {
	font-family: 'Arial Narrow',sans-serif;
	font-size: 20px;
	font-weight: 400;

	color: #a90e4b;
	color: #ffffff;
	background: rgba(0,75,151,0.9);
}

/* --- Container --------------------------------------------- */


#wrap {
	margin-right: auto;
	margin-left: auto;
	max-width: 82em;
	}

.article {
	width: 80%;
	margin: 0 auto; 
	padding: 2em;
	background: rgba(250,250,250,1.0);
}

.article2 {
	width: 70%;
	margin: 0 auto; 
	padding: 2em;
	background: rgba(250,250,250);
}

#banner img{
	width: 100%;
	}

.img1	{
	width: 214px;
	margin-left: 1em;
	margin-bottom: 1.0em;
	float: right;
	}

.img2	{
	width: 214px;
	margin-right: 1em;
	margin-bottom: 1.0em;
	float: left;
	}

.boxlightgrey {
	padding-top: 0.8em;
	padding-left: 0.8em;
	border:1px solid rgb(230, 230, 230);
	background-color: rgb(243, 243, 243);
}

.box2 {
	padding-top: 1.0em;
	padding-left: 1.0em;
	padding-right: 1.0em;
	border:1px solid rgb(230, 230, 230);
	background-color: rgb(243, 243, 243);
}

.boxlightgreyimg {
	float; left;
	margin-right: 0.0em;
	margin-bottom: 0.0em;
}

.clear-both { clear: both; }

/* -- Video Background -------------------------------------------------------*/

.homepage{
	position:relative;
	overflow:hidden;
	z-index:1;
	margin-bottom: 0px;
}

.header-unit {
	height: 100%;
	border: 0px solid #000;
	border-right:none;
	border-left: none;
	position: relative;
	padding: 0px;
}

#video-container {
	position: absolute;
	top:0%;
	left:0%;
	height:100%;
	width:100%;
	overflow: hidden;
	z-index:-10;

}
video {
	position:absolute;
	z-index:-1;
}

video.fillWidth {
	width: 100%;
}

.vidtext .vidquote{
	display:table;
	width:100%;
	height:100%; 
	padding:0 !important;
	margin:0 !important;
}
.vidtext.fixed{
	background-attachment:fixed;
}
.vidtext.fixed-desktop{
	background-attachment:fixed !important;
}
.vidtext .vidquote .quote{
	display: table-cell; 
	vertical-align:middle;
}
.vidtext {
	text-align:left;
	padding-left: 40px;
	padding-right: 10px;
}

.vidtext h2 span{
	text-shadow: 0px 0px 5px #222;
	color: #fefefe;
}

/* --- Parallax Window --------------------------------------------- */


.parawin{
	width:100%;
	height:560px; 
	padding:0;
	margin:0;
	background-attachment:fixed;
	background-repeat:no-repeat; 
	border-top:1em solid rgba(255,255,255,0.3);
	border-bottom:1em solid rgba(255,255,255,0.3);
	color:#fff;  
	position:relative;
}

.parawin .quoteWrap{
	display:table;
	width:100%;
	height:100%; 
	padding:0 !important;
	margin:0 !important;
}

.parawin.fixed{
	background-attachment:fixed;
}
.parawin.fixed-desktop{
	background-attachment:fixed !important;
}

.parawin .quote{
	display: table-cell; 
	vertical-align: middle;
}
.parawin {
	text-align: left;
}

/* --- Parallax Window End ----------------------------------------- */


/* -- Footer -----------------------------------------------------------*/

.bund {
	height: 13em;
	padding:0;
	background-color: #303030;
}

#footer1 {
	COLOR: #808080;
	margin-right: auto;
	margin-left: auto;
}


/* --------------------------------------------------------------------- */
@media screen and (max-width: 60em) {

.h1header {
	font-size: 5.5em;
}

h2	{
	font-size: 3.6em;
}

.article2 {
	width: 84%; 
	padding: 0.6em;
}

nav ul li a {
	font-size: 20px;
	font-weight: 400;
	padding: 15px;
}
nav ul li a:hover {
	font-size: 20px;
	font-weight: 400;
}

.img363 img {
	width: 20em;
}

}

/* --------------------------------------------------------------------- */
@media screen and (max-width: 50em) {

.h1header {
	font-size: 4.5em;
}

h2	{
	font-size: 2.8em;
}

.vidtext {
	padding-left: 5px;
	padding-right: 5px;
}

.article2 {
	width: 88%; 
	padding: 0.6em;
}

ul	{
	width: 26em;
	}

}
nav ul li a {
	font-size: 18.5px;
	font-weight: 400;
	padding: 14px;
}
nav ul li a:hover {
	font-size: 18.5px;
	font-weight: 400;
	padding: 14px;
}

.img363 img {
	width: 17em;
}

}

/* --------------------------------------------------------------------- */
@media screen and (max-width: 40em) {

ul	{
	width: 21em;
	}

}

/* --------------------------------------------------------------------- */
@media screen and (max-width: 30em) {

.h1header {
	font-size: 4.0em;
}

h2	{
	font-size: 1.8em;
}

.article {
	width: 90%;
	margin: 0 auto; 
	padding: 0.6em;
	background: rgba(250,250,250,1.0);
}

.article2 {
	width: 92%; 
	padding: 0.6em;
}

.boxlightgrey {
	padding-top: 0.6em;
	padding-left: 0.6em;
	border:1px solid rgb(230, 230, 230);
	background-color: rgb(243, 243, 243);
}

.img1	{
	width: 100%;
	}

.img2	{
	width: 100%;
	}

.img3	{
	width: 10em;
	}

ul	{
	width: 18em;
	}

nav ul li a {
	font-size: 15px;
	font-weight: 400;
	padding: 8px;
}
nav ul li a:hover {
	font-size: 15px;
	font-weight: 400;
	padding: 8px;
}

.img363 img {
	margin-bottom: 0.6em;
	width: 100%;
}

}

/* --------------------------------------------------------------------- */
@media screen and (max-width: 20em) {

.vidtext {
	padding-left: 0px;
	padding-right: 0px;
}

.img3	{
	width: 8.5em;
	}

}
