/*
Theme Name: ciar
Theme URI: http://www.ciar.com
Author: Mason Digital
Author URI: http://www.masondigital.com/
Description: CIAR
Version: 1.0.0
License: GNU General Public License
License URI: https://www.gnu.org/licenses/gpl.html
Text Domain: ciar
*/

/* GLOBAL
*********************************************/
html, body{color: #222222; font-family: 'Open Sans', sans-serif; overflow-x: hidden;}
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6{font-family: 'Roboto Condensed', sans-serif;}
h1, .h1, h2, .h2, h3, .h3{color: #0774b2;}
hr {background-color: #ccc; border: 0; height: 1px;	margin-bottom: 1.5em;}
img {height: auto; /* Make sure images are scaled correctly. */	max-width: 100%; /* Adhere to container width. */}
figure {margin: 1em 0; /* Extra wide images within figure tags don't overflow the content area. */}
   /*--------------------------------------------------------------
   ## Links
   --------------------------------------------------------------*/
   a {
   	color: #0774b2;
    -webkit-transition: all 0.2s ease;
     -moz-transition:    all 0.2s ease;
     -ms-transition:     all 0.2s ease;
     -o-transition:      all 0.2s ease;
   }
     .text-white a{color: #ffffff}

  /* a:visited {	color: #2589d1;} */
     .text-white a:visited{color: #eeeeee}

   a:hover,
   a:focus,
   a:active {	color: #222222;}
     .text-white a:hover,
     .text-white a:focus,
     .text-white a:active {	color: #0774b2;}

   a:focus {	outline: thin dotted;}

   a:hover,
   a:active {	outline: 0;}


/* CLASSES
*********************************************/
.logo{display: inline-block;}
.no-col{padding-left: 15px; padding-right: 15px;}
.alignleft {	display: inline;	float: left;	margin-right: 1.5em;}
.alignright {	display: inline;	float: right;	margin-left: 1.5em;}
.aligncenter {	clear: both;	display: block;	margin-left: auto;	margin-right: auto;}
.sep{padding-left: 10px; padding-right: 10px;}
.curlup{background-color: #ffffff; display: inline-block; margin:30px auto;
 -webkit-box-shadow: 0 10px 6px -6px #222;
 	   -moz-box-shadow: 0 10px 6px -6px #222;
 	        box-shadow: 0 10px 6px -6px #222;}
.curlup h1{text-align:center;	position:relative; }
/* LAYOUT
*********************************************/

#sidebar_thumbnail{margin-top: 25px;padding: 5px; background-color: lightgrey; text-align: center;}
 /* Base Button Style */
 .paper {position: relative; display: block; width: auto; margin: 20px 0; padding: 10px; background-color: #fff; border: 1px solid #ccc; color: #000; text-align: center; text-decoration: none; text-transform: uppercase; transform-style: flat; transition: all 250ms ease-out;}
 .paper:before, .paper:after {content: ""; position: absolute; z-index: -2; transition: all 250ms ease-out; }
.paper-flatten {border: 1px solid transparent;}
.paper-flatten:before, .paper-flatten:after {bottom: 15px; width: 50%; height: 20%; max-width: 300px;  max-height: 100px; box-shadow: 0 15px 12px rgba(31, 31, 31, 0.7);}
.paper-flatten:before {left: 10px; transform: rotate(-3deg);}
.paper-flatten:after {right: 10px; transform: rotate(3deg);}
/* HOME
*********************************************/
#home_main {height: 50vw; width: 100vw; max-height: 750px;}
#main_slideshow, .intro-slide{height: 100%; width: 100%}
 #intro_image_top{padding-bottom: 8vw;}
  #intro_image_top img, #intro_image_top_mobile img {max-width: 250px;}
 #intro_image_bottom{padding-top: 20px;}
  #intro_image_bottom img{max-width: 200px;}
   #intro_image_bottom_text{border-top: 2px solid transparent; margin-top: 5px; padding-top: 5px;}
   #intro_image_bottom_text .slide-text-inner{color:#0774b2; font-size: 18px; padding:10px 0; display: inline-block;}
   #intro_image_bottom_text img{display: inline-block; max-width: 50px; float: left; margin-right: 15px;}
   #home_intro{margin-top: -125px; margin-bottom: 30px}
 #home_bucket{background: #222222 url('/wp-content/uploads/2017/04/CIAR-home-background-texture.jpg') no-repeat center; background-size: cover; border: 4px solid #ffffff; position: relative; z-index: 101}
  #home_bucket h1{color: #222222; margin:0 auto; padding: 15px 30px; text-align: center; }
  #home_bucket_inner{background:url('/wp-content/uploads/2017/04/CIAR-home-background-inner.jpg') no-repeat center; background-size: contain; margin-bottom: 70px; padding: 30px;}
  
  .promo {text-align: center; border: 1px solid #0774b2; margin: 30px 5px 5px; padding: 5px 20px 20px; background: #eee;}
  .promo .large {font-size: 140%; font-weight: 700;}
  .promo .link {margin-bottom: 30px;}
  .promo .link .btn {font-size: 95%;}
  #promo__video {
	  width: 100%;
	  max-width: 800px;
  }
  .promo .modal-dialog {
	  position: absolute; 
	  left: 0; right: 0;
      top: 0; bottom: 0;
      margin: auto;
      display: flex;
      align-items: center;
      justify-content: center;
  }
   .promo .modal-dialog .modal-content {width: 95%; max-width: 600px;}
  
/* MENUS
*********************************************/
/*General*/
.menu-main-menu-container {padding: 1em;}
.menu-main-menu-container ul, .menu-top-menu-container ul {padding: 0;}
.menu-main-menu-container li, .menu-top-menu-container li {display: inline-block; text-transform: uppercase;}
.menu-main-menu-container a, .menu-top-menu-container a {border-bottom: 2px solid transparent; transition: all .4s;}
.menu-main-menu-container a:hover, .menu-top-menu-container a:hover {text-decoration: none;}

/*TOP*/
.menu-top-menu-container { padding-top: 1em; text-align: right; }
.menu-top-menu-container li{font-size: 12px; padding: 0 .35em 0 .15em }
.menu-top-menu-container li:not(:last-child) {border-right: 1px solid #0774b2;}
.menu-top-menu-container a {border-bottom: 2px solid transparent; color: #666; transition: all .4s;}
.menu-top-menu-container a:hover {color: #222; border-bottom: 2px solid #0774b2;}
/*MAIN*/
.menu-main-menu-container{text-align: center;}
.menu-main-menu-container ul{
margin-bottom: 0;
 display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;

  -webkit-flex-flow: row wrap;
  justify-content: space-around;}
.menu-main-menu-container li{ text-align: center; padding: 0 .35em 0 .15em;
 -webkit-box-flex: 1;
-moz-box-flex: 1;
-ms-box-flex: 1;
box-flex: 1;
display: block;
}
.menu-main-menu-container a{color: #ffffff; padding:10px}
.menu-main-menu-container a:hover{border-bottom-color: #ffffff}
/*MOBILE*/
/* STANDARD
*********************************************/
body.home header{background-color: #ffffff; padding-bottom: 0;}
header.header-inner{background-color: #ffffff}
 #ciar_logo{width: 350px; max-width: 100%}
  #ciar_logo_tag{max-width: 200px; padding:0 20px}
 #header_bottom{background-color: #0774b2;}

#contractor_logos img{padding:10px;}

footer{background-color: #222222; padding:50px 0; margin-top: 3em;}
 footer .logo{margin-bottom: 30px;}
 footer address{font-size: 16px;}
  footer *{color: #ffffff}
  #copyright{background-color: #0774b2;padding:15px 0 5px;}
   #copyright *{color: #ffffff;}
/* MODULES
*********************************************/
.site-main .comment-navigation,
.site-main .posts-navigation,
.site-main .post-navigation {margin: 0 0 1.5em;overflow: hidden;}

.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {float: left;	width: 50%;}

.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {float: right;	text-align: right;	width: 50%;}

.page-content,
.entry-content,
.entry-summary {	margin: 1.5em 0 0;}
.entry-content > .entry-summary{margin-top: 0;}
.page-links {	clear: both;	margin: 0 0 1.5em;}
article .entry-header{padding-bottom: 0;}
article.page {margin-bottom: 3em;}
.single-news-events .entry-content, article.page .entry-content, .loop-archive{margin-top: 50px;}
  .entry-meta{margin-bottom:15px; padding-top: 10px;}
    .entry-date{font-style: italic;}
/*POST NAV*/
.nav-links{ border: 1px solid #ddd;
    border-radius: 3px;
    margin: 20px 0;
    overflow: hidden;}
 .nav-previous, .nav-next{
  width: 50%;
  }
 .nav-previous{}
 .nav-next{}
   .nav-previous a, .nav-next a{
    color: #fff;
    background-color: #0774b2;
     display: block;
     padding: 15px 20px;
     overflow: hidden;
     white-space: nowrap;
     text-overflow: ellipsis;}
     .nav-links a:visited, .nav-links a:hover, .nav-links a:active{color: #fff}
   .nav-previous a:before{
    font-family: FontAwesome;
    content: "\f104";
    display: inline-block;
    padding-right: 5px;
    vertical-align: middle;
    font-size: 18px;}
   .nav-next a:after{
    font-family: FontAwesome;
    content: "\f105";
    display: inline-block;
    padding-left: 5px;
    vertical-align: middle;
    font-size: 18px;}
   .nav-previous a:hover, .nav-next a:hover{background: #222222}


/* OVERRIDES
*********************************************/

/* ANIMATIONS
*********************************************/


/* Common style */
.grid figure
{
    position: relative;

    float: left;
    overflow: hidden;

    width: 100%;
    height: auto;

    cursor: pointer;
    text-align: center;

    background: #3085a3;
}

.grid figure img
{
    position: relative;

    display: block;

    max-width: 100%;
    min-height: 100%;

    opacity: .8;
}

.grid figure figcaption
{
    font-size: 1.25em;

    padding: 2em;

    text-transform: uppercase;

    color: #fff;

    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
}

.grid figure figcaption::before,
.grid figure figcaption::after
{
    pointer-events: none;
}

.grid figure figcaption,
.grid figure figcaption > a
{
    position: absolute;
    top: 0;
    left: 0;

    width: 100%;
    height: 100%;
}

/* Anchor will cover the whole item by default */
/* For some effects it will show as a button */
.grid figure figcaption > a
{
    font-size: 0;

    z-index: 1000;

    white-space: nowrap;
    text-indent: 200%;

    opacity: 0;
}

.grid figure h2
{
    font-weight: 300;
}

.grid figure h2 span
{
    font-weight: 800;
}

.grid figure h2,
.grid figure p
{
    margin: 0;
}

.grid figure p
{
    font-size: 68.5%;

    letter-spacing: 1px;
}
#project-gallery h2
{
    margin-top: 50px;

    text-align: center;

    color: #fff;
}


/*-----------------*/
/***** Winston *****/
/*-----------------*/
.projects-page-teaser
{
    padding-top: 50px;
}

.projects-page-teaser h2
{
    padding-bottom: 10px;
}


.projects-page-teaser .element-item
{float: left;

    width: 50%; padding: 20px 10px 0 10px; text-align: center;
}


/*
.projects-page-teaser .element-item:nth-child(odd){
	margin-left: -10px;
}

.projects-page-teaser .element-item:nth-child(even){
	margin-right: -10px;
}

*/
figure.effect-winston
{
    text-align: left;

    background: #162633;
}

figure.effect-winston img
{
    -webkit-transition: opacity .45s;
            transition: opacity .45s;

    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
}

figure.effect-winston figcaption::before
{
    position: absolute;
    top: 0;
    left: 0;

    width: 117%;
    height: 100%;

    content: '';
    -webkit-transition: opacity .45s, -webkit-transform .45s;
            transition: opacity .45s, transform .45s;
    -webkit-transform: rotate3d(0,0,1,45deg);
            transform: rotate3d(0,0,1,45deg);
    -webkit-transform-origin: 0 100%;
            transform-origin: 0 100%;

    background: url(images/triangle.svg) no-repeat center center;
    background-size: 100% 100%;
}

figure.effect-winston h2
{
    font-size: 28px;

    -webkit-transition: -webkit-transform .35s;
            transition:         transform .35s;
    -webkit-transform: translate3d(0,20px,0);
            transform: translate3d(0,20px,0);
}

figure.effect-winston p
{
    position: absolute;
    right: 0;
    bottom: 0;

    padding: 0 1.5em 7% 0;
}

figure.effect-winston a
{
    font-size: 170%;

    margin: 0 10px;

    color: #5d504f;
}

figure.effect-winston a:hover,
figure.effect-winston a:focus
{
    color: #cc6055;
}

figure.effect-winston p a i
{
    -webkit-transition: opacity .35s, -webkit-transform .35s;
            transition: opacity .35s, transform .35s;
    -webkit-transform: translate3d(0,50px,0);
            transform: translate3d(0,50px,0);

    opacity: 0;
}

figure.effect-winston:hover img
{
    opacity: .6;
}

figure.effect-winston:hover h2
{
    -webkit-transform: translate3d(0,0,0);
            transform: translate3d(0,0,0);
}

figure.effect-winston:hover figcaption::before
{
    -webkit-transform: rotate3d(0,0,1,20deg);
            transform: rotate3d(0,0,1,20deg);

    opacity: .7;
}

figure.effect-winston:hover p i
{
    -webkit-transform: translate3d(0,0,0);
            transform: translate3d(0,0,0);

    opacity: 1;
}

figure.effect-winston:hover p a:nth-child(3) i
{
    -webkit-transition-delay: .05s;
            transition-delay: .05s;
}

figure.effect-winston:hover p a:nth-child(2) i
{
    -webkit-transition-delay: .1s;
            transition-delay: .1s;
}

figure.effect-winston:hover p a:first-child i
{
    -webkit-transition-delay: .15s;
            transition-delay: .15s;
}
.element-item
{
    width: 16.66666666666%;
}


@media (max-width: 1500px)
{
    .element-item
    {
        width: 25%;
    }
}


@media (max-width: 1200px)
{
    .element-item
    {
        width: 33.33333333%;
    }
}


@media (max-width: 767px)
{
    .projects-page-teaser .element-item
    {
        width: 100%;
    }
}


@media (max-width: 500px)
{
    .element-item
    {
        width: 100%;
    }
}

.element-item img
{
    width: 100%;
    height: auto;

    border: 1px solid #fff;
}

@media (max-width: 500px)
{
    .projects-page-teaser .element-item
    {
        width: 100%;
    }

    .projects-page-teaser .element-item:nth-child(odd),
    .projects-page-teaser .element-item:nth-child(even)
    {
        margin-right: 0;
        margin-left: 0;
        padding: 0;
    }
}

/* OTHER
*********************************************/
#wpcf7-f5-p18-o1{margin-top: 20px}
/* YouTube Video Aspect Ratio */
.video-container { position: relative; padding-bottom: 50%; padding-top: 30px; height: 0; overflow: hidden; }
.video-container iframe,
.video-container object,
.video-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

/* Google Map Aspect Ratio */
.map-container { position: relative; padding-bottom: 33%; padding-top: 30px; height: 0; overflow: hidden; }
.map-container iframe,
.map-container object,
.map-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.resource-guide-pdf {
	max-width: 600px;
}

/* SYSTEM
**************************************************/
/*--------------------------------------------------------------
# Forms
--------------------------------------------------------------*/
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	border: 1px solid;
	border-color: #0774b2 #0774b2 #0774b2;
	border-radius: 3px;
	background: #0774b2;
	color: #ffffff;
	font-size: 16px;
	line-height: 1.1;
	padding: .6em 1em;
}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
	border-color: #ccc #bbb #aaa;
}

button:focus,
input[type="button"]:focus,
input[type="reset"]:focus,
input[type="submit"]:focus,
button:active,
input[type="button"]:active,
input[type="reset"]:active,
input[type="submit"]:active {
	border-color: #aaa #bbb #bbb;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
	color: #666;
	border: 1px solid #ccc;
	border-radius: 3px;
	padding: 3px;
 max-width: 100%;
}

select {
	border: 1px solid #ccc;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
	color: #111;
}

textarea {
	width: 100%;
}
span.wpcf7-list-item { display: block!important;}