
/*--------------------------------------------------------------
# Explicitly set styles within each breakpoint
--------------------------------------------------------------*/

/* Very small devices (legacy or browser manipulated) */
@media (max-width: 575px) {

	.MW001{display:inline;}
	.MW576{display:none;}
	.MW768{display:none;}
	.MW992{display:none;}
	.MW1200{display:none;}
	.MW1400{display:none;}
	
}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) and (max-width: 767px) {

	.MW001{display:none;}
	.MW576{display:inline;}
	.MW768{display:none;}
	.MW992{display:none;}
	.MW1200{display:none;}
	.MW1400{display:none;}
	
}

/*  Medium devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991px) {

	.MW001{display:none;}
	.MW576{display:none;}
	.MW768{display:inline;}
	.MW992{display:none;}
	.MW1200{display:none;}
	.MW1400{display:none;}
	
	main#main{
		_margin-top:200px;
	}

}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199px) {

	.MW001{display:none;}
	.MW576{display:none;}
	.MW768{display:none;}
	.MW992{display:inline;}
	.MW1200{display:none;}
	.MW1400{display:none;}
	
	main#main{
		_margin-top:200px;
		
	}

}

/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) and (max-width: 1399px) {

	.MW001{display:none;}
	.MW576{display:none;}
	.MW768{display:none;}
	.MW992{display:none;}
	.MW1200{display:inline;}
	.MW1400{display:none;}
	
	#header .logo{
	_margin-top:14px;
	}
	
	main#main{
		_margin-top:125px;
	}

}

/* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) {

	.MW001{display:none;}
	.MW576{display:none;}
	.MW768{display:none;}
	.MW992{display:none;}
	.MW1200{display:none;}
	.MW1400{display:inline;}
	
	main#main{
		_margin-top:230px;
		
	}

}

/*--------------------------------------------------------------
# Minimum styles within each breakpoint
--------------------------------------------------------------*/

/* Very small devices (legacy or browser manipulated) */
@media (min-width: 1px) {


	
}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {


	
}

/*  Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {



}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {


}

/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {



}

/* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) {



}



/*--------------------------------------------------------------
# Maximum styles within each breakpoint
--------------------------------------------------------------*/

/* Very small devices (legacy or browser manipulated) */
@media (max-width: 575px) {

	
}

/* Small devices (landscape phones, 576px and up) */
@media (max-width: 767px) {


	
}

/*  Medium devices (tablets, 768px and up) */
@media (max-width: 991px) {



}

/* Large devices (desktops, 992px and up) */
@media (max-width: 1199px) {


}

/* X-Large devices (large desktops, 1200px and up) */
@media (max-width: 1399px) {



}



/*--------------------------------------------------------------
# Navigation Menu
--------------------------------------------------------------*/





/*--------------------------------------------------------------
# General
--------------------------------------------------------------*/

body {
font-family: "Work Sans", sans-serif;
background-color:var(--primary-color);
}

a{
text-decoration: none;
}

a:hover {
text-decoration: underline;
}

.hidden{
display:none;
}

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

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

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

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

.clear{
clear:both;
}

#hero.no-banner{
height:115px;
}



/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/

#header {
background-color:var(--white-color);
_z-index: 997;
_padding: 20px 0px 0px 0px;
}

#header.header-scrolled {
_box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
_padding: 12px 0;
}

#header.header-inner-pages {
_box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
}

#header ._logo {
_font-size: 22px;
_margin: 0;
_padding: 0;
_line-height: 1;
_font-weight: 700;
}

#header .logo a {
_color:var(--primary-color);
}

#header {
_border-bottom:5px solid var(--secondary-color);
}


/*--------------------------------------------------------------
# Top (sits within header)
--------------------------------------------------------------*/

#top {
background-color:var(--primary-color);
color:var(--secondary-color);
text-align:right;
padding:5px 0px;
}

#top a {
color:var(--secondary-color);
text-decoration:none;
font-weight:normal;
font-size:0.8em;
}

#top a:hover {
color:var(--white-color);
transition: 0.3s;
}
