/* Typography ---------------------- */
body {background:#fff; font-family: "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif; sans-serif;font-size: 19px; font-size: 1.9rem; color:#fff;}
h1 { font-size: 42px;   }
h1.title { text-shadow: 3px 3px 0px #2c2e38, 5px 5px 0px #5c5f72; padding:14px 0; margin-bottom:32px;}
h1 span {  display:block; color:#8ab28d;  text-shadow: 3px 3px 0px #2c2e38, 5px 5px 0px #000; padding-top:12px;}
h2 { font-size: 33px; }
h2.title { font-size: 42px; text-shadow: 3px 3px 0px #2c2e38, 5px 5px 0px #5c5f72; padding:14px 0 6px; margin:12px 0 8px; }
h3 { font-size: 23px; }
h4 { font-size: 18px; }
h5 { font-size: 15px;}
h6 { font-size: 13px; }
a { color: #fff; text-decoration: none; line-height: inherit; }
a:hover { text-decoration: none; color: #ccc; }
a:focus { color:#fff; outline: none; }
p span { display: block;}

.margintop {margin-top:50px;}
.paddingtop {padding-top:25px;}
.smallpadding {padding-bottom:5px;}

iframe { border: none; }
label {color:#fff;}

hr.embossed {background: url(../images/embossed.png) repeat-x; height:2px;border: none;  }
hr.embossed-red {background: url(../images/embossed-red.png) repeat-x; height:2px;border: none;  }
hr.embossed-green {background: url(../images/embossed-green.png) repeat-x; height:2px;border: none;  }
hr.embossed-mauve {background: url(../images/embossed-mauve.png) repeat-x; height:2px;border: none;  }
hr.embossed-brown {background: url(../images/embossed-brown.png) repeat-x; height:2px;border: none;  }

hr.black { border: solid #46332b; border-width: 1px 0 0; clear: both; margin: 12px 0 11px; height: 0; }
.copyrights{text-indent:-9999px;height:0;line-height:0;font-size:0;overflow:hidden;}

.slider
{
  box-shadow: 0px 1px 8px #000;
  -webkit-box-shadow: 0px 1px 8px #000;
  -moz-box-shadow: 0px 1px 8px #000;
	}

.close {background:#000; padding:10px; float:right; margin-top:-50px;display: none;}

#back-to-top { position:fixed; bottom:20px; right:20px; z-index:99; display:none; }
#back-to-top img a{border:none}

@media only screen and (max-width: 767px) { 
h2.title { text-align:center; }
.close {float:none; text-align:center; margin:0 auto}
}

/* WELCOME ---------------------- */
#welcome {background:url(../images/backgrounds/welcome-bg.jpg); width:100%; padding-bottom:40px; border-top:3px solid #141414;}
.logo {text-align:left; color:#8ab28d; font-size:65px; padding-top:20px;text-shadow : 1px 2px 5px black}

#welcome p { font-size:23px; line-height:25px; color:#e6e6e6;}

@media only screen and (max-width: 767px) { 
.logo {text-align:center; margin-bottom:25px}
}


/* Navigation ---------------------- */
ul.top { padding:0; margin:0 auto; margin-top:39px; list-style-type:none;}
ul.top li { float:left; display:inline; margin-right:29px;  padding:0;}
ul.top li:last-child { margin-right:0; }
ul.top li a{ color:#fff; font-size:24px; font-weight:normal;  padding:40px 0;text-shadow : 1px 2px 5px black }
ul.top li a.active, ul.top li a:hover{ border-bottom:1px solid #8ab28d; color:#8ab28d }

nav .dropdown {display: none;}

@media only screen and (max-width: 767px) { 
nav .dropdown {display: inline-block; width:100%; margin:0 auto; margin-top:15px; margin-bottom:15px;}
nav ul.top { display:none;  }
}



/* Portfolio Section ---------------------- */
#portfolio {background:url(../images/backgrounds/portfolio-bg.jpg); width:100%; overflow-y: hidden; padding-bottom:40px; border-top:3px solid #141414;}
#project-titles {margin-bottom:40px; margin-top:20px}
#project-descriptions>div {display:none}
#project-descriptions img {margin-bottom:13px;box-shadow: 0px 1px 8px #000;
  -webkit-box-shadow: 0px 1px 8px #000;
  -moz-box-shadow: 0px 1px 8px #000;}
.projects li {font-size:11px;position:relative;}
.projects li img.a {position:relative;z-index: 10;cursor:pointer;width:100%;box-shadow: 0px 1px 8px #000;
  -webkit-box-shadow: 0px 1px 8px #000;
  -moz-box-shadow: 0px 1px 8px #000;}
.projects li p.b {position:absolute;top:15px; width:100%; height:100%; left:0px;	}
.projects li p.b img{max-width:180px; text-align:center; margin:0 auto; display:block}
.projects li p.b span{font-size:17px;position:absolute; bottom:40px; width:100%; text-align:center; display:block; }

#project-descriptions h2 { font-size: 33px; margin-bottom:35px; text-shadow: 3px 3px 0px #2c2e38, 5px 5px 0px #000;}

@media only screen and (max-width: 767px) { 
.projects li p.b {display:none	}
}

/* panel ------------------------ */

.panel.callout { padding:18px; border: 0; background: rgb(38, 24, 25); background: rgba(38, 24, 25, 0.2);}
.panel.callout h3{ font-size:22px;}
.panel.callout p { font-size:17px;}

/* Services Section ---------------------- */
#services {background:url(../images/backgrounds/services-bg.jpg); width:100%; padding-bottom:40px; border-top:3px solid #141414;}

ul.services { margin:0; padding:0;}
/* Tabs ---------------------- */
dl.tabs.vertical { height: auto; padding-right:30px; margin-top:10px; border-bottom:0;  z-index:8000; position:relative}
dl.tabs.vertical dt, dl.tabs.vertical dd { float: none; height: auto; }
dl.tabs.vertical dd { margin-bottom:0px; }
dl.tabs.vertical dd a { background: url(../images/backgrounds/vertical-tab-bg-close.png) no-repeat top right; border: none; color: #fff; display: block;  height: auto; line-height: 1;padding:9px 0 15px 20px; margin:0; }
dl.tabs.vertical dd a:hover { background: url(../images/backgrounds/vertical-tab-bg.png) no-repeat top right;color: #fff; }
dl.tabs.vertical dd.active { margin-top: 0; border: none;  }
dl.tabs.vertical dd.active a { background: url(../images/backgrounds/vertical-tab-bg.png) no-repeat top right; border: none; color: #fff; margin: 0; position: static; top: 0; font-weight:normal; padding:9px 0 15px 20px }
dl.tabs.vertical dd:first-child a.active { margin: 0; }

dl.tabs { border-bottom: solid 1px #e6e6e6; display: block; height: 40px; padding: 0; margin-bottom:10px; }
dl.tabs.contained { margin-bottom: 0; }
dl.tabs dt { color: #b3b3b3; cursor: default; display: block; float: left; font-size: 13px; height: 40px; line-height: 40px; padding: 0 9px 0 20px; width: auto; text-transform: uppercase; }
dl.tabs dt:first-child { padding: 0 9px 0 0; }
dl.tabs dd { display: block; float: left; padding: 0; margin: 0; }
dl.tabs dd a { background: #e9e9e9 url(../images/backgrounds/open-tab-bg.png) repeat-x; border: none; color: #fff;  height: 40px; line-height: 40px; padding: 0px 21px; margin: 0 3px; }
dl.tabs dd.active { color: #fff; margin-top: 0;border: 0; }
dl.tabs dd.active a { cursor: default; background: #d34432 url(../images/backgrounds/close-tab-bg.png) repeat-x; color: #fff; border: none; font-weight: bold; margin:0; }
dl.tabs dd:first-child { margin-left: 0; }

ul.tabs-content { display: block; margin: 0 0 20px; padding: 0; }
ul.tabs-content > li { display: none; }
ul.tabs-content > li.active { display: block; }
ul.tabs-content.contained { padding: 0; }
ul.tabs-content.contained > li { border: solid 0 #e6e6e6; border-width: 0 1px 1px 1px; padding: 20px; }
ul.tabs-content.contained.vertical > li { border-width: 1px 1px 1px 1px; }

.no-js ul.tabs-content > li { display: block; }

.circle {
width:118px;
height:118px;
display:block;
border-radius:65px;
-moz-border-radius:65px;
-webkit-border-radius:65px;
-khtml-border-radius:65px;
border:2px solid #fff;
text-align:center;
padding-top:26px;
background: rgb(111, 111, 111);
	/* RGBa with 0.6 opacity */
background: rgba(111, 111, 111, 0.6);
margin:0 auto;
margin-top:10px;
margin-bottom:10px;
box-shadow: 0px 5px 8px #152122;
  -webkit-box-shadow:  0px 5px 8px #152122;
  -moz-box-shadow:  0px 5px 8px #152122;}  
  
.circle:hover {
border:2px solid #fff;
background: rgb(195, 195, 195);
	/* RGBa with 0.6 opacity */
background: rgba(195, 195, 195, 0.6);
box-shadow: 0px 11px 18px #152122;
  -webkit-box-shadow: 0px 11px 18px #152122;
  -moz-box-shadow: 0px 11px 18px #152122;}  

.circle p {
text-shadow : 1px 2px 5px black;
}

ul.service li { padding: 6px 0 6px 20px; border-bottom:1px solid #3f3f3f;  background-image: url(../images/icons/bars.png); background-repeat: no-repeat;background-position: 0 50%; list-style: none; font-size:17px;}


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

dl.tabs.vertical { height: auto; border-right: 0; padding-right:0; margin-top:10px; border-bottom:0;}
dl.tabs.vertical dt, dl.tabs.vertical dd { float: none; height: auto; }
dl.tabs.vertical dd { border-left: 0px solid #cccccc;margin-bottom:2px; }
dl.tabs.vertical dd a { background: #3c4632; border: none; color: #fff; display: block;  height: auto; line-height: 1; padding: 10px; margin:0; }
dl.tabs.vertical dd a:hover { background: #7a9c7c;color: #fff; }
dl.tabs.vertical dd.active { margin-top: 0; border: none;  }
dl.tabs.vertical dd.active a { background: #7a9c7c; border: none; color: #fff; height: auto; margin: 0; position: static; top: 0; font-weight:normal;  padding: 10px; }
dl.tabs.vertical dd:first-child a.active { margin: 0; }

dl.tabs { height: auto; margin-top:10px; border:0; padding-right:0;}
dl.tabs dt, dl.tabs dd { float: none; height: auto; }
dl.tabs dd { border-left: 0px solid #cccccc;margin-bottom:2px; }
dl.tabs dd a { background: #f2f2f2; border: none; color: #fff; display: block;  height: auto; line-height: 1; padding: 10px; margin:0; }
dl.tabs dd a:hover { background: #da4a38;color: #fff; }
dl.tabs dd.active { margin-top: 0; border: none;  }
dl.tabs dd.active a { background: #da4a38; border: none; color: #fff; height: auto; margin: 0; position: static; top: 0; font-weight:normal }
dl.tabs dd:first-child a.active { margin: 0; }
}

/* Reveal Modals ---------------------- */
.reveal-modal-bg { position: fixed; height: 100%; width: 100%; background: #000; background: rgba(0, 0, 0, 0.45); z-index: 40; display: none; top: 0; left: 0; }

.reveal-modal { background:url(../images/backgrounds/services-bg.jpg); visibility: hidden; display: none; top: 100px; left: 50%; margin-left: -260px; width: 520px; position: absolute; z-index: 41; padding: 20px; -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.4); -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.4); box-shadow: 0 0 10px rgba(0, 0, 0, 0.4); }
.reveal-modal *:first-child { margin-top: 0; }
.reveal-modal *:last-child { margin-bottom: 0; }
.reveal-modal .close-reveal-modal { font-size: 15px; font-size: 1.5rem; line-height: .5; position: absolute; top: 6px; right: 6px; color: #fff; font-weight: bold; cursor: pointer; }
.reveal-modal.small { width: 30%; margin-left: -10%; }
.reveal-modal.medium { width: 40%; margin-left: -20%; }
.reveal-modal.large { width: 60%; margin-left: -30%; }
.reveal-modal.expand { width: 90%; margin-left: -45%; }
.reveal-modal .row { min-width: 0; }

/* Mobile */
@media only screen and (max-width: 767px) { .reveal-modal-bg { position: absolute; }
  .reveal-modal, .reveal-modal.small, .reveal-modal.medium, .reveal-modal.large, .reveal-modal.xlarge { width: 80%; top: 15px; left: 50%; margin-left: -40%; padding: 20px; height: auto; } }
 

/* About Section ---------------------- */
#about {background:url(../images/backgrounds/about-bg.jpg); width:100%;  padding-bottom:40px;  border-top:3px solid #141414;}

#about img {box-shadow: 0px 1px 8px #000;
  -webkit-box-shadow: 0px 1px 8px #000;
  -moz-box-shadow: 0px 1px 8px #000;}
  
/* Accordion ---------------------- */
ul.accordion { margin: 0 0 22px 0; border-bottom: 1px solid #22172d; }
ul.accordion li { list-style: none; margin: 0; padding: 0; border-top: 1px solid #22172d; }
ul.accordion li ul {margin:0; padding:0}
ul.accordion li ul li{ padding: 6px 0 6px 20px; border-bottom:1px solid #22172d; border-top:0; background-image: url(../images/icons/arrow_right.png); background-repeat: no-repeat;background-position: 0 50%; list-style: none; }
ul.accordion li .title { text-shadow : 1px 2px 5px black; cursor: pointer; background: #423351 url(../images/backgrounds/noisestrip.png); padding: 15px; margin: 0; position: relative; border-left: 1px solid #22172d; border-right: 1px solid #22172d; -webkit-transition: 0.15s background linear; -moz-transition: 0.15s background linear; -o-transition: 0.15s background linear; transition: 0.15s background linear; }
ul.accordion li .title h1, ul.accordion li .title h2, ul.accordion li .title h3, ul.accordion li .title h4, ul.accordion li .title h5 { margin: 0; }
ul.accordion li .title:after { content: ""; display: block; width: 0; height: 0; border: solid 6px; border-color: transparent #674e81 transparent transparent; position: absolute; right: 15px; top: 21px; }
ul.accordion li .content { display: none; padding: 15px; }
ul.accordion li.active { border: 0 }
ul.accordion li.active .title { text-shadow : 1px 2px 5px black; background: #22172d url(../images/backgrounds/noisestrip.png); padding-top: 13px; color:#fff; }
ul.accordion li.active .title:after { content: ""; display: block; width: 0; height: 0; border: solid 6px; border-color: #674e81 transparent transparent transparent; }
ul.accordion li.active .content { display: block; border-left: 1px solid #22172d; border-right: 1px solid #22172d; font-size:17px; }  


/* Contact Section ---------------------- */
#contact {background:url(../images/backgrounds/contact-bg.jpg); width:100%;  padding-bottom:40px; border-top:3px solid #141414;}

/* Alerts ---------------------- */
div.alert-box { display: block; padding: 15px; font-weight: normal; font-size: 14px; background-color: #b3d9ff; border:1px solid #a0c3e6; border-left:10px solid #a0c3e6; color: #0678ea; margin-bottom: 17px; position: relative; }
div.alert-box.success { background-color: #a7dbd2; border:1px solid #91c2b9; border-left:10px solid #91c2b9; color: #027d68; }
div.alert-box.alert { background-color: #ffc3bb; border:1px solid #ebb4ac; border-left:10px solid #ebb4ac; color: #eb2005; }
div.alert-box.notice { background-color: #f5e9af; border:1px solid #e0d5a1; border-left:10px solid #e0d5a1; color: #9f8402; }
div.alert-box a.close { color: #333; position: absolute; right: 4px; top: -1px; font-size: 17px; opacity: 0.8; padding: 15px 8px; }
div.alert-box a.close:hover, div.alert-box a.close:focus { opacity: 0.4; }

/* Google Map / Contact Page ---------------------- */
.gmap3{border: 6px solid #46332b; width: 100%; height: 400px;}
.gmaplabels { color: #fff; background: #46332b; font-size: 17px; text-align: center; font-weight:bold; border: 1px solid #666; padding:7px; white-space: nowrap;}
#sendstatus { margin: 0;}

/* Buttons ------------------------ */
.button {  width: auto; cursor: pointer; display: inline-block; line-height: 1; margin: 0; outline: none; padding: 10px 20px 11px; position: relative; text-align: center; text-decoration: none; background:#302220;box-shadow: 0px 1px 8px #281d19;
  -webkit-box-shadow: 0px 1px 8px #281d19;
  -moz-box-shadow: 0px 1px 8px #281d19;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    border:1px solid #281d19}
.button:hover { background: #42312a; color:#fff }

