
/***************************************************************************
/*                                                                           *\ 
/* INTRINSIC WEB FRAMEWORK                                                   *\ 
/* __________________________________________________________________________*\ 
/*                                                                           *\ 
/* Copyright (c) 2015 Patrick Thomas Unwin <patrick@forwardme.co.uk>         *\ 
/*                                                                           *\ 
/* All rights reserved. No warranty, explicit or implicit, provided.         *\ 
/*                                                                           *\ 
/* NOTICE:  All information contained herein is, and remains the property    *\ 
/* of Patrick Thomas Unwin. The intellectual and technical concepts contained*\ 
/* herein are proprietary to Patrick Thomas Unwin and are protected by       *\ 
/* trade secret or copyright law. Dissemination of this information or       *\ 
/* reproduction of this material is strictly forbidden unless prior written  *\ 
/* permission is obtained from Patrick Thomas Unwin.                         *\ 
/*                                                                           *\ 
/*****************************************************************************/ 

/*------------------------------------*/
/* Span Classes */
/*------------------------------------*/

.fw-ratio-2.fw-col-1 > .fw-span-2 { 
    margin-left: 0%;
    width: 100%;
	display: block;
	float: left;
	min-height: 1px;
}
.fw-ratio-2.fw-col-2 > .fw-span-1 { 
    margin-left: 0%;
    width: 50%;
	display: block;
	float: left;
	min-height: 1px;
}
.fw-ratio-2.fw-col-1.fw-margin-1 > .fw-span-2 { 
    margin-left: 1%;
    width: 100%;
	display: block;
	float: left;
	min-height: 1px;
}
.fw-ratio-2.fw-col-2.fw-margin-1 > .fw-span-1 { 
    margin-left: 1%;
    width: 49.5%;
	display: block;
	float: left;
	min-height: 1px;
}
.fw-ratio-2.fw-col-1.fw-margin-2 > .fw-span-2 { 
    margin-left: 1.3%;
    width: 100%;
	display: block;
	float: left;
	min-height: 1px;
}
.fw-ratio-2.fw-col-2.fw-margin-2 > .fw-span-1 { 
    margin-left: 1.3%;
    width: 49.35%;
	display: block;
	float: left;
	min-height: 1px;
}
.fw-ratio-2.fw-col-1.fw-margin-3 > .fw-span-2 { 
    margin-left: 1.6%;
    width: 100%;
	display: block;
	float: left;
	min-height: 1px;
}
.fw-ratio-2.fw-col-2.fw-margin-3 > .fw-span-1 { 
    margin-left: 1.6%;
    width: 49.2%;
	display: block;
	float: left;
	min-height: 1px;
}
.fw-ratio-2.fw-col-1.fw-margin-4 > .fw-span-2 { 
    margin-left: 2%;
    width: 100%;
	display: block;
	float: left;
	min-height: 1px;
}
.fw-ratio-2.fw-col-2.fw-margin-4 > .fw-span-1 { 
    margin-left: 2%;
    width: 49%;
	display: block;
	float: left;
	min-height: 1px;
}
.fw-ratio-2.fw-col-1.fw-margin-5 > .fw-span-2 { 
    margin-left: 2.6%;
    width: 100%;
	display: block;
	float: left;
	min-height: 1px;
}
.fw-ratio-2.fw-col-2.fw-margin-5 > .fw-span-1 { 
    margin-left: 2.6%;
    width: 48.7%;
	display: block;
	float: left;
	min-height: 1px;
}
.fw-ratio-2.fw-col-1.fw-margin-6 > .fw-span-2 { 
    margin-left: 3.4%;
    width: 100%;
	display: block;
	float: left;
	min-height: 1px;
}
.fw-ratio-2.fw-col-2.fw-margin-6 > .fw-span-1 { 
    margin-left: 3.4%;
    width: 48.3%;
	display: block;
	float: left;
	min-height: 1px;
}


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

    /*------------------------------------*/
    /* S Stack Classes */
    /*------------------------------------*/

    .fw-ratio-2.fw-col-1.fw-s-stack > .fw-span-2 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-2.fw-s-stack > .fw-span-1 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-1.fw-margin-1.fw-s-stack > .fw-span-2 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-2.fw-margin-1.fw-s-stack > .fw-span-1 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-1.fw-margin-2.fw-s-stack > .fw-span-2 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-2.fw-margin-2.fw-s-stack > .fw-span-1 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-1.fw-margin-3.fw-s-stack > .fw-span-2 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-2.fw-margin-3.fw-s-stack > .fw-span-1 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-1.fw-margin-4.fw-s-stack > .fw-span-2 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-2.fw-margin-4.fw-s-stack > .fw-span-1 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-1.fw-margin-5.fw-s-stack > .fw-span-2 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-2.fw-margin-5.fw-s-stack > .fw-span-1 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-1.fw-margin-6.fw-s-stack > .fw-span-2 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-2.fw-margin-6.fw-s-stack > .fw-span-1 { margin-left: 0%; width: 100%; }

    /*------------------------------------*/
    /* Small Hide Classes */
    /*------------------------------------*/

@media screen and (max-width:480px) {
    .fw-ratio-2.fw-col-1.fw-s-stack > .fw-span-2.fw-s-hide { display: none; }
}
@media screen and (max-width:480px) {
    .fw-ratio-2.fw-col-2.fw-s-stack > .fw-span-1.fw-s-hide { display: none; }
}
@media screen and (max-width:480px) {
    .fw-ratio-2.fw-col-1.fw-s-stack.fw-margin-1 > .fw-span-2.fw-s-hide { display: none; }
}
@media screen and (max-width:480px) {
    .fw-ratio-2.fw-col-2.fw-s-stack.fw-margin-1 > .fw-span-1.fw-s-hide { display: none; }
}
@media screen and (max-width:480px) {
    .fw-ratio-2.fw-col-1.fw-s-stack.fw-margin-2 > .fw-span-2.fw-s-hide { display: none; }
}
@media screen and (max-width:480px) {
    .fw-ratio-2.fw-col-2.fw-s-stack.fw-margin-2 > .fw-span-1.fw-s-hide { display: none; }
}
@media screen and (max-width:480px) {
    .fw-ratio-2.fw-col-1.fw-s-stack.fw-margin-3 > .fw-span-2.fw-s-hide { display: none; }
}
@media screen and (max-width:480px) {
    .fw-ratio-2.fw-col-2.fw-s-stack.fw-margin-3 > .fw-span-1.fw-s-hide { display: none; }
}
@media screen and (max-width:480px) {
    .fw-ratio-2.fw-col-1.fw-s-stack.fw-margin-4 > .fw-span-2.fw-s-hide { display: none; }
}
@media screen and (max-width:480px) {
    .fw-ratio-2.fw-col-2.fw-s-stack.fw-margin-4 > .fw-span-1.fw-s-hide { display: none; }
}
@media screen and (max-width:480px) {
    .fw-ratio-2.fw-col-1.fw-s-stack.fw-margin-5 > .fw-span-2.fw-s-hide { display: none; }
}
@media screen and (max-width:480px) {
    .fw-ratio-2.fw-col-2.fw-s-stack.fw-margin-5 > .fw-span-1.fw-s-hide { display: none; }
}
@media screen and (max-width:480px) {
    .fw-ratio-2.fw-col-1.fw-s-stack.fw-margin-6 > .fw-span-2.fw-s-hide { display: none; }
}
@media screen and (max-width:480px) {
    .fw-ratio-2.fw-col-2.fw-s-stack.fw-margin-6 > .fw-span-1.fw-s-hide { display: none; }
}
}


@media (min-width: 481px) and (max-width: 768px) {

    /*------------------------------------*/
    /* M Stack Classes */
    /*------------------------------------*/

    .fw-ratio-2.fw-col-1.fw-m-stack > .fw-span-2 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-2.fw-m-stack > .fw-span-1 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-1.fw-margin-1.fw-m-stack > .fw-span-2 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-2.fw-margin-1.fw-m-stack > .fw-span-1 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-1.fw-margin-2.fw-m-stack > .fw-span-2 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-2.fw-margin-2.fw-m-stack > .fw-span-1 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-1.fw-margin-3.fw-m-stack > .fw-span-2 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-2.fw-margin-3.fw-m-stack > .fw-span-1 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-1.fw-margin-4.fw-m-stack > .fw-span-2 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-2.fw-margin-4.fw-m-stack > .fw-span-1 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-1.fw-margin-5.fw-m-stack > .fw-span-2 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-2.fw-margin-5.fw-m-stack > .fw-span-1 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-1.fw-margin-6.fw-m-stack > .fw-span-2 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-2.fw-margin-6.fw-m-stack > .fw-span-1 { margin-left: 0%; width: 100%; }

    /*------------------------------------*/
    /* Medium Hide Classes */
    /*------------------------------------*/

@media (min-width: 481px) and (max-width: 768px) {
    .fw-ratio-2.fw-col-1.fw-m-stack > .fw-span-2.fw-m-hide { display: none; }
}
@media (min-width: 481px) and (max-width: 768px) {
    .fw-ratio-2.fw-col-2.fw-m-stack > .fw-span-1.fw-m-hide { display: none; }
}
@media (min-width: 481px) and (max-width: 768px) {
    .fw-ratio-2.fw-col-1.fw-m-stack.fw-margin-1 > .fw-span-2.fw-m-hide { display: none; }
}
@media (min-width: 481px) and (max-width: 768px) {
    .fw-ratio-2.fw-col-2.fw-m-stack.fw-margin-1 > .fw-span-1.fw-m-hide { display: none; }
}
@media (min-width: 481px) and (max-width: 768px) {
    .fw-ratio-2.fw-col-1.fw-m-stack.fw-margin-2 > .fw-span-2.fw-m-hide { display: none; }
}
@media (min-width: 481px) and (max-width: 768px) {
    .fw-ratio-2.fw-col-2.fw-m-stack.fw-margin-2 > .fw-span-1.fw-m-hide { display: none; }
}
@media (min-width: 481px) and (max-width: 768px) {
    .fw-ratio-2.fw-col-1.fw-m-stack.fw-margin-3 > .fw-span-2.fw-m-hide { display: none; }
}
@media (min-width: 481px) and (max-width: 768px) {
    .fw-ratio-2.fw-col-2.fw-m-stack.fw-margin-3 > .fw-span-1.fw-m-hide { display: none; }
}
@media (min-width: 481px) and (max-width: 768px) {
    .fw-ratio-2.fw-col-1.fw-m-stack.fw-margin-4 > .fw-span-2.fw-m-hide { display: none; }
}
@media (min-width: 481px) and (max-width: 768px) {
    .fw-ratio-2.fw-col-2.fw-m-stack.fw-margin-4 > .fw-span-1.fw-m-hide { display: none; }
}
@media (min-width: 481px) and (max-width: 768px) {
    .fw-ratio-2.fw-col-1.fw-m-stack.fw-margin-5 > .fw-span-2.fw-m-hide { display: none; }
}
@media (min-width: 481px) and (max-width: 768px) {
    .fw-ratio-2.fw-col-2.fw-m-stack.fw-margin-5 > .fw-span-1.fw-m-hide { display: none; }
}
@media (min-width: 481px) and (max-width: 768px) {
    .fw-ratio-2.fw-col-1.fw-m-stack.fw-margin-6 > .fw-span-2.fw-m-hide { display: none; }
}
@media (min-width: 481px) and (max-width: 768px) {
    .fw-ratio-2.fw-col-2.fw-m-stack.fw-margin-6 > .fw-span-1.fw-m-hide { display: none; }
}
}


@media screen and (min-width:769px) {

    /*------------------------------------*/
    /* L Stack Classes */
    /*------------------------------------*/

    .fw-ratio-2.fw-col-1.fw-l-stack > .fw-span-2 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-2.fw-l-stack > .fw-span-1 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-1.fw-margin-1.fw-l-stack > .fw-span-2 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-2.fw-margin-1.fw-l-stack > .fw-span-1 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-1.fw-margin-2.fw-l-stack > .fw-span-2 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-2.fw-margin-2.fw-l-stack > .fw-span-1 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-1.fw-margin-3.fw-l-stack > .fw-span-2 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-2.fw-margin-3.fw-l-stack > .fw-span-1 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-1.fw-margin-4.fw-l-stack > .fw-span-2 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-2.fw-margin-4.fw-l-stack > .fw-span-1 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-1.fw-margin-5.fw-l-stack > .fw-span-2 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-2.fw-margin-5.fw-l-stack > .fw-span-1 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-1.fw-margin-6.fw-l-stack > .fw-span-2 { margin-left: 0%; width: 100%; }
    .fw-ratio-2.fw-col-2.fw-margin-6.fw-l-stack > .fw-span-1 { margin-left: 0%; width: 100%; }

    /*------------------------------------*/
    /* Large Hide Classes */
    /*------------------------------------*/

@media (min-width: 769px) {
    .fw-ratio-2.fw-col-1.fw-l-stack > .span-2.fw-l-hide { display: none; }
}
@media (min-width: 769px) {
    .fw-ratio-2.fw-col-2.fw-l-stack > .span-1.fw-l-hide { display: none; }
}
@media (min-width: 769px) {
    .fw-ratio-2.fw-col-1.fw-l-stack.margin-1 > .fw-span-2.fw-l-hide { display: none; }
}
@media (min-width: 769px) {
    .fw-ratio-2.fw-col-2.fw-l-stack.margin-1 > .fw-span-1.fw-l-hide { display: none; }
}
@media (min-width: 769px) {
    .fw-ratio-2.fw-col-1.fw-l-stack.margin-2 > .fw-span-2.fw-l-hide { display: none; }
}
@media (min-width: 769px) {
    .fw-ratio-2.fw-col-2.fw-l-stack.margin-2 > .fw-span-1.fw-l-hide { display: none; }
}
@media (min-width: 769px) {
    .fw-ratio-2.fw-col-1.fw-l-stack.margin-3 > .fw-span-2.fw-l-hide { display: none; }
}
@media (min-width: 769px) {
    .fw-ratio-2.fw-col-2.fw-l-stack.margin-3 > .fw-span-1.fw-l-hide { display: none; }
}
@media (min-width: 769px) {
    .fw-ratio-2.fw-col-1.fw-l-stack.margin-4 > .fw-span-2.fw-l-hide { display: none; }
}
@media (min-width: 769px) {
    .fw-ratio-2.fw-col-2.fw-l-stack.margin-4 > .fw-span-1.fw-l-hide { display: none; }
}
@media (min-width: 769px) {
    .fw-ratio-2.fw-col-1.fw-l-stack.margin-5 > .fw-span-2.fw-l-hide { display: none; }
}
@media (min-width: 769px) {
    .fw-ratio-2.fw-col-2.fw-l-stack.margin-5 > .fw-span-1.fw-l-hide { display: none; }
}
@media (min-width: 769px) {
    .fw-ratio-2.fw-col-1.fw-l-stack.margin-6 > .fw-span-2.fw-l-hide { display: none; }
}
@media (min-width: 769px) {
    .fw-ratio-2.fw-col-2.fw-l-stack.margin-6 > .fw-span-1.fw-l-hide { display: none; }
}
}

/*------------------------------------*/
/* Ratio Element Setup */
/*------------------------------------*/

.fw-ratio-2 {
	clear: both;
	padding: 0px;
	margin: 0px;
    zoom:1; /* For IE 6/7 (trigger hasLayout) */
}

/* solves floating problems, by forcing the section to self clear its children (aka the clearfix hack). 
This is good in Firefox 3.5+, Safari 4+, Chrome, Opera 9+ and IE 6+. */


/*------------------------------------*/
/* Ratio Element Before & After Setup */
/*------------------------------------*/

.fw-ratio-2:before, .fw-ratio-2:after {
    content:"";
    display:table;
}

/*------------------------------------*/
/* Ratio Element After Setup */
/*------------------------------------*/

.fw-ratio-2:after {
    clear:both;
}

/*------------------------------------*/
/* Span Setup */
/*------------------------------------*/

 .fw-ratio-2.fw-col-1 > .fw-span-2:first-child { 
    margin-left: 0;
}
 .fw-ratio-2.fw-col-2 > .fw-span-1:first-child { 
    margin-left: 0;
}
 .fw-ratio-2.fw-col-1.fw-margin-1 > .fw-span-2:first-child 
					 { 
    margin-left: 0;
}
 .fw-ratio-2.fw-col-2.fw-margin-1 > .fw-span-1:first-child 
					 { 
    margin-left: 0;
}
 .fw-ratio-2.fw-col-1.fw-margin-2 > .fw-span-2:first-child 
					 { 
    margin-left: 0;
}
 .fw-ratio-2.fw-col-2.fw-margin-2 > .fw-span-1:first-child 
					 { 
    margin-left: 0;
}
 .fw-ratio-2.fw-col-1.fw-margin-3 > .fw-span-2:first-child 
					 { 
    margin-left: 0;
}
 .fw-ratio-2.fw-col-2.fw-margin-3 > .fw-span-1:first-child 
					 { 
    margin-left: 0;
}
 .fw-ratio-2.fw-col-1.fw-margin-4 > .fw-span-2:first-child 
					 { 
    margin-left: 0;
}
 .fw-ratio-2.fw-col-2.fw-margin-4 > .fw-span-1:first-child 
					 { 
    margin-left: 0;
}
 .fw-ratio-2.fw-col-1.fw-margin-5 > .fw-span-2:first-child 
					 { 
    margin-left: 0;
}
 .fw-ratio-2.fw-col-2.fw-margin-5 > .fw-span-1:first-child 
					 { 
    margin-left: 0;
}
 .fw-ratio-2.fw-col-1.fw-margin-6 > .fw-span-2:first-child 
					 { 
    margin-left: 0;
}
 .fw-ratio-2.fw-col-2.fw-margin-6 > .fw-span-1:first-child 
					 { 
    margin-left: 0;
}
