@charset "utf-8";

/* CSS Document */
@import url('https://fonts.googleapis.com/css?family=Roboto:400,500,700,900&display=swap');

html{ overflow-x:hidden;}

body {

margin:0;

font-family: 'Roboto', sans-serif, arial;

font-size:13px;

line-height:1.4;

background:#fff;

/*background-color:#e5e5e5;*/

-webkit-font-smoothing: antialiased;

-moz-osx-font-smoothing: grayscale;

-webkit-font-smoothing: antialiased;

margin: 0;

-webkit-text-size-adjust: 100%;

-ms-text-size-adjust: 100%;

text-size-adjust: 100%;

}

.bg-white{ background:#fff !important;}

*, *:before, *:after {

    -webkit-box-sizing: border-box;

    -moz-box-sizing: border-box;

    box-sizing: border-box;

}

aside{ position:relative;}

/* pageskin */



/*== HTML5 Elements

*=================================*/



article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {

display: block

}

/*== Typography Elements

*=================================*/

iframe {

display:block

}



a img {

border:0

}

:focus {

outline:0

}

time{ font-family:inherit; font-size:11px; color:#aaa; font-weight: 400;} time a{ color:#aaa;}

a {

color:#6c66e7;

text-decoration:none;

outline:0;

-webkit-transition:background-color .15s linear,color .15s linear;

-moz-transition:background-color .15s linear,color .15s linear;

-o-transition:background-color .15s linear,color .15s linear;

-ms-transition:background-color .15s linear,color .15s linear;

transition:background-color .15s linear,color .15s linear;

}



ul,ol {

list-style:none;

margin:0;

padding:0;

}

ul,ol,p,table,form,pre {

margin:0 0 0px

}

h1,h2,h3,h4,h5,h6 {

color:#263238;

margin:0 0 5px;

}

h1,h2,h3 {

line-height:1.25

}

h1 {

font-size:24px

}

h2 {

font-size:20px

}

h3 {

font-size:16px

}

h4 {

font-size:14px

}

h4,h5,h6 {

font-size:13px

}

blockquote {

margin-left:10px;

padding-left:40px;

color:#777;



}

abbr[title],acronym[title] {

border-bottom:1px dotted #666;

cursor: help;

}

/*== Code Elements

*=================================*/

pre,code,kbd,samp,var {

font-size: 12px;

}

pre {

padding:20px 20px;

nowhitespace:afterproperty;

line-height:20px;

white-space:pre-wrap;

white-space:-moz-pre-wrap;

white-space:-pre-wrap;

border:1px solid #DDD;

/* CSS-3 */

white-space:-o-pre-wrap;

/* Mozilla,since 1808080 */

word-wrap:break-word;

/* Opera 4-6 */;

/* IE 5.5+*/

}

/*== Table Elements

*=================================*/

table {

width:100%;

nowhitespace:afterproperty;

border-collapse:collapse;

border-spacing:0;

/* tables still need 'cellspacing="0"' in the markup */

}

th,td,caption {

padding:5px 10px

}

caption {

font-weight:bold

}

th,td {

border: 1px solid #CCC;

}

th{background:#E7E7E7;}

td{background:#FFF;}

tr:nth-of-type(odd) td, tr.odd td { background: #FBFBFB }

img, video {

    height: auto;

    max-width: 100%;

}

/*== Form Elements

*=================================*/

input {

    -webkit-appearance: none;

    border-radius: 0;

}

label,input,textarea,select,button,.btn {

font:13px sans-serif;

line-height:19px;

}

input,textarea,select,button,.btn {

display:inline-block;

padding:4px;

margin:0;

outline:none;

background-color:#FFF;

border:1px solid #D7D7D7;

-webkit-border-radius:3px;

border-radius:3px;

outline:none;

}

input[type="text"],input[type="password"],textarea {

-webkit-box-shadow:1px 1px 1px rgba(120,120,120,0.1) inset;

box-shadow:1px 1px 1px rgba(120,120,120,0.1) inset;

-webkit-transition:background .15s;

-moz-transition:background .15s;

-ms-transition:background .15s;

-o-transition:background .15s;

transition:background .15s;

}

input[type="text"],input[type="password"] {

height:19px;

}

input[type="submit"]{

cursor:pointer;

cursor:hand;

}

textarea {

overflow:auto

}

select {

height:29px;

}

input[type="checkbox"],input[type="radio"] {

vertical-align:text-top;

padding:0;

margin:1px 0 0;

border:0;

}

input[type="text"]:focus,input[type="password"]:focus,textarea:focus {

outline:0 none;

color:#333;

-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 12px rgba(104, 110, 230,0.7);

-moz-box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 12px rgba(104, 110, 230,0.7);

box-shadow:inset 0 1px 1px rgba(0,0,0,0.075),0 0 12px rgba(104, 110, 230,0.7);

}



button{ display:inline-block; text-align:center; background:#fff; border-radius:3px; padding:14px 35px;

font-family:inherit; font-size:15px; font-weight:500; color:#686ee6; border:0px; cursor:pointer; box-shadow: 0px 2px 15px 3px rgba(0,0,0,0.2); margin-bottom:10px;}

button a{color:#686ee6;}

.f-right{float: right !important; } .f-left{float: left !important; }

p {

    font-size: 15px;

    color: #212121;   

	margin-bottom:15px;

    line-height: 23px;

    font-weight: 400;

}

.mt20{ margin-top: 20px !important; } .mt30{ margin-top: 30px !important; } .mt15{ margin-top: 15px !important; }

.mb30{ margin-bottom: 30px !important; } 

.page-inner-title{ font-size: 20px;  margin-bottom: 15px; color: #305ec6;}

.page-inner-title1{ font-size: 30px;  margin-bottom: 15px; color: #305ec6; font-weight: 400;}

.page-inner-subtitle{ font-size: 16px;  margin-bottom: 15px; color: #000;}

.page-block{ margin-bottom: 4em;  }    

input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {

color: #aaa !important;

}

table tr td{ font-size: 15px; padding: 10px; }

hr{ margin: 20px 0; display: block; overflow: hidden; border: 0.5px dashed #dedcdc; } 



input:-moz-placeholder, textarea:-moz-placeholder { /* Firefox 18- */

color: #aaa !important;  

} 



input:-ms-input-placeholder, textarea:-ms-input-placeholder {  

color: #aaa !important;  

}

.plr30{ padding: 30px 0 !important; }

.mt100{ margin-top:100px;} .mb10{ margin-bottom:10px !important;}

/* pages */

.title{ font-family: inherit; font-size: 19px; font-weight: 800; color: #2547f5; text-transform: uppercase; margin-bottom: 40px;}

.title span{ display: inline-block; padding-bottom: 10px; position: relative; }

.title span:after{ position: absolute; content:""; left: 0px; right: 0px; bottom: 0px; border-bottom: 4px solid #ddd; }

.title span:before{width: 0; position: absolute; right: 45%;  bottom: -4px; content: ""; height: 0; border-left: 10px solid transparent;

    border-right: 10px solid transparent; border-top: 10px solid #2547f5; z-index: 1;}

.service-title{font-family: inherit; font-size: 17px; font-weight: 400; color: #2547f5; margin-bottom: 15px;}

.box-shadow{ padding: 15px;  box-shadow: 0 2px 8px rgba(0,0,0,.3); background: #fff; }

.read-more-btn{    border-radius: 2px; border: 1px solid #2547f5; padding: 7px 10px; font-size: 13px; font-family: inherit; font-weight: 600; text-transform: uppercase;

    width: 140px; display: inline-block; text-align: center; color: #2547f5;}

.read-more-btn i{ display: inline-block; width: 17px; height: 12px; background: url(../img/right-arrow.png) no-repeat; background-size: 100%; vertical-align: middle; }

.service-box{ padding:30px 0; }

.s-4 .box-shadow{ margin-bottom: 20px; }

.intro-column{ background-repeat:no-repeat; background-size:cover; background-position:top center;}

.bg-gray{ background: #efefef; }

.t-align-center{text-align: center;}

.clients-box{ padding: 30px 0; overflow: hidden;}

.clients-box a{ float: left;  margin: 0px 15px 20px; }

.clients-box a img{ height: 50px; }

.s-img { width: 100%; height: auto; padding-top: 70%; overflow: hidden; position: relative; display: block; margin-bottom: 10px; }

.s-img img{ width: 100%; top: 0px; height: auto; position: absolute; }

.r-user-img {

    width: 100px;

    height: 100px;

    border-radius: 50%;

    margin-bottom: 20px;

    display: inline-block;

    overflow: hidden;

}

.r-user-img img {

    width: 100%;

}

.c-no{ float:right; color: #666; font-size:13px; font-family:inherit; margin-top:6px; position:relative; padding-left:40px; font-weight: 500;}



.c-no:after{ width:14px; height:14px; background: url(../img/telephone.png) no-repeat; background-size:100%; opacity:0.6; position:absolute; left:20px; top:4px; content:""}

.site-top-header{ background: #f0f0f2; height: 32px; width: 100%; }

.top-menu{float: right;}

.top-menu a{ font-family: inherit; font-weight: 500; font-size: 11px; text-transform: uppercase; line-height: 32px; padding: 0 8px; display: inline-block; color: #000;}

.page-header{ height:74px;  width:100%; background:#fff}

.navbar{padding:0px 15px 0 15px; margin:0px;}

.page-header-inner{ max-width:1100px; margin:auto; display:table; width: 100%; padding:0 15px;}

.paul-logo{ float:left; background:url(../img/acmc-logo.png); width:160px; height:60px; background-size:100%; margin-right:20px; margin-top: 10px;}

.main-nav{ float:left; margin:0px 15px 0 50px ; padding:0px;}

.main-nav ul{ padding:0px; margin:0px;}

.main-nav ul li{ float:left; padding:0px; position:relative; list-style: none;}

.main-nav ul li a{ font-family:inherit; font-size:14px; font-weight:400;  display:block; margin: 0px ; color:rgba(0,0,0,.54); padding: 27px 25px;}

.main-nav ul li a:hover{ color:#2c5ecf; border-bottom: 2px solid #2c5ecf;}

.main-nav ul li a.active{color:#2c5ecf; border-bottom: 2px solid #2c5ecf; font-weight: 500;}

.down-arrow{ position:relative;}

.main-nav ul li a.active.down-arrow:after{border-top: 5px solid #2c5ecf; }

.down-arrow:after{width: 0; position:absolute; right:8px; top:35px; content:""; 

  height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent;  

  border-top: 5px solid rgba(0,0,0,.54); }



.main-nav li:hover .navmenu-drop{ display:block;}

.main-nav .navmenu-drop{ position: absolute; width: 260px; padding: 0px 0; background: #fff; top: 74px; box-shadow: 0px 4px 7px rgba(0,0,0,0.4); border: 1px solid #efefef; display:none;     z-index: 100;}  

.main-nav .navmenu-drop li{ padding:0px; display:block; float:none; border-bottom:1px solid #f2f2f2;}

.main-nav .navmenu-drop li:last-child{ border-bottom:0px;}

.main-nav .navmenu-drop li a{ color:rgba(0,0,0,.54) ; margin:0px; padding: 10px 15px; font-size: 15px; font-weight: 400;}

.main-nav .navmenu-drop li a:hover{ color:#2c5ecf; border:0px;}



.intro .main-nav ul li.active a { border-bottom:2px solid #ec0000;}



.yes-interest button {background:#fc8226 !important; color: #fff !important;  margin-top: 20px; font-size: 18px;  font-weight: 600;}



.container{ width:100%; max-width:1100px; display:table; margin:0 auto; padding:0 15px; position:relative;}

.row{ padding:0px; }





.intro-title{ font-family:inherit; font-size:40px; font-weight:300; color:#fff; margin-bottom:15px;}

.intro-p{ font-size:15px; font-family:inherit; color:#fff; margin-bottom:30px; font-weight:300;}

.column-left{ margin:70px auto; overflow:hidden; width: 60%; text-align:center;}

.test-who .m-col-2{ padding: 30px 50px !important; }

.t-color-w .title, .t-color-w p{ color: #fff !important }

.page-header-visual{ }

.page-banner-title{font-size:50px; font-family:inherit; color:#fff; font-weight: 300; padding: 100px 0 100px; text-align: center;}

.page-banner-default{font-size:50px; font-family:inherit; color:#fff; font-weight: 300; padding: 40px 0 40px; text-align: center;}

.page-banner-subtitle{font-size: 18px;

    color: #fff;

    font-weight: 600;

    margin: -20px 0px 15px 0;

    display: block;}

.p-row{display: -webkit-flex;

    display: flex;

    -webkit-flex: 0 1 auto;

    flex: 0 1 auto;

    -webkit-flex-flow: row wrap;

    flex-flow: row wrap;

    margin: -8px;}

  .p-col-m-6 {

    -webkit-flex-basis: 50%;

    flex-basis: 50%;

    max-width: 50%;

} 

.p-col-m-6-more-space{ padding: 15px } 



.m-row{ display: -webkit-flex; display: flex; -webkit-flex: 0 1 auto; flex: 0 1 auto;

 -webkit-flex-flow: row wrap; flex-flow: row wrap;}

.m-col-1{ -webkit-flex-basis: 100%; flex-basis: 100%; max-width: 100%; padding:15px;}

.m-col-2{ -webkit-flex-basis: 50%; flex-basis: 50%; max-width: 50%; padding:15px;}

.m-col-3{ -webkit-flex-basis: 33.33%; flex-basis: 33.33%; max-width: 33.33%; padding:15px;}

.m-col-5{ -webkit-flex-basis: 20%; flex-basis: 20%; max-width: 20%; padding:15px;}

.m-col-6{ -webkit-flex-basis: 16.66%; flex-basis: 16.66%; max-width: 16.66%; padding:10px;}

.m-col-4{ -webkit-flex-basis: 25%; flex-basis: 25%; max-width: 25%; padding:10px;}

.m-mid-2{ float:left; width:50%;}

.m-mid-3{ float:left; width:33.33%; padding-left:30px;}



.down-arrow1 {

    position: relative;

    padding-right: 15px !important;

}

.down-arrow1:after {

    width: 0;

    position: absolute;

    right: -3px;

    top: 6px;

    content: "";

    height: 0;

    border-left: 5px solid transparent;

    border-right: 5px solid transparent;

    border-top: 5px solid #333;

}

.mobile-submenu{ margin: -1px 0px 0px; padding:0px 0 10px 35px; background:#fff;border-bottom: 1px solid #d6d6d6; display:none;}

.mobile-submenu a{  padding: 8px 5px !important;

    font-family: inherit;

    font-size: 12px !important;

    text-transform: uppercase;

    color: #666666 !important;

    font-weight: 400;

    display: block;

    line-height: initial !important;

    height: auto !important;}

.mobile-submenu a:hover{ background:#f2f2f2;}

/* footer */

footer{ background:#0078a0; position:relative; overflow:hidden; color: #fff;}

footer .row{ padding-top:0px !important;}

footer{ padding:20px 0;}

.copyright{ float:left;font-family:inherit; font-size:13px; color:#fff; font-weight:400;}

.quicklink{ float:right; padding:0px; margin:0px;}

.quicklink a{ float:left; font-family:inherit; font-size:12px; color:#fff; font-weight:400; padding:0 8px}

.quicklink a:hover{ text-decoration:underline; color:#686ee6;}

.social{ text-align:center; display:block; margin-top: 10px;}

.social a{  margin:0px 10px 0 0px; float:left;}



.social a i{ display:inline-block; vertical-align:middle; width:20px; height:20px; background-size:100%;}

.fb{ background:url(../img/icons/fb_icon_w.png) no-repeat;}

.tw{ background:url(../img/icons/tw_icon_w.png) no-repeat;}

.gp{ background:url(../img/icons/gp_icon_w.png) no-repeat;}

.pin{ background:url(../img/icons/pin_icon_w.png) no-repeat;}

.in{ background:url(../img/icons/in_icon_w.png) no-repeat;}

.tm{ background:url(../img/icons/tum_icon_w.png) no-repeat;}

.fixed-header {

  position: fixed; background:#fff; z-index:10; padding-bottom:0px; height: 74px;

  top:0; left:0;     -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 5px rgba(0, 0, 0, 0.075);

    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 5px rgba(0, 0, 0, 0.075);

  width: 100%; 

}

.product-price{font-size: 16px;  font-weight: 400; margin-bottom: 15px;}

.product-price a{ text-decoration: underline; }

.product-price span{  color:#212121; margin-right: 10px; }

.product-price span em{ color: #000; font-style: normal; font-size: 20px; font-weight: 500; }

.quick-link-title{ color:#fff; font-family:inherit; font-size:16px; font-weight:400; margin-bottom:10px;}

.footer-menu{ margin-bottom:10px; padding:0px;}

.footer-menu li{ display:block; padding:4px 0;}

.footer-menu li a{ display: inline-block; font-family:inherit; font-size:14px; color:#bed9e2; padding:0; font-weight:400}

.footer-menu li a:hover{text-decoration:underline;}

/* mobile menu */



.nav-mob-toggle {

    -webkit-transition: transform 0.4s;

    transition: transform 0.4s;

    display: block;

    height: 42px;

    position: relative;

    width: 42px;

    z-index: 10;

	float:right;

    margin-top: 15px;

}

.nav-mob-toggle span {

    -webkit-transition: .4s;

    transition: .4s;

    background-color: #333;

    display: block;

    height: 3px;

    left: 6px;

    margin-top: -1px;

    position: absolute;

    top: 50%;

    width: 20px;

}

.nav-mob-toggle span:first-child {

    -webkit-transform: translate(0, -9px);

    transform: translate(0, -9px);

    width: 30px;

}

.nav-mob-toggle span:last-child {

    -webkit-transform: translate(0, 9px);

    transform: translate(0, 9px);

    width: 25px;

}



.main-menu-close {

    position: absolute;

    top: 20px;

    right: 25px;

    width: 16px;

    height: 16px;

    background: url(../img/close.png) no-repeat;

    background-size: 16px;

    cursor: pointer;

}

.mobile-menu{

	margin-top: 0;    

    position: absolute;

    right: 0;

    top: 0;

	

}

.main-menu{         

    padding-top: 50px;

	position:fixed; 

    height: 100%;

	right:0px;	

	min-width: 290px;

    background: #fff;

    text-align: left;

	z-index:100;	

    -ms-transition: transform 0.4s ease;

    -webkit-transition: transform 0.4s ease;

    -moz-transition: transform 0.4s ease;

    transition: transform 0.4s ease;

    -ms-transform: translateX(100%);

    -webkit-transform: translateX(50%);

    -moz-transform: translateX(100%);

    transform: translateX(100%);

}

.nav-active-menu-container {

    -ms-transform: translate(0);

    -webkit-transform: translate(0);

    -moz-transform: translate(0);

    transform: translate(0);

}

/*.inactive-body { overflow:hidden;

   

}*/

.inactive-body .content{ background: rgba(0, 0, 0, 0.7);

	    position: fixed;

    left: 0px;

    right: 0px;

    top: 0px;

    bottom: 0px;

	z-index:11;	

	transition: 200ms background;}





.main-menu ul{ padding:0px; margin:0px;}

.main-menu ul li{ padding:0px; display:block;  border-bottom: 1px solid #ececec;}

.main-menu ul li a{ padding-left:30px; line-height: 44px; height: 44px; color:#222; display:block; text-transform: uppercase; font-size: 13px; font-weight: 600;}

.main-menu ul li a:hover{ background:#f3f3f3; color:#222;}

#app-cover {

    position: fixed;

    background: transparent;

    pointer-events: none;

    top: 0;

    bottom: 0;

    left: 0;

    right: 0;

    z-index: 9;

    transition: 300ms background;

}

.menu-open #app-cover {

    pointer-events: all;

    background: rgba(0, 0, 0, 0.85);

}

body.menu-open {

    overflow: hidden;

}

.f-right{ float:right !important;}



.howitwork-img img{ position:relative; left:40px;}

/* mobile menu end */

/* testimonial slider */

.test-div{ padding:10px 15px;}

.test-div p{ width:80%; }

 .jssorl-004-double-tail-spin img {

	animation-name: jssorl-004-double-tail-spin;

	animation-duration: 1.2s;

	animation-iteration-count: infinite;

	animation-timing-function: linear;

}



@keyframes jssorl-004-double-tail-spin {

	from {

		transform: rotate(0deg);

	}



	to {

		transform: rotate(360deg);

	}

}

.page-ul{ margin:0PX 0 20px; padding: 0px 0 0 35px; }

.page-ul li{ font-size: 16px; font-weight: 400; color: #212121; padding: 4px 0; }

.flex-box{ display: -webkit-flex; display: flex; -webkit-flex: 0 1 auto; flex: 0 1 auto; -webkit-flex-flow: row wrap;

    flex-flow: row wrap; margin: -8px;}

.flex-column{ -webkit-flex-basis: 33.33%; flex-basis: 33.33%; max-width: 33.33%; padding: 15px;}

.flex-column a img{ width:100%;}

.flex-column a h2{ background:transparent; font-family:inherit; font-size:18px; font-weight:700; color:#00adef;

padding:0px; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%);

-moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); text-align:center;}

.flex-column a:hover h2{ color:#fff;}

.ttxt-column{text-align: center;

    font-size: 32px;

    font-family: 'Open Sans', sans-serif;

    width: 80%;

    border-bottom: 1px solid #229a4a;

    line-height: 0.1em;

    margin: 10px auto 30px;}    

.ttxt-column h2{ background:#fff; padding:0 10px; color:#229a4a;  font-size: 24px;  line-height: 26px; margin-bottom: -10px;}   

.shadow-bg{ position:absolute; left:0px; right:0px; top:0px; bottom:0px; background:rgba(0,0,0,.7)}

.column-bg{ background:#fafafa; box-shadow: 0 0 5px rgba(0,0,0,0.1); position:relative;}

.img-ovelray{ opacity:0; position:absolute; right:0px; left:0px; top:0px; bottom:0px; background:rgba(0,0,0,.8); transition: all .3s ease-in-out;}

.overlay-txt{ color:#fff; font-size:18px; text-align:center; text-transform:uppercase; font-weight:700; position:absolute; top:50%; left:50%;

    transform: translate(-50%,-50%);

    -webkit-transform: translate(-50%,-50%);

    -moz-transform: translate(-50%,-50%);

    -ms-transform: translate(-50%,-50%);

    -o-transform: translate(-50%,-50%);}    

.column-bg a:hover .img-ovelray{  opacity:1; }

.column-bg:hover{ background:#229a4a}

.flex-column a:hover .column-bg{ background:#333;}

li {

    list-style-image: url(../img/li_06.png);

}

.row-xs{display: -webkit-flex; display: flex; -webkit-flex: 0 1 auto; flex: 0 1 auto; -webkit-flex-flow: row wrap;

    flex-flow: row wrap; margin: -10px;}

.col-xs-6{-webkit-flex-basis: 50%; flex-basis: 50%; max-width: 50%; padding: 10px;}

.solutionBlock {

    border: 1px solid #d9d9d9;

    background: url(../img/stript-block.png) repeat;   

    width: 100%;

    display: table;

}

.solutionBlock img {

    float: left;

    padding-right: 20px;    

}

.solutionBlock img{ width: 170px; }

.solutionBlock h4 {

    -moz-box-sizing: border-box;

    -webkit-box-sizing: border-box;

    box-sizing: border-box;

    color: #333; font-weight: 800;

    font-size: 20px;

    padding-left: 20px;

    padding-top: 30px;

    padding-bottom: 25px !important;

    text-transform: uppercase;

}

.solutionBlock span{ overflow: hidden; }

.google-map{ position: relative; overflow: hidden; height: 350px; }

.e-form label{ font-size: 14px; font-weight: 400; color: #7a7979; margin-bottom: 5px; display: block;  font-family: inherit;}

.e-form input{ width: 100%; line-height: 40px; height: 40px; font-size: 14px; font-weight: 400; color: #333;}

.e-form textarea{ width: 100% ;font-size: 14px; font-weight: 400; color: #333; padding: 10px;}

.submit button{background: #6c66e7 !important;

    color: #fff !important;

    margin-top: 20px;

    font-size: 18px;

    font-weight: 600;}



/* index */

.main-index{ position: relative;margin: auto; display: inline-block; text-align: center; padding: 150px 0 0 0;  }

.nav-home{ position: absolute; top: 30px; left: 50%; }

.nav-about{position: absolute; top: 190px; left: -10%;}

.nav-product{position: absolute; top: 80px; left: 15%;}

.nav-quality{position: absolute; top: 80px; right: 10%;}

.nav-contact{position: absolute; bottom: 160px; right: -10%;}

.home-icon{ background: url(../img/home.png) no-repeat; }

.about-icon{ background: url(../img/about-us.png) no-repeat; }

.product-icon{ background: url(../img/product.png) no-repeat; }

.quality-icon{ background: url(../img/quality.png) no-repeat; }

.contact-icon{ background: url(../img/contact.png) no-repeat; }

.index-menu a i{ width: 80px; height: 80px; background-size:100%; display: inline-block; opacity: .8  }

.index-menu a span{ display: block; text-align: center; margin-top: -10px; font-weight: 700; font-family: inherit; font-size: 13px; color: #333; text-transform: uppercase; }

.index-menu a:hover span{ color: #0078a0; }

.big-text{ font-size: 30px; text-transform: uppercase; padding: 30px 0 50px ; text-align: center; color: #666;}



.index-menu a.nav-home:hover .home-icon{ background: url(../img/home-h.png) no-repeat; background-size: 100%; opacity: 1  }

.index-menu a.nav-about:hover .about-icon{ background: url(../img/about-us-h.png) no-repeat; background-size: 100%; opacity: 1  }

.index-menu a.nav-product:hover .product-icon{ background: url(../img/product-h.png) no-repeat; background-size: 100%; opacity: 1  }

.index-menu a.nav-quality:hover .quality-icon{ background: url(../img/quality-h.png) no-repeat; background-size: 100%; opacity: 1  }

.index-menu a.nav-contact:hover .contact-icon{ background: url(../img/contact-h.png) no-repeat; background-size: 100%; opacity: 1  }

@media (max-width: 930px){
  .main-nav{ display: none; }   .m-col-3{ -webkit-flex-basis: 100%; flex-basis: 100%;  max-width: 100%;  }
  .m-col-4{ -webkit-flex-basis: 50%;  flex-basis: 50%;  max-width: 50%;  } .copyright{ text-align: center; }
  .quicklink a{ float: none; }  .quicklink{ text-align: center; width: 100%; margin: 15px 0 0 0; }
}

@media (max-width: 479px){
 .m-col-4{ -webkit-flex-basis: 100%;  flex-basis: 100%;  max-width: 100%;  }
 .m-col-2 { -webkit-flex-basis: 100%; flex-basis: 100%;  max-width: 100%;} .product-img img{ width: 100%; }
}