/*------------------------------------------------------
BASIC
------------------------------------------------------*/

html, body {
	margin:0px;
	padding:0px;
	height: 100%;
}

body {
    width: 100%;
    font-family: Arial, Helvetica Neue, Helvetica, sans-serif;
	text-align: left;
	font-size: 13px;
	line-height: 17px;
	color: #000;
	font-weight: normal;
}

.page {
	z-index: 1;
	width: 980px;
	background-image: none;
	border-width: 0px;
	background-color: #FFF;
	margin-left: auto;
	margin-right: auto;
}

.header {
	width: 100%;
}

.logo {
   	margin: 25px 20px 75px 20px;
}

/*------------------------------------------------------
TYPO
------------------------------------------------------*/

h2 {
    font-size: 17px;
	line-height: 17px;
	margin:0px;
	padding:0px;
	font-weight: normal;
}

 a:link {
  color:#000;
  text-decoration: none;
  font-weight: normal;
  }
  
 a:visited {
  color:#000;
  text-decoration: none;
  font-weight: normal;
  }
  
 a:hover {
  color:#666;
  text-decoration: underline;
  font-weight: normal;
  }
  
  a.footer:link {
  color:#FFF;
  text-decoration: none;
  font-weight: normal;
  }
  
 a.footer:visited {
  color:#FFF;
  text-decoration: none;
  font-weight: normal;
  }
  
 a.footer:hover {
  color:#CFCFCF;
  text-decoration: underline;
  font-weight: normal;
  } 


/*------------------------------------------------------
CONTENT
------------------------------------------------------*/

.content {
	margin: 0 20px 100px 20px;
	display: block;
}

.clear {
	clear:both;
}

.image-left, .image-right {
	float: left;
	width: 67%;
}

.image-right {
	float: right;
}

.text-right {
	float: right;
	width: 30%;
}

.text-left {
	float: left;
	width: 30%;
}

.master-image {
	padding: 0;
}

.master-image img {
	width: 100%;
}

.master-image a {
	filter: grayscale(100%);
	transition: all 1s ease;
}

.master-image a:hover{
	filter: grayscale(0%);
}

.tumb-image-left, .tumb-image-right {
	width: 100%;
}

.tumb-image-left .image-wrapper, .tumb-image-right .image-wrapper, .tumb-image-left .image-wrapper-first, .tumb-image-right .image-wrapper-first, .tumb-image-left .image-wrapper-last, .tumb-image-right .image-wrapper-last,
.tumb-image-left .image-wrapper-first-line, .tumb-image-left .image-wrapper-second-line, .tumb-image-left .image-wrapper-first-line-last, .tumb-image-left .image-wrapper-second-line-first, .tumb-image-right .image-wrapper-first-line, .tumb-image-right .image-wrapper-second-line {
	width: 11.175%;
}

.tumb-image-left .image-wrapper {
	float: left;
	padding: 0.75% 0.75% 0 0.75%;
}

.tumb-image-right .image-wrapper {
	float: right;
	padding: 0.75% 0.75% 0 0.75%;
}

.tumb-image-left .image-wrapper-first {
	float: left;
	padding: 0.75% 0.75% 0 0.75%;
	padding-left: 0 !important;
}

.tumb-image-right .image-wrapper-first {
	float: right;
	padding: 0.75% 0.75% 0 0.75%;
	padding-right: 0 !important;
}

.tumb-image-left .image-wrapper-first-line, .tumb-image-left .image-wrapper-second-line {
	float: left;
	padding: 0.75% 0.75% 0 0.75%;
}

.tumb-image-right .image-wrapper-first-line, .tumb-image-right .image-wrapper-second-line {
	float: right;
	padding: 0.75% 0.75% 0 0.75%;
}

.tumb-image-left .image-wrapper-last {
	float: left;
	padding: 0.75% 0.75% 0 0.75%;
	padding-right: 0 !important;
}

.tumb-image-right .image-wrapper-last {
	float: right;
	padding: 0.75% 0.75% 0 0.75%;
	padding-left: 0 !important;
}

.tumb-image-left img, .tumb-image-right img {
	width: 100%;
	opacity: .65;
	filter: grayscale(100%);
}

.tumb-image-left img:hover, .tumb-image-right img:hover {
	  width: 100%;
	  opacity: 1;
	  transition: all 1s ease;
	  filter: grayscale(0%);
}	  
		
.tumb-image-left .image-wrapper-first-line-last {
	float: left;
	padding: 0.75% 0.75% 0 0.75%;
	padding-right: 0 !important;
}

.tumb-image-left .image-wrapper-second-line-first {
	float: left;
	padding: 0.75% 0.75% 0 0.75%;
	padding-left: 0 !important;
}


/*------------------------------------------------------
FOOTER
------------------------------------------------------*/

.footer {
	z-index: 1;
	width: 100%;
	height: 160px;
	background-color: #000000;
}

.footer-content {
	width: 980px;
	background-image: none;
	margin-left: auto;
	margin-right: auto;
	font-size: 12px;
	line-height: 19px;
	color: #FFF;
}

.footer-address {
	margin: 0 20px 0 20px;
	padding-top: 20px;
}


/*------------------------------------------------------
MEDIA
------------------------------------------------------*/

@media screen and (min-width: 600px) and (max-width: 900px) {

.page {
	width: 100%;
}

.image-left, .image-right {
	float: left;
	width: 48%;
	position: static;
    overflow: hidden;
}

.image-right {
	float: right;
}

.text-right {
	float: right;
	width: 48%;
}

.text-left {
	float: left;
	width: 48%;
}

}


@media screen and (max-width: 660px) {

h2 {
	padding-top: 20px;	
}

body {
    min-width: 100%;
    width: 100%;
}

.page {
    width: 100%;
    min-height: 1200px;
}

.image-left {
	display: inline;
	width: 100%;
}

.text-right {
	float: right;
	width: 100%;
}

.text-left {
	float: left;
	width: 100%;
}

.image-right {
	float: right;
	width: 100%;
	text-align: left;
}

.tumb-image-left .image-wrapper, .tumb-image-right .image-wrapper, .tumb-image-left .image-wrapper-first, .tumb-image-right .image-wrapper-first, .tumb-image-left .image-wrapper-last, .tumb-image-right .image-wrapper-last {
	width: 11.125%;
}

.tumb-image-left .image-wrapper, .tumb-image-right .image-wrapper, .tumb-image-left .image-wrapper-first, .tumb-image-right .image-wrapper-first, .tumb-image-left .image-wrapper-last, .tumb-image-right .image-wrapper-last {
	float: left;
	padding: 0.75% 0.75% 0 0.75%;
}

.tumb-image-left .image-wrapper-first, .tumb-image-right .image-wrapper-first {
	padding-left: 0 !important;
}

.tumb-image-left .image-wrapper-last, .tumb-image-right .image-wrapper-last {
	padding-right: 0 !important;
}

.footer-content, .master-image img {
	width: 100%;
}

}


@media screen and (max-device-width: 480px) {

body {
    min-width: 100%;
    width: 100%;
    font-size: 1.5em;
	line-height: 1.75em;
}

.page {
    width: 100%;
    min-height: 1200px;
}

.logo img{
   	width:30%;
}

h2 {
	padding-top: 2em;
    font-size: 1.75em;
	line-height: 1,75em;
}

.image-left {
	display: inline;
	width: 100%;
}

.text-right, .text-left, .image-right, .image-left {
	float: left;
	width: 100%;
}

.tumb-image-left .image-wrapper, .tumb-image-right .image-wrapper,
.tumb-image-left .image-wrapper-first, .tumb-image-right .image-wrapper-first,
.tumb-image-left .image-wrapper-last, .tumb-image-right .image-wrapper-last,
.tumb-image-left .image-wrapper-first-line, .tumb-image-right .image-wrapper-first-line,
.tumb-image-left .image-wrapper-second-line, .tumb-image-right .image-wrapper-second-line,
.tumb-image-left .image-wrapper-first-line-last, .tumb-image-left .image-wrapper-second-line-first,
.tumb-image-right .image-wrapper-first-line-last, .tumb-image-right .image-wrapper-second-line-first {
	width: 22.25%;
	float: left;
}

.tumb-image-left .image-wrapper, .tumb-image-right .image-wrapper,
.tumb-image-left .image-wrapper-first, .tumb-image-right .image-wrapper-first,
.tumb-image-left .image-wrapper-last, .tumb-image-right .image-wrapper-last,
.tumb-image-left .image-wrapper-first-line, .tumb-image-right .image-wrapper-first-line,
.tumb-image-left .image-wrapper-first-line-last, .tumb-image-right .image-wrapper-first-line-last,
.tumb-image-left .image-wrapper-second-line, .tumb-image-right .image-wrapper-second-line, 
.tumb-image-left .image-wrapper-second-line-first, .tumb-image-right .image-wrapper-second-line-first,
.tumb-image-left .image-wrapper-second-line-last, .tumb-image-right .image-wrapper-second-line-last {
	float: left;
	padding: 1.75%;
}

.tumb-image-left .image-wrapper-first-line, .tumb-image-right .image-wrapper-first-line,
.tumb-image-left .image-wrapper-first-line-last, .tumb-image-right .image-wrapper-first-line-last,
.tumb-image-left .image-wrapper-second-line-last, .tumb-image-right .image-wrapper-second-line-last {
	padding-right: 0 !important;
}

.tumb-image-left .image-wrapper-second-line, .tumb-image-right .image-wrapper-second-line,
.tumb-image-left .image-wrapper-second-line-first, .tumb-image-right .image-wrapper-second-line-first,
.tumb-image-left .image-wrapper-second-line-first, .tumb-image-right .image-wrapper-second-line-first {
	padding-left: 0 !important;
}

.footer-content {
	width: 100%;
}

.master-image img{
	width: 100%;
}

}

@media screen and (max-device-width: 320px) {
	body {
    font-size: 2em;
	line-height: 1.75em;
}

.footer {
	height: 12em;
}

.footer-address {
    font-size: 3em;
	line-height: 1.5em;
}

}