/* Signal Arts Tetra Styles Sheet */

@font-face {
        font-family: 'OpenSans';
        src: url('fonts/OpenSans-Regular.eot');
        src: local(''), url('fonts/OpenSans-Regular.woff') format('woff'), url('fonts/OpenSans-Regular.ttf') format('truetype'), url('fonts/OpenSans-Regular.svg') format('svg');
/*      font-family:Arial, Helvetica, sans-serif; */
        font-weight: normal;
        font-style: normal;
}

@font-face {
        font-family: 'Play';
        src: url('fonts/Play-Regular.eot');
        src: local(''), url('fonts/Play-Regular.woff') format('woff'), url('fonts/Play-Regular.ttf') format('truetype'), url('fonts/Play-Regular.svg') format('svg');
        font-weight: normal;
        font-style: normal;
}

body {
        background-color: #000;
        font-family: 'OpenSans';
        margin: 0;
}
img {
        border: 0;
}

.clearfix:after, #contents:after {
        clear:both;
        content:"";
        display:block;
        height:1%;
        line-height:0;
        visibility:hidden;
}

/** Buttons **/
.btn {
        background: url(images/GoButton.png) no-repeat;
        background-position: 0 -61px;
        color: #fff;
        display: inline-block;
        font: 20px/52px 'OpenSans';
        height: 52px;
        width: 200px;
        text-align: center;
        text-decoration: none;
        /* text-transform: uppercase; */
}
.btn:hover {
        background-position: 0 0;
}

#btnApp {
        display: inline-block;
}
#btnApp a {
        background: url(images/AppIcons.png) left top;
        background-repeat: no-repeat;
        display: inline-block;
        height: 160px;
        width: 128px;
        margin: 0 90px;
}

#btnApp a.dig {
        background-position: 0 0;
}

#btnApp a.tetra {
        background-position: 0 -170px;
}

#btnApp a.dig:hover {
        background-position: -160px 0;
}

#btnApp a.tetra:hover {
        background-position: -160px -170px;
}

/*------------------------------ HEADER ------------------------------*/
#header {
		background: #203d4f url(images/headerBar.png) repeat-x;
/*        background-color: #203d4f; #eee WhiteSmoke; */
        border-bottom: 2px solid #e6e6e6;
        padding: 2px 0;					/* top header marg was 27px */
}
#header > div, #footer > div {
        /* width: 1024px; */           /* header ? */
        margin: 0 auto;
        padding: 0 20px;
}

/** Logo **/
#header .logo {
        float: left;
		margin-top: 17px;
        margin-right: 60px;
}
#header .logo a {
        background: url(images/SALogo.png) no-repeat;
        color: #000;
        display: block;
        font: 15px/30px 'Play';
        height: 50px;
        width: 224px;
        padding-top: 70px;
        text-align: center;
        text-decoration: none;
        text-transform: uppercase;
}

/** Navigation **/
#navigation {
        display: inline-block;
        list-style: none;
        line-height: 80px;      /* header height was 100 */
        margin: 0;
        padding: 0;
}
#navigation ul {
        display: inline-block;
        list-style: none;
        margin: 0;
        padding: 0;
}
#navigation li {
        float: left;
        width: 130px;           /* header spacing */
        text-align: center;
}
#navigation li a {
        color: #C2C2C2;
        font-size: 20px;
        line-height: 30px;
        text-decoration: none;
}
#navigation li a:hover {
        color: #fff;
}
#navigation li.active a {
/*      color: #f99600; */
        color: LimeGreen;
}

#adbox {
        /* background: url(images/bg-adbox.jpg) repeat-x left top; */
        background-color: #131313;
        height: 380px;
        padding: 60px 0;
}
#adbox > div {
        width: 800px;
        margin: 0 auto;
        padding: 0 80px;
}
#adbox > div img {
        float: right;
        margin-left: 60px;
}
#adbox h1, #adbox h2 {
        color: #2c2c2c;
        font-size: 60px;
        line-height: 60px;
        margin: 0;
        text-transform: uppercase;
}
#adbox h2 {
        font-size: 30px;
        line-height: 36px;
        text-transform: none;
}
#adbox p {
        font-size: 16px;
        line-height: 24px;
        margin: 0;
}
#adbox p span {
        display: block;
        font-size: 12px;
        width: 360px;
        padding: 24px 0;
        text-align: center;
}
#adbox p span b {
        font-weight: normal;
        display: block;
        width: 256px;
}

/*------------------------------ CONTENTS ------------------------------*/
#contents {
		color: #fff;
        min-height: 300px;
        /* width: 980px; */
        margin: 0 auto;
        padding: 54px 40px;
}
#contents {
        background-color: #000;
}

#altcontents {
		color: #fff;
        min-height: 300px;
        /* width: 980px; */
        margin: 0 auto;
        padding: 54px 40px;
}
#altcontents {
        background-color: #2B536B; /* #203d4f */
}

h1 {
        color: #fff;
        font-size: 30px;
        font-weight: normal;
        line-height: 30px;
        margin: 0 0 30px;
}
h2 {
        color: #fff;
        font-size: 16px;
        font-weight: normal;
        line-height: 16px;
        margin: 0 0 12px;       /* was 12px */
}
p {
        color: #C2C2C2;       /* was #585858 */
        font-size: 16px;
        line-height: 24px;
        margin: 0 0 30px;
}
p a {
        color: #C2C2C2;       /* was #585858 */
}
pre {
	font-family: 'OpenSans';
}

/** Action Links
a:link {
	color: #FF0000;
}
a:visited {
	color: #00FF00;
}
a:hover {
	color: #FF00FF;
}
a:active {
	color: #0000FF;
} */

/* General Links */
a.genlink:link {
	color: #86CF4A;
}
a.genlink:visited {
	color: #009900;
}
a.genlink:hover {
	color: #C2C2C2;
}
a.genlink:active {
	color: #0000FF;
}

#tagline h1 {
        margin-left: 20px;
}
#tagline > div {
        float: left;
        width: 400px;
        margin: 0 20px;
}

/* #altcontents .features {
        width: 810px;
        margin: 0 auto;
} */

#contents .features {
        width: 810px;
        margin: 0 auto;
}
.features > div {
        display: inline-block;
        margin: 0 0 30px;
}
.features > div img {
        float: left;
        margin-right: 20px;
        margin-top: 36px;
}

/** main **/
.main {
        float: left;
        background: url(images/divider.png) repeat-y right top;
        min-height: 100px;
        width: 620px;	/* sidebar margin 500 */
        padding-right: 24px;
}
.main h1, .sidebar h1 {
        margin: 0 0 12px;
        position: relative;
        top: -18px;
}
.main h2 span {
        display: block;
        font-size: 12px;
}

/** sidebar **/
.sidebar {
        float: left;
        min-height: 848px;
        width: 235px;	/* sidebar width 350 */
        margin-left: 20px;
}
.sidebar ul, .news {
        list-style: none;
        margin: 0;
        padding: 0;
}


/** TetraMAPS Slider **/
#tmslide {
        float: left;
        display: inline-block;
        margin-right: 0px;
}
#tmslide a {
        background: url(tetraimg/TetraMAPS_Slider.png) left top;
        background-repeat: no-repeat;
        display: inline-block;
        height: 512px;
        width: 512px;
        margin: 0 0px;
}

#tmslide a.banner {
        background-position: 0px 0px;
}
#tmslide a.euro {
        background-position: 0 -512px;
}
#tmslide a.table {
        background-position: 0 -1024px;
}
#tmslide a.modcan {
        background-position: 0 -1536px;
}
#tmslide a.motm {
        background-position: 0 -2048px;
}
#tmslide a.lemur {
        background-position: 0 -2560px;
}

/* Tetra Slider */
#slider {
  position: relative;
  overflow: hidden;
  margin: 20px auto 0 auto;
  border-radius: 10px;
}

#slider ul {
  position: relative;
  margin: 0;
  padding: 0;
  height: 200px;
  list-style: none;
}

#slider ul li {
  position: relative;
  display: block;
  float: left;
  margin: 0;
  padding: 0;
  width: 512px;
  height: 512px;
  background: #000;
  text-align: center;
  line-height: 512px;
}

a.control_prev, a.control_next {
  position: absolute;
  top: 40%;
  z-index: 999;
  display: block;
  padding: 4% 3%;
  width: auto;
  height: auto;
  background: #2a2a2a;
  color: #fff;
  text-decoration: none;
  font-weight: 600;
  font-size: 18px;
  opacity: 0.8;
  cursor: pointer;
}

a.control_prev:hover, a.control_next:hover {
  opacity: 1;
  -webkit-transition: all 0.2s ease;
}

a.control_prev {
  border-radius: 0 2px 2px 0;
}

a.control_next {
  right: 0;
  border-radius: 2px 0 0 2px;
}

.slider_option {
  position: relative;
  margin: 10px auto;
  width: 160px;
  font-size: 18px;
}


/*------------------------------ FOOTER ------------------------------*/
#footer {
        background-color: #2B536B;
        border-top: 2px solid #d8d8d8;
        padding: 30px 0;
}
#footer p {
        font-size: 14px;
        line-height: 30px;
        padding-left: 10px;
}

/** Social **/
#connect {
        float: right;
        display: inline-block;
        margin-right: 30px;
}
#connect a {
        background: url(images/SocialIcons.png) left top;
        background-repeat: no-repeat;
        display: inline-block;
        height: 30px;
        width: 30px;
        margin: 0 10px;
}
/*
#connect a:hover {
        background-position: left -34px;
}
*/

#connect a.facebook {
        background-position: 0px 0px;
}
#connect a.linkedin {
        background-position: 0 -40px;
}
#connect a.apple {
        background-position: 0 -200px;
}
#connect a.paypal {
        background-position: 0 -240px;
}

#connect a.facebook:hover {
        background-position: -40px 0;
}
#connect a.linkedin:hover {
        background-position: -40px -40px;
}
#connect a.apple:hover {
        background-position: -40px -200px;
}
#connect a.paypal:hover {
        background-position: -40px -240px;
}