@charset "UTF-8";

@font-face {
font-family: "material";
src:url(//www.loch-lomond-waterfront.co.uk/wp-content/plugins/arscode-ninja-popups/fonts/material.eot);
src:url(//www.loch-lomond-waterfront.co.uk/wp-content/plugins/arscode-ninja-popups/fonts/material.eot?#iefix) format("embedded-opentype"),
url(//www.loch-lomond-waterfront.co.uk/wp-content/plugins/arscode-ninja-popups/fonts/material.woff) format("woff"),
url(//www.loch-lomond-waterfront.co.uk/wp-content/plugins/arscode-ninja-popups/fonts/material.ttf) format("truetype"),
url(//www.loch-lomond-waterfront.co.uk/wp-content/plugins/arscode-ninja-popups/fonts/material.svg#material) format("svg");
font-weight: normal;
font-style: normal;
}
.material .material-checkbox:before {
font-family: "material" !important;
font-style: normal !important;
font-weight: normal !important;
font-variant: normal !important;
text-transform: none !important;
speak: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
} .material .material-input{
position: relative;
padding-top: 18px;
margin-bottom: 10px;
background:transparent;
}
.material .material-input:after{
display: block;
clear: both;
content:"";
}
.material .material-input input, 
.material .material-input textarea{
font-size: 16px;
width: 100%;
border:0;
border-bottom: 1px solid lightgray;
outline: none;
background: 0;
float:left;
}
.material .material-input textarea{
height: 120px;
padding:7px 0;
}
.material .material-input input{
height: 32px;
}
.material .material-input label{
line-height: 32px;
}
.material .material-input label{
color:gray;
font-size: 16px;
font-weight: 300;
position: absolute;
left:0;
top:18px;
}
.material .material-bar{
position: absolute;
bottom:0;left:0;
display: block;
width: 100%;
}
.material .material-bar:before, 
.material .material-bar:after{
content:"";
height: 2px;
width: 0;
bottom:0;
position: absolute;
background: #0000ff;
}
.material .material-bar:before{
left:50%;
}
.material .material-bar:after{
right:50%;
}
.material .material-input :focus ~ .material-bar:before,
.material .material-input :focus ~ .material-bar:after,
.material .error ~ .material-bar:before,
.material .error ~ .material-bar:after{
width:50%;
}
.material .error ~ .material-bar:before,
.material .error ~ .material-bar:after,
.material .error ~ .material-bar:before,
.material .error ~ .material-bar:after{
background:#ff0000;
}
.material .error:focus,
.material .error.filled,
.material .error:not(.filled) ~ label{
color:red;
}
.material .material-input :focus ~ label,
.material .material-input .filled ~ label,
.material .error:focus ~ label{
color:lightgray;
font-size: 13px;
top:0;
line-height: 24px;
} .material .material-group{
padding-top: 10px;
}
.material .material-group input{
display: none
}
.material .material-group-item{
position: relative;
margin-bottom: 5px;
}
.material .material-group-item:last-child{
margin-bottom: 0
}
.material .material-group label{
padding-left: 30px;
position: relative;
cursor: pointer;
z-index: 2;
font-weight: 300;
}
.material .material-checkbox,
.material .material-radio{
width: 18px;
height: 18px;
background:transparent;
left:0;
top:50%;
margin-top: -9px;
position: absolute;
z-index: 1;
border: 2px solid gray;
}
.material .material-radio{
border-radius: 10px;
}
.material .material-checkbox{
border-radius: 3px;
}
.material .material-checkbox:before{
content:"a";
font-size: 14px;
text-align: center;
padding-top: 3px;
color:#fff;
background:gray;
position: absolute;
top:0;left:0;right:0;bottom:0;
-webkit-transform: scale(0);
-moz-transform: scale(0);
-ms-transform: scale(0);
-o-transform: scale(0);
transform: scale(0);
}
.material .material-radio:before{
position: absolute;
top:3px;left:3px;
width: 8px;
height: 8px;
border-radius: 4px;
background:gray;
content:"";
-webkit-transform: scale(0);
-moz-transform: scale(0);
-ms-transform: scale(0);
-o-transform: scale(0);
transform: scale(0);
}
.material input:checked ~ .material-radio:before,
.material input:checked ~ .material-checkbox:before{
-webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
transform: scale(1);
} .material .material-select {
font-size: 16px;
font-weight: 300;
width: 100%;
position: relative;
margin-bottom: 10px;
padding-top: 18px;
z-index: 3
}
.material .material-select input{display: none}
.material .material-select > label{
color:gray;
border-bottom: 1px solid lightgray;
height: 40px;
line-height: 40px;
padding:0 30px 0 0px;
width: 100%;
cursor: pointer;
position: relative;
display: block;
}
.material .material-select > .material-title{
position: absolute;
color:lightgray;
height: 40px;
line-height: 40px;
top:18px;left:0;
opacity: 0;
visibility: hidden;
}
.material .material-select > input:checked + .material-title,
.material .material-select.filled > .material-title{
top:0;
opacity: 1;
visibility: visible;
font-size: 13px;
line-height: 24px;
}
.material .material-select > label strong{
border-color: lightgray transparent transparent transparent;
border-style: solid;
border-width: 6px 5px 0 5px;
margin-top: -3px;
width: 0;
height: 0;
position: absolute;
right:0;top:50%;
}
.material .material-select > input:checked ~ ul{
visibility: visible;
opacity: 1;
top:24px;
}
.material .material-select ul{
background:#fff;
top:0;
left:0;width: 100%;
position: absolute;
opacity: 0;
visibility: hidden;
z-index: 2
}
.material .material-select ul li label{
color:gray
}
.material .material-select ul li input:checked + label, 
.material .material-select ul li:hover input:checked + label{
font-weight: 400
}
.material .material-select ul li label{
display: block;
cursor: pointer;
padding:7px 10px;
}
.material .material-select ul li label:hover{
background:#f5f5f5
}
.material .material-select > input:checked + .material-bar{
top:22px;
}
.material .material-select .material-bar{
height: 2px;
background: #0000ff;
width: 0;
bottom:auto;
top:56px;
} .material .material-select ul{
box-shadow: 0 2px 2px rgba(0,0,0,.2);
} .material .material-select ul,
.material .material-bar:before, 
.material .material-bar:after,
.material .material-input label,
.material .material-select .material-bar,
.material .material-select > span,
.material .material-radio:before,
.material .material-checkbox,
.material .material-checkbox:before,
.material .material-checkbox:after{
transition:.2s ease all; 
-moz-transition:.2s ease all; 
-webkit-transition:.2s ease all;
} .material{
-webkit-user-select: none;  
-moz-user-select: none;    
-ms-user-select: none;      
user-select: none;
} .material *,
.material *:before,
.material *:after {
-webkit-box-sizing: border-box; 
-moz-box-sizing:    border-box; 
box-sizing:         border-box;
}