@import url(http://fonts.googleapis.com/css?family=Droid+Sans:400,700);
@import url(http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz);

/*
* Camara V.1
* Copyright 2012, manuelvega
* DATE : 03/01/2013
* URL : http://themeforest.net/user/manuelvega
* Please RATE this item !
*/



/* Table of Contents
==================================================
  
  1. GENERAL STYLES
  2. HEADER & NAV
  3. PARALLAXS
  4. ABOUT
  5. PORTFOLIO
  6. BLOG
  7. BLOG POST
  8. CONTACT
  9. FOOTER
 10. SWITCHER
 11. MEDIA QUERYS


/* 1 - GENERAL STYLES 
================================================== */


body {font-family: 'Droid Sans',, Times, serif; background-color: #0e0e0e;}
a {color: #fff; text-decoration: none;}
::selection {color:#fff; background-color: #212121;}
.clear {clear: both;}
p {font-family: 'Droid Sans', Times, serif; font-size:13px; color: #898989;}
h1 {font-size:50px; font-family: 'Yanone Kaffeesatz'; text-transform: uppercase; letter-spacing: -1px; color: #fff;}
h2 {font-size:35px; font-family: 'Yanone Kaffeesatz'; text-transform: uppercase; letter-spacing: -1px; color: #fff;}
h3 {font-size:30px; font-family: 'Yanone Kaffeesatz'; text-transform: uppercase; letter-spacing: -1px; color: #fff;}
h4 {font-size:20px; font-family: 'Yanone Kaffeesatz'; text-transform: uppercase; color: #fff;}
h5 {font-size:15px; font-family: 'Yanone Kaffeesatz'; text-transform: uppercase; color: #fff;}
.heading_line {background-color: #f94e7c; width: 100px; height: 4px; margin-bottom: 50px;}
span {color: #F96;}


/* 2 - HEADER & NAV 
================================================== */


header { font-family: 'Yanone Kaffeesatz'; background-color: #080808; padding: 10px 0 40px 0; position:fixed; right:0; left:0; z-index: 999;}
.logo img {padding-top: 5px;}
nav.main_nav {float: right; margin-top: 50px;}
nav.main_nav ul li {display: inline; font-weight: bold; text-transform: uppercase; font-size: 18px; padding-left: 13px; }
nav.main_nav ul li:first-child {padding: 0;}
nav.main_nav ul li a {color: #c8c8c8; }
nav.main_nav ul li.active a {background-color: #F96; color: #fff; border-radius:2px; padding: 3px 10px;}
nav.main_nav_back {float: right; margin-top: 20px;}
nav.main_nav_back ul li {display: inline; font-weight: bold; text-transform: uppercase; font-size: 11px; padding-left: 13px; }
nav.main_nav_back ul li:first-child {padding: 0;}
nav.main_nav_back ul li a {color: #c8c8c8;}
nav.main_nav_back ul li.active a {background-color: #F96; color: #fff; border-radius:2px; padding: 3px 10px;}
.tooltip-inner {background-color: #202020;}
.tooltip.top .tooltip-arrow{bottom:0;left:50%;margin-left:-5px;border-width:5px 5px 0;border-top-color:#202020;}
#slider_section {margin-bottom: 200px; padding-top: 100px;}


/* 3 - PARALLAX
================================================== */


.parallax1 {height: 300px; margin-bottom: 200px;}
.parallax1 .text {margin-top: 130px;}
.parallax1 p {font-family: 'Yanone Kaffeesatz'; font-size:50px; text-transform: uppercase; color: #fff;}
.parallax1 p.subtext {font-size:25px; margin-top: 20px;}
.parallax1 p span {text-shadow: 3px -1px 2px #5b0924;filter: dropshadow(color=#5b0924, offx=3, offy=-1);}
.parallax2 {height: 300px; margin-bottom: 200px;}
.parallax2 .text {margin-top: 130px;}
.parallax2 p {font-family: 'Yanone Kaffeesatz'; font-size:50px; text-transform: uppercase; color: #fff;}
.parallax2 p.subtext {font-size:25px; margin-top: 20px;}
.parallax2 p span {text-shadow: 3px -1px 2px #5b0924;filter: dropshadow(color=#5b0924, offx=3, offy=-1);}
.parallax3 {height: 300px; margin-bottom: 200px;}
.parallax3 .text {margin-top: 110px;}
.parallax3 p {font-family: 'Yanone Kaffeesatz'; font-size:50px; text-transform: uppercase; color: #fff;}
.parallax3 p.subtext {font-size:25px; margin-top: 20px;}
.parallax3 p span {}
.twitter_icon {text-align: center; margin-bottom:20px;}


/* 4 - ABOUT
================================================== */


#about_section {margin-bottom: 200px;}
#about_section p {margin: 20px 0;}
#about_section .teammate {float: left;}
#about_section .team_grid .team_desc {background-color: #1b1b1b; width: 330px; margin:0; padding: 20px; border-top:3px solid #000;}
#about_section .team_grid .team_desc.middle {border:none; text-align: center; width: 347px;}
#about_section .team_grid .team_desc.blue {background-color: #131a20;}
#about_section .team_grid .social ul {margin:0; padding-bottom: 20px;}
#about_section .team_grid .social ul li {display: inline; padding-right: 5px;}


/* 5 - PORTFOLIO
================================================== */


#portfolio_section p {margin-top: 30px;}
#portfolio_container {margin-left: 15px;}
.portfolio_wrapper {margin-bottom: 200px;}
.portfolio_wrapper .pfolio_item {}
.portfolio_wrapper .pfolio_item img {}
.picture {position: relative; width: 310px; height: 242px;padding-bottom: 2px; margin-left: 2px;}
.picture img {height: auto;}
.image-overlay-link,.image-overlay-zoom {height:100%;width: 100%;left: 0;top:-2px;position: absolute;z-index: 40;display: none;background-color: #222;background: rgba(0, 0, 0, 0.7);
background-repeat: no-repeat;background-position: 50%;cursor: pointer;overflow:hidden;}
.image-overlay-link {background-image: url(../img/portfolio/hover.png);}
.pfolio_item img { }
section#options {background-color: #1f1f1f; margin: 30px 0 40px 0;}
.option-set { list-style: none;margin:30px 0;}
.option-set li { display:inline;}
.option-set li a, .option-set li a.selected {font-family: 'Droid Sans', Times, serif; font-weight: bold; color:#fff; margin-right: 20px; 
border-radius: 5px; -webkit-border-radius:2px; -moz-border-radius:2px; padding: 10px 20px; background-color: #F96;}
.option-set li a.selected { background-color: #2a2a2a;color:#fff;}
.isotope-item {z-index: 2;}
.isotope-hidden.isotope-item {pointer-events: none;z-index: 1;}

/**** Isotope CSS3 transitions ****/

.isotope,
.isotope .isotope-item {
  -webkit-transition-duration: 0.8s;
     -moz-transition-duration: 0.8s;
      -ms-transition-duration: 0.8s;
       -o-transition-duration: 0.8s;
          transition-duration: 0.8s;
}

.isotope {
  -webkit-transition-property: height, width;
     -moz-transition-property: height, width;
      -ms-transition-property: height, width;
       -o-transition-property: height, width;
          transition-property: height, width;
}

.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
     -moz-transition-property:    -moz-transform, opacity;
      -ms-transition-property:     -ms-transform, opacity;
       -o-transition-property:         top, left, opacity;
          transition-property:         transform, opacity;
}

/**** disabling Isotope CSS3 transitions ****/

.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
  -webkit-transition-duration: 0s;
     -moz-transition-duration: 0s;
      -ms-transition-duration: 0s;
       -o-transition-duration: 0s;
          transition-duration: 0s;
}


/* 6 - BLOG
================================================== */


#blog_section { margin-top:50px; margin-bottom: 200px;}

#blog_section .heading p {margin:30px 0 40px 0;}
.blog_size_1 {margin-bottom: 30px;}
.blog_size_1 .date, .blog_size_1 .content {position:relative; background-color: #1d1d1d; width: 300px;}
.blog_size_1 .description {position: relative; top:0; left:430px;}
.blog_size_1 .date, .blog_size_2 .date , .blog_size_3 .date, .blog_size_4 .date {border-bottom: 1px solid #282828; padding:20px 20px 10px 20px;}
.blog_size_1 .date p, .blog_size_2 .date p, .blog_size_3 .date p, .blog_size_4 .date p {font-family: 'Yanone Kaffeesatz'; font-size:20px; color: #fff; text-transform: uppercase; float: right;}
.blog_size_1 .content {padding: 20px 20px 116px 20px; }
.blog_size_1 .content h4 {padding-bottom: 5px;}
.blog_size_1 .button a, .blog_size_2 .button a,.blog_size_3 .button a , .blog_size_4 .button a {background-color: #F96; border-radius: 100px; padding: 5px 11px; position:absolute; right:20px; bottom:20px;}
.blog_size_2 .date, .blog_size_2 .content {position:relative; background-color: #1d1d1d; width: 300px;}
.blog_size_2 .content  {padding: 20px 20px 50px 20px;}
.blog_size_2 .content p {padding-bottom: 50px;}
.blog_size_2 .description {position: relative; top:300px;}


.blog_size_3 .date, .blog_size_3 .content {position:relative; background-color: #1d1d1d; width: 325px;}
.blog_size_3 .content  {padding: 20px 20px 30px 20px; height:150px;}
.blog_size_3 .content p {padding-bottom: 0;}
.blog_size_3 .img { width: 365px; height:300px; overflow:hidden; }

.blog_size_4 .date, .blog_size_4 .content {position:relative; background-color: #1d1d1d; width: 300px;}
.blog_size_4 .content  {padding: 20px 20px 70px 20px;}
.blog_size_4 .content p {padding-bottom: 50px;}
.blog_size_4 .description {position: relative; top:280px;}

.blog_section_responsive {display: none;}
.blog_section_responsive .heading p {margin:20px 0;}
.blog_section_responsive .post {background-color: #1d1d1d; padding: 20px; margin: 20px 0}
.blog_section_responsive .post h4 {float: left; margin-left: 20px;}
.blog_section_responsive .post h4.date {color: #696969;}
.blog_section_responsive .post .button a {float: right; background-color: #F96; border-radius: 100px; padding: 5px 11px;}


/* 7 - BLOG POST
================================================== */


.blog_post {padding-top: 150px;}
.blog_post .line {height: 1px; background-color: #242424;}
.blog_post .post h3 {margin: 30px 0;}
.blog_post .post_meta {background-color: #131313; margin:20px 0;}
.blog_post .post_meta ul {padding: 15px 0;}
.blog_post .post_meta ul li:first-child {margin:0; padding-right:20px; padding-left: 0;}
.blog_post .post_meta ul li {display: inline; border-right:1px solid #282828; padding:0 20px; color: #aaaaaa; font-weight: bold; font-size:12px;}
.blog_post .post_meta ul li img {padding-right: 10px;}
.blog_post .post_text {background-color: #131313; padding: 20px; margin-bottom: 50px;}
.blog_post .post .line {margin-bottom: 50px;}
.comment {margin-bottom: 40px;}
.comments .heading {margin-bottom: 50px;}
.comment .avatar img {float: left;}
.comment .content {background-color: #131313; padding-bottom:20px;}
.comment .content p {padding:0 20px;}
.comment .content p.author {margin-top: 20px; font-size:15px; color: #fff; margin-bottom:0;}
.comment .content p.date {margin-bottom: 20px;}
.comment .content a {margin-left: 20px; font-size:12px; color: #F96;}
.comment.reply {margin-left: 100px;}
.comments .line {margin-bottom: 50px;}
.comment_form .heading {margin-bottom: 50px;}
.comment_form input, .comment_form textarea {background-color: #131313; border:none; font-weight: bold; color: #fff; padding: 10px 200px 10px 20px; text-transform: uppercase; font-size: 15px;}


/* 8 - CONTACT
================================================== */


.map {background: url(../img/contact/map.jpg); padding: 50px 0 150px 0;}
#contact_section p {color: #bfbfbf;}
#contact_section .heading p {margin: 30px 0;}
#contact_section .social {margin-bottom: 50px;}
#contact_section ul {margin:0;}
#contact_section ul li {display: inline; padding-right: 5px;}
.main_form input {padding: 18px 150px 18px 10px; font-size:20px; color: #5f5f5f; margin-bottom: 13px; font-family: 'Yanone Kaffeesatz'; text-transform: uppercase;}
.main_form {float: left;}
.textarea textarea {width: 750px;}
.textarea textarea.message {font-size:20px; color: #5f5f5f; padding: 20px 0 0 15px; font-family: 'Yanone Kaffeesatz'; text-transform: uppercase;}
input#submit {background-color: #F96; border:none; border-radius:3px; color: #fff; margin-top: 10px; text-transform: uppercase; font-size:20px; margin-bottom: 30px; font-family: 'Yanone Kaffeesatz'; 
padding: 15px 10px 10px 10px;}


/* 9 - FOOTER
================================================== */


.subfooter_container {background-color: #141414;}
.subfooter_container p {font-size:11px; color: #a0a0a0; padding: 20px 0 10px 0;}
.subfooter_container a {color: #F96;}


/* 10 - SWITCHER
================================================== */


#switch {float:left;display:block;background:#fff;-moz-border-radius:0 10px 10px 0;-webkit-border-radius:0 10px 10px 0;border-radius:0 10px 10px 0;position:absolute;left:0;top:20%;padding:15px 20px 15px 10px;
border:1px solid #d7d7d7;}
#switch h4 {font-size:15px; color:#4d4d4d;margin-bottom: 10px;}
#switch ul li {font-size:12px; margin:5px; }
#switch ul li a {color:#fff;}
#show {position:absolute;left:0;top:20%;background:#fff;-moz-border-radius:0 10px 10px 0;-webkit-border-radius:0 10px 10px 0;border-radius:0 10px 10px 0;behavior:url(PIE.html);
padding:0px 20px 15px 10px; color: #000; border:1px solid #d7d7d7;}
#show h4, #hide {cursor:pointer;color: #4d4d4d; font-size:15px; margin-top: 20px; font-weight: bold; font-size:13px; font-family: 'Droid Sans', Times, serif; }
#show h4 span,#hide span {font-weight:400;display:block;clear:both;}
h4#hide {margin-top: 30px; border-radius: 3px; background-color: #F96; width: 100px; text-align: center; padding: 10px 5px; color: #eee; font-weight: bold; font-size:13px; font-family: 'Droid Sans', Times, serif;}
ul.color {padding: 0; margin: 0;}
ul.color h5 {border-bottom:1px dotted #cecece; padding-bottom:15px; text-transform: uppercase; color: #464646; font-size:20px; margin-top: 0; padding-top:0;}
ul.color li {display: inline;}


/* 11 - MEDIA QUERYS
================================================== */


/* #Tablet (Portrait)
================================================== */

    /* Note: Design for a width of 768px */

@media only screen and (min-width: 768px) and (max-width: 959px) {

.flex-caption .follow_us p {margin-bottom: 50px;}
.flex-caption span.caption-text-h1 {font-size:30px;}
.bubble {display: none;}
#about_section .laptop .featured {position: relative; top:0px;}
#about_section .laptop img {top:120px;}
.picture {width: 295px; height: 230px;}
.blog_size_1 .date, .blog_size_1 .content {position: absolute; top:300px;}
.textarea textarea {margin-left:-20px;}
input#submit {margin-left:-20px;}
.blog_section_normal {display:none;}
.blog_section_responsive {display: block; margin-top: 0; margin-bottom: 200px;}
.parallax1 .text, .parallax2 .text , .parallax3 .text {margin-top:70px;}
.parallax1 , .parallax2 , .parallax3 {line-height: 60px;}
#slider_section {padding-top:150px;}
.comment.reply .avatar img {position: absolute; left:120px; width: 50px;}
#about_section .teammate {margin-bottom:50px; margin-left: 150px;}


}


/*  #Mobile (Portrait)
================================================== */

    /* Note: Design for a width of 320px */

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

header {height: 100px; }
nav.main_nav, nav.main_nav_back {position: absolute; left:0; top:80px; }
.logo {margin-left: 20px;}
body {padding: 0 20px;}
.flex-caption .follow_us p {margin-bottom: 50px;}
.flex-caption span.caption-text-h1 {font-size:30px;}
.bubble {display: none;}
#slider_section {padding-top:150px;}
.slider-img img {height: 350px;}
#contact_section {padding: 0 20px;}
.textarea textarea.message {width: 500px;}
input#submit {}
.option-set li a, .option-set li a.selected { line-height: 50px;}
.blog_section_normal {display:none;}
.blog_section_responsive {display: block; margin-top: 0; margin-bottom: 200px;}
.parallax1 , .parallax2 , .parallax3 {line-height: 60px;}
.parallax1 .text, .parallax2 .text , .parallax3 .text {margin-top:60px; padding: 0 20px;}
.subfooter_container p {padding-left: 20px;}
.comment .content {margin-left: 100px; width: 500px; margin-top: -20px;}
.comment.reply .content {width: 400px;}
.blog_post {padding-top: 200px;}
.switch_out {display: none;}
.parallax1 p, .parallax2 p, .parallax3 p {font-size:45px;}
#about_section .teammate {margin-bottom:50px; margin-left: 120px;}


}


/* #Mobile (Landscape)
================================================== */

    /* Note: Design for a width of 480px */

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

header { padding: 10px 0 150px 0; position:fixed; right:0; left:0; z-index: 999; }
nav.main_nav { margin-bottom:50px; padding-top:20px; }
nav.main_nav ul li { font-size: 15px; margin-right:10px; padding-top:30px; }
nav.main_nav ul li a { margin-bottom:30px; }
.container { padding-top:30px; }
.flex-direction-nav .flex-next ,.flex-direction-nav .flex-prev {display: none;}
.slider-img img {height:auto;}
#about_section .laptop .featured {top:-100px;}
.option-set li a, .option-set li a.selected { line-height: 50px; margin-left:20px;}
.main_form input {width: 100px;}
.textarea textarea.message {width: 280px;}
#slider_section {padding-top:200px;}
.flex-caption span.caption-text-h1 {font-size:20px;}
.parallax1 p.subtext , .parallax2 p.subtext, .parallax3 p.subtext {display: none;}
.comment .content {margin-left: 100px; width: 210px; margin-top: -20px;}
.comment.reply .content {width: 110px;}
.blog_post {padding-top: 200px;}
.comment_form input, .comment_form textarea {padding: 10px 50px 10px 20px;}
.switch_out {display: none;}
.parallax1 p, .parallax2 p, .parallax3 p {font-size:25px;}
#about_section .teammate {margin-bottom:50px; margin-left:0; width: 300px;}
#about_section .team_grid .team_desc, #about_section .team_grid .team_desc.middle {width: 260px;}


}