/* ***************************************************
							Reset
*************************************************** */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, 
ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, 
tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
margin: 0;padding: 0;font-size: 100%;font-weight: inherit;font-style: normal;vertical-align: baseline;background: transparent;border: 0;outline: 0;}

/* HTML5 RESETS FOR OLDER BROWSERS */
article, aside, figure, figure img, hgroup, footer, header, nav, section {display: block;}
ol, ul { list-style: none; }blockquote, q { quotes: none; }blockquote:before, blockquote:after,q:before, q:after { content: ''; content: none; }table { border-collapse: collapse; border-spacing: 0; }input, select { vertical-align: middle; }a img { border: 0; }:focus { outline: 0; }a:hover, a:active { outline: none; }

img {max-width:100%; height:auto}

/*  Clearfixes * */
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }
.clear {clear: both;}




/* ******************************************************************************************************
							Global Styles
****************************************************************************************************** */

html, body {width:100%;height:100%; -webkit-text-size-adjust: 100%;}
body {font-family: 'Roboto', Arial, sans-serif, sans-serif; font-weight: 400; font-size: 18px; line-height: 24px; color: #000; text-align:center; background: #FFF;


background: url(images/bg.png);
background-size: 100% auto;
}

/* Images & Links */
a {color: #009ad0;text-decoration:none;}
a:hover {color: #000;text-decoration:none;}
a img {border: none;outline: none;}

::selection {background: #e8e7de; /* Safari */}
::-moz-selection {background: #e8e7de; /* Firefox */}






/* ******************************************************************************************************
							Main Containers
****************************************************************************************************** */

#wrap {width: 100%;text-align: left; height:auto !important; height:100%; min-height: 100%; position:relative; z-index:0;}
#main {overflow: auto; padding-bottom:100px;  margin: 0px auto; width: 100%; }


.full {width: 100%;}
.inner {max-width: 806px;}

.white {background: #FFF;}


.overflow {overflow: hidden; display: block;}

.margincenter {margin-left: auto !important; margin-right: auto !important; }

.paddingtop55 {padding-top: 55px; }
.paddingbottom240 {padding-bottom: 240px; }


.span1, .span2, .span3, .span4, .span5, .span6, .span7, .span8, .span9, .span10, .span11, .span12{float:left;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box; position:relative; margin-right: 3%; float:left;}

.span1{width: 5.58333333333%;}
.span2{width: 14.1666666667%;}
.span3{width: 22.75%;}
.span4{width: 31.3333333333%;}
.span5{width: 39.9166666667%;}
.span6{width: 48.5%;}
.span7{width: 57.0833333333%;}
.span8{width: 65.6666666667%;}
.span9{width: 74.25%;}
.span10{width: 82.8333333333%;}
.span11{width: 91.4166666667%;}
.span12{width: 100%;margin-right: 0;}

.last{ margin-right:0 !important; clear:right !important; }






/* **************************************************
			    		HEADER
************************************************** */
#header {height: 120px;	margin: 0 auto; position: relative; padding: 0}
#header .logo{text-indent:100%; white-space:nowrap; overflow:hidden; display:block; width:208px; height:59px; position: absolute; bottom: 0px; right: 0;  background: url(images/logo.svg) no-repeat; background-size: 208px 59px; z-index: 99999; }
.no-svg .logo { background-image: url(images/logo.png) no-repeat; }






/* ******************************************************************************************************
							Content
****************************************************************************************************** */
.content { position: relative;  }	
.content p{margin: 0px;padding: 0px 0px 25px 0px;}



.content h2 {font-family: "europa",sans-serif; font-size: 30px; line-height: 40px; color: #824187; text-transform: uppercase; letter-spacing: 0.06em;}

a.button {background: #824187; color: #FFF; border: 2px solid #824187;font-family: "europa",sans-serif; font-size: 18px; line-height: 24px;text-transform: uppercase; letter-spacing: 0.06em; padding: 12px 0px; display: inline-block; margin-top: 17px;-o-transition:.5s;-ms-transition:.5s;-moz-transition:.5s;-webkit-transition:.5s;transition:.5s;}
a.button:hover {background: #220d26; border: 2px solid #220d26; }


a.button2 {background: #FFF; color: #824187; border: 2px solid #824187; font-family: "europa",sans-serif; font-size: 18px; line-height: 24px;text-transform: uppercase; letter-spacing: 0.06em; padding: 12px 0px; display: inline-block; margin-top: 60px;-o-transition:.5s;-ms-transition:.5s;-moz-transition:.5s;-webkit-transition:.5s;transition:.5s;}
a.button2:hover {background: #824187; color: #FFF;}


a.button, a.button2 {width: 406px; text-align: center; }



/* ##########################################################################
                     M E D I A    Q U E R R I E S
				 http://jsfiddle.net/danield770/Vfffg/16/
########################################################################## */

/* ################### MOBILE  PORTRAIT LAYOUT 300PX  ################### */
@media screen and (max-width: 479px){

.inner {width: 88%; }
.paddingbottom240 {padding-bottom: 150px; }
.span6 {width: 100%; float: none; margin-right: 0;}



.content h2 {font-size: 27px; line-height: 36px; }

a.button, a.button2  {font-size: 16px; line-height: 22px;padding: 10px 0; width: 320px; }

#header .logo{width:190px; height:54px; background-size: 190px 54px; }

}



/* ################### MOBILE  LANDSCAPE LAYOUT 480PX  ################### */
@media only screen and (min-width: 480px) and (max-width: 599px){

.inner {width: 88%; }

.paddingbottom240 {padding-bottom: 150px; }
.span6 {width: 100%; float: none; margin-right: 0;}

a.button, a.button2  {font-size: 16px; line-height: 22px;padding: 10px 0; width: 350px; }
}



/* ################### 7" Tablet 600px ################### */
@media only screen and (min-width: 600px) and (max-width: 759px){
.inner {width: 88%; }
.paddingbottom240 {padding-bottom: 180px; }
}



/* ################### iPad 780px ################### */
@media only screen and (min-width: 760px) and (max-width: 959px){

.inner {width: 88%; }
.paddingbottom240 {padding-bottom:200px; }
}







/* ################### RETINA BG IMAGES  ################### */
@media all and (-webkit-min-device-pixel-ratio: 1.5) {}











