@import url(http://weloveiconfonts.com/api/?family=fontawesome);

body { padding: 0; margin: 0; color: #666; font-family: 'Roboto', sans-serif; font-weight: 300; }

img {max-width: 100%;}

.container { width: 96%; padding: 2%; clear: both; }

.border { border-bottom: 1px dashed #666; }

.white { background: url(../img/linen.png) repeat; overflow: hidden; }

.big-wrap { vertical-align: middle; display: table-cell; width: 500rem; height: 60rem; }

.content { width: 95%; max-width: 1200px; margin: 0 auto; }

.intro { background: url(../img/66157_551582364861105_1711431160_n.jpg) no-repeat fixed center center; background-size: cover; color: #fff; text-align: center; }

.instagram { background: url(../img/531733_551583194861022_2142672544_n.jpg) no-repeat fixed center left; background-size: cover; color: #fff; }

.contact a { color: #fff; font-weight: bold; }

.contact a:hover { background: cadetblue; color: #fff; }

h1 { font-weight: 300; font-size: 7em; line-height: .8em; font-family: 'Roboto', sans-serif; }

.brackets { font-size: 1.2em; }

.stalemate { font-family: 'Stalemate', Arial, sans-serif; font-weight: 400; font-size: 1.2em; }

h2 { margin: 0 0 20px 0; font-family: 'Roboto', sans-serif; font-weight: 100; font-size: 2.5em; }

h3 { margin: 0 0 20px 0; font-family: 'Roboto', sans-serif; font-weight: 500; font-size: 1em; }

p { padding: 0 0 20px 0; margin: 0; }

.intro p { font-size: 1.2em; font-weight: 300; }

a { text-decoration: none; color: cadetblue; transition: all ease-in-out .2s; -moz-transition: all ease-in-out .2s; -webkit-transition: all ease-in-out .2s; -o-transition: all ease-in-out .2s; }

.nav-wrap { width: 100%; position: fixed; background: rgba(0,0,0,.7); opacity: 1; transition: all ease-in-out .2s; -moz-transition: all ease-in-out .2s; -webkit-transition: all ease-in-out .2s; -o-transition: all ease-in-out .2s; }

.nav-wrap:hover { opacity: 1; }

.nav { width: 100%; margin: 0 auto; list-style: none; }

.nav li { float: left; margin-right: 10px; }

.nav a { padding: 10px 20px; display: block; color: #fff; transition: all ease-in-out .2s; -moz-transition: all ease-in-out .2s; -webkit-transition: all ease-in-out .2s; -o-transition: all ease-in-out .2s; }

.nav a:hover,
a:hover,
.nav li:hover a { color: salmon; }

.nav li ul { position: absolute; left: 0; background: cadetblue; width: 100%; display: none; transition: all ease-in-out .5s; -moz-transition: all ease-in-out .5s; -webkit-transition: all ease-in-out .5s; -o-transition: all ease-in-out .5s; }

.nav li:hover ul { display: block; }

.nav li ul li { margin: 0; }

.nav li:hover ul li a { color: #fff; }

.nav li ul li a:hover { background: salmon; color: #fff; }

.portfolio-object { float: left; width: 19%; padding: 0% 3% 3% 3%; }

.portfolio-object img { max-width: 100%; margin: 0 auto; }

.contact .top { float: right; font-size: 2em; padding-top: 5px; color: rgba(255,255,255,.5); transition: all ease-in-out .2s; -moz-transition: all ease-in-out .2s; -webkit-transition: all ease-in-out .2s; -o-transition: all ease-in-out .2s; }

.contact .top:hover { color: rgba(255,255,255,1); padding-top: 0; padding-bottom: 5px; background: none; }

ul { margin: 0; padding: 0; list-style: none; }

.content ul { margin-left: 10px; }

.content li { margin-left: 20px; margin-bottom: 10px; text-indent: -35px; }

.button { background: cadetblue; float: left; color: #fff; padding: 10px 20px; transition: all ease-in-out .2s; -moz-transition: all ease-in-out .2s; -webkit-transition: all ease-in-out .2s; -o-transition: all ease-in-out .2s; }

.button:hover { background: salmon; color: #fff; }

.tablet-show,
.mobile-show { display: none; }

.cb { clear: both; }

.half { width: 48%; float: left; }

.half.alpha { margin-right: 2%; }

.half.omega { margin-left: 2%; }

[class*="fontawesome-"]:before { font-family: 'FontAwesome', sans-serif; padding: 0 10px; }

.button [class*="fontawesome-"]:before { padding: 0 0 0 10px; }

.instagram-wrap {float: left; width: 9%; margin: .5%; background: coral;}

/*==================================================
Tablet
================================================== */
@media only screen and (max-width : 65em) {

.portfolio-object { width: 40%; display: inline-block; float: none; vertical-align: top; }

.tablet-show { display: block; }

.tablet-hide { display: none; }

.contact a { color: #fff; }

.contact a:hover { background: salmon; color: #fff; }

.intro { background-attachment: scroll; background-position: top center !important; padding-top: 125px; }

.contact { background-attachment: scroll; background-position: top center !important; }



.container,
.big-wrap { display: block; width: 94%; float: left; height: auto; padding: 3%; }

h1 { font-size: 3em; text-shadow: 1px 1px 6px rgba(0,0,0,.4); }

.intro p { font-size: 1em; text-shadow: 1px 1px 6px rgba(0,0,0,.4); }

.button { display: block; }
}
/*==================================================
Phone
================================================== */
@media only screen and (max-width : 45em) {

h1 { font-size: 2em; }

h2 { font-size: 1.5em; }

.portfolio-object { width: 100%; padding: 0 0 20px 0; }

.content { width: 100%; }

.mobile-show { display: block; }

.mobile-hide { display: none; }

.nav-wrap { background: rgba(0,0,0,.5); opacity: 1; }

.nav { text-align: center; }

.nav li { display: inline-block; margin: 0; float: none; }

.nav a { padding: 5px; }

.half { width: 100%; }

.half.alpha { margin-right: 0%; border-bottom: 1px dashed #666; padding-bottom: 20px; margin-bottom: 20px; }

.half.omega { margin-left: 0%; }
}


     /*       |\
  `__\\       //__'
     ||      ||
   \__`\     |'__/
     `_\\   //_'
     _.,:---;,._    __________________
     \_:     :_/   |                  |
       |@. .@|    <  Why hello there! |
       |     |     |__________________|
       ,\.-./ \
       ;;`-'   `---__________-----.-.
       ;;;                         \_\
       ';;;                         |
        ;    |                      ;
         \   \     \        |      /
          \_, \    /        \     |\
            |';|  |,,,,,,,,/ \    \ \_
            |  |  |           \   /   |
            \  \  |           |  / \  |
             | || |           | |   | |
             | || |           | |   | |
             | || |           | |   | |
             |_||_|           |_|   |_|
            /_//_/           /_/   /_/* 
