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

/*------------------------------------------------------------------
[Table of contents]
1. Clearfix
2. Preloader
3. Typography
4. Headings
5. Main Nav
6. Main Content
7. Column Grid
8. Icons
9. Image Hover
10. Lists
11. Footer
12. Social
13. Googlemaps
14. Comments
-------------------------------------------------------------------*/


/* =1. Clearfix
--------------------------------------------------------------------------------------------------------*/
.clear { clear: both; }
.clearfix:after { content: "."; display:block; height:0; clear:both; visibility:hidden; }/* ----- clear fix for floats ----- */
.clearfix { display:inline-block; }
* html .clearfix { height:1%; }/* hides clearfix from IE-mac */
.clearfix { display:block; }/* end hide from IE-mac */
.alignleft { float:left; }
.alignright { float:right; }
.aligncenter { margin:auto; display:block; }
.alignnone { clear:both; font-size:0; line-height:0; margin:0; padding:0; border:0; height:0; width:0; }
.centered { text-align:center; }
/* End Clearfix
--------------------------------------------------------------------------------------------------------*/


/* =2. Preloader
--------------------------------------------------------------------------------------------------------*/
#preloader { position:absolute; top:0; left:0; right:0; bottom:0; background:url(../images/background.jpg);  z-index:9999; }
#status { z-index:28; position:absolute; color:#fff; top:50%; height:400px; width:100%; margin-top:-200px; }
/* horizontal centering */
.parent {width:300px; margin:0px auto; position:relative; height:400px; z-index:11}
#content .parent {position:absolute;  }
.col2-3 .parent {width:610px; }
.col1-3.half .parent {height:194px; }
.child {text-align:center;}
/* vertical centering */
.parent {display: table}
.child {display: table-cell; vertical-align: middle; padding:0 50px; }
.child span { text-transform:uppercase; }
/* End Preloader
--------------------------------------------------------------------------------------------------------*/


/* =3. Typography
--------------------------------------------------------------------------------------------------------*/
html {overflow: -moz-scrollbars-vertical; overflow-y: scroll; -webkit-font-smoothing: antialiased; }
body { font: 14px Verdana, "Verdana", Times, serif; color:#000;  background:url(../images/background.jpg); }
strong { font-weight:600; }
em {font-size:17px; }
a, a > * {-webkit-transition: all 0.2s ease 0s; -moz-transition: all 0.2s ease 0s; -o-transition: all 0.2s ease 0s; transition: all 0.2s ease 0s; }
*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 0; margin: 0; }
p { line-height:21px; padding:15px 0px 0 0px; }
p.small {font-size:12px; font-style:italic; }
p.alt {font-family:'Open Sans', 'Helvetica Neue', Arial, Helvetica, sans-serif; font-size:11px; text-transform:uppercase; letter-spacing:1px; color:#8d8d8d }
.images p.small {color:#fff; text-align:center !important; padding-top:2px }
p.small span {font-size:11px; }
p.small span a {color:#2b2b2b; font-style:normal; font-size:12px;  }
#preloader p.small {font-size:11px; display:block; text-transform:uppercase; font-style:normal; font-weight:700;  letter-spacing:1px; margin-top:3px; font-family: "Open Sans", Arial, Helvetica, sans-serif; -o-text-shadow:-1px -1px 0px rgba(0, 0, 0, 0.25); -moz-text-shadow:-1px -1px 0px rgba(0, 0, 0, 0.25); -webkit-text-shadow:-1px -1px 0px rgba(0, 0, 0, 0.25); text-shadow:1px 1px 0px rgba(0, 0, 0, 0.25);}
p.big {font-size:16px; line-height:24px; font-style:italic; }
.white-right2 p.big, .white-bottom p.big, .white p.big {font-style:normal !important; } 
#heading p.big, .images p.big {color:#fff; display:block; margin-top:-7px; }
.images p.big {margin-top:-11px; }
blockquote { line-height:27px; padding:19px 40px 17px 55px; margin:20px 0px 4px 0px; border-bottom:1px dotted #2b2b2b; border-top:1px dotted #2b2b2b; color:#333; font-size:20px; font-style:italic; }
blockquote:before {content:"“"; float:left; display:block; margin-left:-64px; font-family:Georgia, "Times New Roman", Times, serif; font-size:96px; margin-top:30px; font-weight:400 }
blockquote span {font-size:14px; display:block; margin-top:9px; color:#8d8d8d}
.uppercase {text-transform:uppercase }
p.small.uppercase {font-size:11px; }
p a { color:#8d8d8d; text-decoration:none; }
#heading p a, .images.no-icon p a {color:#fff; opacity:0.8; }
a p {color:#555; }
p a:hover { color:#555; }
#heading p a:hover, #heading p a.selected, .images.no-icon p a:hover {color:#fff; opacity:1; }
p.bottom {position:absolute; bottom:35px; width:220px; }
code {font:13px 'Open Sans', 'Helvetica Neue', Arial, Helvetica, sans-serif; font-style:normal; line-height:1.5; display:block; }
pre { padding:13px 40px 0 40px; }
span.arrow {font-family:'Open Sans', 'Helvetica Neue', Arial, Helvetica, sans-serif; font-size:13px !important }
a:hover span.arrow {padding-left:5px; }
/* End Typography
--------------------------------------------------------------------------------------------------------*/


/* =4. Headings
--------------------------------------------------------------------------------------------------------*/
h1#logo { display:block; position:relative; float:left; z-index:12 }
h1#logo a { display:block; background:url(../images/bg-logo.png) center no-repeat; background-size:166px 21px; width:166px; /*try to keep it at 41px*/ height:41px; text-indent:-9999px; }
.tagline {float:left; font-family: "Open Sans", Arial, Helvetica, sans-serif; font-size:12px; font-weight:400; padding:0px 0 0 20px; margin:0px auto; position:relative; display:table; height:41px; font-style:italic; z-index:12; color:#fff; opacity:0.8 }
.tagline span { display: table-cell; vertical-align: middle; }
.hentry h1, h2, h3, h4, h5 { line-height:1.3; font-family: 'Open Sans', 'Helvetica Neue', Arial, Helvetica, sans-serif; color:#2b2b2b; display:block; position:relative; letter-spacing:4px; text-transform:uppercase; font-weight:700; }
.hentry h1 a, h2 a, h3 a, h4 a, h5 a { color:#2b2b2b; text-decoration:none }
h2 {font-size:48px; color:#fff; padding-bottom:1px; }
.white-bottom h2 {font-size:24px; color:#2b2b2b; text-transform:none; letter-spacing:0; }
h3 {font-size:18px; letter-spacing:2px; padding-bottom:3px; padding-top:19px; }
.blog h3, .service h3 {text-transform:none; letter-spacing:0; padding-top:4px; padding-bottom:2px; font-size:19px; }
.one-page h3 {text-transform:none; letter-spacing:0; font-size:19px; }
h4 {font-size:14px; color:#fff; letter-spacing:1px; }
.images.no-icon h4 {margin-top:0 }
h5 {font-size:15px; padding-bottom:0px; padding-top:15px; color:#555; font-family: 'Open Sans', 'Helvetica Neue', Arial, Helvetica, sans-serif; font-weight:600; text-transform:none; margin-bottom:-7px; letter-spacing:0 }
.align-top {padding-top:0 !important }
/* End Headings
--------------------------------------------------------------------------------------------------------*/


/* =5. Main Nav
--------------------------------------------------------------------------------------------------------*/
nav { margin:0px auto; position:relative; display:table; height:41px; z-index:12; float:center; }
#nav { display: table-cell; vertical-align: middle; white-space:nowrap }
#nav li { float:left; margin:0px 0px 0px 25px; position:relative; padding:9px 0 11px 0; }
#nav li a { color:#fff; font-family: "Open Sans", Arial, Helvetica, sans-serif; font-size:12px; font-weight:600; text-decoration:none; text-transform:uppercase; display:inline-block; opacity:0.8; cursor:pointer; letter-spacing:1px }
#nav li a:hover, #nav li a.active, #nav li a.selected { opacity:1; }
#nav li ul {position:absolute; margin-top:10px; margin-left:-15px; left:0; padding:7px 15px; width:auto; background:#fff; -webkit-box-shadow:0 1px 0 rgba(0, 0, 0, 0.2); -moz-box-shadow:0 1px 0 rgba(0, 0, 0, 0.2) ; box-shadow:0 1px 0 rgba(0, 0, 0, 0.2); display:none; }
#nav li ul:before {content:''; height:0; width:0; border-width:7px 7px 7px 7px; border-style:solid; border-color:rgba(251,251,251,0) rgba(255,255,255,0) rgba(255,255,255,1) rgba(255,255,255,0); position:absolute; top:-14px; margin-left:0px; border-top-style:inset; }
#nav li ul li {float:none; margin:0px; padding:0 }
#nav li ul li a {padding:6px 0 7px 0; border-bottom:1px dotted #2b2b2b; font-size:11px; color:#8d8d8d; display:block }
#nav li ul li a.last {border:0 }
#nav li ul li:hover a {color:#2b2b2b; }
#nav li:hover ul { display:block }
/* End Main Nav
--------------------------------------------------------------------------------------------------------*/


/* =6. Main Content
--------------------------------------------------------------------------------------------------------*/
header { position:relative; z-index:5555; width:920px; margin:0 auto; margin-top:40px; padding:23px 40px; background:url(../images/pic01.jpg) center top no-repeat; height:400px; }
.portfolio header { background:url(../images/pic01c.jpg) center top no-repeat; }
.alternative header { background:url(../images/pic01b.jpg) center top no-repeat; }
.about header { background:url(../images/pic01e.jpg) center top no-repeat; }
.services header { background:url(../images/pic01f.jpg) center top no-repeat; }
.blog header { background:url(../images/pic01g.jpg) center top no-repeat; }
.contact header { background:url(../images/pic01d.jpg) center top no-repeat; }
.no-header-image header, .one-page header {background:none; height:auto; }
#content {width:100%; position:relative; z-index:56; height:auto; margin-top:5px;}
.container { padding-right:30px; width:960px; position:relative; margin:0 auto; }
#heading {position:absolute; top:0; left:0; width:100%; z-index:11; }
#heading .parent {width:100%; }
/* =End Main Content
--------------------------------------------------------------------------------------------------------*/


/* =7. Column Grid
--------------------------------------------------------------------------------------------------------*/
.col3-3-hero { border-radius: 15px; width:920px; height:650px; margin:5px; position:relative }
.col3-3 { border-radius: 15px; width:920px; height:400px; margin:5px; position:relative }
.col1-3 { border-radius: 15px; width:300px; height:400px; margin:5px; float:left; position:relative }
.col2-3 { border-radius: 15px; width:610px; height:400px; margin:5px; float:left; position:relative }
.col1-3.half {height:195px; }
.col1-3.connect {width:310px; height:400px; margin:0; float:left; overflow:hidden; z-index:10 }
.col1-3.half.connect {width:300px; height:195px; }
.col2-3.connect {margin:0; float:none; }
.white-right2:before {content:''; height:0; width:0; border-width:10px 10px 10px 10px; border-style:solid; border-color:rgba(251,251,251,0) rgba(255,255,255,1) rgba(255,255,255,0) rgba(255,255,255,0); position:absolute; left:-20px; top:38px; border-left-style:inset; }
.white-bottom:before {content:''; height:0; width:0; border-width:10px 10px 10px 10px; border-style:solid; border-color:rgba(251,251,251,0) rgba(255,255,255,0) rgba(255,255,255,1) rgba(255,255,255,0); position:absolute; top:-20px; margin-left:0px; border-left-style:inset; }
a:visited .white-right2:before { border-color:transparent rgba(255,255,255,1) transparent transparent !important; }
.white-right2, .white-bottom {background:url(../images/crater.jpg); border-radius: 25px; padding:15px 40px 35px 40px; z-index:10; margin:0 }
.white-bottom {height:205px;  }
.white {background:#fff; padding:15px 40px 35px 40px; }
.col1-3.auto, .col2-3.auto, .col3-3.auto {height:auto !important;  }
.col2-3.white-bottom.auto {padding-bottom:36px; }
.element .col1-3, .element .col2-3, .element .col3-3 {margin:0 }
.element {overflow:hidden }
.column1 {width:260px; padding-right:40px; float:left }
.column2 {width:580px; border-left:1px dotted #2b2b2b; padding:0px 0px 20px 40px; margin-top:3px; float:left }
.column-count2 {-webkit-column-count:2; -moz-column-count:2; column-count:2; -webkit-column-gap:35px; -moz-column-gap:35px; column-gap:35px; }
.borderline { border-bottom:1px dotted #2b2b2b; height:1px; position:relative; display:block; margin:18px 0px 5px 0px; width:100%; }
.borderline.second { margin:2px 0px 5px 0px; }
.overlay { display:block; position:absolute; top:0; left:0; background-color:rgba(0,0,0,.3); z-index:10; width:100%; height:100%; }
.alternative .images .overlay {display:none }
/* =End Main Content
--------------------------------------------------------------------------------------------------------*/


/* =8. Icons
--------------------------------------------------------------------------------------------------------*/
.icons { display:block; height:48px; width:48px; z-index:100; margin:0 auto; margin-bottom:12px; }
.images .icons {opacity:0;  }
.alternative .images .icons {opacity:1; position:absolute; right:40px; top:40px; }
.icons.text {width:auto; font-size:18px; color:#fff; font-style:italic; border:2px solid #fff; border-radius:300px; padding:11px 18px; display:inline-block; line-height:18px; }
.close { background:url(../images/bg-close.png) center no-repeat; background-size:48px 48px; position:absolute; right:35px; top:35px; z-index:28; width:48px; height:48px; display:block }
.icons.play {background:url(../images/bg-play.png) center no-repeat; background-size:48px 48px; }
.icons.illustration {background:url(../images/bg-illustration.png) center no-repeat; background-size:48px 48px; }
.icons.camera {background:url(../images/bg-camera.png) center no-repeat; background-size:48px 48px; }
.icons.drawing {background:url(../images/bg-drawing.png) center no-repeat; background-size:48px 48px; }
.icons.zoom {background:url(../images/bg-zoom.png) center no-repeat; background-size:48px 48px; }
.icons.link {background:url(../images/bg-link.png) center no-repeat; background-size:48px 48px; }
.icons.video {background:url(../images/bg-video.png) center no-repeat; background-size:48px 48px; }
.icons.quote {background:url(../images/bg-quote.png) center no-repeat; background-size:48px 48px; }
/* Social Icons */
.linkedin {background:url(../images/bg-linkedin.png) center no-repeat; background-size:50px 50px; }
.dribbble {background:url(../images/bg-dribbble.png) center no-repeat; background-size:50px 51px; }
.googleplus {background:url(../images/bg-googleplus.png) center no-repeat; background-size:50px 50px; }
.twitter {background:url(../images/bg-twitter.png) center no-repeat; background-size:50px 51px; } 
.facebook {background:url(../images/bg-facebook.png) center no-repeat; background-size:50px 51px; }
.behance {background:url(../images/bg-behance.png) center no-repeat; background-size:50px 50px; }
.skype {background:url(../images/bg-skype.png) center no-repeat; background-size:50px 51px; }
.vimeo {background:url(../images/bg-vimeo.png) center no-repeat; background-size:50px 50px; }
/* End Icons
--------------------------------------------------------------------------------------------------------*/


/* =9. Image Hover
--------------------------------------------------------------------------------------------------------*/
.images { display:block; position:relative; }
.images img {width:100%; display: block; max-width: 100% !important; z-index:9 }
img{box-shadow: #000 0 0 0}
.info-wrapper {margin-top:-58px; }
.title, .subtitle { z-index:1001; position:absolute; top:36px; left:40px; width:auto; cursor:pointer; pointer-events: none; }
.subtitle { top: 52px; left:40px !important; }
.title-wrap, .subtitle-wrap { overflow: hidden; position: relative; }
.title-wrap h4, .subtitle-wrap p { overflow: hidden; white-space: nowrap; color:#fff; padding:0px; margin:0 !important }
/* End Image Hover
--------------------------------------------------------------------------------------------------------*/


/* =10. Lists
--------------------------------------------------------------------------------------------------------*/
ul.unordered-list, .hentry ul { list-style: disc; line-height:21px; padding:15px 0px 0 0px; margin-left:24px; }
ul.list {line-height:21px; padding-top:15px; }
ol { list-style: decimal; line-height:21px; padding:15px 0px 0 0px; margin-left:24px;  }
ul.unordered-list a, .hentry ul a, ul.list a, ol a { color:#8d8d8d; text-decoration:none; }
ul.unordered-list a:hover, .hentry ul a:hover, ul.list a:hover, ol a:hover { color:#555; text-decoration:none; }
/* =End Lists
--------------------------------------------------------------------------------------------------------*/


/* =11. Footer
--------------------------------------------------------------------------------------------------------*/
footer { height:auto; position:relative; padding:0px 35px 95px 35px; text-align:center; z-index:100 }
footer p {display:inline-block; margin:0 10px; font-family: "Open Sans", Arial, Helvetica, sans-serif; font-size:14px; letter-spacing:2px; font-style:normal; text-transform:uppercase; color:#fff; opacity:0.7 }
footer p a { color:#fff; border:0 }
footer p span { font-family:Georgia, "Times New Roman", Times, serif; text-transform:none; letter-spacing:0; font-style:italic }
footer p a:hover { color:#fff; }
/* End Footer
--------------------------------------------------------------------------------------------------------*/


/* =12. Social
--------------------------------------------------------------------------------------------------------*/
ul.social { letter-spacing:0; margin-top:40px; margin-bottom:20px; }
.social li { display:inline-block; margin:0px 2px;}
.social li a { display:block; opacity:0.5 }
ul.social a {text-indent:-9000px; text-decoration:none; height:52px; width:52px;}
.social li a:hover {opacity:1 }
/* End Social
--------------------------------------------------------------------------------------------------------*/


/* =13. Googlemaps
--------------------------------------------------------------------------------------------------------*/
#map {width:610px; height:400px; margin:0; border:0}
#map:before, #map:after {background: none; content: ''; left: 0;	position: absolute;	top: 0;	width: 100%; }
#map:after {bottom: 0; top: auto; }
/* End Googlemaps
--------------------------------------------------------------------------------------------------------*/


/* =14. Comments
--------------------------------------------------------------------------------------------------------*/
#comments {position:relative; height:auto !important; margin-bottom:-20px; }
#comments ol.commentlist { list-style: none; line-height:21px; padding:15px 0px 0 0px; margin-left:0;  }
#comments ol.commentlist li {padding-bottom:20px; }
#comments ul.children {overflow:inherit; padding-left:55px; }
#comments .user {float:left; height:70px; width:70px; position:relative; margin-top:10px; }
#comments .message {overflow:hidden }
#comments .box {margin-left:20px; position:relative }
#comments h2 { font-size:15px; padding-bottom:0px; padding-top:6px; color:#555; font-family: 'Open Sans', 'Helvetica Neue', Arial, Helvetica, sans-serif; font-weight:600; text-transform:none; margin-bottom:0px; letter-spacing:0 }
#comments .meta { font-family:'Open Sans', 'Helvetica Neue', Arial, Helvetica, sans-serif; font-size:11px; text-transform:uppercase; letter-spacing:1px; color:#8d8d8d}
#comments .meta .reply {float:right }
/* End Comments
--------------------------------------------------------------------------------------------------------*/