/* =WordPress Core
-------------------------------------------------------------- */
.alignnone {
    margin: 5px 20px 20px 0;
}

.aligncenter,
div.aligncenter {
    display: block;
    margin: 5px auto 5px auto;
}

.alignright {
    float:right;
    margin: 5px 0 20px 20px;
}

.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

a img.alignright {
    float: right;
    margin: 5px 0 20px 20px;
}

a img.alignnone {
    margin: 5px 20px 20px 0;
}

a img.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

a img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto
}

.wp-caption {
    background: #fff;
    border: 0px solid #f0f0f0;
    max-width: 100%; /* Image does not overflow the content area */
    width: 100% !important;
    padding: 5px 3px 10px;
    text-align: center;
}

.wp-caption.alignnone {
    margin: 5px 20px 20px 0;
}

.wp-caption.alignleft {
    margin: 5px 20px 20px 0;
}

.wp-caption.alignright {
    margin: 5px 0 20px 20px;
}

.wp-caption img {
    border: 0 none;
    height: auto;
    margin: 0;
    max-width: 98.5%;
    width: 98.5% !important;
    padding: 0;
    width: auto;
}

.wp-caption p.wp-caption-text {
    font-size: 11px;
    line-height: 17px;
    margin: 0;
    padding: 0 4px 5px;
}

/* Text meant only for screen readers. */
.screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	position: absolute !important;
	height: 1px;
	width: 1px;
	overflow: hidden;
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	color: #21759b;
	display: block;
	font-size: 14px;
	font-size: 0.875rem;
	font-weight: bold;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000; /* Above WP toolbar. */
}

/* 5 Columns */

.col-xs-15,
.col-sm-15,
.col-md-15,
.col-lg-15 {
    position: relative;
    min-height: 1px;
    padding-right: 10px;
    padding-left: 10px;
}

.col-xs-15 {
    width: 20%;
    float: left;
}
@media (min-width: 768px) {
    .col-sm-15 {
        width: 20%;
        float: left;
    }
}
@media (min-width: 992px) {
    .col-md-15 {
        width: 20%;
        float: left;
    }
}
@media (min-width: 1200px) {
    .col-lg-15 {
        width: 20%;
        float: left;
    }
}

/* FONTS FAMILY GROUPPING */


h1,h2,h3,h4,h5, #tm li a{
	font-family: 'Montserrat', sans-serif;
}


body{
  background: #fff;
}

a{
    text-decoration: none
}

.text-primary{
	color: #251F87 !important;
}

.wds-pagination{
  display: block;
  margin: 45px 0;
}

.wds-pagination a, .wds-pagination .current{
  display: inline-block;
  padding: 8px 15px;
  border: 1px solid #251F87;
  color: #251F87;
  margin-left:5px;
  border-radius: 3px;
}

.wds-pagination .label{
  margin-right: 15px;
}

.wds-pagination .current{
  background: #251F87;
  color: #fff;
  font-weight: 700;
}


/* HEADER START */

#h{
	width: 300px;
	height: 100%;
	/*background: #fff url(images/pageheader.jpg) no-repeat bottom center;*/
  background-color: #fff;
	position:fixed;
	z-index:99;
  padding: 25px;
  top: 0;
  left:0;
  box-shadow: 0 0 10px rgba(0,0,0,0.05);
}

#w{
  min-height: 100%;
  padding:25px;
  padding-left:315px;  
}

.page-template-front-page #w,.page-template-front-page-2 #w{
  padding: 0 0 0 300px;
}

.logo{
  height: 85px;
  display: block;
}

/*
.page-template-front-page .logo{
  display: none;
}
*/

#tm{
	margin: 0;
	padding: 0;
}

#tm li{
	display: block;
	list-style-type: none;
}

#tm li a{
 display: block;
 color: #5a5e61;
 font-size: 18px;
 font-weight: 500;
 padding: 15px 25px;
 border-bottom: 1px dotted rgba(0,0,0,0.1);
 transition: .3s all ease;
}

#tm li:last-child a{
 border: none;
}

#topHead{
  position: absolute;
  top:0;
  left:0;
  padding: 8px 0;
  width: 100%;
  z-index:2;
  border-bottom: 1px solid rgba(0,0,0,0.1);
}

#topHead a{
  font-size: 14px;
  color: #333;
}

.logotext{
  text-align: center;
  font-size: 18px;
  font-weight: 600;
  margin-top: 15px;
  color: #333;
}

/*
.page-template-front-page #tm > li a{
  color: rgba(255,255,255,0.8);
}

.page-template-front-page #tm > li .sub-menu a{
  color: #888;
}

.page-template-front-page #tm > li .sub-menu li{
  margin: 0;
}

.page-template-front-page #tm > li .sub-menu a:hover{

  color: #333;
}
*/

#tm li a:hover,#tm li.current_page_item a:hover{
	color: #fff;
  border-radius: 5px;
  background: #242052;
}

#tm li.current_page_item a{
	color: #141042;
}

/*
.page-template-front-page #tm > li > a:hover,.page-template-front-page #tm > li.current_page_item > a{
	color: #fff;
}*/

#tm li.menu-item-has-children{
  position: relative;
}

#tm li.menu-item-has-children a{
  padding: 38px 0;
}

#tm li.menu-item-has-children::before{
  position: absolute;
  content: '';
  width: 0;
  height: 0;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  border-bottom: 15px solid #fff;
  bottom: -15px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
  display:none;
}

#tm li ul.sub-menu{
  width: 300px;
  position: absolute;
  background: #fff;
  padding: 15px;
  box-shadow: 0 3px 25px rgba(0,0,0,0.2);
  border-radius: 8px;
  top: 39px;
  display: none;
  overflow:hidden;
}

#tm li:hover ul.sub-menu{
  display: block;
}

#tm li ul.sub-menu li{
  display: block;
}

#tm li ul.sub-menu li a{
  display: block;
  padding: 8px;
  line-height: 1.2;
  text-transform: none;
  font-weight:400;
  font-size: 15px;
}

#loginbut {
    display: inline-block;
    border: 1px solid #1E1E9A;
    border-top: 1px solid #3939A6;
    border-radius: 8px;
    padding: 10px 30px;
    color: #fff;
    background: #1E1E9A;
    font-weight: 600;
    letter-spacing: 0px;
}


#loginbut .bi{
    margin-right:15px;
}


#loginbut img{
    width: 32px;
    height: auto;
    margin-right: 15px;
    border-radius: 100%;
}


.page-template-front-page #tm li.loginbut a {
    border-color: #fff;
}

.page-template-front-page #tm li.loginbut a:hover {
    background-color: #fff;
    color: #333;
}

.pageHeader{
	padding: 30px 25px 15px 25px;
	/*background: #241f86 url('images/pageheader.jpg') no-repeat right bottom;
	background-size: cover;*/
	position: relative;
  text-align: left;
}
/*
.pageHeader::before{
	content: '';
	position: absolute;
	top:0;
	left:0;
	width: 100%;
	height: 100%;
	background: rgb(70,179,222);
	background: linear-gradient(135deg, rgba(220,220,220,1) 25%, rgba(220,220,220,0.1) 100%);
	z-index:1;
}
*/
.pageHeader h1, .pageHeader p, .productBanner h1, .productBanner p{
	color: #1A1749;
	position: relative;
	z-index: 2;
}

.pageHeader h1{
	font-size: 38px;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: 0;
}

.pageHeader p{
	font-size: 26px;
	line-height: 34px;
}

#homeBlock .row{
  min-height: 100vh;
}

#homeBlock .innerrow{
  height: 50%;
  display: block;
}

.content-single{
	padding: 115px 0 85px 0;
}

.content-single h5{
	font-weight: 300;
	letter-spacing: 2px;
	color: #251F87;
}

.content-single h2{
	font-weight: 600;
	font-size: 38px;
	line-height: 53px;
	letter-spacing: -2px;
	color: #251F87;
}

.content-single p{
	font-size: 16px;
	line-height: 24px;
	color: #868686;
}

.checkList{
  padding: 0;
}

.checkList li{
  list-style-type: none;
  border-bottom: 1px solid #DCDCDE;
  padding: 10px 0;
  color: #868686;
  font-size: 16px;
  line-height: 24px;
  padding-left: 30px;
  background: url('images/icons/check-big.png') no-repeat left center;
  background-size: 21px 21px;
}

/* NEWS */

#newsList h5.card-title{
  font-size: 20px;
  line-height: 30px;
  color: #000;
  letter-spacing: 0;
  font-weight: 700;
}

#newsList p.card-text{
  font-size: 14px;
  line-height: 21px;
  color: #000;
  letter-spacing: 0;
  font-weight: 400;
}

#newsList .card a{
  font-size: 20px;
  line-height: 30px;
  color: #251F87;
  letter-spacing: 0;
  font-weight: 700;
}

.content-single .carousel-caption{
  width: 100%;
  left: 0;
  bottom: 0;
  padding: 45px;
  padding-top: 220px;
  background: rgba(61,48,186,0.7);
  background: linear-gradient(180deg, rgba(61,48,186,0) 0%, rgba(37,31,135,0.9) 100%);
}

.content-single .carousel-caption h5{
  font-weight: 700;
  font-size: 28px;
  line-height: 1.3;
  color: #fff;
}

.pageHeader.singlePost{
  padding: 100px 0 45px 0;
}

.pageHeader.singlePage{
  padding: 180px 0 80px 0;
}

.pageHeader.singlePage h3{
  color: #fff;
  font-size: 33.16px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -1px;
}

.pageHeader .post-category{
  display: inline-block;
  text-transform: uppercase;
  letter-spacing: 2.5px;
  font-size: 14px;
  line-height: 21px;
  color: #fff;
  margin-bottom: 15px;
  background: rgb(61,48,186);
  background: linear-gradient(125deg, rgba(61,48,186,0.8267682072829132) 16%, rgba(50,202,228,1) 100%);
  padding: 10px 30px;
  border-radius: 3px;
}

.pageHeader .postmeta{
  color: #fff;
  padding:0;
  margin-top: 15px;
}

.pageHeader .postmeta li{
  list-style-type: none;
  display: inline-block;
  margin-right: 15px;
  font-size: 14px;
}

.pageHeader .postmeta li i{
  font-size: 16px;
  color: #32CAE4;
}

.pageHeader .titleWrapper{
  padding: 30px 0 0 30px;
  border-left: 3px solid rgba(255,255,255,0.17);
  position: relative;
  z-index:2;
}

.content-single .carousel-caption p{
  line-height: 1.3;
  color: #fff;
}

.carousel-control-next, .carousel-control-prev{
  height: 60px;
  top: 50%;
  transform: translateY(-50%);
}

.carousel-control-next{
  right: -30px;
}

.carousel-control-prev{
  left: -30px;
}

.postContent{
  color: #868686;
  font-size: 16px;
  line-height: 24px;
}

.postContent h3{
  color: #251F87;
  font-weight: 700;
}

.postContent iframe{
  width: 100%;
  height: auto;
  min-height: 443px;
}

.shareaholic-canvas{
  position: relative;
  margin-top: 15px;
  margin-bottom: 45px;
}

.shareaholic-share-buttons-animation-wrapper {
  transform: scale(1.7,1.7);
  position: absolute !important;
  left: 103px;
}

.commentForm .comment-reply-title{
  font-weight: 700;
  font-size: 44.2px;
  line-height: 53px;
  letter-spacing: -2px;
  color: #3D4160;
}

.commentForm label{
  display: block;
  font-weight: 600;
  color: #3D4160;
  font-size: 15px;
  line-height: 21px;
}

.commentForm input[type="text"], .commentForm input[type="email"], .commentForm textarea{
  display: block;
  border: 1px solid #DCDCDE;
  border-radius: 0;
  width: 100%;
  background: #FCFCFD;
  padding: 10px;
}

.commentForm .comment-form-cookies-consent label{
  display: inline-block;
  margin-left:10px;
}

.commentForm input[type="submit"]{
  background: #251F87;
  border-color: #251F87;
  color: #fff;
  border-radius: 3px;
  padding: 8px 30px;
}

.content-single h5.author-post__title{
  font-weight: 700;
  font-size: 18.66px;
  line-height: 24.26px;
  letter-spacing: 0;
}

#search-form{
  padding: 32px;
  background: rgb(37,31,135);
  background: linear-gradient(125deg, rgba(37,31,135,1) 0%, rgba(50,202,228,1) 100%);
  -webkit-border-top-left-radius: 5px;
  -webkit-border-top-right-radius: 5px;
  -moz-border-radius-topleft: 5px;
  -moz-border-radius-topright: 5px;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}

#searchsubmit{
  font-weight: 700;
  background-color: #251F87;
  border-color:#251F87;
}

.sidebarPost{
  padding: 32px;
  -webkit-border-bottom-right-radius: 5px;
  -webkit-border-bottom-left-radius: 5px;
  -moz-border-radius-bottomright: 5px;
  -moz-border-radius-bottomleft: 5px;
  border-bottom-right-radius: 5px;
  border-bottom-left-radius: 5px;
  box-shadow: 0 30px 60px 0 rgba(0,0,0,0.1);
}

.sidebarPost h5{
  font-size: 15px;
  font-weight: 600;
  line-height: 21px;
  letter-spacing:0;
  color: #868686;
  margin-bottom: 15px;
}

.sidebarPost .postDate{
  font-size: 13px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing:0;
  color: #868686;
}

.greybg{
  background: #F4F6F7;
  padding: 48px;
  border-radius: 5px;
}

.productList2{
  padding: 94.5px;
  padding-right:0;
}

.productList2 h3{
   font-size: 24.88px;
   line-height: 1.2;
   color: #3D4160;
}

.productList2 p{
   font-size: 16px;
   line-height: 1.2;
   color: #868686;
}

/* FOOTER */

#fw{
	background: transparent;
  background-size: cover;
	padding-left: 300px;
  color: #fff;
}

.cpy, .folLabel{
	line-height: 21px;
  font-size: 12px;
}

.footsoc li{
	display: inline-block;
	margin-left: 18px;
	line-height: 21px;
	vertical-align: middle;
}

.footsoc li a{
	color: #fff;
	font-size: 21px;
}

#footerWidgets ul{
	margin:0;
	padding:0;
}

#footerWidgets li{
	list-style-type: none;
	margin-bottom: 8px;
}

#footerWidgets li a{
	color: #fff;
}

#fw p, #fw a{
  line-height: 1.6;
  color: ccc;
  font-size: 18px;
  
}

#footerWidgets h3.widget-title{
	font-weight: 600;
	font-size: 20px;
	line-height: 24px;
  padding-bottom: 15px;
  text-transform: uppercase;
	color: #fff;
	margin-bottom: 21px;
  position: relative;
}

#footerWidgets h3.widget-title::before{
  position: absolute;
  bottom: 0;
  left:0;
  content: '';
  width: 75px;
  height: 2px;
  background: #fff;
  opacity: 0.3;
}

#footerWidgets .mostleft h3.widget-title{
	font-weight: 800;
	font-size: 35px;
	line-height: 52.5px;
	text-transform: uppercase;
	margin-top: -7px;
	margin-bottom: 5px;
}

#footerWidgets #mailpoet_form_1 form.mailpoet_form{
	padding:0;
}

#footerWidgets .mailpoet_form .mailpoet_spacer{
	display: none;
}

#footerWidgets .mailpoet_form input, #footerWidgets .wpforms-field input{
	border: 1px solid #fff;
	border-radius: 10px;
	background-color: transparent;
	color: #fff;
  padding: 15px;
  margin: 0 auto 0 0;
  font-size: 15px;
  line-height: 1.5;
  height: auto;
}

#footerWidgets .mailpoet_form input::placeholder, #footerWidgets .wpforms-field input::placeholder{
	color: #fff;
}

#footerWidgets .mailpoet_form input[type="submit"], #footerWidgets .wpforms-submit{
	background-color: #fff;
	color: #A67E30;
	font-weight: 400;
  width: 100%;
  padding: 15px;
  margin: 11px 0 0 0;
  font-size: 15px;
  line-height: 1.5;
  height: auto;
  border-color: transparent;
  border-radius: 10px;
}

#footerWidgets .wpforms-container .wpforms-submit-container, #footerWidgets .wpforms-container .wpforms-field{
  padding: 0;
}


#nav-icon1,#closeb{
  width: 26px;
  height: 26px;
  float: right;
  margin-left: 25px;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: transform .5s ease-in-out;
  -moz-transition: transform .5s ease-in-out;
  -o-transition: transform .5s ease-in-out;
  transition: transform .5s ease-in-out;
  cursor: pointer;
  z-index: 100;
  display: none;
}


#nav-icon1 span,#closeb span{
  display: block;
  position: absolute;
  height: 1px;
  width: 100%;
  background: #555;
  opacity: 1;
  right: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}

#closeb{
  position: relative;
  float: right;
  margin: 25px 25px 30px 0;
}

#nav-icon1 span:nth-child(1),#closeb span:nth-child(1) {
  top: 0px;
}

#nav-icon1 span:nth-child(2),#closeb span:nth-child(2) {
  top: 9px;
  width: 100%;
}

#nav-icon1 span:nth-child(3),#closeb span:nth-child(3) {
  top: 18px;
  width: 100%;
}

#closeb span:nth-child(2),#closeb span:nth-child(3){
width: 100%;
}

#closeb.open span:nth-child(1) {
  top: 8px;
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

#closeb.open span:nth-child(2) {
  opacity: 0;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}

#closeb.open span:nth-child(3) {
  top: 8px;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}

#rmenu{
  width: 352px;
  max-width: 100%;
  height: 100%;
  position: fixed;
  top:0;
  right:0;
  background: #fff;
  color: #333;
  z-index: 999;
  transform:translate(352px,0px);
  -ms-transform:translate(352px,0px);
  -webkit-transform:translate(352px,0px);
  transition: all .2s ease; -moz-transition: all .2s ease; -webkit-transition: all .2s ease; -o-transition: all .2s ease;
}

.background-opacity{
  position: fixed;
  top:0;
  right:0;
  z-index: 998;
  width: 100%;
  height: 100%;
  background: #000;
  transform:translate(100%,0px);
  -ms-transform:translate(100%,0px);
  -webkit-transform:translate(100%,0px);
  transition: opacity .2s ease; -moz-transition: opacity .2s ease; -webkit-transition: opacity .2s ease; -o-transition: opacity .2s ease;
  opacity: 0;
}

#rmenu.open{
  box-shadow: 0 0 15px rgba(0,0,0,0.3);
}

#rmenu.open,.background-opacity.open{
  transform:translate(0px,0px);
  -ms-transform:translate(0px,0px);
  -webkit-transform:translate(0px,0px);
}

.background-opacity.open{
  opacity: 0.5;
}

#rmenu ul{
  margin: 0;
  padding:0;
  list-style-type: none;
}


#rmenu ul li{
  border-bottom: 1px solid rgba(255,255,255,0.1);
  cursor: pointer;
  margin-left: 3em;
  margin-right: 3em;
  padding-bottom: .5em;
  padding-top: .5em;
  flex: unset
}

#rmenu ul li a{
  margin-bottom: .6em;
  margin-top: .6em;
  font-size: 1.2em;
  color: #333;
  display: block;
  font-weight: 500;
}

#rmenu ul li .sub-menu{
  display: none;
}

#rmenu ul li .sub-menu li{
  margin:0;
  margin-left:15px;
}

#rmenu ul li .sub-menu li a{
  font-weight: 400;
  font-size: 1.0em;
}

#rmenu ul li:hover .sub-menu{
  display: block;
}

#chatButton{
  position: fixed;
  bottom: 30px;
  right: 30px;
  width: 64px;
  height: 64px;
  border: 2px solid #fff;
  box-shadow: 0 15px 30px rgba(0,0,0,0.15);
  color: #fff;
  background: rgb(33,68,226);
  background: linear-gradient(125deg, rgba(33,68,226,1) 27%, rgba(11,173,242,1) 79%);
  border-radius: 100%;
  z-index:97;
  text-align: center;
  line-height: 64px;
  font-size: 22px;
  transition: 0.5s all ease;
}

#chatButton::before{
  content: 'Chat With Us';
  position: absolute;
  left: -185px;
  top:5px;
  color: #000;
  background: #fff;
  font-size: 17px;
  width: 168px;
  height: 48px;
  line-height: 48px;
  border-radius: 48px;
  box-shadow: 0 15px 30px rgba(0,0,0,0.15);
  opacity: 0;
  transition: 0.3s all ease;
  transform: translateX(86px) scale(0.5,0.5);
}

#chatButton.trigger::before{
  opacity: 1;
  transform: translateX(0) scale(1,1);
}

.wp-image-98{
	max-width: 80% !important;
}

#pustaka .wp-caption{
  display: inline-block;
  width: 22% !important;
  vertical-align:top;
  text-align:center;
}

#pustaka .wp-caption img{
  width: 64px !important;
  margin: 0 auto;
}

.homefaq .elementor-tab-title.elementor-active{
  background-color: #221E53 !important;
}

.homefaq .elementor-tab-title{
  border-radius: 8px;
}

.homefaq .elementor-accordion-item{
  margin-bottom: 15px !important;
}

.homeboxes{
  text-shadow: 0 3px 20px #000;
  position: relative;
  overflow: hidden;
}

.homeboxes .bg_image{
  position: absolute;
  width: 100%;
  height: 100%;
  top:0;
  left:0;
  z-index:1;
  transition: 1.5s all ease;
}

.homeboxes:hover .bg_image{
  transform: scale(1.1,1.1);
  opacity: 0.3;
}

.homeboxes a{
  position: absolute;
  width: 100%;
  height: 100%;
  top:0;
  left:0;
  z-index:2;
}

#box1 .bg_image{
  background: url(images/boxes/company.jpg) no-repeat 0 center;
  background-size: cover;
}

#box2 .bg_image{
  background: url(images/boxes/telco.jpg) no-repeat 0 0;
  background-size: cover;
}

#box3 .bg_image{
  background: url(images/boxes/caa.jpg) no-repeat 0 0;
  background-size: cover;
}

#box4 .bg_image{
  background: url(images/boxes/av.jpg) no-repeat 0 0;
  background-size: cover;
}

#box5 .bg_image{
  background: url(images/boxes/sas.jpg) no-repeat 0 0;
  background-size: cover;
}

#box6 .bg_image{
  background: url(images/boxes/server.jpg) no-repeat 0 0;
  background-size: cover;
}

#box7 .bg_image{
  background: url(images/boxes/managed.jpg) no-repeat center top;
  background-size: cover;
}

#caaVideo {
  position: absolute;
  left: 50%;
  transform: translate(-50%, -50%);
  top: 50%;
  width: 200%;
  height: 200%;
  z-index:1;
  opacity: 0.3;
}

#particles-js{
position: absolute;
width: 100%;
height: 40%;
left:0;
bottom:0;
opacity: 0.3;
z-index: -1;
}

.grid {
  display: grid;
  grid-template-rows: 
    repeat(6, 180px);
  grid-template-columns: 
    repeat(6, 1fr);
  grid-gap: 0px;

}

.item .bg_image{
  opacity: 0.8;
}

.item:nth-child(1) {
  grid-column: 1 / 4;
  grid-row: 1 / 3;
  position:relative;
}

.item:nth-child(1) .bg_image,#homeGrids .col-md-4:nth-child(1) .bg_image{
  background: url(images/boxes/company.jpg) no-repeat 0 center;
  background-size: cover;
}

.item:nth-child(2) {
  grid-column: 4 / 7;
  grid-row: 1 / 3;
}

.item:nth-child(2) .bg_image,#homeGrids .col-md-4:nth-child(2) .bg_image{
  background: url(images/boxes/telco.jpg) no-repeat 0 center;
  background-size: cover;
}

.item:nth-child(3) {
  grid-column: 5 / 7;
  grid-row: 3 / 7;
}

.item:nth-child(3) .bg_image,#homeGrids .col-md-4:nth-child(6) .bg_image{
  background: url(images/psms.jpg) no-repeat center top;
  background-size: cover;
}

.item:nth-child(4) {
  grid-column: 1 / 3;
  grid-row: 3 / 5;
}

.item:nth-child(4) .bg_image,#homeGrids .col-md-4:nth-child(4) .bg_image{
  background: url(images/boxes/sas.jpg) no-repeat center center;
  background-size: cover;
}

.item:nth-child(5) {
  grid-column: 1 / 3;
  grid-row: 5 / 7;
}

.item:nth-child(5) .bg_image,#homeGrids .col-md-4:nth-child(5) .bg_image{
  background: url(images/boxes/server.jpg) no-repeat 0 0;
  background-size: cover;
}

.item:nth-child(6) {
  grid-column: 3 / 5;
  grid-row: 3/ 7;
}

.item:nth-child(6) .bg_image,#homeGrids .col-md-4:nth-child(3) .bg_image{
  background: url(images/boxes/it.jpg) no-repeat 0 0;
  background-size: cover;
}

/* styling code */

.grid {
  margin:0;
  width:100%;
}

.grid > .item,#homeGrids .col-md-4,#homeBoxesNew .box{
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  overflow:hidden;
}

.grid > .item a,#homeGrids .col-md-4 a,#homeBoxesNew .box a{
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: absolute;
  width: 100%;
  height: 100%;
  top:0;
  left:0;
  z-index: 2;
  text-shadow: 0 3px 20px #000;
}

.grid > .item .bg_image,#homeGrids .col-md-4 .bg_image, #homeBoxesNew .box .bg_image{
  z-index: 1;
  position: absolute;
  width: 100%;
  height: 100%;
  top:0;
  left:0;
  transition: 1.5s all ease;
}

.grid > .item:hover .bg_image,#homeGrids .col-md-4:hover .bg_image,#homeBoxesNew .box:hover .bg_image{
  transform: scale(1.1,1.1);
  opacity: 0.3;
}

#homeGrids .col-md-4 h2{
	font-size: 24px;
}

.logoOverlay{
position: absolute;
left:50%;
top:50%;
transform: translate(-50%,-50%);
z-index:50;
width: 400px;
}

.advantagesbox .elementor-icon-box-icon {
    width: 80px;
    height: 80px;
    padding: 22px;
    line-height: 48px;
    text-align: center;
    border: 2px solid #5048b3;
    border-radius: 100%;
	  position:relative;
}

.advantagesbox .elementor-icon svg{
	position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
	width:32px !important;
	height:32px !important;
}

.mh67{
  min-height: 67px;
}

.cardmeta, .cardmeta a{
  color: #444;
  font-size: 0.9rem;
}

#homeBoxesNew{
  margin-left: -15px;
  margin-right: -15px;
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, minmax(200px, 1fr));
  grid-template-rows: minmax(100px, auto);
  grid-auto-flow: dense;
  height:100vh;
  grid-gap: 0px;
}

#homeBoxesNew .box{
  padding: 30px;
  display: grid;
  place-items: center;
  text-align: center;
  transition: 0.5s all ease;
}

#homeBoxesNew .box h2{
  font-size: 20px;
}

#homeBoxesNew .box:nth-child(1){
  grid-column: span 2;
  grid-row: span 1;
}

#homeBoxesNew .box:nth-child(2){
  grid-column: span 1;
  grid-row: span 2;
}

#homeBoxesNew .box:nth-child(4){
  grid-column: span 1;
  grid-row: span 2;
}

#homeBoxesNew .box:nth-child(5){
  grid-column: span 2;
  grid-row: span 1;
}

#homeBoxesNew .box:nth-child(7){
  grid-column: span 1;
  grid-row: span 2;
}

#homeBoxesNew .box:nth-child(1) .bg_image{
  background: url(images/boxes/company.jpg) no-repeat 0 0;
  background-size: cover;
}

#homeBoxesNew .box:nth-child(2) .bg_image{
  background: url(images/boxes/telco.jpg) no-repeat center center;
  background-size: cover;
}

#homeBoxesNew .box:nth-child(3) .bg_image{
  background: url(images/boxes/it.jpg) no-repeat 0 0;
  background-size: cover;
}

#homeBoxesNew .box:nth-child(4) .bg_image{
  background: url(images/boxes/sas.jpg) no-repeat center center;
  background-size: cover;
}

#homeBoxesNew .box:nth-child(5) .bg_image{
  background: url(images/boxes/factory.jpg) no-repeat center center;
  background-size: cover;
}

#homeBoxesNew .box:nth-child(6) .bg_image{
  background: url(images/psms.jpg) no-repeat center center;
  background-size: cover;
}

#homeBoxesNew .box:nth-child(7) .bg_image{
  background: url(images/boxes/server.jpg) no-repeat center center;
  background-size: cover;
}

.logoOverlay{
  transition: 1s all ease;
}

#homeBlock:hover .logoOverlay{
  opacity:0;
  z-index:-1;
}

/* RESPONSIVE MEDIA QUERIES */

@media (min-width: 1200px){
	.container, .container-lg, .container-md, .container-sm, 
	.container-xl {max-width: 1293px;}
	#homeSolution .container{max-width: 690px;}
	.content-single.aboutpage .container{max-width: 1026px;}
  #pengurusAPKI {position: absolute;right: -85%;top: -16%;}
}

@media (max-width: 1600px){
  #homeBlock .grid > .item h2{font-size: 22px;}
  #tm li a{font-size: 15px;}
  .logotext{font-size: 19px;}
}

@media (max-width: 1199px){
  #h{width: 100%;position: relative;height:auto !important; padding:15px;}
	#nav-icon1,#closeb{display: block;}
  #nav-icon1{margin-top:8px;}
  .page-template-front-page #h{ top: 0;}
  .logo{display: inline-block;height: 36px; width: auto;}
  #tm,#menuwrap,#h .bottomgroup,.logotext,#particles-js{display: none !important;}
  #w{padding:15px;}
  .page-template-front-page #w,.page-template-front-page-2 #w{padding:0;}
  #rmenu ul li.trp-language-switcher-container{display: inline-block; width: 40px;border: none;}
  #homeBanner{height: auto; padding-top: 45px;}
  #bannerLeft{padding-bottom: 30px;}
  #bannerLeft h1, #homeOffer h2, #homeCTA h2{font-size: 50.92px;line-height: 1.1;}
  .pageHeader h1{font-size: 42px; line-height: 1.2;}
  .pageHeader p{font-size: 20px; line-height: 1.2;}
  #expBubble{right: -15px; width: 140px;}
  .homeboxes{min-height: 300px;}
}

@media (max-width: 991px){
  #homeBanner{position: relative; height: 70vh; padding:0;}
	#bannerRight{position: absolute;z-index: 1;opacity: 0.15; bottom: 0;left: 50%; transform: translateX(-50%);width: 66%;}
  #columnGuy{display: none;}
  #bannerRightdecor{display: none;}
  #bannerLeft{width: 100%;height: 100%;position: relative; z-index:2;text-align: center;}
  #homeServices2{position: relative; padding-bottom: 45px;}
  #homeServices2 .card h2{font-size: 32px; line-height: 1.2;}
  #homeServices2 .card .card-body{padding: 35px;}
  #bannerLeft h1, #homeOffer h2, #homeCTA h2{font-size: 38px;}
  #homeServices .card:hover, #homeServices .card.mostpopular {transform: none;}
  #bannerLeft p{font-size: 18px; line-height: 1.2;}
  #homeBanner.productBanner{background-position: center center;}
  .content-single .carousel-caption{padding: 20px 30px;}
  .content-single .carousel-caption h5{font-size: 21px; letter-spacing:0;}
  #newsList h5.card-title{font-size: 17px; line-height: 1.2;}
  #newsList .card a{font-size: 16px;}
  #footerWidgets .mostleft h3.widget-title{font-size: 28px;}
  .content-single {padding: 45px 15px;}
  .supportTextWrap{padding-top: 25px;}
  .productList2{padding: 45px;}
  .wp-image-98{max-width: 105px !important;}
  #homeBoxesNew{grid-template-columns: repeat(auto-fill, minmax(100%, 1fr));grid-template-rows: minmax(auto, auto);overflow-x: hidden;height:auto;}
  #homeBoxesNew .box{grid-column: unset !important; grid-row: unset !important;min-height:150px;}
}

@media (max-width: 767px){
  #topHead{display: none;}
  #bannerLeft .btn{width: 100%;margin: 15px 0;}
  #homeSupport #custPhoto{margin: 0 auto; width: 90%; display: block;}
  .footsoc{padding: 0; margin-top: 25px; text-align: center;}
  .cpy{text-align: center;}
  #homeStatistik h2, #homeSkills .card .card-body h2, #homeTestimonial h2{font-size: 34px;line-height: 1.24;}
  .content-single .carousel-caption p{display: none;}
  .pageHeader h1 {font-size: 28px;}
  .shareaholic-share-buttons-animation-wrapper {transform: none;position: relative !important; left: 0;}
  #search-form,.sidebarPost {padding: 15px;}
  .pageHeader .titleWrapper{padding: 0 15px; border: none;}
  #homeSolution h2, #homeCTA h2,#bannerLeft h1, #homeOffer h2, #homeCTA h2{font-size: 32px; line-height: 1.2;}
  #homeOffer #homeSupport h5 {font-size: 18px; line-height: 1.2;}
  .content-single h2 {font-size: 28px; line-height: 1.2;}
  .content-single h3 {font-size: 18px; line-height: 1.2;}
  .productList2,.greybg{padding: 30px;}
  .productList2 h3{font-size: 21px;}
  #homeStatistik.mini .col-md-4{border: none;}
  #chatButton{ bottom: 15px; right: 15px;width: 64px; height: 64px; line-height: 64px; font-size: 24px;}
  #chatButton::before{top: 5px; height: 49px; line-height: 49px; border-radius: 49px;font-size: 16px;width: 165px; left: -180px;}
  .grid{grid-template-columns: repeat(2, 1fr);}
  #homeBlock .grid > .item h2 {font-size: 16px; padding: 0 15px;}
  .item:nth-child(1){grid-row: 1 / 2;}
  .item:nth-child(2){grid-column: 1/ 4;grid-row: 2 / 3;}
  .item:nth-child(3){grid-column: 2 / 2;grid-row: 5 / 7;}
  .item:nth-child(4){grid-column: 1/ 4;grid-row: 4 / 5;}
  .item:nth-child(5){grid-column: 1/ 4;grid-row: 3 / 4;}
  .item:nth-child(6){grid-row: 5 / 7;grid-column: 1 / 2;}
  .logoOverlay{display: none;}
}

@media (max-width: 480px){
  body{background: #fff;}
  .pageHeader {padding: 30px 25px;background: #f1f1f1;}
  .pageHeader h1{font-size: 24px;}
  .content-single .carousel-caption h5{font-size: 16px}
  #newsList .card a{font-size: 14px;}
  .productList2,.greybg{padding: 15px;}
  #w,#w .container-fluid{padding:0;}
  .otherServices{overflow-x: auto !important;width: 100% !important;}
	.otherServices .e-con-inner{width: 150% !important;max-width:150% !important;}
  .carousel-caption {position: absolute;bottom: 1rem;padding-top: 0;padding-bottom: 0;color: #fff;text-align: left;}
  .carousel-caption h5 {font-size: 0.9rem;}
  .carousel-control-prev {left: -5px;}
  .carousel-control-next {right: -5px;}
  #homeBoxesNew{margin:0;}
}