﻿@import url('https://fonts.googleapis.com/css?family=Open+Sans');
@import url('https://fonts.googleapis.com/css?family=Dosis');
@import url('https://fonts.googleapis.com/css?family=Ubuntu');


body 
{

}

.row
{
    margin-left:0;
    margin-right:0;
}

.HeaderTitle
{
   color:#FF6C00;
   display:inline;
   font-size:x-large;
}

page-scroll a,a:hover
{
    text-decoration:none;
}


.navbar-custom,header .intro-text .name{font-family:Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;text-transform:uppercase}

hr.star-light{border-color:#fff}

hr.star-light:after{background-color:#18BC9C;color:#fff}

hr.star-primary{border-color:#2C3E50}

hr.star-primary:after{background-color:#fff;color:#2C3E50}

.navbar-custom .navbar-brand,.navbar-custom .navbar-brand.active,.navbar-custom .navbar-brand:active,.navbar-custom .navbar-brand:focus,.navbar-custom .navbar-brand:hover,.navbar-custom .navbar-nav li a,header{color:#fff}

.img-centered{margin:0 auto}

header{text-align:center;background:#562304}

header .container{padding-top:150px;padding-bottom:50px}

header img{display:block;margin:0 auto 20px; width:100%; height:auto;}

header .intro-text .name{display:block;font-weight:700;font-size:2em}
header .intro-text .skills{font-size:1.25em;font-weight:300}

@media (min-width:768px){
header .container{padding-top:200px;padding-bottom:100px}
header .intro-text .name{font-size:4.75em}
header .intro-text.skills{font-size:1.75em}}

.navbar-custom{background:#E8F8FF;font-weight:700;border:none}
.navbar-custom a:focus{outline:0}
.navbar-custom .navbar-nav{letter-spacing:1px}

.navbar-custom .navbar-nav li a{color:#000;}
.navbar-custom .navbar-nav li a:hover
{
    color:#FFF;
    background-color:#000;
    outline:0;
    /* Safari 3-4, iOS 1-3.2, Android 1.6- */
  -webkit-border-radius: 12px; 

  /* Firefox 1-3.6 */
  -moz-border-radius: 12px; 
  
  /* Opera 10.5, IE 9, Safari 5, Chrome, Firefox 4, iOS 4, Android 2.1+ */
  border-radius: 12px; 
  border:1px solid #000;
}
.navbar-custom .navbar-nav li a:active,.navbar-custom .navbar-nav li a:focus{color:#fff}
.navbar-custom .navbar-nav li.active a,.navbar-custom .navbar-nav li.active a:active,.navbar-custom .navbar-nav li.active a:focus,.navbar-custom .navbar-nav li.active a:hover{color:#fff;background:#18BC9C}
.navbar-custom .navbar-toggle{color:#000;text-transform:uppercase;font-size:10px;border-color:#CFCFCF}
.navbar-custom .navbar-toggle:focus,.navbar-custom .navbar-toggle:hover{background-color:#008BD3;color:#fff;border-color:#000000}

.welcomepart
{
    width:100%;
    height:auto;
    background-color:#D4FFAA;
    padding-bottom:20px;
}

.welcomepart h2
{
    color:#C2021D;
   text-shadow:#A2A2A2 2px 2px 3px;
}

.welcomepart p
{
    color:#1D3B00;
    font-size:large;
    text-indent:100px;
    text-align:justify;
    line-height:40px;
    
}


.jumbotron_custom
{
    background:#650311;
    width:90%;
    margin:0 auto;
    padding:20px;
      /* Safari 3-4, iOS 1-3.2, Android 1.6- */
  -webkit-border-radius: 2px; 

  /* Firefox 1-3.6 */
  -moz-border-radius: 12px; 
  
  /* Opera 10.5, IE 9, Safari 5, Chrome, Firefox 4, iOS 4, Android 2.1+ */
  border-radius: 12px; 
  border:1px solid #000;
  margin-bottom:20px;
  -moz-box-shadow:    3px 3px 5px 6px #B89595;
  -webkit-box-shadow: 3px 3px 5px 6px #B89595;
  box-shadow:         3px 3px 5px 6px #B89595;
}

.jumbotron_custom p
{
    color:#fff;  
    text-align:left;
    line-height:40px;  
    font-family:Lucida Bright;
    font-size:x-large;
    text-indent:40px;
}

.jumbotron_custom .quoatemark img
{
     height:20px;
     margin:0 auto;
}

.aboutus-container {
    position: relative;
    background: #000 url("../img/aboutus-bg.jpg");
    width: 100%;
    height:auto;
    background-size: cover;
    overflow:auto;
    color:#FFF;
    background-repeat: no-repeat;
    /*background-attachment: fixed;   */ 
}

.aboutus-title
{
    font-family:Arial;
    font-weight:bold;    
    color:#FFF;
    text-align:center;
}

.aboutus-col
{
    background-color:#FAFAFA;
    color:#000;    
    -moz-box-shadow:    2px 2px 5px 2px #FFF;
    -webkit-box-shadow: 2px 2px 5px 2px #FFF;
    box-shadow: 2px 2px 5px 2px #FFF;
    height:500px;
}

.aboutus-box-img
{
    width: 100%;
    height: auto;
    border-bottom:1px solid #DBDDDE;
    padding-bottom:15px;
}


.aboutus-box-title
{
    font-family:Dosis;
    text-align:center;
    color:#0097C9;
}

.aboutus-box-para
{
    font-family:Dosis;
    text-align:justify;
    text-indent:50px;
    font-size:large;
    color:#000;
}


.service-container 
{
    width: 100%;
    color:#FFF;
    background-color:#00506A;
    background: #000 url("../img/service-bg-img.jpg");
    min-height:200px;    
    
    background-position: 50% 0;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
}


.service-container-whatwedo
{
    color:#B2B2B2;
    text-align:center;
    font-family:Ubuntu;
    font-size:100px;
    display: inline-block;
    vertical-align:middle;
    height:300px;
    width:100%;
    margin-top:250px;
}

.servicepanel-container
{
    width: 100%;
    color:#FFF;
    /*background-color:#00506A;*/
    background: #000 url("../img/service-panel-bg-img.jpg");
    min-height:200px;    
    /*background-attachment: fixed;*/
    background-position: 50% 0;
    background-repeat: no-repeat;
    background-size: cover;
}

.service-panel{
    margin-top:100px;
    margin-bottom:100px;
}

.panel > .panel-heading {   
    background-color: #D47800;
}

.panel > .panel-default
{
        
}

.panel-title
{
    color: #FFF;
    font-family: 'Dosis';
    font-size:large;
    font-weight:bold; 
}

.panel-title a,a:visited,a:hover
{
    text-decoration:none;
}

.panel-body
{
    font-family: 'Dosis';
    font-size:large;
    color:#FFF;
    text-align:justify;
    text-indent:100px;
    background-color:#573202;
    opacity: 0.7;
}

.contact-container
{
    width: 100%;
    background: #000 url("../img/contact-panel-bg-img.jpg");
    background-attachment: fixed;
    background-position: 50% 0;
    background-repeat: no-repeat;
    background-size: cover;
    color:#FFF;
}

.contact-container-part
{
    margin-top:50px;
    margin-bottom:50px;
}
.contact-container-address-part
{
    text-align:center;
    margin:auto 0;
    font-size:larger;
    font-family:Verdana;
}

.social a,a:visited
{
    margin-left:30px;
}
.social-icon
{
    color: #fff;
    text-shadow: 1px 1px 1px #ccc;
    font-size: 1.5em;
}


.btn-custom,
.btn-custom:active,
.btn-custom:visited,
.btn-custom:focus {
    background-color: #00698C;
    border-color: #8064A2;
    color:#FFF;
    margin-bottom:20px;
}

.btn-custom:hover
{
    background-color: #079CCD;
    border-color: #8064A2;
    color:#FFF; 
}




@media (min-width:768px){
.navbar-custom{padding:25px 0;-webkit-transition:padding .3s;-moz-transition:padding .3s;transition:padding .3s}
.navbar-custom .navbar-brand{font-size:2em;-webkit-transition:all .3s;-moz-transition:all .3s;transition:all .3s}
.navbar-custom.affix{padding:10px 0}
.navbar-custom.affix .navbar-brand{font-size:1.5em}


.col-md-4 {
    margin-left:11px;
    width:31.6%; 
}

}

@media only screen and (max-device-width:768px){

.aboutus-col
{
    background-color:#FAFAFA;
    color:#000;    
       -moz-box-shadow:    2px 2px 5px 2px #FFF;
    -webkit-box-shadow: 2px 2px 5px 2px #FFF;
            box-shadow: 2px 2px 5px 2px #FFF;
    height:auto;
    width:100%;
}   

.service-container-whatwedo
{
    font-size:60px;
    text-align:center;
    width: 100%;
}

}

@media only screen and (max-device-width: 455px),
only screen and (max-device-width: 320px),
only screen and (max-device-width: 320px),
only screen and (max-device-width: 414px), 
only screen and (max-device-width: 400px), 
only screen and (max-device-width: 480px) 
{
    .HeaderTitle
{
    color:#FF6C00;
   display:inline;
   
   font-size:larger;

 }
 
.service-container-whatwedo
{
    font-size:60px;
    text-align:center;
     width: 100%;
}
 
 .navbar-left img
 {
  width:20%;
     
 }


 
 .fa fa-bars
 {
     
 }
}