/* fish pye styles */

@font-face {
    font-family: 'fruticnregular';
    src: url('fruticn.eot');
    src: url('fruticn.eot?#iefix') format('embedded-opentype'),
         url('fruticn.woff2') format('woff2'),
         url('fruticn.woff') format('woff'),
         url('fruticn.ttf') format('truetype'),
         url('fruticn.svg#fruticnregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

.scrollbar-measure {
	width: 100px;
	height: 100px;
	overflow: scroll;
	position: absolute;
	top: -9999px;
}

html
{
	-webkit-text-rendering: optimizeLegibility;
    -moz-text-rendering: optimizeLegibility;
    -ms-text-rendering: optimizeLegibility;
    -o-text-rendering: optimizeLegibility;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -ms-font-smoothing: antialiased;
    -o-font-smoothing: antialiased;
    font-smoothing: antialiased;
	min-width: 320px;
	overflow-y: scroll;
	box-sizing: border-box;
}

html, body {
	height: 100%;
	font-size: 100%;
}

*,
*:before,
*:after {
	-webkit-box-sizing: inherit;
	-moz-box-sizing: inherit;
	box-sizing: inherit;
}

body {
	color: #fff;
	cursor: auto;
	font-family: 'fruticnregular';
	font-style: normal;
	font-weight: normal;
	line-height: 1;
	margin: 0;
	padding: 0;
	position: relative;
	text-align: center;
}

body.home  {
	background-color: #306;
}

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

a:hover, a:active {
	color: #fff;
	text-decoration: underline;
}

*:focus
{
	outline: none;
}

input, textarea {
	font-size: 100%;
}

h1, h2, h3, h4, h5, h6, p, li, dt, dd, strong, b, address
{
	font-weight: normal;
	font-style: normal;
}

picture
{
	width: 100%;
	margin: 0;
	padding: 0;
	overflow: hidden;
	display: block;
}

img
{
	display: block;
	width: 100%;
	height: auto;
	margin: 0;
	-ms-interpolation-mode: bicubic;
}

.home header {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	position: absolute;
	top: 0;
	left: 0;
	background: url(../images/full-logo-white.svg) no-repeat 50% 45%;
	background-size: 80% auto;
	z-index: 100;
}

.back header {
	width: 20%;
	height: 75%;
	margin: 0;
	padding: 0;
	position: absolute;
	top: 0;
	left: 0;
	background: url(../images/full-logo-blue-turned.svg) no-repeat 90% 100%;
	background-size: auto 80%;
	z-index: 200;
}

header h1 {
	font-size: 0;
	line-height: 0;
	width: 0;
	height: 0;
	display: none;
}

.home header nav {
	margin: 0;
	padding: 0;
	position: absolute;
	top: 3%;
	right: 5%;
	width: 36px;
	height: 35px;
}

.home header nav a {
	width: 36px;
	height: 35px;
	background: url(../images/pointermap.svg) no-repeat;
	background-size: 100%;
	display: block;
	opacity: 0.8;
	text-indent: -9999px;
}

.home header nav a:hover {
	opacity: 1;
}

.back header nav {
	margin: 0;
	padding: 0;
	position: absolute;
	top: 5%;
	right: -375%;
	width: 36px;
	height: 35px;
}

.back header nav a {
	width: 36px;
	height: 35px;
	background: url(../images/home.svg) no-repeat center top;
	background-size: 29px 26px;
	display: block;
	opacity: 0.8;
	text-indent: -9999px;
}

.back header nav a:hover {
	opacity: 1;
}

.home main {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	background: url(../images/logo-sheared-white.svg) no-repeat 50% 50%;
	background-size: 80% auto;
  /*-webkit-filter: blur(15px);
  filter: blur(15px);*/
	position: absolute;
	top: 0;
	left: 0;
}

.back main {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	position: absolute;
	top: 0;
	left: 0;
}

#map_uk {
	width: 60%;
	height: 60%;
	top: 15%;
	position: absolute;
	bottom: 25%;
	right: 20%;
	left: 20%;
	margin: 0 auto;
    background: url(/images/map.png) no-repeat fixed center;
    background-size: cover;
    resize: none;
    overflow: scroll;
}

#map_uk a {
	display: block;
    width: 100%;
    height: 100%;
}

.home footer {
	width: 100%;
	margin: 0;
	padding: 0;
	text-align: center;
	position: absolute;
	bottom: 50px;
	left: 0;
	height: auto;
	z-index: 100;
	pointer-events: none;
}

.back footer {
	width: 100%;
	margin: 0;
	padding: 0;
	text-align: center;
	position: absolute;
	bottom: 0;
	left: 0;
	height: 25%;
	z-index: 100;
	pointer-events: none;
}

.home address {
	margin: 0;
	padding: 0;
	text-align: center;
	font-size: 29px;
	font-size: 29rem;
	line-height: 1;
	color: #fff;
}

.home address a {
	padding-left: 32px;
	padding-left: 32rem;
	background: url(../images/phone.svg) no-repeat 0 50%;
	background-size: auto 90%;
	margin-left: 14px;
	margin-left: 14rem;
	color: #fff;
}

.back address {
	margin: 0;
	padding: 20px 0 0;
	padding: 20rem 0 0;
	text-align: center;
	font-size: 22px;
	font-size: 22rem;
	line-height: 1;
	color: #306;
}

.back address a {
	padding-left: 24px;
	padding-left: 24rem;
	background: url(../images/phone-blue.svg) no-repeat 0 50%;
	background-size: auto 90%;
	margin-left: 12px;
	margin-left: 12rem;
	color: #306;
}

#overlay {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 200;
	pointer-events: none;
}

.home #overlay .tile {
	margin: 0;
	padding: 0;
	position: absolute;
	background: url(../images/logo-white.svg) no-repeat 50% 50%;
	background-size: contain;
	-ms-transform: scale(0,0);
    -webkit-transform: scale(0,0);
    transform: scale(0,0);
}

.back #overlay .tile {
	margin: 0;
	padding: 0;
	position: absolute;
	background: url(../images/logo-blue.svg) no-repeat 50% 50%;
	background-size: contain;
	-ms-transform: scale(0,0);
    -webkit-transform: scale(0,0);
    transform: scale(0,0);
}

#overlay.animate .tile {
	/*transform: scale(10,10);*/
	
	-moz-animation-name: dotscreen;
    -moz-animation-iteration-count: 1;
    -moz-animation-timing-function: ease-in;
    -moz-animation-duration: 1s;

    -webkit-animation-name: dotscreen;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: ease-in;
    -webkit-animation-duration: 1s;

    animation-name: dotscreen;
    animation-iteration-count: 1;
    animation-timing-function: ease-in;
    animation-duration: 1s;
}