bar135.css

*{
	padding:0;
	margin:0;
}

/* PAGE MAIN COMPONENTS */ 

/* BODY ARCHITECTURE */

body{
	color:#505050;
	font-family:'poiret one', sans-serif;
	font-size:20px;
	font-weight:bold;
	display:grid;
	grid-template-areas: 
	"header"
	"section"
	"footer"
	"signature";
}

section{
	grid-area:section;
}

/* HEADER ARCHITECTURE */	

.header{
	font-family:'poiret one', sans-serif;
	grid-area:header;
	background-image: url('images/misc/header_image.png');
	background-size: cover;
	background-position: 16%;
	width:100%;
	height:25vw;
}

.wrap{
	position:relative;
	left:50%;
	top:50%;
	transform: translate(-50%, -50%);
}

/* NAVIGATION BAR */

.nav{
	padding:0;
	list-style: none;
	text-align:center;
}	

.nav li{
	display:inline-block;
	line-height: 30px;
	vertical-align: middle;
}

.nav a{
	color:white;
	text-decoration:none;
	word-spacing:3px;
	line-height: 17px;
	font-size: 17px; 
	font-weight: bolder;
	padding-bottom:5px;
	margin:0 12px;
}

.main_logo{
	width:130px;
}

/* MEDIA BAR HOVER ANIMATION */

.swipe{
	position:relative;
}

.swipe:after{
	content: '';
	position: absolute;
	border-bottom: 2px white solid;
	bottom: 0;
	left:0;
	right:100%;
	transition: all 400ms;
}

.swipe:hover:after{
	right:0;
}

/* CURRENT PAGE INDICATOR */

.current{
	border-bottom: 2px white solid;
}	

/* MEDIA BAR */

.media img{
	display:inline-block;
	width:50px;
	margin: 0 25px;
}

.media{
	margin-top:5px;
	text-align: center;
}

.icon{
	box-sizing: border-box;
	border:3px solid transparent;
	border-radius:50%;
	transition:border 1s;
}

/* MEDIA BAR HOVER ANIMATION */

.icon:hover{
	border: 3px white solid;
	transition: all 1.5s;
}

/* SIDE NAV ARCHITECTURE */

.side_nav_wrap {
	display:none;
	position:fixed;
	top:50px;
	background: #505050;
	width:76%;
	margin-left:-76%;
	border:2px solid #000000;
	box-sizing: border-box;
	z-index: 1000;
}	

.side_nav {	
	position:relative;
	left:50%;
	transform: translate(-50%, 0);
	text-align:center;
	list-style: none;
}

.side_nav li{
	margin:30px 0;
	font-size:16px;
}

.side_nav a{
	padding-bottom:5px;
	color:#ffffff;
}

.side_nav img{
	width:40px;
}

.side_nav_media {
	display:none;
	padding-bottom:15px;
}

.side_nav_button{
	display:none;
	color:#ffffff;
	font-size:28px;
	cursor: pointer;
}

.side_nav_open {
	position:absolute;
	top:70px;
	left:15%;
}

.side_nav_close{
	color:#ffffff;
	position:absolute;
	top:7px;
	right:7px;
}

/* FOOTER ARCHITECTURE */

footer{
	grid-area:footer;
	display:grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
	grid-template-areas: 
	"media times logo contact address";
	background-color: #505050;
	font-family:'Lato', sans-serif;
	font-size: 14px;
    font-weight: 300;
	color:white;
	margin-top:40px;
}

.footer_address{
	grid-area:address;
	margin-top:30px;
	padding-left:40px;
}

.footer_times{
	grid-area:times;
	margin-top:30px;
}

.footer_times li{
	line-height: 20px;
}

.footer_logo{
	grid-area:logo;
}

.footer_logo img{
	width:100px;
	display:block;
	margin:auto;
	margin-top:30px;
	margin-bottom:20px;
}

.footer_logo li img{
	margin-top:0;
	margin-bottom:0;
}

.footer_contact{
	grid-area:contact;
	margin-top:30px;
	padding-right:30px;
	text-align:right;
}

.footer_media{
	grid-area:media;
	text-align: center;
}

footer ul{
	list-style: none
}

.footer_logo ul{
	text-align: center;
	margin-top:20px;
	margin-bottom:20px;
}

.footer_logo li{
	margin-top:10px;
}

.footer_contact li{
	margin-bottom:10px;
}

.media1{
	margin-top:15px;
}

.footer_media li{
	text-align: center;
	display:inline-block; 
}

.footer_media img{
	width:50px;
}

.footer_media p{
	margin-top:30px;
	word-spacing: 2px;
}

/* SIGNATURE ARCHITECTURE */

.signature{
	grid-area:signature;
	padding:12px;
	background-color: #000000;
	font-family:'Lato', sans-serif;
	font-size: 14px;
    font-weight: 300;
	color:white;
	text-align: center;
	text-decoration: underline;
}

/* PAGE SUB-SECTIONS */

h1{
	color:#283593;
	font-family: 'Volkhov', serif;
	font-size:50px;
	font-weight:lighter;
	padding-top:6px;
	padding-bottom:6px;
	border-top:4px solid #505050;
	border-bottom:4px solid #505050;
	text-align:center;
}

h2{
	text-align:center;
	font-size:34px;
}

h3{
	font-size:24px;
}

br{
	height:30px;
}

b {
	color:#283593;
	font-size: 22px;
	text-shadow:0.5px 0.5px #283593;
}

.title{
	grid-area:title;
	margin-top:30px;
}

.med_title{
	grid-area:med_title;
	color:#000000;
	word-spacing: 7px;
	text-align:center;
}

.art_img{
	grid-area:art_img;
}

.art_img img{
	width:100%;
	border-radius:5%;
}

.sub_title{
	border-top:4px solid #283593;
	border-bottom:4px solid #283593;
	padding:4px 0;
	color:#000000;
	display:flex;
	justify-content: center;
	align-items:center;
	text-align:center;
}

#sub_title_1{
	grid-area:sub_title_1;
}

#sub_title_2{
	grid-area:sub_title_2;
}

#sub_title_3{
	grid-area:sub_title_3;
}

#sub_title_4{
	grid-area:sub_title_4;
}

.paragraph{
	grid-area:paragraph;
	text-align:center;
}

#paragraph_1{
	grid-area:paragraph_1;
}

#paragraph_2{
	grid-area:paragraph_2;
}

#paragraph_3{
	grid-area:paragraph_3;
}

#paragraph_4{
	grid-area:paragraph_4;
}

.container img{
	width:100%;
	border-radius:5%;
}

#container_1{
	grid-area:container_1;
}

#container_2{
	grid-area:container_2;
}

#container_3{
	grid-area:container_3;
}

#container_4{
	grid-area:container_4;
}

#container_5{
	grid-area:container_5;
}

#container_6{
	grid-area:container_6;
}

#container_7{
	grid-area:container_7;
}

#container_8{
	grid-area:container_8;
}

/* LINK STYLING */

a:link{
	text-decoration: none;
}

a:hover{
	text-decoration: none;
}

a:after{
	text-decoration: none;
}

a:active{
	text-decoration: none;
}	

/* BUTTON */

.button{
	grid-area:button;
}

.button a{
	border-radius:8px;
    color: white;
    font-size: 18px;
    background-color: #283593;
    padding: 8px 12px;
    text-align: center;
    font-weight:bold;
    cursor: pointer;
    display:inline-block;
    position:relative;
	right:50%; 
	left:50%;
	transform: translate(-50%, 0);
 }

.button_1{
 	grid-area:button_1;
 }

 .button_2{
 	grid-area:button_2;
 }

 .button_margin{
 	margin-top:30px;
 }

.button a:hover {
    background-color: #287593;
  }

/* HOMEPAGE ARCHITECTURE */

#home_section .paragraph{
	text-align:left;
}

#home_section{
	display:grid;
	grid-template-columns: 7% 1fr 7%;
	grid-row-gap: 30px;
	grid-template-areas:
	". dashboard ."
	". intro_article ."
	". promo ."
	". hire_article ."
	". c4c_article ."
	". c4c_banner ."
	". courses_article .";
}

/* CAROUSEL ARCHITECTURE */

#dashboard{
	grid-area:dashboard;
	height:35vw;
	display:grid;
	grid-template-columns:1fr 35vw;
	grid-column-gap: 40px;
	grid-template-areas: 
	"fade_container carousel_container";
	margin-top:30px;
}

#carousel_container{
	grid-area:carousel_container;
	overflow:hidden;
	position:relative;
	left:8%;
	width:92%;
	height:92%;
	border-radius:5%;
}

#fade_container{
	grid-area:fade_container;
	position:relative;
}

.fade_title{
	position:absolute;
	width:100%;
	top:50%;
	left:50%;
	transform: translate(-50%, -50%);
}

.fade_title_main{
	color:#283593;
	font-family: 'Volkhov', serif;
	font-weight: normal;
	display:block;
	text-align:center;
	font-size:45px;
}

.fade_title_sub{
	color:#000000;
	display:block;
	text-align:center;
	font-size:28px;
	margin-bottom:10px;
}

#fade_title_1{
	display:block;
}

#fade_title_2{
	display:none;
}

#fade_title_3{
	display:none;
}

#img_container{
	position:absolute;
	width:100%;
	height:width;
	}

.carousel_img img{
	position:absolute;
	width:100%;
	border-radius:5%;
	display:inline;
}

#carousel_img_1{
	margin-left:0%;
}

#carousel_img_2{
	margin-left:100%;
}

#carousel_img_3{
	margin-left:200%;
}

#carousel_img_4{
	margin-left:300%;
}

#carousel_img_5{
	margin-left:400%;
}

#carousel_img_6{
	margin-left:500%;
}

#carousel_img_7{
	margin-left:600%;
}

#carousel_img_8{
	margin-left:700%;
}

#carousel_img_9{
	margin-left:800%;
}

#carousel_img_10{
	margin-left:900%;
}

#intro_article{
	grid-area:intro_article;
	display:grid;
	grid-template-columns: 1fr 1fr;
	grid-row-gap:30px;
	grid-column-gap:40px;
	grid-template-areas:
	"sub_title_1 sub_title_2"
	"paragraph_1 paragraph_2";
}

#hire_article{
	grid-area:hire_article;
	display:grid;
	grid-template-columns: 1fr 1fr 1fr;
	grid-row-gap: 30px;
	grid-column-gap:40px;
	grid-template-areas: 
	"title title title"
	"sub_title_1 sub_title_1 art_img"
	"paragraph_1 paragraph_1 art_img"
	"sub_title_2 sub_title_3 art_img"
	"paragraph_2 paragraph_3 art_img"
	"button_1 button_2 art_img"
}

#courses_article{
	grid-area:courses_article;
	display:grid;
	grid-template-columns:1fr 1fr 1fr;
	grid-row-gap: 30px;
	grid-column-gap:40px;
	grid-template-areas: 
	"title title title"
	"sub_title_1 sub_title_2 art_img"
	"paragraph_1 paragraph_2 art_img";
}

#c4c_article{
	grid-area:c4c_article;
	display:grid;
	grid-template-columns: 1fr 1fr 1fr;
	grid-row-gap: 30px;
	grid-column-gap:40px;
	grid-template-areas: 
	"title title title"
	"art_img sub_title_1 sub_title_1"
	"art_img paragraph_1 paragraph_1"
	"art_img sub_title_2 sub_title_3"
	"art_img paragraph_2 paragraph_3"
}

#promo{
	grid-area:promo;
	display:grid;
	grid-template-columns: 1fr;
	grid-row-gap:30px;
	grid-template-areas:
	"title" 
	"promo_offers";
}	

#c4c_banner{
	grid-area: c4c_banner;
	width:100%;
	margin-top:30px;
}

#promo_offers{
	grid-area: promo_offers;
	background-image: url('images/promos/black_white_2.png');
	background-size: cover;
	text-align:center;
	
}

#promo_offers h3{
	color:yellow;
	font-size:30px;
	margin-top:30px;
	margin-bottom:20px;	
}

#promo_offers .day{
	display:inline-block;
	color:#ffffff;
	font-size:24px;
	font-weight:bold;
	margin-top:30px;
	margin-bottom:8px;
	text-shadow: 
	-1px -1px 0 black,
    1px -1px 0 black,
    -1px 1px 0 black,
    1px 1px 0 black;
}

#promo_offers .offer{
	color:#ffffff;
	font-style:bold;
	font-size:22px;
	margin:0 5px;
	text-shadow: 
	-1px -1px 0 black,
    1px -1px 0 black,
    -1px 1px 0 black,
    1px 1px 0 black;
}

/* OUTSIDE BAR SKELETON */

#outside_bars_section{
	display:grid;
	grid-template-columns: 7% 1fr 1fr 1fr 7%;
	grid-row-gap:30px;
	grid-template-areas: 
	". title title title ."
	". paragraph paragraph paragraph ."
	". out_img_grid out_img_grid out_img_grid .";
	
}

#out_img_grid{
	grid-area: out_img_grid;
	display:grid;
	grid-template-areas: 
	"out_img_1 out_img_2 out_img_3"
	"out_img_4 out_img_5 out_img_6"
	"out_img_7 out_img_8 out_img_9";
	grid-column-gap: 12px;
	grid-row-gap:9px;
}

.out_img img{
	width:100%;
	border-radius:15px;
}

#out_img_1{
	grid-area: out_img_1;
}

#out_img_2{
	grid-area: out_img_2;	
}

#out_img_3{
	grid-area: out_img_3;	
}

#out_img_4{
	grid-area: out_img_4;	
}

#out_img_5{
	grid-area: out_img_5;	
}

#out_img_6{
	grid-area: out_img_6;	
}

#out_img_7{
	grid-area: out_img_7;	
}

#out_img_8{
	grid-area: out_img_8;	
}

#out_img_9{
	grid-area: out_img_9;	
}

/* MENU NAV BAR */

#menu_nav_wrap{
	grid-area:menu_nav_box;
	height:40px;
	background-color: #505050;
	border-top:1px solid #000000;
	border-bottom:1px solid #000000;
	z-index: 950;
}

#menu_nav{
	font-size:0;
	position:relative;
	top:50%;
	bottom:50%;
	transform: translate(0, -50%);
	list-style:none;
	text-align:center;
}

#menu_nav li{
	display:inline-block;
	margin:0;
}

.li_border{
	border-right:#ffffff solid 2px;
	}

.li_first{
	padding-right:20px;
}

.li_middle{
	padding:0 20px;
}

.li_last{
	padding-left:20px;
}

#menu_nav a{
	color:#ffffff;
	font-weight: bold;
	text-decoration:none;
	padding-bottom:5px;
	font-size: 17px;
}

#menu_nav .swipe{
	position:relative;
}

#menu_nav .swipe:after{
	content: '';
	position: absolute;
	border-bottom: 2px #ffffff solid;
	bottom: 0;
	left:0;
	right:100%;
	transition: all 400ms;
}

#menu_nav .swipe:hover:after{
	right:0;
}

/* MENUS SKELETON ARCHITECTURE */

#menus_header{
	margin-bottom:0;
}

.menu_section{
	display:grid;
	grid-template-columns: 7% 1fr 7%;
	grid-row-gap:30px;
	grid-template-areas: 
	"menu_nav_box menu_nav_box menu_nav_box"
	". spritzes_menu ."
	". house_cocktails_menu ."
	". c4c_menu ."
	". gin_menu ."
	". wine_menu ."
	". beer_menu .";
}

#spritzes_menu{
	grid-area:spritzes_menu;
	display:grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	grid-row-gap:30px;
	grid-column-gap:40px;
	grid-template-areas: 
	"title title title title"
	"paragraph paragraph paragraph paragraph"
	"menu_item_1 menu_item_2 menu_item_3 menu_item_4";
}

#house_cocktails_menu{
	grid-area:house_cocktails_menu;
	display:grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	grid-row-gap:30px;
	grid-column-gap:40px;
	grid-template-areas: 
	"title title title title"
	"paragraph paragraph paragraph paragraph"
	"menu_item_1 menu_item_2 menu_item_3 menu_item_4"
	"menu_item_5 menu_item_6 menu_item_7 ."
}

#c4c_menu{
	grid-area:c4c_menu;
	display:grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	grid-row-gap:30px;
	grid-column-gap:40px;
	grid-template-areas: 
	"title title title title"
	"paragraph paragraph paragraph paragraph"
	"menu_item_1 menu_item_2 menu_item_3 menu_item_4"
	"menu_item_5 menu_item_6 menu_item_7 menu_item_8"
	"menu_item_9 menu_item_10 . ."
}

#gin_menu{
	grid-area:gin_menu;
	display:grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	grid-row-gap:30px;
	grid-column-gap:40px;
	grid-template-areas: 
	"title title title title"
	"paragraph paragraph paragraph paragraph"
	"menu_item_1 menu_item_2 menu_item_3 menu_item_4"
	"menu_item_5 menu_item_6 menu_item_7 menu_item_8"
	"menu_item_9 menu_item_10 . ."
}

#wine_menu{
	grid-area:wine_menu;
	display:grid;
	grid-template-columns: 1fr;
	grid-row-gap:30px;
	grid-template-areas: 
	"title"
	"paragraph"
	"sparkling"
	"white"
	"rose"
	"red"
}

#beer_menu{
	grid-area:beer_menu;
	display:grid;
	grid-template-columns: 1fr;
	grid-row-gap:30px;
	grid-template-areas: 
	"title"
	"paragraph"
	"draught"
	"bottles"
}

#menu_item_1{
	grid-area: menu_item_1;
}

#menu_item_2{
	grid-area: menu_item_2;
}

#menu_item_3{
	grid-area: menu_item_3;
}

#menu_item_4{
	grid-area: menu_item_4;
}

#menu_item_5{
	grid-area: menu_item_5;
}

#menu_item_6{
	grid-area: menu_item_6;
}

#menu_item_7{
	grid-area: menu_item_7;
}

#menu_item_8{
	grid-area: menu_item_8;
}

#menu_item_9{
	grid-area: menu_item_9;
}

#menu_item_10{
	grid-area: menu_item_10;
}

#sparkling{
	grid-area:sparkling;
}

#white{
	grid-area:white;
}

#rose{
	grid-area:rose;
}

#red{
	grid-area:red;
}

#draught{
	grid-area:draught;
}

#bottles{
	grid-area:bottles;
}

.menu_img{
	width:160px;
	padding:6px;
	border:4px solid #283593;
	border-radius:50%;
	text-align:center;
	position:relative;
	right:50%; 
	left:50%;
	transform: translate(-50%, 0);
}

.menu_item_title{
	color:#000000;
	font-size:20px;
	font-weight:bold;
	text-align:center;
	margin-top:5px;
}

.menu_item_title p{
	padding:5px 0;
}

.menu_item_para{
	font-size:16px;
	line-height: 24px;
	font-weight:bold;
	font-style:italic;
	text-align:center;
	margin-top:10px;
}

.menu_item_para p{
	margin-top:10px;
}

.menu_table{
	text-align:left;
	padding-bottom:12px;
	margin-bottom:12px;
	border-bottom:#000000 solid 1px;
}

.menu_table_last{
	text-align:left;
	margin-bottom:10px;
}

th, td{
	padding:7px 10px;
	
}

th{
	color:#283593;
	text-shadow: 0.5px 0.5px #283593;
}

.col_1{
	width:68%;
}

.col_2{
	width:8%;
}

.col_3{
	width:84%;
}

.col_4{
	width:8%;
}

#bottles span, #wine_menu span{
	font-size:17px;
}

/* VENUE HIRE ARCHITECTURE*/

#venue_hire_section{
	display:grid;
	grid-template-columns: 7% 1fr 7%;
	grid-row-gap:30px;
	grid-template-areas: 
	". title ."
	". med_title ."
	". hire_article_1 ."
	". carousel_container_2 ."
	". hire_article_2 ."
	". hire_article_3 ."
}

#hire_article_1{
	grid-area:hire_article_1;
	display:grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	grid-row-gap:9px;
	grid-column-gap:12px;
	grid-template-areas: 
	"container_4 container_2 container_1 container_7"
	"container_8 container_3 container_5 container_6";
}

#hire_article_2{
	grid-area:hire_article_2;
	display:grid;
	grid-template-columns: 1fr 1fr;
	grid-column-gap:40px;
	grid-template-areas: 
	"container_1 container_2";
}

#hire_article_3{
	grid-area:hire_article_3;
	display:grid;
	grid-template-areas:
	"sub_title_1"
	"hire_bullets"
	"button";
}

#hire_bullets{
	grid-area:hire_bullets;
	list-style:none;
	list-style-position: inside;
	text-align:center;
}

#hire_bullets li{
	margin-bottom:30px;
}

#hire_article_2 #container_1{
	color:#000000;
}

/* COCKTAIL MASTERCLASSES ARCHITECTURE */

#courses_section{
	display:grid;
	grid-template-columns:0 1fr 1fr 0;
	grid-row-gap: 30px;
	grid-column-gap:7%;
	grid-template-areas:
	". title title ."
	". courses_article_1 courses_article_1 ."
	". courses_article_2 courses_article_3 ."
	". courses_article_4 courses_article_4 .";
}

#courses_article_1{
	grid-area:courses_article_1;
	display:grid;
	grid-template-columns:1fr;
	grid-row-gap: 30px;
	grid-template-areas:
	"med_title"
	"courses_img" 
	"paragraph_1";
}

#courses_article_2{
	grid-area:courses_article_2;
}

#courses_article_3{
	grid-area:courses_article_3;
}

#courses_article_4{
	grid-area:courses_article_4;
	display:grid;
	grid-template-columns:1fr;
	grid-row-gap:30px;
	grid-template-areas:
	"paragraph_1"
	"button";
}

.courses_img{
	grid-area:courses_img;
}

.courses_img img{
	width:100%;
	border-radius:10px;
}

#courses_article_1 #paragraph_1{
	color:#000000;
	font-size:30px;
}

#courses_article_2 .paragraph, #courses_article_3 .paragraph{
	text-align:left;
}

#courses_article_4 #paragraph_1{
	margin-top:20px;
	font-size:24px;
	color:#000000;
}

/* BARTENDING COURSES ARCHITECTURE */

#bartending_section{
	display:grid;
	grid-template-columns: 7% 1fr 7%;
	grid-row-gap:30px;
	grid-template-areas: 
	". title ."
	". med_title ."
	". paragraph_1 ."
	". paragraph_2 ."
	". paragraph_3 ."
	". bartending_article ."
}

#bartending_article{
	grid-area:bartending_article;
	display:grid;
	grid-template-columns: 1fr;
	grid-row-gap:30px;
	grid-column-gap:70px;
	grid-template-areas: 
	"container_1"
	"container_2"
	"container_3"
	"container_4"
	"button";
}

#bartending_section #paragraph_3{
	color:#000000;
	font-size:24px;
}

.bartending_bullets{
	margin:0 10vw;
}

.bartending_bullets li{
	margin-bottom:30px;
	font-size:25px;
	color:#283593;
}

.bartending_bullets li span{
	font-size:20px;
	color:#505050;
}


/* CONTACT ARCHITECTURE */

#contact_section{
	display:grid;
	grid-template-columns: 7% 1fr 7%;
	grid-row-gap: 30px;
	grid-template-areas: 
	". title ."
	". med_title ."
	". contact_article .";
}

#contact_article{
	grid-area:contact_article;
	display:grid;
	grid-template-columns: 1fr 1fr;
	grid-column-gap: 40px;
	grid-template-areas: 
	"container_2 container_1"
}

.contact_bullets{
	text-align:left;
	margin-left:50px;
}

.contact_bullets li{
	list-style: none;
	display:inline-block;
	vertical-align: middle;
	font-size:26px;
}

.contact_bullets img{
	width:60px;
}

#contact_form label {
	display:block;
	margin-top:20px;
}

.form_row{
	display:block;
	width:100%;
	margin-top:10px;
	height:30px;
	font-size: 20px;
	font-family:'poiret one', sans-serif;
	font-weight:bold;
	background-color:#dcdcdc;
	border:solid 1px #283593;
}

#contact_form textarea{
	display:block;
	width:100%;
	height:200px;
	margin-top:10px;
	font-size: 20px;
	font-family:'poiret one', sans-serif;
	font-weight:bold;
	background-color:#e8e8e8;
	border:solid 1px #283593;
}

#contact_form span{
	color:orange;
}

#submit{
	display:inline;
	position:relative;
	right:50%; 
	left:50%;
	transform: translate(-50%, 0);
	padding:2px 4px;
}







.side_menu_nav_icon{
	color:#ffffff;
	font-size:30px;
	display:none;
	cursor: pointer;
}

.side_menu_nav_open{
	position:relative;
	left:50%;
	top:50%;
	transform: translate(-50%, -50%);
}

.side_menu_nav_close{
	position:absolute;
	top:7px;
	right:7px;
}

.side_menu_nav_wrap{
	display:none;
	position:fixed;
	top:50px;
	background: #505050;
	width:76%;
	margin-left:-76%;
	border:2px solid #000000;
	box-sizing: border-box;
	z-index: 1000;
}


.side_menu_nav {
	position:relative;
	left:50%;
	transform: translate(-50%, 0);
	text-align:center;
	list-style: none;
	z-index:999;
}

.side_menu_nav li{
	margin:30px 0;
	font-size:16px;
}

.side_menu_nav a{
	padding-bottom:5px;
	color:#ffffff;
}

.sticky{
	position:fixed;
	top:0;
	width:100%;
}

.sticky_padding{
	padding-top:40px;
}

#carousel_container_2{
	grid-area:carousel_container_2;
	overflow:hidden;
	position:relative;
	height:86vw;
	width:86vw;
	border-radius: 5%;
	display:none;
}

#form_submit{
	border-radius:8px;
    color: white;
    font-family:'poiret one', sans-serif;
    font-size: 18px;
    background-color: #283593;
    padding: 12px 20px;
    text-align: center;
    font-weight:bold;
    cursor: pointer;
    display:inline-block;
    position:relative;
	right:50%; 
	left:50%;
	transform: translate(-50%, 0);
 }
 
#form_submit:hover {
    background-color: #287593;
}

#other-message {
	display:none;
}