@charset "utf-8";
/* CSSreset --------------------------------------------------------------*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* Scrollbar */


/* ------------------------------CSS Stylesheet---------------------------------- */
::selection			{ background:#FEEEA7; color:#fff; /* Safari and Opera */ }
::-moz-selection  { background:#FEEEA7; color:#fff; /* Firefox */ }


::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-thumb {
    background: #2F3D54; 
}



a, a:active, a:focus {
    outline: none !important;
    border: none !important;
}


/* Typography */
@font-face {
    font-family: 'Gotham';
    src: url(font/gotham-medium.eot);
    src: url(font/gotham-medium.eot) format('embedded-opentype'),
	     url(font/gotham-medium.svg#GothamMedium) format('svg'),
         url(font/gotham-medium.woff) format('woff'),
         url(font/gotham-medium.ttf) format('truetype');      
}

@font-face {
    font-family: 'GothamBold';
    src: url(font/gotham-bold.eot);
    src: url(font/gotham-bold.eot) format('embedded-opentype'),
		 url(font/gotham-bold.svg#GothamBold) format('svg'),
         url(font/gotham-bold.woff) format('woff'),
         url(font/gotham-bold.ttf) format('truetype');
         
}


h1, h2, h4, a, input[type="submit"] {
	font-family: 'GothamBold', sans-serif;
}

li a, p, h3, h5, h4 a, p a, #logo, label, li, tr, td {
	font-family: 'Gotham', sans-serif !important;
}

h1, h2, h3, h4, h5, input[type="submit"] {
	margin: 0;
}

a {
    color: #F2EFE9;
}

a, input[type="submit"] {
	text-decoration: none;
	opacity: 1;
	-webkit-transition: opacity 0.2s ease-in; /*safari and chrome */
	-moz-transition: opacity 0.2s ease-in; /* firefox */
 	-o-transition: opacity 0.2s ease-in; /* opera */
 	transiton: opacity 0.2s ease-in;
}

a:hover, input[type="submit"]:hover {
	opacity: 0.7;
}

input[type="submit"] {
    cursor: pointer;
}

.red {
	color: #F28374;
}

/* Layout */
.nav-bar {
	background: #2c3749;
}

.main-content {
	background: #364359;

}

.add-bar {
	background: #404f69;
}

.inline {
	display: inline;
}

ul {
	padding-top: 0 !important;
}




/* Nav Bar */
.icon-twitter {
	margin-left: -5px;
	vertical-align: middle;
}

.icon-facebook, .icon-twitter {
	margin-right: 1vw;
}

.nav-bar .row .columns h1, .add-bar .row .columns h1 {
	color: #F2EFE9;
}

#nav li {
    display: block;
    vertical-align: top;
}

    

/* Main Content */
li {
	list-style-type: none;
}

.main-content .row .columns h1 {
	margin-left: -1px;
}

.active {
    color: yellow !important;
    background-color: green !important;
}

@media (min-width: 1300px) {
	/* Typography */
	.title {
		font-size: 1.55rem;
	}
	
    nav a {
        font-size: 0.9rem;
    }
    
	p a {
		font-size: 0.7rem;
	}
    

	a {
		font-size: 0.8rem;
		line-height: 125%;
	}
	
	h3 {
		font-size: 1.1rem;
	}
	
	h5 {
		font-size: 0.8rem;
	}
		
	/* Layout */
	.nav-bar {
		height: 100vh;
	}
	
	.add-bar {
		height: 100vh;
		overflow-y: scroll;
	}
	
	.main-content {
		height: 100vh;
		overflow-y: scroll;
	}
    
    #blogs-news, #inspiration, #learning, #tutorials, #snippets, #plugins, #architecture, #tools, #resources, #community {
        margin-top: 115px;
    }
	
	.top-pad {
		padding-top: 4.4vh;
	}
	
	.top-pad-half {
		padding-top: 2.2vh;
	}
	
	.top-pad-quarter {
		padding-top: 1.1vh !important;
	}
	
	.lr-pad {
		padding: 0 1vw;
	}
	
	.l-pad {
		padding-left: 1vw;
	}
	
	.r-pad {
		padding-right: 1vw;
	}
	
	/* Nav Bar */
    nav li {
        line-height: 1.8;
        padding-top: 0.3vh;
    }
    
	.social-icons-pad {
		padding-top: 1vh;
		padding-bottom: 6vh;
	}
	
	.nav-link {
		padding: 1vh 0;
	}
    
    .button-wrap {
        position: fixed;
        bottom: 0;
        margin-left: 3vw;
        margin-bottom: 1.7vh;
    }
	
	.submit-button {
		background: #61C291;
        padding: 5px 8px;
        display: inline;
	}
	
	.submit-button:hover, .info-button:hover {
		opacity: 0.9;
	}
    
    .info-button {
		background: #7CB0CC;
        padding: 5px 7px;
        display: inline;
	}
    
	/* Add Bar */
	.add-bar .row .columns .title {
		padding-bottom: 1.9vh;
	}	
    
    .additions-container li {
        padding-bottom: 2.2vh;
    }
    
    .additions-container li>a {
        font-size: 0.9rem;
        padding-top: 1vh;
    }
    
    .additions-container li h5{
        padding-left: 0 !important;
        padding-top: 0.5vh;
    }
	
	/* Main Content */
	li {
		padding-left: 0;
		padding-bottom: 0.6vh;
	}
	
	ul ul li, ul li h5 {
		padding-left: 1vh !important;
	}
    
    .small-6.large-3.columns.top-pad-half {
        margin-bottom: 1.5vh;
    }
    
    /* Modals */
    #submit-form {
        width: 33vw;
        height: auto;
        margin: -150px 33vw;
        padding: 12px 30px 25px;
        text-align: left;
        background: #4a5b79;
        color: #F2EFE9;
    }
    

    #submit-form input[type=submit] {
        background: #61C291;
        border: 0;
        outline: 0;
        color: #F2EFE9;
        padding: 5px 8px;
        margin: 20px 0 0;
    }
    
    #submit-form fieldset {
        margin-left: 0;
        padding-left: 0;
    }

    p {
        color: #F2EFE9;
        font-size: 0.9em;
        line-height: 120%;
        margin: 10px 0 16px;
    }
    
    #info-modal li {
        padding: 0 0 14px 14px;
        color: #F2EFE9;
        font-size: 0.9em;
    }
    
    #info-modal {
        width: 33vw;
        height: auto;
        margin: -38vh 33.1vw;
        padding: 12px 30px 25px;
        text-align: left;
        background: #4a5b79;
    }

    #cryptocoin-modal {
        width: 28vw;
        height: auto;
        margin: -22vh 35.2vw;
        padding: 12px 30px 12px;
        text-align: left;
        background: #4a5b79;
    }

    
    .flattr-button, .cryptocoin-button {
        padding: 5px 8px;
    }
    
    .paypal-form-wrap {
        display: inline;
    }


    .paypal-button{
        background: #3b7bbf;
        color: #F2EFE9;
        border: none;
        font-size: 0.8rem;
        padding: 5px 7px;
    }
    
    .flattr-button{
        background: #e6a423;
    }

    .cryptocoin-button {
        background: #61C291;
    }
}


@media (min-width: 960px) and (max-width: 1299px) {
	/* Typography */
	.title {
		font-size: 1.1rem;
	}
	
    nav a {
        font-size: 1rem;
    }
    
	p a {
		font-size: 0.7rem;
	}
	
	a {
		font-size: 0.9rem;
		line-height: 120%;
	}
	
	h3 {
		font-size: 1.1rem;
	}
	
	h5 {
		font-size: 0.8rem;
	}
		
	/* Layout */
	.nav-bar {
		height: 100vh;
	}
	
	.add-bar {
		height: 100vh;
		overflow-y: scroll;
	}
	
	.main-content {
		height: 100vh;
		overflow-y: scroll;
	}
	
	.top-pad {
		padding-top: 4.8vh;
	}
	
	.top-pad-half {
		padding-top: 2.4vh;
	}
	
	.top-pad-quarter {
		padding-top: 1.2vh !important;
	}
	
	.lr-pad {
		padding: 0 1.3vw;
	}
	
	.l-pad {
		padding-left: 1.3vw;
	}
	
	.r-pad {
		padding-right: 1.3vw;
	}
	
	/* Nav Bar */
    nav li {
        line-height: 1.8;
        padding-top: 0.3vh;
    }
    
	.social-icons-pad {
		padding-top: 1.5vh;
		padding-bottom: 7vh;
	}
	
	.nav-link {
		padding: 1vh 0;
	}
    
    .button-wrap {
        position: fixed;
        bottom: 0;
        left: 2vw;
        margin-bottom: 1.2vh;
    }
	
	.submit-button {
		background: #61C291;
        width: 100%;
        padding: 8px 10px;
        margin-bottom: 5px;
        display: block;
	}
	
	.submit-button:hover, .info-button:hover {
		opacity: 0.9;
	}
    
    .info-button {
		background: #7CB0CC;
        padding: 8px 11px;
        width: 100%;
        display: block;
	}
    
	/* Add Bar */
	.add-bar .row .columns .title {
		padding-bottom: 2vh;
	}	
    
    .additions-container li {
        padding-bottom: 2.5vh;
    }
    
    .additions-container li>a {
        font-size: 0.8rem;
        padding-top: 1vh;
    }
    
    .additions-container li h5{
        padding-left: 0 !important;
        padding-top: 0.2vh;
    }
	
	/* Main Content */
	li {
		padding-left: 0;
		padding-bottom: 0.6vh;
	}
	
	ul ul li, ul li h5 {
		padding-left: 1vh !important;
	}
    
    .small-6.large-3.columns.top-pad-half {
        margin-bottom: 2.8vh;
    }
    
    /* Modals */
   #submit-form {
        width: 33vw;
        height: auto;
        margin: -150px 33vw;
        padding: 12px 30px 25px;
        text-align: left;
        background: #4a5b79;
        color: #F2EFE9;
    }
    

    #submit-form input[type=submit] {
        background: #61C291;
        border: 0;
        outline: 0;
        color: #F2EFE9;
        padding: 5px 8px;
        margin: 20px 0 0;
    }
    
    #submit-form fieldset {
        margin-left: 0;
        padding-left: 0;
    }

    
    #info-modal li {
        padding: 0 0 14px 14px;
        color: #F2EFE9;
        font-size: 0.9em;
    }
    
    p {
        color: #F2EFE9;
        font-size: 0.9em;
        margin: 19px 0;
    }
    
     #info-modal {
        width: 70vw;
        height: auto;
        margin: -40vh 15vw;
        padding: 12px 30px 25px;
        text-align: left;
        background: #4a5b79;
    }

    #cryptocoin-modal {
        width: 48vw;
        height: auto;
        margin: -20vh 26vw;
        padding: 12px 30px 12px;
        text-align: left;
        background: #4a5b79;
    }

    .flattr-button, .cryptocoin-button {
        padding: 10px 12px;
        display: block;
    }

    .flattr-button {
        background: #e6a423;
        margin-top: 10px;
    }

    .paypal-form-wrap {
        margin-top: 10px;
    }

    .paypal-button{
        background: #3b7bbf;
        color: #F2EFE9;
        border: none;
        padding: 10px 12px;
        width: 100%;
        text-align: left;
    }

    .cryptocoin-button {
        background: #61C291;
    }
}	




@media (min-width: 360px) and (max-width: 959px) {
    	/* Typography */
	.title {
		font-size: 1.6rem;
	}
    
    .main-content .title {
        padding-top: 70px !important;
        padding-bottom: 15px;
        text-align: center;
    }
	
	p {
		font-size: 1rem !important;
	}
	
	p a {
		font-size: 1rem;
	}
	
	a {
		font-size: 1rem;
		line-height: 135%;
	}
	
	h3 {
		font-size: 1.2rem;
	}
	
	h5 {
		font-size: 1rem;
	}
	
	/* Layout */
    .add-bar {
        height: 250px;
        width: 100%;
	}
    
    .additions-container {
        width: 100%;
        overflow-x: scroll;
        overflow-y: hidden;
        white-space: nowrap;
    }
    
    .top-pad {
		padding-top: 30px;
	}
	
	.top-pad-half {
		padding-top: 15px;
	}
	
	.top-pad-quarter {
		padding-top: 8px !important;
	}
	
	.lr-pad {
		padding-left: 12px;
		padding-right: 12px;
	}
	
	.l-pad {
		padding-left: 12px;
	}
	
	.r-pad {
		padding-right: 12px;
	}
	
	.social-icons-pad {
		padding-top: 16px;
        text-align: center;
    }
    
    .icon-facebook {
        padding-right: 18px !important;
    }
    
    .icon-github {
        padding-left: 16px !important;
    }
    
    /* Nav-Bar */
    .button-wrap {
        padding-top: 25px;
        padding-bottom: 35px;
        text-align: center;
    }
    
    .submit-button {
		background: #8AD19D;
        padding: 5px 5px;
        display: inline;
	}
	
	.submit-button:hover, .info-button:hover {
		opacity: 0.9;
	}
    
    .info-button {
		background: #80ADBD;
        padding: 5px 5px;
        display: inline;
	}
    
    nav div a{  
        display: block;  
        float: none;  
        width: 100%;  
    }
    
    #logo {
        text-align: center;
        margin-top: 31px;
        font-size: 1.5rem;
    }
    
    /* Main Content */
	li {
		padding-left: 0;
		padding-bottom: 8px;
	}
    
    .small-6.large-3.columns.top-pad-half {
        margin-bottom: 12px;
    }
    
    .main-content .title {
        padding: 20px 0;
    }
    
    .main-content .small-6 {
        padding-left: 4% !important;
    }
    

    
    /* Add Bar */
    .additions-container li {
        display: inline-block !important;
        width: auto;
        height: auto;
        padding-top: 12px;
        margin-left: 16px !important;
        margin-right: 45px;
        white-space: normal;
    }

    .additions-container li h5 {
        padding-left: 0 !important;
        padding-top: 4px;
    }
    
    .add-bar .title {
        margin-left: 5px !important;
        padding-top: 5px;
        padding-bottom: 5px;
        text-align: center;
    }
    
    .add-bar li>a {
        font-size: 1rem;
    }
    
    /* Modals */
    #submit-form {
        width: 70%;
        height: auto;
        margin: -150px 15%;
        padding: 12px 30px 25px;
        text-align: left;
        background: #4a5b79;
        color: #F2EFE9;
    }

    input[type="text"] {
        width: 150%;
    }
    

    #submit-form input[type=submit] {
        background: #61C291;
        border: 0;
        outline: 0;
        color: #F2EFE9;
        padding: 5px 8px;
        margin: 20px 0 0;
    }
    
    #submit-form fieldset {
        margin-top: 10px;
        margin-left: 0;
        padding-left: 0;
    }
    
    p {
        color: #F2EFE9;
        font-size: 0.8em;
        margin: 19px 0;
    }
    
    #info-modal li {
        padding: 0 0 14px 14px;
        color: #F2EFE9;
        font-size: 1em;
    }
    
     #info-modal {
        width: 90%;
        height: auto;
        margin: -240px 5%;
        padding: 12px 30px 25px;
        text-align: left;
        background: #4a5b79;
    }

    #cryptocoin-modal {
        width: 70%;
        height: auto;
        margin: -150px 15%;
        padding: 12px 30px 12px;
        text-align: left;
        background: #4a5b79;
    }
    
    .flattr-button, .cryptocoin-button {
        padding: 10px 12px;
        display: block;
    }
    
    .flattr-button{
        background: #e6a423;
        margin-top: 10px;
    }

    .paypal-form-wrap {
        margin-top: 10px;
    }

    .paypal-button{
        background: #3b7bbf;
        color: #F2EFE9;
        border: none;
        padding: 11px 12px;
        font-size: 1rem;
        width: 100%;
        text-align: left;
    }

    .cryptocoin-button {
        background: #61C291;
    }
}

@media (max-width: 359px) {
    	/* Typography */
	.title {
		font-size: 1.6rem;
	}
    
    .main-content .title {
        padding-top: 70px !important;
        padding-bottom: 10px;
        text-align: center;
    }
	
	p {
		font-size: 1rem !important;
	}
	
	p a {
		font-size: 1rem;
	}
	
	a {
		font-size: 1rem;
		line-height: 130%;
	}
	
	h3 {
		font-size: 1.2rem;
	}
	
	h5 {
		font-size: 1rem;
	}
	
	/* Layout */
    .add-bar {
        height: 240px;
        width: 100%;
	}
    
    .additions-container {
        width: 100%;
        overflow-x: scroll;
        overflow-y: hidden;
        white-space: nowrap;
    }
    
    .top-pad {
		padding-top: 30px;
	}
	
	.top-pad-half {
		padding-top: 15px;
	}
	
	.top-pad-quarter {
		padding-top: 8px !important;
	}
	
	.lr-pad {
		padding-left: 8px;
		padding-right: 8px;
	}
	
	.l-pad {
		padding-left: 8px;
	}
	
	.r-pad {
		padding-right: 8px;
	}
	
	.social-icons-pad {
		padding-top: 15px;
        text-align: center;
    }
    
    .icon-facebook {
        padding-right: 14px !important;
    }
    
    .icon-github {
        padding-left: 14px !important;
    }
    
    /* Nav-Bar */
    .button-wrap {
        padding-top: 25px;
        padding-bottom: 30px;
        text-align: center;
    }
    
    .submit-button {
		background: #8AD19D;
        padding: 5px 5px;
        display: inline;
	}
	
	.submit-button:hover, .info-button:hover {
		opacity: 0.9;
	}
    
    .info-button {
		background: #80ADBD;
        padding: 5px 5px;
        display: inline;
	}
    
    nav div a{  
        display: block;  
        float: none;  
        width: 100%;  
    }
    
    #logo {
        text-align: center;
        margin-top: 31px;
        font-size: 1.5rem;
    }
    
    /* Main Content */
	li {
		padding-left: 0;
		padding-bottom: 5px;
	}
    
    .small-6.large-3.columns.top-pad-half {
        margin-bottom: 8px;
    }
    
    .main-content .title {
        padding: 30px 0;
    }
    
    .main-content .small-6 {
        padding-left: 12px !important;
    }
    

    
    /* Add Bar */
    .additions-container li {
        display: inline-block !important;
        width: auto;
        height: auto;
        margin-left: 8px;
        margin-right: 45px;
        padding-bottom: 10px;
        white-space: normal;
    }

    .additions-container li h5 {
        padding-left: 0 !important;
    }
    
    .add-bar .title {
        padding-top: 10px;
        padding-bottom: 2px;
        text-align: center;
    }
    
    .add-bar li>a {
        font-size: 1rem;
    }
    
    /* Modals */
    #submit-form {
        width: 90%;
        height: auto;
        margin: -150px 5%;
        padding: 12px 20px 25px;
        text-align: left;
        background: #4a5b79;
        color: #F2EFE9;
    }

    input[type="text"] {
        width: 100%;
    }
    

    #submit-form input[type=submit] {
        background: #61C291;
        border: 0;
        outline: 0;
        color: #F2EFE9;
        padding: 5px 8px;
        margin: 20px 0 0;
    }
    
    #submit-form fieldset {
        margin-top: 10px;
        margin-left: 0;
        padding-left: 0;
    }
    
    p {
        color: #F2EFE9;
        font-size: 0.8em;
        margin: 19px 0;
    }
    
    #info-modal li {
        padding: 0 0 14px 14px;
        color: #F2EFE9;
        font-size: 1em;
    }
    
     #info-modal {
        width: 90%;
        height: auto;
        margin: -200px 5%;
        padding: 12px 30px 25px;
        text-align: left;
        background: #4a5b79;
    }

    #cryptocoin-modal {
        width: 90%;
        height: auto;
        margin: -150px 5%;
        word-wrap: break-word;
        padding: 12px 30px 12px;
        text-align: left;
        background: #4a5b79;
    }
    
    .flattr-button, .cryptocoin-button {
        padding: 10px 12px;
        display: block;
    }
    
    .flattr-button{
        background: #e6a423;
        margin-top: 10px;
    }

    .paypal-form-wrap {
        margin-top: 10px;
    }

    .paypal-button{
        background: #3b7bbf;
        color: #F2EFE9;
        border: none;
        padding: 11px 12px;
        font-size: 1rem;
        width: 100%;
        text-align: left;
    }

    .cryptocoin-button {
        background: #61C291;
    }
}


/*Took out a } */
/* responsive nav */

/* hide the link until viewport size is reached */
a.meanmenu-reveal {
	display: none;
}

/* when under viewport size, .mean-container is added to body */
.mean-container .mean-bar {
	float: left;
	width: 100%;
	position: fixed;
	background: #2c3749;
	padding: 4px 0;
	min-height: 42px;
	z-index: 999999;
}

.mean-container a.meanmenu-reveal {
	width: 18px;
	height: 18px;
	padding: 14px 10px 8px 10px;
	position: absolute;
	top: 0;
	right: 0;
	cursor: pointer;
	color: #fff;
	text-decoration: none;
	font-size: 12px;
	text-indent: -9999em;
	line-height: 18px;
	font-size: 1px;
	display: block;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: 700;
}

.mean-container a.meanmenu-reveal span {
	display: block;
	background: #fff;
	height: 3px;
	margin-top: 3px;
}

.mean-container .mean-nav {
	float: left;
	width: 100%;
	background: #2c3749;
	margin-top: 33px;
}

.mean-container .mean-nav ul {
	padding: 0;
	margin: 0;
	width: 100%;
	list-style-type: none;
}

.mean-container .mean-nav ul li {
	position: relative;
	float: left;
	width: 100%;
}

.mean-container .mean-nav ul li a {
	display: block;
	float: left;
	width: 100%;
	padding: 1em 2%;
	margin: 0;
	text-align: left;
	color: #fff;
	text-decoration: none;
	text-transform: uppercase;
}

.mean-container .mean-nav ul li li a {
	width: 80%;
	padding: 1em 10%;
	opacity: 0.75;
	filter: alpha(opacity=75);
	text-shadow: none !important;
	visibility: visible;
}

.mean-container .mean-nav ul li.mean-last a {
	border-bottom: none;
	margin-bottom: 0;
}

.mean-container .mean-nav ul li li li a {
	width: 70%;
}

.mean-container .mean-nav ul li li li li a {
	width: 60%;
}

.mean-container .mean-nav ul li li li li li a {
	width: 50%;
	padding: 1em 25%;
}

.mean-container .mean-nav ul li a:hover {
	background: #252525;
	background: rgba(255,255,255,0.1);
}

.mean-container .mean-nav ul li a.mean-expand {
	width: 26px;
	height: 26px;
	border: none !important;
	padding: 12px !important;
	text-align: center;
	position: absolute;
	right: 0;
	top: 0;
	z-index: 2;
	font-weight: 700;
}

.mean-container .mean-nav ul li a.mean-expand:hover {
	background: none;
}

.mean-container .mean-push {
	float: left;
	width: 100%;
	padding: 0;
	margin: 0;
	clear: both;
}

.mean-nav .wrapper {
	width: 100%;
	padding: 0;
	margin: 0;
}

/* Fix for box sizing on Foundation Framework etc. */
.mean-container .mean-bar, .mean-container .mean-bar * {
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
}


/* Modals */


/* Icon Font */

@font-face {
  font-family: 'fontello';
  src: url('font/fontello.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}
/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */
/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */
/*
@media screen and (-webkit-min-device-pixel-ratio:0) {
  @font-face {
    font-family: 'fontello';
    src: url('../font/fontello.svg?33275173#fontello') format('svg');
  }
}
*/
 
 [class^="icon-"]:before, [class*=" icon-"]:before {
  font-family: "fontello";
  font-style: normal;
  font-weight: normal;
  speak: none;
 
  display: inline-block;
  text-decoration: inherit;
  width: 0.5em;

  text-align: center;
  /* opacity: .8; */
 
  /* For safety - reset parent styles, that can break glyph codes*/
  font-variant: normal;
  text-transform: none;
     
  /* fix buttons height, for twitter bootstrap */
  line-height: 1em;
 
  /* Animation center compensation - magrins should be symmetric */
  /* remove if not needed */
 
  /* you can be more comfortable with increased icons size */
  /* font-size: 120%; */
 
  /* Uncomment for 3D effect */
  /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}
 
.icon-facebook:before { content: '\f052'; } /* '' */
.icon-github:before { content: '\f055'; } /* '' */
.icon-twitter:before { content: '\f058'; } /* '' */


/* foundation.css --------------------------------------------------------------------------*/

*,
*:before,
*:after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

html,
body {
  font-size: 100%; }

body {
  background: white;
  color: #222222;
  padding: 0;
  margin: 0;
  font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
  font-weight: normal;
  font-style: normal;
  line-height: 1;
  position: relative;
  cursor: default; }

a:hover {
  cursor: pointer; }

a:focus {
  outline: none; }

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

object,
embed {
  height: 100%; }

img {
  -ms-interpolation-mode: bicubic; }

#map_canvas img,
#map_canvas embed,
#map_canvas object,
.map_canvas img,
.map_canvas embed,
.map_canvas object {
  max-width: none !important; }

.left {
  float: left !important; }

.right {
  float: right !important; }

.text-left {
  text-align: left !important; }

.text-right {
  text-align: right !important; }

.text-center {
  text-align: center !important; }

.text-justify {
  text-align: justify !important; }

.hide {
  display: none; }
  
 .antialiased {
  -webkit-font-smoothing: antialiased; }


img {
  display: inline-block;
  vertical-align: middle; }

textarea {
  height: auto;
  min-height: 50px; }

select {
  width: 100%; }

/* Grid HTML Classes */
.row {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  margin-top: 0;
  margin-bottom: 0;
  max-width: 100%;
  *zoom: 1; }
  .row:before, .row:after {
    content: " ";
    display: table; }
  .row:after {
    clear: both; }
  .row.collapse .column,
  .row.collapse .columns {
    position: relative;
    padding-left: 0;
    padding-right: 0;
    float: left; }
  .row .row {
    width: auto;
    margin-left: 0em;
    margin-right: 0em;
    margin-top: 0;
    margin-bottom: 0;
    max-width: none;
    *zoom: 1; }
    .row .row:before, .row .row:after {
      content: " ";
      display: table; }
    .row .row:after {
      clear: both; }
    .row .row.collapse {
      width: auto;
      margin: 0;
      max-width: none;
      *zoom: 1; }
      .row .row.collapse:before, .row .row.collapse:after {
        content: " ";
        display: table; }
      .row .row.collapse:after {
        clear: both; }

.column,
.columns {
  position: relative;
  padding-left: 0em;
  padding-right: 0em;
  width: 100%;
  float: left; }

@media only screen {
  .column,
  .columns {
    position: relative;
    padding-left: 0em;
    padding-right: 0em;
    float: left; }

  .small-1 {
    position: relative;
    width: 8.33333%; }

  .small-2 {
    position: relative;
    width: 16.66667%; }

  .small-3 {
    position: relative;
    width: 25%; }

  .small-4 {
    position: relative;
    width: 33.33333%; }

  .small-5 {
    position: relative;
    width: 41.66667%; }

  .small-6 {
    position: relative;
    width: 50%; }

  .small-7 {
    position: relative;
    width: 58.33333%; }

  .small-8 {
    position: relative;
    width: 66.66667%; }

  .small-9 {
    position: relative;
    width: 75%; }

  .small-10 {
    position: relative;
    width: 83.33333%; }

  .small-11 {
    position: relative;
    width: 91.66667%; }

  .small-12 {
    position: relative;
    width: 100%; }

  .small-offset-0 {
    position: relative;
    margin-left: 0%; }

  .small-offset-1 {
    position: relative;
    margin-left: 8.33333%; }

  .small-offset-2 {
    position: relative;
    margin-left: 16.66667%; }

  .small-offset-3 {
    position: relative;
    margin-left: 25%; }

  .small-offset-4 {
    position: relative;
    margin-left: 33.33333%; }

  .small-offset-5 {
    position: relative;
    margin-left: 41.66667%; }

  .small-offset-6 {
    position: relative;
    margin-left: 50%; }

  .small-offset-7 {
    position: relative;
    margin-left: 58.33333%; }

  .small-offset-8 {
    position: relative;
    margin-left: 66.66667%; }

  .small-offset-9 {
    position: relative;
    margin-left: 75%; }

  .small-offset-10 {
    position: relative;
    margin-left: 83.33333%; }

  /* [class*="column"] + [class*="column"]:last-child {
    float: right; } */

  [class*="column"] + [class*="column"].end {
    float: left; }

  .column.small-centered,
  .columns.small-centered {
    position: relative;
    margin-left: auto;
    margin-right: auto;
    float: none !important; } }
/* Styles for screens that are atleast 960px; */
@media only screen and (min-width: 960px) {
  .large-1 {
    position: relative;
    width: 8.33333%; }

  .large-2 {
    position: relative;
    width: 16.66667%; }

  .large-3 {
    position: relative;
    width: 25%; }

  .large-4 {
    position: relative;
    width: 33.33333%; }

  .large-5 {
    position: relative;
    width: 41.66667%; }

  .large-6 {
    position: relative;
    width: 50%; }

  .large-7 {
    position: relative;
    width: 58.33333%; }

  .large-8 {
    position: relative;
    width: 66.66667%; }

  .large-9 {
    position: relative;
    width: 75%; }

  .large-10 {
    position: relative;
    width: 83.33333%; }

  .large-11 {
    position: relative;
    width: 91.66667%; }

  .large-12 {
    position: relative;
    width: 100%; }

  .row .large-offset-0 {
    position: relative;
    margin-left: 0%; }

  .row .large-offset-1 {
    position: relative;
    margin-left: 8.33333%; }

  .row .large-offset-2 {
    position: relative;
    margin-left: 16.66667%; }

  .row .large-offset-3 {
    position: relative;
    margin-left: 25%; }

  .row .large-offset-4 {
    position: relative;
    margin-left: 33.33333%; }

  .row .large-offset-5 {
    position: relative;
    margin-left: 41.66667%; }

  .row .large-offset-6 {
    position: relative;
    margin-left: 50%; }

  .row .large-offset-7 {
    position: relative;
    margin-left: 58.33333%; }

  .row .large-offset-8 {
    position: relative;
    margin-left: 66.66667%; }

  .row .large-offset-9 {
    position: relative;
    margin-left: 75%; }

  .row .large-offset-10 {
    position: relative;
    margin-left: 83.33333%; }

  .row .large-offset-11 {
    position: relative;
    margin-left: 91.66667%; }

  .push-1 {
    position: relative;
    left: 8.33333%;
    right: auto; }

  .pull-1 {
    position: relative;
    right: 8.33333%;
    left: auto; }

  .push-2 {
    position: relative;
    left: 16.66667%;
    right: auto; }

  .pull-2 {
    position: relative;
    right: 16.66667%;
    left: auto; }

  .push-3 {
    position: relative;
    left: 25%;
    right: auto; }

  .pull-3 {
    position: relative;
    right: 25%;
    left: auto; }

  .push-4 {
    position: relative;
    left: 33.33333%;
    right: auto; }

  .pull-4 {
    position: relative;
    right: 33.33333%;
    left: auto; }

  .push-5 {
    position: relative;
    left: 41.66667%;
    right: auto; }

  .pull-5 {
    position: relative;
    right: 41.66667%;
    left: auto; }

  .push-6 {
    position: relative;
    left: 50%;
    right: auto; }

  .pull-6 {
    position: relative;
    right: 50%;
    left: auto; }

  .push-7 {
    position: relative;
    left: 58.33333%;
    right: auto; }

  .pull-7 {
    position: relative;
    right: 58.33333%;
    left: auto; }

  .push-8 {
    position: relative;
    left: 66.66667%;
    right: auto; }

  .pull-8 {
    position: relative;
    right: 66.66667%;
    left: auto; }

  .push-9 {
    position: relative;
    left: 75%;
    right: auto; }

  .pull-9 {
    position: relative;
    right: 75%;
    left: auto; }

  .push-10 {
    position: relative;
    left: 83.33333%;
    right: auto; }

  .pull-10 {
    position: relative;
    right: 83.33333%;
    left: auto; }

  .push-11 {
    position: relative;
    left: 91.66667%;
    right: auto; }

  .pull-11 {
    position: relative;
    right: 91.66667%;
    left: auto; }

  .column.large-centered,
  .columns.large-centered {
    position: relative;
    margin-left: auto;
    margin-right: auto;
    float: none !important; }

  .column.large-uncentered,
  .columns.large-uncentered {
    margin-left: 0;
    margin-right: 0;
    float: left !important; }

  .column.large-uncentered.opposite,
  .columns.large-uncentered.opposite {
    float: right !important; } }