Synnefo

html,

body,

div,

span,

applet,

object,

iframe,

h1,

h2,

h3,

h4,

h5,

h6,

p,

blockquote,

pre,

a,

abbr,

acronym,

address,

big,

cite,

code,

del,

dfn,

em,

font,

img,

ins,

kbd,

q,

s,

samp,

small,

strike,

strong,

sub,

sup,

tt,

var,

dl,

dt,

dd,

ol,

ul,

li,

fieldset,

form,

label,

legend,

table,

caption,

tbody,

tfoot,

thead,

tr,

th,

td {

  margin: 0;

  padding: 0;

  outline: 0;

  border: 0;

  vertical-align: baseline;

  font-weight: inherit;

  font-style: inherit;

  font-size: 100%;

  font-family: inherit;

}

body {

  background: #fff;

  color: #000;

  line-height: 1;

}

ol, ul {

  list-style: none;

}

table {

  border-collapse: separate;

  border-spacing: 0;

  vertical-align: middle;

}

caption, th, td {

  vertical-align: middle;

  text-align: left;

  font-weight: normal;

}

q, blockquote {

  quotes: '' '';

}

q:before,

q:after,

blockquote:before,

blockquote:after {

  content: '';

}

a img {

  border: none;

}

/*@import "grnetstyles/css3.less";*/

/* float clearing for IE6 */

* html .clearfix {

  height: 1%;

  overflow: visible;

}

/* float clearing for IE7 */

* + html .clearfix {

  min-height: 1%;

}

/* float clearing for everyone else */

.clearfix:after {

  clear: both;

  content: ".";

  display: block;

  height: 0;

  visibility: hidden;

  font-size: 0;

}

.footer a {

  color: #74AEC9;

  text-decoration: underline;

}

.footer a:hover {

  color: #4085A5;

}

body {

  background-image: url("../images/bg.png");

  background-repeat: repeat-x;

  font-size: 13px;

  font-family: verdana;

  background-position: 0px -120px;

}

body.alt {

  background-image: url("../images/bg-alt.png");

}

.container {

  width: 870px;

  margin: 0 auto;

  margin-top: 30px;

}

.inner {

  margin-top: 2.5em;

  background-image: url("../images/bg-inner.png");

  width: 100%;

}

.inner .left {

  position: relative;

  width: 180px;

  float: left;

}

.inner .left ul {

  margin-top: 90px;

  color: #4085A5;

  left: -16px;

  padding-top: 40px;

  padding-right: 10px;

}

.inner .left ul li {

  font-size: 1.8em;

  margin-bottom: 0.2em;

  position: relative;

}

.inner .left ul li a.page-link {

  display: block;

  color: inherit;

  text-decoration: none;

  padding: 10px;

  padding-left: 36px;

}

.inner .left ul li a.page-link:hover, .inner .left ul li.selected a.page-link {

  text-shadow: none;

  color: #fff;

  background-color: #74AEC9;

  border-left: 0px solid #92C1D7;

  padding-left: 36px;

}

.inner .left ul li .close-button:hover {

  background-color: #99C9E0;

}

.inner .left ul li .close-button {

  display: block;

  position: absolute;

  left: -30px;

  top: 0px;

  font-size: 0.7em;

  border: none;

  background: transparent;

  padding: 0;

  padding-top: 13px;

  padding-left: 9px;

  margin: 0px;

  text-decoration: none;

  color: #fff;

  width: 21px;

  height: 30px;

  font-weight: bold;

  display: block;

  visibility: hidden;

}

.inner .left ul li.current a.page-link {

  color: #fff;

  background-color: #74AEC9;

  border-left: 30px solid #92C1D7;

  padding-left: 36px;

  margin-left: -30px;

}

.inner .video-cont, .inner .page-cont {

  width: 690px;

  float: right;

}

.inner .cols {

  position: relative;

}

.page {

  display: block;

  top: 0;

}

.page-wrapper {

  position: relative;

}

.page.text {

  margin-left: 27px;

  padding-top: 20px;

  padding-right: 20px;

  padding-bottom: 10px;

}

.page.text h2 {

  font-size: 1.9em;

  color: #4085A5;

  margin-bottom: 1.2em;

}

.page.text h2 em {

  color: #FCFDFE;

}

.page.text a {

  color: #213D4A;

}

.page.text p em {

  color: #4C6A78;

  /*font-weight: bold;*/

}

.page.text h3 {

  font-size: 1.2em;

  color: #4394B9;

  margin-bottom: 0.5em;

  margin-top: 1.5em;

}

.page.text h4 {

  font-weight: bold;

  font-size: 1.1em;

  margin-bottom: 0.3em;

}

.page.text p {

  color: #213D4A;

  font-size: 1.1em;

  margin-bottom: 1em;

  text-align: justify;

  line-height: 1.4em;

}

.inner .video {

  width: 640px;

  height: 360px;

  background-color: #4085A5;

  margin: 20px;

  margin-left: 27px;

  margin-bottom: 20px;

  margin-top: 20px;

  /*border: 1px solid #4085A5;*/

}

.logo {

  text-align: center;

}

.logo img {

  margin-left: 75px;

}

.inner-bottom {

  width: 100%;

}

.inner-bottom .testuser {

  display: none;

  background: #000;

  margin-right: 40px;

  float: right;

  margin-top: 10px;

  margin-bottom: 20px;

}

.gotoapp {

  display: block;

  padding: 0.7em 5em;

  color: #fff;

  font-size: 1.2em;

  background-color: #FF7F2A;

  cursor: pointer;

  margin-right: -20px;

}

.gotoapp:hover {

  background-color: #FF9955;

}

.page.text {

  margin-right: 20px;

  margin-top: 20px;

}

.inner-bottom.in-page .testuser {

  margin-right: 60px;

}

.gotoapp {

  color: #fff;

  text-decoration: none;

}

.banner-coming {

  position: absolute;

  left: 0px;

  top: 0px;

}

.footer {

  text-align: center;

  margin: 0 auto;

  width: 870px;

  margin: 2em auto;

}

.footer .links {

  color: #4085A5;

  margin-bottom: 1em;

}

.footer .links li {

  display: inline;

  margin-right: 1em;

  padding-right: 1em;

  border-right: 1px solid #4085A5;

}

.footer .links li a {

  color: inherit;

  text-decoration: none;

}

.footer .links li.last {

  margin-right: 0;

  padding-right: 0;

  border: none;

}

.footer .bottom-text {

  color: #74AEC9;

}

/*style 2*/

body.style2 .page.text {

  background-color: #7DB3CC;

  padding-left: 20px;

}

body.style2 .page.text p, body.style2 .page.text h2 {

  color: #fff;

}

#video div.vjs-big-play-button {

  background: none !important;

  border: none !important;

  box-shadow: 4px 4px 20px #477589 !important;

}

#video div.vjs-big-play-button:hover {

  background: none !important;

  border: none !important;

  box-shadow: 4px 4px 50px #477589 !important;

  background: #4085A5 !important;

}

body {

  text-align: center;

}

* html body legend {

  margin: -8px 16px 0;

  padding: 0;

}

html > body p code {

  *white-space: normal;

}

.container {

  text-align: left;

}

sup {

  vertical-align: text-top;

}

sub {

  vertical-align: text-bottom;

}

hr {

  margin: -8px auto 11px;

}

img {

  -ms-interpolation-mode: bicubic;

}

fieldset {

  padding-top: 0;

}

textarea {

  overflow: auto;

}

input.text {

  margin: .5em 0;

  border: 1px solid #bbb;

  background-color: #ffffff;

}

input.text:focus {

  border: 1px solid #666666;

}

input.title {

  margin: .5em 0;

  border: 1px solid #bbb;

  background-color: #ffffff;

}

input.title:focus {

  border: 1px solid #666666;

}

input.checkbox {

  position: relative;

  top: 0.25em;

}

input.radio {

  position: relative;

  top: 0.25em;

}

input.button {

  position: relative;

  top: 0.25em;

}

textarea {

  margin: 0.5em 0;

}

select {

  margin: 0.5em 0;

}

button {

  position: relative;

  top: 0.25em;

}

a {

  color: #4085A5;

}

.menu li {

  height: 50px;

}

.inner-bottom .testuser {

  margin-right: 22px;

}

.inner-bottom .testuser a {

  margin-right: 0px;

}

/* Reset.less

 * Props to Eric Meyer (meyerweb.com) for his CSS reset file. We're using an adapted version here        that cuts out some of the reset HTML elements we will never need here (i.e., dfn, samp, etc).

 * ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

html, body {

  margin: 0;

  padding: 0;

}

h1,

h2,

h3,

h4,

h5,

h6,

p,

blockquote,

pre,

a,

abbr,

acronym,

address,

cite,

code,

del,

dfn,

em,

img,

q,

s,

samp,

small,

strike,

strong,

sub,

sup,

tt,

var,

dd,

dl,

dt,

li,

ol,

ul,

fieldset,

form,

label,

legend,

button,

table,

caption,

tbody,

tfoot,

thead,

tr,

th,

td {

  margin: 0;

  padding: 0;

  border: 0;

  font-weight: normal;

  font-style: normal;

  font-size: 100%;

  line-height: 1;

  font-family: inherit;

}

table {

  border-collapse: collapse;

  border-spacing: 0;

}

ol, ul {

  list-style: none;

}

q:before,

q:after,

blockquote:before,

blockquote:after {

  content: "";

}

html {

  overflow-y: scroll;

  font-size: 100%;

  -webkit-text-size-adjust: 100%;

  -ms-text-size-adjust: 100%;

}

a:focus {

  outline: thin dotted;

}

a:hover, a:active {

  outline: 0;

}

article,

aside,

details,

figcaption,

figure,

footer,

header,

hgroup,

nav,

section {

  display: block;

}

audio, canvas, video {

  display: inline-block;

  *display: inline;

  *zoom: 1;

}

audio:not([controls]) {

  display: none;

}

sub, sup {

  font-size: 75%;

  line-height: 0;

  position: relative;

  vertical-align: baseline;

}

sup {

  top: -0.5em;

}

sub {

  bottom: -0.25em;

}

img {

  border: 0;

  -ms-interpolation-mode: bicubic;

}

button,

input,

select,

textarea {

  font-size: 100%;

  margin: 0;

  vertical-align: baseline;

  *vertical-align: middle;

}

button, input {

  line-height: normal;

  *overflow: visible;

}

button::-moz-focus-inner, input::-moz-focus-inner {

  border: 0;

  padding: 0;

}

button,

input[type="button"],

input[type="reset"],

input[type="submit"] {

  cursor: pointer;

  -webkit-appearance: button;

}

input[type="search"] {

  -webkit-appearance: textfield;

  -webkit-box-sizing: content-box;

  -moz-box-sizing: content-box;

  box-sizing: content-box;

}

input[type="search"]::-webkit-search-decoration {

  -webkit-appearance: none;

}

textarea {

  overflow: auto;

  vertical-align: top;

}

/* Variables.less

 * Variables to customize the look and feel of Bootstrap

 * ----------------------------------------------------- */

/* Mixins.less

 * Snippets of reusable CSS to develop faster and keep code readable

 * ----------------------------------------------------------------- */

/*

 * Scaffolding

 * Basic and global styles for generating a grid system, structural layout, and page templates

 * ------------------------------------------------------------------------------------------- */

html, body {

  background-color: #ffffff;

}

body {

  margin: 0;

  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;

  font-size: 13px;

  font-weight: normal;

  line-height: 18px;

  color: #404040;

}

.container {

  width: 940px;

  margin-left: auto;

  margin-right: auto;

  zoom: 1;

}

.container:before, .container:after {

  display: table;

  content: "";

  zoom: 1;

  *display: inline;

}

.container:after {

  clear: both;

}

.container-fluid {

  position: relative;

  min-width: 940px;

  padding-left: 20px;

  padding-right: 20px;

  zoom: 1;

}

.container-fluid:before, .container-fluid:after {

  display: table;

  content: "";

  zoom: 1;

  *display: inline;

}

.container-fluid:after {

  clear: both;

}

.container-fluid > .sidebar {

  float: left;

  width: 220px;

}

.container-fluid > .content {

  margin-left: 240px;

}

a {

  color: #0069d6;

  text-decoration: none;

  line-height: inherit;

  font-weight: inherit;

}

a:hover {

  color: #00438a;

  text-decoration: underline;

}

.pull-right {

  float: right;

}

.pull-left {

  float: left;

}

.hide {

  display: none;

}

.show {

  display: block;

}

.row {

  zoom: 1;

  margin-left: -20px;

}

.row:before, .row:after {

  display: table;

  content: "";

  zoom: 1;

  *display: inline;

}

.row:after {

  clear: both;

}

[class*="span"] {

  display: inline;

  float: left;

  margin-left: 20px;

}

.span1 {

  width: 40px;

}

.span2 {

  width: 100px;

}

.span3 {

  width: 160px;

}

.span4 {

  width: 220px;

}

.span5 {

  width: 280px;

}

.span6 {

  width: 340px;

}

.span7 {

  width: 400px;

}

.span8 {

  width: 460px;

}

.span9 {

  width: 520px;

}

.span10 {

  width: 580px;

}

.span11 {

  width: 640px;

}

.span12 {

  width: 700px;

}

.span13 {

  width: 760px;

}

.span14 {

  width: 820px;

}

.span15 {

  width: 880px;

}

.span16 {

  width: 940px;

}

.span17 {

  width: 1000px;

}

.span18 {

  width: 1060px;

}

.span19 {

  width: 1120px;

}

.span20 {

  width: 1180px;

}

.span21 {

  width: 1240px;

}

.span22 {

  width: 1300px;

}

.span23 {

  width: 1360px;

}

.span24 {

  width: 1420px;

}

.offset1 {

  margin-left: 80px;

}

.offset2 {

  margin-left: 140px;

}

.offset3 {

  margin-left: 200px;

}

.offset4 {

  margin-left: 260px;

}

.offset5 {

  margin-left: 320px;

}

.offset6 {

  margin-left: 380px;

}

.offset7 {

  margin-left: 440px;

}

.offset8 {

  margin-left: 500px;

}

.offset9 {