/* Please note: Twitter Bootrap files located under the framework folder of website. There are other CSS files found under that folder attached via the template */
/* For more information/documentation please visit: http://twitter.github.io/bootstrap/ */
 /* Extra small devices Phones   */
 /* Small devices Tablets  */
 /* Medium devices Desktops */
 /* Large devices Desktops  */
/* Insert Main Styles Here */

.projects img {max-width: 100%; height: auto;}

#bodyArea {padding-top: 60px; padding-bottom: 40px;}

/* begin removes white space .servicesbelow footer when insufficient content */
body {
    font-family: Arial,sans-serif; 
    background-color: #777777; 
    color: #333333;
    }
#all-content-within-body {
    background-color: #EFF0F0; 
    color: #333333;
    }
/* Nav and top banner */

.navbar-inverse {
    background-color: #00928f; 
    border:0; 
    margin:0;
    }
.navbar-inverse .navbar-nav > li > a {
    color:#fff;
    }
.navbar-inverse .navbar-nav > .active > a, .navbar-inverse .navbar-nav > .active > a:hover, .navbar-inverse .navbar-nav > .active > a:focus {
    background-color:#00928f;
    }
    
.navbar-inverse .navbar-nav > li > a:hover, .navbar-inverse .navbar-nav > li > a:focus,
.navbar-inverse .navbar-nav > .open > a, .navbar-inverse .navbar-nav > .open > a:hover, .navbar-inverse .navbar-nav > .open > a:focus {
    background-color:#00756f;
    }
.navbar-nav > li > a, .dropdown-menu > li > a  {
    padding:32px 16px; 
    font-size:16px; 
    font-weight:bold; 
    color:#fff; 
    text-transform:uppercase;
    }
    
    .lt-ie9 .navbar-nav > li > a
    {
        line-height:54px;
    }
    
    .lt-ie9 .services img {
    max-width: 65%;
    }
    
    .centered{
        text-align:center;
    }
    
.dropdown-menu > li > a  {
    padding:10px 20px;
    }
.dropdown-menu {
    background:#00756f;
    }
.logo {
    float:left; 
    padding:10px;
    }
    
    
/* Main styling */  

#footer .col-xs-12 {margin-top:20px;}

h1{
    font-weight:bold;
    line-height:120%;
    color:#00928f;
    text-transform:uppercase;
}
h2{
    font-size:25px;
    font-weight:bold;
    line-height:148%;
    color:#00928f;
    text-transform:uppercase;
    }
h3{
    font-size:18px;
    font-weight:bold;
    line-height:120%;
    color:#006EAD;
    text-transform:uppercase;
    }
h5 {
    text-transform:uppercase;
    }
p, ul, ol {
    font-size:16px;
    line-height:120%;
    }
    
/* Button and home Block areas */ 

.h2-blue {
    font-size:24px; 
    color:rgb(0,51,109);
    }
.jumbotron p {
    color:#fff; 
    text-align:center;
    font-size:14px;
    }
.jumbotron h2 {
    color:#fff; 
    text-align:center;
    }
.jumbotron.diagram {display:none;}
.services {
    margin-bottom:0;

    background-color: #00928f; background:  #00928f;    /* fallback */ 

    color:#fff;
    }
     
.services a {
    color:#fff;
    text-align:center;
}
.services a:hover {
    outline: 0; 
    opacity:0.8;
    filter:alpha(opacity=80); /* For IE8 and earlier */
}
.services img {
    padding:0 40px;
}
.home-text{
    min-height:50px;
    margin:0 28px;
}
.main-image {
    margin:0 20px 20px 0; 
    float:left;
    max-width:100%;
    height:auto;
    }

.diagram {
     background-color: #0073AF; /* fallback */ 
     background-repeat: repeat-x; 
     background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#0073AF), to(#00ABF0)); /* Safari 4-5, Chrome 1-9 */ 
     background: -webkit-linear-gradient(top, #00ABF0, #0073AF); /* Safari 5.1, Chrome 10+ */ 
     background: -moz-linear-gradient(top, #00ABF0, #0073AF); /* Firefox 3.6+ */ 
     background: -ms-linear-gradient(top, #00ABF0, #0073AF); /* IE 10 */ 
     background: -o-linear-gradient(top, #00ABF0, #0073AF); /* Opera 11.10+ */ 
     margin-bottom:0;
     }
.home-block {margin:40px 0;}

/*footer*/

footer {
    margin-top:40px;
    }
.foot-fa {
    margin:8px; 
    font-size:14px; 
    line-height:37px;
    }
.footer-bg a, .footer-bg {
    color:#FFF;
    }
#bottom a:hover {
    color:#555555;
    }
.footer-bg {
    background-color:#777777;
    }
    
.img-circle {margin-right:15px;margin-bottom:15px;float:none;}

/*mailchimp sign up form*/

.footer-email {
    BACKGROUND-COLOR:#777777; 
    BORDER:0PX; 
    COLOR:#EBEBEB; 
    PADDING:10PX;
    }

#mc_embed_signup {
    BACKGROUND-COLOR: transparent; 
    BORDER:1PX SOLID #FFFFFF;
    }

.page-label {width:130px;}

input.button {
    COLOR:#FFFFFF; 
    BACKGROUND-COLOR:#777777; 
    BORDER:0PX; 
    PADDING:10PX 
    }
.input-group {
    border:1px solid #fff;
    }
.input-group-addon {
    background:transparent; 
    border:0;
    }
.fa {
    color:#fff;
    }

.input-group-addon:first-child {
    border-right: 1px solid #fff;
    }
.margin-top {
    margin-top:35px;
    }

.white-box {
    background:#fff;
    padding:20px; 
    margin-bottom:20px;
    }
.h2-blue {
    margin-top:0;
}

.lrgLineHeight{
    line-height:100px;
}

.news.container {
    padding: 0;
}

.news.container .news-inner {
    padding: 15px;
    background: none;
}

.news.container .news-inner h2 {
    margin-top: 0;
    font-size: 21px;
    margin-bottom: 5px;
}

.news.container .news-inner .summary {
    float: left;
    width: calc(100% - 120px);
}

.news.container .news-inner .link {
    float: right;
    width: 120px;
    text-align: right;
}
.news.container .news-inner .link a {
    display: inline-block;
    padding: 6px 12px;
    text-transform: uppercase;
    color: #ffffff;
    background: #00928f;
    text-decoration: none;
}

@media (max-width: 480px) { 
    .navbar-nav > li > a,
    .dropdown-menu > li > a  {
        padding:10px 10px; 
        font-size:12px; 
    }
    
    .lrgLineHeight{
    line-height:20px;
    }
    
    h2{
        word-break:normal;
    }
}

/* Small devices (tablets, 768px and up) */
@media (max-width: 768px) { 
    .services img {padding:0;} 
    .services h2{font-size:16px;}
    .main-image{margin-left:auto;margin-right:auto; width:100%;}
    
    .navbar-nav > li > a,
    .dropdown-menu > li > a  {
    padding:10px 10px; 
    font-size:15px; 
    }
    
     .lrgLineHeight{
    line-height:20px;
    }
}

@media (min-width: 768px) {
    .img-circle {float:left;}
    .text-left * {text-align:left!important;}
    .homeblock {padding-right:40px;}
}
    

/* Medium devices (desktops, 992px and up) */
@media (max-width: 992px) { 
    .navbar-nav > li > a, .dropdown-menu > li > a {font-size:12px;}
    .foot-fa, .mc-field-group {font-size:11px;}
    p.home-text {font-size:12px; min-height:70px;}
    .main-image{margin-left:auto;margin-right:auto; width:100%;}
    
    .navbar-nav > li > a,
    .dropdown-menu > li > a  {
    padding:10px 9px; 
    font-size:14px; 
    }
}

@media (min-width: 992px) { 
    .news.container .news-inner {
        padding: 15px 0 15px 33%;
        background: url('../../images/news.png') 60px 35% no-repeat;
    }    
}




/* Stylesheet: TwitterBootsrap Modified On 2019-08-12 16:28:59 */
/*  Important! The Width/Height is now controlled via the CSS, see below  */
/*  The map id matches the current page alias after the '#GoogleMap_'.. see map template for more info */

#GoogleMap_contact-us .Google_Map
{
    height: 300px; 
    width: 100%;
}

.infoBox {
  padding: 0.5em;
  border: 1px solid black;
  background-color: #fff;
}

.m_tooltip {
  padding: 0.5em;
  border: 1px solid black;
  border-radius: 3px;
  background-color: white;
}
/* Stylesheet: Google Map Modified On 2014-08-20 08:39:38 */
.paralax{
background-size: cover;
}
.paralax.home {

    background: url(https://www.dialogfitzroy.com/images/template/paralax.jpg) no-repeat center top;
background-size: cover;
background-attachment: fixed;
}



.container.paralaxHolder {
    padding: 0;
}

blockquote {
    border: 0;
    font-family: "HelveticaNeue", "Helvetica Neue","Helvetica",  "Arial", sans-serif; 
    font-size: 24px;
    line-height: 120%;
    color: rgb(255, 255, 255);
    text-align: left;
    padding: 30px 30px;
    margin: auto;
    position: relative;
     top: 10%;


}

.paralaxHolder {
     height:100%;
    position: relative;
}

/* http://css-tricks.com/removing-the-dotted-outline/ */
#meet-the-team .nav-tabs > li > a {outline: 0; }

/* Extra small devices (phones, less than 768px) */
/* No media query since this is the default in Bootstrap - its a 'mobile first' approach */


/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) { 
    
    
    
    
blockquote {
    border: 2px solid #fff;
    font-size: 38px;
    padding: 65px 30px;

}

.paralaxHolder {
    height:100%;
}
    
    }



/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) { 
    
    .paralax.what-we-do {

    background-attachment:fixed;
background-size: cover;
}
    
    
     blockquote {
     border: 2px solid #fff;
    font-size: 43px;
    padding: 65px 30px;
    top: 10%;
}

.paralaxHolder {
    height:550px;
}
    
    
    
    }




/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { 
    
    blockquote {
    font-size: 48px;
    padding: 65px 65px;
        top: 10%;
}

.paralaxHolder {
    height:550px;
}
    
    
    }



/* Stylesheet: Paralax Modified On 2014-08-20 13:47:12 */
.project-box {background:#fff; margin-bottom:20px;}


/* PDF button*/
a.pdf {width:172px; height:172px; background: url(https://www.dialogfitzroy.com/images/template/pdf.jpg) no-repeat center top; display:block; font-size: 0;}

/* Gallery in Project */
#slides, .cycle-slideshow {
text-transform:uppercase;
margin:20px 0;

}

.cycle-overlay { background: none repeat scroll 0 0 #aaa;
    bottom: 0;
    color: #000;
    opacity: 0.6;
    padding: 15px;
    position: absolute;
    width: 100%;
    z-index: 600;
    font-weight:700;
    }
    
   .flex-direction-nav {position: absolute;
    top: 35%;
    width: 100%;
    z-index: 700;
} 




   ul.flex-direction-nav , ul.flex-direction-nav li {
    margin: 0;
    padding: 0;
}
    .slides, .flex-control-nav, .flex-direction-nav {
    list-style: none outside none;}
    
 .flex-direction-nav a {
    background: url("http://www.fitzroy.co.nz/images/template/arrow_right.png") no-repeat scroll center bottom rgba(0, 0, 0, 0);
    display: block;
    float: right;
    font-size: 0;
    height: 89px;
    text-indent: -9999em;
    width: 40px;
}

.flex-direction-nav .flex-next {
    right: 0;
    text-align: right;
}

a.flex-next {
     background-image: url("http://www.fitzroy.co.nz/images/template/arrow_right.png");
}

a.flex-prev {
    background-image: url("http://www.fitzroy.co.nz/images/template/arrow_left.png");
    float: left;
    left: -20px;
}
 .flex-direction-nav a:hover {opacity:0.4;
filter:alpha(opacity=40); /* For IE8 and earlier */}

 .flex-direction-nav a{
     z-index:1000;
 }


#youtube {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px; height: 0; overflow: hidden;
    margin-bottom:20px;
}
 
#youtube iframe,
#youtube object,
#youtube embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.fitzroy-projects .white-box, .projects  .white-box  {background:none;
padding:0;}



/* Smartphones (portrait) ----------- */
@media only screen and (max-width : 320px) {
    
    .flex-direction-nav {position: absolute;
    top: 15%;
    } 
    
    .flex-direction-nav a {
        background-size:100% auto;
        width:20px;
    }
    
}

/* iPads (portrait and landscape) ----------- */
@media only screen and (min-width : 768px) and (max-width : 1024px) {
.flex-direction-nav {
    top: 40%;
}

}
/* Stylesheet: Project Modified On 2014-08-20 12:06:08 */
