img.below {
  opacity: 0;
  transition: opacity .2s ease-in;
} 


body {
    margin:0;
    padding:0;
    overflow-x:hidden;
    font-family:'Signika',sans-serif;
}

a {
    text-decoration: none;
    color:#000000;
}

p {
    font-size:11pt;
    font-family:'Varela',sans-serif;
    text-align:left;
    line-height:20pt;
    color:#3e3d39;
}

h1, h2, h3, h4, h5, h6 {
    margin:0;
    color:#313131;
}

h1 {
    font-weight:500;
    padding: 10px 0 20px;
    font-size: 25px;
}

textarea {
    resize:none;
}

.about {
    background-image:url('http://bugasaur.us/abt-bg-new.jpg');
    background-repeat: repeat;
    margin:0 0 10px;
    padding:0 0 50px;
}

.about-top {
    background-image:url('http://bugasaur.us/abt-top-new.jpg');
    background-repeat: repeat-x;
    height:10px;    
}

.blue-hdr {
    color:#074d6e;
}

.center {
    text-align:center;
}

.left {
    text-align:left;
}

/*.col-md-4 {
    float:left;
    position:relative;
    width:50%;
    text-align:center;
}

.col-md-6 {
    position:relative;
    width:100%;
    text-align:center;    
    float:left;
}

.col-md-9 {
    position:relative;
    width:100%;
    text-align:center;    
    float:left;
}

.col-md-4 img {
    width:100%;
    max-width:300px;
}

.col-md-6 img.test-img {
    width:100%;
    max-width:700px;
}

.col-6-inner {
    width:50%;
    margin:0 auto;
    padding:0;
}*/

.col-md-4 img {
    width:100%;
}

.col-md-6 {
    position:relative;
    width:100%;
    text-align:center;    
    float:left;
}

.col-md-6 img.test-img {
    width:100%;
    max-width:700px;
}



@media (min-width: 576px){
.container {
    max-width: none;
}
}
.contact {
    background: #adddf3; /* Old browsers */
background: -moz-linear-gradient(-80deg, #adddf3 0%, #c5e1ed 24%, #c8e3ee 30%, #cbe3ef 30%, #cde3f0 33%, #cde3ee 35%, #d1e8f0 39%, #d7e8f0 45%,  #e2eff5 75%, #ffffff 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-80deg, #adddf3 0%,#c5e1ed 24%,#c8e3ee 30%,#cbe3ef 30%,#cde3f0 33%,#cde3ee 35%,#d1e8f0 39%,#d7e8f0 45%, #e2eff5 75%,#ffffff 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(170deg, #adddf3 0%,#c5e1ed 24%,#c8e3ee 30%,#cbe3ef 30%,#cde3f0 33%,#cde3ee 35%,#d1e8f0 39%,#d7e8f0 45%, #e2eff5 75%,#ffffff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#adddf3', endColorstr='#ebf5f7',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

.contact ul {
    margin:50px auto;
}

.featured-work h1 {
    padding-top:0px;
}

.testimonials p {
    position:relative;
    margin:20px 40px;
}



.contact-info img {
width:30px;
padding:0 5px;
}

.container {
margin:0 25px 0 25px;
}

.container-inner {
    margin:0 auto;
    position:relative;
    padding: 0 20px;
}

.featured-desc {
    display:block;
    width: 100%;
    text-align: center;
    color: #000000;
    left: 0;
    z-index: 1;
    margin: 10px 0 0 0;
    padding: 0;
    font-family:'Varela',sans-serif;
    font-size:10pt;
}

span.featured-desc:hover:before {
    opacity:0.4 !important;
}

.featured-hover-bg {
    background:rgba(255,255,255,1);
    border-radius: 50%;
    display: block;
    margin: 0 auto;
    padding: 0;
    line-height: 0;
    text-align: center;
    transition:background .2sec ease-in;
}


.featured-work {
    padding:20px 0;
}

.featured-work a {
    transition:all .2sec ease-in;
}

.featured-work .col-md-4 {
    margin: 0;
    padding:5px;
    float:left;
}

.featured-work img {
    margin:0 auto;
    transition: opacity .2sec ease-in;
    z-index:2;
    position: relative;
    padding:0;
    text-align:center;
}

.featured-work img:hover {
    opacity:0.5 !important;
}



.featured-work a span {
    z-index:3;
    opacity:0;    
}

.featured-work a:hover span {
    opacity:1;
}

form[name="contactform"]{
    margin-bottom:100px;
}

.footer-image {
    text-align: center;
    width:100%;
    display:block;
}

.footer-image img {
    width:100%;
    max-width: 700px;
}

.footer-info {
    width:100%;
    display:block;
}

.footer-info p {
    float: left;
    font-size: 9pt;
}

.footer-info img  {
    float:right;
    width:30px;
}

.header {
    position:fixed;
    top:0;
    left:0;
    width:100%;
    background:#ffffff;
    z-index:1022;
    margin-bottom:0;
    display:block;
    font-family: 'Varela',sans-serif;
}

.header-logo {
    text-align:center;
    margin:0 auto;
    position:relative;
    display:block;
    padding:15px 0 0px;
}

.header-logo img {
    width:100%;
}

ul{
    list-style-type:none;
}

.header-nav ul li {
    display:inline;
}

.header-nav ul li a {
    text-decoration:none;
    font-size:9pt;
    color:#000000;
    margin:0px;
    padding:0 20px 8px;
    transition: all 0.2s ease;
    background-image:url('http://bugasaur.us/header-dot.png');
    background-position: 50% 50px;
    background-repeat: no-repeat;
    overflow:hidden;
}

.no-touch .header-nav ul li a:hover, .header-nav ul li a.active {
    background-image:url('http://bugasaur.us/header-dot.png');
    background-position: 50% bottom;
    background-repeat: no-repeat;
}



/*.header-nav {
position:absolute;
bottom:0;
right:25px;
float:right;
}*/

input {
    height:35px;
    color:#FFFFFF;
    font-size:14pt;
}

input:focus {
    background:rgba(7,77,110,.3);
}

input, textarea {
    width:100%;
    border: medium none;
    background:rgba(0,0,0,.1);
    margin:0;
    padding:10px 0 10px 0px;
    color: #FFFFFF;
    font-size: 14pt;
}

input[type="submit"]{
    background: #fce200;
    font-family:'Varela',sans-serif;
    font-size: 20px;
    color: #ffffff;
    margin:20px 0 0 0;
    padding: 20px 0 45px;
    -webkit-appearance: none;
}

.intro {
    z-index: 1000;
    width: 100%;
    top: 25%;
    font-size: 1em;
    text-align: center;
    color: #FFF;
    position: absolute;
    background-image: url('http://bugasaur.us/frame-2.png');
    background-size: contain;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    padding: 10px 0 15px 0;
}

.intro p {
    color:#ffffff;
}

.jumbotron-hero {
    position: relative;
    height: 100%;
    left: 0px;
    top: 0px;
    width: 100%;
        box-sizing:content-box;
    -webkit-box-sizing:content-box;
    -moz-box-sizing:content-box;
}

.jumbotron-inner {
    background-image: url("http://bugasaur.us/jumbotron-1.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center 80px;
    display: block;
    width: 100%;
    height:100%;
    box-sizing:content-box;
    -webkit-box-sizing:content-box;
    -moz-box-sizing:content-box;
}

.jumbo-subhead {
    text-align: center;
     font-size: 20px;
     padding: 0px;
     margin: 2px;
     text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.6);
     font-family: 'Signika',sans-serif;
     letter-spacing: .05em;
}

.ms-tableCell {
    display: table-cell;
    vertical-align: middle;
    width: 100%;
    height: 100%;
    }

.testimonials .row {
    display:block;
}

.portfolio-categories {
    margin: 20px 0;
    font-family: Varela;
    font-size: 13px;
}

.portfolio-categories a {
    padding:5px 10px;
    margin:10px 10px 10px 0;
    border:1px solid #dddddd;
    box-shadow:2px 2px 2px #cccccc;
    cursor:pointer;
}

.portfolio-categories a:hover {
    color:#666;
}

.push-right {
    float:right !important;
} 

.quote-left {
    position:absolute;
    top:0;
    left:0;
}  

.quote-right {
    position:absolute;
    bottom:0;
    right:0;
}

.row {
    margin:0 0 0 0;
    background:#ffffff repeat;
}

textarea {
    height:90px;
}

.testimonials .col-md-6 {
   padding:0; 
}

.top-right {
    position:absolute;
    top:0;
    right:0;
} 

.work-1 {
    background-image:url('http://bugasaur.us/work-1.png');
    background-repeat:no-repeat;
    background-position:top center;
}

.work-2 {
    background-image:url('http://bugasaur.us/work-2.png');
    background-repeat:no-repeat;
    background-position:top center;
}

.work-3 {
    background-image:url('http://bugasaur.us/work-3.png');
    background-repeat:no-repeat;
    background-position:top center;
}

.work-4 {
    background-image:url('http://bugasaur.us/work-4.png');
    background-repeat:no-repeat;
    background-position:top center;
}
 
.container-inner:after, .row:after {
  content: "";
  display: table;
  clear: both;
}

/* LOADER CSS */
.loader {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    text-align:center;
    background:#FFFFFF;
}

.loader-inner {
    width: 120px;
    margin: 0 auto;
    position: absolute;
    top: calc(50% - 60px);
    left: calc(50% - 60px);
    height: 120px;
}

.loader-inner img {
    position:absolute;
}

.loader-1 {
left:53px;
top:3px;
width:63px;
height:36px;    
}

.loader-2 {
left:85px;
top:36px;
width:35px;
height:62px;    
}

.loader-3 {
left:48px;
top:67px;
width:55px;
height:53px;    
}

.loader-4 {
left:2px;
top:81px;
width:67px;
height:36px;    
}

.loader-5 {
left:0px;
top:26px;
width:35px;
height:58px;    
}

.loader-6 {
top:0px;
left:16px;
width:56px;
height:53px;    
}

.loader-bug {
top:42px;
left:32px;
width:56px;
height:36px;    
}

.loader-1.blue {
    animation: loader-1-blue 2s 1 ease-in-out;
    -webkit-animation: loader-1-blue 2s 1 ease-in-out;
-moz-animation: loader-1-blue 2s 1 ease-in-out;
    -ms-animation: loader-1-blue 2s 1 ease-in-out;
}

.loader-2.blue {
    animation: loader-2-blue 2s 1 ease-in-out;
    -webkit-animation: loader-2-blue 2s 1 ease-in-out;
-moz-animation: loader-2-blue 2s 1 ease-in-out;
    -ms-animation: loader-2-blue 2s 1 ease-in-out;
}

.loader-3.blue {
    animation: loader-3-blue 2s 1 ease-in-out;
    -webkit-animation: loader-3-blue 2s 1 ease-in-out;
-moz-animation: loader-3-blue 2s 1 ease-in-out;
    -ms-animation: loader-3-blue 2s 1 ease-in-out;
}

.loader-4.blue {
    animation: loader-4-blue 2s 1 ease-in-out;
    -webkit-animation: loader-4-blue 2s 1 ease-in-out;
-moz-animation: loader-4-blue 2s 1 ease-in-out;
    -ms-animation: loader-4-blue 2s 1 ease-in-out;
}

.loader-5.blue {
    animation: loader-5-blue 2s 1 ease-in-out;
    -webkit-animation: loader-5-blue 2s 1 ease-in-out;
-moz-animation: loader-5-blue 2s 1 ease-in-out;
    -ms-animation: loader-5-blue 2s 1 ease-in-out;
}

.loader-6.blue {
    animation: loader-6-blue 2s 1 ease-in-out;
    -webkit-animation: loader-6-blue 2s 1 ease-in-out;
-moz-animation: loader-6-blue 2s 1 ease-in-out;
    -ms-animation: loader-6-blue 2s 1 ease-in-out;
}

.blue {
    z-index:10000;
    opacity:0;

}

.brown {
    z-index: 10001;
}

.red {
    z-index: 10002;
}

@keyframes loader-1-blue {
    0% {opacity:0;}
    25% {opacity:1;}
    50% {opacity:1;}
    75% {opacity:0;}
    100% {opacity:0;}
}

@-moz-keyframes loader-1-blue {
    0% {opacity:0;}
    25% {opacity:1;}
    50% {opacity:1;}
    75% {opacity:0;}
    100% {opacity:0;}
}

@-ms-keyframes loader-1-blue {
    0% {opacity:0;}
    25% {opacity:1;}
    50% {opacity:1;}
    75% {opacity:0;}
    100% {opacity:0;}
}

@-webkit-keyframes loader-1-blue {
    0% {opacity:0;}
    25% {opacity:1;}
    50% {opacity:1;}
    75% {opacity:0;}
    100% {opacity:0;}
}

@keyframes loader-2-blue {
    0% {opacity:0;}
    8% {opacity:0;}
    33% {opacity:1;}
    55% {opacity:1;}
    80% {opacity:0;}
    100% {opacity:0;}
}

@-moz-keyframes loader-2-blue {
    0% {opacity:0;}
    8% {opacity:0;}
    33% {opacity:1;}
    55% {opacity:1;}
    80% {opacity:0;}
    100% {opacity:0;}
}

@-ms-keyframes loader-2-blue {
    0% {opacity:0;}
    8% {opacity:0;}
    33% {opacity:1;}
    55% {opacity:1;}
    80% {opacity:0;}
    100% {opacity:0;}
}

@-webkit-keyframes loader-2-blue {
    0% {opacity:0;}
    8% {opacity:0;}
    33% {opacity:1;}
    55% {opacity:1;}
    80% {opacity:0;}
    100% {opacity:0;}
}

@keyframes loader-3-blue {
    0% {opacity:0;}
    16% {opacity:0;}
    41% {opacity:1;}
    55% {opacity:1;}
    60% {opacity:1;}
    85% {opacity:0;}
    100% {opacity:0;}
}

@-moz-keyframes loader-3-blue {
    0% {opacity:0;}
    16% {opacity:0;}
    41% {opacity:1;}
    55% {opacity:1;}
    60% {opacity:1;}
    85% {opacity:0;}
    100% {opacity:0;}
}

@-ms-keyframes loader-3-blue {
    0% {opacity:0;}
    16% {opacity:0;}
    41% {opacity:1;}
    55% {opacity:1;}
    60% {opacity:1;}
    85% {opacity:0;}
    100% {opacity:0;}
}

@-webkit-keyframes loader-3-blue {
    0% {opacity:0;}
    16% {opacity:0;}
    41% {opacity:1;}
    55% {opacity:1;}
    60% {opacity:1;}
    85% {opacity:0;}
    100% {opacity:0;}
}

@keyframes loader-4-blue {
    0% {opacity:0;}
    24% {opacity:0;}
    49% {opacity:1;}
    55% {opacity:1;}
    65% {opacity:1;}
    90% {opacity:0;}
    100% {opacity:0;}
}

@-moz-keyframes loader-4-blue {
    0% {opacity:0;}
    24% {opacity:0;}
    49% {opacity:1;}
    55% {opacity:1;}
    65% {opacity:1;}
    90% {opacity:0;}
    100% {opacity:0;}
}

@-ms-keyframes loader-4-blue {
    0% {opacity:0;}
    24% {opacity:0;}
    49% {opacity:1;}
    55% {opacity:1;}
    65% {opacity:1;}
    90% {opacity:0;}
    100% {opacity:0;}
}

@-webkit-keyframes loader-4-blue {
    0% {opacity:0;}
    24% {opacity:0;}
    49% {opacity:1;}
    55% {opacity:1;}
    65% {opacity:1;}
    90% {opacity:0;}
    100% {opacity:0;}
}

@keyframes loader-5-blue {
    0% {opacity:0;}
    32% {opacity:0;}
    57% {opacity:1;}
    70% {opacity:1;}
    95% {opacity:0;}
    100% {opacity:0;}
}

@-moz-keyframes loader-5-blue {
    0% {opacity:0;}
    32% {opacity:0;}
    57% {opacity:1;}
    70% {opacity:1;}
    95% {opacity:0;}
    100% {opacity:0;}
}

@-ms-keyframes loader-5-blue {
    0% {opacity:0;}
    32% {opacity:0;}
    57% {opacity:1;}
    70% {opacity:1;}
    95% {opacity:0;}
    100% {opacity:0;}
}

@-webkit-keyframes loader-5-blue {
    0% {opacity:0;}
    32% {opacity:0;}
    57% {opacity:1;}
    70% {opacity:1;}
    95% {opacity:0;}
    100% {opacity:0;}
}

@keyframes loader-6-blue {
    0% {opacity:0;}
    40% {opacity:0;}
    65% {opacity:1;}
    75% {opacity:1;}
    100% {opacity:0;}
}

@-moz-keyframes loader-6-blue {
    0% {opacity:0;}
    40% {opacity:0;}
    65% {opacity:1;}
    75% {opacity:1;}
    100% {opacity:0;}
}

@-ms-keyframes loader-6-blue {
    0% {opacity:0;}
    40% {opacity:0;}
    65% {opacity:1;}
    75% {opacity:1;}
    100% {opacity:0;}
}

@-webkit-keyframes loader-6-blue {
    0% {opacity:0;}
    40% {opacity:0;}
    65% {opacity:1;}
    75% {opacity:1;}
    100% {opacity:0;}
}

@media (min-width: 500px){
    p {
    font-size:12pt;
    font-family:'Varela',sans-serif;
    text-align:left;
    line-height:23pt;
    }

    .testimonials p {
    position:relative;
    margin:40px;
}

.header-nav ul li a {
    font-size:11pt;
}

h1 {
    padding:80px 0 40px;
    font-size:50px;
}

.jumbo-subhead {
    font-size:27px;
}

.featured-work {
    padding:50px 0;
}
}


@media (min-width: 992px) {
/*.col-md-3 {
    width:25%;
}

.col-md-4 {
    width: 33.33333333%;
}

.col-md-6 {
    width: 50%;
}

.col-md-9 {
    width: 75%;
}*/

.container-inner {
    width: 990px;
}

input[type="submit"]{
    width:200px;
}
}

@media (max-width:767px) {
    .header-nav {
        float:none;
        position:relative;
        right:0;
        bottom:0;
    }

    .header-nav ul {
        text-align: center;
        padding:0;
        margin:0 auto 10px;
    }

    .header-logo.desktop {
        display:none;
    }

    .header-logo.mob{
    width:170px;
    }

    .col-6-inner {
    width:100%;
    margin:0 auto;
    }
}

@media (min-width:768px) {
    .header-nav {
        position:absolute;
        bottom:0;
        right:25px;
        float:right;
    }

    .header-logo.mob {
        display:none;
    }

    .header-logo.desktop {
    width:200px;
    }

    .col-6-inner {
    width:50%;
    margin:0 auto;
    }

    .jumbotron-inner {
            background-attachment:fixed;
    }
}