#folio {
    background: url(../images/gallery-quote-white.png) center 80px no-repeat #fff;
    padding-top: 100px;
    clear: left;
}

.portfolio_container {
    position: relative;
    display: block;
    overflow: hidden;
    width: 100%;
}

    .portfolio_container.isotope .portfolio {
        position: relative;
        display: block;
        float: left;
        overflow: hidden;
        width: 25%;
        height: auto;
    }

    .portfolio_container.isotope .portfolio .media_box figure a img {
        display: block;
        margin-left: auto;
        margin-right: auto;
    }

    .portfolio_container.isotope .portfolio .media_box .hover_effect {
        top: 0;
        left: 0;
    }

.gallerySelector {
    background: #E5E5E5;
    height: 44px;
    width: 100%;
    margin-top: 20px;
}

.gallerySelectorList {
    margin: 0;
    width: 100%;
}

    .gallerySelectorList li {
        float: left;
        margin: 0;
        list-style: none;
        width: 20%;
        text-align: center;
        padding: 0;
    }

        .gallerySelectorList li:hover {
            background: #868991;
        }

            .gallerySelectorList li:hover a {
                color: #fff;
            }

        .gallerySelectorList li a {
            display: block;
            padding: 11px 0;
            color: #222;
            text-decoration: none;
            margin: 0;
            transition: background-color 0.3s ease, color 0.2s ease;
        }

        .gallerySelectorList li.current {
            background: #868991;
        }

            .gallerySelectorList li.current a {
                color: #fff;
            }

.portfolio_container.isotope .portfolio {
    width: 20%;
}

.fullwidth {
    display: block;
    max-width: 100%;
    min-width: 100%;
}

#gallery h3 {
    margin-bottom: 20px;
}

.project-title {
    font-family: 'Oswald', sans-serif;
    font-size: 12px;
    text-transform: uppercase;
    margin-top: 7px;
}

.project-description {
    color: #868991;
    font-size: 10px;
    text-transform: uppercase;
    font-weight: 600;
    margin: 0 0 20px 0;
}

.isotope .thumbLink {
    display: block;
    width: 100%;
}

.isotope .thumbImage {
    float: left;
    position: relative;
    overflow: hidden;
    display: block;
    margin-bottom: 0px;
    box-sizing: border-box;
    text-align: center;
    width: 100%;
    height: 100%;
}

.isotope .thumbImage img {
    transition: all 0.7s ease-in-out;
}

.isotope .thumbImage .thumbText h3 {
    margin-bottom: 10px;
    padding-top: 10px;
    color: #fff;
    border-bottom: 1px solid #fff;
    transition: all 1s ease-in-out;
}

.isotope .thumbImage .thumbText p {
    margin-bottom: 10px;
    color: #fff;
    transition: all 1s ease-in-out;
}

.isotope .thumbImage .thumbTextWrap {
    position: absolute;
    top: 0;
    height: 100%;
    opacity: 0;
    max-width: 100%;
    min-width: 100%;
    background: #868991;
    text-align: center;
    transition: all 1s ease-in-out;
    -webkit-user-select: none;
}

.ie8 .thumbImage .thumbTextWrap {
    display: none;
}


/*below commented out because it was not compatible with older versions of safari. caused the gallery elements not to work correctly*/


/*.thumbImage .thumbTextWrap:before {
	content: '';
	display: inline-block;
	height: 100%;
	vertical-align: middle;
	margin-right: -0.5em; */


/* Adjusts for spacing


}*/

.isotope .thumbText {
    text-align: center;
    transform: scale(0);
    transition: all 0.7s ease-in-out;
    display: inline-block;
    vertical-align: middle;
    width: 90%;
    font-size: 10px;
}

.isotope .thumbImage:hover img {
    opacity: 0;
    transform: scale(10);
}

.isotope .touch-device .thumbImage:hover img {
    transform: none;
}

.isotope .thumbImage:hover .thumbTextWrap {
    opacity: 1;
}

.ie8 .thumbImage:hover .thumbTextWrap {
    display: block;
}

.isotope .thumbImage:hover .thumbText {
    transform: scale(1);
}

.touch-device .thumbImage:hover .thumbTextWrap {
    display: block;
}

.touch-device .thumbText,
.touch-device .thumbImage img,
.touch-device .thumbImage .thumbText h3,
.touch-device .thumbImage .thumbText p,
.touch-device .thumbImage .thumbTextWrap {
    transition: none;
}

.ie8 .thumbImage:hover .thumbTextWrap {
    display: block;
}

.isotope .thumbLink {
    background: #fff;
    color: #000;
    font-size: 20px;
    width: 30px;
    height: 30px;
    border-radius: 15px;
    opacity: 0.5;
    margin: 0 auto;
}

.isotope a.thumbLink {
    text-decoration: none !important;
}

.isotope .thumbLink:hover {
    opacity: 1;
}

.portfolioBottom {
    background: #E5E5E5;
    height: 44px;
    width: 100%;
    clear: left;
}

/**** Isotope Filtering ****/
.isotope-item {
    z-index: 2;
}

.isotope-hidden.isotope-item {
    pointer-events: none;
    z-index: 1;
}

/**** Isotope CSS3 transitions ****/
.isotope,
.isotope .isotope-item {
    transition-duration: 0.8s;
}

.isotope {
    transition-property: height, width;
}

    .isotope .isotope-item {
        -o-transition-property: top, left, opacity;
        transition-property: transform, opacity;
    }

        /**** disabling Isotope CSS3 transitions ****/
        .isotope.no-transition,
        .isotope.no-transition .isotope-item,
        .isotope .isotope-item.no-transition {
            transition-duration: 0s;
        }

    /* End: Recommended Isotope styles */

    /* disable CSS transitions for containers with infinite scrolling*/
    .isotope.infinite-scrolling {
        transition: none;
    }

/* portfolio section modifications
--------------------------------------------------------*/
.gallerySelectorList li.current {
    background: #000;
    border-bottom: 3px solid #fff;
}

.gallerySelectorList li:hover {
    background: #666;
}

.gallerySelectorList li:hover a {
    color: #fff;
}

.isotope .thumbLink {
    display: block;
    width: 100%;
}

.isotope .thumbLink {
    background: #fff;
    color: #000;
    font-size: 20px;
    width: 30px;
    height: 30px;
    border-radius: 15px;
    opacity: 0.5;
    margin: 0 auto;
}

.isotope .thumbImage .thumbTextWrap {
    position: absolute;
    top: 0;
    height: 100%;
    opacity: 0;
    max-width: 100%;
    min-width: 100%;
    background: #000;
    text-align: center;
    transition: all 1s ease-in-out;
    -webkit-user-select: none;
}

.isotope .thumbImage .thumbText h3 {
    margin-bottom: 10px;
    padding-top: 10px;
    color: #fff;
    border-bottom: 1px solid #fff;
    transition: all 1s ease-in-out;
}

.isotope .thumbImage .thumbText p {
    margin-top: 10px;
    margin-bottom: 10px;
    color: #fff;
    padding-left: 5px;
    padding-right: 5px;
    transition: all 1s ease-in-out;
}

.isotope .thumbImage {
    border: 4px solid #fff;
}

/* makes all hover link classes the same color of Navy gold */
/*a:hover {
    color: #868991;
}*/

/*nav ul li a:hover {
    color: #868991;
    transition: color 0.5s;
}*/

#folio {
    background: none;
    padding-top: 0;
    clear: left;
}

.closemargin {
    background: none;
    padding-top: 4px;
    clear: left;
}

.isotope .ayche3 {
    font-size: 22px;
    line-height: 1;
    color: #555;
}

.isotope .sectionTitle .ayche3 {
    border-bottom: 1px solid #cacaca;
    font-size: 18px;
    line-height: 20px;
    margin-bottom: 10px;
}

/* Custom Font
--------------------------------------------------------*/
@font-face {
    font-family: 'surreal';
    src: url('/desktopmodules/sharedlibrary/plugins/Isotope/1.5.21/fonts/surreal.eot');
    src: url('/desktopmodules/sharedlibrary/plugins/Isotope/1.5.21/fonts/surreald41d.eot?#iefix') format('embedded-opentype'), url('/desktopmodules/sharedlibrary/plugins/Isotope/1.5.21/fonts/surreal.woff') format('woff'), url('/desktopmodules/sharedlibrary/plugins/Isotope/1.5.21/fonts/surreal.ttf') format('truetype'), url('/desktopmodules/sharedlibrary/plugins/Isotope/1.5.21/fonts/surreal.svg#surreal') format('svg');
    font-weight: normal;
    font-style: normal;
}

.isotope .icon-camera,
.isotope .icon-camera-2 {
    font-family: 'surreal';
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1.4;
    -webkit-font-smoothing: antialiased;
    display: inline;
}

.isotope .icon-camera:before {
    content: "\e01c";
}

.isotope .icon-camera-2:before {
    content: "\e01d";
}

.fullScreenExit {
    display: none;
}

@media only screen and (max-width: 1024px) {
    .isotope .thumbAlt {
        display: none;
    }

    .isotope .sectionTitle .ayche3 {
        font-size: 12px;
        line-height: 15px;
    }

    .fullScreenExit {
        display: block;
        position: absolute;
        top: 15px;
        right: 30px;
        z-index: 1000;
    }
}