﻿/* =================================================================== */
/* Media Queries
====================================================================== */

/* Standard 1180 (devices and browsers) */
@media only screen and (min-width: 1200px) {
  .caption.text { margin-left: 0 !important; }
  .caption h2,  .caption h3,  .caption p { margin:0; }
  
}


/* #Dekstop (960 Grid)
================================================== */
@media only screen and (min-width: 959px) and (max-width: 1199px) {
    
 body { background:#F0F0F0;}
 
/* Menu
====================================*/    
   #nav>li {  margin-right:12px;  }
   #nav>li>a { font-size:16px; }
   
 /* Revolution Slider
====================================*/
  .caption.text { margin-left: 50px !important; }
  .caption h2 {font-size:32px; }
  .caption p { font-size:20px; line-height:20px; }
  
/* time line
====================================*/ 
  .timeline-item-content {width: 508px; padding: 5px 20px;}
  .timeline-item-date {margin-top: 21px;}
  .timeline-item {margin-bottom: 20px;}
  .timeline-item-trigger {padding-top: 20px;}
  .timeline-arrow .iit { top:20px; }
  
  .list-item-content h3 a { color:#333; font-size:20px; margin-top:0; font-weight:400;}
  
  ol li ol.childlist .comment-des { float:right; width:78%; }
  
   .contact-informations h2 { font-size:22px;}
  
}


/* #Tablet (Portrait)
================================================== */
@media only screen and (min-width: 768px) and (max-width: 959px) {

  body { font-size: 12px; line-height: 22px; }
  
  
/* Head top
====================================*/ 
  .site-call-phone { left:20px;  }
  .site_lang { right:20px; }
  

  
  .site-contact { float:right; margin-top:15px; margin-right:20px;}

/* Menu
====================================*/  
  #nav>li {  margin-right:5px;  }
  #nav>li>a { font-size:14px; }

/* Revolution Slider
====================================*/
  .caption.text { margin-left: 50px !important; }
  .caption h2 {font-size:28px; }
  .caption p { font-size:18px; line-height:20px; }
  
/* time line
====================================*/ 
  .timeline-item-content {width: 346px; padding: 5px 20px;}
  .timeline-item-date {margin-top: 21px;}
  .timeline-item {margin-bottom: 20px;}
  .timeline-item-trigger {padding-top: 20px;} 
  
/* Other
====================================*/ 
  .img-1 { margin-left: 0 !important; }
  .the-icons { font-size: 13px; }
  ol li ol.childlist .comment-des { float:right; width:71%; }
  .rtw { margin-top: 30px; }
  
  .contact-informations h2 { font-size:16px; font-weight:400;}
  .contact-informations li, .contact-informations.second li { font-size:14px; line-height:26px; }
  .contact-informations p { font-size:14px;}
   p.contact-details-alt { font-size:12px; }

  #contact textarea { width:90%; min-height: 180px; background: #fff; resize: vertical; } 
  
  .footer-list-2 p { font-size: 18px; }
  
  .circle-3 { width: 120px; height: 120px; display: block; border-radius: 50%; background-color:#eee; text-align: center; float: left; margin-left:20px;  }
  .circle-3 i { font-size: 70px; margin: 25px 0; left: 24%; float: left; color: #a0a0a0; z-index: 5; position: relative; }
  
  .technology-desc { float: left; margin: -120px 0 0 180px; }
}



/*  #Mobile (Portrait)
================================================== */
@media only screen and (max-width: 767px) {
  body { background:#F0F0F0; padding-top: 0;}
  body.boxed {background:#F0F0F0;}
  
  .bord-headline span { font-size:32px; color:#555; padding:0 20px;  }
  p { font-size:14px; font-weight:300; line-height:24px; text-align:justify;}

/* Head top
====================================*/ 
  #header {  z-index: 999;  background:#131820;  height: 130px;  margin-top: 0;  position: relative;  width: 100%; }
  
  .site-call-phone { display:none; }
  .site-call-email { position:absolute;  color: #fff; top: 2px; left:0; }
  
  .site_lang  { position:absolute; top:60px; left:0; z-index:1; }

  #header #logo { display:block; margin: 10px auto; width:135px; }
  #header #logo a img {  display:block; height:36px; padding-bottom:20px; }
     


  #navigation { float:none }
  .js #nav {display:none }
  .js .tinynav { display:block }
  
/* Revolution Slider
====================================*/
  .fullwidthbanner-container { top: 0; }
  .caption.text { margin-left: 30px !important;  }
  .caption h2 { font-size: 18px;   padding:0;}
  .caption p { margin-top:10px; font-size:16px; line-height:18px; padding-left:10px; }
  .caption h6 { display:none;}

/* time line
====================================*/ 
  .timeline {background-position: center center;}
  .timeline-item-date, .timeline-item-content, .timeline-item-trigger { -webkit-box-sizing: border-box;  -moz-box-sizing: border-box;  box-sizing: border-box; display: block; width: 100%;  float: none;  text-align: center; margin: 5px 0; }
  .timeline-item-content {margin-bottom: 0; padding: 5px 20px;}
  .timeline-item-trigger {padding-top: 0; margin: 10px 0 15px;}
  .timeline-item-date {background:#fff; padding: 5px 0; margin-top: 0;}
  .timeline-arrow { text-align: center; height: 0;}
  .timeline-arrow .iit { position: relative; display: inline-block; top: -5px; left: auto; background:url(../images/icon-ii.png) no-repeat; height: 15px; width: 15px; }
  
/* footer
====================================*/
  #footer {padding-top: 10px;}
  #footer h3 {margin-top: 30px;}


/* Other
====================================*/  
  .img-1 { margin-left: 0 !important; }

  #titlebar { margin-bottom: 0px;  padding-top: 20px;}
  #titlebar h2 { margin-top: 3px; font-size:32px;}
  #breadcrumbs ul { display:none; }

  #googlemaps {padding-bottom: 40%;}
  
  .plan-features {margin-bottom: 25px;}
  
  .medium .post-img {margin-bottom: 20px;  }
  
  #filters {margin: 10px 0 30px 0;}
  #filters a {margin: 0 5px 5px 0;}
  
  .line.filters {display: none;}
  .line.showing { display: inline-block; margin: -11px 0 0 0; z-index: 5;}
  
  .featured-boxes {margin: 40px 0 5px 0;}
  .featured-box {margin: 0 0 25px 0;}
  
  a.button.launch { margin: 0 0 30px 0; }
  
  #contact input[type="submit"] { margin: 0 0 30px 0; }
  
  .section .section-title { border-bottom: 5px solid #9c383a; border-top: 5px solid #9c383a; }
  
  .post-format { display:none;}
  .medium .list-item-content  { margin-top:15px; float:none; width:100%;}
          .list-item-content h3 a { color:#333; font-size:20px; margin-top:0; font-weight:400;}
  
  .post-content, .post-format { float:none;}
  .post-content { margin:15px auto;  }
  .post-content p img { width:100%; height:auto;}
  
  #contact textarea {width:95%; min-height: 180px; background: #fff; resize: vertical; }
  
  
  .footer-list-2 p { font-size: 18px; }
  
  
 }

/* #Mobile (Landscape)  Mobile Landscape Size to Tablet Portrait (devices and browsers)
================================================== */
@media only screen and (min-width: 480px) and (max-width: 767px) {
  body{background:#F0F0F0;}
/* Revolution Slider
====================================*/
  .caption.text { margin-left: 30px !important;  }
  .caption h2 { font-size: 18px;   padding:0;}
  .caption p { margin-top:10px; font-size:16px; line-height:18px; padding-left:10px; }
  .caption h6 { display:none;}
  
/* footer
====================================*/  
  #footer-bottom .text-left,#footer-bottom .text-right { text-align: center;}  
  
/* Other
====================================*/  
  ol li ol.childlist .comment-des { float:right;  width:63%; }
  .widget { margin-top:30px;}
  
 

  #titlebar { float:none;}
  #titlebar h2 { font-size: 42px; font-weight:300; text-align:center; width: 100%; }
  #breadcrumbs ul { float: none; }
  
  
  .featured-box { margin: 0 0 30px 0; }
  .circle-3 i { font-size: 62px; margin: 30px auto;  left: 27%; float: left; color: #a0a0a0; z-index: 5; position: relative; text-align:center; }
  .circle-3 { width: 120px; height: 120px; display: block; border-radius: 50%; background-color:#e0e0e0; text-align: center; margin:0 auto; float:none; }

  .technology-desc { margin:20px auto; display:block; }
  .technology-desc h3{ color: rgb(91, 96, 100); cursor: default; display: block; font-family: Roboto; font-size: 32px; font-style: normal; font-weight: 300; height: 31px; line-height: 31.1875px; margin-bottom: 15px; text-align:center;}
  .technology-desc p { color: rgb(91, 96, 100); font-family: Roboto; font-size: 16px; font-weight: 300; font-weight: 300; line-height:26px; }
  
  .circle-3, .circle-3 i, .circle-3 span { -webkit-transition-duration: 0.5s; -moz-transition-duration: 0.5s; -o-transition-duration: 0.5s; -ms-transition-duration: 0.5s; transition-duration: 0.5s; }

  
  .featured-box:hover > .circle-3 span { background-color: #a0a0a0; opacity: 0; -moz-transform: scale(1.5); -webkit-transform: scale(1.5); -o-transform: scale(1.5); -ms-transform: scale(1.5); -moz-transition-duration: 0.7s; -webkit-transition-duration: 0.7s; -ms-transition-duration: 0.7s; -o-transition-duration: 0.7s; transition-duration: 0.7s; }
  
  .footer-list-2 p { font-size: 18px; }
}


/* Mobile 480 Size  */
@media only screen and (max-width: 479px) {
   body {background:#F0F0F0;}
/* Head top
====================================*/ 
  
  #header {  z-index: 999;  background:#131820;  height: 130px;  margin-top: 0;  position: relative;  width: 100%; }
  #header #logo { display:block; margin: 10px auto; width:135px; }
  #header #logo a img {  display:block; height:36px; padding-bottom:20px; }


/* Revolution Slider
===================================*/

  .caption h2 { font-size: 12px; margin-top: 0; display:none;}
  .caption h3 { font-size: 12px; margin-top: 10px;display:none; }
  .caption p { display:none; }
  
  ol li ol.childlist .comment-des { float:right; width:49%; }
  
  .dropcap { font-size: 52px; }
  
   #footer-bottom .text-left,#footer-bottom .text-right { text-align: center;}
   
  .bord-headline span { background:#FFF; padding:0 10px;  font-size:20px; }
  
  #titlebar { margin:0 auto;  padding-top: 20px; text-align:center;}
  #titlebar h2 { margin-top: 3px; font-size:24px;}
  #breadcrumbs ul { float: none; }
  
   #contact textarea {width:92%; min-height: 180px; background: #fff; resize: vertical; }
   
  .team-about h3{ font-size: 18px;}
  .team-about p { font-size: 14px; text-align:left;  }
  
  .footer-list-2 p { font-size: 16px; }
  
  .featured-box { margin: 0 0 30px 0; }
  .circle-3 i { font-size: 62px; margin: 30px auto;  left: 27%; float: left; color: #a0a0a0; z-index: 5; position: relative; text-align:center; }
  .circle-3 { width: 120px; height: 120px; display: block; border-radius: 50%; background-color:#e0e0e0; text-align: center; margin:0 auto; float:none; }

  .technology-desc { margin:20px auto; display:block; }
  .technology-desc h3{ color: rgb(91, 96, 100); cursor: default; display: block; font-family: Roboto; font-size: 32px; font-style: normal; font-weight: 300; height: 31px; line-height: 31.1875px; margin-bottom: 15px; text-align:center;}
  .technology-desc p { color: rgb(91, 96, 100); font-family: Roboto; font-size: 16px; font-weight: 300; font-weight: 300; line-height:26px; }
  
  .circle-3, .circle-3 i, .circle-3 span { -webkit-transition-duration: 0.5s; -moz-transition-duration: 0.5s; -o-transition-duration: 0.5s; -ms-transition-duration: 0.5s; transition-duration: 0.5s; }

  
  .featured-box:hover > .circle-3 span { background-color: #a0a0a0; opacity: 0; -moz-transform: scale(1.5); -webkit-transform: scale(1.5); -o-transform: scale(1.5); -ms-transform: scale(1.5); -moz-transition-duration: 0.7s; -webkit-transition-duration: 0.7s; -ms-transition-duration: 0.7s; -o-transition-duration: 0.7s; transition-duration: 0.7s; }
}

