/* ---------------------------------------------------------------------- */
/* Theme Information
/* ----------------------------------------------------------------------
Name: EVOLVE
Description: Responsive Multi-Purpose HTML5 Template
Author: alphawd
------------------------------------------------------------------------- */


/* Table of Contents
==================================================
    #Base 960 Grid
    #Tablet (Portrait)
    #Mobile (Portrait)
    #Mobile (Landscape)
    #Clearing */



/* #Base 960 Grid
================================================== */

    .containereav                                  { position: relative; width: 1024px; margin: 20px auto; padding: 0; }
    .containereav .column,
    .containereav .columns                         { float: left; display: inline; margin-left: 10px; margin-right: 10px; }
    .row                                        { margin-bottom: 20px; }

    /* Nested Column Classes */
    .column.alpha, .columns.alpha               { margin-left: 0; }
    .column.omega, .columns.omega               { margin-right: 0; }

    /* Base Grid */
    .containereav .one.column,
    .containereav .one.columns                     { width: 40px;  }
    .containereav .two.columns                     { width: 100px; }
    .containereav .three.columns                   { width: 160px; }
    .containereav .four.columns                    { width: 220px; }
    .containereav .five.columns                    { width: 280px; }
    .containereav .six.columns                     { width: 340px; }
    .containereav .seven.columns                   { width: 400px; }
    .containereav .eight.columns                   { width: 460px; }
    .containereav .nine.columns                    { width: 520px; }
    .containereav .ten.columns                     { width: 580px; }
    .containereav .eleven.columns                  { width: 640px; }
    .containereav .twelve.columns                  { width: 700px; }
	.twelve.columns                  { width: 700px; }
    .containereav .thirteen.columns                { width: 760px; }
    .containereav .fourteen.columns                { width: 820px; }
    .containereav .fifteen.columns                 { width: 880px; }
    .containereav .sixteen.columns                 { width: 940px; }

    .containereav .one-third.column                { width: 300px; }
    .containereav .two-thirds.column               { width: 620px; }

    /* Offsets */
    .containereav .offset-by-one                   { padding-left: 60px;  }
    .containereav .offset-by-two                   { padding-left: 120px; }
    .containereav .offset-by-three                 { padding-left: 180px; }
    .containereav .offset-by-four                  { padding-left: 240px; }
    .containereav .offset-by-five                  { padding-left: 300px; }
    .containereav .offset-by-six                   { padding-left: 360px; }
    .containereav .offset-by-seven                 { padding-left: 420px; }
    .containereav .offset-by-eight                 { padding-left: 480px; }
    .containereav .offset-by-nine                  { padding-left: 540px; }
    .containereav .offset-by-ten                   { padding-left: 600px; }
    .containereav .offset-by-eleven                { padding-left: 660px; }
    .containereav .offset-by-twelve                { padding-left: 720px; }
    .containereav .offset-by-thirteen              { padding-left: 780px; }
    .containereav .offset-by-fourteen              { padding-left: 840px; }
    .containereav .offset-by-fifteen               { padding-left: 900px; }



/* #Tablet (Portrait)
================================================== */

    /* Note: Design for a width of 768px */

    @media only screen and (min-width: 768px) and (max-width: 959px) {
        .containereav                                  { width: 768px; }
        .containereav .column,
        .containereav .columns                         { margin-left: 10px; margin-right: 10px;  }
        .column.alpha, .columns.alpha               { margin-left: 0; margin-right: 10px; }
        .column.omega, .columns.omega               { margin-right: 0; margin-left: 10px; }
        .alpha.omega                                { margin-left: 0; margin-right: 0; }

        .containereav .one.column,
        .containereav .one.columns                     { width: 28px; }
        .containereav .two.columns                     { width: 76px; }
        .containereav .three.columns                   { width: 124px; }
        .containereav .four.columns                    { width: 172px; }
        .containereav .five.columns                    { width: 220px; }
        .containereav .six.columns                     { width: 268px; }
        .containereav .seven.columns                   { width: 316px; }
        .containereav .eight.columns                   { width: 364px; }
        .containereav .nine.columns                    { width: 412px; }
        .containereav .ten.columns                     { width: 460px; }
        .containereav .eleven.columns                  { width: 508px; }
        .containereav .twelve.columns                  { width: 556px; }
					.twelve.columns                  { width: 556px; }
        .containereav .thirteen.columns                { width: 604px; }
        .containereav .fourteen.columns                { width: 652px; }
        .containereav .fifteen.columns                 { width: 700px; }
        .containereav .sixteen.columns                 { width: 748px; }

        .containereav .one-third.column                { width: 236px; }
        .containereav .two-thirds.column               { width: 492px; }

        /* Offsets */
        .containereav .offset-by-one                   { padding-left: 48px; }
        .containereav .offset-by-two                   { padding-left: 96px; }
        .containereav .offset-by-three                 { padding-left: 144px; }
        .containereav .offset-by-four                  { padding-left: 192px; }
        .containereav .offset-by-five                  { padding-left: 240px; }
        .containereav .offset-by-six                   { padding-left: 288px; }
        .containereav .offset-by-seven                 { padding-left: 336px; }
        .containereav .offset-by-eight                 { padding-left: 384px; }
        .containereav .offset-by-nine                  { padding-left: 432px; }
        .containereav .offset-by-ten                   { padding-left: 480px; }
        .containereav .offset-by-eleven                { padding-left: 528px; }
        .containereav .offset-by-twelve                { padding-left: 576px; }
        .containereav .offset-by-thirteen              { padding-left: 624px; }
        .containereav .offset-by-fourteen              { padding-left: 672px; }
        .containereav .offset-by-fifteen               { padding-left: 720px; }
    }


/*  #Mobile (Portrait)
================================================== */

    /* Note: Design for a width of 320px */

    @media only screen and (max-width: 767px) {
        .containereav { width: 300px; }
        .containereav .columns,
        .containereav .column { margin: 0; }

        .containereav .one.column,
        .containereav .one.columns,
        .containereav .two.columns,
        .containereav .three.columns,
        .containereav .four.columns,
        .containereav .five.columns,
        .containereav .six.columns,
        .containereav .seven.columns,
        .containereav .eight.columns,
        .containereav .nine.columns,
        .containereav .ten.columns,
        .containereav .eleven.columns,
        .containereav .twelve.columns,
		.twelve.columns,
        .containereav .thirteen.columns,
        .containereav .fourteen.columns,
        .containereav .fifteen.columns,
        .containereav .sixteen.columns,
        .containereav .one-third.column,
        .containereav .two-thirds.column  { width: 300px; }

        /* Offsets */
        .containereav .offset-by-one,
        .containereav .offset-by-two,
        .containereav .offset-by-three,
        .containereav .offset-by-four,
        .containereav .offset-by-five,
        .containereav .offset-by-six,
        .containereav .offset-by-seven,
        .containereav .offset-by-eight,
        .containereav .offset-by-nine,
        .containereav .offset-by-ten,
        .containereav .offset-by-eleven,
        .containereav .offset-by-twelve,
        .containereav .offset-by-thirteen,
        .containereav .offset-by-fourteen,
        .containereav .offset-by-fifteen { padding-left: 0; }

    }


/* #Mobile (Landscape)
================================================== */

    /* Note: Design for a width of 480px */

    @media only screen and (min-width: 480px) and (max-width: 767px) {
        .containereav { width: 420px; }
        .containereav .columns,
        .containereav .column { margin: 0; }

        .containereav .one.column,
        .containereav .one.columns,
        .containereav .two.columns,
        .containereav .three.columns,
        .containereav .four.columns,
        .containereav .five.columns,
        .containereav .six.columns,
        .containereav .seven.columns,
        .containereav .eight.columns,
        .containereav .nine.columns,
        .containereav .ten.columns,
        .containereav .eleven.columns,
        .containereav .twelve.columns,
    	.twelve.columns,
        .containereav .thirteen.columns,
        .containereav .fourteen.columns,
        .containereav .fifteen.columns,
        .containereav .sixteen.columns,
        .containereav .one-third.column,
        .containereav .two-thirds.column { width: 420px; }
    }


/* #Clearing
================================================== */

    /* Self Clearing Goodness */
    .containereav:after { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }

    /* Use clearfix class on parent to clear nested columns,
    or wrap each row of columns in a <div class="row"> */
    .clearfix:before,
    .clearfix:after,
    .row:before,
    .row:after {
      content: '\0020';
      display: block;
      overflow: hidden;
      visibility: hidden;
      width: 0;
      height: 0; }
    .row:after,
    .clearfix:after {
      clear: both; }
    .row,
    .clearfix {
      zoom: 1; }

    /* You can also use a <br class="clear" /> to clear columns */
    .clear {
      clear: both;
      display: block;
      overflow: hidden;
      visibility: hidden;
      width: 0;
      height: 0;
    }
/* Images Overlay
==========================*/
.work {
	position: relative;
	margin-bottom: 20px;

	text-align: center;
}

.work-image {
    display: block;
    position: relative;
    z-index: 2;
    overflow: hidden;
	
	box-shadow: 0 1px 1px rgba(0,0,0,0.1);

	-webkit-transition: box-shadow 0.2s ease;
	transition: box-shadow 0.2s ease;
}

.work-image img {
    width: 100%;
    display: block;
    
	-webkit-transition: all 0.2s ease;
	transition: all 0.2s ease;
}

.work-image:hover img {
    -webkit-transform: scale(1.1);
	transform: scale(1.1);
}

.desc h3 {
    margin: 0;
}

.desc .tags {
    margin: 0 0 10px;
}

.link-overlay {
	position: absolute;
	top: 0;       left: 0;
	bottom: 0;    right: 0;

	background: rgba(0,0,0,0);

	-webkit-transition: background-color 0.3s ease;
	transition: background-color 0.3s ease;
}

.link-overlay:before {
	display: block;

	width: 46px;
	height: 46px;

	position: absolute;
	top: 50%;    left: 50%;

	margin: -22px 0 0 -25px;

	border-radius: 50%;
	background: #fff;

	text-align: center;
	font: 14px/46px 'FontAwesome';
	color: #2c2c2c;

	-webkit-transform: scale(0.8);
	transform: scale(0.8);
	opacity:0;

	-webkit-transition: -webkit-transform 0.3s ease, opacity 0.3s ease;
	transition: transform 0.3s ease, opacity 0.3s ease;
}

.work-image:hover .link-overlay { background: rgba(20,22,23,0.6);}

.work-image:hover  .link-overlay:before {
	-webkit-transform: scale(1);
	transform: scale(1);
	opacity:1;
}

.work p { margin: 0; }

.work-name {
	display: inline-block;
	margin: 15px 0 6px;
    font-size: 14px;
}

a.work-name {
	color: #313538;
	-webkit-transition: all 0.2s ease;
	transition: all 0.2s ease;
	position: relative;
}

a.work-name:hover {
	color: #04BFEA;
}

.tags {
/* 	font: 12px 'OpenSansItalic'; */
    font-size: 12px;
    color: #c9c9c9;
}
/* /////////   */
/* Slider Styles
==========================*/
.fullwidthbanner-container {
	width: 100% !important;
	max-height: 492px !important;

	position: relative;
	padding: 0;
	overflow: hidden;
	margin-bottom: 40px !important;
}

.fullwidthbanner-container .fullwidthbanner {
    max-height: 492px !important;
    position: relative;
    margin-top: -5px;
    width: 100% !important;
}

.top-shadow:before {
	content: '';

	display: block;

	width: 100%;
	height: 5px;

	position: relative;
	z-index: 40;

	margin: auto;

	box-shadow: 0 2px 3px rgba(0,0,0,0.1) inset;
}

.tp-leftarrow.default, .tp-rightarrow.default {
	width: 32px !important;
	height: 80px !important;

	left: -40px !important;

	background: rgba(20,22,23,0.6) !important;
	border-radius: 2px !important;

	-webkit-transition: background-color 0.4s ease, left 0.2s ease, right 0.2s ease !important;
	transition: background-color 0.4s ease, left 0.2s ease, right 0.2s ease !important;
}

.tp-rightarrow.default {
	left: auto !important;
	right: -40px !important;
}

.tp-leftarrow.default:before, .tp-rightarrow.default:before {
	content: '\f104';

	display: block;

	text-align: center;
	line-height: 80px;
	font: 20px/80px 'FontAwesome';
	color: #fff;
}

.tp-rightarrow.default:before {
	content: '\f105';
}

.tp-leftarrow.default:hover, .tp-rightarrow.default:hover {
	background: #04BFEA !important;
}

.tp-bullets {
	bottom: 22px !important;
	-webkit-transition: bottom 0.2s ease !important;
	transition: bottom 0.2s ease !important;
}

.bullet {
	width: 13px !important;
	height: 13px !important;

	border-radius: 50%;
	background: rgba(0,0,0,0.4) !important;
	box-shadow: inset 0 1px 1px rgba(0,0,0,0.4), 0 1px 0 rgba(250,250,250,0.1);

	margin: 0 4px !important;

	-webkit-transition: opacity 0.2s ease !important;
	transition: opacity 0.2s ease !important;
	display: none;
}

.main-slider:hover .ls-fullwidth .ls-bottom-slidebuttons a {
	opacity: 1;
}

.bullet.selected {
	background: #04bfea !important;
	box-shadow: inset 0 1px 1px rgba(0,0,0,0), 0 1px 2px rgba(0,0,0,0.15);
}

.fullwidthbanner-container:hover .tp-leftarrow.default {
	left: 20px !important;
}

.fullwidthbanner-container:hover .tp-rightarrow.default {
	right: 20px !important;
}

.tp-caption span {
	display: block;

	border-radius: 2px;
	line-height: 1.1em;
	color: #fff;
	
	text-shadow: 0 1px 1px rgba(0,0,0,0.1);
}

.tp-caption span a {
	color: #04BFEA;
}

.tp-caption span a:hover {
	color: #fff;
}

.tp-caption.m-text-color span {
	padding: 0 !important;
	color: #04BFEA;
}

.tp-caption.m-text-black span {
	padding: 0 !important;
	color: #313538;
}

.tp-caption.m-text-white span {
	padding: 0 !important;
}

.tp-caption.m-bg-white span {
	background-color: #fff !important;
	color: #3f4144;
}

.tp-caption.m-bg-black span {
	background-color: rgba(20,22,23,0.7) !important;
	color: #fff;
}

.tp-caption.m-bg-color span {
	background-color: rgba(227,71,53,0.8) !important;
	color: #fff;
}

.tp-caption.m-7em span {
	padding: 0.25em 0.4em 0.3em;
	line-height: 0.9em;
	font-size: 7em;
}

.tp-caption.m-6em span {
	padding: 0.25em 0.4em 0.3em;
	line-height: 0.9em;
	font-size: 6em;
}

.tp-caption.m-5em span {
	padding: 0.3em 0.4em 0.35em;
	line-height: 0.9em;
	font-size: 5em;
}

.tp-caption.m-4em span {
	padding: 0.85em 1.1em 0.9em;
	line-height: 0.9em;
	font-size: 4em;
}

.tp-caption.m-3-8em span {
	padding: 0.85em 1.1em 0.9em;
	line-height: 0.9em;
	font-size: 3.8em;
}

.tp-caption.m-3-6em span {
	padding: 0.85em 1.1em 0.9em;
	line-height: 0.9em;
	font-size: 3.6em;
}

.tp-caption.m-3-4em span {
	padding: 0.85em 1.1em 0.9em;
	line-height: 0.95em;
	font-size: 3.4em;
}

.tp-caption.m-3-2em span {
	padding: 0.85em 1.1em 0.9em;
	line-height: 0.95em;
	font-size: 3.2em;
}

.tp-caption.m-3em span {
	padding: 0.85em 1.1em 0.9em;
	line-height: 1em;
	font-size: 3em;
}

.tp-caption.m-2-8em span {
	padding: 0.85em 1.1em 0.9em;
	line-height: 1em;
	font-size: 2.8em;
}

.tp-caption.m-2-6em span {
	padding: 0.85em 1.1em 0.9em;
	line-height: 1em;
	font-size: 2.6em;
}

.tp-caption.m-2-4em span {
	padding: 0.35em 0.7em 0.4em;
	font-size: 2.4em;
}

.tp-caption.m-2-2em span {
	padding: 0.38em 0.7em 0.43em;
	font-size: 2.2em;
}

.tp-caption.m-2em span {
	padding: 0.85em 1.1em 0.9em;
	font-size: 2em;
}

.tp-caption.m-1-8em span {
	padding: 0.85em 1.1em 0.9em;
	font-size: 1.8em;
}

.tp-caption.m-1-6em span {
	padding: 0.55em 1.1em 0.6em;
	font-size: 1.6em;
}

.tp-caption.m-1-4em span {
	padding: 0.55em 1.0em 0.6em;
	line-height: 1.2em;
	font-size: 1.4em;
}

.tp-caption.m-1-2em span {
	padding: 0.6em 1.1em 0.65em;
	line-height: 1.4em;
	font-size: 1.2em;
}

.tp-caption.m-bebas_neueregular span {
	font-family: 'bebas_neueregular';
}

.tp-caption.m-great-vibesregular span {
	font-family: 'great_vibesregular';
}

.tp-caption.m-semibold span {
	font-family: 'OpenSansSemiboldRegular';
}

.tp-caption.m-opensansitalic span {
	font-family: 'OpenSansItalic';
}

.tp-caption.m-opensanslightitalic span {
	font-family: 'OpenSansLightItalic';
}

.tp-caption.m-bold span {
	font-family: 'OpenSansBold';
}

.tp-caption.m-extra-bold span {
	font-family: 'OpenSansExtraboldRegular';
}

.tp-caption.m-light span {
	font-family: 'OpenSansLightRegular';
}

.tp-caption.m-opacity-80 span {
	opacity: 0.8;
}

.tp-caption.m-letter-spacing-1 span {
	letter-spacing: 1px;
}

.tp-caption.m-uppercase span {
	text-transform: uppercase !important;
}

.tp-caption.m-lowercase span {
	text-transform: lowercase !important;
}

.shortcodes .tp-caption span {
	margin-bottom: 20px;
}
