/* Copyright 2023 Kaya Sertel. All Rights Reserved. */

body {
	height: 100vh;
    margin: 0px !important;
	color: white;
	font-family: Atkinson Hyperlegible, sans-serif;
}

/* width */
::-webkit-scrollbar {
	display: block;
	position: relative;
	right: 2px;
	border-radius: 8px;
	border: solid  black 2px;
	width: 14.5px;
}

/* Track */
::-webkit-scrollbar-track {
	border-radius: 2px;
	background: #f1f1f1; 
}
 
/* Handle */
::-webkit-scrollbar-thumb {
	border: solid #f1f1f1 3.5px;
	border-radius: 8px;
	background: #888; 
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
	background: #555; 
}

.noselect {
  -webkit-touch-callout: none;
    -webkit-user-select: none;
     -khtml-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
}

p {
	text-align: center;
	font-family: Atkinson Hyperlegible, sans-serif;
}

.main_div {
	width: 100%;
	overflow-x: hidden;
	height: 100%;
	position: relative;
	z-index: 0;
	display: flex;
	flex-direction: column;
	    justify-content: space-between;
}

.fixed_menu_space {
	width: 100%;
	height: 40px;
}

.menu_closer {
	position: fixed;
	height: 100vh;
	width: 100vw;
	z-index: 9;
	display: none;
	background:rgba(0, 0, 0, 0.4);
}

.fixed_menu_top {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 40px;
	background: #000000;
    box-shadow: 0px 4px 0px 0px rgb(13 57 82 / 46%);
	z-index: 10;
}


.fixed_menu_cont {
	height: 100%;
	display: flex;
	justify-content: space-between;
}

.fixed_menu_button {
	display: flex;
	align-items: center;
	padding: 0px 14px;
	cursor: pointer;
	height: 100%;
}

.fixed_menu_button_selected {
	text-decoration: underline 3px;
}

.fixed_menu_left_cont {
	display: flex;
	border-radius: 0px 10px 10px 0px;
	overflow: hidden;
}

.fixed_menu_right_cont {
	border-radius: 10px 0px 0px 10px;
	overflow: hidden;
	display: none;
}

.notification_num {
	position: relative;
    top: 8px;
    right: -4px;
	border-radius: 20px;
	height: 13px;
	width: 13px;
	font-size: 13px;
	display: flex;
	align-items: center;
    justify-content: center;
}

/*.fixed_menu_button:hover {
	background: white;
	color: black;
}*/

.fixed_menu_button:hover {
	animation: button_background_hover_ani 0.2s ease-in-out;
	background: white;
	color: black;
}

@keyframes button_background_hover_ani {
	from {	
		background: black;
		color: white;
	}
	to {
		background: white;
		color: black;
	}
}

.bar_button {
	display: none;
	width: 24.5px;
	justify-content: center;
}

.fixed_menu_all_buttons_cont  {
	display: flex;
	overflow: hidden;
}

@media only screen and (max-width: 1100px) {
	.bar_button {
		display: flex;
	}
	
	.fixed_menu_all_buttons_cont {
		left: -200px;
		top: 90px;
		position: absolute;
		background: black;
		flex-direction: column;
		border-radius: 0px 20px 20px 0px;
	}
	
	.fixed_menu_right_cont  {
		display: block;
	}
}

.fixed_menu_logo_part {
	height: 100%;
	display: flex;
	align-items: center;
	position: relative;
	padding: 0px 20px;
}

.fixed_menu_logo_text_part {
	display: flex;
	align-items: center;
    flex-direction: column;
	margin-left: 5px;
}

.fixed_menu_logo_text {
	margin-block-start: 0em;
	margin-block-end: 0em;
}

.fixed_menu_logo_hr {
	width: 100%;
	margin-block-start: 0.1em;
    margin-block-end: 0.1em;
}

.menu_opener {
	font-size: 28px;
}

.search_logo {
	font-size: 20px;
	padding: 15px;
	padding-right: 15px;
	padding-top: 14px;
	
}



.navicon_button {
	cursor: pointer;
}

.top_button {
	position: fixed;
	bottom: 10px;
	right: 10px;
	cursor: pointer;
	display: block;
	z-index: 10;
}

.contect a {
	display: block;
}

.contect {
	white-space: nowrap;
	display: inline-flex;
	flex-direction: row-reverse;
}

.navicon_button {
	display: inline-block;
	cursor: pointer;
}



.close_button_all_screen {
	position: fixed;
	background-color: rgba(48, 48, 48);
	height: 100%;
	width: 100%;
	z-index: 7;
	opacity: 0.4;
	display: none;
}

.navicon_button_container {
	padding-top: 48px;
	    padding-left: 3px;
		
}

.bar1, .bar2, .bar3 {
  width: 39px;
  height: 6px;
  background-color: white;
  margin: 8px 0;
  transition: 0.4s;
  border-radius: 2px;
}
/*background-image: url("https://static.moooi.com/static/images/nav-button.png");*/
.navi_change .bar1 {
  -webkit-transform: rotate(-45deg) translate(-12px, 10px);
  transform: rotate(-45deg) translate(-12px, 10px);
}

.navi_change .bar2 {opacity: 0;}

.navi_change .bar3 {
  -webkit-transform: rotate(45deg) translate(-9px, -6px);
  transform: rotate(45deg) translate(-9px, -6px);
}

.navi_change_2 .bar1 {
  -webkit-transform: rotate(-45deg) translate(-9px, 8px);
  transform: rotate(-45deg) translate(-9px, 8px);
}

.navi_change_2 .bar2 {opacity: 0;}

.navi_change_2 .bar3 {
  -webkit-transform: rotate(45deg) translate(-7px, -5px);
  transform: rotate(45deg) translate(-7px, -5px);
}

.top_part_logo {
	color: white !important;
}


.fixed_menu_top a {
	border-radius: 8px;
	display: block;
	color: white;
	text-align: center;
	margin: 12px 20px;
	text-decoration: none;
	font-size: 25px;
	font-family: Bebas Neue, sans-serif;
	cursor: pointer;
}

.search_part_a {
	padding-top: 0px !important;
	padding-bottom: 0px !important;
	display: block;
}



@media only screen and (max-width: 350px) {
	.fixed_menu_top a {
		font-size: 13px;
		margin: 6px 1px;
	}
	.fixed_menu_top {
		height: 50px;
	}
	
	.main_container_2 {
		height: calc(100vh - 50px);
	}
	
	.fixed_menu_space {
		height: 50px;
	}
	
	.icon_top_div {
		width: 17px;
		padding: 5px;
	}
	.fixed_menu_container {
		margin-left: 2px;
		margin-right: 2px;
	}
	
	.top_part_logo {
		height: 30px;
		font-size: 15px;
	}
	
	.notification_number {
		left: 16px;
		top: 11px;
		font-size: 11px;
		height: 12px;
    width: 12px;
	}
	
	.small_slogan_text {
		font-size: 20px;
	}
	
	.big_slogan_text {
		font-size: 60px;
	}
			.small_slogan_text {
		font-size: 40px;
		margin-top: 5px;
		margin-bottom: 5px;
		-webkit-text-stroke: 1.5px black;
		text-shadow: 13px 13px 13px black,
        1px 1px 1px black,
	}
	
	.big_slogan_text {
		font-size: 70px;
		-webkit-text-stroke: 2px black;
		text-shadow: 1px 1px 1px black,
        1px 2px 1px black,
        1px 3px 1px black,
        1px 4px 1px black,
        1px 5px 1px black,
        1px 6px 1px black,
    1px 5px 6px rgba(16,16,16,0.4),
    1px 10px 10px rgba(16,16,16,0.2),
    1px 15px 35px rgba(16,16,16,0.2),
    1px 20px 60px rgba(16,16,16,0.4);
	}
}

@media only screen and (max-width: 600px) and (min-width: 351px){
	.fixed_menu_top a {
		font-size: 15px;
		margin: 6px 8px;
	}
	.fixed_menu_top {
		height: 45px;
	}
	
	
	
	.main_container_2 {
		height: calc(100vh - 45px);
	}
	
	.fixed_menu_space {
		height: 45px;
	}
	
	.icon_top_div {
		width: 19px;
		padding: 5px;
	}
	.fixed_menu_container {
		margin-left: 5px;
		margin-right: 5px;
	}
	
	.top_part_logo {
		height: 30px;
		font-size: 15px;
	}
	
	.notification_number {
		left: 19px;
		top: 13px;
		font-size: 14px;
		height: 16px;
		width: 16px;
	}
	
	.small_slogan_text {
		font-size: 30px;
	}
	
	.big_slogan_text {
		font-size: 100px;
	}
	
		.small_slogan_text {
		font-size: 40px;
		margin-top: 5px;
		margin-bottom: 5px;
		-webkit-text-stroke: 1.5px black;
		text-shadow: 13px 13px 13px black,
        1px 1px 1px black,
	}
	
	.big_slogan_text {
		font-size: 90px;
		-webkit-text-stroke: 3px black;
		text-shadow: 1px 1px 1px black,
        1px 2px 1px black,
        1px 3px 1px black,
        1px 4px 1px black,
        1px 5px 1px black,
        1px 6px 1px black,
        1px 7px 1px black,
        1px 8px 1px black,
    1px 10px 6px rgba(16,16,16,0.4),
    1px 15px 10px rgba(16,16,16,0.2),
    1px 20px 35px rgba(16,16,16,0.2),
    1px 25px 60px rgba(16,16,16,0.4);
	}
}

@media only screen and (min-width: 601px) and (max-width: 1000px) {/*1000px TEN SONRA ÇALIŞIR VE 601PX DE DURUR*/
	.fixed_menu_top a {
		font-size: 17px;
		margin: 6px 8px;
	}
	
	.fixed_menu_top {
		height: 55px;
	}
	
	.main_container_2 {
		height: calc(100vh - 55px);
	}
	
	.fixed_menu_space {
		height: 55px;
	}
	
	.icon_top_div {
		width: 22px;
		padding: 10px;
	}
	
	.fixed_menu_container {
		margin-left: 15px;
		margin-right: 15px;
	}
	
	.top_part_logo {
		height: 40px;
		font-size: 20px;
	}
	
	.notification_number {
		left: 27px;
		top: 20px;
		font-size: 14px;
		height: 16px;
		width: 16px;
	}
	
	.mini_logo_top {
		
	}
	
		
	.small_slogan_text {
		font-size: 40px;
		margin-top: 5px;
		margin-bottom: 5px;
		-webkit-text-stroke: 1.5px black;
		text-shadow: 13px 13px 13px black,
        1px 1px 1px black,
	}
	
	.big_slogan_text {
		font-size: 120px;
		-webkit-text-stroke: 3px black;
		text-shadow: 1px 1px 1px black,
        1px 2px 1px black,
        1px 3px 1px black,
        1px 4px 1px black,
        1px 5px 1px black,
        1px 6px 1px black,
        1px 7px 1px black,
        1px 8px 1px black,
        1px 9px 1px black,
    1px 15px 6px rgba(16,16,16,0.4),
    1px 20px 10px rgba(16,16,16,0.2),
    1px 23px 35px rgba(16,16,16,0.2),
    1px 28px 60px rgba(16,16,16,0.4);
	}
}
/*$(".fixed_menu_container").css("margin-right", 25);*/

@media only screen and (max-width: 1000px) { /*1000px TEN SONRA ÇALIŞIR VE 0PX E KADAR DEVAM EDER*/
	.search_part_a {
		display: none !important;
	}
	
	
}

@media only screen and (min-width: 1001px) { 
	.fixed_menu_container {
		margin-left: 50px;
		margin-right: 50px;
	}


	.notification_number {
		left: 38px;
		top: 30px;
		font-size: 17px;
		height: 20px;
		width: 20px;
	}
	
	.notification_bell {
		padding-bottom: 0px !important;
	}
	
	.fixed_menu_top {
		height: 60px;
	}
	
	.main_container_2 {
		height: calc(100vh - 60px);
	}
	
	.fixed_menu_space {
		height: 60px;
	}
	
	.top_part_logo {
		height: 50px;
		font-size: 22px;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	
	.icon_top_div {
		top: 0px;
		width: 33px;
		padding: 15px;
		margin: 0px;
	}
	
	.mini_logo_top {
		position: relative;
		top: 2px;
	}
	
	.small_slogan_text {
		font-size: 40px;
		margin-top: 5px;
		margin-bottom: 5px;
		-webkit-text-stroke: 1.5px black;
		text-shadow: 13px 13px 13px black,
        1px 1px 1px black,
	}
	
	.big_slogan_text {
		font-size: 150px;
		-webkit-text-stroke: 3px black;
		text-shadow: 1px 1px 1px black,
        1px 2px 1px black,
        1px 3px 1px black,
        1px 4px 1px black,
        1px 5px 1px black,
        1px 6px 1px black,
        1px 7px 1px black,
        1px 8px 1px black,
        1px 9px 1px black,
        1px 10px 1px black,
    1px 18px 6px rgba(16,16,16,0.4),
    1px 22px 10px rgba(16,16,16,0.2),
    1px 25px 35px rgba(16,16,16,0.2),
    1px 30px 60px rgba(16,16,16,0.4);
	}
}



.notification_number {
	position: absolute;
	border-radius: 50%;
	background-color: red;
	color: white;
}

.icon_top_div {
	position: relative;
}




.submit_button {
	padding: 15px;
	margin-top: 0px;
	margin-right: 20px;
	border-radius: 100px;
}

.microphone_button_top_a {
	border-radius: 50px;
}

.microphone_button_top {
	padding: 20px;
}

.fixed_menu_top a:hover {
	animation: button_background_hover_ani 0.13s ease-in-out;
	background: rgba(255, 255, 255, 0.2);
}

.copywrite_part {
	background: black;
	font-size: 18px;
}

.main_container {
	display: flex;
	align-items: center;
    justify-content: center;
}

.main_container_outer {
    display: flex;
    width: auto;
    justify-content: center;
    flex-wrap: wrap;
    flex-direction: row;
}


.main_menu_content_outer {
	background: black;
	border-radius: 20px;
	height: 240px;
	width: 240px;
	display: flex;
	flex-direction: column;
    align-items: center;
    justify-content: center;
	position: relative;
	z-index: 0;
	cursor: pointer;
	margin: 20px;
	overflow: hidden;
}

.main_menu_content_outer:hover {
	background: rgba(40,40,40,1.00);
	text-shadow: -1px 0 black, 0 1px white, 1px 0 white, 0 -1px white;
	border: rgba(26,23,23,0.5) solid 4px;
	color: black;
	height: 232px;
	width: 232px;
	
	
}
	
.main_container_inner_bg {
	position: absolute;
	z-index: 2;
	font-size: 150px;
	color: rgba(255,255,255,0.5);
}