/*
Theme Name: ANG
Theme URI: http://www.amberweinberg.com/super-hijinksified-lightweight-wordpress-theme
Description: This theme is a derivative of Super Hijinksified, custom coded for the client.
Author: Amber Weinberg
Author URI: http://www.amberweinberg.com
Version: 1.0

*/

/***************************************************************************************************************************************************************************************/

/*HTML5 BOILERPLATE MINIFIED*/

/***************************************************************************************************************************************************************************************/

*{box-sizing:border-box;}article{display:block}aside{display:block}details{display:block}figcaption{display:block}figure{display:block;margin:0}footer{display:block}header{display:block}hgroup{display:block}nav{display:block}section{display:block}audio{display:inline;zoom:1}canvas{display:inline;zoom:1}video{display:inline;zoom:1}audio:not([controls]){display:none}[hidden]{display:none}html{font-size:100%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;font-family:sans-serif;color:#222}button{font-family:sans-serif;color:#222;font-size:100%;vertical-align:middle;line-height:normal;cursor:pointer;-webkit-appearance:button;overflow:visible;margin:0}input{font-family:sans-serif;color:#222;font-size:100%;vertical-align:middle;line-height:normal;margin:0}select{font-family:sans-serif;color:#222;font-size:100%;vertical-align:middle;margin:0}textarea{font-family:sans-serif;color:#222;font-size:100%;overflow:auto;vertical-align:top;resize:vertical;margin:0}body{font-size:1em;line-height:1.4;margin:0}::-moz-selection{background:#333;color:#fff;text-shadow:none}::selection{background:#333;color:#fff;text-shadow:none}a{color:#00e}a:hover{color:#06e;outline:0}a:active{outline:0}abbr[title]{border-bottom:1px dotted}b{font-weight:700}strong{font-weight:700}blockquote{margin:1em 40px}dfn{font-style:italic}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}ins{background:#ff9;color:#000;text-decoration:none}mark{background:#ff0;color:#000;font-style:italic;font-weight:700}pre{font-family:monospace, serif;_font-family:'courier new', monospace;font-size:1em;white-space:pre-wrap;word-wrap:break-word}code{font-family:monospace, serif;_font-family:'courier new', monospace;font-size:1em}kbd{font-family:monospace, serif;_font-family:'courier new', monospace;font-size:1em}samp{font-family:monospace, serif;_font-family:'courier new', monospace;font-size:1em}q{quotes:none}q:before{content:none}q:after{content:none}small{font-size:85%}sub{font-size:75%;line-height:0;position:relative;vertical-align:baseline;bottom:-.25em}sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;top:-.5em}ul{margin:1em 0;padding:0 0 0 40px}ol{margin:1em 0;padding:0 0 0 40px}dd{margin:0 0 0 40px}nav ul{list-style:none;list-style-image:none;margin:0;padding:0}nav ol{list-style:none;list-style-image:none;margin:0;padding:0}img{border:0;-ms-interpolation-mode:bicubic;vertical-align:middle}svg:not(:root){overflow:hidden}form{margin:0}fieldset{border:0;margin:0;padding:0}label{cursor:pointer}legend{border:0;margin-left:-7px;white-space:normal;padding:0}input[type="button"]{cursor:pointer;-webkit-appearance:button;overflow:visible}input[type="reset"]{cursor:pointer;-webkit-appearance:button;overflow:visible}input[type="submit"]{cursor:pointer;-webkit-appearance:button;overflow:visible}button[disabled]{cursor:default}input[disabled]{cursor:default}input[type="checkbox"]{box-sizing:border-box;width:13px;height:13px;padding:0}input[type="radio"]{box-sizing:border-box;width:13px;height:13px;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-decoration{-webkit-appearance:none}input[type="search"]::-webkit-search-cancel-button{-webkit-appearance:none}button::-moz-focus-inner{border:0;padding:0}input::-moz-focus-inner{border:0;padding:0}input:invalid{background-color:#f0dddd}textarea:invalid{background-color:#f0dddd}table{border-collapse:collapse;border-spacing:0}td{vertical-align:top}.chromeframe{background:#ccc;color:#000;margin:.2em 0;padding:.2em 0}

/***************************************************************************************************************************************************************************************/

/*BODY STYLES*/

/***************************************************************************************************************************************************************************************/

html {
    font-size: 100%;
}

body { 
	background: #FFF; 
	color: #282828; 
	font: 1em 'proxima-nova', Arial, Helvetica, sans-serif; 
}

html,
body {
    height: 100%;
}

a { 
    color: #004c95;
	text-decoration: none;
	transition: all .5s ease;
}

a:hover {
	color: #008145;
}

.container {
	clear: both;
	margin: 0 auto; 
	max-width: 1250px;
	padding: 0 20px;
	position: relative;
}

img {
	height: auto;
	max-width: 100%;
}

iframe {
    max-width: 100%;
}

h2 {
    color: #0b2f72;
    font-size: 1.375em; /*22/16*/
    letter-spacing: .25px;
    margin: 0 0 20px;
    text-transform: uppercase;
}

article p,
article ol,
article ul {
    font-size: 1.125em; /*18/16*/
    letter-spacing: .25px;
    line-height: 1.388em; /*25/18*/
    margin: 0 0 45px;
}

.btn {
    background: #08a0f8;
    color: #fff;
    display: inline-block;
    font-size: 1.125em; /*18/16*/
    font-weight: 500;
    letter-spacing: .25px;
    padding: 13px 20px;
    text-transform: uppercase;
}

.btn:after {
    background: url('svgs/icons.svg') no-repeat 0 0;
    content: "";
    display: inline-block;
    height: 19px;
    margin: 0 0 0 45px;
    vertical-align: middle;
    width: 14px;
}

.btn-alt {
    background: none;
    border-bottom: 1px solid #818283;
    border-top: 1px solid #818283;
    color: #909191;
    display:block;
    font-size: 2.25em;
    font-weight: 600;
    margin: 0 auto;
    max-width: 566px;
    padding: 15px 10px;
    text-transform: uppercase;
}

.btn-alt:hover {
    border-color: #0b2f72;
    color: #0b2f72;
}

.btn:hover {
    background: #0b2f72;
    color: #fff;
}

/***************************************************************************************************************************************************************************************/

/*HEADER STYLES*/

/***************************************************************************************************************************************************************************************/

header, 
section, 
footer,
article {
	float: left;
	width: 100%;
}

header {
    padding: 40px 0 55px;
    position: relative;
    transition: all .5s ease;
    z-index: 2;
}

header.fixed {
    left: 0;
    padding: 20px 0;
    position: fixed;
    top: 0;
}

header.fixed + * {
    margin-top: 89px;
}

header .container {
    max-width: 1688px;
}

header .logo {
    float: left;
    margin-top: 10px;
}

header .logo img {
    transition: all .5s ease;
}

header.fixed .logo {
    margin-top: 0;
}

header.fixed .logo img {
    width: 60px;
}

/***************************************************************************************************************************************************************************************/

/*NAV STYLES*/

/***************************************************************************************************************************************************************************************/

header nav {
    float: right;
}

header nav .mobile-logo {
    display: none;
}

header ul {
    display: inline-block;
    vertical-align: top;
}

header li {
    display: inline-block;
    margin-left: 60px;
}

header li a {
    color: #fff;
    display: block;
    font-size: .9375em; /*15/16*/
    font-weight: bold;
    letter-spacing: .25px;
    text-transform: uppercase;
}

header li:last-child a {
    border: 2px solid #fff;
    padding: 10px 20px 9px;
}

header li:last-child {
    margin-left: 40px;
}

header li a:hover,
header li[class*=' current'] a {
    color: #0b2f72;
}

header li:last-child a:hover,
header li:last-child[class*=' current'] a {
    border-color: #0b2f72;
}

header .btn-linkedin,
.mean-bar .btn-linkedin {
    background: url('svgs/icons.svg') no-repeat -70px 0;
    display: inline-block;
    height: 49px;
    margin-left: 30px;
    text-indent: -999999px;
    width: 49px;
}

header .btn-linkedin:hover {
    opacity: .7;
}

/***************************************************************************************************************************************************************************************/

/*FOOTER STYLES*/

/***************************************************************************************************************************************************************************************/

/***Footer Btns***/

.footer-btn-container {
    display: -webkit-flex;
    display: flex;
    float: left;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    margin-top: 150px;
    width: 100%;
}

.home .footer-btn-container,
.home footer {
    display: none;
}

.footer-btn-container .container {
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    width: 100%;
}

.footer-btn {
    -webkit-align-items: center;
    align-items: center;
    background: #0b2f72;
    color: #fff;
    display: -webkit-flex;
    display: flex;
    font-size: 1.375em; /*22/16*/
    font-weight: bold;
    height: 150px;
    -webkit-justify-content: center;
    justify-content: center;
    text-transform: uppercase;
    width: 32.23%; /*390*/
}

.footer-btn.services {
    background: #004c95;
}

.footer-btn.contact {
    background: #194634;
}

.footer-btn.portfolio {
    background: #008145;
}

.footer-btn:hover {
    background: #949596;
    color: #fff;
}

/***Footer Copyrights***/

footer {
    background: #dbdcdd;
    margin-top: 90px;
    padding: 15px 0 20px;
}

footer .copyright {
    float: left;
    font-size: 1.125em; /*18/16*/
    margin: 0;
}

footer .social-media {
    float: right;
}

footer .btn-linkedin {
    background: url('svgs/icons.svg') no-repeat -24px 0;
    display: inline-block;
    height: 32px;
    text-indent: -999999px;
    width: 33px;
}

footer .btn-linkedin:hover {
    opacity: .7;
}

/***************************************************************************************************************************************************************************************/

/*HOME STYLES*/

/***************************************************************************************************************************************************************************************/

#hero {
    min-height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}

#hero .content {
    left: 50%;
    max-width: 1250px;
    padding: 0 20px;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%) translateX(-50%);
    transform: translateY(-50%) translateX(-50%);
    width: 100%;
}

#hero h1 {
    color: #fff;
    font-size: 4em; /*64/16*/
    letter-spacing: .5px;
    line-height: 1.055em; /*95/90*/
    margin: 0 0 48px;
    text-shadow: 0 0 15px rgba(5,44,91,.88);
    text-transform: uppercase;
}

/***************************************************************************************************************************************************************************************/

/*DEFAULT PAGE STYLES*/

/***************************************************************************************************************************************************************************************/

.alignleft { 
	float: left; 
	margin-right: 15px; 
}

.alignright { 
	float: right; 
	margin-left: 15px; 
}

.aligncenter,
.alignnone {
    display: block;
    margin: 0 auto 20px;
}

.wp-caption {
    max-width: 100%;
}

/***************************************************************************************************************************************************************************************/

/*ABOUT PAGE STYLES*/

/***************************************************************************************************************************************************************************************/

/***Main Content***/

article {
    padding: 70px 0 25px;
    text-align: center;
}

article .container {
    max-width: 1195px;
}

/***Circles Callout***/

.circles-callout {
    background: #ebedee;
    padding: 48px 0 55px;
}

.circles-callout h2 {
    color: #008145;
    font-size: 1.875em; /*40/16*/
    margin: 0 0 40px;
    text-align: center;
    text-transform: uppercase;
}

.circles-callout .flexbox-container {
    -webkit-align-items: flex-start;
    align-items: flex-start;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    justify-content: center;
}

.circles-callout .word {
    -webkit-align-items: center;
    align-items: center;
    background: #8ec549;
    border-radius: 200%;
    color: #fff;
    display: -webkit-flex;
    display: flex;
    font-size: 1em;
    font-weight: bold;
    height: 130px;
    -webkit-justify-content: center;
    justify-content: center;
    margin: 0 25px;
    text-transform: uppercase;
    width: 130px;
}

.circles-callout .seperator {
    -webkit-align-self: center;
    align-self: center;
    border-color: transparent transparent transparent #3fb34f; 
    border-style: solid; 
    border-width: 15px 25px;
    margin-right: -25px;
}

.circles-callout .seperator:last-of-type {
    display: none;
}

/***Accordions Content***/

.accordions-content {
    padding: 80px 0 0;
    text-align: center;
}

.accordions-content .container {
    max-width: 1220px;
}

.accordions-content p {
    color: #2e2e2e;
    font-size: 1.125em; /*18/16*/
    line-height: 1.388em; /*25/18*/
    margin: 0 0 64px;
}

.accordion {
    float: left;
    width: 100%;
}

.accordion h3 {
    background: #fbfbfb;
    border: 1px solid #cacaca;
    color: #193059;
    cursor: pointer;
    font-size: 1.375em; /*22/16*/
    font-weight: 500;
    margin: 0;
    padding: 27px 85px;
    position: relative;
    text-align: left;
    transition: all .5s ease;
}

.accordion h3:before {
    border-color: transparent transparent transparent #a7a9ac; 
    border-style: solid; 
    border-width: 15px;
    content: "";
    left: 32px;
    position: absolute;
    top: 29px;
    transition: all .5s ease;
}

.accordion h3:hover {
    color: #008145;
}

.accordion h3:hover::before {
    border-left-color: #008145;
}

.accordion.active h3 {
    background: #008145;
    color: #fff;
}

.accordion.active h3:before {
    border-left-color: transparent;
    border-top-color: #fff;
    top: 40px;
}

.accordion .content {
    display: none;
    padding: 30px 88px;
    text-align: left;
}

.accordion .content p {
    margin: 0;
}

/***************************************************************************************************************************************************************************************/

/*SERVICES PAGE STYLES*/

/***************************************************************************************************************************************************************************************/

.section-content-container {
    float: left;
    padding: 75px 0 0;
    width: 100%;
}

.content-section {
    border-bottom: 1px solid #9f9f9f;
    margin-bottom: 68px; 
    padding-bottom: 55px;
}

.content-section .content {
    float: left;
    width: 49.83%; /*603*/
}

.content-section .content p {
    font-size: 1.125em; /*18/16*/
    line-height: 1.388em; /*25/18*/
    margin: 0 0 30px;
}

.content-section .content p:last-child {
    margin: 0;
}

.content-section img {
    float: right;
    width: 46.52%; /*563*/
}

.content-section:nth-of-type(even) .content {
    float: right;
}

.content-section:nth-of-type(even) img {
    float: left;
}

/***************************************************************************************************************************************************************************************/

/*PORTFOLIO ARCHIVE STYLES*/

/***************************************************************************************************************************************************************************************/

.portfolio-listings {
    padding: 100px 0 0;
}

.portfolio-listings .listing-container {
    display: flex;
    display: -webkit-flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
}

.portfolio-listings h1 {
    text-align: center;
    width: 100%;
}

.portfolio-listings .listing {
    margin-bottom: 55px;
    text-align: center;
    width: 32.56%; /*394*/
}

.portfolio-listings .listing h2 {
    font-size: 1.25em; /*20/16*/
    margin: 20px 0 4px;
}

.portfolio-listings .listing span {
    color: #0b2f72;
    display: block;
    font-size: 1.25em; /*20/16*/
    margin-bottom: 10px;
}

.portfolio-listings .listing a {
	font-weight: bold;
	text-decoration: underline;
	text-transform: uppercase;
}

/***************************************************************************************************************************************************************************************/

/*PORTFOLIO SINGLE STYLES*/

/***************************************************************************************************************************************************************************************/

.portfolio-content {
	padding: 80px 0;
}

.portfolio-content h1 {
	font-size: 2.1875em; /*35/16*/
	letter-spacing: .25px;
	line-height: 1.142em; /*40/35*/
	margin: 0 0 45px;
	text-align: center;
	text-transform: uppercase;
}

/***Main Content***/

.portfolio-content article {
	float: left;
	padding: 0;
	text-align: left;
	width: 50.82%; /*615*/
}

.portfolio-content article p,
.portfolio-content article ul,
.portfolio-content article ol {
	font-size: 1em;
	line-height: 1.375em; /*22/16*/
	margin-bottom: 20px;
}

.portfolio-content article a {
	color: #0464fa;
	font-weight: bold;
	text-transform: uppercase;
}

.portfolio-content article a:after {
	display: inline-block;
	content: "\f0a9";
    font: normal  16px/1 FontAwesome;
    margin-left: 14px;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.portfolio-content article a:hover {
	color: #0b2f72;
}

.portfolio-content article h3 {
	font-size: 1em;
	margin: 0 0 5px;
}

.portfolio-content article ul,
.portfolio-content article ol {
	padding-left: 15px;
}

/***Gallery***/

.portfolio-content .image-gallery {
	/*-webkit-display: flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;*/
	/*-webkit-justify-content: space-between;
	justify-content: space-between;*/
	float: right;
	width: 46.61%; /*564*/

    /*flex-direction: column;*/
    /*height: 100vh;*/
}

.grid-sizer,
.grid-item { width: 48%; margin-bottom: 2%; }
.gutter-sizer { width: 2%; }

.portfolio-content .image-gallery img {
	/*-webkit-align-self: flex-start;
	align-self: flex-start;*/
	/*margin-bottom: 14px;*/
	/*width: 48.4%; */
    width: 100%;
}

.portfolio-content .image-gallery .size-large-portfolio {
	width: 100%;
}

/***************************************************************************************************************************************************************************************/

/*CONTACT PAGE STYLES*/

/***************************************************************************************************************************************************************************************/

/***Footer***/

.contact-form + .footer-btn-container {
    margin-top: 70px;
}

/***Main Content***/

.contact-content {
    padding-bottom: 0;
}

.contact-content .container,
.contact-form .container {
    max-width: 1222px;
}

.contact-content h1,
.portfolio-listings h1 {
    color: #0b2f72;
    font-size: 1.5em; /*24/16*/
    margin: 0 0 32px;
    text-transform: uppercase;
}

.contact-content p {
    font-size: 1.125em; /*18/16*/
}

/***Contact Form***/

.contact-form form {
    border-top: 1px solid #cbcbcb;
    border-bottom: 1px solid #cbcbcb;
    float: left;
    /*padding: 45px 0 10px; - Sagefrog 10/19/16*/
	padding: 0px 0 10px;
    width: 100%;
}

.contact-form .column {
    float: left;
    width: 48.98%; /*579*/
}

.contact-form .column + .column {
    float: right;
}

.contact-form .row {
    float: left;
    margin-bottom: 25px;
    width: 100%;
}

.contact-form input[type=text],
.contact-form input[type=email],
.contact-form textarea,
/*Gravity Forms Styles - Sagefrog 10/19/16*/
.gform_wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]),
.gform_wrapper textarea.medium {
    background: #ebebeb;
    border: none;
    color: #0b2f72;
    font: 1em 'proxima-nova', Arial, Helvetica, sans-serif;
    height: 43px;
    padding: 0 14px;
    width: 100%;
}
/*Gravity Forms Styles - Sagefrog 10/19/16*/
.gform_wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]){
	  padding: 0 14px !important;
}
.gform_wrapper input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]),
.gform_wrapper textarea.medium {
	font-size:16px !important;
}


.contact-form textarea,
.gform_wrapper textarea.medium {
    height: 250px;
    padding: 14px;
}

.contact-form ::-webkit-input-placeholder { 
	color: #83888c; 
}

.contact-form ::-moz-placeholder { 
	color: #83888c; 
	opacity: 1;
}

.contact-form :-ms-input-placeholder {
	color: #83888c; 
}

.contact-form input[type=submit],
.gform_wrapper .gform_footer input.button, 
.gform_wrapper .gform_footer input[type=image], 
.gform_wrapper .gform_footer input[type=submit]{
    border: none;
    background: #008145;
    color: #fff;
    font: 1.125em 'proxima-nova', Arial, Helvetica, sans-serif; /*18/16*/
    height: 34px;
    text-transform: uppercase;
    transition: all .5s ease;
    width: 117px;
}

@media only screen and (min-width: 641px){
	.gform_wrapper .gform_footer input.button, 
	.gform_wrapper .gform_footer input[type=submit], 
	.gform_wrapper .gform_page_footer input.button, 
	.gform_wrapper .gform_page_footer input[type=submit] {
		width: 117px !important;
	}
}

.contact-form input[type=submit]:hover,
.gform_wrapper .gform_footer input[type=submit]:hover {
    background: #004c95;
}

div.wpcf7-response-output {
    clear: both;
}

span.wpcf7-not-valid-tip {
    margin-top: 10px;
}


/***************************************************************************************************************************************************************************************/

/*MQ MAX-HEIGHT 800*/

/***************************************************************************************************************************************************************************************/

@media only screen and (max-height: 50em) {
    
    /*Homepage*/
    
    #hero .content {
        padding: 250px 20px 50px;
        position: static;
        -webkit-transform: none;
        transform: none;
    }
    
}


/***************************************************************************************************************************************************************************************/

/*MQ MAX-WIDTH 1200*/

/***************************************************************************************************************************************************************************************/

@media only screen and (max-width: 75em) {

    /*Nav*/
    
    header li {
        margin-left: 30px;
    }
    
    header li a {
        font-size: 1.1em;
    }
    
    /*Homepage*/
    
    #hero h1 {
        font-size: 4.5em;
    }

}

/***************************************************************************************************************************************************************************************/

/*MQ MAX-WIDTH 950*/

/***************************************************************************************************************************************************************************************/

@media only screen and (max-width: 59.375em) {
    
    /*Nav*/
    
    .mean-container .mean-bar {
        left: 0;
        position: absolute;
        top: 0;
    }
    
    .mean-container .mean-bar,
    .mean-container .mean-nav {
        background: none;
    }
    
    .mean-container .mean-nav {
        margin-top: 70px;
    }
    
    .mean-container a.meanmenu-reveal {
        right: 40px !important;
    }
    
    .mean-container .mean-nav > ul {
        background: #0b2f72;
        float: left;
    }
    
   .mean-bar .btn-linkedin {
        background-position: right top;
        background-size: 71px auto;
        height: 30px;
        position: absolute;
        right: 0;
        top: 10px;
        width: 30px;
    }
    
    .mean-container .mobile-logo {
        left: 20px;
        position: absolute;
        top: 10px;
    }
    
    .mean-container .mobile-logo img {
        height: 60px;
    }
    
    /*Header*/
    
    header {
        height: 78px;
        left: 0;
        padding: 0;
        position: absolute;
        top: 0;
    }
    
    header .container {
        position: static;
    }
    
    header .logo {
        display: none;
    }
    
    /*Footer*/
    
    .home .footer-btn-container,
    .home footer {
        bottom: 0;
        display: block;
        left: 0;
        position: absolute;
    }
    
    .footer-btn-container,
    footer {
        margin-top: 50px;
    }
    
    .footer-btn-container .container {
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
    }
    
    .footer-btn {
        flex: 1 1 auto;
        font-size: 1em;
        height: 60px;
        min-width: 180px;
        margin: auto;
    }
    
    /*Homepage*/
    
    #hero {
        position: static;
    }
    
    #hero .content {
        padding: 100px 20px 50px;
        position: static;
        -webkit-transform: none;
        transform: none;
    }
    
    #hero h1 {
        font-size: 3em;
    }
    
    /*About*/
    
    h2 {
        font-size: 1.4em;
    }
    
    article,
    .section-content-container {
        padding-top: 100px;
    }
    
    article p, 
    article ol, 
    article ul,
    .accordions-content p {
        font-size: 1em;
    }
    
    .circles-callout h2 {
        font-size: 1.8em;
    }
    
    .circles-callout .word {
        font-size: 1em;
        height: 100px;
        margin: 0 15px;
        width: 100px;
    }
    
    .circles-callout .seperator {
        border-width: 10px 15px;
        margin-right: -17px;
    }
    
    .accordion h3 {
        font-size: 1.4em;
    }
    
    .accordion .content {
        padding: 15px 0 20px;
    }
    
    /*Services*/
    
    .content-section img {
        display: block;
        float: none !important;
        margin: 0 auto 30px;
        width: auto;
    }
    
    .content-section .content {
        width: 100%;
    }
    
    .content-section .content p {
        font-size: 1em;
    }
    
    /*Portfolio*/
    
    .portfolio-listings .listing {
        margin-bottom: 30px;
        width: 45%;
    }

    .portfolio-listings .listing h2,
    .portfolio-listings .listing span {
        font-size: 1.2em;
    }
    
    /*Contact */
    
    .contact-content h1 {
        font-size: 1.5em;
    }
    
    .contact-content p {
        font-size: 1em;
    }
    
    .contact-form .column {
        width: 100%;
    }
    
    /*Portfolio Single*/
    
    .portfolio-content {
	    padding: 150px 0 0;
    }
    
    .portfolio-content h1 {
	    font-size: 1.8em;
    }
    
    .portfolio-content article,
    .portfolio-content .image-gallery {
	    width: 100%;
    }

}

/***************************************************************************************************************************************************************************************/

/*MQ MAX-WIDTH 500*/

/***************************************************************************************************************************************************************************************/

@media only screen and (max-width: 31.25em) {
    
    .btn {
        font-size: 1em;
        padding: 10px 10px;
    }
    
    .btn:after {
        margin-left: 20px;
    }
    
    /*Footer*/
    
    footer .copyright {
        font-size: .875em;
        margin-bottom: 15px;
        text-align: center;
        width: 100%;
    }
    
    footer .social-media {
        text-align: center;
        width: 100%;
    }
    
    /*Homepage*/
    
    #hero h1 {
        font-size: 2em;
    }
    
    /*About*/
    
    .circles-callout h2 {
        font-size: 1.5em;
    }
    
    .circles-callout .flexbox-container {
        -webkit-flex-direction: column;
        flex-direction: column;
    }
    
    .circles-callout .word {
        margin: auto;
    }
    
    .circles-callout .seperator {
        border-left-color: transparent;
        border-top-color: #3fb34f;
        border-width: 15px 10px;
        margin: 20px auto 0;
    }
    
    .accordion h3 {
        font-size: 1.2em;
        padding: 20px 40px;
    }
    
    .accordion h3:before {
        border-width: 10px;
        left: 15px;
        top: 20px;
    }
    
    .accordion.active h3:before {
        top: 27px;
    }
    
    /*Portfolio*/
    
    .portfolio-listings .listing {
        width: 100%;
    }
    
    /*Portfolio Single*/
    
    .portfolio-content h1 {
	    font-size: 1.5em;
    }
    
    .portfolio-content article,
    .portfolio-content .image-gallery {
	    width: 100%;
    }
}