/*
Theme Name: HaleyBrookCamps
Theme URI: http://wordpress.org/
Description: Theme par Dix-Onze inc.
Author: Dix-Onze inc.
Version: 5.0

strppd.css by Iain MacDonald(http://iainspad.com/strppd-css/)

Based on the Meyer Reset by MeyerWeb (http://meyerweb.com/eric/tools/css/reset/)
This is a modified version with additional resetting such as setting certain elements to certain properties, as they should.
This also carries some resets for HTML5 elements i.e. the ':required' pseudo-selector, as well as resetting for mobile browsers.
Also included is some typographical styling, just to set them to their respective type styles.
Finally, there's also form and interactive element styling so forms and navigation elements look clickable.

Be sure to contribute any improvements and changes to this reset as you see fit. Have fun!

v. 1.0
License: Public Domain

*/
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, main {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	font-weight: inherit;
	font-style: inherit;
	font-family: inherit;
	vertical-align: baseline;
}

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section, summary, main {
	display: block;
}

/*---Universal Selector to add additional resets, such as text-size adjust and tap highlighting---*/

* {
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	-webkit-font-smoothing: antialiased;
}

a {
	text-decoration: none;
}


ol, ul {list-style-type: none;}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

caption, th, td {
  text-align: left;
  font-weight: normal;
}

/*---Additional Form resets---*/

button, input[type="button"] {
	background: none;
}

:required {
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	-o-box-shadow: none;
	-ms-box-shadow: none;
	box-shadow: none;
}

/*---Typographic Styling---*/

em, i {
	font-style: italic;
}

strong, b {
	font-weight: bold;
}

u {
	text-decoration: underline;
}

pre, code {
	font-family: Monaco, Courier, monospace;
}

pre {
	white-space: pre;
	white-space: pre-wrap;
	white-space: pre-line;
	word-wrap: break-word;
}

blockquote, q {
	quotes: "" "";
}

blockquote:before, blockquote:after, q:before,  q:after {
	content: "";
}

/*---Interactive Element Settings---*/

a, input[type="submit"], input[type="button"], button, label[for] {
	cursor: pointer;
}

/*---Misc. Element Styling---*/

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

/* End strppd.css */

/* Custom fonts */
/*
@font-face {
    font-family: 'ModernPictogramsNormal';
    src: url('fonts/modernpictograms/modernpics-webfont.eot');
    src: url('fonts/modernpictograms/modernpics-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/modernpictograms/modernpics-webfont.woff') format('woff'),
         url('fonts/modernpictograms/modernpics-webfont.ttf') format('truetype'),
         url('fonts/modernpictograms/modernpics-webfont.svg#ModernPictogramsNormal') format('svg');
    font-weight: normal;
    font-style: normal; }
*/

/* Proper box model */
* { }

/* General styles */

html {
	font-family: 'Raleway', sans-serif;
    font-weight: 500;
	font-size: 14px;
	line-height: 22px;
}

body {
}

a {
	color: #b9491b;
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	transition: all .3s;
}

a:hover {
	color: #000;
}

address {
}

aside {
}

b, strong {
}

blockquote {
}

button {
	cursor: pointer;
}
button:hover {
}

caption, th, td {
	vertical-align: middle;
}

h1, h2.comme-h1 {
	font-size: 2.4286rem;
	line-height: 2.4286rem;
	font-weight: normal;
	text-transform: uppercase;
	color: #31312b;
	margin-bottom: 62px;
}
h1.comme-h2,
h2 {
	font-size: 1.1429rem;
	line-height: 1.1429rem;
	font-weight: 600;
    margin-bottom: 0;
	text-transform: uppercase;
}

h2.gform_title {
	font-size: 2.5rem;
	margin-bottom: 30px;
}

h2.comme-h1.avec-marge {
	margin-top: 100px;
}
.la-promo h1 {
	margin-bottom: 12px;
}
.la-promo time {
	font-size: 1.5rem;
	line-height: 1.5rem;
}
h2.en-bleu a {
	color: #b9491b;
}
h3 {
	color: black;
	font-size: 1.1429rem;
	line-height: 1.1429rem;
	text-transform: uppercase;
	margin-bottom: 12px;
}
.boutique-emploi h3 a {
	color: #b9491b;
}
h4 {
}
h5 {
}
h6 {
}

i, em {
}

img {
}

input, select, textarea {
}

input[type=radio] {
}
input[type=checkbox] {
}

label {
}

li {
}

p {
	margin-bottom: 24px;
}

select {
}
select option {
}

table {
	border: 0; border-spacing:0; empty-cells:show;
}

textarea {
	resize: none;
}

ul, ol {
	margin-left: 20px;
	margin-bottom: 24px;
}
ul {
	list-style: disc;
}
ol {
	list-style: decimal;
}

/* Custom styles */

#entete-principale {
	width: 100%;
	height: 136px;
	padding-top: 36px;
	position: relative;
}

#entete-rs {

}
#entete-rs ul {
    list-style: none;
    margin-left: 0;
    position: absolute;
    right: 0;
    top: 20px;
}
#entete-rs li {
    padding: 0 5px;
    display: inline-block;
}
#entete-rs i {
    font-size: 2rem;
    color: #5f5f5f;
}
#entete-rs i:hover {
    color: #000;
}

#logo {
    position: absolute;
    left: 0;
    top: -20px;
    z-index: 100;
}
#logo img {
    width: 256px;
}

#menu-principal {
	position: absolute;
	right: 10px;
	bottom: -110px;
}
#entete-principale .wrapper {
    position: relative;
}
	#menu-principal .sf-menu {
		margin: 0;
	}
	#menu-principal li {
		margin-left: 24px;
		background: none;
		border: none;
	}
	#menu-principal li a {
		color: #31312b;
		font-size: 1.1428rem;
		line-height: 1.1428rem;
        text-transform: uppercase;
		font-weight: 600;
		margin: 0;
		padding: 0;
		border: none;
	}
	#menu-principal li a:hover {
		color: #000;
	}
	#menu-principal ul.sub-menu {
        width: 200px;
        padding: 15px 0;
		border: none;
		border-top: none;
		border-radius: 0;
        box-shadow: none;
	}
	#menu-principal ul.sub-menu li {
		background: rgba(0, 0, 0, 0.8);
        padding: 10px 10px;
		text-align: left;
		margin: 0;
        box-shadow: 2px 2px 6px rgba(0, 0, 0, .2);
	}
	#menu-principal ul.sub-menu li a {
		color: #fff;
	}
	.sf-menu ul {
		min-width: 10em !important;
	}
	#menu-principal ul.sub-menu:before { 
	}
 	#menu-principal ul.sub-menu i {
		font-size: 14px;
		color: #fff;
		margin-right: 6px;
	}

#menu-mobile {
	cursor: pointer;
	display: none;
}
#menu-mobile:before {
	font-size: 24px;
}

#piedpage-principal {
    background: url(images/bg-footer.png?d=202506181226) no-repeat right bottom;
    background-size: cover;
    color: #fff;
}
#piedpage-principal h2 {
    margin-bottom: 18px;
}
#piedpage-principal a {
    color: #fff;
}
#piedpage-principal a:hover {
    text-decoration: underline;
}
#piedpage-principal ul {
    list-style: none;
    margin-left: 0;
}
#piedpage-principal li {
	margin: 6px 0;
}

#pre-pp {
    padding: 78px 0;
    background: rgba(49, 49, 42, 0.80);
}

#post-pp {
    padding: 24px 0;
    background: rgba(0, 0, 0, 0.80);
}


#carousel-events {
    width: 1180px;
	max-width: 100%;
}

.carousel-bloc,
.carousel-bloc div {
	width: 393px;
}

.slick-prev:before,
.slick-next:before {
    color: #000 !important;
}

.grid-parent-3,
.grid-parent-4 {
	display: grid;
	grid-gap: 10px;
	position: relative;
	z-index: 100;
}

.grid-parent-3 {
	grid-template-columns: repeat(3, 1fr);
}

.grid-parent-4 {
	grid-template-columns: repeat(4, 1fr);
}

.btn-plus:before {
	content: "";
    width: 47px;
    height: 47px;
    background: url(images/icons/plus.png) no-repeat center top;
    margin: 0 auto 12px auto;
    display: block;
}
.btn-plus:hover:before {
    background-position: center -47px;
}

.btn-pin:before {
	content: "";
    width: 68px;
    height: 69px;
    background: url(images/icons/pin.png) no-repeat center top;
    margin: 36px auto 18px auto;
    display: block;
}
.btn-pin:hover:before {
    background-position: center -69px;
}

.btn-solde:before {
	content: "";
    width: 68px;
    height: 68px;
    background: url(images/icons/solde.png) no-repeat center top;
    margin: 36px auto 18px auto;
    display: block;
}
.btn-solde:hover:before {
    background-position: center -68px;
}

.centrer {
    text-align: center;
}

.en-savoir-plus a {
	font-weight: 600;
	color: #b9491b;
	display: inline-block;
}
.consulter-boutique a {
	font-size: 1.7143rem;
	font-weight: 600;
	color: #b9491b;
	display: inline-block;
}
.consulter-promo a {
	font-size: 1.7143rem;
	font-weight: 600;
	color: #b9491b;
	display: inline-block;
}

#heure-ouverture {
	width: 400px;
	text-align: center;
	position: absolute;
	left: 50%;
	margin-left: -200px;
	top: 25px;
}
#heure-ouverture .ouvert {
	color: #7aa54e;
	font-weight: bold;
}
#heure-ouverture .ferme {
	color: #b14732;
	font-weight: bold;
}

#bandeau-accueil {
}

#slider-accueil {
	width: calc(100% - 360px);
	float: left;
}

.bg-diapo {
	background-position: center center;
	background-repeat: repeat-x;
}


.une-diapo {
	width: 100%;
	background-position: top right;
	background-repeat: no-repeat;
	text-align: center;
}
.une-diapo .ud-contenant {
	width: 100%;
	height: 360px;
	display: table;
	text-align: right;
}

#pub-accueil {
	display: block;
	float: left;
}
#pub-accueil img {
	width: 360px;
	height: 360px;
}

#diapo-accueil .slick-prev,
#diapo-accueil .slick-next {
	width: 40px !important;
	height: 40px !important;
}

#diapo-accueil .slick-next {
	right: 40px !important;
}
#diapo-accueil .slick-prev {
	left: 40px !important;
}

#diapo-accueil .slick-prev:before,
#diapo-accueil .slick-next:before {
	font-size: 40px !important;
}
.slick-prev:before,
.slick-next:before {
	font-family: 'Font Awesome 5 Free' !important;
	font-weight: 900 !important;
	color: #fff !important;
}
.slick-prev:before {
	content: "\f053" !important;
}
.slick-next:before {
	content: "\f054" !important;
}

.une-diapo .ud-contenu {
	display: table-cell;
	vertical-align: bottom;
}
.une-diapo .ud-contenu a {
	margin: 0 50px 50px 0;
	font-size: 1.2rem;
	display: inline-block;
	background: black;
	color: #fff;
	border: none;
	padding: 12px 24px;
}
.une-diapo .ud-contenu a:hover {
	background: #fff;
	color: black;
}


#bandeau-secondaire .wrapper .grid_24 {
	height: 210px;
}

.les-categories {
	list-style: none;
	display: block;
	margin-left: 0;
	margin-bottom: 62px;
}
.les-categories li {
	text-transform: uppercase;
	display: inline-block;
	padding: 0 20px;
	font-size: 1.1429rem;
	line-height: 1.1429rem;
	font-weight: 600;
	cursor: pointer;
}
.les-categories li:hover {
	color: #b9491b;
}

#contenu-principal {
	margin: 38px 0 62px 0;
}
#contenu-principal.cp-accueil {
	margin-top: 62px;
}
#contenu-principal.spb {
	margin-bottom: 0;
}

.une-promo h2 a {
	color: #2a4287;
}
.une-promo h2 a:hover {
	color: #b9491b;
}
.la-promo time,
.une-promo time {
	color: #367991;
	margin-bottom:  26px;
	display: block;
}
.la-promo figure,
.une-promo figure {
	margin-bottom:  26px;
}

.un-service {
	margin-bottom: 32px;
}

.img-service {
	width: 70px;
	height: 70px;
	margin-right: 22px;
	background: #6d2b10;
	border-radius: 35px;
	text-align: center;
	display: block;
	float: left;
}
.img-service i {
	font-size: 2.6rem;
	color: #fff;
	margin-top: 15px;
}
.txt-service {
	width: calc(100% - 92px);
	display: block;
	margin-top: 12px;
	float: left;
}

#primary-sidebar {
	margin: 0;
}
#primary-sidebar li {
	list-style: none;
}
#primary-sidebar h2 {
	text-transform: uppercase;
	font-weight: normal;
}


.pub-carte {
	width: 100%;
	max-width: 300px;
	height: 280px;
	display: block;
	margin: 0 auto 60px auto;
	position:  relative;
}
.pub-carte span {
	width: 280px;
	font-size: 1.5rem;
	line-height: 2rem;
	color: #fff;
	margin: auto; /* Important */ 
	text-align: center; 
	display: block;
	position: absolute;
	left: 0;
	top: 50%;
	margin-top: -28px;
}

.pub-calendrier {
	width: 100%;
	max-width: 280px;
	height: 280px;
	background: #bec3cf;
	display: flex;
	margin-bottom: 60px;
}


#breadcrumbs {
	font-size: 0.8rem;
	line-height: 0.8rem;
	margin-top: 12px;
	margin-right: 4px;
	text-align: right;
	text-transform: uppercase;
}

#grid-boutiques.grid-parent-3 {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-gap: 0px;
	position: relative;
	max-width: 1176px;
	margin: 0 auto;
}
#grid-boutiques .grid-child {
	max-width: 392px;
}
#grid-boutiques .grid-child > a {
	width: 100%;
	height: 392px;
	text-align: center;
	display: table;
	color: #fff;
	font-size: 1.2375rem;
	position: relative;
}
#grid-boutiques .grid-child > a:before {
	background-size: cover;
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 0;
	opacity: 0.5;
}
#grid-boutiques .grid-child:hover a:before {
	opacity: 0.9;
}

#grid-boutiques .grid-child > a span {
	display: table-cell;
	vertical-align: middle;
	position: relative;
	font-size: 2rem;
	z-index: 10;
}

#grid-boutiques #docalendar {
	margin-top: 60px;
}



.slick-prev {
    left: 10px !important;
    background: none !important; /*to notice it, is white*/
	z-index: 100;
}
.slick-next {
    right: 10px !important;
    background: none !important; /*to notice it, is white*/
	z-index: 100;
}
.slick-prev:before,
.slick-next:before {
	color: #fff !important;
}

.slick-slide img {
	width: 100%;
	height: auto;
}

.une-boutique {
}

.une-boutique .col1 {
	width: 30%;
	padding-right: 20px;
	box-sizing: border-box;
	text-align: center;
	float: left;
}
.une-boutique .col1 img {
	max-width: 200px;
}

.une-boutique .col2 {
	width: 70%;
	box-sizing: border-box;
	float: left;
}
.une-boutique h1 {
	margin-top: 24px;
	margin-bottom: 24px;
	color: #000;
}
.une-boutique h1.txt-gris {
	color: #bbb;
}
.une-boutique h2 {
	margin: 45px 0 24px 0;
}
.une-boutique .col1 h2 {
	margin-bottom: 12px;
}
.une-boutique img {
	max-width: 100%;
	height: auto;
}
.une-boutique figure {
	margin-bottom: 36px;
	display: block;
}

.boutique-emploi {
	background: #fafafa;
	padding: 24px 24px 12px 24px;
	box-sizing: border-box;
}

.boutique-emploi,
.boutique-promo {
	margin-bottom: 24px;
}
.boutique-emploi h3,
.boutique-emploi p {
	margin-bottom: 6px;
}
.boutique-emploi .be-exp,
.boutique-promo span {
	display: block;
	font-size: 0.8rem;
	color: #000;
}
.boutique-emploi h1 {
	margin-bottom: 12px;
}
.boutique-emploi h2 {
	font-size: 1.5rem;
	line-height: 1.5rem;
}
.boutique-emploi time {
	display: block;
	margin-bottom: 12px;
}
.boutique-promo .bp-exp {
	text-align: right;
}

.boutique-rs {
	list-style: none;
	margin-left: 0;
}
.boutique-rs li {
	display: inline-block;
	padding: 0 4px;
}
.boutique-rs a i {
	color: #000;
	font-size: 1.5rem;
}
.boutique-rs a:hover i {
	color: #666;
}

.wp-pagenavi {
	text-align: center;
}
	.wp-pagenavi .pages {
		display: none !important;
	}
	.wp-pagenavi a,
	.wp-pagenavi span {
		border: none !important;
		height: 30px;
		width: 30px;
		padding: 0 !important;
		line-height: 30px !important;
		text-align: center;
		display: inline-block;
	}
	.wp-pagenavi a {
		color: #000;
		background-color: #fff;
	}
	.wp-pagenavi span.current {
		color: #fff;
		background-color: #000;
	}

.btn-cadre {
	display: inline-block;
	border: 1px solid #555;
	padding: 4px 12px;
	background: #fff;
	color: #000;
}
.btn-cadre i {
	margin-right: 12px;
}
.btn-cadre:hover {
	background: #000;
	color: #fff;
}


.sf-menu li {
	white-space: normal !important;
}

.btn-noel {
    color: #fff;
    display: inline-block;
    padding: 12px 24px;
    border-radius: 3px;
    background: #942c37;
    font-size: 1.4rem;
    text-transform: uppercase;
    box-shadow: 1px 1px 4px rgba(0,0,0,0.4);
    transition: all 0.4s;
    text-align: center;
    vertical-align: middle;
}
.btn-noel:hover {
    background: #c01621;
    color: #fff;
}

input.gform_button[type="submit"] {
	display: block;
	background: #31312b;
	color: #fff;
	padding: 12px 40px;
	margin: 0 auto;
	border: 0;
}
input.gform_button[type="submit"]:hover {
	background: #aaa;
}

#gform_3 {
	background: #eee;
	padding: 40px;
	box-sizing: border-box;
}



/* Responsive */

@media screen and (max-width: 1200px) {
	#slider-accueil {
		width: 100%;
		float: none;
		clear: both;
	}
	.une-diapo {
		background-size: cover;		
	}
	.une-diapo .ud-contenant {
		width: 100%;
		height:calc(100vw * 360.0 / 2000.0);
		display: table;
		text-align: right;
	}	
	#pub-accueil {
		display: none !important;
	}
	
	#carousel-events {
		width: 100%;
	}
	
	#grid-boutiques.grid-parent-3 {
		grid-template-columns: repeat(2, 1fr);
		max-width: 784px;
	}
	#grid-boutiques .grid-child {
		margin: 2px;
	}	
}

@media screen and (max-width: 960px) {
}

/* Mobile */
@media screen and (min-width: 1025px) {
	#menu-mobile {
		display: none;
	}

	#menu-principal > ul {
		display: block !important;
	}
}
@media screen and (max-width: 1024px) {
	#entete-rs li {
		padding: 0 2px;
	}
	#entete-rs i {
	    font-size: 1.6rem;
	}
	
	#menu-mobile {
		display: block;
	}

    #menu-principal {
        right: 0;
        bottom: -60px;
    }
    #menu-principal i {
        color: black;
    }	
    
    #menu-principal ul.sub-menu {
        width: auto;
        padding: 0;
        background: none;
    }
    #menu-principal ul.sub-menu li {
        padding: 0;
        background: none;
    }
    #menu-principal ul.sub-menu li a {
        font-size: 12px;
        text-align: center;
    }

	#menu-principal ul {
		display: none;
		width: 160px;
		padding: 12px;
		background: rgba(0, 0, 0, 0.8);
		text-align: center;
		position: absolute;
		right: 40px;
		top: 0;
		z-index: 300;
	}
	#menu-principal > ul {
		border-radius: 2px;
	}
	#menu-principal > ul:before {
	  content: '';
    height: 0;
    position: absolute;
    right: -8px;
    top: 2px;
    width: 0;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
		border-left: 8px solid rgba(0, 0, 0, 0.8);
	}
		#menu-principal ul li {
			display: block;
			float: none;
			clear: both;
		}

		#menu-principal ul a {
			color: #fff;
			line-height: 22px;
			padding: 6px 0;
			margin: 0;
		}
		#menu-principal ul li a:hover:not(.active) {
			border: none;
			color: #B63FA5;
		}	
		#menu-principal ul.sub-menu {
			position: relative;
			left: auto;
			top: auto;
			right: auto;
			box-sizing: border-box;
		}
		#menu-principal li {
			margin-left: 0;
		}
		#menu-principal ul.sub-menu:before {
			left: 75px;
		}
	.sf-menu ul {
		min-width: inherit !important;
	}
    
    #bandeau-secondaire .wrapper .grid_24 {
        display: flex !important;
    }
        #bandeau-secondaire .wrapper .grid_24 img {
            object-fit: cover;
            object-position: center center;
        }
}
@media screen and (max-width: 900px) {
	div[class*="grid_"] {
		width: 96% !important;
		padding-left: 2% !important;
		padding-right: 2% !important;
		float: none !important;
		clear: both !important;
		display: block !important;
		text-align: center !important;
	}
	
	div[class*="grid_"].hide-mobile,
	.hide-mobile {
		display: none !important;
	}
	li {
    list-style-position: inside !important;
	}	

	.txt-service,
	.img-service {
		display: block;
		float: none;
		clear: both;
		text-align: center;
		margin: 0 auto;
	}
	.img-service {
		margin-top: 0;
		margin-bottom: 24px;
	}
	.txt-service {
		width: 100%;
		max-width: 600px;
	}
	
	.une-boutique .col1,
	.une-boutique .col2 {
		width: 100%;
		max-width: 600px;
		margin: 0 auto;
		padding: 0;
		display: block;
		clear: both;
		float: none;
	}
	.une-boutique .col2 h1,
	.une-boutique .col2 h2 {
		text-align: center;
	}
	
	.grid_18.une-boutique {
		width: 100%;
	}
	
	table {
		margin: 0 auto;
	}
	
	#contenu-principal {
		margin: 32px 0;
	}
	
	.grid-parent-3 {
    	grid-template-columns: repeat(2, 1fr);
	}
	
	#heure-ouverture {
		width: 400px;
		text-align: center;
		position: relative;
		top: auto;
		left: auto;
		margin: 0 auto 20px auto;
	}
	#entete-principale {
		height: 100px;
	}
    
    #text-4 h2 {
        display: none !important;
    }
}

@media screen and (max-width: 852px) {
	.grid-parent-3 {
    	grid-template-columns: repeat(1, 1fr);
	}

	#grid-boutiques.grid-parent-3 {
		grid-template-columns: repeat(1, 1fr);
		max-width: 392px;
	}
	
	#slider-accueil {
		display: none !important;
	}
}

@media screen and (max-width: 768px) {
	.une-diapo .ud-contenu a {
		margin: 0 25px 25px 0;
		font-size: 1rem;
		padding: 6px 12px;
	}

	#diapo-accueil .slick-next {
		right: 20px !important;
	}
	#diapo-accueil .slick-prev {
		left: 20px !important;
	}
	h1, h2.comme-h1 {
		font-size: 1.8rem;
    	line-height: 1.8rem;
		margin-bottom: 32px;
	}
	h2.comme-h1.avec-marge {
		margin-top: 50px;
	}
	
	.consulter-promo a,
	.consulter-boutique a {
	    font-size: 1.2rem;
	}
	
}

@media screen and (max-width: 400px) {
    #logo {
        width: 70%;
    }
    #logo img {
        width: 100%;
    }
}