* {margin:0;padding:0;} 

@font-face {
    font-family: 'Raleway';
    font-style: normal;
    font-family: 'Raleway';
    src: url('../fonts/raleway_thin-webfont.eot'); /* IE9 Compat Modes */
    src:url('../fonts/raleway_thin-webfont.otf'),
        url('../fonts/raleway_thin-webfont.eot?#iefix'), /* IE6-IE8 */
        url('../fonts/raleway_thin-webfont.woff2'), /* Super Modern Browsers */
        url('../fonts/raleway_thin-webfont.woff'), /* Pretty Modern Browsers */
        url('../fonts/raleway_thin-webfont.ttf'), /* Safari, Android, iOS */
        url('../fonts/raleway_thin-webfont.svg#svgFontName')/* Legacy iOS */
}

html, body {height: 100%;background:url('../images/brand-repeat.png') repeat;}

#wrap {min-height: 100%;}

#content {overflow:auto;
	padding-bottom: 80px;}  /* must be same height as the footer */

#footer {position: absolute;bottom:0;text-align:center;width:100%;
	margin-top: -80px; /* negative value of footer height */
	height: 80px;
	clear:both;} 

/*Opera Fix*/
body:before {/* thanks to Maleika (Kohoutec)*/
content:"";
height:100%;
float:left;
width:0;
margin-top:-32767px;/* thank you Erik J - negate effect of float*/
}
@font-face {
    font-family: 'Raleway';
    font-style: normal;
    font-family: 'Raleway';
    src: url('../fonts/raleway_thin-webfont.eot'); /* IE9 Compat Modes */
    src:url('../fonts/raleway_thin-webfont.otf'),
        url('../fonts/raleway_thin-webfont.eot?#iefix'), /* IE6-IE8 */
        url('../fonts/raleway_thin-webfont.woff2'), /* Super Modern Browsers */
        url('../fonts/raleway_thin-webfont.woff'), /* Pretty Modern Browsers */
        url('../fonts/raleway_thin-webfont.ttf'), /* Safari, Android, iOS */
        url('../fonts/raleway_thin-webfont.svg#svgFontName')/* Legacy iOS */
}
@font-face {
    font-family: 'OpenSansRegular';
    src: url('../fonts/OpenSansRegular.eot');
    src: url('../fonts/OpenSansRegular.eot') format('embedded-opentype'),
         url('../fonts/OpenSansRegular.woff2') format('woff2'),
         url('../fonts/OpenSansRegular.woff') format('woff'),
         url('../fonts/OpenSansRegular.ttf') format('truetype'),
         url('../fonts/OpenSansRegular.svg#OpenSansRegular') format('svg');
}
@font-face {
    font-family: 'RalewayBold';
    src: url('../fonts/RalewayBold.eot');
    src: url('../fonts/RalewayBold.eot') format('embedded-opentype'),
         url('../fonts/RalewayBold.woff2') format('woff2'),
         url('../fonts/RalewayBold.woff') format('woff'),
         url('../fonts/RalewayBold.ttf') format('truetype'),
         url('../fonts/RalewayBold.svg#RalewayBold') format('svg');
}
@font-face {
    font-family: 'RalewayMedium';
    src: url('../fonts/RalewayMedium.eot');
    src: url('../fonts/RalewayMedium.eot') format('embedded-opentype'),
         url('../fonts/RalewayMedium.woff2') format('woff2'),
         url('../fonts/RalewayMedium.woff') format('woff'),
         url('../fonts/RalewayMedium.ttf') format('truetype'),
         url('../fonts/RalewayMedium.svg#RalewayMedium') format('svg');
}
@font-face {
    font-family: 'MontserratLight';
    src: url('../fonts/MontserratLight.eot');
    src: url('../fonts/MontserratLight.eot') format('embedded-opentype'),
         url('../fonts/MontserratLight.woff2') format('woff2'),
         url('../fonts/MontserratLight.woff') format('woff'),
         url('../fonts/MontserratLight.ttf') format('truetype'),
         url('../fonts/MontserratLight.svg#MontserratLight') format('svg');
}
@font-face {
    font-family: 'Rubik-Medium';
    src: url('../fonts/Rubik-Medium.eot');
    src: url('../fonts/Rubik-Medium.eot') format('embedded-opentype'),
         url('../fonts/Rubik-Medium.woff2') format('woff2'),
         url('../fonts/MontserratLight.woff') format('woff'),
         url('../fonts/Rubik-Medium.ttf') format('truetype'),
         url('../fonts/Rubik-Medium.svg#Rubik-Medium') format('svg');
}

body{font-family:"Raleway", sans-serif;}
.center{text-align:center;}

a,a:active,a:hover,a:visited{text-decoration:none;color:slategray;}
div#header {font-size:18px;height:75px;margin-bottom:30px;padding-left:36px;padding-top:22px;background:#fdfdfd;}
div#header img{width:230px;}
div#header div#navigation {position:absolute;top:37px;left:310px;font-family:"Rubik-Medium", sans-serif}
div#header div#navigation a{opacity:0.80;text-decoration:none;padding:7px 9px;margin-left:10px;color:#393839;}
div#header div#navigation a.active{padding-right:20px;background:url('../images/dot.png') no-repeat right;background-size: 12px;padding-top:5px;background-position-right:0px;}
div#header div#navigation a:hover{opacity:1}
div#content div#main {padding:10px 25px;}
div#content div#version {background:#efefef;width:231px;padding-left:20px;float:left;text-align:center;}
div#content div#version span.text {line-height:50px;padding-left:5px;font-family:"RalewayBold", sans-serif;}
div#content div#version img{width:25px;position:relative;top:7px;}
div#content div#synopsis {font-family:"RalewayMedium", sans-serif;float:left;line-height:50px;padding-left:20px;}
div#content div#main {max-width:1800px;margin:auto;}
div#main div#top {padding:50px 25px;clear:both;}
div#main div#top div#welcomeText{width:49%;padding-right:25px;float:left;clear:left;line-height:26px}
div#main div#top div#welcomeText h1{font-family:"RalewayBold", sans-serif;font-size:33px;margin-bottom:18px;line-height:44px}
div#main div#top div#banner {}
div#main div#top div#banner img {height:200px;margin-left:35px;}
div#content div#integrations {font-family:"RalewayMedium", sans-serif;padding-top:40px;}
div#content div#integrations div.image {float:left;width:50%;height:285px;text-align:center;}
div#content div#integrations div.image img {height:285px;}
div#content div#integrations div.image img.comingsoon, div#content div#integrations div.image img.jquery{height:auto;width:440px;}

div#content div#integrations div.box div.inner h2 {font-size:37px;margin-bottom:12px;}
div#content div#integrations div.box div.inner {line-height:32px;background:#f5f5f5;height:285px;padding:36px 40px;}
div#content div#integrations div.box{width:50%;float:right;}
	
div#footer p{position:relative;top:45px;font-size:13px;}

@media only screen and (max-width: 800px) {
	div#header{padding-left:0;}
	div#header img{display:block;margin:auto;}
	div#header div#navigation{position:relative;left:0;top:15px;text-align:center;font-size:15px;}
	div#header div#navigation a {margin-left:0px;}
	div#header div#navigation a.active{background-size: 8px;background-position:2px 14px;}
	div#content div#version{margin-top:10px;width:100%;padding:0;text-align:center;}
	div#content div#synopsis {padding:0;padding-top:5px;text-align:center;width:100%;}
	div#content div#main div#top div#welcomeText{width:100%;padding-bottom:30px;}
	div#content div#main div#top{padding:10px 20px;}
}