.banner_box { background-image: linear-gradient(rgb(0 0 0 / 45%), rgb(0 0 0 / 45%)),
    url("../images/iot/iot.jpg");min-height: 700px;}
.banner_box h1{ color:#f55757; word-wrap:break-word;}
.grey_text { color:#304150;}
.banner_box .banner_btn{margin: 25px 0 0px;}
.banner_box .banner_btn .btn{background: #e32b3a; border: 0; overflow: hidden; line-height: 43px;}
.banner_box .banner_btn .btn:after{background: #304150}

a:focus{outline: none;}
h2 { color:#4276a7; text-transform:none;}
#Strategy_box { background:url() left bottom repeat-x ; min-height:0px;
    padding-top:0px;}
#Strategy_box h3 { font-weight:700; margin:0; color: #304150;}
#Strategy_box h2{ margin:5px 0 15px; font-size: 25px; line-height: 38px;}
.grey_box { background:#272f35; color:#c7c7c7;}
.grey_box h1 { margin:0; color:#fff;}
.grey_box h4 { margin:0; color:#fff;}

.media span {
	background: #4276a7;   
    border-radius: 50px;
    width: 100px;
    height: 100px;
    float: right;
    color: #fff;
    font-size: 50px;
	    transition: all 0.5s;
    -webkit-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -moz-transition: all 0.5s;
    text-align: center;
	}
.media span .fa{line-height: 100px;}

.media:hover  span { background:#155087;}
.media:hover h4 { color:#155087;}
.media:hover .fa{animation-duration: 1s;animation-iteration-count: 1;animation-name: hvr-icon-wobble-vertical;animation-timing-function: ease-in-out;}
.media p{color: #ffffff;style="text-align: justify;"}

.media { margin-bottom:60px;}
.heading { margin-bottom:60px;}
.red_box { background:#f25151; color:#fff; padding:30px;}
.red_box h3 { font-weight:200;}

.banner_btn{margin: 25px 0 0px;}
.banner_btn .btn{background: #fff; border: 0; overflow: hidden; line-height: 43px; color: #f55757;}
.banner_btn .btn:after{background: #000;}
.banner_btn .btn {
  border-radius: 5px;
  display: inline-block;
  font-size: 12px;
  font-weight: 600;
  height: 43px;
  line-height: 39px;
  margin-right: 2%;
  padding: 0;
  transition: all 0.6s ease 0s;
  -webkit-transition: all 0.6s ease 0s;
  -moz-transition: all 0.6s ease 0s;
  -ms-transition: all 0.6s ease 0s;
  width: 143px;
  
  border: 2px solid #fff;
  position: relative;
  text-transform: uppercase;
  z-index: 1;
}
.banner_btn .btn:after{
  height: 100%;
  left: 0;
  top: 0;
  width: 0;
  position: absolute;
  content: '';
  z-index: -1;
  transition:all 0.4s ease 0s; 
  -webkit-transition:all 0.4s ease 0s;
  -moz-transition:all 0.4s ease 0s;
  -ms-transition:all 0.4s ease 0s;
}
.banner_btn .btn:hover:after{width: 100%;}

.architecture_development { margin-top:60px;}
.four_box { float:left; margin-bottom:40px;}
.four_box .col-sm-6 { padding:0px; margin:0px}
.four_box .redbox { background:#f55757; text-align:left; color:#fff; padding:40px 50px; }
.four_box .blockquote{ text-align:left; color:#FFF; 
  border-left: 5px solid #eeeeee;
  font-size: 17.5px;
  margin: 0 0 20px;
  padding: 10px 20px;
}
.four_box .blockquote h3 { font-weight:200; color:#fff; font-size:24px; padding:0px; margin:0px;}
.four_box .blockquote h2 { font-weight:600; color:#fff; padding:0px; margin:0px;}

.black_box { background:#272f35; border-top:1px solid #fff; border-left:1px solid #fff; color:#797f83; border-bottom:10px solid #272f35; padding: 40px 10px;  transition: all 0.5s;
    -webkit-transition: all 0.5s;
    -ms-transition: all 0.5s;
    -moz-transition: all 0.5s;}
.black_box:hover .fa{animation-duration: 1s; color:#f55757;
animation-iteration-count: 1;
animation-name: hvr-icon-wobble-vertical;
animation-timing-function: ease-in-out;}
.black_box:hover { border-bottom:10px solid #f55757; color:#fff;}
.black_box .fa { font-size:65px;}
.black_box p { margin-top:20px;}

.desc_line { margin-bottom:80px; float:left; display:block; width:100%;}
.grey_bg { background:#272f35; color:#fff; padding-top:100px;}

.black_button{margin: 25px 0 0px;}
.black_button .btn{background: #181a1c; border: 0; overflow: hidden; line-height: 43px; color: #fff;}
.black_button .btn:after{background: #de3d3d;}
.black_button .btn {
  border-radius: 5px;
  display: inline-block;
  font-size: 12px;
  font-weight: 600;
  height: 43px;
  line-height: 39px;
  margin-right: 2%;
  padding: 0;
  transition: all 0.6s ease 0s;
  -webkit-transition: all 0.6s ease 0s;
  -moz-transition: all 0.6s ease 0s;
  -ms-transition: all 0.6s ease 0s;
  width: 143px;
  
  border: 2px solid #fff;
  position: relative;
  text-transform: uppercase;
  z-index: 1;
}
.black_button .btn:after{
  height: 100%;
  left: 0;
  top: 0;
  width: 0;
  position: absolute;
  content: '';
  z-index: -1;
  transition:all 0.4s ease 0s; 
  -webkit-transition:all 0.4s ease 0s;
  -moz-transition:all 0.4s ease 0s;
  -ms-transition:all 0.4s ease 0s;
}
.black_button .btn:hover:after{width: 100%;}

#how_can_Box { background: linear-gradient(to right, #2193b0, #6dd5ed);}

#how_can_Box .button_box a{background: #272f35; z-index: 1;color: #fff; border: none;}
#how_can_Box .button_box a::after, #how_can_Box .button_box a::before{background: #fff;}
#how_can_Box .button_box a:hover{color: #272f35;}
.wrap_box { overflow:hidden;}

@media all and (min-width:200px) and (max-width: 767px) {
	.four_box { float:none;}
	.header_banner_image { width:80%;}
  .media span .fa {line-height: 60px;}
  .media span{width: 60px; height: 60px; font-size: 30px;}
	}
	
	@media all and (min-width:993px) and (max-width:1400px) {
	.four_box .redbox { padding: 79px 70px;}
	.header_banner_image { width:50%;}
	}


@media all and (min-width:767px) and (max-width:990px) {
	.four_box .redbox {padding: 25px 50px}
  .black_box{padding:33px 10px;}
	}


@media all and (max-width:767px){
	.banner_box {
    background: url(../images/ecm/Ecm-Bg.jpg) no-repeat center bottom / cover;
    min-height: 460px!important;
}
}


