/*
----------------------------------------
01. default elements
----------------------------------------
*/

* {
	margin: 0;
	padding: 0;
}

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, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline
}

ul, li, ol {
	list-style:none
}

/* render html5 elements as block */
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section {
	display: block;
}

html {
	font-size: 100%;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
}

sub, sup {
	position: relative;
	font-size: 75%;
	line-height: 0;
	vertical-align: baseline;
}

sup { top: -0.5em; font-size:20px; }

sub { bottom: -0.25em }

img {
  max-width: 100%;
  vertical-align: middle;
  border: 0;
  -ms-interpolation-mode: bicubic;
  line-height:.5em;
}

textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus,
.uneditable-input:focus {
  outline: 0;
  outline:0;
}


/*  Custom animations
/*-------------------------------------------------- */
@-webkit-keyframes reveal {
  0% {
    opacity: 0;
  }
  1% {
    opacity: 0;
    -webkit-transform: scale(0.98) translateY(-15px);
  }
  80% {
    -webkit-transform: scale(1);
  }
  100% {
    -webkit-transform: translateY(0);
  }
}

@-moz-keyframes reveal {
  0% {
    opacity: 0;
  }
  1% {
    opacity: 0;
    -moz-transform: scale(0.98) translateY(-15px);
  }
  80% {
    -moz-transform: scale(1);
  }
  100% {
    -moz-transform: translateY(0);
  }
}

h1, h2, h3, h4, h5, h6 {
	font-weight:normal; line-height:1em
}

body { font-size:15px; color:#232323; line-height:22px; font-family:"montserratregular", Arial, Helvetica, sans-serif; background:#63a1ca}

.show_mobile1{ display:none}
.hide_mobile1{ display:block}

.show_mobile2{ display:none}
.hide_mobile2{ display:block}

.show_ipad1{ display:none}
.hide_ipad1{ display:block}

.show_ipad2{ display:none}
.hide_ipad2{ display:block}

a{ color:#232323; outline:0; cursor:pointer}
a, a:visited { text-decoration:none; outline:0}
a:hover{ color:#000000; text-decoration:underline; outline:0}
a:hover{ -webkit-transition: all .4s ease; -moz-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease}
a:focus, a:active, a:visited { text-decoration:none; outline:0}

figure a{ transition: all .4s ease}
figure a:hover{ opacity:0.85}


h1{ font-size:60px; color:#272727}
h1 a{ color:#272727}

h2{ font-size:54px; color:#000000; letter-spacing:-1px}
h2 a{ color:#000000}

h2.large{ color:#FFFFFF; text-shadow:#385d75 0 -1px 1px}
h2.large a{ color:#FFFFFF}


/*
----------------------------------------
02. container and wrapper
----------------------------------------
*/

.container-main { width:100%; float:left; background:#ecf0f1}

.wrapper{ width:1260px; margin:0 auto}

.btn{ width:220px; height:45px; float:left; background:#187818; border-radius:6px; behavior: url(PIE.htc); position:relative; font-family:"LatoBold", Arial, Helvetica, sans-serif; font-size:17px; color:#FFFFFF; text-align:center; text-decoration:none; line-height:45px; cursor:pointer}
.btn:hover{ background:#1a831a; color:#FFFFFF; text-decoration:none}
.btn:active{ background:#187818; box-shadow:inset #115911 0 2px 3px; behavior: url(PIE.htc); color:#FFFFFF; text-decoration:none}

.btn-center{ width:220px; margin:0 auto}

.scroll-up { width:100%; float:left; position:relative}
.scroll-up .wrapper{ position:relative}
.scroll-up a{ float:right; background:url(../images/arrow01.png) no-repeat 0 1px; font-size:14px; color:#404040; text-transform:uppercase; font-family:"proxima_nova_rgregular",Arial, Helvetica, sans-serif; line-height:1em; padding:0 0 0 20px; position:absolute; top:0; right:0}

/*
----------------------------------------
03. header
----------------------------------------
*/

header{ width:100%; float:left; background:#e3e5e6 url(../images/divider01.png) repeat-x bottom left; padding:20px 0 18px 0}
header .wrapper{ width:1070px}

.text-logo { font-family: 'montserratbold'; font-size: 35px; letter-spacing: -2px; font-weight: bolder;  }
.text-logo .tight { letter-spacing: -4px; }
.text-logo a:hover { text-decoration: none; }

.text-logo.looser { letter-spacing: 0px; }
.text-logo.looser .tight { letter-spacing: -2px; }

header .logo { float:left; padding:6px 0 0 0; }
header .logo a { color: #1a661a; }

header .btn-secontary{ height:36px; float:right; background:#187818; border-radius:4px; behavior: url(PIE.htc); position:relative; font-family:"LatoRegular", Arial, Helvetica, sans-serif; font-size:15px; color:#FFFFFF; text-align:center; text-decoration:none; line-height:36px; cursor:pointer; padding:0 9px}
header .btn-secontary:hover{ background:#1a831a; color:#FFFFFF; text-decoration:none}
header .btn-secontary:active{ background:#187818; box-shadow:inset #115911 0 2px 3px; behavior: url(PIE.htc); color:#FFFFFF; text-decoration:none}

.navbar{ float:right; padding:0 0 0 0}
.navbar nav{ float:left; padding:0}
.navbar nav ul{ float:left; font-family:"LatoBold", Arial, Helvetica, sans-serif}
.navbar nav ul li{ height:36px; float:left; line-height:36px; padding:0 32px 0 8px}
.navbar nav ul li a{ float:left; color:#43a1d0}
.navbar nav ul li a:hover{ color:#3483aa; text-decoration:none}
.navbar nav ul li a.active{ color:#3483aa}

.navbar .accordionButton{ width:35px; float:right; display:none; z-index:100; margin:0}
.navbar .accordionButton a{ width:100%; height:auto; float:left; color:#FFFFFF; text-decoration:none; position:relative; cursor:pointer}
.navbar .accordionButton .icon-bar{ width:90%; float:left; padding:0 5%}
.navbar .accordionButton .icon-bar span{ width:100%; height:4px; float:left; background:#63a1ca; border-radius:1px; behavior: url(PIE.htc); position:relative; padding:0; margin:3px 0}
.navbar .over a{ cursor:pointer}
.navbar .active .icon-bar span{ background:#187818}
.navbar .accordionContent { float:left; display:block}

/*
----------------------------------------
04. banner
----------------------------------------
*/

.banner{ width:92.5%; float:left; padding:32px 0 47px 7.5%}
.banner h1{ letter-spacing:-3px; padding-bottom:27px}
.banner h1 span{ font-family:"montserratbold", Arial, Helvetica, sans-serif}
.banner p{ font-family:"proxima_nova_rgregular", Arial, Helvetica, sans-serif; font-size:18px; color:#000000; padding-bottom:35px}
.banner p a{ color:#000000}
.banner figure{ width:62.65%; float:right; margin:80px 0 0 -11.65%}
.banner article{ width:49%; float:left}
.banner aside{ width:73.5%; float:left}
.banner .txt{ font-size:28px; color:#000304; letter-spacing:-1px; line-height:36px; padding-bottom:0}
.banner .txt-author{ width:100%; float:right; font-size:12px; text-align:right; padding-bottom:15px}

/*
----------------------------------------
05. top-info
----------------------------------------
*/

.top-info { width:100%; float:left; margin-bottom:-30px}


.tab-content { width:100%; float:left}

.tab-box { width:960px; float:left; background:#3399cc; border-radius:3px; behavior: url(PIE.htc); position:relative}
.tab-box { overflow:hidden; margin:0 0 0 160px}
.tab-box ul { width:101%; float:left; float:left; font-size:15px; font-family:"proxima_nova_semibold", Arial, Helvetica, sans-serif}
.tab-box ul li { width:14%; height:95px; float:left; line-height:18px}
.tab-box ul li { background:url(../images/divider02.png) repeat-y top left; padding:0 0 0 2px}
.tab-box ul li a{ width:100%; height:83px; float:left; text-align:center; color:#FFFFFF; margin:6px 0; behavior: url(PIE.htc); position:relative}
.tab-box ul li a span { width:100%; float:left; text-align:center; padding:40px 0 0 0}
.tab-box ul li.tab1 { background:none; padding:0}
.tab-box ul li.tab1 a span { background:url(../images/img-icon01.png) no-repeat center 10px}
.tab-box ul li.tab2 a span { background:url(../images/img-icon02.png) no-repeat center 10px}
.tab-box ul li.tab3 a span { background:url(../images/img-icon03.png) no-repeat center 10px}
.tab-box ul li.tab4 a span { background:url(../images/img-icon04.png) no-repeat center 10px}
.tab-box ul li.tab5 a span { background:url(../images/img-icon05.png) no-repeat center 10px}
.tab-box ul li.tab6 a span { background:url(../images/img-icon06.png) no-repeat center 10px}
.tab-box ul li.tab7 a span { background:url(../images/img-icon02.png) no-repeat center 10px}
.tab-box ul li a:hover { background:#246b8e; box-shadow:inset #1b506a -3px 3px 5px}
.tab-box ul li a.selected { background:#246b8e; box-shadow:inset #1b506a -3px 3px 5px}


.content-box { width:100%; float:left; padding:75px 0 0 0}
.content-box figure { width:29%; float:left; text-align:center; padding:0 3%}
.content-box aside { width:62%; float:left;}
.content-box aside h2 { padding:0 0 25px 0}
.content-box aside p { font-family:"open_sansregular", Arial, Helvetica, sans-serif; padding:0 0 25px 0}
.content-box aside ul { width:100%; float:left; padding:0 0 40px 0}
.content-box aside ul li { background:url(../images/bullet02.png) no-repeat 0 9px; padding:0 0 2px 15px}

/*
----------------------------------------
06. section - block
----------------------------------------
*/

.list-info{ width:100%; float:left; font-size:16px}
.list-info li{ color:#ffffff; text-shadow:#385d75 0 -1px 1px; padding-left:15px; margin-bottom:2px}
.list-info li{ background:url(../images/bullet01.png) no-repeat left 6px}
.list-info li a{ color:#ffffff}

.section-main-bg{ width:100%; float:left; background:#63a1ca}
.section-bg{ width:100%; float:left; background:url(../images/curve01.gif) no-repeat top center}
.section{ width:100%; float:left; background:url(../images/curve02.gif) no-repeat bottom center; padding:222px 0}


.section1{ width:100%; float:left}
.section1 h2{ color:#FFFFFF; text-shadow:#666666 2px 0 2px; padding:0 0 15px 0}
.section1 h2 a{ color:#FFFFFF}
.section1 p{ color:#ffffff; text-shadow:#385d75 0 -1px 1px; padding:0 0 22px 0}
.section1 p a{ color:#ffffff}
.section1 article{ width:100%; float:left; margin-top:-15px}
.section1 article figure{ float:left; padding:0 0 0 35%}
.section1 aside{ width:42.06%; float:left; padding:0 0 0 7.15%}
.section1 aside.right{ float:right; padding:0 1.9% 0 0}
.section1 .btn-bg{ width:100%; float:left; padding:48px 0 0 0}


.security-info{ width:86.6%; float:left; padding:0 5.8% 0 7.6%; margin:-30px 0 0 0}
.security-info h2{ padding-bottom:18px}
.security-info p{ padding-bottom:20px}

.security-info .list-info{ font-size:15px}
.security-info .list-info li{ color:#000000; background:url(../images/bullet02.png) no-repeat left 7px; text-shadow:none; padding-left:19px}

.security-info figure{ float:right}

.security-info .support{ width:100%; float:left; padding-bottom:28px}
.security-info .support span{ min-height:73px; float:left; line-height:73px; margin-right:7.3%}
.security-info aside{ width:65%; float:left}
.security-info article { width:100%; float:left}
.security-info .platform{ margin-bottom:-55px; position:relative}
.security-info .platform p{ font-size:24px; line-height:28px; color:#000000; padding:0}

.section2{ width:81%; float:left; padding:25px 9.5% 0 9.5%}
.section2 h2{ text-align:center; padding-bottom:33px}
.section2 h4{ font-size:20px; color:#ffffff; text-shadow:#385d75 0 -1px 1px; padding-bottom:17px}
.section2 p{ font-family:"lato_italicregular", Arial, Helvetica, sans-serif; font-size:24px; color:#ffffff; text-shadow:#385d75 0 -1px 1px; letter-spacing:1px; text-align:center; padding-bottom:25px}
.section2 .charts{ width:105.5%; float:left; padding-bottom:31px; margin-right:-5.5%; position:relative}
.section2 .charts ul{ width:100%; float:left}
.section2 .charts ul li{ width:20%; float:left; padding-right:5%}

.section2 article{ width:78%; float:left; padding:0 0 22px 22%}
.section2 aside{ width:305px; float:left}


/*
----------------------------------------
06. section - block
----------------------------------------
*/

.bottom-content{ width:100%; float:left; margin:-90px 0 -140px 0; position:relative}
.anonymous-info{ width:680px; margin:0 auto}
.anonymous-info h2{ letter-spacing:-2px; text-align:center; padding-bottom:45px}
.anonymous-info ul{ width:100%; float:left; font-size:16px; color:#232323; padding-bottom:30px}
.anonymous-info ul{ font-family:"open_sansregular", Arial, Helvetica, sans-serif}
.anonymous-info ul li{ width:100%; float:left; padding:0 0 5px 0}
.anonymous-info .list1{ font-family:"montserratregular", Arial, Helvetica, sans-serif; font-size:15px}
.anonymous-info .list1 li{ background:url(../images/bullet02.png) no-repeat left 8px; padding:0 0 0 12px}
.anonymous-info .list1 li a{ color:#000000}
.anonymous-info article{ width:100%; float:left; padding:20px 0}
.anonymous-info aside{ width:315px; float:right}
.anonymous-info figure{ width:290px; float:left}

/*
----------------------------------------
06. footer
----------------------------------------
*/

footer{ width:100%; float:left}
footer .section-bg { padding:293px 0 18px 0}

footer p { float:left; color: white; text-shadow: #385d75 0 -1px 1px; font-size:17px; padding:0 0 0 40px}
footer .blue-btn{ width:196px; height:34px; float:left; background:#2f4b93; line-height:34px; font-size:13px; text-align:center}
footer .blue-btn{ margin:0 0 0 40px}
footer .blue-btn span{ width:16px; float:left; text-indent:-9999px; margin-left:15px}
footer .blue-btn span{ background:url(../images/img-icon07.png) no-repeat left center}
footer .blue-btn:hover{ background:#0c308d}
footer .footer-logo{ float:right; margin:-8px 40px 0 0; }
footer .footer-logo a { color: white; text-shadow: #385d75 0 -1px 1px;}
footer article{ width:100%; float:left; padding:10px 0}

footer .footer-link { color: white; margin-left: 40px; text-decoration: underline; }