@import "css/normalise.css";
@import "css/grid.css";
@import "css/font-awesome.min.css";
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,300italic,400,400italic,600,600italic,700,700italic,800,800italic);



* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-font-smoothing: antialiased; /* Fix for webkit rendering */
  -webkit-text-size-adjust: 100%;
}

html {overflow-y: scroll;position:static!important;top:0!important;}
html, body {
  height: 100%;
  margin:0;
}

.small {font-size: 80%;}
.large {font-size: 150%;}
.center {text-align: center;}
.center img {margin:0 auto;}
.nopad {padding:0;}
.left {float:left;}
.right {float:right;text-align:right;}


hr {margin:2em 0 1.5em 0; border-width: 0;border-top: 1px solid #E1E1E1; clear:both;}


/* Responsive images //////////////////////////////////////////////////////////////////// */
img {
  max-width: 100%;
  max-width: auto;
  height: auto;
    display:block;
}

img#top-logo {
  max-height: 130px;
  padding: 20px;
}

/* Typography /////////////////////////////////////////////////////////////////////////// */
body {
  font-family: "Open Sans", Arial, sans-serif;
  font-weight:normal;
  font-size: 16px;
  line-height: 1.6em;
  color: #555;
  background:#EEE;
}

a:link, a:visited, a:active {
  text-decoration: none;
  color: #06C;;
  font-weight:700;
}
a:hover {color: #06C;}

p {margin:0 0 15px 0;}

h1, h2, h3, h4, h5, h6 {clear:both;float:none;letter-spacing: -0.02em;margin:0;padding: 0 0 0 0;line-height:1.2em;}
h1 {font-size:2.1em;}
h2 {font-size:2em;}
h3 {font-size:1.9em;}
h4 {font-size:1.75em;}
h5 {font-size:1.5em;font-weight:normal;}
h6 {font-size:1.3em;}


blockquote {display:block;font-size:1.6em;font-style: italic;color:#999;font-weight:300;margin:30px 0;padding:30px;border-top:1px solid #EEE;border-bottom:1px solid #EEE;text-align: center;line-height:1.2em;}
cite {display:block; font-size:0.65em; text-transform:uppercase; font-style: normal; color:#444; font-weight:700;padding-top:20px;}


/* Lists ///////////////////////////////////////////////////////////////////////// */

ol, ul {padding-left: .5em;margin: 20px 0 0 20px;}
ul ul,ol ul {margin: .5em 0 .5em 3em;font-size: 95%; list-style: circle inside; }
ul ol,ol ol {margin: .5em 0 .5em 3em;font-size: 95%; list-style: lower-alpha; inside; }
li {padding-left: .5em;}

/* bold the numerals in an ordered list */
ol {list-style-type:none; margin: 0;counter-reset: my-counter;}
ol li:before {
    content: counter(my-counter, decimal) ")";
    counter-increment: my-counter;
    margin-right: 15px;
    font-weight: bold;
    text-align: right;
    padding:0;
}







/* ///////////////////////////////   S E C T I O N S   /////////////////////////////// */

#intro, #info, #process {margin-top:10px;}

section {clear:both;}
section#content {padding:10px 30px;}
section#footer {padding:0 30px;}



/* Header ///////////////////////////////////////////////////////////////////////////// */

#header {
    width: 100%;
    background: #fff;
    height:130px;
    display:block;
    background-position:  center center;
    background-repeat:    no-repeat;
    background-size:      cover;
}

#splash {
    width: 100%;
    background: #FFF;
    height:420px;
    display:block;
    background-image:   url('images/forest-road.jpg');
    background-position:  center center;
    background-repeat:    no-repeat;
    background-size:      cover;
}


div.title {
  background:#000;
  padding:20px;
  position:absolute;
  left:0;
  color:#fff;
  font-weight:300;
  font-size:2em;
  line-height:2em;
}

/* Content ///////////////////////////////////////////////////////////////////////////// */

#content {background: #FFF;}

/* button 1 content on body///////////////////////////////////////////////////////////////////////////// */
.btn.orange1:hover, .btn.orange1:focus {
  background-color: rgb(113, 191, 68);
}

.btn.orange1 {
  position: relative;
  
  display: block;
  margin: 30px 70px auto;
  padding: 25px 5px 10px 5px;

  overflow: hidden;

  border-width: 0;
  outline: none;
  border-radius: 10px;
  box-shadow: 0 3px 6px rgba(0, 0, 0, .6);
  
  background-color: #e67e22;
  color: #ecf0f1;
  
  transition: background-color .5s;
}

/* button 2 content on body///////////////////////////////////////////////////////////////////////////// */
.btn.orange2:hover, .btn.orange2:focus {
  background-color: rgb(113, 191, 68);
}

.btn.orange2 {
  position: relative;

  display: block;
  margin: 30px 70px auto;
  padding: 25px 5px 10px 5px;

  overflow: hidden;

  border-width: 0;
  outline: none;
  border-radius: 10px;
  box-shadow: 0 3px 6px rgba(0, 0, 0, .6);
  
  background-color: #e67e22;
  color: #ecf0f1;
  
  transition: background-color .5s;
}

/* button 3 content on body///////////////////////////////////////////////////////////////////////////// */
.btn.orange3:hover, .btn.orange3:focus {
  background-color: rgb(113, 191, 68);
}

.btn.orange3 {
  position: relative;

  display: block;
  margin: 30px 70px auto;
  padding: 25px 5px 10px 5px;

  overflow: hidden;

  border-width: 0;
  outline: none;
  border-radius: 10px;
  box-shadow: 0 3px 6px rgba(0, 0, 0, .6);
  
  background-color: #e67e22;
  color: #ecf0f1;
  
  transition: background-color .5s;
}


.btn > * {
  position: relative;
}

.btn span {
  display: block;
  padding: 6px 24px;
}

.btn:before {
  content: "";
  
  position: absolute;
  top: 50%;
  left: 50%;
  
  display: block;
  width: 0;
  padding-top: 0;
    
  border-radius: 100%;
  
  background-color: rgba(236, 240, 241, .3);
  
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.btn:active:before {
  width: 100%;
  padding-top: 100%;
  
  transition: width .2s ease-out, padding-top .2s ease-out;
}
/* intro on body ///////////////////////////////////////////////////////////////////////////// */
.intro {
  font-size:3em;
  font-weight:600;
  line-height: 1.2em;
  color:#fff;
  padding:20px 0 40px 20px;
  position: absolute;
  bottom:0px;
  text-shadow: 0 3px 10px rgba(0, 0, 0, 1);

}

.expertise {
  text-align: center;
  padding-bottom: 10px;
}

#experience {
  font-weight: 600;
  font-size: 1.2em;
}

#experience div.col {
  padding-bottom: 10px;
}

#table{margin:30px 0;}
#table .row {background:#f5f5f5;border-bottom:2px solid #fff;}
#table .cell {padding:10px 20px;}

#info p {padding-right:30px;}

/* Footer ///////////////////////////////////////////////////////////////////////////// */

#header ul {
  list-style: none;
  padding:0;
  margin:0;
}

.contact {
  position: absolute;
  bottom: 10px;
  right: 0px;
  text-align: right;
}

.contact li {
    padding:0 0 5px 30px;
    position:relative;
    display: inline;
    margin-right: 30px;
}

.contact li a { font-weight: bold;font-size:1em;}

/* awsomefont icons for contacts ///////////////////////////////////////////////////////////////////////////// */
.contact li:before {
  font-family: 'FontAwesome';
  font-style: normal;
  font-weight: normal;
  text-decoration: inherit;
  position:absolute;
  margin-left:-25px;
  color:#F7941E ;
}

.improved-list {
  text-align: left;
  margin: auto;
  width: 80%;
}

.improved-list-heading {
  font-weight: bold;
  font-size: larger;
}

.improved-list li:before {
  content: counter(my-counter, decimal) ".";
  font-size: larger;
}

li.phone:before {content: "\f095";   font-size:1.3em;}
li.fax:before {content: "\f1ac";   font-size:1.3em;}
li.email:before {content: "\f0e0";   font-size:1.2em;}
li.web:before {content: "\f0ac";     font-size:1.2em;}
li.location:before {content: "\f041";font-size:1.4em;}

/* awsomefont icons for pdf links ///////////////////////////////////////////////////////////////////////////// */
.pdf:before {
  font-family: 'FontAwesome';
  font-style: normal;
  font-weight: normal;
  text-decoration: inherit;
  position: relative;
  content: "\f1c1";font-size:1.4em;
  display: inline;
}

div.copyright {
  text-align:center;
  padding:5px 0;
  font-size:.85em;
  margin-top:5px;
}

img.markets {
  width: 200px;
  padding-bottom: 15px;
}

/* ///////////////////////////////   MEDIA QUERIES   /////////////////////////////// */
@media all and (max-width: 910px) {

  section#content {padding:30px 20px;}
  section#footer {padding:0 20px;}

  #header {height:250px;
  }
  div.title {
    padding:15px;
    font-size:1.7em;
    line-height:1.7em;
  }

  .contact {
    text-align: center;
  }

  #top-logo {
    margin:auto;
    content:url("images/logo.png");
    max-height:150px;
  }

  #splash {
    height: 200px;
  }


  #intro {text-align:center;}
  #intro img {margin:0 auto;}

  .intro {
    font-size:1.2em;

  }

  .improved-list {
  width: 100%;
  }

}

@media only screen and (max-width: 480px) {

  div.title {
  width:100%;
  text-align:center;
  padding:10px;
  font-size:1.5em;
  line-height:1.5em;
  }
}