@charset "utf-8";

#eLearning {margin:0px auto; padding:0;}

.el_bsl, .el_sol, .el_content {
	margin                  : 0px; 
	padding                 : 0px;
	border                  : 1px solid #ccc;
	border-radius           : 5px; /* Standart */
        -moz-border-radius      : 5px; /* Firefox */
        -webkit-border-radius   : 5px; /* Safari ve Chrome */
    /*
    -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 10px rgba(0, 0, 0, 0.1) inset;
		-moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 10px rgba(0, 0, 0, 0.1) inset;
			box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 10px rgba(0, 0, 0, 0.1) inset;
			*/
}
.el_bsl {
	margin:0px auto; padding:0; width:99%; background:#F3F3F3;
}
.el_sol, .el_content, .el_show, .slide_icon_list  {
	display		: inline-block;
	/*margin-top		: 5px;*/
	vertical-align	: top;
}

.el_sol {
	margin-left:5px;
	width		: 24%; 
	padding		: 5px;
	background	: #F2F2F2;
	/*padding-top:30px;
	margin-top	: 8px !important;*/ 
	height:88vh;
}
	.el_sol ul{
            list-style:none;
            font-size:14px; 
            vertical-align:top;
        }
        
	.el_sol ul li a{ 
                        display		: cell; 
                        font-style	: normal; 
                        font-size	: 14px; 
                        font-weight	: bold; 
                        color		: #333;
                        vertical-align  : top;
                        }
                        
	.el_sol ul li span {
                            display	:inline-block;
                            font-style	:normal; 
                            font-size	:12px; 
                            font-weight	:normal; 
                            color	:#555;
                            vertical-align  : top;
        }
        
		.el_sol ul li span:hover,
		.el_sol ul li span:active, 
		.el_sol ul li a.active span
	 	{                
            font-size	:100%; 
            font-weight	:400; 
            color	:#000;
        }				
	
	.el_sol li{
		list-style:none; 
                display:block; 
                line-height:18px; 
                padding-left:20px; 
                padding-bottom:10px;
		width:94%; 
	}
	.el_sol li a{
		text-decoration:none;color:#999;
	}
	
	
	.el_sol li a:hover, .el_sol li a:active, .el_sol li a.active {
		background :#e1d3e7; 
		padding:3px;
	}
        
        .el_sol ul li a.active{
            background :#e1d3e7; padding:3px;
        }
	
	
.el_content  { 
	padding :5px;
	width : 100%;
        /*
	margin-left:10px;
	margin-right:5px;
	/*margin-bottom:40px;*//*
	 overflow:hidden;
	z-index:100;*/
	height:83vh;/*height:546px;/*height:94vh;*/
}
.el_show  {
    width   : 52%;/*74.5%;*/
}

.el_show img  {width:100%;height:80vh;}

.elc_bsl {margin:0px; padding:0px 5px; list-style:none;}

.elc_bsl ul {
	display	: inline-block; 
	background:url(../img/eLearning/el_bsl.png) no-repeat;
	width:82%;
	}
.elc_bsl li, .elc_bsl ul li{
	display	: inline-block; 
	}
.elc_bsl ul li{	
	padding : 15px 0 20px 22px;
	}
.elc_text {
	display: inline-block;
	margin-left:10px;
	margin-right:5px;
	width: 94%;
	height:300px;
	vertical-align:top;
	padding:20px;
	border 					: 1px solid #ccc;
	border-radius			: 5px; /* Standart */
    -moz-border-radius		: 5px; /* Firefox */
    -webkit-border-radius	: 5px; /* Safari ve Chrome */
}
.elc_foto {
	display:inline-block;
	width:25%;
	min-height:300px;
	vertical-align:top;
	margin-left:8px;
	padding:5px;
	border 					: 1px solid #ccc;
	border-radius			: 5px; /* Standart */
    -moz-border-radius		: 5px; /* Firefox */
    -webkit-border-radius	: 5px; /* Safari ve Chrome */
}
.elc_ack {
	display		: block;
	width		: 94%;
	margin-left:10px;
	margin-right:5px;
	min-height	: 40px;
	margin-top:5px;
	padding:20px;
	border 					: 1px solid #ccc;
	border-radius			: 5px; /* Standart */
    -moz-border-radius		: 5px; /* Firefox */
    -webkit-border-radius	: 5px; /* Safari ve Chrome */
}
.el_navigate {
    float                   : left;
    display                 : block; 
    background              : #fff;

    margin-left             : 10px;
    /*
    min-height              : 22px; 
    margin                  : 20px 20px -30px 0;*/
    padding                 : 2px 15px;
    border                  : 1px solid #eee;
    border-radius           : 5px; /* Standart */
    -moz-border-radius      : 5px; /* Firefox */
    -webkit-border-radius   : 5px; /* Safari ve Chrome */
    /*
	    -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 10px rgba(0, 0, 0, 0.1) inset;
		-moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 10px rgba(0, 0, 0, 0.1) inset;
			box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 10px rgba(0, 0, 0, 0.1) inset;
			*/
    z-index                 : 3000;
}
.el_navigate li{ list-style:none; font-size:12px; line-height:17px; display:inline-block; vertical-align:top; padding-left:10px;}


.el_btn_basa, .el_btn_sona, .el_btn_geri, .el_btn_ileri, .el_btn_dur, .el_btn_ses{
		display:inline-block; margin:0px 0px 0 10px; height:16px !important; width:16px !important;}	
		
.el_btn_basa{ background:url(../../img/eLearning/el_basa.png) no-repeat; background-size: cover;}
.el_btn_sona{ background:url(../../img/eLearning/el_sona.png) no-repeat; background-size: cover;}
.el_btn_geri{ background:url(../../img/eLearning/el_geri.png) no-repeat; background-size: cover;}
.el_btn_ileri{ background:url(../../img/eLearning/el_ileri.png) no-repeat; background-size: cover;}
.el_btn_dur{ background:url(../../img/eLearning/el_dur.png) no-repeat; background-size: cover;}
.el_btn_ses{ background:url(../../img/eLearning/el_ses.png) no-repeat; background-size: cover;}


.slayt {
    /*
	float:left;
	width: 100%;/*76%;
	/*height:94vh;*/
}

	
.fill {
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}
.fill img {
    flex-shrink: 0;
    width: 100%;/*96%;
    /*
    min-height: 100%;    
    height: 520px; 
    */
}

.slide_icon_list{
	float:right;
	vertical-align:top;
	width: 23%;
	/*height:94vh;*/
	height:88vh;/*height:535px;*/
	/*
	border-left 	: 1px solid #999;
	border-right 	: 1px solid #999;
	*/
	padding:2px;
	overflow:auto; /*background:#ccc;*/
}

.slide_icon_list li{
	width:96%; height:auto; 
        border:1px solid #eee; padding:1px; margin:2px; display:inline-block;
	}

.slide_icon_list li img {
	flex-shrink: 0;
    min-width: 100%;
    min-height: 100%;    
    height: auto; 
	}

.slide_icon_list li:active, .slide_icon_list li.active{
    /*border:2px solid green;*/
    
    box-shadow: 0 0 6px 0 magenta;/*, 0 4px 4px 0 violet;*/
    border-left:3px solid red; 
    margin-left:-4px;
    
/*
	position:relative;
    -webkit-box-shadow:0 1px 4px rgba(0, 255, 0, 0.3), 0 0 40px rgba(0, 255, 0, 0.1) inset;
       -moz-box-shadow:0 1px 4px rgba(0, 255, 0, 0.3), 0 0 40px rgba(0, 255, 0, 0.1) inset;
            box-shadow:0 1px 4px rgba(0, 255, 0, 0.3), 0 0 40px rgba(0, 255, 0, 0.1) inset;*/
	}


.slide_icon_list li:active::before, .slide_icon_list li.active::before {
	
}	
/*
.slide_icon_list li.active:before, .slide_icon_list li.active:after
{
    content:"";
    position:absolute;
    z-index:-1;
    -webkit-box-shadow:0 0 20px rgba(0,255,0,0.8);
    -moz-box-shadow:0 0 20px rgba(0,255,0,0.8);
    box-shadow:0 0 20px rgba(0,255,0,0.8);
    top:10px;
    bottom:10px;
    left:0;
    right:0;
    -moz-border-radius:100px / 10px;
    border-radius:100px / 10px;
}
.slide_icon_list li.active:after
{
    right:10px;
    left:auto;
    -webkit-transform:skew(8deg) rotate(3deg);
       -moz-transform:skew(8deg) rotate(3deg);
        -ms-transform:skew(8deg) rotate(3deg);
         -o-transform:skew(8deg) rotate(3deg);
            transform:skew(8deg) rotate(3deg);
}
*/
	
.sunucu-video{
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 68%;/*56.25%;*/
    
    margin:0 auto;
}	

.video{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}	

 
.arrow-right {
  width: 0; 
  height: 0; 
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  
  border-left: 10px solid green;
  z-index:999;
}

.add-border-red{
    border:2px solid red;
}

/* from InoTec Survey style.css */
.footer{
	margin-top:-80px;
}
.footer .footer-top{
	font-size	: 70%;
	text-align	: center;
	width		: 100%;
	
	height: 50px;
	float: left;
	background: #b5ceee;/*#007dc1;/*#008BD2;/*#E73336;*/
	margin-bottom: 30px;
}



.footer p a{
	color: #8080c0 !important;
	font-weight:normal !important;
	font-size:120%;
}

.footer p a:hover{
	color: #1f54ab!important;
}

.footer .footer-top form{
	margin-top: 12px;
}

.footer .footer-top form input[type=text]{
	width: 290px;
	height: 28px;
	border: none;
	margin-right: -4px;
	padding: 0 10px;
}

.footer .footer-top form input[type=button], .footer .footer-top form input[type=submit]{
	height: 28px;
	background: #373737;
	border: none;
	color: #FFF;
	cursor: pointer;
}

.footer .logo img{
	margin-bottom: 20px;
}

.footer p{
	font-size: 14px;
	color: #828688;
	margin-bottom: 20px;
}

.footer p i:nth-child(2){
	margin-left: 20px;
}

.sozlesme {
  position: relative;
  width: 90%;
  max-width: 700px;
  background: #efefef;
  margin: 5em auto 6em;
  padding : .6em;
  cursor: auto;
  border-radius: .25em;
  -webkit-transform: translateY(-30px);
  -moz-transform: translateY(-30px);
  -ms-transform: translateY(-30px);
  -o-transform: translateY(-30px);
  transform: translateY(-30px);
  -webkit-transition-property: -webkit-transform;
  -moz-transition-property: -moz-transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  transition-duration: 0.3s; 
  font-size:14px;
}

.btn-ino-color {
	color:#008ad1;
}
.btn-ino {
  color: #fff;
  background: #008ad1;
  border-color: #17aeff;
  padding:10px 16px; 
  font-size:100%;
}
.btn-ino:focus,
.btn-ino.focus {
  color: #fff;
  background-color: #31b0d5;
  border-color: #1b6d85;
}
.btn-ino:hover {
  color: #fff;
  background-color: #0072ae;
  border-color: #0092df;
}
.btn-ino:active,
.btn-ino.active,
.open > .dropdown-toggle.btn-ino {
  color: #fff;
  background-color: #31b0d5;
  border-color: #269abc;
}
.btn-ino:active:hover,
.btn-ino.active:hover,
.open > .dropdown-toggle.btn-ino:hover,
.btn-ino:active:focus,
.btn-ino.active:focus,
.open > .dropdown-toggle.btn-ino:focus,
.btn-ino:active.focus,
.btn-ino.active.focus,
.open > .dropdown-toggle.btn-ino.focus {
  color: #fff;
  background-color: #269abc;
  border-color: #1b6d85;
}
.btn-ino:active,
.btn-ino.active,
.open > .dropdown-toggle.btn-ino {
  background-image: none;
}
.btn-ino.disabled:hover,
.btn-ino[disabled]:hover,
fieldset[disabled] .btn-ino:hover,
.btn-ino.disabled:focus,
.btn-ino[disabled]:focus,
fieldset[disabled] .btn-ino:focus,
.btn-ino.disabled.focus,
.btn-ino[disabled].focus,
fieldset[disabled] .btn-ino.focus {
  background-color: #5bc0de;
  border-color: #46b8da;
}

.btn-ino:disabled,
.btn-ino[disabled]{
  border: 1px solid #999999;
  background-color: #cccccc;
  color: #666666;
  
  cursor: not-allowed;
        pointer-events: none;

        /*Button disabled - CSS color class*/
        color: #c0c0c0;
        background-color: #ffffff;
}

.ders_detay{
	width:100%; display:block; vertical-align:top; overflow:hidden; border-top:1px solid #ccc; padding-top:10px;
}

	.ders_detay div.sol{
		width:20%; display:inline-block; padding:8px;
	}
	
		.ders_detay div.sol img {
			width:100%;
		}


	.ders_detay div.sag{
		width:40%; display:inline-block; vertical-align:top;
	}
	
		.ders_detay div.sag p.bsl {
			font-size:22px;
		}
		
		.ders_detay div.sag p.fiyat {
			font-size:14px; font-weight:bold;
		}
		
	.ders_detay div.sepet{
		width:37%; display:inline-block; border-left:1px solid #ccc;
	}
	
	
	
.pageSingle{
	padding:10px;
}
.pageSingle, .pageSingle p{
	font-size: 14px;
	line-height: 22px;
	margin-bottom: 20px;
}

.pageSingle h5{
	color: #8080c0;/*#E73336;*/
	font-size: 22px;
	margin-bottom: 10px;
	font-weight: 700;
}

.pageSingle .img-border{
	float: right;
	margin: 0 0 0 14px;
	border: 2px solid #DDD;
	width: 50%;
	height: auto;
}

.pageSingle p:last-child{
	margin-bottom: 0px !important;
}

.pageSingle .accordion h3{
	background: #8080c0;/*#E73336;*/
	padding: 10px;
	color: #FFF;
	margin-bottom: 10px;
}

.pageSingle .accordion div{
	margin-bottom: 10px;
	height: auto !important;
}

.list-article li{
	width: 100%;
	height: auto;
	float: left;
	margin-bottom: 30px;
}

.list-article li a .single{
	float: left;
	color: #444;
}

.list-article li a img{
	float: left;
	margin-right: 20px;
	border: 2px solid #DDD;
}

.list-article li a h3{
	color: #8080c0;/*#E73336;*/;
	font-size: 22px;
	margin-bottom: 10px;
	font-weight: 700;
}

.list-article li a .btn{
	width: 146px;
	height: 200px;
	background: #8080c0;/*#E73336;*/;
	padding: 10px 20px;
	text-align: center;
	color: #FFF;
	font-weight: 700;
	margin-top: 4px;
	float: right;
	font-size: 20px;

	-webkit-transition: background 0.5s linear;
    -moz-transition: background 0.5s linear;
    -ms-transition: background 0.5s linear;
    -o-transition: background 0.5s linear;
    transition: background 0.5s linear;
}

.bold {font-weight: bold;}
.f-16 {font-size:16px;}
.f-18 {font-size:18px;}
.f-20 {font-size:20px;}
.f-22 {color:#fff; font-size:22px;}

/* sınav için - octopus tan */
 /* sınav test için : */
ul#snv_soru {
	margin		: 0; 
	padding		: 0;
	list-style	: none;
	width		: 80%; 
	height		: auto; 
	display		: block;
	margin-left	: 60px;
}
	ul#snv_soru li {
					clear		: both;
					display		: block; 
					padding		: 2px; 
					line-height	: 24px; 
					}
	ul#snv_soru span{
					margin-left : 5px; 
					}
	.harf{
			width	: 20px;
			float	: left; 
		 }
		 
	.soru{
			float		: left;
			background	: #eee; 
			padding-left: 3px; 
			width		: 80%; 
			text-align	: left;
			font-size:12px;
			color:#000;
			font-weight:normal;
		  }
		  
	.cevap{
			float			: left;
			vertical-align	: top;
		  }


/* izleme üst menü - 12.12.2017 */ 
 .iz-menu{
	text-align:center; display:inline-block; margin-left:30%; vertical-align:bottom;
}
.iz-menu ul {
    list-style-type	: none; margin: 10px 0 0 0;
    padding			: 0;
    overflow		: hidden;
	font-size		: 14px;
}

.iz-menu ul li {
    display:inline-block;
    margin:0; 
    padding:12px 4px 0 0;
    margin-left:5px;
}

.iz-menu ul li a {
	 margin:0; padding:0;
    padding-left:3px;
    color			: white;
    text-decoration	: none;
}

.iz-menu ul li img {
	width:20px;
	margin			: 0;
	padding			: 0;
	float			: left;
	vertical-align	: middle;
}

/* Change the link color to #111 (black) on hover */
.iz-menu ul li a:hover {
    color : #e7e3e2;
}

.iz-menu ul li ul li a:hover {
    color : #e7e3e2;/*#83CAC6;*/
}

.iz-menu > li > a {
  display : inline;
}


.iz-menu ul .active {
    color : #e7e3e2; background:none;
}

.box-list{
	width: 100%;
	
	height: auto;
	float: left;
	margin-top: 20px;
	margin-bottom: 40px;
}

.box-list li{
	width		: 23%;
	height		: 52vh;
	/*
	float		: left;
	*/
	text-align	: center;
	
	margin-left		: 20px;
	
	display: inline-block;
	
	/*background: #e9e9e9;*/
	vertical-align: top;
	margin-top:20px;
	
	border-radius:4px;
	
	border: 1px solid #ccc;
	/*box-shadow: 0 6px 10px -6px black;
	box-shadow: 0 8px 6px -6px black;*/
    
    padding: 20px 0 0 0;
	
	color: #000;
	/*font-weight: 700;*/
	font-size: 16px;
	
	/* For IE 7 */
	zoom: 1;
	*display: inline;

}

.box-list li:hover{
	 box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.box-list li div.d1 img{ 
	width	: 80%; 
	height	: 130px;
	
	/*padding:2px;*/ 
	/*border: 1px solid #DDD;
	margin-top:-10px;
	margin-right: 20px;
	background:#fff;
	*/
}

/* sefa */
.box-list li div.d1{
	width:98%; 
	padding:5px;
}
.box-list li div.d2{
	width				: 100%; 
	height				: 8vh; 
	background-color	: #416fc2;
	color				: #fff; 
	padding				: 4px;
	line-height			: 22px;
}

.box-list li div.box-ack{
  font-size		: 14px; 
  color			: #000;
  padding		: 4px 0;
  line-height	: 22px;
  height		: 12vh; 
}

.box-list li div.box-bottom{
  font-size:14px; 
  font-weight:bold; 
  color:#000;
  line-height	: 22px; 
  width:50%; 
  border-top:2px solid #ccc; 
  margin: 0 auto;
  -webkit-box-shadow: 0px -3px 0px rgba(50, 50, 50, 0.75);
    -moz-box-shadow:    0px -3px 0px rgba(50, 50, 50, 0.75);
    box-shadow:         0px -3px 0px rgba(50, 50, 50, 0.75);
}

.box-list li div.btn-grup{
 	width				: 100%; 
	height				: 4.7vh; 
	background-color	: #eee;
	padding				: 4px;
	line-height			: 18px;
	margin-top			: 6px;
	border-radius		: 0 0 4px 4px;
}
/**/

.box-list li a i{
	font-size: 68px;
	color: #FFF;
	display: block;
	margin-bottom: 10px;
	margin-top: 20px;
}

.box-list li:nth-child(5n+0){
	margin-right: 0px;
}

.text-box, .text-box-s{
	width: 48%;
	margin-bottom: 40px;
	font-size: 13px;
	line-height: 22px;
}

.text-box-right{
	float: right;
}

.text-box h2, .text-box-s h2{
	color: #8080c0;/*#E73336;*/;
	font-size: 22px;
	margin-bottom: 10px;
	font-weight: 700;
	border-bottom: 1px solid #8080c0;;
	padding-bottom: 10px;
}

.text-box h2:before {
  content : "";
  position: absolute;
 
  height  : 20px;
  width   : 18%;
  border-bottom:5px solid #8080c0;
  margin-top:20px;
}

.text-box-s h2:before {
  content : "";
  position: absolute;
 
  height  : 10px;
  width   : 10%;
  border-bottom:5px solid #8080c0;
  margin-top:20px;
}

.text-box p, .text-box-s p{
	font-size: 13px;
	line-height: 22px;
	margin-bottom: 14px;
}

.text-box p:last-child, .text-box-s p:last-child{
	margin-bottom: 0px;
}


.foto{
	width		: 100px;
	height		: 80px;
	border		: 1px solid #e2e2e2;
	padding:1px;
	margin-bottom:2px;
}
.foto img{
	width: 98px;
    height: 78px;
}

.foto_32{
	font-size	: 10px;
	width		: 48px;
	height		: 48px;
	/*border					: 1px solid #e2e2e2;*/
	-moz-box-shadow			: 0px 1px 1px #888888;;
	-webkit-box-shadow		: 0px 1px 1px #888888;
	box-shadow				: 0px 1px 1px #888888;
	-moz-border-radius		: 48px;
	-webkit-border-radius	: 48px;
	border-radius			: 48px;
}

/* ------------------------------- izleme üst menü - 28.07.2018 ---------------------------------- */ 
.iz-ust-menu{
	width:100%; 
	background: #660099;/*#8080c0; */
	display:block; 
	padding:4px;
}
.iz-ust-menu img{
    display         : inline-block;
}

.iz-ust-menu ul {
    display         : inline-block;
    list-style-type : none; 
    margin          : 0;
    padding         : 0;
    overflow        : hidden;
    font-size       : 12px;
    text-align      : right;
    float:right;
}

.iz-ust-menu ul li {
    display:inline-block;
    margin:0; 
    padding: 0 12px;
}

.iz-ust-menu ul li a {
	margin			: 0; 
	padding			: 0;
    padding-left	: 3px;
    color			: white;
    text-decoration	: none;
}

.iz-ust-menu ul li img {
	width:20px;
	margin			: 0;
	padding			: 0;
	float			: left;
	vertical-align	: middle;
}

/* Change the link color to #111 (black) on hover */
.iz-ust-menu ul li a:hover {
    color : #e7e3e2;
}


.iz-ust-menu ul > li > a {
  display : inline;
}


/* 30.03.2020 - text ten önce çizgi */
.cizgi_before_line {
  overflow :hidden;
  color: gray;
  text-align: right;
  line-height: 1.6em;
}

.cizgi_before_line:before {
  display: block;
  float: left;
  margin-top: .8em; /* half the line-height */
  border-top: 1px solid silver;
  width: 90%;
  content: "";
}

video {
  /* override other styles to make responsive */
  width: 100%    !important;
  height: auto   !important;
}

.embed-container {
  --video--width: 1296;
  --video--height: 900;

  position: relative;
  padding-bottom: calc(var(--video--height) / var(--video--width) * 100%); /* 41.66666667% */
  overflow: hidden;
  max-width: 100%;
  background: black;
}

.embed-container iframe,
.embed-container object,
.embed-container embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}