html { min-height: 100%; background: #a7cf3a; }
/* general */
* { padding: 0px; margin: 0px; }
html, body { font-family: 'OpenSansRegular',Arial, Helvetica, sans-serif; font-size: 14px; color: #2f2f2f; }
input, select, textarea { font-family: Arial, Helvetica, sans-serif; font-size: 14px; color: #000; }
body { background: #fff; }
img { border: 0px; }
a, input { outline: none; }
/* global classes */
.clear { clear: both; height: 0px; overflow: hidden; }
/* main */
.main { width: 996px; margin: 0 auto; }
/* wrapper */
#wrapper { position: relative; width: 100%; min-height: 100%; overflow: hidden; }
#wrapper.error { text-align: center; }
/* header wrapper */
#headerWrapper { width: 100%; float: left; height: 139px; background: url('../images/header-bg.jpg') left top repeat-x; }
#headerWrapper .logo { padding: 5px 0 9px 0; width: 245px; float: left; }
#headerWrapper .logoerror { width: 245px; margin: 0 auto; float: none; }
#headerWrapper .logo a { height: 130px; display: block; text-indent: -9999px; background: url('../images/snapshot-dna-logo.png') no-repeat; background-size: 100%; }
/* menu area */
.menuArea{ padding: 61px 0 0 0; float: right; }
.menuArea ul { list-style: none; }
.menuArea li { padding: 0 0 0 10px; float: left; }
.menuArea li a { padding: 8px 7px; font-family: 'OpenSansExtrabold'; font-size: 12px; color: #434343; text-decoration: none; text-transform: uppercase; border: 2px solid #d8d8d8; background: #f7f7f7; }
.menuArea li a:hover,.menuArea li.selected a { border: 2px solid #3d3186; }
/* banner wrapper */
.bannerWrapper{ width: 100%; float: left; background: #3d3186; }
/* tagline panel */
.taglinePanel { padding: 30px 80px 0 80px; overflow: hidden; font-size: 13px; color: #fff; line-height: 21px; text-align: center; }
.taglinePanel h2 { font-family: 'LeagueGothicRegular', 'bebas_neueregular'; font-size: 50px; color: #fff; font-weight: normal; text-transform: uppercase; line-height: 50px; text-shadow: 3px 3px 3px #261F54; }
.taglinePanel h3 { font-family: 'LeagueGothicRegular', 'bebas_neueregular'; font-size: 72px; color: #fff; font-weight: normal; text-transform: uppercase; line-height: 72px; text-shadow: 3px 3px 3px #261F54; }
.taglinePanel p { padding: 12px 0 0 0; }
.taglinePanel ul { list-style: none; }
.taglinePanel li { padding: 22px 3px; width: 133px; float: left; line-height: 12px; text-align: center; }
.taglinePanel li.last { padding: 22px 0 0 0; }
.taglinePanel li a { font-size: 11px; color: #fff; text-decoration: none; }
.taglinePanel li img { margin: 0 0 5px 0; display: block; text-shadow: 5px 5px 5px #333; }
/* tagline panel */
.bannerArea { width: 996px; float: left; position: relative; }
.bannerArea .multislider { width: 996px; float: left; }
.bannerArea .multislider .item { width: 996px; float: left; }
.bannerArea img { display: block; }
.bannerArea .tablet { padding: 52px 200px 45px 217px; margin: 15px 0 0 0; width: 579px; height: 381px; float: left; overflow: hidden; position: relative; z-index: 1; }
.bannerArea .tablet .overlay { width: 996px; height: 477px; float: left; position: absolute; left: 0; top: 0; background: url('../images/tablet-bg.png') no-repeat; }
.bannerArea .bannerLeft { padding: 10px; position: absolute; top: 23px; left: 10px; z-index: 5; width: 169px; float: left; font-size: 11px; line-height: 16px; text-align: center; border-radius: 5px; border: 1px solid #640808; background: url('../images/header-bg.jpg') repeat; }
.bannerArea .bannerRight { padding: 10px; position: absolute; top: 0; right: 10px; z-index: 5; width: 169px; float: left; font-size: 11px; line-height: 16px; border-radius: 5px; border: 1px solid #640808; background: url('../images/header-bg.jpg') repeat; }
.bannerArea h3 { padding: 0 0 5px 0; font-family: 'OpenSansSemibold'; font-size: 12px; color: #990c0c; font-weight: normal; text-align: center; border-bottom: 1px solid #c2c2c2; }
.bannerArea p { padding: 5px 0 0 0; }
.bannerArea .bannerRight ul { padding: 5px 0 0 0; list-style: none; }
.bannerArea .camera { padding: 96px 0 0 164px; width: 275px; height:180px; float: left; overflow: hidden; position: absolute; bottom: 0; left: 0; z-index: 3; }
.bannerArea .camera .overlay { width: 439px; height: 276px; float: left; position: absolute; left: 0; top: 0; background: url('../images/camera-bg.png') no-repeat; }
.bannerArea .mobile { padding: 84px 0 0 53px; width: 225px; height: 238px; float: left; overflow: hidden; position: absolute; bottom: 0; right: 0; z-index: 3; }
.bannerArea .mobile .overlay { width: 278px; height: 322px; float: left; position: absolute; left: 0; top: 0; background: url('../images/mobile-bg.png') no-repeat; }
.bannerArea .magnify { padding: 29px 0 0 57px; width: 278px; height: 280px; float: left; overflow: hidden; position: absolute; bottom: 0; right: 165px; z-index: 4; }
.bannerArea .magnify .overlay { padding: 100px 85px 0 75px; width: 175px; height: 209px; float: left; position: absolute; left: 0; top: 0; font-family: 'LeagueGothicRegular', 'bebas_neueregular'; font-size: 34px; color: #fff; letter-spacing: -1px; text-shadow: 0 0 15px #000; line-height: 32px; text-transform: uppercase; text-align: center; background: url('../images/magnify-bg.png') no-repeat; }
.bannerArea .bx-prev,.bannerArea .bx-next { display: none; }
.bannerArea .bx-pager { position: absolute; bottom: 10px; left: 450px; z-index: 99999; }
.bannerArea .bx-pager a { width: 16px; height: 19px; float: left; display: block; text-indent: -9999px; background: url('../images/nav-btn.png') left top no-repeat; }
.bannerArea .bx-pager a:hover,.bannerArea .bx-pager a.pager-active { background: url('../images/nav-btn.png') right top no-repeat; }
/* operation banner */
.operationBanner { padding: 45px 0 15px 0; width: 996px; float: left; position: relative; }
.operationBanner h1 { padding: 0 0 40px 0; margin: 0 0 15px 0; font-family: 'LeagueGothicRegular', 'bebas_neueregular'; font-size: 80px; color: #fff; font-weight: normal; text-transform: uppercase; line-height: 80px; text-shadow: 3px 3px 3px #261F54; text-align: center; background: url('../images/h-shadow.png') center bottom no-repeat; }
.operationBanner h2 { width: 174px; position: absolute; right: 65px; top: 225px; font-family: 'LeagueGothicRegular', 'bebas_neueregular'; font-size: 80px; color: #fff; font-weight: normal; text-transform: uppercase; line-height: 80px; text-shadow: 3px 3px 3px #261F54; }
.operationBanner h3 { padding: 10px 0 0 0; font-family: 'LeagueGothicRegular', 'bebas_neueregular'; font-size: 22px; color: #fff; font-weight: normal; text-transform: uppercase; line-height: 22px; text-shadow: 3px 3px 3px #261F54; text-align: center; }
.operationBanner img { display: block; }
.operationBanner .overlay { position: absolute; top: 227px; left: 340px; width: 181px; float: left; }
.operationBanner .overlay .item { padding: 8px 10px; margin: 0 0 13px 0; overflow: hidden; font-size: 11px; line-height: 16px; border-radius: 3px; text-align: center; border: 1px solid #640808; box-shadow: 0 0 3px #333; background: url('../images/header-bg.jpg') repeat; }
.operationBanner .overlay h4 { font-family: 'LeagueGothicRegular', 'bebas_neueregular'; font-size: 22px; color: #990c0c; text-transform: uppercase; font-weight: normal; line-height: 22px; }
.operationBanner .overlay p { padding: 5px 0 0 0; }
/* title area */
.titleArea { padding: 45px 0; width: 996px; float: left; position: relative; }
.titleArea h1 { font-family: 'LeagueGothicRegular', 'bebas_neueregular'; font-size: 80px; color: #fff; font-weight: normal; text-transform: uppercase; line-height: 80px; text-shadow: 3px 3px 3px #261F54; }
/* middle wrapper */
#middleWrapper { padding: 20px 0; width: 100%; float: left; }
/* content area */
.contentArea { padding: 20px 0 0 0; width: 100%; float: left; line-height: 22px; }
.contentArea h2 { font-family: 'LeagueGothicRegular', 'bebas_neueregular'; font-size: 52px; color: #000; font-weight: normal; text-transform: uppercase; line-height: 54px; }
.contentArea h2 span { font-size: 24px; color: #2f2f2f; }
.contentArea p { margin: 15px 0; }
.contentArea p.quote { padding: 0 0 0 60px; width: 390px; float: left; font-family: 'OpenSansBoldItalic'; font-size: 22px; line-height: 22px; min-height: 127px; background: url('../images/quote.png') 0 6px no-repeat; }
.contentArea p.large { font-family: 'OpenSansBold'; }
.contentArea .items { padding: 10px 0; width: 520px; float: left; font-family: 'OpenSansItalic'; font-size: 12px; }
.contentArea .items ul { list-style: none; }
.contentArea .items li { padding: 0 6px 0 0; float: left; }
.contentArea .items img { margin: 0 0 5px 0; display: block; }
.contentArea .items h3 { font-family: 'LeagueGothicRegular', 'bebas_neueregular'; font-size: 22px; color: #444; font-weight: normal; text-transform: uppercase; }
/* text area */
.textArea { padding: 20px 0 0 0; width: 100%; float: left; line-height: 22px; }
.textArea h2 { font-family: 'LeagueGothicRegular', 'bebas_neueregular'; font-size: 24px; color: #000; font-weight: normal; text-transform: uppercase; line-height: 24px; }
.textArea p { margin: 15px 0; }
.textArea ul.list { margin: 15px 0; overflow: hidden; list-style: none; }
.textArea ul.list li { margin: 15px 30px 15px 0; width: 270px; min-height: 65px; float: left; line-height: 18px; box-shadow: 0 3px 3px #d7d7d7; border: 1px solid #b30606; background: url('../images/overlay-bg.jpg') repeat; }
.textArea ul.list li span.num { width: 60px; height: 65px; float: left; font-family: 'OpenSansExtrabold'; font-size: 22px; color: #161616; text-align: center; line-height: 65px; background: url('../images/shadow.png') right no-repeat; }
.textArea ul.list li span.desc { padding: 12px 0 0 0; width: 200px; float: right; }
/* contact left */
.contactLeft { padding: 20px 0 0 0; width: 511px; float: left; font-family: 'OpenSansItalic'; font-size: 12px; }
.contactLeft ul { list-style: none; }
.contactLeft li { padding: 0 8px 0 0; float: left; }
.contactLeft img { margin: 0 0 5px 0; display: block; }
.contactLeft h3 { font-family: 'LeagueGothicRegular', 'bebas_neueregular'; font-size: 22px; color: #444; font-weight: normal; text-transform: uppercase; }
/* contact right */
.contactRight { padding: 20px 0; width: 471px; float: right; line-height: 22px; }
.contactRight h2 { font-family: 'LeagueGothicRegular', 'bebas_neueregular'; font-size: 52px; color: #000; font-weight: normal; text-transform: uppercase; line-height: 52px; }
.contactRight p { padding: 10px 0 5px 0; width: 100%; float: left; }
.contactRight p.half { padding: 10px 15px 5px 0; width: 220px; float: left; }
.contactRight a { color: #b10000; text-decoration: none; }
.contactRight a:hover { color: #000; }
.contactRight label { padding: 0 0 5px 0; display: block; }
.contactRight input.field { padding: 15px 10px; width: 198px; border: 1px solid #c1c1c1; background: url('../images/input-bg.jpg') left bottom repeat-x; }
.contactRight input.field:focus { border: 1px solid #8c8c8c; }
.contactRight textarea { padding: 15px 10px; width: 430px; height: 115px; resize: none; overflow: auto; border: 1px solid #c1c1c1; background: url('../images/input-bg.jpg') left bottom repeat-x; }
.contactRight textarea:focus { border: 1px solid #8c8c8c; }
.contactRight .error { border: 1px solid #b60000; }
.contactRight .submit { padding: 0 30px; border: 0px; height: 46px; cursor: pointer; font-family: 'LeagueGothicRegular', 'bebas_neueregular'; font-size: 24px; color: #fff; text-transform: uppercase; background: url('../images/btn.jpg') left top repeat; }
.contactRight .submit:hover { background: url('../images/btn.jpg') left -46px repeat; }
.contactRight .submit:active { background: url('../images/btn.jpg') left -92px repeat; }
/* industries area */
.industriesArea { padding: 20px 0 30px 0; width: 100%; float: left; line-height: 22px; }
.industriesArea h3 { font-family: 'LeagueGothicRegular', 'bebas_neueregular'; font-size: 24px; color: #000; font-weight: normal; text-transform: uppercase; line-height: 24px; }
.industriesArea ul { list-style: none; }
.industriesArea ul li { padding: 24px 24px 0 0; width: 308px; float: left; }
.industriesArea ul li img { padding: 3px; margin: 10px 0 0 0; display: block; border: 1px solid #d0d0d0; box-shadow: 0 5px 5px #d7d7d7; }
/* validate area */
.validateArea { padding: 25px 0 15px 0; width: 100%; float: left; line-height: 22px; }
.validateArea .item { padding: 0 0 20px 0; width: 100%; float: left; }
.validateArea label { padding: 5px 12px 0 0; width: 175px; float: left; text-align: right; }
.validateArea .captcha { padding: 0 20px 0 0; float: left; }
.validateArea .itemfield { padding: 0 20px 0 0; float: left; }
.validateArea img { display: block; }
.validateArea a { display: block; font-family: 'OpenSansItalic'; font-size: 11px; color: #161616; text-decoration: none; }
.validateArea small { display: block; font-family: 'OpenSansItalic'; font-size: 11px; color: #161616; }
.validateArea input.field { padding: 11px 10px; width: 153px; border: 1px solid #c1c1c1; background: url('../images/input-bg.jpg') left bottom repeat-x; }
.validateArea input.field:focus { border: 1px solid #8c8c8c; }
.validateArea input.submit { padding: 0 30px; border: 0px; height: 46px; cursor: pointer; font-family: 'LeagueGothicRegular', 'bebas_neueregular'; font-size: 24px; color: #fff; text-transform: uppercase; background: url('../images/btn.jpg') left top repeat; }
.validateArea input.submit:hover { background: url('../images/btn.jpg') left -46px repeat; }
.validateArea input.submit:active { background: url('../images/btn.jpg') left -92px repeat; }
.validateArea .styleFileInput { float: left; position: relative; }
.validateArea .browseText { padding: 14px 10px; width: 617px; float: left; border: 1px solid #c1c1c1; background: url('../images/input-bg.jpg') left bottom repeat-x; }
.validateArea .browseText:focus { border: 1px solid #8c8c8c; }
.validateArea .browseButton { padding: 0 30px; border: 0px; height: 46px; float: left; cursor: pointer; font-family: 'LeagueGothicRegular', 'bebas_neueregular'; font-size: 24px; color: #fff; text-transform: uppercase; background: url('../images/upload-btn.jpg') left top repeat; }
.validateArea .browseButton:hover { background: url('../images/upload-btn.jpg') left -46px repeat; }
.validateArea .browseButton:active { background: url('../images/upload-btn.jpg') left -92px repeat; }
.validateArea input.theFileInput { width: 145px; height: 46px; cursor: pointer; position: absolute; top: 0px; right: 0; opacity: 0; -moz-opacity: 0; filter: alpha(opacity:0); z-index: 2; }
.validateArea .error { padding: 20px 0; overflow: hidden; font-family: 'LeagueGothicRegular', 'bebas_neueregular'; font-size: 52px; color: #b30606; text-transform: uppercase; line-height: 52px; text-align: center; box-shadow: 0 3px 3px #d7d7d7; border: 1px solid #b30606; background: url('../images/overlay-bg.jpg') repeat; }
/* industries area */
.fraudPrevention { padding: 30px 0 30px 0; width: 100%; float: left; line-height: 22px; border-top: 1px solid #dbdbdb; }
.fraudPrevention h2 { padding: 0 30px 0 0; width: 145px; float: left; font-family: 'LeagueGothicRegular', 'bebas_neueregular'; font-size: 32px; color: #444; font-weight: normal; text-transform: uppercase; line-height: 32px; }
.fraudPrevention h2 span { display: block; font-size: 42px; color: #101010; line-height: 42px; }
.fraudPrevention p { padding: 0 0 15px 0; }
/* preview area */
.previewArea { padding: 15px 0 30px 0; width: 100%; float: left; }
.previewArea ul { list-style: none; }
.previewArea ul li { padding: 0 25px 0 0; float: left; }
.previewArea h3 { padding: 0 0 10px 0; font-family: 'LeagueGothicRegular', 'bebas_neueregular'; font-size: 20px; color: #444; font-weight: normal; text-transform: uppercase; }
.previewArea .block { padding: 3px; display: block; border: 1px solid #d0d0d0; box-shadow: 0 5px 5px #d7d7d7; }
.previewArea .block img { display: block; }
/* error content */
.errorContent { padding: 20px 300px; width: 396px; min-height: 250px; float: left; line-height: 22px; }
.errorContent a { color: #b10000; text-decoration: none; }
.errorContent a:hover { color: #000; }
/* footer wrapper */
#footerWrapper { padding: 15px 0; width: 100%; float: left; background: #dae472; }
#footerWrapper p { float: left; font-size: 11px; color: #444; }
#footerWrapper ul { float: right; list-style: none; }
#footerWrapper li { padding: 0 0 0 20px; float: left; }
#footerWrapper a { font-family: 'LeagueGothicRegular', 'bebas_neueregular'; font-size: 20px; color: #434343; text-decoration: none; text-transform: uppercase; }
#footerWrapper a:hover { color: #727272; }