@charset "UTF-8";
@import "../bootstrap/css/bootstrap.min.css";
@import "../font-awesome/css/font-awesome.css";
@import "../animate/animate.min.css";
@import "../aos/aos.css";
@import "button.css";
@import "tag.css";
@import "https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,500;1,600;1,800;1,900&display=swap%27";

* {
  box-sizing: border-box;
  font-family: -apple-system, BlinkMacSystemFont, "Poppins", sans-serif;
}

html,body {
	margin: 0;
	padding: 0;
}

body {
	font-size: 1rem;
	color: #0f2666;
	font-weight: 400;
	background-color: #f0f0f8;
	overflow-y: hidden;
	height: auto;
}

.topBar {
	position: -webkit-sticky;
    position: sticky;
    top: 0;
    background: rgb(102,67,146);
	background: -moz-linear-gradient(320deg, rgba(102,67,146,1) -5%, rgba(42,41,93,1) 100%);
	background: -webkit-linear-gradient(320deg, rgba(102,67,146,1) -5%, rgba(42,41,93,1) 100%);
	background: linear-gradient(320deg, rgba(102,67,146,1) -5%, rgba(42,41,93,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#664392",endColorstr="#2a295d",GradientType=1);
    color: white;
    height: 60px;
    display: flex; /* Flexbox kullanarak içeriği yatay olarak hizala */
    align-items: center; /* İçeriği dikey olarak ortala */
    padding: 0 20px; /* İçeriklerle aralara boşluk eklemek için */
}

.topBar div {
    flex-grow: 1; /* İçeriklerin eşit genişlikte olmasını sağlar */
    text-align: center;
}

.logo {
	height: 40px !important;
}

#container {
    position: relative;
    height: calc(100vh - 60px);
    overflow: hidden;
}

.background-container {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: -1;
}

#container iframe {
	width: 100%;
	height: 100%;
	border: 0px !important;
}

.loader {
    display: inline-block;
    width: 50px;
    height: 50px;
    border: 3px solid #f3f3f3;
    border-top: 3px solid #3498db;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}