﻿@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 {font-family:'Open Sans',Helvetica,Arial,sans-serif;}
a  {text-decoration: none;}
div {display: block;}
.h2 {font-size: 32px; font-weight: 700}
.h3 {font-size: 22px; font-weight: 600; border-bottom: none}
.h4 {font-size: 18px; font-weight: 600; margin-top: 0px;}
.h5 {font-size: 18px; font-weight: 400; }
.h6 {font-size: 16px; font-weight: 600}
.p {font-size: 15px; font-weight: 400;line-height: 1.6em;}
.sub {font-size: 22px;font-weight: 400;line-height: 1.6em; margin-left: 50px;}

/*COLUMNS*/
.col-12 {width: 100%; float: left; }
.col-6 {width: 48%; max-width: 50%;float: left; padding: 1.8em 0.5em;}
.col-4 {width: 30%; max-width: 30%;float: left; padding: 1.8em 0em; margin: 20px}
.col-3 {width: 22%; max-width: 22%;float: left; padding: 1.8em 0.5em; margin: 10px}
.col-2 {width: 16%; max-width: 16%;float: left; padding: 1.8em 0.5em;}
.col-md-7 {width: 58%; max-width: 58%;float: left; padding: 1.8em 0.2em;}
.col-md-6 {width: 49%; max-width: 45%;float: left; padding: 1.8em 0.5em;}
.col-md-5 {width: 40%; max-width: 40%;float: left; padding: 1.8em 0.2em;}
.col-md-4 {width: 35%; max-width: 35%;float: left; padding: 1.8em 1em;}

/*ROW*/
.headline {font-size: 46px; font-weight: 700; margin-left: 30px; margin-top: 30px}
.section-wrap {width:1200px; margin: 0 auto;}/*FOR ALL ROW*/
.link-wrapper {display: flex;justify-content: center;flex-wrap: wrap;}/*FOR BUTTON ROW*/
.row {padding: 50px 0 50px 0;}
.li-spec {font-size: 15px;line-height: 2em;}
/*MARGINS, PADDINGS*/
.section-border, .title-border, .p-border {margin-bottom: 20px;}
.border-top {padding-top: 50px;}
.border-bottom {padding-bottom: 50px;}
.border-top-bottom {padding: 25px 0px;}
.section-title{margin-left: 30px; padding: 20px 0 20px 0;}

/*GREYSCALE COLORS*/
.bg-900 {background-color: #202020}
.bg-800 {background-color: #585858}
.bg-700 {background-color: #808080}
.bg-600 {background-color: #B8B8B8}
.bg-400 {background-color: #D8D8D8}
.bg-200 {background-color: #F8F8F8}
.bg-top {background-color: #09395a}
.bg-estore-blue {background-color: #4398ef;}
.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}
.t-blk {color: #000000}

/*ALIGNS*/
.center {text-align:center}
.left {text-align: left; }
.right {text-align: right;}
.img-padding {padding: 10px 30px;}
.img-full{max-width: 700px;	height: auto;width: 100%;}

/*PRODUCT*/
.product-area {background-color: #f8f8f8; }
.product-modelname {padding: 10px 0 10px 0;}
.product-sub {font-size: 15px; color: #05B5ED; padding-bottom: 10px;}
.price {color: #F38900; line-height: 1.5em; font-size: 22px;}

/*URLS*/
.eStore_btn{background-color:#4398EF;color:#FFFFFF;border-radius:3px;padding:5px 20px}
.cta{
	font-size: 16px;
	padding: 8px 40px;
	border: solid 1px;
	border-radius: 5px;
	min-width: 120px;
	text-decoration: none;	
	text-align: center;	
	margin: 0.5rem;
	color: #ffffff;}
.active {
	color: #FFFFFF;
	border-color: #4398ef;
}
.cta:hover{	color: #FFFFFF; background-color: #4398ef; border-color: #4398ef}	

.underline {text-decoration: underline;}

/*ADVANTECH BRANDING*/
.bg-advantech-blue {background-color: #004280;}
.bg-aonline {background-color: #F39800;}
.bg-eiot {background-color: #801A7A;}
.bg-iretail{background-color: #F2A900;}
.bg-ihealthcare {background-color: #7DB5EA;}
.bg-ilogistic {background-color: #7DB5EA;}
.bg-ncg {background-color: #0085CC;}
.t-advantech-blue {color: #004280;}
.t-aonline {color: #F39800;}
.t-eiot {color: #801A7A;}
.t-iretail{color: #F2A900;}
.t-ihealthcare {color: #7DB5EA;}
.t-ilogistic {color: #7DB5EA;}
.t-ncg {color: #0085CC;}

/*list*/

/*VIDEO*/
.yt-video {position: relative; padding-bottom: 75%; overflow: hidden;}
.yt-video iframe {position: absolute; align-items: center; top: 0; left: 0; width: 100% !important; height: 100% !important; padding: 40px;}




/*MOBILE LOOK*/
@media screen and (max-width: 480px)   {
.col-12 {width: 98%; float: left; padding: 10px;}
.col-6 {width: 96%; max-width: 96%;float: left; }
.col-4 {width: 96%; max-width: 96%;float: left; padding: 1em 0.5em;}
.col-3 {width: 96%; max-width: 96%;float: left; }
.col-2 {width: 96%; max-width: 96%;float: left; }
.col-md-5 {width: 96%; max-width: 96%;float: left; padding: 1em;}
.col-md-5 {width: 96%; max-width: 96%;float: left; padding: 1em;}
.col-md-4 {width: 96%; max-width: 96%;float: left; padding: 1em;}
div {display: block;}
.h2 {font-size: 28px; font-weight: 700}
.h3 {font-size: 22px; font-weight: 600; border-bottom: none; margin-top: 0px;}
.h4 {font-size: 18px; font-weight: 600; margin-top: 0px; }
.h5 {font-size: 18px; font-weight: 400; }
.h6 {font-size: 16px; font-weight: 600}

.p {font-size: 15px; font-weight: 400;line-height: 1.6em;}
.headline {font-size: 38px; font-weight: 700; margin-left: 10px;}
.sub {font-size: 22px;font-weight: 400;line-height: 1.6em; margin-left: 50px;}	
.btn{
	margin: 0 auto;
	padding: 30px 0;
}

	.section-wrap {max-width: 98%}	
	
    .sub{
        font-size:20px
    }
    .video-title{
        margin-left:0;
        width:100%
    }

.img-padding {padding: 0;}	
img{
     width:100%;
	 max-width:100%
    }
    }