@charset "utf-8";
/*DESIGN SYSTEM*/
.h1,.h2,.h3,.h4,.h5,.sub,.section-title,.feature-title,.feature-descript,.t-product-title, .t-product-des, .table-name, p, div, tr, td, a, h1, h2, h3, h4, h5, h6, li {font-family:'Open Sans', Arial,  Helvetica, sans-serif;}
.nav,.go-top, li, a {text-decoration: none;}
div {display: block;}
.h1 {font-size: 46px; font-weight: 700; padding: 1em 0 0.5em 0; line-height: 52px}
.sub {font-size: 38px;font-weight: 400; line-height: 1.6em; margin-left: 50px;}
.h2 {font-size: 30px; font-weight: 700; padding: 1em 0 1em 0; line-height: 36px;}
.h3 {font-size: 26px; font-weight: 600; padding: 0.5em 0 0.5em 0;line-height: 32px; border-bottom: none; }
.h4 {font-size: 20px; font-weight: 400; margin-top: 0px;}
.h5 {font-size: 16px; font-weight: 600; }
.h6 {font-size: 15px; font-weight: 400; padding: 0.5em 0 0.5em 0;}
.p {font-size: 15px; font-weight: 400;line-height: 1.5em; color: #202020}
.headline {font-size: 38px; font-weight: 700; margin-left: 50px;}
ul, ol, li {line-height: 1.8em}

/*COLUMNS*/
.col-12 {width: 100%; max-width: 100%;float: left; padding-bottom: 20px;}
.col-12-no-pd {width: 100%; max-width: 100%;float: left; }
.col-10 {width: 80%; max-width: 80%;float: left; padding-bottom: 20px;}
.col-10-sm {width: 62%; max-width: 62%;float: left; padding: 0.5em;}
.col-8 {width: 68%; max-width: 68%;float: left; padding: 0.5em;}
.col-md-7 {width: 58.333333%; float: left; }
.col-6 {width: 48%; max-width: 50%;float: left; padding: 0.5em;}
.col-6-46 {width: 46%; max-width: 50%;float: left; padding: 1.5em 0.5em;}
.col-md-5 {width: 41.666667%; float: left; }
.col-4 {width: 30%; max-width: 30%;float: left; padding: 0.5em 1em;}
.col-4-no-pd {width: 30%; max-width: 30%;float: left; padding: 0em;}
.col-3 {width: 24%; max-width: 24%;float: left; padding: 0.1em;}
.col-2 {width: 16%; max-width: 16%;float: left; padding: 0.5em 0.1em;}
.col-2-sm {width: 30%; max-width: 30%;float: left; padding: 0.1em;}
.col-md-1-5 {width: 20%; max-width: 20%; float: left; padding: 1.8em 0em;}
.w980 {table-layout: fixed;width: 980px; margin: 0 auto;}

/*ROW*/
.clearfix {clear: both}
.section-wrap {width:1200px; margin: 0 auto; overflow: auto; font-family: 'Roboto', 'Open Sans', Arial, sans-serif; padding: 40px 0;}/*FOR ALL ROW*/
.link-wrapper {justify-content: left;flex-wrap: wrap; padding-top: 10px;}/*FOR BUTTON ROW*/
.row {padding: 50px 0 50px 0;}
.eStore_container .eStore_block980 {
	width: 1200px;
}
.eStore_block980 {
	table-layout: fixed;
	width: 1200px;
	margin: 0 auto;
}
.img-100 {max-width: 100%;}
/*MARGINS, PADDINGS*/
.section-border, .title-border, .p-border {margin-bottom: 20px;}
.border-top {padding-top: 50px;}
.border-top-30 {padding-top: 30px;}
.border-bottom {padding-bottom: 50px;}
.border-bottom-30 {padding-bottom: 30px;}
.border-top-bottom {padding: 40px 0px;}

/*GREYSCALE COLORS*/
.bg-900 {background-color: #202020}
.bg-800 {background-color: #585858}
.bg-700 {background-color: #808080}
.bg-600 {background-color: #B8B8B8}
.bg-500 {background-color: #E8E8E8}
.bg-400 {background-color: #D8D8D8}
.bg-200 {background-color: #F8F8F8}
.bg-blue {background-color: #0556c0;}
.bg-lightblue {background-color: #c3e5f9}
.bg-darkblue {background-color: #0F3250;}
.bg-wht {background-color: #ffffff;}

.t-900 {color: #202020}
.t-800 {color: #585858}
.t-700 {color: #808080}
.t-600 {color: #B8B8B8}
.t-400 {color: #D8D8D8}
.t-200 {color: #F8F8F8}
.t-wht {color: #FFFFFF} a:visited .t-wht {color: #FFFFFF;} 
.t-blk {color: #000000}
.t-blue {color: #0070C0}

/*ALIGNS*/
.center {text-align:center}
.left {text-align: left; }
.right {text-align: right;}
.padding {padding: 10px 30px;}
.padding-bottom {padding-bottom: 20px;}
.padding-top {padding-top: 20px;}
.img-full{max-width: 700px;	height: auto;width: 100%;}

.link{
	color: #4697e6;
	text-decoration: none;
	padding-bottom: 0px;
	
}
.link:hover{
	text-decoration: underline;
}
.card{
	 box-shadow: 4px 4px 5px #f4f4f4;
    background-color: #ffffff;
	padding-top: 10px;
	padding-bottom: 20px;
	margin-bottom: 30px
}
.card:hover
{    box-shadow: 0px 5px 20px #b0b0b0;
    transition: box-shadow 0.6s;}

#kv .col-6 {padding: 0;}
#kv .h2 {font-weight: 300; color: #666; font-size: 28px; line-height: 32px; padding: 0.8em 0;}
#benefit .h2 {padding: 0 2em;}
.li-tick {
	list-style-image: url(images/tick_orange.png) !important;
}


.eStore_btn{
	background-color: #4398ef;
    color: #fff;
    border-radius: 3px;
    padding: 5px 20px;
    text-align: center;
    border: 0px;
    min-width: 120px;
	font-family: 'Open Sans', Arial, Helvetica, sans-serif;
	text-decoration: none;
}
.eStore_btn:hover{
	    background-color: #2284e8;
}
.icon{
	margin-bottom: 20px;
	margin-top: 60px;}
.padding-top{
	padding-top: 15px;}

.list{
	color: #fff;
font-family: 'Open Sans', Helvetica, sans-serif;
font-size: 15px;
text-align:center;
padding-bottom: 40px;
padding-top: 10px;

	}
.title-grey{
	background-color: #e8e8e8;
	width: 100%;
	height: 220px;
	text-align:center;
overflow: hidden;
padding: 0;}
body{
	margin: 0 auto;}
.articles{
	padding-top: 30px;
	width: 800px;
	margin-left: 100px;
	}
.banner{
	background-image:url(images/banner.jpg);
	background-repeat:no-repeat;
	height: 226px;
	margin: 0 auto;
	}

.cta{
	margin-left: 600px;
	margin-top: 15px;
	color: #fff;
	background-color: #f39903;
	padding: 5px 15px;
	border-radius: 5px;
	font-size: 14px;
	font-family: 'Open Sans', Tahoma, Geneva, sans-serif;
	}
.cta:hover{
	background-color: #fdb715;
	color: #fff;
	text-decoration: none;}
a{
	text-decoration: none;
	}
a:hover{
	text-decoration: underline;
	}
.eStore_btn:hover{
	text-decoration: none;
	}

ul.text{
	font-family: 'Open Sans', Tahoma, Geneva, sans-serif;
	color: #666666;
	font-size: 16px;
	line-height: 25px;
	margin-top: 6px;
	font-weight: 400;
	margin-left: 45px;
	margin-bottom: 35px;
	}
ul.text>li {
	list-style-type:disc;
}

ul.materials>li, ul.share-buttons>li {
	display: inline;
	}
div.sharing{
	clear: both;
	}
ul.share-buttons{
	text-align: left;
	padding-left: 20px;
	}
.sharing{
	padding-top: 5px;
	margin-bottom: 25px;
	margin-top: 20px;
	}
table{
	width: 980px;
	border-collapse: collapse;
		border: 1px solid #b7b7b7;
		margin: 0 auto;
		margin-bottom: 30px;
		}
td {font-size: 16px;}
td.cell{
	border: 1px solid #b7b7b7;
	padding: 5px;
	text-align: left;
	}	
.subtitle>td{
	border: none;
	}
tr.subtitle{
	background-color: #fff;
	font-size: 16px;
	font-weight: 400;
	color: #202020;
	height: 3em;
	}	
table.SI_benefits>tr>td.cell{
	text-align: center;
	padding: 12px;
	}
	
td.left{
	text-align: left;
	line-height: 22px;
	padding: 14px;
	border: 1px solid #b7b7b7;
	vertical-align:text-top;
	}
i{color: #f39903;}
	
table.SI_benefits{
	font-family: 'Open Sans', Tahoma, Arial, sans-serif;
	font-size: 13px;
	line-height: 18px;
	color: #666;
	margin-bottom: 25px;
}

table.win10>tr>td.cell{
	text-align: center;
	padding: 12px;
	}
table.win10{
	font-family: 'Open Sans', Tahoma, Arial, sans-serif;
	font-size: 14px;
	line-height: 18px;
	color: #666;
}

.subtitle>td{
	border: none;
	}
	.top{
	font-family: 'Open Sans', Tahoma, Arial, sans-serif;
	font-size: 19px;
	font-style: italic;
	font-weight: 600;
	background-color: #0078d7;
	color: #fff;
	
	}
.highlight{
	color: #f39903;
	font-weight: bold;
		}

.go-top {
	position: fixed;
	bottom: 5em;
	right: 13em;
	text-decoration: none;
	color: white;
	background-color: #0078d7;
	font-size: 13px;
	padding: 1em;
	font-family: 'Open Sans', Verdana, Tahoma, sans-serif;
	display: none;
}

.go-top:hover {
	background-color: #f39903;
	Color: #ffffff;
	text-decoration: none;
}
/*ul {margin: 0;padding: 0;overflow: hidden;list-style-type: none;}*/

/*DROPDOWN MENU*/
button{font-family: 'Open Sans', Helvetica, Arial, sans serif;}
.nav-background {background-color: #0078d7;width: 100%;}
.navbar {
	overflow: hidden;
    background-color: #0078d7;
    font-family: 'Open Sans', Helvetica, Arial, sans serif;
	z-index: 170;
    margin: 0 auto;
    /*display: table;*/
    text-align: center;
}
.dropdown {float: left; overflow: hidden;}
.dropdown .dropbtn {
    font-size: 16px;    
    border: none;
    outline: none;
    color: #fff;
    padding: 14px 16px;
    background-color: inherit;
}


.dropdown-content {
    display: none;
    position: fixed !important; 
    background-color: #000;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
	color: #202020;
}

.dropdown-content a {
    float: none !important;
    color: #202020 !important;
    padding: 12px 16px !important;
    text-decoration: none !important;
    display: block !important;
    text-align: left !important;
	background-color: #f8f8f8 !important;
	display: block !important;
}

.dropdown-content a:hover {
    background-color: #d8d8d8 !important;
}

.dropdown:hover .dropdown-content {
    display: block;
}

.navbar a {
    float: left;
    font-size: 16px;
    color: #fff;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
}
.navbar a:hover, .dropdown:hover .dropbtn {
    background-color: #f39903;
	text-decoration: none;
}

.stickytop {
	position: fixed;
	top: 0;width: 100%;
	padding-left: 22%;
	margin-left: 0;
	background-color: rgba(0, 120, 215, .8);
	z-index: 1000;
}
   
.nav li a {
    display: block;
    color: #fff;
    text-align: center;
    padding: 14px 15px;
    text-decoration: none;
}
.nav li a:hover {
    background-color: #f39903;
	color: #ffffff;
	text-decoration: none;
}

.pad{
	padding-top: 50px;}
i{color: #fff;
padding-left: 10px;}
i:hover{
	color: #f39903;}
.fa-arrow-up{color: #ffffff;}

.software{
	color: #666;
		font-family: 'Open Sans', Tahoma, Geneva, Sans-serif;
		font-weight: 500;
		font-size: 18px;
		margin: 0;
	background-color: #e8e8e8;
	padding: 10px 20px;
	border: none;}
.top-t{
		margin-top: 0px;
		border: none;}
.logo{
		border: 1px solid #ccc;
		vertical-align: middle;
		text-align:center;
		width: 200px;
		height: 90px;
		margin: 10px;}
.logos{margin-top: 30px;
	border: 1px solid #ccc;
	border-collapse: collapse;
	}
	.others{
		margin-bottom: 33px;}
/*FOOTER*/
.text-contact {
	font-size: 18px;
	font-weight: 800;
	color: #585858;
	text-decoration: none;
}
.text-contact :hover{
	color: #f39800;
	text-decoration: underline;
	text-decoration-color: #f39800 !important;
}
#contact a :hover {
	color: #f39800;
}
#contact .p {font-size: 18px;}
#contact .col-12 {padding: 1em 0;}
@keyframes slideInLeft {
  from {
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  to {
    transform: translate3d(0, 0, 0);
  }
}

.slideInLeft {
  animation-name: slideInLeft;
}

@keyframes slideInRight {
  from {
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    transform: translate3d(0, 0, 0);
  }
}

.slideInRight {
  animation-name: slideInRight;
}