@import url('https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@400&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inconsolata:wght@400;500;600&display=swap');
/* @import url('https://fonts.googleapis.com/css2?family=Electrolize&display=swap'); */
:root {
	--color1: #4680FF;
}* {
	position: relative;
	margin: 0;
    padding: 0;
    box-sizing: border-box;
}body, html {
	font-family: 'Calibri', sans-serif;
	font-size: 18px;
	text-decoration: none;
	font-weight: normal;
	color: #282828;
	background-color: #ecf0f5;
}a {
	text-decoration: none;
	color: inherit;
}a:hover {
	color: #d32f2f;
}.border {
	border: 1px solid #FF0032;
}.fcc {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
}.fcl {
	position: relative;
	display: flex;
	justify-content: flex-start;
	align-items: center;
}.fcr {
	position: relative;
	display: flex;
	justify-content: flex-end;
	align-items: center;
}.f100 {
	width: 100%;
}.controls {
	display: grid;
	grid-template-columns: auto auto;
}.none {
	display: none;
}.sf {
	font-family: 'Inconsolata', monospace;
	font-weight: 500;
}.logo_list {
	width: 60px;
    height: 40px;
    object-position: center;
    object-fit: contain;
}.point {
	cursor: pointer;
}.point:hover {
	color: var(--color1);
}.red {
	color: #DC3545;
}.yellow {
	color: #FFC107;
}.font0 {
	font-size: 0;
}.lgl {
	position: relative;
	width: min-content;
	display: grid;
	grid-template-columns: 60px auto;
	height: 40px;
	column-gap: 10px;
}.nowrap {
	white-space: nowrap;
}.logo_30x20 {
    width: 30px;
    height: 20px;
    object-position: center;
    object-fit: contain;
}.logo_45x30 {
    width: 45px;
    height: 30px;
    object-position: center;
    object-fit: contain;
}.logo_60x40 {
    width: 60px;
    height: 40px;
    object-position: center;
    object-fit: contain;
}.adet {
	font-size: 20px !important;
	font-family: 'Inconsolata', monospace;
	font-weight: 400;
}


/* Link */
.link1:hover {
	cursor: pointer;
	color: var(--color1);
}
/* Link */


div#app {
	position: relative;
	opacity: 0;
	z-index: 50;
}div#_app {
	position: fixed;
	inset: 0;
	z-index: 555;
	background-color: #FFF;
	display: flex;
	justify-content: center;
	align-items: center;
	user-select: none;
}div#_app img {
	position: absolute;
}


/* Bekleme */
div#loading {
	position: fixed;
	inset: 0;
	z-index: 555;
	background-color: rgba(0, 0, 0, .6);
	display: none;
	justify-content: center;
	align-items: center;
	user-select: none;
}
/* Bekleme */


/* Top */
div#arama {
	position: fixed;
	left: 0px;
	right: 0px;
	top: -100px;
	background-color: #FFF;
	z-index: 150;
	padding: 10px 20px 20px 20px;
	box-shadow: 1px 0px 6px rgba(0,0,0,.3);
	z-index: 100;
}div#arama input {
	position: relative;
	width: 100%;
	padding: 10px;
	font-family: 'Open Sans', sans-serif;
	font-size: 14px;
	border: none;
	background: none;
	outline: none;
	border-bottom: 1px solid #ced4da;
}div#arama input:focus {
	outline: 0;
	border-bottom: 1px solid #666;
}div#arama div.kapat {
	position: absolute;
	top: 0px;
	right: 0px;
	width: 50px;
	height: 50px;
	font-size: 20px;
	color: #555;
	cursor: pointer;
	user-select: none;
}div#arama div.kapat:hover {
	color: #000;
}



div#top {
    position: relative;
    height: 50px;
    display: grid;
    grid-template-columns: auto auto;
    z-index: 1;
}div#top:after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	height: 190px;
	background-color: var(--color1);
	z-index: -1;
}div#top .icon {
	position: relative;
	width: 50px;
	height: 50px;
	display: flex;
	justify-content: center;
	align-items: center;
	color: #FFF;
	font-size: 15px;
	cursor: pointer;
	user-select: none;
}div#top .left {
	position: relative;
	padding-left: 20px;
}div#top .right {
	position: relative;
	padding-right: 20px;
}div#top .menu_btn div {
	position: absolute;
	left: 15px;
	background-color: #dae6ff;
	height: 2px;
	transition: 400ms all;
}div#top .menu_btn:hover div {
	width: 17px;
}div#top div.m1 {
	top: 17px;
	width: 7px;
}div#top div.m2 {
	top: 23px;
	width: 17px;
}div#top div.m3 {
	top: 29px;
	width: 12px;
}

/* Top */


/* page */
div#page {
    position: relative;
    margin-left: 225px;
    padding: 25px;
    z-index: 2;
}div#page div.page_top {
    position: relative;
    margin-bottom: 20px;
}div#page div.page_top h5 {
    padding: 0;
    margin: 0;
    margin-bottom: 15px;
    font-weight: 400;
    color: #fff;
    font-size: 20px;
    text-transform: uppercase;
}div#page div.page_top div.nav {
    display: flex;
    flex-wrap: wrap;
    font-size: 15px;
    color: #fff;
    font-weight: 600;
    text-transform: capitalize;
}div#page div.page_top div.nav div {
	position: relative;
	margin-right: 10px;
}div#page div.page_top div.nav div:after {
	content: "/";
	position: relative;
	margin-left: 10px;
}div#page div.page_top div.nav div:last-child:after {
	display: none;
}div#page div.page_top div.nav a {
	position: relative;
}div#page div.page_top div.nav a:hover {
	color: #FFF;
}div#window {
	position: relative;
    background-color: #FFF;
    border-radius: 4px;
    box-shadow: 1px 1px 8px rgb(0 0 0 / 40%);
    padding: 20px;
    margin-bottom: 20px;
}
/* page */

/* Menü */
div#menu {
    position: absolute;
    left: 0px;
    top: 50px;
    width: 230px;
    height: auto;
    background-color: #FFF;
    z-index: 10;
    border-radius: 0px 6px 6px 0px;
    opacity: 0;
}div#menu div.avatar {
    position: relative;
    padding: 25px 25px 10px;
    text-align: center;
}div#menu div.avatar img {
    position: relative;
    text-align: center;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    cursor: pointer;
}div#menu div.avatar div.daha_fazla {
    font-size: 15px;
    margin-top: 6px;
    color: #555;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
}div#menu div.avatar div.daha_fazla i {
	margin-left: 6px;
	color: #555;
}div#menu div.usermenu_toggle {
    display: none;
}div#menu div.usermenu {
    position: relative;
    border-top: 1px solid #cbd3e0;
    border-bottom: 1px solid #cbd3e0;
    height: 48px;
    margin-left: 23px;
    margin-right: 23px;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
}div#menu div.usermenu div.eventCikis {
	cursor: pointer;
	color: red;
}div#menu div.usermenu a:hover {
	color: #555;
}div#menu ul#menu {
    position: relative;
    margin: 15px 0px;
    padding: 0;
    list-style-type: none;
}div#menu ul#menu div.menu_content {
	position: relative;
	background-color: #dfe5e7;
    color: #555;
    font-weight: 600;
    height: 44px;
    cursor: pointer;
    font-size: 16px;
    box-sizing: border-box;
    border-radius: 4px;
    display: grid;
    grid-template-columns: 30px auto 30px;
    padding: 0 6px;
    margin: 0 10px 6px 10px;
}div#menu ul#menu li.menu_active .menu_content {
	background-color: var(--color1);
	color: #FFF;
	box-shadow: 0px 4px 6px rgb(0 0 0 / 30%);
}div#menu ul#menu div.menu_content svg {
	fill: #555;
}div#menu ul#menu li.menu_active .menu_content svg {
	fill: #FFF;
}div#menu ul#menu div.menu_content .tik {
	transform: rotate(0deg);
	transition: 400ms;
}div#menu ul#menu li.menu_active .menu_content .tik {
	transform: rotate(90deg);
}div#menu ul#menu ul.submenu_content {
	display: none;
	margin-bottom: 20px;
}div#menu ul#menu ul.submenu_content a {
	position: relative;
	height: 39px;
	border-bottom: 1px solid #ededed;
	display: grid;
	grid-template-columns: 20px auto;
	gap: 5px;
	padding: 0 10px;
	font-size: 15px;
	color: #555;
}div#menu ul#menu ul.submenu_content a svg {
	transform: rotate(-90deg);
}div#menu ul#menu li.active_start ul.submenu_content {
	display: block;
}div#menu ul#menu ul.submenu_content li.altmenu_active a {
	color: var(--color1);
}div#menu ul#menu ul.submenu_content li.altmenu_active a svg {
	fill: var(--color1);
}
/* Menü */


/* rippe */
.beyaz {
	position: absolute;
	z-index: 999;
	border-radius: 50%;
	transform: scale(0);
	animation: ripple 600ms linear;
	background-color: rgba(255, 255, 255, 0.7);
}.gri {
	position: absolute;
	border-radius: 50%;
	transform: scale(0);
	animation: ripple 600ms linear;
	background-color: rgba(200, 200, 200, 0.7);
}.mavi {
	position: absolute;
	border-radius: 50%;
	transform: scale(0);
	animation: ripple 600ms linear;
	background-color: rgba(70, 128, 255, 0.7);
}.slowbeyaz {
	position: absolute;
	z-index: 999;
	border-radius: 50%;
	transform: scale(0);
	animation: ripple 1200ms linear;
	background-color: rgba(255, 255, 255, 0.4);
}@keyframes ripple {
	to {
		transform: scale(4);
		opacity: 0;
	}
}
/* rippe */




/* input */
.inp {
	position: relative;
	display: flex;
	flex-flow: column-reverse;
	width: 100%;
	margin-bottom: 20px;
}.inp:focus-within:after {
	content: "";
	position: absolute;
	bottom: 0px;
	height: 2px;
	left: 0%;
	width: 100%;
	background-color: var(--color1);
	animation: inp_aktif 300ms linear;
}@keyframes inp_aktif {
	from {
		width: 0%;
		left: 50%
	} to {
		width: 100%;
		left: 0%;
	}
}.inp label, .inp input, .inp select, .inp textarea {
	transition: all 0.2s;
	touch-action: manipulation;
	resize: none;
}.inp label {
	letter-spacing: 0.05em;
	text-align: left;
	font-size: 16px;
	font-weight: normal;
	font-family: inherit;
}.inp input, .inp select, .inp textarea {
	position: relative;
	width: 100%;
	padding: 10px 0;
	font-family: inherit;
	font-size: 16px;
	border: none;
	background: none;
	outline: none;
	border-bottom: 1px solid #ced4da;
}.inp input:focus, .inp select, .inp textarea {
	outline: 0;
	border-bottom: 1px solid #666;
}.inp input:placeholder-shown + label,
	.inp input:placeholder-shown + select,
	.inp input:placeholder-shown + textarea {
	cursor: text;
	max-width: 66.66%;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	text-align: left;
	transform-origin: left bottom;
	transform: translate(0, 1.8rem) scale(1);
	opacity: 1;
	font-size: 16px;
}.inp input::-webkit-input-placeholder,
	.inp select::-webkit-input-placeholder,
	.inp textarea::-webkit-input-placeholder {
	opacity: 0;
	transition: inherit;
}.inp input:focus::-webkit-input-placeholder,
	.inp select:focus::-webkit-input-placeholder,
	.inp textarea:focus::-webkit-input-placeholder {
	opacity: 1;
}.inp input:not(:placeholder-shown) + label,
	.inp input:focus + label,
	.inp select:not(:placeholder-shown) + label,
	.inp select:focus + label,
	.inp textarea:not(:placeholder-shown) + label,
	.inp textarea:focus + label {
	transform: translate(0, 6px) scale(1);
	cursor: pointer;
	color: var(--color1);
	font-size: 16px;
}.inp input:not(:placeholder-shown) + .none,
	.inp input:focus + .none,
	.inp select:not(:placeholder-shown) + .none,
	.inp select:focus + .none,
	.inp textarea:not(:placeholder-shown) + .none,
	.inp textarea:focus + .none {
	opacity: 1 !important;
}.inp .none {
	opacity: 0 !important;
}
/* input */



/* Button */
.btn1 {
    position: relative;
    height: 43px;
    border-radius: 2px;
    white-space: nowrap;
    border: none;
    color: #FFF;
    padding: 0px 20px;
    outline: none;
    font-family: inherit;
    font-size: 14px;
    font-weight: 600;
    user-select: none;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    cursor: pointer;
}



.btn_yesil {
    background-color: #9ccc65;
}.btn_yesil:hover {
    background-color: #80a754;
}.btn_yesil:disabled {
    background-color: #9ccc65;
    color: #000;
    cursor: default;
    opacity: .4;
}.btn_kirmizi {
    background-color: #FF5252;
}.btn_kirmizi:hover {
    background-color: #d64545;
}.btn_gri {
    background-color: #6c757d;
}.btn_gri:hover {
    background-color: #51585e;
}.btn_turuncu {
    background-color: #FFBA57;
}.btn_turuncu:hover {
    background-color: #dda14b;
}.btn_turkuaz {
    background-color: #4cc3c7;
}.btn_turkuaz:hover {
    background-color: #2cbcc1;
}.btn_mavi {
    background-color: #4680FF;
}.btn_mavi:hover {
    background-color: #4680FF;
}
/* Button */



/* MASK */
#mask {
	position: fixed;
	inset: 0;
	background-color: rgba(0, 0, 0, .8);
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 9999;
}#mask .err {
	position: relative;
	padding: 20px;
	background-color: #FFF;
	border-radius: 6px;
	min-width: 400px;
}#mask .err h1 {
	position: relative;
	font-size: 20px;
}#mask .err p {
	position: relative;
	font-size: 16px;
	padding: 10px 0;
}#mask .err button {
	float: right;
}#mask .confirm {
	position: relative;
    width: 500px;
    height: min-content;
    background-color: #FFF;
    border-radius: 4px;
    box-shadow: 1px 1px 3px rgb(0 0 0 / 30%);
}#mask .confirm .header {
    position: relative;
    height: 64px;
    border-bottom: 1px solid #e3eaef;
    color: #37474f;
    font-weight: 400;
    margin-left: 20px;
    margin-right: 20px;
    font-size: 20px;
    display: flex;
    align-items: center;
}#mask .confirm .content {
    position: relative;
    padding: 20px;
    font-size: 16px;
}#mask .confirm .footer {
    position: relative;
    height: 54px;
    border-top: 1px solid #e3eaef;
    color: #37474f;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin-left: 12px;
    margin-right: 12px;
}#mask .confirm .footer .btn1 {
	margin-left: 10px;
}#mask .info {
	position: relative;
	padding: 20px;
	background-color: #FFF;
	border-radius: 6px;
}#mask .info i {
	font-size: 45px;
	color: #555;
}#mask .info p {
	position: relative;
	font-size: 16px;
	padding: 10px 0;
	text-align: center;
}#mask .pop {
	position: relative;
	padding: 20px;
	background-color: #FFF;
	border-radius: 6px;
	display: grid;
	grid-template-rows: min-content auto min-content;
	gap: 10px;
	overflow: auto;
}#mask .pop h1 {
	position: relative;
	font-size: 20px;
}#mask .pop p {
	position: relative;
	font-size: 16px;
	padding: 10px 0;
}#mask .pop button {
	float: right;
}#mask .eventInput {
	position: relative;
    height: min-content;
    background-color: #FFF;
    border-radius: 4px;
    box-shadow: 1px 1px 3px rgb(0 0 0 / 30%);
}#mask .eventInput .header {
    position: relative;
    height: 64px;
    border-bottom: 1px solid #e3eaef;
    color: #37474f;
    font-weight: 400;
    margin-left: 20px;
    margin-right: 20px;
    font-size: 20px;
    display: flex;
    align-items: center;
}#mask .eventInput .footer {
    position: relative;
    height: 54px;
    border-top: 1px solid #e3eaef;
    color: #37474f;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin-left: 12px;
    margin-right: 12px;
}#mask .eventInput .footer .btn1 {
	margin-left: 10px;
}#mask .eventInput .content {
    position: relative;
    padding: 20px;
    font-size: 16px;
}


/* MASK */



/* Tab */
.tab {
	position: relative;
}.tab ul, li {
	padding: 0;
	margin: 0;
	list-style-type: none;
}.tab ul:nth-child(1){
	position: relative;
	display: flex;
	border-bottom: 1px solid #dee2e6;
}.tab ul:nth-child(1) li {
	position: relative;
	font-size: 15px;
	font-weight: 400;
	user-select: none;
	cursor: pointer;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	padding: 10px 16px;
	border-radius: 6px 6px 0px 0px;
	text-transform: uppercase;
	font-family: inherit;
    font-size: 14px;
    font-weight: 400;
    color: #4680ff;
}.tab ul:nth-child(1) li i {
	font-size: 20px;
	margin-right: 6px;
}.tab ul:nth-child(2){
	position: relative;
	padding: 20px;
}.tab ul:nth-child(2) li {
	display: none;
}.tab .aktif {
	color: #495057 !important;
}.tab .aktif:after {
	content: "";
	position: absolute;
	bottom: 0px;
	height: 2px;
	left: 0%;
	width: 100%;
	background-color: #4680ff;
	animation: aktif_anima 300ms linear;
}.tab .pasif:after {
	content: "";
	position: absolute;
	bottom: 0px;
	height: 2px;
	left: 50%;
	width: 0%;
	background-color: #4680ff;
	animation: pasif_anima 300ms linear;
}.tab .ajaxtab_data {
	position: relative;
	margin-top: 20px;
}
@keyframes aktif_anima {
	from {
		width: 0%;
		left: 50%
	} to {
		width: 100%;
		left: 0%;
	}
}
@keyframes pasif_anima {
	from {
		width: 100%;
		left: 0%
	} to {
		width: 0%;
		left: 50%;
	}
}

/* Tab */



/* Check */
.secToggle {
	position: relative;
	width: 32px;
	height: 32px;
	overflow: hidden;
	margin: auto;
	font-size: 22px;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
}
/* Check */