/* Signal Arts 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: #2B536B;
        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: #2B536B;
}

#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;
}
.date {
        float: left;
        height: 78px;
        width: 80px;
        margin-right: 20px;
        border: 1px solid #d5d5d5;
        text-align: center;
}
.date p {
        margin: 12px 0 0;
}
.date p span {
        display: block;
        font-size: 30px;
        margin-bottom: 6px;
}
.author {
        color: #585858;
        display: block;
        font-size: 12px;
}
.more {
        background-color: #727272;
        color: #fff;
        display: inline-block;
        font-size: 14px;
        line-height: 30px;
        width: 100px;
        text-align: center;
        text-decoration: none;
}
.more:hover, .message input[type='submit']:hover {
        background-color: #f99600;
        color: #000;
}

/** 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;
}
.news li {
        border-top: 1px solid #d5d5d5;
        padding: 24px 30px 0 100px;
        position: relative;
}
.news li .date {
        float: none;
        position: absolute;
        left: 0;
        top: 30px;
}
.news li > p span, .post > span {
        display: block;
        text-align: right;
}
.posts {
        border-top: 1px solid #d5d5d5;
}
.posts li {
        border-bottom: 1px solid #d5d5d5;
        padding: 24px 10px 0;
}
.posts li p {
        font-size: 14px;
}
.posts li .title {
        font-size: 16px;
        font-weight: normal;
        margin: 0 0 12px;
}
.posts li .title a {
        color: #fff; /* #2c2c2c */
        font-size: 16px;
        text-decoration: none;
}
.post {
        width: 785px;
        margin: 0 auto;
}
.post h1 {
        padding-top: 12px;
}
#about {
        width: 740px;
        margin: 0 auto;
}
#about h1, .section h1 {
        border-bottom: 1px solid #e0e0e0;
        padding-bottom: 12px;
}
.section {
        float: left;
        width: 390px;
        margin-right: 50px;
}
.section h1 {
        margin-bottom: 18px;
}
.message input[type='text'], .message textarea {
        color: #aeaeae;
        font-size: 13px;
        height: 33px;
        line-height: 33px;
        width: 380px;
        border: 1px solid #d5d5d5;
        margin: 0 0 6px;
        padding: 0 4px;
}
.message textarea {
        height: 175px;
        overflow: auto;
        resize: none;
}
.message input[type='submit'] {
        float: right;
        background-color: #818181;
        color: #d5d5d5;
        cursor: pointer;
        font: 13px/30px Arial, Helvetica, sans-serif;
        height: 30px;
        border: 0;
        margin: 0;
        padding: 0 10px;
}
.contact {
        background-color: #f8f8f8;
        width: 270px;
        padding: 124px 60px;
        text-align: center;
}
.contact p span {
        color: #2c2c2c;
        display: block;
        font-size: 30px;
        line-height: 36px;
        padding: 18px 0;
}

/** Quick Start Icons **/
#qs {
        float: left;
        display: inline-block;
        margin-right: 10px;
}
#qs a {
        background: url(images/QuickStartIcons.png) left top;
        background-repeat: no-repeat;
        display: inline-block;
        height: 47px;
        width: 47px;
        margin: 0 10px;
}

#qs a.trig {
        background-position: 0px 0px;
}
#qs a.prog {
        background-position: 0 -50px;
}
#qs a.rand {
        background-position: 0 -100px;
}
#qs a.rec {
        background-position: 0 -150px;
}
#qs a.input {
        background-position: 0 -250px;
}
#qs a.arp {
        background-position: 0 -300px;
}
#qs a.single {
        background-position: 0 -350px;
}
#qs a.add {
        background-position: 0 -400px;
}

/** Screens Slider **/
#scr {
        float: left;
        display: inline-block;
        margin-right: 0px;
}
#scr a {
        background: url(images/DigScreens.png) left top;
        background-repeat: no-repeat;
        display: inline-block;
        height: 390px;
        width: 512px;
        margin: 0 0px;
}

#scr a.play {
        background-position: 0px 0px;
}
#scr a.prog {
        background-position: 0 -390px;
}
#scr a.mix {
        background-position: 0 -780px;
}
#scr a.track {
        background-position: 0 -1170px;
}
#scr a.mod {
        background-position: 0 -1560px;
}
#scr a.kbd {
        background-position: 0 -1950px;
}

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

#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: 374px;
  background: #2B536B;
  text-align: center;
  line-height: 390px;
}

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;
}

/** Mail Chimp
#mc_embed_signup {
 	background:#fff; clear:left; font:14px Helvetica,Arial,sans-serif;
}
*/

#mailchimp {
	background: #2B536B;
	color: #3D6392; /* #3D6392 */
	padding: 20px 15px;
}
#mailchimp input {
	border: medium none;
    color: gray;
    font-family: 'OpenSans'; /* times new roman */
    font-size: 16px;
    font-style: italic;
    margin-bottom: 10px;
    padding: 8px 10px;
    width: 300px; /* was 300 */
	border-radius: 20px;
	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
}
#mailchimp input.email { background: #fff }
#mailchimp input.name { background: #fff }
#mailchimp input[type="submit"] {
	background: #115B87;
	color: #fff;
	cursor: pointer;
	font-size: 15px;
	width: 45%;
	padding: 8px 0;
}
#mailchimp input[type="submit"]:hover { color: #F2C94C }

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

/*
.footer {
        margin: 30px auto 0 auto;
        font-size: 14px;
}

.footer a { color: #bebebe; text-decoration: none; }
.footer a:hover { color: #bebebe; text-decoration: none; border-bottom: 1px dashed #cdcdcd; }

.icons {
        float: right;
        display: inline-block;

        width: 100px;
        margin: 0px auto 0 auto;
}

.icons a {
    display: inline-block;
    width: 24px;
    height: 24px;
    margin: 10px;
    vertical-align: middle;
    -o-transition: all .3s;
    -moz-transition: all .3s;
    -webkit-transition: all .3s;
    -ms-transition: all .3s;
}
 
.icons a.linkedin { background: url(images/socialIcons/linkedin.png) left top no-repeat;
        display: inline-block;
        height: 30px;
        width: 30px;
        margin: 0 10px;
}
.icons a.apple { background: url(images/socialIcons/apple.png) left top no-repeat; }
.icons a.facebook { background: url(images/socialIcons/facebook.png) left top no-repeat; }

.icons a:apple:hover { background-position: left -34px; }
.icons a:facebook:hover { background-position: left -34px; }
.icons a:hover { background-position: left -34px; }

ul.socialicons {
        list-style: none;
        overflow: auto;
{
ul.socialicons li {
        width: 24px;
        height: 24px;
        padding: 0 5px 0 0;
        float: left;
}
ul.socialicons li a {
        width: 24px;
        height: 24px;
        display: block;
}
ul.socialicons li a.apple { background: url(images/socialIcons/apple.png) left top no-repeat; }
ul.socialicons li a.apple:hover { background-position: left -34px; }

.icons a.apple { background: url(images/socialIcons/apple.png) left top no-repeat;
                background-position: 0 0; }
.icons a.facebook { background: url(images/socialIcons/facebook.png) left top no-repeat; }

.icons a:hover { background-position: left -34px; }
*/

/** 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;
}


/* SOCIAL TEMPLATE
#connectFacebook {
        float: right;
        display: inline-block;
        margin-right: 30px;
}
#connectFacebook a {
        background: url(images/socialIcons/facebook.png) left top no-repeat;
        display: inline-block;
        height: 30px;
        width: 30px;
        margin: 0 10px;
}
#connectFacebook a:hover {
        background-position: left -34px;
}
#connectLinkedin {
        float: right;
        display: inline-block;
        margin-right: 30px;
}
#connectLinkedin a {
        background: url(images/socialIcons/linkedin.png) left top no-repeat;
        display: inline-block;
        height: 30px;
        width: 30px;
        margin: 0 10px;
}
#connectLinkedin a:hover {
        background-position: left -34px;
}
#connectApple {
        float: right;
        display: inline-block;
        margin-right: 30px;
}
#connectApple a {
        background: url(images/socialIcons/apple.png) left top no-repeat;
        display: inline-block;
        height: 30px;
        width: 30px;
        margin: 0 10px;
}
#connectApple a:hover {
        background-position: left -34px;
}
*/

/*
#connect a.googleplus {
        background-position: 0 -40px;
}
#connect a.twitter {
        background-position: 0 -80px;
}
#connect a.tumbler {
        background-position: 0 -120px;
}

#connect a.facebook {
        background: url(images/socialIcons/facebook.png) left top no-repeat;
}

#connect a.facebook:hover {
        background-position: left -34px;
}

#connect a.linkedin {
        background: url(images/socialIcons/linkedin.png) left top no-repeat;
}

#connect a.linkedin:hover {
        background-position: left -34px;
}

#connect a.apple {
        background: url(images/socialIcons/apple.png) left top no-repeat;
}

#connect a.apple:hover {
        background-position: left -34px;
}

#connect a.googleplus:hover {
        background-position: -40px -40px;
}
#connect a.twitter:hover {
        background-position: -40px -80px;
}
#connect a.tumbler:hover {
        background-position: -40px -120px;
}
*/