@charset "UTF-8";
/* CSS Document */

*{ box-sizing:border-box;}
body{ margin:0px; padding:0px; color:#2c2c2c; font-size:14px; font-family:arial; }
.button, button { background:#2c2c2c; text-align:center; border-radius:3px; padding:10px 15px; color:#fff; border:0px; text-transform:uppercase; margin:10px; }

.textcenter{ text-align:center;}
.flex{display:flex; flex-wrap:wrap; justify-content:center; }
.flex33p{ width:33%; }
h1,h2,h3,h4,h5,h6{
  font-family: 'Oswald', sans-serif !important;
}
section{ padding:20px 0px;}

.clearfix:after {
     visibility: hidden;
     display: block;
     font-size: 0;
     content: " ";
     clear: both;
     height: 0;
     }
.clearfix { display: inline-block; }
/* start commented backslash hack \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* close commented backslash hack */

.w12hp, .content{ max-width:1200px; margin:0px auto; width:95%; clear:both;}
.content{ line-height:140%;}
header{ background:#c7d3df; }

.headersection{ max-width:1200px; display:block; position:relative; z-index:2; margin:0px auto;height:100px; }
.headersection .logo{position:absolute; background:url('../images/logo.png') no-repeat ; background-size:100% ; width:150px; height:70px; text-indent:-9999px; display:block; margin:20px auto 0px ; left:10px; }
.headersection .menu{ position:absolute; right:10px; top:20px; width:100%;  }
.headersection .menu li{ list-style:none; display:inline-block; font-family: 'Oswald', sans-serif !important; padding:0px 10px; }
.headersection .menu li a{ color:#2c2c2c; text-decoration:none; font-size:130%;}
.innernav{}

.slide1,.slide2,.slide3,.slide4{  background:url('../images/headerbg.jpg') no-repeat ;background-size:100% ; }

.slide1 img,.slide2 img,.slide3 img,.slide4 img{ background-size:100%;}

/*
.slide1{ background:#42859d;}
.slide2{ background:#ccc;}
.slide3{ background:#636768;}
.slide4{ background:#eadabe; position:relative;}
*/



.slidetext-slide{ position:absolute; z-index:1; top:30%; left:14%; text-align:center;}
.slidetext-slide h4,
.slidetext-slide h1{  padding:0px; margin:0px; text-transform:uppercase;font-weight:400; letter-spacing:1px; }
.slidetext-slide h4{color:#536465; line-height:none; font-size:110%;}
.slidetext-slide h1{color:#2452aa;font-size:600%; font-weight:400; border:solid #b1cddb; border-width:1px 0px;     line-height: 85px; margin:5px 0px; }
.slidetext-slide h1 strong{color:#3683cd;font-weight:400;}
.slidetext-slide button{ background: none; border:2px solid #3683cd; color:#3683cd; cursor:pointer;font-weight:bold;}
.slidetext-slide button:hover{ background: none; border:2px solid #2452aa; color:#3683cd; }
.slide4 .slidetext-slide{ position:absolute; z-index:1; top:30%; left:initial; right:15% ; text-align:center; width:300px;}


.bodysection{}
.services-section{}

.headingsection{ text-align:center; text-transform:uppercase; font-family: 'Oswald', sans-serif !important; margin:20px 0px 40px; }
.headingsection label{ display:block;}
.headingsection h1{ display:inline-block; border-top:1px solid #333; border-bottom:1px solid #333; margin:5px 0px 0px; color:#2453aa; font-size:300%;}
.headingsection h1 strong{color:#3683cd;}



     .jssorb05 {
            position: absolute;
        }
        .jssorb05 div, .jssorb05 div:hover, .jssorb05 .av {
            position: absolute;
            /* size of bullet elment */
            width: 16px;
            height: 16px;
            background: url('header/b05.html') no-repeat;
            overflow: hidden;
            cursor: pointer;
        }
        .jssorb05 div { background-position: -7px -7px; }
        .jssorb05 div:hover, .jssorb05 .av:hover { background-position: -37px -7px; }
        .jssorb05 .av { background-position: -67px -7px; }
        .jssorb05 .dn, .jssorb05 .dn:hover { background-position: -97px -7px; }

        /* jssor slider arrow navigator skin 22 css */
        /*
        .jssora22l                  (normal)
        .jssora22r                  (normal)
        .jssora22l:hover            (normal mouseover)
        .jssora22r:hover            (normal mouseover)
        .jssora22l.jssora22ldn      (mousedown)
        .jssora22r.jssora22rdn      (mousedown)
        */
        .jssora22l, .jssora22r {
            display: block;
            position: absolute;
            /* size of arrow element */
            width: 40px;
            height: 58px;
            cursor: pointer;
            background: url('header/a22.html') center center no-repeat;
            overflow: hidden;
        }
        .jssora22l { background-position: -10px -31px; }
        .jssora22r { background-position: -70px -31px; }
        .jssora22l:hover { background-position: -130px -31px; }
        .jssora22r:hover { background-position: -190px -31px; }
        .jssora22l.jssora22ldn { background-position: -250px -31px; }
        .jssora22r.jssora22rdn { background-position: -310px -31px; }
		
		
.services-section{}
.hp-services{ text-align:center;}
.hp-services .flex33p{ margin-bottom:60px;}
.hp-services .flex33p label{ display:block; height:90px; vertical-align:middle; }
.hp-services h2{ font-weight:400 !important; text-transform:uppercase !important;}
.hp-services a{ text-decoration:none; color:#2c2c2c; line-height:140%; display:block;  }


.about-section{ background:#f6f6f6; padding:20px;}

.testimonial-section {font-family: 'Oswald', sans-serif !important;padding:20px 0px;line-height:110%;}
.testimonial-section .headingsection{ background:url("../images/testimonials.png") no-repeat top center; height:70px; margin:20px 0px; }
.testimonials-hp{ padding:20px 0px; font-size:130%;line-height: 160%;}
.testimonial-name{ color:#999; font-size:60%; font-family:arial;margin:10px 0px;}

.twitter-section{background:#2452aa;	font-family: 'Oswald', sans-serif !important; color:#fff; padding:20px 0px; line-height:110%; }
.twitter-section a{ color:#ffae46;}
.twitter-section .headingsection{ background:url("../images/twitter-bird.png") no-repeat top center; height:70px;  margin:20px 0px; }
.twitter-hp{ color:#fff; font-size:130%;line-height: 160%; }
.twitter-name{ font-family:arial;font-size:60%; margin:10px 0px;}


.contact-hp { margin:0px auto; width: 50%; text-align:center;}
.contact-hp ul, .contact-hp li{ padding:0px; margin:0px; list-style:none; }
.contact-hp li label{ display:block; text-align:left; color:#999;}
.contact-hp li input, .contact-hp li textarea{ background:#f6f6f6; border-radius:2px; border:1px solid #ddd; width:100%;  margin:10px 0px 30px; padding:10px;  }
.contact-hp li textarea{ min-height:200px;}

.adress-hp{font-family: 'Oswald', sans-serif !important; text-align:center; text-transform:uppercase; background:#bbb; color:#fff; }
.adress-hp h1{ font-size:300%; line-height:130%;}
.adress-hp h1 strong{ color:#3683cd;}
.adress-hp h2{ font-size:250% !important; font-weight:100 !important; line-height:130%;}

footer{ background:#000; text-align:center; padding:20px 0px; color:#777; padding:40px 0px; display:block; clear:both; }
.footer{ margin-bottom:10px; }
.footer a{ display:inline-block; width:40px; height:40px; margin:0px 5px; }
.footer a.fb{ background:url("../images/icn-fb.png") no-repeat; }
.footer a.twitter{ background:url("../images/icn-twitter.png") no-repeat; }
.footer a.google{ background:url("../images/icn-google.png") no-repeat; }
.footer a.skype{ background:url("../images/icn-skype.png") no-repeat; }



.innerheader{ color:#fff;   
    background: #3c85d4;
    background: -moz-linear-gradient(90deg, #3c85d4 0%, #224aa4 100%);
    background: -webkit-linear-gradient(90deg, #3c85d4 0%, #224aa4 100%);
    background: -o-linear-gradient(90deg, #3c85d4 0%, #224aa4 100%);
    background: -ms-linear-gradient(90deg, #3c85d4 0%, #224aa4 100%);
    background: linear-gradient(90deg, #3c85d4 0%, #224aa4 100%);
	padding:10px 0px; }
	
.innerheader .indev{ max-width:1200px; margin:0px auto; padding:1%;}
.innerheader  h1{ font-size:300%; font-weight:400;}

.leftsection{ clear:both; height:100%;}
.leftsection .imgholder{ float:right; margin:10px;}
.leftsection{}

.rightsection{ clear:both; height:100%;}
.rightsection .imgholder{ float:left; margin:10px;}
.rightsection{}



/* == Memu == */


#nav {display:block; width:40px; height:40px; padding:0; margin:0; overflow:hidden; position:absolute; top:0; right:0; -webkit-transition:all 0.75s ease-in-out; transition:all 0.75s ease-in-out; -webkit-transform-origin:right; transform-origin:right}

#nav:hover, #nav:focus, #nav:active {overflow:visible; }


#nav li {display:block; padding:0; margin:0; height:0; width:0; overflow:hidden; visibility:hidden; text-align:right;float:left;}

#nav li a {color:#222222; display:block; width:100%; height:100%; -webkit-transition:all 0.3s ease-in-out; transition:all 0.3s ease-in-out; padding:5px 16px;}

#nav li a:hover { color:#3683cd; }

#nav:hover li {height:40px;     width: 300%; color:#fff;   opacity:1; visibility:visible;     margin-left: -200%;-webkit-transition:all 0.5s ease-in-out; transition:all 0.5s ease-in-out;  -webkit-transform-origin:right top; transform-origin:right top; text-align:right;}


#nav li.bars {disolay:block; width:40px; height:40px; overflow:hidden; background:grey; position:relative; cursor:pointer; opacity:1; visibility:visible; margin:0; padding:0}

#nav li.bars:before, #nav li.bars:after,#nav li.bars .line {display:block; content:""; background:#fff; height:4px; position:absolute; width:25px; border-radius:8px; left:8px; top:45%; margin:-8px 0 0; -webkit-transition:all 0.5s ease-in-out; transition:all 0.5s ease-in-out; }
#nav li.bars:before { margin-top:8px;}
#nav li.bars .line{ margin-top:0px;}
/*
#nav li.bars:before {-webkit-transform:translate(0,-8px); transform:translate(0,-8px)}
#nav li.bars:after {-webkit-transform:translate(0,8px); transform:translate(0,8px)}
*/
#nav li.bars:hover { color:blue; background:grey; margin:0}



@media screen and (min-width : 800px){

  #nav {overflow:visible; width:auto; display:inline-block; }

  #nav li,#nav li:hover, #nav:hover li {visibility:visible; display:inline-block; height:auto; width:auto; opacity:1; overflow:hidden; margin:auto; line-height:64px; overflow:hidden; }

  #nav li.bars {display:none; background:blue; }
}

@media screen and (max-width: 650px) {
.flex33p{ width:50%; }
.headersection{height:90px; }
.headersection .logo{ background-size:75%;}
.headersection .menu li{ padding:0px 5px; }
.innernav{height:80px;}

#nav li a{border-bottom:1px solid #eee; background:#fff;}
#nav li a:hover{background:#eee;}
}
 

@media screen and (max-width: 400px) {
.flex33p{ width:90%; }
.headersection{height:70px; }
.headersection .logo{ background-size:50%; height: 45px; margin: 25px auto 0px;}
.contact-hp{ width:70%;}
.headersection .menu li{ padding:0px 3px; }

}

/* Styles for contact form */
.error {
  color: #CC0000 !important;
  font-size: 12px;
  margin: 4px;
  font-style: italic;
  width: 200px;
}

.success {
  color: #009900 !important;
  font-size: 12px;
  margin: 4px;
  font-style: italic;
  width: 200px;
}


/* Mobile menu styles */

.mobileMenu{
  width: 230px;
  right: 0;
  position: absolute;
  display: none;
}

.mobileMenu .nav{
  background-color: white;
  max-width: 160px;
  min-width: 160px;
}

.mobileMenu .line{
  background: black !important;
}
.mobileMenu .nav li {
  height: 40px;
  width: 100%;
  color: #fff;
  opacity: 1;
  visibility: visible;
  text-align: right;
}

.mobileMenu .navbar-nav {
  margin: 0 !important;
}
.mobileMenu .navbar-collapse{
  float: right;
}
