body { font-family:Arial, Helvetica, sans-serif; font-weight:400}

h1, h2, h3, h4, h5 {  font-family: 'Raleway', sans-serif; }
p{ line-height:20px;}
 /* -- Color */
 
.bg-gray{ background:#ebebeb;}
 /* -- Header CSS */

.navbar{ background:#fff; box-shadow: 0 .125rem .3125rem rgba(0,0,0,.26); padding-right:2% ;}
.navbar-nav{font-family: 'Raleway', sans-serif;}
.navbar-nav > li { margin-right:10px; margin-top:25px}
.navbar-nav > li i{ margin-right:5px; font-size:20px;}
.navbar-nav > li a{margin-top:-5px}
.navbar-nav > li > a{ padding:5px 10px;}
.navbar-brand{ background: url(../images/img_logo.png) left top no-repeat; width:205px; height:43px; margin:10px 5px 0; text-indent:-2000px; }
.top-links { color:#000; margin-top:2%; margin-bottom: 1.5%;}
.top-links a{ color:#000; margin-right:5%; float:left; }
.top-links a:hover{ color:#f44336; text-decoration:none  }
.show-menu .icon-list a{ cursor:pointer}
.menu ul li ul{ margin-left:5%; font-size:15px}
.menu ul li ul li ul{ margin-left:5%; font-size:14px}
#myCarousel .carousel-caption{ margin-bottom:4%; top:20%; }
#myCarousel .carousel-caption h2{ text-shadow:none; font-weight:300}
#myCarousel .carousel-caption h2.bg-banner-text{background: rgba(255, 255, 255, 0.5); padding:1%; color:#a10000; display:inline-block;}
.navbar-nav > li > a .fa-home{ padding-top:0px}
#myCarousel .carousel-caption{right: 30%; left: 30%;}
#home h2{ font-size:40px; color:#000000; }
#home h2 span{ color:#f44336; }
.typewrite{ line-height:50px}
.scroll-downs {  position: absolute;  top: 50%;  right: 0;  bottom: 0;  left: 0;  margin: auto;    width :34px;  height: 55px;}
.mousey {  width: 3px;  padding: 10px 15px;  height: 60px;  border: 2px solid #fff;  border-radius: 25px;  opacity: 0.75;}
.scroller {  width: 3px;  height: 10px;  border-radius: 25%;  background-color: #fff;  animation-name: scroll;  animation-duration: 2.2s;
  animation-timing-function: cubic-bezier(.15,.41,.69,.94);  animation-iteration-count: infinite;}
@keyframes scroll {  0% { opacity: 0; }  10% { transform: translateY(0); opacity: 1; }  100% { transform: translateY(15px); opacity: 0;}}
.scroll-text{text-align: center; width: 100px; display: block; margin-left: -30px; margin-top: 10px; }

.what-we-do h2{ margin-top:3%; text-align:center; font-size:30px; color:#000}

.what-we-do section{margin-top:3%; text-align:center; margin-bottom:3%}
.what-we-do section img{ margin:5% auto;}
.what-we-do section h3{ font-size:25px; color:#f44336; margin-bottom:3%; }
.what-we-do section p{ font-size:13px; color:#000; padding:0 5%;}


/* carousel */
#quote-carousel { margin-top: 30px;}

/* Control buttons  */
#quote-carousel .carousel-control{  background: none;  color: #b6b6b6;  font-size: 2.3em;  text-shadow: none;  margin-top: 5%; width:auto}


/* End carousel */

.item blockquote { border-left: none;     margin: 0;}

.item blockquote img {    margin-bottom: 10px;}

.item blockquote p{ font-size:15px; color:#000; text-align:center; margin-top:4%}
.item blockquote p:before {    content: "\f10d";    font-family: 'Fontawesome';    float: left;    margin-right: 10px; color:#f44336; font-size:25px; margin-top:-2%;}
.item blockquote h4{ font-size:16px; color:#000; text-align:center; margin-top:4% }
.item blockquote h4 span{ font-size:16px; color:#f44336; font-weight:bold  }


footer{ background:#000; color:#fff; padding:2% 0; font-size:15px;}
footer p a{ color:#f44336; padding:2% 1%; display:inline-block;   }

 /* About */

#about .carousel-caption{ margin-bottom:4%}
#about .carousel-caption h1{ font-size:40px; text-shadow:none; font-weight:300; border-bottom:solid 1px #f44336; color:#f44336; display:inline-block; padding-bottom:1%; margin-bottom:2%;  background: rgb(255, 255, 255); background: rgba(255, 255, 255, .7); padding:1%;  }
#about .carousel-caption h3{ font-size:20px; }
#about .carousel-caption{right: 10%; left: 10%;}
 #about .carousel-inner>.item>img {    max-width: none;}

.about h2{ margin-top:3%; text-align:center; font-size:30px; color:#000}
.about h4{ margin-top:1%; text-align:center; font-size:20px; color:#f44336;}
.about hr{ border-bottom:solid 1px #f44336}
.about section p{ font-size:13px; color:#000; padding:1% 0%; text-align:center}

.what-we{ padding:2% 0;}
.what-we  h2{ margin-top:1%; text-align:left; font-size:30px; color:#f44336;  border-bottom:solid 1px #f44336; display:inline-block; margin-bottom:1%; padding-bottom:1%;}
.what-we  p{ font-size:13px; color:#000; padding:1% 0%; text-align:left}

.our-service{ padding:2% 0;}
.our-service  h2{ margin-top:3%; text-align:center; font-size:30px; color:#f44336; }
.our-service hr{ border-bottom:solid 1px #f44336}
.our-service  section { margin-bottom:3%;}
.our-service  section a { font-size:20px; color:#000; padding:1% 0%; text-align:center; text-decoration:none;}
.our-service  section a figure { text-align:center; margin:0 auto ; width:66px;  border-radius: 30px; -moz-border-radius: 30px; -webkit-border-radius: 30px; background:#000;  padding:5%; width: 55px; height: 56px;  }

.our-service  section a:hover{ color:#f44336}
.our-service  section a:hover figure{background:#f44336;}


/* service */

#service .carousel-caption{ margin-bottom:4%}
#service .carousel-caption h1{ font-size:40px; text-shadow:none; font-weight:300; border-bottom:solid 1px #f44336; color:#f44336; display:inline-block; padding-bottom:1%; margin-bottom:2%; background: rgb(255, 255, 255); background: rgba(255, 255, 255, .7); padding:1%;}
#service .carousel-caption h3{ font-size:20px; }
#service .carousel-caption{right: 10%; left: 10%;}
#service .carousel-inner>.item>img {    max-width: none;}
.service{ padding:3% 0;}
.service h2{ margin-top:3%; font-size:30px; color:#000}
.service h4{ margin-top:1%; font-size:20px; color:#f44336; border-bottom: solid 1px #f44336; display:inline-block; margin-bottom:2%;}
.service p{ font-size:13px; color:#000; padding:1% 0%; }
.service li{ list-style:none; text-decoration:none; margin-bottom:2%; border-bottom:solid 0px #666;  font-size:13px; }

.advantages{ padding:2% 0;}
.advantages  h2{ margin-top:2%; text-align:center; font-size:31px; color:#f44336;  border-bottom:solid 1px #f44336; display:inline-block; margin-bottom:3%; padding-bottom:1%;}
.advantages  p{ font-size:13px; color:#000; padding:1% 0%; text-align:left}

.time-line ul { border-left:solid 1px #cbcbcb; padding-left:27px; margin-top:3%;}
.time-line ul li i { position: relative; left:-13px; top: 0;}
.time-line ul li h4 { font-size:20px; color:#000; left: -5%; position:relative;}
.time-line ul li p { font-size:13px; color:#000 }

.bg-quote{ background:url(../images/bg_form.png) #434264 top center; width:100%; padding:5% 0}
.bg-quote h2{ text-align:center; color:#fff; font-size:30px; }
.bg-quote hr{ border-top: solid 1px #f44336; }
.bg-quote p{ font-size:13px; color:#fff; text-align:center; margin-bottom:5%;}

.bg-quote form input{ margin-bottom:5px;} 
.btn-submit { background:#e84133; color:#fff; font-size:16px; border-radius:20px ; padding: 5px 30px; margin-top:2%;}
/**
  MEDIA QUERIES
*/


@media only screen and (max-width : 1024px) {.top-links a{font-size: 14px;} 
#myCarousel .carousel-caption h2 {ont-size: 40px;}
#myCarousel .carousel-caption{margin-bottom: 5%;} 
#service .carousel-caption h1{ font-size:35px;}
.service h2{font-size:26px; margin-top:0px;}
.advantages h2{font-size: 26px;}
.time-line ul li i{left: -18px;}
}

 /* Small Devices, Tablets */
  
@media only screen and (min-width : 768px) { .content-wrap.navbar-shrink { background:#fff;  padding: 5px 0; border-bottom:solid 1px #c9cacb;  }
.content-wrap.navbar-shrink .navbar-brand { background:url(../images/img_logo_small.png) no-repeat; width:170px; height:39px;  }
.content-wrap.navbar-shrink .navbar-brand1{ background-image:url(../images/img_logo_inner1.png) !important; width:75px; height:65px; margin-top:5px; position:absolute }
#quote-carousel { margin-bottom: 0;  padding: 0 40px 30px 40px;}

}
		
		 /* Small Devices, Tablets */
@media only screen and (max-width : 768px) {.content-wrap.navbar-shrink { margin-top:0;} .menu-button{ right:-5%;}
.carousel-inner > .active  { background-color:#f2f2f2; height:420px;}  
#myCarousel .carousel-caption h2{font-size: 30px;}
#home h2{margin-bottom: 20%;}
.carousel-inner > .active{height: auto;}
.scroll-downs{top: 80%;}
.scroll-downs figure{ display:none;} 
#myCarousel .carousel-caption{ margin-bottom:0;}
.mousey{height: 50px; border-radius: 40px;}
.what-we-do section h3{font-size: 20px;}
.what-we-do section p{font-size: 12px;}
.item blockquote{ background:white}
.bg-gray .item blockquote{ background:#ebebeb}
.item blockquote p{font-size: 12px;}
.our-service  section{ min-height:100px}
#service .carousel-caption h1{ font-size:30px;}
.service h2{font-size:24px; margin-top:0px;}
.service h4{font-size:18px;}
.advantages h2{font-size: 24px;}
.time-line ul li i{left: -18px;}
}
    /* Extra Small Devices, Phones */ 
@media only screen and (max-width : 480px) { .menu-button{ right:-5%;} .top-links{ display:none; } 
.content-wrap.navbar-shrink { background:#fff ;  padding: 0px 0; border-bottom:solid 1px #c9cacb;  }
.content-wrap.navbar-shrink .navbar-brand, .navbar-brand { background:url(../images/img_logo_mobile.png) no-repeat;  } 
.carousel-inner > .active  { background-color:#f2f2f2; height:auto;}
#myCarousel .carousel-caption{ margin-bottom:0px; bottom:-10%}
.content-wrap.navbar-shrink .top-links{ display:block; width:67%; margin-top:7%; }
.menu-button{height: 2em; margin-top: 0.1em; right: 2%;}
.menu-button::before{width: 30px; right: 4%; top: 16px;}
.scroll-downs{ display:none;}
#home h2{ margin-bottom:0}
.content-wrap.navbar-shrink .top-links{width: 100%;}
.top-links a,.top-links { display:none; font-size: 11px; margin-bottom: 3%;}
.content-wrap.navbar-shrink .top-links{margin-top: 3%; display:none;}
#myCarousel .carousel-caption{bottom: 0%;}
#myCarousel .carousel-caption h2{font-size: 20px; line-height: 0px;}
.what-we-do h2{ font-size:25px}
.what-we-do section h3{ font-size:18px}
.what-we-do section p{font-size: 11px;}
.item blockquote img{ margin:0 auto;}
.item blockquote p{ font-size:11px}
.item blockquote p::before{font-size: 15px;}
.item blockquote h4{font-size: 14px;}
.item blockquote h4 span{font-size: 12px;}
#quote-carousel{ margin-bottom:4%}
footer{font-size: 12px;}
.our-service section a figure{ padding:3%}

#service .carousel-caption h1{ font-size:25px;}
#service .carousel-caption h3{ font-size:18px;}
.service h2{font-size:22px; margin-top:0px;}
.service h4{font-size:16px;}
.advantages h2{font-size: 22px;}
.time-line ul { border-left:0px; padding-left:0px;}
.time-line ul li h4{ left:0; margin-bottom:2%; margin-top:2% }
.time-line ul li i{ display:none;}
.bg-quote h2{font-size:22px;}

.typewrite{ line-height:normal}
}






@media (min-width: 768px) {
}

#portfolio .portfolio-item {
  right: 0;
  margin: 0 0 15px; }
  #portfolio .portfolio-item .portfolio-link {
    position: relative;
    display: block;
    max-width: 400px;
    margin: 0 auto;
    cursor: pointer;
	display:inline-table}
    #portfolio .portfolio-item .portfolio-link .portfolio-hover {
      position: absolute;
      width: 100%;
      height: 100%;
      -webkit-transition: all ease 0.5s;
      -moz-transition: all ease 0.5s;
      transition: all ease 0.5s;
      opacity: 0;
      background: rgba(232, 65, 51, 0.5); }
      #portfolio .portfolio-item .portfolio-link .portfolio-hover:hover {
        opacity: 1; }
      #portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content {
        font-size: 20px;
        position: absolute;
        top: 50%;
        width: 100%;
        height: 20px;
        margin-top: -12px;
        text-align: center;
        color: white; }
        #portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content i { background: rgba(232, 65, 51, 1); border-radius:100px; padding:10px;          margin-top: -12px; text-align:center; text-indent:2px; }
        #portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content h3,
        #portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content h4 {
          margin: 0; }
  #portfolio .portfolio-item .portfolio-caption {
    max-width: 400px;
    margin: 0 auto;
    padding: 10px 0;
    text-align: center;
    background-color: white; }
    #portfolio .portfolio-item .portfolio-caption h4 {
      margin: 0;
      text-transform: none; font-size:18px; }
    #portfolio .portfolio-item .portfolio-caption p {
      font-size: 14px;
      margin: 0;
	  color:#727272;
	  padding-top:2%;
      }

#portfolio * {
  z-index: 2; }

@media (min-width: 767px) {
  #portfolio .portfolio-item {
    margin: 0 0 30px; } }

.portfolio-modal .modal-dialog {
  max-width: none;
  height: 100%;
  margin: 0; 
  width: 100%;
  
  }
  

.portfolio-modal .modal-content {
  min-height: 100%;
  padding: 100px 0;
  border: none;
  border-radius: 0;
  background-clip: border-box;
  -webkit-box-shadow: none;
  box-shadow: none;
  min-width:100%;
  
  
  }
  .portfolio-modal .modal-content h2 {
    font-size: 2em;
    margin-bottom: 15px; }
  .portfolio-modal .modal-content p {
    margin-bottom: 20px; font-size:13px;}
	 .portfolio-modal .modal-content p strong{ font-weight:bold;}
  .portfolio-modal .modal-content p.item-intro {
    font-style: italic;
    margin: 20px 0 30px;
    }
  .portfolio-modal .modal-content ul.list-inline {
    margin-top: 0;
    margin-bottom: 30px; }
  .portfolio-modal .modal-content img {
    margin-bottom: 30px; }
  .portfolio-modal .modal-content button {
    cursor: pointer; }

.portfolio-modal .close-modal {
  position: absolute;
  top: 25px;
  right: 25px;
  width: 75px;
  height: 75px;
  cursor: pointer;
  background-color: transparent; }
  .portfolio-modal .close-modal:hover {
    opacity: 0.3; }
  .portfolio-modal .close-modal .lr {
    /* Safari and Chrome */
    z-index: 1051;
    width: 1px;
    height: 75px;
    margin-left: 35px;
    /* IE 9 */
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    background-color: #222222; }
    .portfolio-modal .close-modal .lr .rl {
      /* Safari and Chrome */
      z-index: 1052;
      width: 1px;
      height: 75px;
      /* IE 9 */
      -webkit-transform: rotate(90deg);
      -ms-transform: rotate(90deg);
      transform: rotate(90deg);
      background-color: #222222; }

.portfolio-modal .modal-backdrop {
  display: none;
  opacity: 0; }


.modal-open .modal{ z-index:99999; width:100%;}

.toolbar{ text-align:center; margin:1% auto;}
.toolbar .btn-link{ font-size:16px; border:0px; color:#000;}
.toolbar .btn-link:focus{ text-decoration:none;  }
.toolbar .btn-link:active{ color:#a10000;}
.toolbar .btn-link:focus, .toolbar .btn-link:hover, .toolbar .btn-link.active{ text-decoration:underline; color:#a10000; }


#portfolio .portfolio-item{list-style:none; display:none}
#loadMore{ margin-bottom:2%;}



   /* Blog */
.margin-top-2{ margin-top:2%;}
.blog .blog-container{box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); display:inline-block; margin-bottom:2%; min-height:275px;}
.blog h2{margin-top: 3%;text-align: center; font-size: 30px; color: #f44336; border-bottom: solid 1px #f44336; display: inline-block; margin-bottom: 5%;
padding-bottom: 1%; }
.blog a .blog-container h4{margin-top: 2%; margin-bottom: 5%; text-align: center; font-size: 18px; color: #f44336; min-height:35px;}
.blog a:hover .blog-container h4{color: #000;}
.blog a .blog-container p{font-size: 13px;color: #000; margin-bottom:5%;}
.blog a:hover .blog-container p{ color: #5a596a;}
.blog-detail{box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); display:inline-block;  margin-bottom:2%;}
.blog-detail h4{margin-top: 2%; margin-bottom: 1%; text-align: left; font-size: 20px; color: #f44336; }
.blog-detail p{font-size: 13px;color: #000; margin-bottom:1%;}
.category li a{ line-height:30px; color:#000; font-size:13px;}
.category li a:hover{ color:#f44336; text-decoration:none; }
.blog .toolbar{ text-align:left; margin:1% auto;}
.blog .toolbar .btn-link{ font-size:16px; border:0px; color:#000;}
.blog .toolbar .btn-link:focus{ text-decoration:none;  }
.blog .toolbar .btn-link:active{ color:#a10000;}
.blog .toolbar .btn-link:focus, .toolbar .btn-link:hover, .toolbar .btn-link.active{ text-decoration:underline; color:#a10000; }


/* contact */
.careers  h2{ margin-top:3%; text-align:left; font-size:30px; color:#f44336;  border-bottom:solid 1px #f44336; display:inline-block; margin-bottom:3%; padding-bottom:1%;}
.careers  h3{ margin-top:3%; text-align:left; font-size:18px; color:#f44336; margin-bottom:3%; padding-bottom:1%;}
.careers  p{ font-size:13px; color:#000; padding:1% 0%; text-align:left}
.careers  a{ color:#f44336; margin-top:3%}
.careers  a:hover{ background:#f44336; color:#fff}
.inner-list{ box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); display:inline-block; margin-bottom:3% }
.inner-list figure{ margin-left:-15px;}
.careers-form ul{ margin-top:15px; margin-bottom:15px; }
.careers-form ul li { margin-bottom:2%;}

/* contact */
.contact  h2{ margin-top:3%; text-align:left; font-size:30px; color:#f44336;  border-bottom:solid 1px #f44336; display:inline-block; margin-bottom:3%; padding-bottom:1%;}
.contact  p{ font-size:13px; color:#000; padding:1% 0%; text-align:left}


#blog .carousel-caption{ margin-bottom:4%}
#blog .carousel-caption h2{ font-size:40px; text-shadow:none; font-weight:300; color:#f44336; display:inline-block; padding-bottom:1%; margin-bottom:2%; background: rgb(255, 255, 255); background: rgba(255, 255, 255, .7); padding:1%;}
#blog .carousel-inner>.item>img {    max-width: none;}