body{font-family:"Open Sans","Roboto","Helvetica Neue",Helvetica,sans-serif,Arial;}
h1,h2,h3,h4,h5,h6{font-family:"Roboto","Helvetica Neue",Helvetica,sans-serif,Arial; font-weight:500;}
h1{font-size:1.9375rem;}
h2{font-size:1.5625rem;}
h3{font-size:1.375rem;}
h4{font-size:1.25rem;}
h5{font-size:1rem;}
h6{font-size:0.85rem;}
body{font-size:85%/*13.6*/}
.dropdown.menu .submenu{ z-index:6;}
.label{font-size: 1rem; line-height: 1.2; padding: 0.3rem 0.6rem 0.4rem;}
.label.primary{ background: #036390 none repeat scroll 0 0; color: #FFF; border:#3582a6 solid 1px;}

/* - spacing fixes - */
.m-t-lg{ margin-top:20px;}
.m-t-md{ margin-top:15px;}
.m-t-sm{ margin-top:10px;}
.m-t-xs{ margin-top:5px;}
.m-b-lg{ margin-bottom:20px;}
.m-b-md{ margin-bottom:15px;}
.m-b-sm{ margin-bottom:10px;}
.m-b-xs{ margin-bottom:5px;}
.p-t-lg{ padding-top:20px;}
.p-t-md{ padding-top:15px;}
.p-t-sm{ padding-top:10px;}
.p-t-xs{ padding-top:5px;}
.p-r-lg{ padding-right:20px;}
.p-r-md{ padding-right:15px;}
.p-r-sm{ padding-right:10px;}
.p-r-xs{ padding-right:5px;}
.p-b-lg{ padding-bottom:20px;}
.p-b-md{ padding-bottom:15px;}
.p-b-sm{ padding-bottom:10px;}
.p-b-xs{ padding-bottom:5px;}
.p-l-lg{ padding-left:20px;}
.p-l-md{ padding-left:15px;}
.p-l-sm{ padding-left:10px;}
.p-l-xs{ padding-left:5px;}
.m-lg{ margin:20px;}
.m-md{ margin:15px;}
.m-sm{ margin:10px;}
.m-xs{ margin:5px;}
.p-lg{ padding:20px;}
.p-md{ padding:15px;}
.p-sm{ padding:10px;}
.p-xs{ padding:5px;}
.no-s{ padding:0; margin:0;}
.no-p{ padding:0;}
.no-p-t{ padding-top:0 !important;}
.no-p-b{ padding-bottom:0 !important;}
.no-p-l{ padding-left:0 !important;}
.no-p-r{ padding-right:0 !important;}
.no-m{ margin:0;}
.no-m-t{margin-top:0;}
.no-m-b{margin-bottom:0;}
.no-b-b{ border-bottom:0;}
.no-b-t{ border-top:0;}
.prelative{ position:relative;}
.link-normal{cursor:default;}
.prelative img.special{ position:absolute; left: 0; top: 177px;}

/*- header section style -*/
.top-container{ background:#e4eef2 url(../images/bg-header.gif) 0 0 repeat-x;/*background:#FFF;*/ border-bottom: 1px solid rgba(10, 10, 10, 0.1);}
.top-container .logo-side{ position:relative;}
.top-container .logo-side .font-logo{ font-family:"Roboto",sans-serif; font-size:1.6875rem; position:absolute; top:0; white-space:nowrap;}
.top-container .social-top{ list-style:none; display:block; text-align:right;}
.top-container .social-top li{ display:inline-block;}
.fa-1-7x{ width:1.7em; height:1.7em; line-height:1.7em;}
.fa-1-7x .fa-stack-2x{ font-size:1.7em;}
.fa-1-7x .fa-stack-1x{ font-size:.7em;}
.top-container .social-top li a{color:#024b6e;}
.top-container .social-top li a:hover{color: #258faf;}
.top-container .social-top li a.normal:hover{color:#024b6e; cursor:default;}
.top-container .social-top li a.social .fa-stack{ color: #727474;}
.top-container .social-top li a.social .fa-stack-1x{ color: #FFF;}
.top-container .social-top li a.social-fb:hover .fa-stack-2x{ color:#3c599f;}
.top-container .social-top li a.social-tw:hover .fa-stack-2x{ color:#00aced;}
.top-container .social-top li a.social-in:hover .fa-stack-2x{ color:#0274b3;}
.top-container .social-top li a.social-gp:hover .fa-stack-2x{ color:#dc4a38;}
.top-container .social-top li a.social-ig:hover .fa-stack-2x{ color:#517fa4;}
.top-container .social-top li a.social-yt:hover .fa-stack-2x{ color:#c12025;}
.top-container .social-top li .color-red{ color:#ff0000;}
.top-container .menu-icon-box{ padding:2px 4px 6px; background-color:rgba(0,0,0,0.4); display:inline-block;}
.top-container .menu-icon-box .menu-icon:after{ height:3px;}
.mobile-ofc{ background-color: #121212; font-size: 0.8125rem; font-weight: bold;}
.mobile-ofc .title{background-color: #2c2c2c; color: #8a8a8a; font-size: 0.8em; padding: 0.5rem .7rem;}
.mobile-ofc li a{ padding: 0.5rem 0.7rem !important;}
.mobile-ofc .submenu li a{ padding:0.4rem 1.2rem !important; font-size:0.8rem;}
.mobile-ofc .submenu .submenu li.title{ padding:0.4rem 1.2rem !important;}
.mobile-ofc .submenu .submenu li a{ padding:0.3rem 1.7rem !important; font-size:0.7rem;}
.ctopmenu{ margin-top:10px;}
.ctopmenu > li{ padding:0 16px 0 0; background:url(../images/list.png) 100% 50% no-repeat;}
.ctopmenu > li:last-child{ padding:0; background:none;}
.ctopmenu a{ color:#024b6e;}
.ctopmenu a:hover{ color:#000;}
.dropdown.menu .submenu{ min-width:220px;}
.dropdown.menu .is-dropdown-submenu-parent.is-down-arrow a{}
.dropdown.menu .is-dropdown-submenu-parent.is-down-arrow > a::after{border-color: #024b6e transparent transparent;}
.dropdown.menu .is-dropdown-submenu-parent.is-right-arrow > a::after{border-color: transparent transparent transparent #024b6e;}
.dropdown.menu .submenu{ border-color:#aabccf; background-color:#e4eef2;}
.dropdown.menu .is-dropdown-submenu-item a{ padding:0.5rem !important; font-size:0.8rem;}

#imint{ display: block; background: url(../images/sticky-interested.gif) 0 0 no-repeat; width: 35px; height: 129px; position: fixed; top: 50%; right: 0; z-index: 6; box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); margin-top: -65px;}

.banconsep{ background-color:#333333; height:5px;}
.intro-box{ padding-bottom: 3.45rem;}
.intro-box a.button{ position: absolute; right: 1rem; bottom: 0.8rem;}

.stats-section{ background:#fc110d url(../images/bg-stats.jpg) 0 100% repeat-x; text-align:center; color:#FFF; padding-top: 10px;}
.stats-section h3{ font-weight: 500; color: #fff; font-size: 3rem; margin: 0 auto 2rem; display: inline-block; border-bottom: #ca0005 solid 3px;}
.stats-section h3 span{ font-weight: 400; color: #fff;}
.stats-section .boxes{ padding-bottom:1.25rem;}
.stats-section h1, .stats-section h4{ font-weight:600; color:#FFF;}
.stats-section h1{ font-size:4rem; line-height:4rem;}
.stats-section h4{}

.pcatsection{ color:#FFF; background-color:#2980B9; padding:1.25rem 0;}
.pcatsection h2{ color:#FFF; font-weight:300; font-size:2.5rem;}
.pcatsection h5{ color:#2c3e50;}
.packer a {color: #333;}
.pcatsection .packer{ max-width:272px; margin:0 auto;}
.pcatsection .packer ul{ font-size:0.8rem; padding:0.5rem 0;}
.pcatsection .packer ul li{}
.pcatsection .packer ul li i{ margin:0 5px; color:#2c3e50;}
.pcatsection .packer ul li img{ margin:0 5px;}
.pcatsection .banner img{border:#307091 solid 1px;}

.ourcustomers{ background:#f7e7c6 url(../images/bg-client-section.jpg) 50% 100% no-repeat; background-size:cover; padding:1rem 0;}
.ourcustomers h1{ font-size:3.125rem; font-weight:600; text-transform:uppercase; color:#FFF; text-shadow:0 0 2px rgba(0,0,0,0.2);}
.ourcustomers h1 span{ color:#ee1c25;}
.ourcustomers figure{ margin:0 0 1.25rem;}
.ourcustomers figure .imgbox{ background-color:#FFF; padding:0.625rem 1.5rem; text-align:center; height:7.6875rem; line-height:6.4375rem; font-size:0;}
.ourcustomers figure .imgbox img{ max-height:100%; max-width:100%; transition:all .2s ease-in-out;}
.ourcustomers figure .imgbox:hover img{ transform: scale(1.1);}
.ourcustomers figure figcaption{ background-color:rgba(255,255,255,0.6); text-align:center; font-weight:600; padding:0.2rem;}

.ourclients{ padding:1rem 0;}
.ourclients h1{ font-size:3.125rem; font-weight:600; text-transform:uppercase; color:#FFF; text-shadow:0 0 2px rgba(0,0,0,0.2);}
.ourclients h1 span{ color:#ee1c25;}
.ourclients figure{ margin:0 0 1.25rem; background-color: #ccc; border: #ccc solid 1px;}
.ourclients figure .imgbox{ background-color:#FFF; padding:0.625rem; text-align:center; height:5.6875rem; line-height:4.4375rem; font-size:0;}
.ourclients figure .imgbox img{ max-height:100%; max-width:100%; transition:all .2s ease-in-out;}
.ourclients figure .imgbox:hover img{ transform: scale(1.1);}
.ourclients figure figcaption{ background-color:rgba(255,255,255,0.6); text-align:center; font-weight:600; padding:0.2rem;}

.fpress{ padding: 1rem 0;}
.fpress h4{ text-align: center; color: #666;}
.fpress h4 span{ color: #F00;}
.fpress ul{ display: block; text-align: center; list-style: none;}
.fpress ul li{ display: inline-block;}
.fpress ul li a{ display: block; text-align: center; margin: 0.5rem; padding: 0.5rem 1rem; background-color: #f5f5f5; border: #e8e8e8 solid 1px; color: #666; transition: border-color 0.3s;}
.fpress ul li a:hover{ border: #999 solid 1px;}
.fpress ul li a img{ height: 1.2rem;}
.fpress ul li a span{ display: block;}

.faqhome{ background:url(../images/bg-dot-faq-home.gif) 0 0 repeat; color:#FFF; padding:1.25rem 0;}
.faqhome .faqhbox{ padding-bottom:1rem;}
.faqhome h4, .faqhome h6{ color:#FFF;}

.footlinks{ padding:1.6rem 0 0.8rem;}
.footlinks .icon-bg{ background-position:0 50%; background-repeat:no-repeat; color:#226fa3; display:block; margin-bottom:0.8rem;}
.footlinks .icon-mail{ background-image:url(../images/icon-mail.gif);}
.footlinks .icon-phone{ background-image:url(../images/icon-phone.gif);}
.footlinks .icon-demo{ background-image:url(../images/icon-demo.gif);}
.footlinks .icon-quote{ background-image:url(../images/icon-quote.gif);}

.mainfooter{ background-color:#121212; color:#FFF; padding:1.5rem 0 1rem;}
.mainfooter a, .mainfooter h5{ color:#FFF;}
.mainfooter h6{ color:#f9c615;}
.mainfooter ul a{ font-size:1.125rem; font-weight:500;}
.mainfooter ul a{ color:#d3d3d3; font-size:0.78rem; font-weight:400;}
.mainfooter ul a:hover{ color:#FFF;}
.mainfooter .social-bottom{}
.mainfooter .social-bottom a.social .fa-stack{ color: #999;}
.mainfooter .social-bottom a.social .fa-stack-1x{ color: #FFF;}
.mainfooter .social-bottom a.social-fb:hover .fa-stack-2x{ color:#3c599f;}
.mainfooter .social-bottom a.social-tw:hover .fa-stack-2x{ color:#00aced;}
.mainfooter .social-bottom a.social-in:hover .fa-stack-2x{ color:#0274b3;}
.mainfooter .social-bottom a.social-gp:hover .fa-stack-2x{ color:#dc4a38;}
.mainfooter .social-bottom a.social-ig:hover .fa-stack-2x{ color:#517fa4;}
.mainfooter .social-bottom a.social-yt:hover .fa-stack-2x{ color:#c12025;}

/* about us page */
.about-aside{ background-color:#e7f0f3; border-color:#d3e0e4;}
.table thead{ border-color:#2ba6cb;}
.table tbody, .table tfoot{ border-color:#2ba6cb;}
.thead{ background-color:#2ba6cb; color:#fefefe;}
.skill-list .label{ margin-bottom:5px;}

.callout.opacity40{ border-color:rgba(10, 10, 10, 0.40);}
blockquote.special{ border-left: 0; position: relative;}
blockquote.special p{ font-family: "Roboto",sans-serif, Arial; font-weight: 300; color: #222; font-size: 0.8rem; line-height: 1.3rem; margin-bottom: 0.5rem;}
blockquote.special .fa{ color: #2980b9; margin: 0 5px;}
blockquote.special figure{ padding: 0.25rem; margin: 0; height: 3.5rem; border-top: 1px solid #e0e0e0;}
blockquote.special figure img{ float: right; height: 3rem; margin-right: 0.25rem;}
blockquote.special figure figcaption{ color: #2980b9; font-size: 0.8rem; line-height: 1rem; display: inline-block; padding: 0.25rem;}
blockquote.special figure figcaption span{ font-style: italic; display: block;}
blockquote.special figure figcaption b{ display: block;}
/* Product Page */
.medium-8.large-9.column h1 {
    font-size: 26px;
     color: #000;
}
.medium-8.large-9.column .label {
    font-size: 0.8rem;
    line-height: 1.2;
    padding: 0.3rem 0.4rem 0.3rem;
    font-weight: 600;
}
.medium-8.large-9.column h2 {
    font-size: 22px;
    margin: 15px 0 5px; 
    color: #000;
}
.medium-8.large-9.column h2 span {
    font-weight: 600;
}
.medium-8.large-9.column h3 {
    font-size: 18px;
    margin: 15px 0 0;
}
.medium-8.large-9.column img.m-b-md {
    border-radius: 10px;
}
 
.medium-8.large-9.column .p-l-lg li {
    padding-left: 18px;
    position: relative;
    list-style: none;
    line-height: 1.67;
}
.medium-8.large-9.column .p-l-lg li:before {
    content: "";
    width: 8px;
    height: 8px;
    position: absolute;
    left: 0;
    top: 0.5em;
    background-color: #149dc7;
    border-radius: 50%;
}
.medium-8.large-9.column p, .medium-8.large-9.column ul {
    margin-bottom: 10px;
}
/* Small only */
@media screen and (max-width: 39.9375em) {
    .header-wrap{ height:3.8rem;}
    .top-container{ padding:15px 0;}
    .top-container .logo-side .font-logo{ display:none;}
    .top-container .logo-side .img-logo{ width:2.27rem;}
    #headermenu{ position:fixed; top:0; left:0; right:0; z-index:6; transition: padding 0.1s linear;}
    #headermenu.fixedmh{ padding:5px 0;}
    #headermenu ul.social-top{ display:none;}

    .stats-section h1{ font-size:3rem; line-height:3rem;}
    .stats-section h4{ font-size:1rem;}
    .footlinks .icon-bg{ font-size:14px; height:35px; line-height:35px;}
    .footlinks .icon-mail{ padding-left:46px; background-size:36px 27px;}
    .footlinks .icon-phone{ font-size:12px; padding:5px 0 5px 45px; line-height:15px; background-size:35px 33px;}
    .footlinks .icon-demo{ padding-left:49px; background-size:39px 34px;}
    .footlinks .icon-quote{ padding-left:45px; background-size:35px 35px;}

    .mainfooter ul { display:block; text-align:center; }
    .mainfooter ul ul{ padding: 0; margin: 0;}
    .mainfooter ul ul ul{ padding: 0; margin: 0;}
    .mainfooter ul li li{ display:inline-block;}
    .mainfooter ul a { padding-right: 0.4rem; padding-left: 0.4rem; }
    .mainfooter ul ul a { padding-right: 0.3rem; padding-left: 0.3rem; }
}

/* Medium and up */
@media screen and (min-width: 40em) {
    .header-wrap{ height:5.15rem;}
    .top-container{ padding:15px 0;}
    .top-container .logo-side .font-logo{ font-size:1.2rem; left:4.5rem; white-space:normal;}
    .top-container .logo-side .img-logo{ width:3.775rem;}
    #headermenu{ position:fixed; top:0; left:0; right:0; z-index:6; transition: padding 0.1s linear;}
    #headermenu.fixedmh{ padding:10px 0;}
    #headermenu .logo-side .img-logo{ transition: width 0.05s linear;}
    #headermenu.fixedmh .logo-side .img-logo{ width:2.27rem;}
    #headermenu h4.font-logo{transition: opacity 0.05s, font-size 0.05s linear; opacity:1;}
    #headermenu.fixedmh h4.font-logo{ font-size:0; opacity:0;}

    .footlinks .icon-bg{ font-size:14px; height:35px; line-height:35px;}
    .footlinks .icon-mail{ padding-left:46px; background-size:36px 27px;}
    .footlinks .icon-phone{ font-size:12px; padding:5px 0 5px 45px; line-height:15px; background-size:35px 33px;}
    .footlinks .icon-demo{ padding-left:49px; background-size:39px 34px;}
    .footlinks .icon-quote{ padding-left:45px; background-size:35px 35px;}
}

/* Medium only */
@media screen and (min-width: 40em) and (max-width: 63.9375em) {
    .stats-section h1{ font-size:3rem; line-height:3rem;}
    .stats-section h4{ font-size:1rem;}

    .mainfooter ul { display:block; text-align:center; }
    .mainfooter ul ul{ padding: 0; margin: 0;}
    .mainfooter ul ul ul{ padding: 0; margin: 0;}
    .mainfooter ul li li{ display:inline-block;}
    .mainfooter ul a { padding-right: 0.4rem; padding-left: 0.4rem; }
    .mainfooter ul ul a { padding-right: 0.3rem; padding-left: 0.3rem; }
}

/* Large and up */
@media screen and (min-width: 64em) {
    .header-wrap{ height:6.093rem;}
    .top-container{ padding:15px 0 5px;}
    .top-container .logo-side .font-logo{ font-size:1.5rem; left:5.9375rem; white-space:nowrap;}
    .top-container .logo-side .img-logo{ width:4.93rem;}
    #headermenu{ position:fixed; top:0; left:0; right:0; z-index:6;}
    #headermenu.fixedmh{ padding:10px 0;}
    #headermenu .logo-side .img-logo{ transition: width 0.05s linear;}
    #headermenu.fixedmh .logo-side .img-logo{ width:2.65rem;}
    #headermenu .ctopmenu{ transition: margin-top 0.05s linear;}
    #headermenu.fixedmh .ctopmenu{ margin-top:0;}
    #headermenu h4.font-logo{transition: top 0.05s, font-size 0.05s linear;}
    #headermenu.fixedmh h4.font-logo{ font-size:0; top:-50px}
    #headermenu ul.social-top{ opacity:1;}
    #headermenu.fixedmh ul.social-top{ height:0; opacity:0; width: 0;}

    .footlinks .icon-bg{ font-size:18px; height:50px; line-height:50px;}
    .footlinks .icon-mail{ padding-left:67px; background-size:51px 38px;}
    .footlinks .icon-phone{ font-size:16px; padding:5px 0 5px 66px; line-height:20px; background-size:50px 47px;}
    .footlinks .icon-demo{ padding-left:72px; background-size:56px 48px;}
    .footlinks .icon-quote{ padding-left:58px; background-size:50px 50px;}
}

/* Large only */
@media screen and (min-width: 64em) and (max-width: 74.9375em) {
    
}

/* custom gutter width */
@media only screen {
  .row.guthalf{ padding-left:0.7375rem; padding-right:0.7375rem;}
  .row.guthalf .columns, .row.guthalf .column {
    padding-left: 0.2rem; /* change the values to anything that you want */
    padding-right: 0.2rem;
  }
}