/*
TASARIM : ESUNUSPANEL INTERNET HIZMETLERI
WEB MASTER : MEMO CAN
WEB : WWW.ESUNUSPANEL.COM
TARIH : 15.05.2021
*/
@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Khand:300,400,500,600,700|Open+Sans:300,300i,400,400i,600,600i,700,700i,800&subset=latin-ext');
@import url('https://fonts.googleapis.com/css?family=Barlow:100,200,300,400,500,600,700,800,900|Raleway:100,200,300,400,500,600,700,800,900&display=swap');



/*
font-family: 'Khand', sans-serif;
font-family: 'Open Sans', sans-serif;
font-family: 'Raleway', sans-serif;
font-family: 'Barlow', sans-serif;
font-family: 'Niramit', sans-serif;
font-family: 'Open Sans', sans-serif;
*/



/* 07WEBTASARIM FOOTER */
.footer {
	width:100%;
	height:548px;
	margin-top: 30px;
	z-index:0;
	position:relative;
	background:url('../images/footer.png') no-repeat center;
	overflow:hidden;
}
.footerLogo {
	position:absolute;
	margin: 80px 0 0 50px;
}

.footerSubMenu {
	position:absolute;
	margin: -37px 0 0 248px;
}

.footer_menu {width:200px;padding-top:140px;position:relative;float:left;left: 85px;}
.footer_menu li {list-style:none; float:none; background:url('../images/footer_menu_ayrac.png') no-repeat bottom left;}
.footer_menu li:last-child {background:none;}
.footer_menu li a {color: #ffffff;padding:5px;font-size:.80em;font-weight:600;display:block;}
.footer_menu li a:hover {color:#1c3ca4; text-decoration:underline;}



.footer_iletisim {
	position:absolute;
	color: #ffffff;
	text-shadow:0 1px 0 rgba(255,255,255,.4);
	font-size:.70em;
	font-weight:500;
	margin-top: 134px;
	right: 90px;
	line-height:1.20em;
	text-align:right;
}
.footer_iletisim a {color:#1c3ca4;}
.footer_iletisim a:hover {text-decoration:underline;}
.telefon_baslik {
	font-size: 20px;
	color: #ffffff;
	font-family:"Barlow", sans-serif;
	letter-spacing:-0.05em;
	position:absolute;
	margin-top: 65px;
	right: -70px;
	background: #0000008c;
	width: 200px;
	height: 0px;
	border-radius: 0px;
	font-weight: 600;
	text-align: center;
}
.footer_telefon a {
	font-size: 24px;
	color: #ffffff;
	font-family:"Barlow", sans-serif;
	font-weight:700;
	position:absolute;
	margin-top: 120px;
	right: -80px;
}
.footer_telefon a:hover {color:#1c3ca4;}
.footer_telefon span {font-size:.60em;}
.scrollup {
	position:absolute;
	color:#fff;
	margin-top:252px;
	right: 5px;
}
.scrollup i {
	position:absolute;
	top:7px;
	left:-15px;
}
.scrollup:hover {text-decoration:underline;}

/* 07WEBTASARIM reserved text */
.reserved1 {
	position:absolute;
	color:#fff;
	text-align:right;
	width:250px;
	font-size:.75em;
	font-family:Arial, Helvetica, sans-serif;
	margin:180px 0 0 220px;
}
.reserved2 {
	position:absolute;
	color:#fff;
	text-align:left;
	width:250px;
	font-size:.75em;
	font-family:Arial, Helvetica, sans-serif;
	margin:180px 0 0 500px;
}

.footerMainMenu {
	position:absolute;
	margin: 25px 0 0 323px;
	z-index:2;
}
.footerMainMenu a {
	position:relative;
	padding:4px 15px;
	display:inline-block;
	color: #ffffff;
	font-family:"Barlow", sans-serif;
	font-weight:600;
	letter-spacing:-0.02em;
	font-size:.80em;
}
.footerMainMenu a:hover {color:#1c3ca4; text-decoration:underline;}






/* 07WEBTASARIM BILDIRIMLER */
.message {
	padding:10px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -khtml-border-radius: 5px;
    border-radius: 5px;
    margin-bottom: 10px;
    -moz-box-shadow:inset 0 1px 0 rgba(255,255,255,0.5);
    -webkit-box-shadow:inset 0 1px 0 rgba(255,255,255,0.5);
    box-shadow:inset 0 1px 0 rgba(255,255,255,0.5);
	font-size:1em !important;
	font-weight:normal !important;
}a
.message.info {
    border: 1px solid #cadcea;
    background: #e1f2fc;
    color: #225b86 !important;
    text-shadow: 0 1px 0 #fff;
	margin:10px 0;
}
.message.error {
    border: 1px solid #eeb7ba;
    background: #fae2e2;
    color: #be4741 !important;
    text-shadow: 0 1px 0 #fff;
	margin:10px 0;
}
.message.success {
    border: 1px solid #b8c97b;
    background: #e5edc4;
    color: #3f7227 !important;
    text-shadow: 0 1px 0 #fff;
	margin:10px 0;
}
.message.warning {
    border: 1px solid #e5dbaa;
    background: #ffffc0;
    color: #6d7829 !important;
    text-shadow: 0 1px 0 #fff;
	margin:10px 0;
}

.takipet {
	color: #fff;
    font-size: 20px;
    position: absolute;
    font-weight: 600;
    margin: 22px 0 0 192px;
    border: solid 2px #fccde1;
    height: 36px;
    border-radius: 5px;
    width: 181px;
    text-align: center;
    line-height: 33px;
	
}

.welcome-area {
    height: 800px;
    z-index: 1;
	position:relative;
}

.welcome-intro h1 {
    font-size: 56px;
    font-weight: 700;
    line-height: 1em;
    letter-spacing: -1.6px;
}

.welcome-intro p {
    font-size: 16px;
}

.welcome-thumb-wrapper {
    position: relative;
    display: block;
    width: 100%;
}

.welcome-thumb-2,
.welcome-thumb-3,
.welcome-thumb-4,
.welcome-thumb-5,
.welcome-thumb-6 {
    position: absolute;
}

.welcome-thumb-2 {
    top: 46%;
    left: -50px;
}

.welcome-thumb-3 {
    top: 389%;
    left: 86%;
}

.welcome-thumb-4 {
    top: -47%;
    right: -146px;
}

.welcome-thumb-5 {
    top: 10%;
    left: 63%;
}

.welcome-thumb-6 {
    top: 62%;
    right: 65%;
}

.welcome-animation {
    position: relative;
    -webkit-animation: bounceHero 5s ease-in-out infinite;
    animation: bounceHero 5s ease-in-out infinite;
    margin: 0 0 0 -50px;
}

.welcome-thumb-2 .welcome-animation {
    -webkit-animation-duration: 6s;
    animation-duration: 6s;
}

.welcome-thumb-3 .welcome-animation {
    -webkit-animation-duration: 8s;
    animation-duration: 8s;
}

.welcome-thumb-4 .welcome-animation {
    -webkit-animation-duration: 4s;
    animation-duration: 4s;
}

.welcome-thumb-5 .welcome-animation {
    -webkit-animation-duration: 6s;
    animation-duration: 6s;
}

.welcome-thumb-6 .welcome-animation {
    -webkit-animation-duration: 7s;
    animation-duration: 7s;
}

@-webkit-keyframes bounceHero {
    0% {
        top: 0px;
    }

    50% {
        top: 25px;
    }

    100% {
        top: 0px;
    }
}

@keyframes bounceHero {
    0% {
        top: 0px;
    }

    50% {
        top: 25px;
    }

    100% {
        top: 0px;
    }
}

.welcome-area.bg-overlay::after {
    z-index: -2;
}

.welcome-area .welcome-shape {
    position: absolute;
    top: auto;
    bottom: -6px;
    left: 0;
    right: 0;
    z-index: -1;
}
.animate-border {
    position: relative;
    display: block;
    width: 154px;
    height: 3px;
    background: #0196be;
    overflow: hidden;
    margin: 98px 0 0 822px;
}
.animate-border:after {
    position: absolute;
    content: "";
    width: 35px;
    height: 3px;
    left: 15px;
    bottom: 0;
    border-left: 10px solid #fff;
    border-right: 10px solid #fff;
    -webkit-animation: animborder 2s linear infinite;
    animation: animborder 2s linear infinite;
}

@-webkit-keyframes animborder {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }

    100% {
        -webkit-transform: translateX(113px);
        transform: translateX(113px);
    }
}

@keyframes animborder {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }

    100% {
        -webkit-transform: translateX(113px);
        transform: translateX(113px);
    }
}
.z-index {
    z-index: 9;
}

.animate-border1 {
    position: relative;
    display: block;
    width: 179px;
    height: 3px;
    background: #d083bb;
    overflow: hidden;
    margin: -9px 0 0 8px;
}
.animate-border1:after {
    position: absolute;
    content: "";
    width: 35px;
    height: 3px;
    left: 15px;
    bottom: 0;
    border-left: 10px solid #fff;
    border-right: 10px solid #fff;
    -webkit-animation: animborder 2s linear infinite;
    animation: animborder 2s linear infinite;
}

@-webkit-keyframes animborder {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }

    100% {
        -webkit-transform: translateX(113px);
        transform: translateX(113px);
    }
}

@keyframes animborder {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }

    100% {
        -webkit-transform: translateX(113px);
        transform: translateX(113px);
    }
}
.z-index {
    z-index: 9;
}

.testimonial-img {
	/* text-align: right; */
	margin: 163px 0 0 -53px;
}

.testimonial-img img {
	width: 20%;
	display: inline;
	border-radius: 68% 68% 2% 68% / 35% 50% 0 38%;
	animation: morph 2s ease-in-out infinite both alternate;
	position: absolute;
}

@keyframes morph {
	0% {
		border-radius: 42% 58% 70% 30% / 45% 45% 55% 55%;
	}

	100% {
		border-radius: 2% 68% 68% 68% / 35% 50% 0 35%
	}
}

@keyframes spin {
	to {
		transform: rotate(1turn);
	}
}

/*9.3 Testimonial Arrow*/
.left-arrow-2 {
	position: absolute;
	left: 15px;
	bottom: 0px;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	line-height: 40px;
	text-align: center;
	border: 2px solid #75DDED;
	background: linear-gradient(238.45deg, #42D2FF 3.32%, #49e513 98.6%);
	background-clip: border-box;
	-webkit-text-fill-color: transparent;
	-webkit-background-clip: text;
	cursor: pointer;
	opacity: .5;
	transition: .5s;
	z-index: 9
}
.hakkimizda{
	color: #e7ebea;
	font-size: 20px;
	font-weight: 600;
	margin: 62px 0 0 97px;
	font-family: sans-serif;
	position: absolute;
	background: #00000096;
	width: 200px;
	border-radius: 50px;
	text-align: center;
	height: 30px;
}
.bizkimiz{
	color: #fff;
	width: 271px;
	font-size: 17px;
	font-weight: 500;
	margin: 109px 0 0 75px;
	position: absolute;
}

/*12.1 Footer Social*/
.social ul li {
	display: inline-block;
	margin-right: 15px
}

.social ul li:last-child {
	margin-right: 0
}

.social ul li a {
	display: inline-block;
	color: #ffffff;
	font-size: 20px;
	text-align: center;
	-webkit-transition: .5s;
	transition: .5s;
}

.social ul li a:hover {
	color: #85FF7F
}
.social{
	margin: 225px 0 0 307px;
	position: absolute;
}

/* 07WEBTASARIM ONLINE UYELER */
.online_uyeler1 {width: 376px;height:780px;position:relative;left: 409px;float:left;top: 14px;}
.online_uyeler1 div {margin-top:95px;}
.online_uyeler1 h3 {color:#fff;position:absolute;font-weight:700;font-size:1.30em;letter-spacing:-0.03em;margin: 48px 0 0 13px;background: #00000094;border-radius: 50px;width: 279px;text-align: center;height: 0px;}
.online_uyeler1 h3 span {font-weight:300;}
.online_uyeler1 h3:hover {}
.online_uyeler1 div img {
	position:relative;
	width:90px;
	height:90px;
	margin:0 5px 5px 0;
	-webkit-border-radius: 20px;
	-webkit-border-top-right-radius: 3px;
	-webkit-border-bottom-left-radius: 3px;
	-moz-border-radius: 20px;
	-moz-border-radius-topright: 3px;
	-moz-border-radius-bottomleft: 3px;
	border-radius: 10px;
	border-top-right-radius: 5px;
	border-bottom-left-radius: 50px;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
	-webkit-box-shadow: 0 10px 20px 0 rgba(59,7,92,.4);
	box-shadow: 0 10px 20px 0 rgba(59,7,92,.4);
	border: solid 2px #fff;
}
.online_uyeler1 div img:hover {
	-moz-transform: scale(1.3);
	-webkit-transform: scale(1.3);
	-o-transform: scale(1.3);
	-ms-transform: scale(1.3);
	transform: scale(1.3);
	
	border:solid 5px #fff;
	-webkit-box-shadow: 0 15px 50px 0 rgba(59,7,92,.8);
	box-shadow: 0 15px 50px 0 rgba(59,7,92,.9);
	
	z-index:3;
}
.animate-border2 {
    position: absolute;
    display: block;
    width: 191px;
    height: 3px;
    background: #711e6d;
    overflow: hidden;
    margin: 76px 0 0 58px;
}
.animate-border2:after {
    position: absolute;
    content: "";
    width: 35px;
    height: 3px;
    left: 15px;
    bottom: 0;
    border-left: 10px solid #fff;
    border-right: 10px solid #fff;
    -webkit-animation: animborder 2s linear infinite;
    animation: animborder 2s linear infinite;
}

@-webkit-keyframes animborder {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }

    100% {
        -webkit-transform: translateX(113px);
        transform: translateX(113px);
    }
}

@keyframes animborder {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }

    100% {
        -webkit-transform: translateX(113px);
        transform: translateX(113px);
    }
}

.footer_skype a {
	font-size: 15px;
	color: #ffffff;
	font-family:"Barlow", sans-serif;
	font-weight:700;
	position:absolute;
	margin-top: 152px;
	right: -80px;
}
.footer_skype a:hover {color:#1c3ca4;}



.footer_adres a {
	font-size: 14px;
	color: #ffffff;
	font-family:"Barlow", sans-serif;
	font-weight:700;
	position:absolute;
	margin-top: 175px;
	right: -15px;
}
.footer_adres a:hover {color:#1c3ca4;}

.footer_panelci a {
	font-size: 14px;
	color: #ffffff;
	font-family:"Barlow", sans-serif;
	font-weight:700;
	position:absolute;
	margin-top: 200px;
	right: -55px;
}
.footer_panelci a:hover {color:#1c3ca4;}



.animate-border3 {
    position: absolute;
    display: block;
    width: 127px;
    height: 3px;
    background: #711e6d;
    overflow: hidden;
    margin: 89px 0 0 133px;
}
.animate-border3:after {
    position: absolute;
    content: "";
    width: 35px;
    height: 3px;
    left: 15px;
    bottom: 0;
    border-left: 10px solid #fff;
    border-right: 10px solid #fff;
    -webkit-animation: animborder 2s linear infinite;
    animation: animborder 2s linear infinite;
}

@-webkit-keyframes animborder {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }

    100% {
        -webkit-transform: translateX(113px);
        transform: translateX(113px);
    }
}

@keyframes animborder {
    0% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }

    100% {
        -webkit-transform: translateX(113px);
        transform: translateX(113px);
    }

.Cswebtasarim-videolarimiz {width:100%;height:550px;position:relative;}

.ramazdiv { width:129px;text-align:center;}


.gurap{padding-left:6px;padding-right:6px;text-align:center;color:#fff;font-weight:bold;  }
}

.row{width: 100%;height: auto;}
.auto{width: 991px;margin: 0px auto;height: 20px;}
.Cswebtasarimvideo{padding: 0px 0;margin: -336px 0 0 639px;position: absolute;}
.Cswebtasarimvideo h1{display: block;color: #000000;text-align: center;position: relative;font-size: 34px;}
.Cswebtasarimvideo h1:before{content: "";position: absolute;left: 9px;width: 372px;height: 2px;background: url(../img/border-left.png) no-repeat;top: 50%;}
.Cswebtasarimvideo h1:after{content: "";position: absolute;right: 9px;width: 372px;height: 2px;background: url(../img/border-right.png) no-repeat;top: 50%;}
.Cswebtasarimvideo ul{padding: 20px 0;display: inline-block;}
.Cswebtasarimvideo ul li{transition: all .2s ease-in-out;margin-right:4px;position: absolute;width: 518px;z-index:1;height: 365px;padding:8px;border: 1px solid #848484;margin-left: 650px;float: left;margin-bottom: 14px;background: linear-gradient(to right, rgb(108 29 144) 0%, rgb(150 3 65) 100%);margin-top: -352px;}
.Cswebtasarimvideo ul li img{width: 295px;height: 195px}
.Cswebtasarimvideo ul li:hover{transform: scale(1.1);}
.Cswebtasarimvideo div.kat_kaps{color:#fff;position: absolute;top: 117px;z-index:0;left:-14px;width: 274px;height: 60px;/* background: url(../images/demo/hizmetbtn.png); */}
.Cswebtasarimvideo div a{text-decoration: none;color: #fff;font-size: 14px}
.Cswebtasarimvideo div div{padding-left: 28px;padding-top: 2px;height: 40px;padding-bottom: 2px;line-height: 40px;text-shadow: 1px 1px 1px #000;font-weight: bold;font-size: 15px;}
.lisans {
	color: #fff;
	position: absolute;
	font-weight: 500;
	margin: 348px 0 0 160px;
	text-align: center;
}

.tasarimci {
	color: #fff;
	position: absolute;
	font-weight: 500;
	margin: 351px 0 0 798px;
	text-align: center;
}