/*  Less Framework 4
    http://lessframework.com
    by Joni Korpi
    License: http://opensource.org/licenses/mit-license.php */


/* ----- Resets -----*/

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, 
p, blockquote, pre, a, abbr, address, cite, code, del, dfn, em, 
img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, hr, 
dl, dt, dd, ol, ul, li, fieldset, form, label, legend, input, textarea, select,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figure, figcaption, hgroup, 
menu, footer, header, nav, section, summary, time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
outline: none;
}

article, aside, canvas, figure, figure img, figcaption, hgroup,
footer, header, nav, section, audio, video {
display: block;
}

a img {border: 0;}

.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }

/* ----- Typography presets -----   */
@font-face {
font-family: /*'LeagueGothicRegular',*/Arial, Helvetica, sans-serif;;
/*src: url('font/League_Gothic-webfont.eot');
src: url('font/League_Gothic-webfont.eot?#iefix') format('embedded-opentype'),
     url('font/League_Gothic-webfont.woff') format('woff'),
     url('font/League_Gothic-webfont.ttf') format('truetype'),
     url('font/League_Gothic-webfont.svg#LeagueGothicRegular') format('svg');*/
font-weight: normal;
font-style: normal;

}

h1, h2, h3, h4 {
font-family:/*'LeagueGothicRegular',*/ Arial, Helvetica, sans-serif;
font-weight:normal;
line-height:1.2;
}

h1 {
font-size:48px;
}

h2 {
font-size:32px;
color:#527883;
}
.hidden
{
visibility:hidden
}


h3 {
font-size:24px;
}

h4 {
font-size:18px;
}

.small, 
small {
font-size:12px;
}

ul,li { list-style: none; }

a { text-decoration:none; }

/* Selection colours */

::selection         { background:rgb(255,255,158);}
::-moz-selection    { background:rgb(255,255,158);}
img::selection      { background:transparent;}
img::-moz-selection { background:transparent;}
body {-webkit-tap-highlight-color:transparent;}



/*      Default Layout: 992px. 
        Gutters: 24px.
-------------------------------------------------------------------------------
cols    1     2      3      4      5      6      7      8      9      10
px      68    160    252    344    436    528    620    712    804    896    */

body {
background:#eeeeee /*url(img/noise.png) left top*/;
color:#3c3c3c;
-webkit-text-size-adjust: 100%; /* Stops Mobile Safari from auto-adjusting font-sizes */
font-family:"Arial Narrow", Arial, Helvetica, sans-serif;
font-size:16px;
line-height:1.5;
text-align:center;
}


.wrapper {
width:896px;
margin:0 auto;


}


/* ----- header ----- */
header {
padding-bottom:30px;
padding-top: 5px;
background:  url(img/bg.png) left top; grey;
-webkit-box-shadow:0 0px 3px rgba(14,160,231,0.9);
-moz-box-shadow:0 0px 3px rgba(14,160,231,0.9);
box-shadow:0 0px 3px rgba(14,160,231,0.9);

}

#logo
{ 
/*background-image:url(img/rc-logo.png);*/

height:56px;
width:170px;
margin-top: 10px;
margin-left: -15px;
display:block;
}


#nav
{ 
 

}

nav { 
 
float:right; 
/*display:inline;*/ 
height:0px;

}

nav ul { 

list-style-type:none;
height:0px; 
}

nav li{
display:inline;
float:left;
margin:0 0 0 0px;
width:80px;
height: 20px;
}

nav li a {

display:inline;
float:left;
width:0px;
height:0px;
line-height: 0px;
text-align:center;
font-family: Arial, Helvetica, sans-serif;
font-size: 19px;
/*-moz-border-radius:320px;
-webkit-border-radius:320px;
border-radius:320px;
-webkit-box-shadow:1px 1px 1px rgba(0,0,0,0.6);
-moz-box-shadow:1px 1px 1px rgba(0,0,0,0.6);
box-shadow:1px 1px 1px rgba(0,0,0,0.6);*/
}

nav li a:link, 
nav li a:visited  { 
color:#3a3a3a;
background:#4F699D; /* rgba fix IE */
background:rgba(255,255,255,0);
text-shadow: 0px 0px 0px rgba(0,0,0,0);
/*-webkit-transition: all 0.4s; 
-moz-transition: all 0.4s; 
-0-transition: all 0.4s; 
transition: all 0.4s*/;
}

nav li a:hover, 
nav li a:focus, 
nav li a:active,
nav li a.hover { 
color: #527883;
text-shadow:none;
/*-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-o-transform: rotate(180deg);
transform: rotate(180deg);*/
}





/* ----- content ----- */
section {
text-align:left;
padding:48px 0;
}

section:nth-child(even)   { 
background:url(img/noise.png); 
}

section h2 {
text-shadow: 1px 1px 1px #ffffff;
}

.multi-column {
-moz-column-count:3;
-webkit-column-count:3;
column-count:3;
-moz-column-gap:24px;
-webkit-column-gap:24px;
column-gap:24px;
text-align:justify;
text-shadow: 1px 1px 1px #ffffff;
}

.multi-column2 {
-moz-column-count:1;
-webkit-column-count:1;
column-count:1;
-moz-column-gap:20px;
-webkit-column-gap:20px;
column-gap:20px;
text-align:left;
text-shadow: 1px 1px 1px #ffffff;
}

.go-top { 
text-align:center;
margin-top:24px;
}

.go-top a {
display:block;
width:48px;
height:48px;
line-height:48px;
/*-moz-border-radius:192px;
-webkit-border-radius:192px;
border-radius:192px;*/
position:relative;
margin:0 auto;
}

.go-top img {
position:absolute;
top:6px;
left:6px;
}

.go-top a:link, 
.go-top a:visited  { 
color:#FFFFFF;
background:rgba(255,255,255,0.2);
/*-webkit-transition: all 0.4s; 
-moz-transition: all 0.4s; 
-0-transition: all 0.4s; 
transition: all 0.4s;*/
}

.go-top a:hover, 
.go-top a:focus, 
.go-top a:active,
.go-top a.hover { 
background:#ffffff;
-webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
-webkit-box-shadow:1px 1px 1px rgba(0,0,0,0.6);
-moz-box-shadow:0 1px 1px rgba(0,0,0,0.6);
box-shadow:1px 1px 1px rgba(0,0,0,0.6);
}

/* ----- gallery ----- */
.gallery {
margin-top:24px;
}

.gallery figure {
width:186px;
float:left;
display:inline;
margin-right:24px;
margin-bottom: 9px;
-webkit-box-shadow:0 1px 2px rgba(0,0,0,0.6);
-moz-box-shadow:0 1px 2px rgba(0,0,0,0.6);
box-shadow:0 1px 2px rgba(0,0,0,0.6);
}

.gallery figure:last-child {
margin-right:0;
}

.gallery figure img {
width:100%;
}


/* ----- contact form ----- */

.iframe-box
{
width: 430px;
height: 410px; 
scrolling="no" 
border: o;
allowtransparency: true;
}


#form-container {
width: 436px; 
margin:0 auto; 
padding:24px 0;
background: url(img/noise.png); 
}

legend {
font-family:/*'LeagueGothicRegular',*/ Arial, Helvetica, sans-serif;
font-size:30px;
color:#3c3c3c;
text-shadow:1px 1px 1px #ffffff;
padding: 0 0 0 120px;

}

label {
float:left; 
clear:left; 
margin:12px 20px 0 0; 
width:90px;
text-align:right; 
font-size:16px; 
color: #3c3c3c;
text-transform:uppercase; 
text-shadow:1px 1px 1px #ffffff;
}

input, 
textarea {
width: 200px; 
padding:5px;
margin: 0 0 20px 0; 
background:#26488d url(img/noise.png) left top;
font-family:"Arial Narrow", Arial, Helvetica, sans-serif;
font-size:16px;
color:#ffffff;
-moz-border-radius:5px; 
-webkit-border-radius:5px;
border-radius:5px;
-webkit-box-shadow:0 1px 2px rgba(0,0,0,0.6);
-moz-box-shadow:0 1px 2px rgba(0,0,0,0.6);
box-shadow:0 1px 2px rgba(0,0,0,0.6);
text-shadow:1px 1px 1px rgba(0,0,0,0.6);
}

input {
height:30px; 
}

textarea {
height:90px;
overflow:hidden; /* fix IE scrollbar */
}

input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder  {
color:#a1b2c3; 
text-shadow:1px 1px 1px rgba(0,0,0,0.6); 
}

input:-moz-placeholder,
textarea:-moz-placeholder {
color:#a1b2c3; 
text-shadow:1px 1px 1px rgba(0,0,0,0.6);
}

input:focus, 
textarea:focus {
background:#ffffff;
color:#3c3c3c;
text-shadow:none;
}

input[type=submit] { 
margin-left:120px;
cursor:pointer;
text-transform:uppercase;
font-weight:bold;
letter-spacing:1px;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
}


/* ----- footer ----- */
footer {
padding:24px 0;
/*background:#26488d url(img/noise.png) left top;*/
background-image:url(img/footer-bg.png);
/*-webkit-box-shadow:0 -1px 2px rgba(0,0,0,0.6);
-moz-box-shadow:0 -1px 2px rgba(0,0,0,0.6);
box-shadow:0 -1px 2px rgba(0,0,0,0.6);*/
-webkit-box-shadow:0 0px 3px rgba(14,160,231,0.9);
-moz-box-shadow:0 0px 3px rgba(14,160,231,0.9);
box-shadow:0 0px 3px rgba(14,160,231,0.9);

}

footer p { 
float:right; 
display:inline; 
}

footer ul { 
list-style-type:none;
height:48px; 
float:left; 
display:inline; 
}

footer li{
display:inline;
float:left;
margin:0 10px 0 0;
width:48px;
height:48px;
}

footer li img {
position:absolute;
top:6px;
left:6px;
}

footer li a {
display:inline;
float:left;
width:48px;
height:48px;
line-height:48px;
text-align:center;
-moz-border-radius:192px;
-webkit-border-radius:192px;
border-radius:192px;
-webkit-box-shadow:0px 0px 0px rgba(0,0,0,0);
-moz-box-shadow:0 0px 0px rgba(0,0,0,0);
box-shadow:0px 0px 0px rgba(0,0,0,0);
position:relative;
}

footer li a:link, 
footer li a:visited  { 
color:#FFFFFF;
background:#4F699D; /* rgba fix IE */
background:rgba(255,255,255,0.2);
/*-webkit-transition: all 0.4s; 
-moz-transition: all 0.4s; 
-0-transition: all 0.4s; 
transition: all 0.4s;*/
}

footer li a:hover, 
footer li a:focus, 
footer li a:active, 
footer li a.hover { 
background:#ffffff;
-webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}


/*      Tablet Layout: 768px.
        Gutters: 24px.
-----------------------------------------------------------------
cols    1     2      3      4      5      6      7      8
px      68    160    252    344    436    528    620    712    */

@media only screen and (min-width: 768px) and (max-width: 991px) {
    
.wrapper {
width:712px;
margin:0 auto;


}

.multi-column {
-moz-column-count:2;
-webkit-column-count:2;
column-count:2;
}

.gallery figure {
width:163px;
margin-right:20px;
}
    
}


/*      Mobile Layout: 320px.
        Gutters: 24px.
---------------------------------------------
cols    1     2      3
px      68    160    252    */

@media only screen and (max-width: 767px) {
    
.wrapper {
width:252px;
margin:0 auto;
background-image:none;
}


/* ----- header ----- */
header {
padding:0px 0px 9px 0;
height:110px;
}

#logo
{ 
/*background-image:url(img/rc-logo.png);*/
background-color:transparent;
background-repeat: no-repeat;
height:76px;
width:170px;
margin-bottom: 0px;
margin-left: 5px;
display:block;
}
nav { 
width:100%; 
height:68px;
}

nav ul { 
height:68px;
font-size:9px;

}

nav li{
margin:0 24px 0 0;
width:68px;
height:68px;

}

nav li:last-child  { margin:0;}

nav li a {
width:68px;
height:68px;
line-height:68px;

}


/*/*hgroup { width:100%; text-align:center; margin-bottom:10px; }*/

nav { 
width:100%; 
height:90px;

}

nav ul { 
height:68px; 
}

nav li{
margin-right:7px;
width:30%;
height:90px;
}

nav li:last-child  { margin:0;}

nav li a {
width:70px;
height:90px;
line-height:22px;
font-size:15px;
font-weight:bold;
}


/* ----- content ----- */
section {
text-align:left;
padding:24px 0;
}

.multi-column {
-moz-column-count:auto ;
-webkit-column-count:auto;
column-count: auto;
-moz-column-gap:0;
-webkit-column-gap:0;
column-gap:0;
}

.go-top { 
margin-top:20px;
}

/* ----- gallery ----- */
.gallery {
margin-top:20px;
}

.gallery figure {
width:252px;
float:left;
display:inline;
margin-right:0;
margin-bottom:20px;
}

.gallery figure:last-child {
margin-bottom:0;
}


/* ----- contact form ----- */
#form-container {
width:252px; 
padding:0;
overflow:hidden;
background: none; 
}

form { text-align:center; }

legend {
font-family:'LeagueGothicRegular', Arial, Helvetica, sans-serif;
font-size:36px;
color:#3c3c3c;
text-shadow:1px 1px 1px #ffffff;
text-align:left; 
padding:0;
}

label {
width:100%;
margin:0;
text-align:left;
}

input, 
textarea {
width:232px; 
padding:10px;
margin:0 auto 15px auto; 

}

textarea {
height:120px; 
}

input[type=submit] {
margin:5px auto 20px auto; 
}



/* ----- footer ----- */
footer {
padding:20px 0 10px 0;
}

footer p {
width:100%;
}

footer ul { 
width:100%; 
margin-bottom:20px;
}

footer li{
margin:0 20px 0 0;
width:48px;
height:48px;
}

footer li:last-child  { 
margin:0;
}
    
}



/*      Wide Mobile Layout: 480px.
        Gutters: 24px.
        Inherits styles from: Default Layout, Mobile Layout.
------------------------------------------------------------
cols    1     2      3      4      5
px      68    160    252    344    436    */

@media only screen and (min-width: 480px) and (max-width: 767px) {
    
.wrapper {
width:436px;
margin:0 auto;
}


/* ----- header ----- */
nav {
width:300px;
margin:0 68px;
}

nav li {
margin:0 48px 0 0;
}


/* ----- gallery ----- */
.gallery figure {
width:206px;
margin-right:24px;
}
.gallery figure:nth-child(even) {
margin-right:0;
}

/* ----- contact form ----- */
#form-container {
width:436px;
background:url(img/noise.png); 
padding:24px 0;
}

legend {
padding: 0 0 0 120px;
}

label {
float:left; 
clear:left; 
margin:12px 20px 0 0; 
width:100px;
text-align:right; 
}

input, 
textarea {
width:260px; 
margin:0 0 20px 0; 
float:left;
display:inline;
}

input[type=submit] {
margin-left:120px;
}



/* ----- footer ----- */
footer ul { 
width:300px; 
margin:0 68px 20px 68px;
}

footer li{
margin:0 36px 0 0;
}


}