@charset "utf-8";

	@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@500;600;700&display=swap');
		body {margin: 0 auto;}

 
.header { display: block; background: rgb(222,222,222); background: linear-gradient(0deg, rgba(222,222,222,1) 0%, rgba(255,255,255,0) 100%); }
.header-in{ margin-left: auto; margin-right: auto; position: relative; height: 480px;  }
.logocon a {width: 85%; display: block;  top: 55%; left: 5%; position: absolute;  }
.menu-in{width: 80%; padding: 3px; margin-left: auto; margin-right: auto;}
.duyuru-holder{width: 100%; display: block; background: rgb(247,147,30);background: linear-gradient(0deg, rgba(247,147,30,1) 0%, rgba(240,90,40,1) 100%);}
.menu-holder{width: 100%; display: block; background: rgb(222,222,222); background: linear-gradient(0deg, rgba(222,222,222,1) 0%, rgba(255,255,255,0) 100%);}
.duyuru-in{width: 80%; padding: 10px; margin-left: auto; margin-right: auto; position: relative; overflow: auto;}
.duyuru-baslik{font-size: 18pt; color: #FFFFFF; padding: 8px; display: block; font-family: 'Manrope', sans-serif; font-weight: bold; float: left;}
.duyuru-icerik{font-size: 16pt; color: #191919; padding: 8px; width: 85%; display: block; font-family: 'Manrope', sans-serif; font-weight: bold; float: left; background: #FFFFFF; border: solid 1px #DBDBDB; border-radius: 8px}

		.title-holder {width: 100%; display: block; background: rgb(222,222,222); background: linear-gradient(0deg, rgba(222,222,222,1) 0%, rgba(255,255,255,0) 100%); }
		.title-main{width: 80% ;padding: 5px; margin-right: auto; margin-left: auto;}
		.title h1 {font-family: 'Manrope', sans-serif; font-size: 26pt; color: #454545; fl }
		.main {width: 100%; display: block; background-image: url("images/bg1.jpg"); background-size: cover; position: relative;}
.main1 {width: 100%; display: block; background-image: url("img/bg1.jpg"); background-size: cover; position: relative; }
	.congressarea {display: block; width: 98%; padding: 2px; position: relative; height: 1500px;}
.stantarea {display: block; width: 98%; padding: 2px; position: relative; height: 1200px;}

.canlicerrahi a { position: absolute; left: 16%; top: 5%; width: 50%; transition: all .2s ease-in-out; z-index: 1; animation: 1s ease-out 1s 1 slideInFromTop;}
.canlicerrahi a:hover {width: 51%; z-index: 1000;  }

.sozlubildiri a { position: absolute; left: 53%; top: 2%; width: 35%; transition: all .2s ease-in-out; z-index: 3; animation: 2s ease-out 1s 1 slideInFromTop;}
.sozlubildiri a:hover {width: 36%; z-index: 1000;  }

.eposter a { position: absolute; left: 6%; top: 24%; width: 33%; transition: all .2s ease-in-out; z-index: 6; animation: 1s ease-out 1s 1 slideInFromTop;}
.eposter a:hover {width: 34%; z-index: 1000;  }

.anasalon a {position: absolute; left: 33%; top: 18%; width: 65%; transition: all .2s ease-in-out; z-index: 4; animation: 1s ease-out 1s 1 slideInFromTop;}
.anasalon a:hover {width: 66%; z-index: 1000; }

.stantalani a {position: absolute; left: 2%; top: 42%; width: 65%; transition: all .2s ease-in-out; z-index: 8; animation: 2s ease-out 1s 1 slideInFromTop;}
.stantalani a:hover {width: 66%; z-index: 1000; }

.sosyalprogram a {position: absolute; left: 44%; top: 82%; width: 28%; transition: all .2s ease-in-out; z-index: 18; animation: 1s ease-out 1s 1 slideInFromTop;}
.sosyalprogram a:hover {width: 29%; z-index: 1000; }
.vaka a {position: absolute; left: 38%; top: 58%; width: 51%; transition: all .2s ease-in-out; z-index: 10; animation: 1s ease-out 1s 1 slideInFromTop;}
.vaka a:hover {width: 42%; z-index: 1000;  }

.eforum a {position: absolute; left: 65%; top: 48%; width: 35%; transition: all .2s ease-in-out; z-index: 0; animation: 3s ease-out 1s 1 slideInFromTop;}
.eforum a:hover {width: 36%; z-index: 1000;  }

.kurs a {position: absolute; left: 5%; top: 72%; width: 35%; transition: all .2s ease-in-out; z-index: 4; animation: 3s ease-out 1s 1 slideInFromTop;}
.kurs a:hover {width: 36%; z-index: 1000;  }

.kayit a {position: absolute; left: 2%; top: 1%; width: 30%; transition: all .2s ease-in-out; z-index: 0;  animation: 2s ease-out 1s 1 slideInFromTop; }
.kayit a:hover {width: 31%; z-index: 1000;  }

@keyframes slideInFromTop {
  0% {
    transform: translateY(-40%);
	  opacity: 0;
  }
  100% {
    transform: translateY(0);
	  opacity: 1;
  }
}



	.stantlinka a {position: absolute; left: 35%; top: 5%; width: 300px;  transition: all .2s ease-in-out;}
	.stantlinka a:hover { width: 305px;  z-index: 1000; transform: scale(1.1); }
	
	.stantlinkb a {position: absolute; left: 5%; top: 5%; width: 250px;  transition: all .2s ease-in-out;}
	.stantlinkb a:hover { width: 255px;  z-index: 1000; transform: scale(1.1);}
		
	.stantlinkc a {position: absolute; left: 70%; top: 5%; width:250px;  transition: all .2s ease-in-out;}
	.stantlinkc a:hover { width: 255px; z-index: 1000; transform: scale(1.1); }
		
	.stantlinkh a {position: absolute; left: 6%; top: 45%; width: 201px;  transition: all .2s ease-in-out;}
	.stantlinkh a:hover { width: 205px;  z-index: 1000; transform: scale(1.1); }
	
	.stantlinki a {position: absolute; left: 28%; top: 45%; width: 201px;  transition: all .2s ease-in-out;}
	.stantlinki a:hover { width: 205px; z-index: 1000; transform: scale(1.1);}
		
	.stantlinkj a {position: absolute; left: 52%; top: 45%; width: 201px;  transition: all .2s ease-in-out;}
	.stantlinkj a:hover { width: 205px;  z-index: 1000; transform: scale(1.1); }
		
	.stantlinkk a {position: absolute; left: 74%; top: 45%; width: 201px;  transition: all .2s ease-in-out;}
	.stantlinkk a:hover { width: 205px;  z-index: 1000; transform: scale(1.1);}
		
	.stantlinkd a {position: absolute; left: 6%; top: 28%; width: 201px;  transition: all .2s ease-in-out;}
	.stantlinkd a:hover { width: 205px;  z-index: 1000; transform: scale(1.1);}
		
	.stantlinke a {position: absolute; left: 28%; top: 28%; width: 201px; transition: all .2s ease-in-out;}
	.stantlinke a:hover { width: 205px;  z-index: 1000; transform: scale(1.1);}
		
	.stantlinkf a {position: absolute; left: 51%; top: 28%; width: 201px;  transition: all .2s ease-in-out;}
	.stantlinkf a:hover { width: 205px;  z-index: 1000; transform: scale(1.1);}
		
	.stantlinkg a {position: absolute; left: 74%; top: 28%; width: 201px;  transition: all .2s ease-in-out;}
	.stantlinkg a:hover { width: 205px; z-index: 1000; transform: scale(1.1);}


.digersponsor {position: absolute; top: 65%; font-family: 'Manrope', sans-serif; margin-left: auto; margin-right: auto; padding: 10px; width: 95%}

@media only screen and (min-width: 1025px) {


.header { display: block; background: rgb(222,222,222); background: linear-gradient(0deg, rgba(222,222,222,1) 0%, rgba(255,255,255,0) 100%); }
.header-in{width: 90%; margin-left: auto; margin-right: auto; height: 145px; }
.logocon{width: 409px; display: block; position: absolute; top: 15%; left: 5%;  }
.logoavrasya a {width: 125px; display: block; position: absolute; top: 28%; right: 20%; }
.logottob a {width: 148px; display: block; position: absolute; top: 28%; right: 10%;  }
.menu-in{width: 80%; padding: 3px; margin-left: auto; margin-right: auto;}
.duyuru-holder{width: 100%; display: block; background: rgb(247,147,30);background: linear-gradient(0deg, rgba(247,147,30,1) 0%, rgba(240,90,40,1) 100%);}
.menu-holder{width: 100%; display: block; background: rgb(222,222,222); background: linear-gradient(0deg, rgba(222,222,222,1) 0%, rgba(255,255,255,0) 100%);}
.duyuru-in{width: 80%; padding: 10px; margin-left: auto; margin-right: auto; position: relative; overflow: auto;}
.duyuru-baslik{font-size: 13pt; color: #FFFFFF; padding: 8px; display: block; font-family: 'Manrope', sans-serif; font-weight: bold; float: left;}
.duyuru-icerik{font-size: 12pt; color: #191919; padding: 8px; width: 85%; display: block; font-family: 'Manrope', sans-serif; font-weight: bold; float: left; background: #FFFFFF; border: solid 1px #DBDBDB; border-radius: 8px}

		.title-holder {width: 100%; display: block; background: rgb(222,222,222); background: linear-gradient(0deg, rgba(222,222,222,1) 0%, rgba(255,255,255,0) 100%); }
		.title-main{width: 80% ;padding: 5px; margin-right: auto; margin-left: auto;}
		.title h1 {font-family: 'Manrope', sans-serif; font-size: 26pt; color: #454545; fl }
		.main {width: 100%; display: block; background-image: url("images/bg.jpg"); background-size: cover;}
.main1 {width: 100%; display: block; background-image: url("images/bg1.jpg"); background-size: cover; overflow: auto;}
	.stantarea {display: block; width: 1200px; height: 800px; margin-left: auto; margin-right: auto; padding: 10px; position: relative; }


.canlicerrahi a { position: absolute; left: 16%; top: 3%; width: 25%; transition: all .2s ease-in-out; z-index: 0; animation: 1s ease-out 1s 1 slideInFromTop;}
.canlicerrahi a:hover {width: 26%; z-index: 1000;  }

.sozlubildiri a { position: absolute; left: 41%; top: 88px; width: 23%; transition: all .2s ease-in-out; z-index: 3; animation: 2s ease-out 1s 1 slideInFromTop;}
.sozlubildiri a:hover {width: 24%; z-index: 1000;  }

.eposter a { position: absolute; left: 56%; top: 2%; width: 18%; transition: all .2s ease-in-out; z-index: 0; animation: 1s ease-out 1s 1 slideInFromTop;}
.eposter a:hover {width: 19%; z-index: 1000;  }

.anasalon a {position: absolute; left: 53%; top: 17%; width: 29%; transition: all .2s ease-in-out; z-index: 4; animation: 1s ease-out 1s 1 slideInFromTop;}
.anasalon a:hover {width: 30%; z-index: 1000; }

.stantalani a {position: absolute; left: 22%; top: 29%; width: 35%; transition: all .2s ease-in-out; z-index: 4; animation: 2s ease-out 1s 1 slideInFromTop;}
.stantalani a:hover {width: 36%; z-index: 1000; }

.sosyalprogram a {position: absolute; left: 7%; top: 29%; width: 16%; transition: all .2s ease-in-out; z-index: 3; animation: 1s ease-out 1s 1 slideInFromTop;}
.sosyalprogram a:hover {width: 17%; z-index: 1000; }
.vaka a {position: absolute; left: 69%; top: 39%; width: 25%; transition: all .2s ease-in-out; z-index: 4; animation: 1s ease-out 1s 1 slideInFromTop;}
.vaka a:hover {width: 26%; z-index: 1000;  }

.eforum a {position: absolute; left: 48%; top: 51%; width: 25%; transition: all .2s ease-in-out; z-index: 4; animation: 3s ease-out 1s 1 slideInFromTop;}
.eforum a:hover {width: 26%; z-index: 1000;  }

.kurs a {position: absolute; left: 35%; top: 59%; width: 15%; transition: all .2s ease-in-out; z-index: 4; animation: 3s ease-out 1s 1 slideInFromTop;}
.kurs a:hover {width: 16%; z-index: 1000;  }

.kayit a {position: absolute; left: 8%; top: 50%; width: 21%; transition: all .2s ease-in-out; z-index: 8;  animation: 2s ease-out 1s 1 slideInFromTop; }
.kayit a:hover {width: 22%; z-index: 1000;  }

@keyframes slideInFromTop {
  0% {
    transform: translateY(-40%);
	  opacity: 0;
  }
  100% {
    transform: translateY(0);
	  opacity: 1;
  }
}



	.stantlinka a {position: absolute; left: 38%; top: 35%; width: 351px; height: 351px; transition: all .2s ease-in-out;}
	.stantlinka a:hover { width: 400px; height: 400px; z-index: 1000; transform: scale(1.1); }
	
	.stantlinkb a {position: absolute; left: 12%; top: 35%; width: 301px; height: 301px; transition: all .2s ease-in-out;}
	.stantlinkb a:hover { width: 330px; height: 330px; z-index: 1000; transform: scale(1.1);}
		
	.stantlinkc a {position: absolute; left: 68%; top: 35%; width: 301px; height: 301px; transition: all .2s ease-in-out;}
	.stantlinkc a:hover { width: 330px; height: 330px; z-index: 1000; transform: scale(1.1); }
		
	.stantlinkh a {position: absolute; left: 15%; top: 5%; width: 201px; height: 201px; transition: all .2s ease-in-out;}
	.stantlinkh a:hover { width: 250px; height: 250px; z-index: 1000; transform: scale(1.1); }
	
	.stantlinki a {position: absolute; left: 35%; top: 5%; width: 201px; height: 201px; transition: all .2s ease-in-out;}
	.stantlinki a:hover { width: 250px; height: 250px; z-index: 1000; transform: scale(1.1);}
		
	.stantlinkj a {position: absolute; left: 52%; top: 5%; width: 201px; height: 201px; transition: all .2s ease-in-out;}
	.stantlinkj a:hover { width: 250px; height: 250px; z-index: 1000; transform: scale(1.1); }
		
	.stantlinkk a {position: absolute; left: 72%; top: 5%; width: 201px; height: 201px; transition: all .2s ease-in-out;}
	.stantlinkk a:hover { width: 250px; height: 250px; z-index: 1000; transform: scale(1.1);}
		
	.stantlinkd a {position: absolute; left: 6%; top: 20%; width: 201px; height: 201px; transition: all .2s ease-in-out;}
	.stantlinkd a:hover { width: 250px; height: 250px; z-index: 1000; transform: scale(1.1);}
		
	.stantlinke a {position: absolute; left: 28%; top: 20%; width: 201px; height: 201px; transition: all .2s ease-in-out;}
	.stantlinke a:hover { width: 250px; height: 250px; z-index: 1000; transform: scale(1.1);}
		
	.stantlinkf a {position: absolute; left: 62%; top: 20%; width: 201px; height: 201px; transition: all .2s ease-in-out;}
	.stantlinkf a:hover { width: 250px; height: 250px; z-index: 1000; transform: scale(1.1);}
		
	.stantlinkg a {position: absolute; left: 84%; top: 20%; width: 201px; height: 201px; transition: all .2s ease-in-out;}
	.stantlinkg a:hover { width: 250px; height: 250px; z-index: 1000; transform: scale(1.1);}
.digersponsor {position: absolute; top: 75%; font-family: 'Manrope', sans-serif; margin-left: auto; margin-right: auto; padding: 10px; width: 95%}

	
}


.imageBG{
	background: url(img/bg2.jpg) no-repeat fixed; 
	background-size:100% 100%;
}
.imageBG2{
	background: url(img/bg2.jpg) no-repeat fixed; 
	background-size:100%;
}	
.imageBG3{
	background: url(img/bg2.jpg) no-repeat fixed; 
	background-size:100%;
}	



.p-1{ padding: 5px; }
.p-2{ padding: 10px; }
.p-3{ padding: 15px; }
.p-4{ padding: 20px; }
.p-5{ padding: 25px; }

.px-1{ padding-left: 5px; padding-right: 5px }
.px-2{ padding-left: 10px; padding-right: 10px }
.px-3{ padding-left: 15px; padding-right: 15px }
.px-4{ padding-left: 20px; padding-right: 20px }
.px-5{ padding-left: 25px; padding-right: 25px }

.py-1{ padding-top: 5px; padding-bottom: 5px }
.py-2{ padding-top: 10px; padding-bottom: 10px }
.py-3{ padding-top: 15px; padding-bottom: 15px }
.py-4{ padding-top: 20px; padding-bottom: 20px }
.py-5{ padding-top: 25px; padding-bottom: 25px }

.mx-1{ margin-left: 5px; margin-right: 5px }
.mx-2{ margin-left: 10px; margin-right: 10px }
.mx-3{ margin-left: 15px; margin-right: 15px }
.mx-4{ margin-left: 20px; margin-right: 20px }
.mx-5{ margin-left: 25px; margin-right: 25px }

.my-1{ margin-top: 5px; margin-bottom: 5px }
.my-2{ margin-top: 10px; margin-bottom: 10px }
.my-3{ margin-top: 15px; margin-bottom: 15px }
.my-4{ margin-top: 20px; margin-bottom: 20px }
.my-5{ margin-top: 25px; margin-bottom: 25px }