/* @override http://wp4270-flywheel.netdna-ssl.com/wp-content/themes/grainandmortar/style.css */

/* 
____________________________________________________
|     Grain & Mortar Standard Stylesheet  |
|     By Grain & Mortar                      |
****************************************************

Code and concepts based on the following frameworks/scripts:
   HTML5 Boilerplate (Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal, Kroc Camen, and the H5BP dev community and team.)
   Normalize.css v2.1.1 | MIT License | git.io/normalize
   Twitter Bootstrap (Concepts only, no code utilized)
   960GS (again, concepts only)
Any other credits are commented inline

*/
 
/* ==========================================================================
   Normalize and reset CSS
========================================================================== */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed,  figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; list-style: none;}

article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,video{display:inline-block}audio:not([controls]){display:none;height:0}[hidden]{display:none}html{background:#fff;color:#000;font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}a:focus{outline:none}a:active,a:hover{outline:0}h1{font-size:2em;margin:.67em 0}abbr[title]{border-bottom:1px dotted}dfn{font-style:italic}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}mark{background:#ff0;color:#000}code,kbd,pre,samp{font-family:monospace,serif;font-size:1em}pre{white-space:pre-wrap}q{quotes:"\201C" "\201D" "\2018" "\2019"}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-0.5em}sub{bottom:-0.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:0}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}button,input,select,textarea{font-family:inherit;font-size:100%;margin:0}button,input{line-height:normal}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}textarea{overflow:auto;vertical-align:top}table{border-collapse:collapse;border-spacing:0}
html, body, button, input, select, textarea { font-size: 1em; line-height: 1.4; } strong {font-family: 'Gentona-Bold';}
img { vertical-align: middle; } textarea { resize: vertical; } em {} 
path { transition: all .25s ease-in-out; -webkit-transition: all .25s ease-in-out;}

/* Print styles */
@media print{*{background:transparent!important;color:#000!important;box-shadow:none!important;text-shadow:none!important}a,a:visited{text-decoration:underline}a[href]:after{content:" (" attr(href) ")"}abbr[title]:after{content:" (" attr(title) ")"}.ir a:after,a[href^="javascript:"]:after,a[href^="#"]:after{content:""}pre,blockquote{border:1px solid #999;page-break-inside:avoid}thead{display:table-header-group}tr,img{page-break-inside:avoid}img{max-width:100%!important}@page{margin:.5cm} }

/* Font Styles */

html { font-size: 100%; overflow-y: scroll; -webkit-text-size-adjust: none;  height: 100%;}
body { font-style:normal; font-variant:normal; font-weight:normal; height: 100%; color: #333; line-height: 27px; font-family:'Arial', sans-serif; font-size: 16px;}
a, a:active { font-family: Akzidenz; outline:none; text-decoration: none; cursor:pointer; transition: all .25s ease-in-out;-moz-transition: all .25s ease-in-out;-webkit-transition: all .25s ease-in-out; color:#7a623b;  outline: 0;}
 a:hover { color: #4D4D4D; }
a img { -webkit-transition: opacity .25s ease; transition: opacity .25s ease;}
a img:hover { cursor: pointer; opacity: 0.75;}
h2 a, h3 a, h4 a { color: inherit; font-size: inherit; font-family: inherit;}
i, em { font-style: normal !important; line-height: 30px;}
label { cursor: pointer; }
input:focus, textarea:focus { background: #dfdfdf; }
input, textarea {   border: 1px solid #DDDDDD;padding: 2.5%;width: 93%;-webkit-transition: background .25s ease;-moz-transition: background .25s ease; transition: background .25s ease;}
:focus { -moz-outline-style:none; outline-color:initial; outline-style:initial; outline-width:0; }
::-moz-selection {color: #fff; text-shadow: none;background-color: #DCA459}
::selection {color: #fff; text-shadow: none;background-color: #DCA459;}
.clear { clear:both;} #left { float: left; } #right { float: right; } .left { float: left; } .right { float: right; }
img, embed, object, video { max-width: 100%; height: auto !important;} 

.wrapper {
   overflow: hidden;
}
.contenttop{
      margin: 0 auto;
   overflow: hidden;
}
a.logo img{
   -webkit-transition:none !important;
   -moz-transition:none !important;
   transition:none !important;
}
a.logo img:hover { opacity: 1}

.content {
   width: 100%;
   margin: 0 auto;
   overflow: hidden;
}

.seccio {
width: 1200px;
margin: 0 auto;
   overflow: hidden;
}
.separador {
  -moz-box-shadow: 0 0 27px -12px inset;
  -webkit-box-shadow: 0 0 27px -12px inset;
  box-shadow: 0 0 27px -12px inset;
    clear: both;
    height: 500px;
    margin: 30px 0;
    overflow: hidden;
    width: 101%;
}



.panels-flexible-region{
   float: none;
   width: 100%;
}
#separadorgrup {
    background: url("images/anna/asseguda_terra.png") no-repeat fixed 80% 0 / cover #ffffff;
}
#separadiscos {
    background: url("images/anna/ma_herbes.png") no-repeat fixed 80% 0 / cover #ffffff;
}
#separadoractuacions {
    background: url("images/anna/mans_darrere.png") no-repeat fixed 80% 0 / cover #ffffff;
}
#separadorcontacte {
    background: url("images/anna/altre.png") no-repeat fixed 80% 0 / cover #ffffff;
}
#separadorpremsa {
   height: 400px !important;
    background: url("images/anna/mira_a_terra.png") no-repeat fixed 80% 0 / cover #ffffff;
}
#separadorsdiscs1 {
	 background: url("images/anna/somriure_terra.png") no-repeat fixed 80% 0 / cover #ffffff;
}
.panels-ipe-empty-pane {
    display: block !important;
}

h2, .h2 {
   margin: 0 0 10px 0 ;
   text-transform: capitalize;
   font: 32px/50px 'Akzidenz';
}
h3, .h3, h4, .h4 {
   margin: 0 0 10px 0 ;
   text-transform: capitalize;
   font: 32px/40px 'Akzidenz';
}
b { font-weight: bold; }
p {
   letter-spacing: 1px;
}
p strong {
   color: #1E2222;
   font-family: 'Arial';
   font-weight: bold;
}
li { padding: 0; }
hr {
   display: block;
   height: 1px;
   border: 0;
   border-top: 1px solid #F0F0F0;
   margin: 1em 0;
   padding: 0;
}





@media screen and (max-width: 1150px) {
h2, .h2 {
   font: 40px/50px 'Akzidenz';
}
}
@media screen and (max-width: 750px) {
h2, .h2 {
   font: 32px/38px 'Akzidenz';
}
p {
   font-size: 15px;
   line-height: 24px;
}
}

.section { height: 300px; position: relative;}

/* container that holds the navigation menu as it would look normally in the page */
.gm_stickyNWSpacer {
   height: 138px;
   width: 100%;
   background: #E4EBED;
}

.gm_stickyNWSpacer {
   display: none;
}

/* this is what it will look like when it is sticking to the top of the window.*/
.gm_stickyNavWrapper.sticky {
   position: fixed;
   top: 60px;
   z-index: 10;
   width: 100%;
   background: #fff;
   box-shadow: 0 3px 0px rgba(26,26,26,0.05);
}

.gm_stickyNavWrapper.sticky p {
   display: none;
}

.gm_stickyNavWrapper.sticky a {
   padding: 25px 0 20px !important;
}

.scrollElement.active { background: #E4EBED; }

/* =============================================================================
Header
========================================================================== */

/*----------Top----------*/
.header-wrapper {
   width: 100%;
   z-index: 15;
   font-size: 15px;
   text-transform: uppercase;
   letter-spacing: 2px;
   background: black;
   position: fixed;
   background: rgba(26, 26, 26, 0.9);
   transition:background 0.5s ease ;
   -webkit-transition:background 0.5s ease ;
   top: 0;
   left: 0;
}

.header-wrapper{
     background: none repeat scroll 0 0 rgba(255, 255, 255, 1);
    border-bottom: 1px solid #ddd;
   padding-top: 25px;
}

.single-gm_work .header-wrapper { background: rgba(26, 26, 26, 0.25); }

.header {
   margin: 0 auto;
   width: 1500px;
   overflow: hidden;
   padding-bottom: 15px;
   
}
.header a.logo {
   float: left;
   margin: 8px 0 0;
   width: 230px;
}
.header a.logo:hover{
   color:#FFF;
}
.header ul {
   
}
.header ul li {
 
   display: table-cell;
   font-family:'RefrigeratorDeluxeW01-R';
   font-size: 23px;
}
.header ul li:first-child {
   margin: 0
}
.header ul li a {
    color: #333;
    display: block;
    font-size: 21px;
    height: 45px;
    padding: 18px 20px 0 18px;
    
    font-family: 'Akzidenz';
   
}
.header ul li a:hover {
   color: #7A623B;
   background: #DCA459;
}
.mobileNavWrapper ul.nav li a {
   border-bottom: 1px solid #E3B77B;
   width: 100%;
   float: left;
   display: block;
 /*  color: #FFF;*/
   font-weight: normal;
   font-style: normal;
   font-size: 15px;
   text-transform: uppercase;
   letter-spacing: 2px;
    padding: 20px 20px 20px 71px;
   background: #DCA459;
}
.mobileNavWrapper ul.nav li a:hover {
   color: #FFF;
   background: #E3B77B !important;
}

@media screen and (max-width: 1550px) {
.header a.logo {
   margin: 16px 0 0 30px;
   width: 230px;
}
}
@media screen and (max-width: 1500px) {
.header {
   width: 100%;
}
}
@media screen and (max-width: 1150px) {

.header a.logo {
   width: 180px;
   margin: 14px 0 0 20px;
}
.header ul li a {
   padding: 18px 13px 0 ;
   font-size: 18px;
   background: #fff !important;
}
.header-wrapper {
   height: 61px;
   padding-top: 0;
}
.header ul li a {
   height: 43px;
}
}




/*@media screen and (max-width: 600px) {
.header-wrapper {
   background: rgba(26, 26, 26, 0.95); 
}
.wrapper {
   padding: 61px 0 0 0;
}
}*/


@media screen and (max-width: 500px) {
.header a.logo {
   width: 130px;
   margin: 15px 0 0 20px;
}
}



/* ----------------- Mobile Navigations ----------------- */

.mobileNavWrapper {
   display: none;
   width: 250px;
   height: 100%;
   min-height: 100%;
   position: fixed;
   right: -250px;
   top: 0;
   overflow-x: hidden;
   z-index: 16;
   background: #DCA459;
}

.mobileNavWrapper, .header, .footer {
   -webkit-transition: all .30s ease;
   -ms-transition: all .30s ease;
   transition: all .30s ease;
   -webkit-transform: translateX(0px);
   -ms-transform: translateX(0px);
   transform: translateX(0px);
   -webkit-backface-visibility: hidden;
   -ms-backface-visibility: hidden;
   backface-visibility: hidden;
}

.mobileNavWrapper.showNav, .wrapper.showNav, .header.showNav, .footer.showNav {
   -webkit-transform: translateX(-250px);
   -ms-transform: translateX(-250px);
   transform: translateX(-250px);
}
.wrapper {
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.menuWrapper { float: right; }

#menubuttonsvg, #forwardsvg, #backsvg {
   display: none;
   cursor: pointer;
   float: right;  
   padding: 0;
   -webkit-transition: all 0.3s ease 0s;
   transition: all 0.3s ease 0s;

}
#menubuttonsvg {
   padding: 6px 0 6px 10px;
}
#forwardsvg, #backsvg  {
   padding: 6px 10px;
   border-right: 1px solid #333;
   border-left: 1px solid #333;
}
#backsvg  {
   border-right: none;
}
#menubuttonsvg:hover, #forwardsvg:hover, #backsvg:hover {
   background: #DEA653;
}

/*#mobileMenuButton:hover path {
   fill: #D8A55C;
}*/

#pagename {
   position: absolute;
   left: ;
   width: ;;
}

.logoLink, .mainNav { display: inline-block; }

@media all and (max-width: 850px) {
.mobileNavWrapper, #menubuttonsvg, #forwardsvg, #backsvg { display: inline-block; }
}
@media screen and (max-width: 500px) {
#backsvg  {
   display: none;
}
}



/* =============================================================================
Home
========================================================================== */

/*-------------------Video Popup-------------------*/
.gm_lightbox_overlay {
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   z-index: 999;
   display: none;
   background: rgba(0,0,0,0.75); /* Feel free to change this to match your color scheme */
}

/* This is the wrapper element that holds the video player. Its height and width control the video size */
.gm_lightbox_wrapper {
   z-index: 1000;
   display: none;
   margin: 20px auto;
   position: relative;
   width: 75%;
   padding-bottom: 42.2%;
}

.gm_lightbox_wrapper iframe,  
.gm_lightbox_wrapper object,  
.gm_lightbox_wrapper embed {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   z-index: -1;
   display: block;
}

/* This styles the close button in the upper right corner of the video */
.gm_lightbox_close {
   position: absolute;
   top: 0px;
   right: -55px;
   cursor: pointer;
   z-index: 2;
}

.gm_lightbox_close:hover { opacity: 0.75; }
.gm_lightbox_open { cursor: pointer; }

/*------------------Slideshow------------------*/

.tabHolder{
   width: 100px;
   height: 12px;
   z-index: 5;
   position: absolute;
   right: 0;
   bottom: 20px;
}

.tabs a {
   width:10px;
   height:10px;
   float:left;
   display:block;
   font-size:1px;
   margin-right:20px;
   cursor: pointer;
   background: rgba(255, 255, 255, 0.5); 
}

.tabs a:hover {
background-color: #FFFFFF;
}
.tabs a.current {
background-color: #FFFFFF;
}

.slide_container {
   height: 1000px;
   width: 100%;
   overflow: hidden;
   position: relative;
   background: #59595B;
   height: 920px;
}
.slide {
   height: 100%;
   position: absolute;
   width: 100%;
   -webkit-transition: all 1s ease;
   transition: all 1s ease;
   opacity: 0;
}

.slide1 {
   background: url(images/slide1.jpg) no-repeat center center ;
   -webkit-background-size: cover;
   background-size: cover;
}
.slide2 {
   background: url(images/slide2.jpg) no-repeat center center; 
   -webkit-background-size: cover;
   background-size: cover;
}
.slide3 {
   background: url(images/slide3.jpg) no-repeat center center; 
   -webkit-background-size: cover;
   background-size: cover;
}

.slide1 .slideText {
   width: 700px;
   margin: 350px auto 0;
}
.slide2 .slideText {
   width: 800px;
   margin: 270px auto 0;
}
.slide3 .slideText {
   width: 800px;
   margin: 270px auto 0;
}
.slideText p {
   font-family:"Nimbus Sans DW01Ext";
   text-transform: uppercase;
   color: #FFF;
   letter-spacing: 5px;
   text-align: center;
   margin: 0 0 10px 0;
}
.slideText a {
   width:300px;
   margin: 40px auto 0;
   display: block;
   text-align: center;
   padding: 20px 0;
   color: #FFF;
   font-size: 16px;
   text-transform: uppercase;
   letter-spacing: 4px;
}
.slide2 .slideText a {
   margin: 20px auto 0;
}
.slideText a:hover {
   background: rgba(255,255,255,0.2);
   -moz-border-radius: 5px;
   border-radius: 5px;  
}
.slideText a img {
   width: 24px;
   margin: -5px 15px 0 0;
}
.slideText img.icon {
   width: 90px;
   margin: 30px auto;
   display: block;
}

.slide.active { z-index: 2; opacity: 0.999; }

.navDotContainer {
   position: absolute;
   bottom: 0;
   height: 40px;
   padding-top: 20px;
   z-index: 9;
   margin: 0 auto;
   left: 50%;
   margin-left:-48px;
}

.navDot {
   width: 8px;
   height: 8px;
   border-radius: 8px;
   background: rgba(255,255,255,0.5);
   border: 2px solid rgba(255,255,255,0);
   display: inline-block;
   margin: 8px;
   cursor: pointer;
   -webkit-transition: all 0.4s ease;
   transition: all 0.4s ease;
}

.navDot:hover { background: rgba(255,255,255,1); }

.navDot.active {
   background: rgba(255,255,255,0);
   border: 2px solid rgba(255,255,255,0.75);
}

@media all and (max-width: 1400px) {
   .slide_container { height: 800px; }
   .slide1 .slideText { margin: 300px auto 0;}
   .slide2 .slideText { margin: 220px auto 0;}
   .slide3 .slideText { width: 800px; margin: 200px auto 0;}
}
@media all and (max-width: 1200px) {
   .slide_container { height: 700px; }
   .slide1 .slideText { margin: 270px auto 0;}
   .slideText a { margin: 10px auto 0;}
   .slide2 .slideText { margin: 180px auto 0; width: 700px;}
   .slide3 .slideText { width: 700px; margin: 170px auto 0;}   
}
@media all and (max-width: 1000px) {
   .slide_container { height: 600px; }
   .slideText p { display: none;}
   .slide1 .slideText { margin: 220px auto 0; width: 500px;}
   .slide2 .slideText { margin: 160px auto 0; width: 600px;}   
   .slide3 .slideText { width: 700px; margin: 150px auto 0;}   
}
@media all and (max-width: 850px) {
   .slide_container { height: 500px; }
   .slide1 .slideText { margin: 190px auto 0;}
   .slide2 .slideText { margin: 130px auto 0; width: 500px;}   
   .slide3 .slideText { width: 500px; margin: 130px auto 0;}   
   .slideText img.icon { width: 60px;}
}
@media all and (max-width: 700px) {
   .slide_container { height: 400px; }
   .slide1 .slideText { margin: 150px auto 0; width: 290px;}
   .slide2 .slideText { margin: 130px auto 0; width: 290px;}   
   .slide3 .slideText { width: 290px; margin: 110px auto 0;}   
      .slideText img.icon { width: 50px;}
}


/* videos */
.homeVideo {
   opacity: 0;
   -webkit-transition: all 0.5s ease;
   transition: all 0.5s ease;
   position: absolute;
   top: 0;
   min-width: 100%;
   min-height: 100%;
   z-index: -1; 
   overflow: hidden;
   background: #e5edf0;
   height: 100%;
}

.closeButtonMobile {width: 100%; height: 0; clear: both;}
.homeVideo.playing { opacity: 1; z-index: 1; border-top: none;}
.slideText.playing, .navDotContainer.playing { z-index: -1; }
#headerWrapper { 
   -webkit-transition: -webkit-transform 1.5s ease, background 0.5s ease; 
   transition: transform 1.5s ease, background 0.5s ease; 
} 
#headerWrapper.playing { transform: translateY(-200px); -webkit-transform: translateY(-200px);}
.closeButton, .closeButton2 { 
   background: none repeat scroll 0 0 rgba(0, 0, 0, 0.5);
    border-radius: 5px;
    color: #FFFFFF;
    cursor: pointer;
    display: none;
    height: 35px;
    opacity: 0;
    padding: 10px;
    position: absolute;
    right: 20px;
    top: 20px;
    z-index: 99;
}
.closeButton.playing, .closeButton2.playing { display: block; opacity: 1; }
#watchVideoMobile, #watchVideoMobile2 { display: none; }

@media screen and (orientation: landscape) and (max-device-width : 1280px), screen and (orientation: portrait) and (max-device-width : 1280px) {
   .homeVideo, #watchVideo, #watchVideo2 { display: none; }
   .homeVideo.playing { opacity: 1; z-index: 1; border-top: none; display: inherit;}
   #watchVideoMobile, #watchVideoMobile2 { display: inherit; }
   .closeButton, .closeButton2 { display: none; position: absolute; top: 2px; right: 50%; margin-right: -30px; text-align: center; cursor: pointer; opacity: 0; color: #fff; padding: 10px; background: rgba(0,0,0,0.5); border-radius: 5px; width: 40px;}
   .closeButton.playing, .closeButton2.playing { display: block; opacity: 1; }
   .closeButtonMobile {position: relative;}
}

.aboutVideo {
   min-width: 100%;
   z-index: 1; 
   overflow: hidden;
   background: #E8E8E8;
   display: block;
}

.aboutVidWrapper {
   max-height: 675px;
   height: 100%;
   width: 100%;
   overflow: hidden;
   position: relative;
   background: #E8E8E8;
}

@media screen and (min-width: 1500px) {
   .aboutVidWrapper { max-height: 875px; }
}

@media screen and (min-width: 2000px) {
   .aboutVidWrapper { max-height: 1000px; }
}

.midwestOverlay {
   position: absolute;
   max-width: 700px;
   width: 50%;
   top: 20%;
   left: 5%;
   z-index: 4;
}

.aboutVidWrapperContent {
   width: 100%;
   max-width: 1200px;
   margin: 0 auto;
}

.videoPlaceholder { display: none; }

@media screen and (orientation: landscape) and (max-device-width : 1280px), screen and (orientation: portrait) and (max-device-width : 1280px) {
   .aboutVideo, .midwestOverlay { display: none; }
   .videoPlaceholder { display: block; }
}

/*-------------------Sec 2-------------------*/

a.button {
   background: #DEA653;
   color: #FFF;
   letter-spacing: 3px;
   text-transform: uppercase;
   height: 40px;
   width: 250px;
   padding: 15px 0 0 0;
   font-size: 13px;
   -moz-border-radius: 5px;
   border-radius: 5px;  
}
a.button:hover {
   background: #D68F27;
}




/* =============================================================================
Footer
========================================================================== */


.footer {
   background: #1E2222;
   padding: 50px 0 80px;
   color: #3C4544;
}
.col1 {
   float: left;
   width: 160px;
}
.col1 li a {
   background: #3C4544;
   width: 35px;
   height: 35px;
   float: left;
   border-radius: 50%;
   text-align: center;
   margin: 0 18px 0 0;
}
.col1 li a:hover {
   background: #DDA55A;
}

.col1 li img {
   width: 18px;   
   margin: 5px 0 0 0;
}
.col2 {
   position: absolute;
   width: 380px;
   left: 50%;
   margin: 6px 0 0 -200px;
   text-align: center;
}
.col2 p {
   text-transform: uppercase;
   font-size: 12px;
   letter-spacing: 2px;
   line-height: 20px;
}
.col3 {
   float: right;
   width: 170px;
}
.col3 img {
   width: 16px;
   margin: -2px 7px 0 0;

}
.col3 a {
   color: #1E2222;
   text-align: center;
   text-transform: uppercase;
   letter-spacing: 1px;
   border-radius:25px;
   width: 170px;
   background: #3C4544;
   display: block;
   font-size: 13px;
   height: 30px;
   padding: 5px 0 0 0;
}
.col3 a:hover {
   background: #DDA55A;
}

@media all and (max-width: 900px) {
.col2 {
   width: 190px;
   margin: 0 0 0 -110px;
}
.respond {
   display: none;
}
.col1, .col3 {
   margin: 2px 0 0 0;
}
}
@media all and (max-width: 650px) {
.col2 {
   position: inherit;
   width: 100%;
   margin: 0 0 30px 0;
}

.col1, .col3 {
   width: 100%;
   margin: 0 0 30px 0;
}
.col1 ul {
   margin: 0 auto;
   width: 160px;
   overflow: hidden;
}
.respond {
   display: inline;
}
.col3 a {
   margin: 0 auto;
}
.col1 li a {
   margin: 0 9px;
}
}
@media all and (max-width: 500px) {
.col2 {
   width: 190px;
   margin: 0 auto 30px; 
}
.respond {
   display: none;
}
}







/* =============================================================================
Services
========================================================================== */


/*------------------ Hero -------------------*/

.hero {
   padding: 0 0 0 0;
   text-align: center;
   color: #FFF;
}

.page-id-12 .hero {
   background: url(images/services.jpg) no-repeat center center ;
   -webkit-background-size: cover;
   background-size: cover;
}
.front .views-slideshow-cycle-main-frame-row{
   position: relative;
}
.hero h2,
.region-extra2 h2 {
  font-size: 40px;
  position: absolute;
  top:35%;
  width: 100%;
  text-align: center;
   line-height: 130px;
}
.hero h3 {
   font-size: 20px;
   line-height: 130px;
}
.hero p {
   font-size: 18px;
   width: 700px;
   margin: 0 auto 150px;
}

@media all and (max-width: 1000px) {
.hero {
   padding: 0 0 0 0;
}
.hero h2 {
   font-size: 80px;
   line-height: 90px;
}
.hero p {
   font-size: 16px;
   margin: 0 auto 120px;
}
}
@media all and (max-width: 800px) {
.hero p {
   font-size: 16px;
   margin: 0 auto 100px;
   width: 100%;
}
}

/*------------------ Sec2 -------------------*/

.region-extra2 img,
#views_slideshow_cycle_main_icons-block_1,
#views_slideshow_cycle_teaser_section_icons-block_1,
.views_slideshow_slide{
    width: 100% !important;


}
.page-id-12 .sec2 {
   overflow: hidden;
}
.page-id-12 .sec2 ul {
   display: table;
    margin: 0 auto;
    overflow: hidden;
}
.page-id-12 .sec2 li {
   
   width: 150px;
   float:left;
    display: block;
}
.page-id-12 .sec2 li a {
   display: block;
   text-align: center;
   padding: 40px 0;
   color: #808080;
}
.page-id-12 .sec2 li a:hover {
   background: #E4EBED;
}
.page-id-12 .sec2 li a img {
   width: 40px !important;
   margin: 0 0 10px;
      height: auto !important;      
}


@media all and (max-width: 1100px) {
.page-id-12 .sec2 ul {
   width: 100% !important;
   font-size: 12px;
   line-height: 12px;
   display: inline-block;
   text-align: center;
}
}
@media all and (max-width: 900px) {
.page-id-12 .sec2 li a img {
   width: 30px !important;
}
}
@media all and (max-width: 750px) {
.page-id-12 .sec2 li {
   width: 25% !important;
   outline: 1px solid #E4EBED;
}
}
@media all and (max-width: 500px) {
.page-id-12 .sec2 li {
   width: 50% !important;
}
}


/*------------------ Sec3-10 -------------------*/

.page-id-12 .sec3, .page-id-12 .sec7 {
   padding: 90px 0;
   background: #E4EBED;
}
.page-id-12 .sec3{
   padding: 60px 0;
}
 .page-id-12 .sec6 , .page-id-12 .sec8, .page-id-12 .sec10 {
   padding: 90px 0;
}
.page-id-12 .sec5, .page-id-12 .sec9 {
   padding: 90px 0;
   background: #e4ebed;
}
.page-id-12 h3 {
   font-size: 75px;
   line-height: 80px;
   margin: 0 0 30px 0;
}
.page-id-12 h4 {
   font-size: 45px;
   line-height: 50px;

}
.page-id-12 .short {
   width: 45%;
}
.page-id-12 .long {
   width: 600px;
}

.page-id-12  .short {
   margin: 50px 0 0 0;
}

.short p {
   margin: 0 0 50px 0;
}
a.button2 {
   width: 210px;
   border: 2px solid #FFFFFF;
   display: block;
   height: 43px;
   text-align: center;
   letter-spacing: 2px;
   text-transform: uppercase;
   padding: 15px 0 0 0;
   -moz-border-radius: 5px;
   border-radius: 5px;
   color: #666666;   
}
a.button2:hover {
   border: 2px solid #4D4D4D;
}
.sec6 a.button2, .sec10 a.button2 {
   border: 2px solid #DFDFDF;
}
.sec6 a.button2:hover, .sec10 a.button2:hover {
   border: 2px solid #DBA25E;
}
.sec3.sectionAnchor{
   padding: 0;
   margin: 0;
}
.sec3.sectionAnchor .content{
   display: none;
}
a.button3,
.sectionAnchor a{
  border: 2px solid #DBA25E;
    border-radius: 5px;
    display: block;
    letter-spacing: 2px;
    margin: 30px 0 0 10px;
    padding: 0;
    text-align: center;
    text-transform: uppercase;
    width: 294px;
    font-family: Akzidenz;
}
a.button3:hover,
.sectionAnchor a:hover{
   border: 2px solid #4D4D4D;
}
a.button3 img ,
.sectionAnchor a img{
   width: 20px;
   margin: -4px 12px 0 0;
}


@media all and (max-width: 1300px) {
.page-id-12 .long {
   width: 500px;
}
.page-id-12 .sec3 .short {
   margin: 60px 0 0 0;
}
.page-id-12 .sec4 .short {
   margin: 0;
}
.page-id-12 .sec5 .short {
   margin: 15px 0 0 0;
}
.page-id-12 .sec6 .short {
   margin: 0;
}
.page-id-12 .sec7 .short {
   margin: 0;
}
.page-id-12 .sec8 .short {
   margin: 30px 0 0 0;
}
.page-id-12 .sec9 .short {
   margin: 50px 0 0 0;
}
.page-id-12 .sec10 .short {
   margin:  0;
}  
}

@media all and (max-width: 1100px) {
.page-id-12 .long {
   width: 400px;
   margin: 70px 0 0 0;
}
.page-id-12 .short {
   width: 50%;
}
}

@media all and (max-width: 950px) {
.page-id-12 .long {
   margin: 0 auto;
   float: none;
}
.page-id-12 .sec8 .short {
   margin: 0;
}
.page-id-12 .sec9 .short {
   margin: 0;
}
.page-id-12 .sec5 .short {
   margin: 0;
}
.page-id-12 .sec3 .short {
   margin: 0;
}
.page-id-12 .short {
   width: 100%;
   text-align: center;
}
.page-id-12 .long {
   margin: 0 auto 40px ;
}
.page-id-12 a.button3,
.sectionAnchor a{
   margin: 0 auto;
}
a.button2 {
   margin: 0 auto;
}
}
@media all and (max-width: 500px) {
.page-id-12 .long {
   width: 100%;
}
.page-id-12 h3 {
   font-size: 55px;
   line-height: 60px;
   margin: 0 0 10px 0;
}
}


/*------------------ Sec11 -------------------*/

.page-id-12 .sec11 {
   background: #E5EBED;
   padding: 100px 0;
   text-align: center;
}
.page-id-12 .sec11 ul {
   overflow: hidden;
   margin: 60px 0 0 0;
}
.page-id-12 .sec11 li {
   float: left;
   width:20.9%;
   margin: 0 2%;
   font-size: 15px;
}
.page-id-12 .sec11 li p {
   margin: 0 0 20px 0;
}
.page-id-12 .sec11 li .author {

   margin: 0 auto;
}
.page-id-12 .sec11 li .author img {
   width: 75px;
   border-radius: 50%;
   display: block;
   margin: 20px auto 10px;
}
.page-id-12 .sec11 li .author span {
   letter-spacing: 2px;
   text-transform: uppercase;
   font-size: 14px;
   line-height: 16px;
}


@media all and (max-width: 1000px) {
.page-id-12 .sec11 li {
   float: left;
   width:45.9%;
   margin: 0 2% 50px;
   font-size: 15px;
}
.page-id-12 .sec11 li p {
   height: 150px;
}
.page-id-12 .sec11 {
   padding: 120px 0 100px 0;
}
}
@media all and (max-width: 700px) {
.page-id-12 .sec11 li {
   float: left;
   width:100%;
   margin: 0 0 50px;
   font-size: 15px;
}
.page-id-12 .sec11 li p {
   height: auto;
}
}





/* =============================================================================
Work All
========================================================================== */

.post-type-archive .wrapper {
   padding: 65px 0 0 0;
}
.post-type-archive.header-wrapper {
   background: rgba(26, 26, 26, 0.95); 
}

ul.work-all {
   overflow: hidden;
   background: #313131;
}
ul.work-all li {
   float: left;
   width: 33.33334%;
}
ul.work-all a.photo { 
   display: block; 
   position: relative;
}
ul.work-all .photo-bg {
    height: 500px;
   opacity: 0;
   -webkit-transition: opacity 0.5s ease;
    transition: opacity 0.5s ease;
}

ul.work-all .logo{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
   height: 100%;
   -webkit-transition: background 0.25s ease;
   transition: background 0.25s ease;
   background: rgba(247,165,70,0);
}

ul.work-all .logo:hover { background: rgba(247,165,70,0.5); }
ul.work-all a img:hover { opacity: 1; }

ul.work-all .logo img{
    width: 300px;
    margin: 0 auto;
    display: block;
    padding: 180px 0 0 0;
   z-index: 4
}

@media screen and (max-width: 1600px) {
ul.work-all .logo img {
   width: 250px;
   padding: 150px 0;
}
ul.work-all .photo-bg {
    height: 400px;   
}
}
@media screen and (max-width: 1200px) {
ul.work-all .logo img {
   width: 160px;
   padding: 130px 0;
}
ul.work-all .photo-bg {
    height: 350px;   
}
}
@media screen and (max-width: 1150px) {
.post-type-archive .wrapper {
   padding: 61px 0 0 0;
}
}
@media screen and (max-width: 1000px) {
ul.work-all li {
   float: left;
   width: 50%;
}

}
@media screen and (max-width: 600px) {
ul.work-all li {
   width: 100%;
}
}

@media screen and (orientation: portrait) and (max-device-width : 1024px), screen and (orientation: landscape)and (max-device-width : 1024px) {
a img { -webkit-transition: none; transition: none;}
a img:hover { cursor: pointer; opacity: 1;}
ul.work-all a.photo:hover .photo-bg { opacity: 1; }
ul.work-all a.photo:active .photo-bg { opacity: 0.4; }
}



/* =============================================================================
About
========================================================================== */



.midwest-made {
   height: 900px ;
   background: url(images/filler.jpg) no-repeat center center ;
   -webkit-background-size: cover;
   background-size: cover;
}


/*------------------ Sec3 -------------------*/
ul.bio-all {
   overflow: hidden;
   background: #313131;
}
ul.bio-all li {
   float: left;
   width: 33.33%;
   position: relative;
   overflow: hidden
}

ul.bio-all .photo-bg {
    -webkit-transition: opacity 0.15s ease;
    transition: opacity 0.15s ease;
    opacity: 0.4;
    height: 500px;   
   width: 100%;
}
ul.bio-all a.photo:hover .photo-bg { opacity: 1; }

ul.bio-all .name{
   position: absolute;
    width: 100%;
    margin: -80px auto 0;
   z-index: 4;
    text-align: center;
}
ul.bio-all .name h5{
   text-transform: uppercase;
   color: #FFF;
   letter-spacing: 3px;
   font-size: 24px;
   margin: 0 0 5px 0;
}
ul.bio-all .name p {
   text-transform: uppercase;
   letter-spacing: 4px;
   font-size: 14px;
   color: #A0A0A0;
}
ul.bio-all  a.photo:hover .name p {
   color: #FFF;
}

@media screen and (max-width: 1600px) {
ul.bio-all .logo img {
   width: 200px;
   padding: 150px 0;
}
ul.bio-all .photo-bg {
    height: 400px;   
}
ul.bio-all .name h5{
   font-size: 18px;
   margin: 0;
}
ul.bio-all .name p {
   font-size: 12px;
}
}
@media screen and (max-width: 1200px) {
ul.bio-all .logo img {
   width: 160px;
   padding: 130px 0;
}
ul.bio-all .photo-bg {
    height: 350px;   
}
}
@media screen and (max-width: 1000px) {
ul.bio-all li {
   float: left;
   width: 50%;
}
}

@media screen and (max-width: 600px) {
ul.bio-all li { width: 100%; }
}

@media screen and (orientation: portrait) and (max-device-width : 1280px), screen and (orientation: landscape)and (max-device-width : 1280px) {
ul.bio-all .photo-bg {
    -webkit-transition: none;
    transition: none;
    opacity: 0.6 !important;
}
ul.bio-all  a.photo .name p {
   color: #FFF;
}
}

/*------------------ Sec5 -------------------*/



/*------------------ Sec6 -------------------*/





/* =============================================================================
Bio
========================================================================== */

.bio-hero {
   overflow: hidden;
   height: 450px;
   padding: 350px 0 0 0;
   color: #FFF;
   text-align: center;
}
.bio-hero h2 {
   font-size: 150px ;
   line-height: 140px;
   margin: 0;
}
.bio-hero h3 {
   text-transform: uppercase;
   color: #FFF;
   letter-spacing: 5px;
   font-size: 28px;
   margin: 0 0 5px 0;
   font-family: 'Arial';
}


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

.bio-hero {
   height: 350px;
   padding: 300px 0 0 0;
}  
}
@media screen and (max-width: 1000px) {
.bio-hero h2 {
   font-size: 100px ;
   line-height: 100px;
}
.bio-hero h3 {
   font-size: 20px;
}
.bio-hero {
   height: 300px;
   padding: 250px 0 0 0;
}  
}
@media screen and (max-width: 800px) {
.bio-hero h2 {
   font-size: 80px ;
   line-height: 80px;
}
}
@media screen and (max-width: 600px) {
.bio-hero h2 {
   font-size: 50px ;
   line-height: 50px;
}
.bio-hero {
   height: 200px;
   padding: 150px 0 0 0;
}
.bio-hero h3 {
   font-size: 16px;
}
}


/*------------------ Sec2 -------------------*/

.bio-content {
   padding: 80px 0;
   overflow: hidden;
   width: 1000px;
   margin: 0 auto 50px;
}
.bio-content .left {
   width: 25%;
}
.bio-content .right {
   width: 65%;
}
.bio-content h4 {
   font-size: 40px;
   line-height: 50px;
}

.bio-content .left {
   margin: 145px 0 0;
}
.bio-content .left img {
   margin: 0 0 10px 0;
}
ul.connect {
   margin: 40px 0 0 0;
}
ul.connect li a img {
   float: left;
   width: 26px;
   margin: 0 10px 0 0;
   opacity: 0.7;
}
ul.connect li img:hover {
   opacity: 0.5;
}
.bio-content .responsive {
   display: none;
}

@media screen and (max-width: 1100px) {
.bio-content {
   width: 90%;
}
}

@media screen and (max-width: 700px) {
.bio-content .left {
   display: none;
}
.bio-content .right {
   width: 100%;
}
.bio-content .responsive {
   display: inherit;
   margin: 30px 0 30px 8%;
   float: right;
   width: 30%;
}
.bio-content .responsive img {
   width: 250px;
   margin: 0 0 10px 0;
}
}
@media screen and (max-width: 500px) {
.bio-content .responsive {
   width: 250px;
   float: none;
   margin: 50px auto;
}
}


/*------------------ Bio Single -------------------*/

ul.bio-single {
   overflow: hidden;
   background: #313131;
}
ul.bio-single li {
   float: left;
   width: 14.25%;
   position: relative;
}
ul.bio-single .photo-bg {
    -webkit-transition: opacity 0.25s ease;
    transition: opacity 0.25s ease;
    opacity: 0.4;
    height: 200px;   
}
ul.bio-single a.photo:hover .photo-bg { opacity: 1; }


@media screen and (max-width: 1600px) {
ul.bio-single .photo-bg {
    height: 150px;   
}
}
@media screen and (max-width: 1200px) {
ul.bio-single .photo-bg {
    height: 120px;   
}
}
@media screen and (max-width: 900px) {
ul.bio-single .photo-bg {
    height: 100px;   
}
}
@media screen and (max-width: 700px) {
ul.bio-single li {
   width: 25%;
}
ul.bio-single .photo-bg {
    height: 150px;   
}
}
@media screen and (max-width: 500px) {
ul.bio-single .photo-bg {
    height: 80px;   
}
}





/* =============================================================================
 Gravity Forms
   ========================================================================== */

.gform_wrapper .gform_body .gform_fields .gfield input[type=text],
.gform_wrapper .gform_body .gform_fields .gfield input[type=email],
.gform_wrapper .gform_body .gform_fields .gfield input[type=tel],
.gform_wrapper .gform_body .gform_fields .gfield input[type=url],
.gform_wrapper .gform_body .gform_fields .gfield input[type=number],
.gform_wrapper .gform_body .gform_fields .gfield input[type=password],
.gform_wrapper .gform_body .gform_fields .gfield select,
.gform_wrapper .gform_body .gform_fields .gfield textarea {
background: #DFDFDF;
border: none;
font-size: 24px;
padding: 10px 15px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
-ms-border-radius: 3px;
-o-border-radius: 3px;
border-radius: 3px;
transition: background .25s ease-in-out;
-moz-transition: background .25s ease-in-out;
-webkit-transition: background .25s ease-in-out;
width: 98%;
font-weight: normal;
}
.gform_wrapper .gform_body .gform_fields .gfield select {
   font-size: 18px;
}

/*.page-id-26 .gform_wrapper .gform_body .gform_fields .gfield input[type=text] {
background: #FFF;
}
.gform_wrapper .gform_body .gform_fields .gfield select {
font-size: 16px;
background: #FFF;
border: 1px solid #C6C6C6;
}*/
.gform_wrapper .gform_body .gform_fields .gfield input[type=text]:focus,
.gform_wrapper .gform_body .gform_fields .gfield input[type=email]:focus,
.gform_wrapper .gform_body .gform_fields .gfield input[type=tel]:focus,
.gform_wrapper .gform_body .gform_fields .gfield input[type=url]:focus,
.gform_wrapper .gform_body .gform_fields .gfield input[type=number]:focus,
.gform_wrapper .gform_body .gform_fields .gfield input[type=password]:focus,
.gform_wrapper .gform_body .gform_fields .gfield select:focus,
.gform_wrapper .gform_body .gform_fields .gfield textarea:focus {
background: #DCE4E6;
}
.gform_wrapper .ginput_complex label,
.gform_wrapper .gfield_time_hour label,
.gform_wrapper .gfield_time_minute label,
.gform_wrapper .gfield_date_month label,
.gform_wrapper .gfield_date_day label,
.gform_wrapper .gfield_date_year label,
.gform_wrapper .instruction {

}
.gform_button{
border:none;
float: left;
cursor: pointer;
background: #DEA653;
color: #FFF;
letter-spacing: 3px;
text-transform: uppercase;
height: 60px;
width: 250px;
padding: 0;
font-size: 13px;
-moz-border-radius: 5px;
border-radius: 5px;  
}
.gform_button:hover {
background: #E9AC44;
}

.content .gform_wrapper .top_label .gfield_label, .questions .gform_wrapper .top_label .gfield_label  {
   margin: 30px 0 5px 0;
   font-weight: normal;
}
.questions .gform_wrapper .top_label .gfield_label  {
   color: black;
   font-size: 18px;
}



/*-------------------------Questions-------------------------*/

li.gchoice_6_1, li.gchoice_6_2, li.gchoice_6_3, li.gchoice_6_4, li.gchoice_6_5, li.gchoice_6_6 {
   font-size: 18px;
}
#gform_2 li, #gform_7 li {
   margin: 0 0 20px 0;
}

li#field_7_11, li#field_7_12{
   margin: 40px 0 20px 0;
}
.ginput_left {
   float: left;
}


/*-------------------------Designer-------------------------*/




/* =============================================================================
   Blog
   ========================================================================== */
     
   
.blog-cat {
margin: 65px 0 0 0;
}
.blog-cat .right  {
   width: 40%;
}
ul.cat {
   overflow: hidden;
   width: 100%;
   float: right;
}
ul.cat li {
   float: left;
   width: 25%;
}
ul.cat li a {
   display: block;
   text-align: center;
   padding: 20px 0;
   color: #808080;
}
ul.cat li a:hover {
   background: #E4EBED;
}
ul.cat li a img {
   width: 40px;
   margin: 0 0 10px;
}

.blog-cat .left {
   margin: 43px 0 0 0;
   width: 750px;
}


@media screen and (max-width:1500px) { 
.blog-cat .left {
   margin: 30px 0 0 0;
   width: 50%;
}
.blog-cat .right  {
   width: 45%;
}
}
@media screen and (max-width:850px) { 
.blog-cat .left {
   margin: 15px 0 0 0;
   width: 45%;
}
.blog-cat .right  {
   width: 45%;
}
}
@media screen and (max-width:600px) { 
.blog-cat .left {
   display: none;
}
.blog-cat .right  {
   width: 100%;
}
}


/*-------------------------Image & Gravatar-------------------------*/

.chalkboard-post {
   overflow: hidden;
   padding: 0 0 50px 0;
}
.single .chalkboard-post {
   padding: 0;
}
.blog-hero {
   text-align: center;
   padding: 250px 0 100px 0;
}
.blog .blog-hero h2 a, .archive .blog-hero h2 a, .single .blog-hero h2 a {
   margin: 100px auto 0;
   color: #FFF;
   font-size: 90px;
   line-height: 90px;
}
.author-header {
   width: 300px;
   text-align: center;
   margin: -50px auto 0;
   position: relative;
}
.author-header h6 a {
   color: #797979;
   text-transform: uppercase;
   letter-spacing: 2px;
   margin: 0 0 20px 0;
   display: block;
   font-size: 14px;
}
.author-header h6 a:hover {
   color: #CD9660;
}
.avatar {
   width: 100px;
   height: 100px;
   border-radius: 100%;
   margin: 0 0 10px 0;
   border: 5px solid #FFF;
}
.blog .blog-content iframe {
   margin: 0 auto;
   display: block;
}

iframe { margin: 0 auto; display: block; }

@media screen and (max-width:1200px) { 
.blog .blog-hero h2 a {
   font-size: 60px;
   line-height: 60px;
}
.blog-hero {
   padding: 200px 0 100px 0;
}
}
@media screen and (max-width:800px) { 
.blog .blog-hero h2 a {
   font-size: 50px;
   line-height: 50px;
}
.blog-hero {
   padding: 110px 0 100px 0;
}
}


/*-------------------------Post-------------------------*/


.blog-content {
   width: 1000px ;
   margin: 0 auto;
}
.blog-content img {
   margin: 0 0 10px 0;
}
.blog-details {
   margin: 30px 0 30px;
}
.blog-content li  {
   list-style: disc;
   margin: 0 0 15px 0;
   letter-spacing: 1px;
}

@media screen and (max-width:1100px) { 
.blog-content {
   width: 90%;
   margin: 0 auto;
}
}




/*-------------------------Image Fix-------------------------*/

.blog-content img.alignnone{
   text-align: center;
   margin: 0 auto 10px;
   display: block;
   height: auto;
}

.wp-caption {
    max-width: 100%; 
    text-align: center;
}
.wp-caption.alignnone {
    margin: 5px 20px 20px 0;
}
.wp-caption.alignleft {
    margin: 0 0 20px 0;
}
.wp-caption img {
    border: 0 none;
    height: auto;
    margin: 0;
    max-width: 98.5%;
    padding: 0;
    width: auto;
}

.wp-caption p.wp-caption-text {
  margin: -200px 0 0 800px;
  position: absolute;
  width: 200px;
  border-bottom: 3px solid #F0F0F0;
  padding: 0 0 15px 0;
  text-align: left;
}


@media screen and (max-width:1100px) { 
.wp-caption p.wp-caption-text {
   margin: 10px 0 0 0;
   width: 100%;
   border-bottom: none;
   padding: 0;
   position: static;
}
}



/*-------------------------Bottom-------------------------*/

.bottom-content {
   color: #C2C2C2;
   border-top: 1px solid #E2E2E2;
   text-transform: uppercase;
   font-size: 13px;
   letter-spacing: 2px;
   margin: 100px 0 0;
}
.blog .bottom-content a, .single .bottom-content a, .archive .bottom-content a {
   letter-spacing: 2px;
}

.bottom-content .right{
   width: 320px;
   float: right;
   margin: 10px 0 0 0;
}
.bottom-content .right p{
   overflow: hidden;
   width: 155px;
   float: right;
   margin: 5px 0 00;
}

.bottom-content .right ul{
   margin: 0 0 30px 0;
   width: 160px;
   float: right;
}
.bottom-content .right li {
   list-style: none;
   margin: 0;
}
.bottom-content .right li a {
   background: #4D5756;
   width: 35px;
   height: 35px;
   float: left;
   border-radius: 50%;
   text-align: center;
   margin: 0 0 0 18px;
}

.bottom-content .right li img {
   width: 18px;   
   margin: 6px 0 0 0;
}
.bottom-content  .right li img:hover {
   opacity: 1;
}

.bottom-content .right li.facebook a:hover { background: #5C7BAA;}
.bottom-content .right li.twitter a:hover { background: #69B9EC;}
.bottom-content .right li.heart a:hover { background: #EC6990;}


@media screen and (max-width:750px) {
.bottom-content .right{
   width: 100%;   
   margin: 10px 0 0 0;
}
.bottom-content .right p{
   display: none;
}
.bottom-content .right ul{
   float: none;
   margin: 0 auto;
}
.bottom-content .left{
   width: 100%;
   text-align: center;
   font-size: 12px;
}
.bottom-content .left p{
   font-size: 12px;
}
.bottom-content .right li a {
   margin: 0 9px;
}
}

/* like button */

.heart a.liked { background: #EC6990 !important; }

.heart a {
   -webkit-transform: scale(1);
   transform: scale(1);
}

.heart a:active {
   -webkit-transform: scale(0.75);
   transform: scale(0.75);
}

.heart img {
   -webkit-transition: all 0.25s ease;
   transition: all 0.25s ease;
}

.likesCount { text-align: center; width: 100%; color: #6D6D6D;line-height: 27px;font-family: 'Arial', sans-serif;font-size: 16px; margin-top: 5px;display: block;}

/*-------------------------Previous & Next Buttons-------------------------*/

.alignleft.button a, .alignright.button a {
   float: left;
   background: #DCA459;
   color: #FFF;
   padding: 12px 40px;
   font-size: 15px;
   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
   -ms-border-radius: 5px;
   -o-border-radius: 5px;
   border-radius: 5px;
   float: left;
   transition: background .25s ease-in-out;
   -moz-transition: background .25s ease-in-out;
   -webkit-transition: background .25s ease-in-out;
   font-size: 16px;
   letter-spacing: 1px;
}
.alignleft.button a:hover, .alignright.button a:hover {
 background: #D48E34;
}
.alignright.button a {
float: right;
}

@media screen and (max-width: 500px) { 
   .alignleft a, .alignright a {
   width: 100%;
   display: block;
   padding: 10px 0 !important;
   text-align: center;
   margin: 10px 0;
   }
}

/*-------------------------Pinterest Button-------------------------*/
.gm_pinit_button {
   position: absolute;
   bottom: 3px;
   left: 3px;
   z-index: 2;
   opacity: 0;
}

.gm_pinit_wrapper {
   display: block;
   height: 100%;
   position: relative;
   width: 100%;
   margin: 0 auto;
   max-width: 750px;
}
.gm_pinit_wrapper img:hover{ opacity: 1; }
.gm_pinit_wrapper:hover .gm_pinit_button,
.gm_slider_slide:hover .gm_pinit_button {
   opacity: 0.99;
   -webkit-transition: all 0.5s ease;
   transition: all 0.5s ease;
}

/*-------------------------Next Post (Single)-------------------------*/

.next-post {
   overflow: hidden;
   text-align: center;
}
.next-post ul {
   overflow: hidden;
}
.next-post li {
   float: left;
   width: 25%;
   display: table;
   height: 250px;
}
.next-post li a {
   width: 100%;
   height: 250px;
   display: block;
   color: #FFF;
   display: table-cell;
    vertical-align: middle;
}
.next-post li a:hover {
   opacity: .75;
}
.next-post h4 {
   color: #C2C2C2;
   margin: 0 0 50px 0;
}
.next-post h3 {
   padding: 5%;
}

@media screen and (max-width: 1100px) { 
.next-post h3 {
   font-size: 24px;
   line-height: 28px;
}
.next-post li {
   width: 50%;
}
}
@media screen and (max-width: 600px) { 
.next-post li {
   width: 100%;
}
}



/* =============================================================================
   Post Styles
   ========================================================================== */

.post {
   padding: 0 0 80px 0;
   margin: 0 0 80px 0;
   overflow: hidden;
}
.single .post {
   padding: 0 0 40px 0;
   margin: 0 0 40px 0;
}
.post p {
   margin:14px 0 14px 0;
}
.post a {
color:#E9AC44;
text-decoration: none;
}
.post a:hover {
color: #1F1E1A;
}
.post em{
font-style:italic;
font-family: 'Gentona-LightItalic';
}
.post h1, .post h1 a, .post h2  {
font-size:36px;
font-weight:normal;
line-height: 36px;
color: #646A69;
}
.post h1 a:hover, .post h2 a:hover {
color: #E9AC44;
}
.blog .post h3, .single .post h3, .archive .post h3 {
margin:25px 0 10px 0;
font-weight:normal;
line-height: 45px;
font-size: 40px;
}
.post h4 {
font-size:18px;
}
.post .indent {
padding-left:10px;
}
.post .indent p {
padding-left:10px;
}
.post small {
font-size:11px;
}
.post small a {
font-weight:normal;
}
.post .alignright {
float:right;
margin-left:10px;
}
.post .aligncenter {
margin:0 auto;
display:block;
}
.post abbr {
font-weight:normal;
}
.post ul{
list-style:circle;
margin:0 0 0 25px;
}
.post ol{
list-style:decimal;
margin:0 0 0 30px;
}
.post .wp-caption a, .post .wp-caption a:hover {
border-bottom:0;
}
.post blockquote {
color:#777;
border-left:5px solid #ccc;
margin:15px 30px 0 10px;
padding-left:20px;
}
.post pre {
font-family:courier;
font-size:12px;
letter-spacing:-1px;
margin:14px 0 14px 0;
}
.post .message ul {
margin:12px 0 0;
}
.post .message {
display:none;
background:#0F67A1;
margin-top:10px;
padding:20px;
color:#fff;
}

.navigation-single {
border-top: 1px dotted #999B9E;
border-bottom: 1px dotted #999B9E;
padding: 20px 0;
margin: 20px 0 0 0;
}


@media screen and (max-width: 800px) { 
.blog .post h3, .single .post h3, .archive .post h3 {
line-height: 35px;
font-size: 30px;
}
}




/* =============================================================================
   Work Bottom
   ========================================================================== */


.work-top {
   height: 160px;
   overflow: hidden;
}
.work-nav {
   width: 700px;
   margin: 0 auto;
   height: 160px; 
}
.previous-work a, .all-work a, .next-work a {
   display: block;
   width: 33%;
   float: left;
   border-right: 1px solid #E3E3E3;
   height: 160px;
   text-align: center;
   color: #A8ACAD;
}
.previous-work a img, .all-work a img, .next-work a img {
   width: 50px;
   margin: 30px auto 20px auto;
   display: block;
}
.previous-work a {
   border-left: 1px solid #E3E3E3;
}
.previous-work a:hover, .all-work a:hover, .next-work a:hover {
   background: #f5f5f5 ;
}

@media screen and (max-width: 750px) { 
.work-nav {
   width: 100%;
}
.next-work a {
   border-right: none;
      width: 33.5%;
}
.previous-work a {
   border-left: none;
}
.previous-work a p, .all-work a p, .next-work a p {
   font-size: 12px;
}
.previous-work a img, .all-work a img, .next-work a img {
   width: 30px;
   margin: 25px auto 10px auto;
}
.previous-work a p span, .all-work a p span, .next-work a p span {
   display: none;
}
.work-top {
   height: 100px;
}
.work-nav {
   height: 100px; 
}
.previous-work a, .all-work a, .next-work a {
   height: 100px;
}
}








/* =============================================================================
   Work Single
   ========================================================================== */

.grid {
   background: #f5f5f5 url(/wp-content/themes/grainandmortar/images/bg-r.jpg); 
}

.work-hero {
   overflow: hidden;
   padding: 125px 0 0 0;
   text-align: center;
   color: #FFF;
}
.work-hero h2 {
   font-size: 100px;
   line-height: 100px;
   margin: 0 0 20px 0;
}
.work-hero p {
   font-size: 20px;
   line-height: 30px;
   width: 720px;
   margin: 0 auto 70px;
}
.one-item{
   text-align: center;
}
.two-items {
   overflow: hidden;
}
.two-items .left, .two-items .right {
   width: 50%;
}
.two-items .left .wrap {
   float: right;
   padding: 0 15% 0 0 ;
}
.two-items .left .wrap img,
.two-items .right .wrap img {
   margin: 0 auto; display: block;
}
.two-items .right .wrap {
   float: left;
   padding: 0 0 0 15% ;
}
.full {
   overflow: hidden;
}
.full img {
   width: 100%;
}
.web {
   text-align: center;
   padding: 10% 0;
}
.web img {
   width: 900px;
}
.work-video {
   padding: 200px 0;
   text-align: center;
}
.work-video p {
   color: #D7DCDE;
   width: 800px;
   margin: 0 auto;
}
.work-video a{
   display: block;
   width: 500px;
   margin: 0 auto 30px;
}
.work-video a h3{
   color: #D7DCDE;
   font-size: 100px;
   line-height: 110px;
}
a .work-play {
   background: ;
   width: 95px;
   height: 70px;
   background: rgba(255, 255, 255, 0.05);
   border-radius: 50%;
   padding: 30px 0 0 5px;
   margin: 0 auto 30px;
   transition: all .25s ease-in-out; -webkit-transition: all .25s ease-in-out;
}
a .work-play img {
   width: 25px;
}
.work-video a:hover .work-play{
   background: rgba(255, 255, 255, 0.9);
}
.work-video a:hover h3{
   color: #FFF;
}

.work-testimonial {
   padding: 100px 0;
   color: #FFF;
   text-align: center;
}
.work-testimonial .quote {
   width: 700px;
   margin: 0 auto 40px;
}
.work-testimonial .quote p {
   font-size: 18px;
}
.work-testimonial .quote strong {
   margin: 0 0 10px 0 ;
   text-transform: uppercase;
   font: 50px/55px 'Akzidenz';
   color: #FFF;
   display: block;
}
.work-testimonial .author {
   width: 300px;
   margin: 0 auto;
}
.work-testimonial .author img {
   width: 75px;
   border-radius: 50%;
   margin: 0 0 20px 0;
}
.work-testimonial .author p strong {
   color: #FFF;
   letter-spacing: 2px;
   text-transform: uppercase;
   font-size: 18px;
}
.work-bottom {
   padding: 50px 0;
}
.share-work {
   width: 250px;
   margin: 0 auto;
}
.share-work img {
   width: 100px;
   margin: 0 10px;
}


.work-bottom {
   background: #E3E3E3;
}


h5.work {
   text-align: center;
   border-bottom: 1px solid #d1d8d9;
   padding-bottom: 5px;
   font-size: 20px;
   width: 60%;
   margin: 5% auto 3% auto;
}
@media screen and (max-width: 900px) { 
h5.work { width: 80%;}
}


@media screen and (max-width: 1200px) { 
.work-hero h2 {
   font-size: 80px;
   line-height: 80px;
}
.web {
   padding: 10%;
}
}
@media screen and (max-width: 1100px) { 
.work-video p {
   width: 90%;
}
.work-video a{
   width: 400px;
}
}
@media screen and (max-width: 900px) { 
.work-hero h2 {
   font-size: 60px;
   line-height: 60px;
}
.two-items .left, .two-items .right {
   width: 100%;
}
.two-items .left .wrap, .two-items .right .wrap {
   float: none;
   padding: 0 ;
   margin: 0 auto;
}
}
@media screen and (max-width: 800px) { 
.work-hero p {
   font-size: 16px;
   line-height: 26px;
   width: 100%;
}
.work-video a{
   width: 300px;
}
.work-video a h3{
   font-size: 80px;
   line-height: 80px;
}
.work-video {
   padding: 100px 0;
   text-align: center;
}
.work-testimonial .quote {
   width: 90%;
}
.work-testimonial .quote strong {
   font: 35px/40px 'Akzidenz';
}
}

@media screen and (max-width: 600px) { 
.work-hero h2 {
   font-size: 40px;
   line-height: 40px;
}
.work-video a h3{
   font-size: 60px;
   line-height: 60px;
}
a .work-play {
   width: 65px;
   height: 50px;
   padding: 20px 0 0 5px;
}
a .work-play img {
   width: 15px;
}
}




/*-------------------------Postwire-------------------------*/


.postid-2164 .work-hero { background: #2D4148;}
.postid-2164 .work-hero img { width: 720px; }
.postid-2164 .one-item.sec1{ padding: 80px 0;}
.postid-2164 .one-item.sec1 img { width: 300px;}
.postid-2164 .two-items.first .left, .postid-2164 .two-items.first .right { padding: 250px 0;}
.postid-2164 .one-item.sec2{  padding: 200px 0; background: #24373D;}
.postid-2164 .two-items.second .left, .postid-2164 .two-items.second .right { padding: 100px 0;}
.postid-2164 .one-item.sec2 img {   width: 300px;}
.two-items .left, .two-items.sec2 .right { padding: 250px 0;}
.postid-2164 .two-items.first .left .wrap, .postid-2164 .two-items.first .right .wrap { width: 300px; }
.postid-2164 .two-items.second .left .wrap, .postid-2164 .two-items.second .right .wrap { width: 500px; }
.postid-2164 .one-item.sec3 {    background: #2C414A; padding: 15% 0;}
.postid-2164 .one-item.sec3 img { width: 1200px;}
.postid-2164 .full { text-align: center;  background: #25373D;}
.postid-2164 .two-items.second .left .wrap { padding: 0 10% 0 0 ;}
.postid-2164 .two-items.second .right {
   background: url(/wp-content/themes/grainandmortar/images/postwire10.jpg) no-repeat center center ;
   -webkit-background-size: cover;
   background-size: cover;
   padding: 0;
   height: 550px;
}
.postid-2164 .two-items.second .left { padding: 150px 0 0 0;   height: 400px;}
.postid-2164 .web {  background: #ABCCDF;}
.postid-2164 .four-devices {  background: #E2E2E2; padding: 8% 0;}
.postid-2164 .work-video {background: #394F57 url(/wp-content/themes/grainandmortar/images/postwire13.jpg) no-repeat center center ;}
.postid-2164 .work-testimonial { background: #6494C4;
}

@media screen and (max-width: 900px) { 
.postid-2164  .two-items.first .left, .postid-2164  .two-items.first .right { padding: 150px 0;}
.postid-2164  .two-items .left .wrap, .postid-2164  .two-items .right .wrap { width: 250px; }
.postid-2164 .one-item.sec2 img {  width: 250px;}
.postid-2164 .two-items.second .left { display:none;}
.web-header {  display: none;}
.postid-2164 .two-items.first .left .wrap, .postid-2164 .two-items.first .right .wrap { width: 250px; }
.postid-2164 .two-items.second .right {   height: 350px;}
.postid-2164 .one-item.sec2{ padding: 150px 0;}
}
@media screen and (max-width: 520px) { 
.postid-2164 .one-item.sec1 img { width: 90%;}
}

/*-------------------------Barcamp 13-------------------------*/
.postid-2163 .work-hero { background: url(/wp-content/themes/grainandmortar/images/barcamp130.jpg) repeat center center; -webkit-background-size: cover;
background-size: cover;}
.postid-2163 .work-hero img { width: 100px; margin: 0 0 50px 0;}
.postid-2163 .one-item.sec1{ padding: 0 0 5% 0; background: #20676a;}
.postid-2163 .one-item.sec1 img { width: 75%; max-width: 1300px;}
.postid-2163 .full.block img {width: 80%; margin: 80px auto; display: block;}
.postid-2163 .two-items.first .left, .postid-2163 .two-items.first .right { padding: 0; background: #ddddd;}
.postid-2163 .two-items.first .left img {float: right;}
.postid-2163 .two-items.first.sec2 .left img {float: right; display: block; max-width: 750px;}
.postid-2163 .two-items.first .right img {float: left; display: block;}
.postid-2163 .one-item.sec2{ padding: 200px 0;  background: #24373D;}
.postid-2163 .two-items.second .left, .postid-2163 .two-items.second .right { padding: 100px 0;}
.postid-2163 .web { background: #15948a;}
.postid-2163 .web img:first-child { border-bottom: none;}
.postid-2163 .web img { padding: 0 10%;border-bottom: 1px solid #3aa9a1;}
.postid-2163 .full.strip { padding: 5px 0;}
.postid-2163 .two-items.sec2 { background: #33253d url('/wp-content/themes/grainandmortar/images/barcamp138b.jpg') no-repeat center bottom ;padding: 80px 0;}
.postid-2163 .two-items.sec2 .right { padding: 10% 0; color: #827A88;}
.postid-2163 .two-items.sec2 h3 {margin: 0 0 30px 5%;}
.postid-2163 .two-items.sec2 p { width: 500px;margin: 0 0 0 5%;}
.postid-2163 .four-devices { background: #e3e3e3; padding: 80px 0;}
.postid-2163 .work-testimonial { background: #33273d;}

@media screen and (max-width: 1500px) { 
.postid-2163 .two-items.first .left img {width: 100%;}
}
@media screen and (max-width: 1200px) {
.postid-2163 .web img { padding: 0; border-bottom: 0;}
}
@media screen and (max-width: 1100px) { 
.postid-2163 .two-items.sec2 p { width: 85%;}
}
@media screen and (max-width: 900px) { 
.postid-2163 .two-items.first .right img {display: none;}
.postid-2163 .two-items.first .left img {float: none; display: block; margin: 0 auto;}
.postid-2163 .two-items.first.sec2 .right {clear: both;text-align: center;}
.postid-2163 .two-items.sec2 h3 {margin: 50px auto 30px auto;width: 80%;}
.postid-2163 .two-items.sec2 p {margin: 0 auto;width: 80%;}
.postid-2163 .two-items.sec2 .right { padding: 0 0 10% 0;}
.postid-2163 .two-items.first.sec2 .left img {float: none;}
}
@media screen and (max-width: 520px) { 
.postid-2163 .two-items.sec2 { padding: 1-% 0;}
.postid-2163 .web img { padding: 0 10%;border-bottom: none;}
}

/*-------------------------Nifti-------------------------*/
.postid-2165 .work-hero { background: url('/wp-content/themes/grainandmortar/images/nifti0.jpg') repeat center center; -webkit-background-size: cover;background-size: cover;}
.postid-2165 .work-hero img { width: 850px;}
.postid-2165 .one-item.sec1 { padding: 8% 0 8% 0;}
.postid-2165 .one-item.sec1 img { width:325px;}
.postid-2165 .two-items.first .left, .postid-2165 .two-items.first .right { padding: 8% 0;}
.postid-2165 .two-items.second .left, .postid-2165 .two-items.second .right,
.postid-2165 .two-items.third .left, .postid-2165 .two-items.third .right { padding: 0;}
.postid-2165 .two-items.first .left img, .postid-2165 .two-items.first .right img, .postid-2165 .one-item.sec2 img {width: 250px;}
.postid-2165 .one-item.sec2{ padding:  10% 0;   background: #38494f;}
.postid-2165 .full.block { padding: 5% 0;}
.postid-2165 .full.block img{ width: 900px; display: block; margin:  50px auto 50px auto;}
.postid-2165 .full.block img:last-child{ margin-bottom: 0;}
.postid-2165 .two-items.second { padding: 0 0 80px 0;}
.postid-2165 .two-items.second .left, .postid-2165 .two-items.third .left{ padding: 0;}
.postid-2165 .two-items.second .left img {float: right; display: block; margin: 0 2% 0 0;}
.postid-2165 .two-items.second .left img { float: right; display: block; margin: 0 2% 0 0;}
.postid-2165 .two-items.second .right img {float: left; display: block; margin: 0 0 0 2%;}
.postid-2165 .two-items .left img, .postid-2165 .two-items .right img {width: 450px;}
.postid-2165 .two-items.third { padding: 0 0 80px 0;}
.postid-2165 .full.block.omit {  padding:  0 0 5% 0;  }
.postid-2165 .full.block h5 {margin-top: 0px; margin-bottom: 2%;}
.postid-2165 .two-items.third .left img { clear: both; float: right; width: 300px; margin: 0 5% 50px 0;}
.postid-2165 .two-items.third .right img { clear: both; float: left; width: 300px; margin: 0 0 50px 5%;}
.postid-2165 .two-items.third .left img:last-child, .postid-2165 .two-items.third .right img:last-child { margin-bottom: 0;}
.postid-2165 .four-devices { background: #e3e3e3;}
.postid-2165 .work-testimonial {background: #eb756e;
}
@media screen and (max-width: 1100px) { 
.postid-2163 .two-items.sec2 p {
   width: 85%;
}
}
@media screen and (max-width: 900px) { 
.postid-2165 .two-items.first .right {display: none;}
.postid-2165 .two-items.first .left img {float: none; display: block; margin: 0 auto;}
.postid-2165 .full.block img {width: 90%; }
.postid-2165 .two-items.first.sec2 .right {clear: both;text-align: center;}
.postid-2165 .two-items.second, .postid-2165 .two-items.third {padding: 5% 0 0 0;}
.postid-2165 .two-items.second .left img, .postid-2165 .two-items.third .left img { float: none; margin: 0 auto; clear: both; display: block;}
.postid-2165 .two-items.second .right img:last-child {margin: 35px auto;}
.postid-2165 .two-items.third .left img:last-child {margin-top: 50px;}
.postid-2165 .two-items.second .right img {float: none; display: block;  margin: 50px auto 0 auto;}
.postid-2165 .one-item.sec1 img {width: 30%; padding: 10% 0;}
.postid-2165 .two-items.first .left img, .postid-2165 .two-items.first .right img, .postid-2165 .one-item.sec2 img {width: 25%; padding: 10% 0;}
.postid-2165 .two-items.third .right { display: none;}
.postid-2165 .two-items.sec2 h3 {margin: 50px auto 30px auto;width: 80%;}
.postid-2165 .two-items.sec2 p {margin: 0 auto;width: 80%;}
}
@media screen and (max-width: 650px) { 
.postid-2165 .two-items.second .left img {margin: 0px auto 50px auto;}
.postid-2165 .two-items.second .right, .omit { display: none;}
}
@media screen and (max-width: 520px) { 
.postid-2163 .two-items.sec2 { 
   padding: 1-% 0;
}
.postid-2165 .full.block img {width: 85%; padding: 5% 0;}
}

/*-------------------------Drickey-------------------------*/



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

.web-header {display: none;}
}
@media screen and (max-width: 650px) { 

}


/*-------------------------Defy-------------------------*/


/*-------------------------DCL-------------------------*/


@media screen and (max-width: 650px) { 
.resp { display: inherit;}
.respa { display: none;}
}

/*-------------------------Summer Tomato-------------------------*/

}
@media screen and (max-width: 1200px) { 

}
@media screen and (max-width: 900px) { 

}
@media screen and (max-width: 650px) { 

}
@media screen and (max-width: 520px) { 
.postid-2173 .one-item.sec2 img {
   width: 55%;
}
}

/*-------------------------Maud Boutique-------------------------*/

.device {
   max-width: 100%;
   max-height: 100%;
   width: 800px;
   position: relative;
   height: 720px;
   overflow: hidden;
}
.device_base {
   max-width: 100%;
   max-height: 100%;
   position: absolute;
   top: 0;
   left: 0;
}
.device_light, .device_playButton {
   max-width: 100%;
   max-height: 100%;
   position: absolute;
   top: 0;
   left: 0;
   -webkit-transition: all 1.5s ease;
   transition: all 1.5s ease;
   opacity: 0;
}
.device_playButton { cursor: pointer; }
.device_light.on, .device_playButton.on { opacity: 1; }

#light0 {
   -webkit-transform: rotateZ(8deg);
   -ms-transform: rotate(8deg);
   transform: rotateZ(8deg);
}
#light1 {
   -webkit-transform: rotateZ(22deg);
   -ms-transform: rotate(22deg);
   transform: rotateZ(22deg);
}
#light2 {
   -webkit-transform: rotateZ(37deg);
   -ms-transform: rotate(37deg);
   transform: rotateZ(37deg);
}
#light3 {
   -webkit-transform: rotateZ(52deg);
   -ms-transform: rotate(52deg);
   transform: rotateZ(52deg);
}
#light4 {
   -webkit-transform: rotateZ(67deg);
   -ms-transform: rotate(67deg);
   transform: rotateZ(67deg);
}
#light5 {
   -webkit-transform: rotateZ(82deg);
   -ms-transform: rotate(82deg);
   transform: rotateZ(82deg);
}
#light6 {
   -webkit-transform: rotateZ(97deg);
   -ms-transform: rotate(97deg);
   transform: rotateZ(97deg);
}
#light7 {
   -webkit-transform: rotateZ(112deg);
   -ms-transform: rotate(112deg);
   transform: rotateZ(112deg);
}
#light8 {
   -webkit-transform: rotateZ(127deg);
   -ms-transform: rotate(127deg);
   transform: rotateZ(127deg);
}
#light9 {
   -webkit-transform: rotateZ(142deg);
   -ms-transform: rotate(142deg);
   transform: rotateZ(142deg);
}
#light10 {
   -webkit-transform: rotateZ(157deg);
   -ms-transform: rotate(157deg);
   transform: rotateZ(157deg);
}
#light11 {
   -webkit-transform: rotateZ(172deg);
   -ms-transform: rotate(172deg);
   transform: rotateZ(172deg);
}
#light12 {
   -webkit-transform: rotateZ(187deg);
   -ms-transform: rotate(187deg);
   transform: rotateZ(187deg);
}
#light13 {
   -webkit-transform: rotateZ(202deg);
   -ms-transform: rotate(202deg);
   transform: rotateZ(202deg);
}
#light14 {
   -webkit-transform: rotateZ(217deg);
   -ms-transform: rotate(217deg);
   transform: rotateZ(217deg);
}
#light15 {
   -webkit-transform: rotateZ(231deg);
   -ms-transform: rotate(231deg);
   transform: rotateZ(231deg);
}
#light16 {
   -webkit-transform: rotateZ(246deg);
   -ms-transform: rotate(246deg);
   transform: rotateZ(246deg);
}
#light17 {
   -webkit-transform: rotateZ(261.4deg);
   -ms-transform: rotate(261.4deg);
   transform: rotateZ(261.4deg);
}
#light18 {
   -webkit-transform: rotateZ(276.5deg);
   -ms-transform: rotate(276.5deg);
   transform: rotateZ(276.5deg);
}
#light19 {
   -webkit-transform: rotateZ(291.8deg);
   -ms-transform: rotate(291.8deg);
   transform: rotateZ(291.8deg);
}
#light20 {
   -webkit-transform: rotateZ(307.3deg);
   -ms-transform: rotate(307.3deg);
   transform: rotateZ(307.3deg);
}
#light21 {
   -webkit-transform: rotateZ(322.9deg);
   -ms-transform: rotate(322.9deg);
   transform: rotateZ(322.9deg);
}
#light22 {
   -webkit-transform: rotateZ(337.2deg);
   -ms-transform: rotate(337.2deg);
   transform: rotateZ(337.2deg);
}
#light23 {
   -webkit-transform: rotateZ(352.9deg);
   -ms-transform: rotate(352.9deg);
   transform: rotateZ(352.9deg);
}
.device_top {
   max-width: 100%;
   max-height: 100%;
   position: absolute;
   top: 0;
   left: 0;
}

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

.device {
   height: 600px;
}
}
@media screen and (max-width: 1100px) {

.device {
   height: 520px;
}

.device {
   height: 600px;
}
}

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

}
@media screen and (max-width: 750px) {

}
@media screen and (max-width: 700px) {

}
@media screen and (max-width: 650px) {

}
@media screen and (max-width: 600px) {

}
@media screen and (max-width: 550px) {

}
@media screen and (max-width: 500px) {

}
@media screen and (max-width: 450px) {

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

}

.content.thanks {
   padding: 100px 0;
   text-align: center;
}
.goOn h2 {
   text-align: center;
   margin-bottom: 50px;
}
.goOn {
padding: 150px 0;
background: #d6d6d6; /* Old browsers */
background: -moz-linear-gradient(top, #d6d6d6 0%, #ffffff 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d6d6d6), color-stop(100%,#ffffff));
background: -webkit-linear-gradient(top, #d6d6d6 0%,#ffffff 100%); 
background: linear-gradient(to bottom, #d6d6d6 0%,#ffffff 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d6d6d6', endColorstr='#ffffff',GradientType=0 );
}
.navOn {
   width: 100%;
   overflow: hidden;
}
.navOn li {
   float: left;
   width: 20%;
   margin: 0 5% 0 0;
}
.navOn li:last-child {margin: 0;}
.navOn li a {
   display: block;
   text-align: center;
   height: 20px;
   padding: 15px 0 20px 0;
   color: #1E2222;
   text-transform: uppercase;
   letter-spacing: 1px;
   font-size: 13px;
   background: #d6d6d6;
   border-radius: 10px;
}
.navOn li a:hover {
   background: #dca459;
}
@media screen and (max-width: 900px) { 
.navOn li,
.navOn li:last-child {
   width: 45%;
   margin: 0 2.5% 25px 2.5%;
}
}
@media screen and (max-width: 650px) { 
.goOn {padding: 75px 0;}
.navOn li,
.navOn li:last-child {
   width: 95%;
   margin: 0 2.5% 25px 2.5%;
   clear: both;
}
}
/*-------------------------404-------------------------*/

/*-------------------------Questions-------------------------*/

.questions {
   width: 800px;
   margin: 40px auto 100px;
}


@media screen and (max-width: 860px) { 
.questions {
   width: 80%;
   padding: 0 5% 0 0;
}
}


li.security {width: 110px;}
li.maintenance {width: 135px;}
li.consulting {width: 105px; }

.panes div {
display:none;
padding;
border-top:0;
height:405px;
font-size:14px;
background-color:#fff;
position: absolute;
width: 1000px;   
}
.cell, .cell2 {
border-left: 1px solid #FFF;
border-bottom: 1px solid #FFF;
width: 282px;
height: 106px;
float: left;
background: url(images/m-cell.png) repeat-x;
padding: 30px 30px 0 20px
}
.cell strong, .cell2 strong {
font-size: 18px;
line-height: 28px;
}
.cell2 strong {
opacity: .5;
}
.cell img, .cell2 img {
float: left;
margin: 0 10px 0 0;
}
.cell2 img {
opacity: .1;
}
.cell p, .cell2 p  {
float: right;
width: 230px;
}
.cell2 p  {
opacity: .1;
}
ul.tabs {
list-style:none;
margin:0 !important;
padding:0;
height:200px;    
}
ul.tabs li {
float:left;
text-indent:0;
padding:0;
margin:0 !important;
list-style-image:none !important;
}
ul.tabs a {
height:200px;
font-size:17px;
display:block;
height: 140px;
line-height:30px;
width: 208px;
text-align:center;
padding: 30px 20px;
margin:0px;
position:relative;
border-left: 1px solid #FFF;
background: #EDEFEE url(images/m-bg.png) repeat-x;
}
ul.tabs a:hover {
background-position:bottom;
}
ul.tabs h4 {
font-size: 22px;
text-transform: uppercase;
line-height: 24px;
font-family:"DIN Next W01 Bold";
color: #3C4543;
}
.tabs .month {
float: left;
width: 120px;
margin: 40px 0 0 0;
color: #FFF;
font-size: 32px;
line-height: 6px;
}
.tabs .month span {
float: left;
width: 120px;
margin: 20px 0;
color: #FFF;
font-size: 14px;
text-transform: uppercase;
}
.tabs .year {
float: right;
width: 120px;
margin: 40px 0 0 0;
color: #FFF;
font-size: 32px;
line-height: 6px;
}
.tabs .year span {
float: right;
width: 120px;
margin: 20px 0;
color: #FFF;
font-size: 14px;
text-transform: uppercase;
}
.tabs img {
float: left;
margin: 30px 0 0 10px;
}
ul.tabs a.current, ul.tabs a.current:hover, ul.tabs li.current a {
    background-position: -420px -62px;
    cursor:default !important;
    color:#000 !important;
 background: #EDEFEE url(images/m-active.png) repeat-x;
}

.panes .pane {
    display:none;
}



.m_heroM {
   background: url(/wp-content/themes/grainandmortar/images/maintenance/heroBG.jpg) no-repeat bottom center; background-size: cover;
   color: #fff;
   height: 700px;
}

.m_footer {
   background: url(/wp-content/themes/grainandmortar/images/maintenance/heroBG.jpg) no-repeat bottom center; background-size: cover;
   color: #fff;
   height: 230px;
   overflow: hidden;
}

.m_topSection {
   width: 95%;
   margin-top: 150px;
}

.m_tsWord {
   color: #FFFFFF;
    float: right;
    text-align: center;
    text-transform: uppercase;
    width: 260px;
}

.m_tsWord img {
   display: inline;
   margin-right: 10px;
}

.m_topLeft {
   width: 35%;
   float: left;
   margin-top: 40px;
}
.m_third {
    float: left;
    margin: 0 7% 0 0;
    width: 26.333%;
}

.m_tsWord img {
    display: inline;
    margin-right: 10px;
}
.m_topLeft {
    float: left;
    margin-top: 40px;
    width: 35%;
}
.m_topLeft h3, .m_middleLeft h3, .m_bottomLeft h3, .m_middle h3 {
    font-size: 50px;
    line-height: 65px;
}
.m_orange {
    color: #DEA653;
}
.m_topRight {
    float: left;
    width: 65%;
}
.m_topRight img {
    max-width: 100%;
}
.m_middleLeft {
    border-right: 2px solid #DDDDDD;
    float: left;
    height: 150px;
    margin-right: 2%;
    width: 50%;
}
.m_middleRight {
    float: left;
    height: 150px;
    margin-left: 2%;
    width: 45%;
}
.m_middleRight h2 {
    color: #4FACDA;
    font-family: 'Gentona-ExtraLight',sans-serif;
    font-size: 200px;
    line-height: 120px;
}
.m_bottomLeft, .m_bottomRight {
    float: left;
    margin: 40px 0;
    width: 50%;
}
.m_bottomRight {
    text-align: center;
}
.m_bottom {
    height: 150px;
    overflow: hidden;
    padding: 50px 0;
}
.m_mItem {
    margin-bottom: 40px;
   height: 180px;
}
.m_mItem img {
    margin: -8px 6px 0 0;
}
.m_mItem h4 {
    font-size: 26px;
}
.m_mini {
    color: #333333 !important;
    font-size: 14px;
    letter-spacing: 2px;
}
h2 sup {
    font-size: 100px;
    top: -65px;
}
h4 img { display: inline;}
.m_middlePush {
    margin: 50px auto 0;
    max-width: 1400px;
    width: 99%;
}
.m_greyBG {
    background: none repeat scroll 0 0 #F7F7F7 !important;
    padding: 50px 0 75px;
}
.m_whiteBG {
    background: none repeat scroll 0 0 #FFFFFF !important;
    padding: 75px 0;
}
.cf:before, .content:before, .cf:after, .content:after {
    content: " ";
    display: table;
}
.cf:after, .content:after { clear: both; }
.cf, .content {}

.m_left, .m_right {
    float: left;
    width: 47%;
}
.m_right { margin-left: 3%;}
.m_left { margin-right: 3%;}
.m_faqWrapper { margin-bottom: 75px;}

.m_optional {
    background: none repeat scroll 0 0 #4FACDA;
    border-radius: 40px;
    color: #FFFFFF !important;
    display: block;
    float: right;
    font-family: gentona-light;
    font-size: 14px;
    margin-top: -1px;
    padding: 0 18px;
}
.m_button {
    background: none repeat scroll 0 0 #0B3C4F;
    border-radius: 5px;
    color: #FFFFFF;
    cursor: pointer;
    display: inline-block;
    font-size: 14px;
    height: 45px;
    letter-spacing: 3px;
    margin-top: 40px;
    padding-top: 15px;
    text-align: center;
    text-transform: uppercase;
    width: 300px;
}

.m_middleLeft br { display: none; }

@media screen and (max-width: 1400px) { 
   .m_tsWord { width: 220px; }
   .m_optional { float: none; text-align: center; margin-top: 10px; }
}

@media screen and (max-width: 1320px) { 
   .m_middleLeft, .m_middleRight { width: 90%; margin: 0 5%; text-align: center; }
   .m_middleLeft { border-right: none; }
   .m_middlePush { margin-top: 0; }
}

@media screen and (max-width: 1250px) { 
   .m_tsWord { width: 200px; }
   .m_mItem { height: 190px; }
}

@media screen and (max-width: 1175px) { 
   .m_tsWord { width: 190px; }
   .m_footer { height: 285px; }
   .m_bottomRight { margin: 80px 0; }
   .m_mItem { height: 200px; }
}

@media screen and (max-width: 1075px) { 
   .m_third { width: 29%; margin: 0 4% 0 0; }
}

@media screen and (max-width: 1040px) { 
   .m_third { width: 46%; margin: 0 2%; }
   .m_optional { float: right; text-align: left; margin-top: 0; }
   .m_whiteBG { padding: 25px 0 0; }
   .m_footer { height: 350px; }
}

@media screen and (max-width: 875px) { 
   .m_topRight { margin-top: 30px; }
}

@media screen and (max-width: 768px) { 
   .m_third { width: 90%; margin: 0 5%; }
   .m_bottomLeft, .m_bottomRight { width: 90%; margin-right: 5%; margin-left: 5%; }
   .m_bottomRight { margin-top: 0; }
   .m_middleLeft, .m_middleRight {
      margin: 0;
      text-align: center;
      width: 100%;
      height: auto;
   }
   .m_middleRight { margin-top: 50px; }
   .m_tsWord { width: 33%; }
   .m_topSection, .m_topLeft, .m_topRight { width: 100%; }
   .m_heroM { height: 750px; }
   .m_mItem { height: auto; }
   .m_greyBG { padding: 40px 0 20px; }
}

@media screen and (max-width: 675px) { 
   .m_footer { height: 420px; }
   .m_middleLeft br { display: inline; }
   .m_topLeft { text-align: center; }
   .m_heroM { height: auto; }
}

@media screen and (max-width: 620px) { 
   .m_right, .m_left { width: 90%; margin: 0 5%; }
   .m_greyBG { padding: 20px 0; }
      
   .m_middleRight h2 {
      font-size: 100px;
      line-height: 100px;
   }
   
   h2 sup {
      font-size: 50px;
      top: -25px;
   }
   
   .m_middleRight { margin-top: 20px;  }
}

@media screen and (max-width: 550px) { 
   .m_topSection { display: none; }
   .m_heroM { height: auto; }
   .m_topLeft { margin-top: 110px; }
   .m_middleRight h2 { line-height: 60px; }
}

@media screen and (max-width: 400px) { 
   .m_topLeft h3, .m_middleLeft h3, .m_bottomLeft h3, .m_middle h3 {
      font-size: 40px;
      line-height: 55px;
   }
   
   .m_mItem img {
      display: block;
      margin: 0 auto;
   }

   .m_middleRight { margin-top: 60px; }
   .m_mItem h4 { text-align: center; }
   .m_optional { float: none; text-align: center; margin-top: 10px; }
   .m_button { width: 100%; margin-top: 20px; }
   .m_mini { display: block; }
}


/*Awwwards*/


/* --- Awwwards Ribbons --- */

/* Base */

#awwwards {
   position:absolute;
   top:100px;
   z-index:9999;
}

/* Right */

#awwwards.right {
   right:0;
}

/* Link */

#awwwards a {
   display:block;
   width:70px;
   height:105px;
   text-indent:-8000px;
   background-repeat:no-repeat;
   background-position: 0 0;
   overflow:hidden;
}

/* Black */
#awwwards.right.black a {
   background-image:url('/wp-content/themes/grainandmortar/images/awwwards_sotd_black_right.png');
}


@media (max-width: 767px) {

   /* hidden */
   #awwwards {
      display: none;
   }

}

/* Retina Displays */

/* Target any device with retina display (ie iPad 3 and MacBook Pro) */

@media 
only screen and (-Webkit-min-device-pixel-ratio: 1.5),
only screen and (-moz-min-device-pixel-ratio: 1.5),
only screen and (-o-min-device-pixel-ratio: 3/2),
only screen and (min-device-pixel-ratio: 1.5) {

   #awwwards a {
      -moz-background-size: 70px 105px;
      -ie-background-size:70px 105px;
      -o-background-size:70px 105px;
      -webkit-background-size:70px 105px;
      background-size:70px 105px;
   }


   #awwwards.right.black a {
      background-image:url('/wp-content/themes/grainandmortar/images/awwwards_sotd_black_right2x.png');
   }  
}
#block-system-main{
   margin-top: 181px;
}
#block-system-navigation li{   display: inline-block;
    margin: 0; }
#block-system-navigation ul{margin-top: 5px; text-align: center;}
#block-system-navigation a{display: block;}


#block-system-navigation {
   background: url("images/menu-admin-logo-odi.jpg") no-repeat scroll 1% 3px #fff;
    box-shadow: 1px 1px 5px -4px #000000;
    font-family: 'Century Gothic',Arial,'Arial Unicode MS',Helvetica,Sans-Serif;
    font-size: 12px;
    font-style: normal;
    font-weight: normal;
    height: 50px;
    opacity: 1;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1001;
}
#block-system-navigation a {
padding: 4px 10px;
font-family: BitsCharter;
background: #fff;
border-radius: 5px;
-webkit-transition: all 200ms ease-in-out;
-moz-transition: all 200ms ease-in-out;
-ms-transition: all 200ms ease-in-out;
transition: all 200ms ease-in-out;
color: #555;
font-size: 14px;

}
#block-system-navigation .last a {
background: #A92F2F;
color: #fff;

}

#block-system-navigation a.active {
   background: none repeat scroll 0 0 #333333 !important;
    color: #ffffff !important;
}
#block-system-navigation a:hover {
  background: none repeat scroll 0 0 #999 !important;
    color: #ffffff !important;
}
#block-system-navigation li ul{
   display: none;
   margin:0;
     width: 170px;
    background: #000;
    overflow: hidden;
      position: absolute;


}
#block-system-navigation li:hover ul{
   display: block;
    
 


}
#block-system-navigation li li a{
   background: #000;
   margin:0;
      width: 150px;
   padding: 2px 10px;
   color:#ccc !important;
   text-align: left;
   border-radius: none;



}
#block-system-navigation li li.last a {
      background: #000;
  
}

@media screen and (max-width: 850px) {
   .header ul.ods-hmenu  {
      display: none;
   }
   .header {
      background: transparent !important;
   }
   div#menubuttonsvg {
    background: #DCA459;
    margin-top: 15px;
   }
   #block-system-main {
    margin-top: 28%;
   }
   .mobileNavWrapper .region-navigation p img {
   display: none;
   }
}

