@charset "utf-8";
body {
    margin-right: auto;
    margin-left: auto;    
    background:repeating-linear-gradient(white,lightgray);
    /*background-color: gray;*/ 
    /*background-image: url("../rsm/exacons03.png"); */  
    background-repeat:no-repeat;   
}
.gizle{
    
  /*
    -webkit-transition: all 2s;
    -moz-transition: all 2s;
    -o-transition: all 2s;
    transition: width 2s, height 4s;
    transition: width 10s, background-color 4s;
    */
    display:none;

    /*
    visibility: visible;
    visibility: hidden;
    display: blok
    display:none;
    */
}
.goster{
    display:inline;
    width: 95%;
    background-color: lime; 
    transition: all 5s;
  }

#header  { 
    margin-right: auto;
    margin-left: auto; 
    width: 605px;
    /*clear;*/
    height: 220px;
    border: none;
    border-radius: 20px 0 20px 0; /*baklava görünümü için*/
    }
#container {
    height: 550px;          width: 605px;
    margin-right: auto;     margin-left: auto;
    border: none;
    border-radius: 20px 0 20px 0; /*baklava görünümü için*/
    box-shadow: 0 0 10px gray; /*kutu etrafı gölge için*/
    background: repeating-linear-gradient(black,#FFf);
    
    }
.kutusifre {
    background-color: lightgray;
    border: none;
    border-radius: 20px 0 20px 0; /*baklava görünümü için*/
    box-shadow: 0 0 40px black; /*kutu etrafı gölge için*/
    /*height: 180px;*/
    }
.baslik{
    width: 200px;
    height: 110px;
    margin: 30px;
    padding: 5px;
    background-color: lightgray;
    border: none;
    border-radius: 20px 0 20px 0; /*baklava görünümü için*/
    box-shadow: 0 0 30px black; /*kutu etrafı gölge için*/
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    -o-transition: all 1s;
    float:left;
}
.baslik:hover{
    background-color: darkgray;
    -ms-transform: rotate(-3600deg); 
    -webkit-transform: rotate(-3600deg); 
    transform: rotate(5deg);
}
.Sec{
    background:repeating-linear-gradient(white,lightgray);
    border-style: outset; 
    border-width: 3px; 
    float:right; 
    width: 80px;
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    -o-transition: all 1s;
}
.Sec:hover{
    border-style: inset; 
}
.Sec120{
    background:repeating-linear-gradient(white,lightgray);
    border-style: outset; 
    border-width: 3px; 
    float:right; 
    width: 120px;
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    -o-transition: all 1s;
}
.Sec120:hover{
    border-style: inset; 
}

.sagalt {
    position:absolute;    
    width: 250px;
    height: 175px;

    right: 5px;
    bottom: 5px;
    }
.divsorgu{
    box-shadow: -2px -2px 5px black; /*kutu etrafı gölge için*/ 
     border-radius: 0 5px 0 5px; /*baklava görünümü için*/
    background-color: #86c6ff;	
    margin:5px;
    padding:3px;
   /* position: fixed; */ /*divi yerine sabitliyor*/
    }

.lang{
    opacity: .3;
    margin:2px;
}
.lang:hover{
    opacity: 1;
    -ms-transform: scale(1.2); /* IE 9 */
    -webkit-transform: scale(1.2); /* Safari 3-8 */
    transform: scale(1.2);
}
.lang_aktif{
    opacity: 1;
    margin:2px;
}
.y16B_r{
    margin:5px;
    text-align: left;
    font: bold 16px Arial, serif;
    color: blue;
    text-shadow: -1px -1px 1px orange;
    transition: all 1s;
	-webkit-transition: all 1s;
	-moz-transition: all 1s;
	-o-transition: all 1s;
}
.y16B_r:hover{
    color: orange;
    text-shadow: 2px 2px 2px blue;
}
y16BG{
	margin:3px;
    text-align: left;
    font: bold 16px Arial, serif;
    color: yellow;
    text-shadow: -3px -3px 3px black;
	
    transition: all 1s;
	-webkit-transition: all 1s;
	-moz-transition: all 1s;
	-o-transition: all 1s;	
}
y16BG:hover{
	color: red;
    text-shadow: 5px 5px 5px blue;	
}

.y16B_rr{
    text-align: left;
    font: bold 16px Arial, serif;
    color: red;
    text-shadow: -1px -1px 1px orange;
    transition: all 1s;
	-webkit-transition: all 1s;
	-moz-transition: all 1s;
	-o-transition: all 1s;
}
.y16B_rr:hover{
    color: orange;
    text-shadow: 2px 2px 2px blue;
}
.ara130 {
	margin:5px;
    width: 130px;
    text-align: left;
    font: bold 14px Arial, serif;
    color: black;
    background-color:#FFC ;
    box-shadow: 4px 4px 1px grey;
    transition: all 2s;
    -webkit-transition: all 2s;
    -moz-transition: all 2s;
    -o-transition: all 2s;
}
.ara130:hover {
    /*width: 190px;*/
    background-color: #9F0;
    box-shadow: -5px -5px 2px grey;
}
.ara200 {
	margin:5px;
    width: 200px;
    text-align: left;
    font: bold 14px Arial, serif;
    color: black;
    background-color:#FFC ;
    box-shadow: 4px 4px 1px grey;
    transition: all 2s;
    -webkit-transition: all 2s;
    -moz-transition: all 2s;
    -o-transition: all 2s;
}
.ara200:hover {
    /*width: 190px;*/
    background-color: #9F0;
    box-shadow: -5px -5px 2px grey;
}
.ara250 {
    margin:5px;
    width: 250px;
    text-align: left;
    font: bold 14px Arial, serif;
    color: black;
    background-color:#FFC ;
    box-shadow: 4px 4px 1px grey;
    transition: all 2s;
    -webkit-transition: all 2s;
    -moz-transition: all 2s;
    -o-transition: all 2s;
}
.ara250:hover {
    /*width: 190px;*/
    background-color: #9F0;
    box-shadow: -5px -5px 2px grey;
}

.ara500 {
    margin:5px;
    width: 500px;
    text-align: left;
    font: bold 14px Arial, serif;
    color: black;
    background-color:#FFC ;
    box-shadow: 4px 4px 1px grey;
    transition: all 2s;
    -webkit-transition: all 2s;
    -moz-transition: all 2s;
    -o-transition: all 2s;
}
.ara500:hover {
    /*width: 190px;*/
    background-color: #9F0;
    box-shadow: -5px -5px 2px grey;
}
.ta1{
    margin:5px;
    text-align: left;
    font: bold 14px Arial, serif;
    color: black;
    background-color:#FFC ;
    box-shadow: 4px 4px 1px grey;
    transition: all 2s;
    -webkit-transition: all 2s;
    -moz-transition: all 2s;
    -o-transition: all 2s;
}
.ta1:hover {
    /*width: 190px;*/
    background-color: #9F0;
    box-shadow: -5px -5px 2px grey;
}

.y20B{
    margin-left:15px;
    text-align: left;
    font: bold 20px Comic Sans MS, serif;
    color: brown;
    text-shadow: -1px -1px 1px #9F0;
    transition: all 1s;
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    -o-transition: all 1s;
}
.y20B:hover{
    color: white;
    text-shadow: 3px 3px 4px black;
}

.y34B{
    margin-left:15px;
    text-align: left;
    font: bold 34px Comic Sans MS, serif;
    color: brown;
    text-shadow: -3px -3px 1px black;
    transition: all 1s;
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    -o-transition: all 1s;
}
.y34B:hover{
    color: white;
    text-shadow: 3px 3px 4px black;
}
.ara90 {
	margin:5px;
    width: 90px;
    text-align: left;
    font: bold 14px Arial, serif;
    color: black;
    background-color:#FFC ;
    box-shadow: 4px 4px 1px grey;
    transition: all 2s;
    -webkit-transition: all 2s;
    -moz-transition: all 2s;
    -o-transition: all 2s;
}
.ara90:hover {
    /*width: 190px;*/
    background-color: #9F0;
    box-shadow: -5px -5px 2px grey;
}
.ara200 {
	margin:5px;
    width: 200px;
    text-align: left;
    font: bold 14px Arial, serif;
    color: black;
    background-color:#FFC ;
    box-shadow: 4px 4px 1px grey;
    transition: all 2s;
    -webkit-transition: all 2s;
    -moz-transition: all 2s;
    -o-transition: all 2s;
}
.ara200:hover {
    /*width: 190px;*/
    background-color: #9F0;
    box-shadow: -5px -5px 2px grey;
}

.btn10{
	border-style: outset;  
	border-width: 10px;
	border-color: lightgray;
	}
.btn10:hover{
	border-style: inset;  
	border-width: 10px;
	}

    .konu{
        font: bold 26px Arial, serif;
        color: #009;
        text-shadow: 4px 2px 2px white;
        transition: 2s;
    }
    .konu:hover{
        color: white;
        text-shadow: -4px -4px 6px #009;
        cursor:pointer;
    }

.divGrupBaslik200{
    box-shadow: -2px -2px 5px black; /*kutu etrafı gölge için*/ 
    border-radius: 0 5px 0 5px; /*baklava görünümü için*/
    background-color: gray; 
    margin-left:10px;
    margin-top:5px;
    margin-bottom:3px;
    padding:1px;
    width:200px;
    font: bold 20px Comic Sans MS, serif;
    color: white;
    text-shadow: -2px -2px 6px red;
    }
    .divGrupBaslik600{
        box-shadow: -2px -2px 5px black; /*kutu etrafı gölge için*/ 
        border-radius: 0 5px 0 5px; /*baklava görünümü için*/
        background-color: gray; 
        margin-left:30px;
        margin-top:5px;
        margin-bottom:3px;
        padding:1px;
        width:600px;
        font: bold 20px Comic Sans MS, serif;
        color: white;
        text-shadow: -2px -2px 6px red;
        }
        .divGrupOpen{  /*gizle  kapanması için */
            box-shadow: -2px -2px 5px black; /*kutu etrafı gölge için*/ 
            border-radius: 0 5px 0 5px; /*baklava görünümü için*/
            background-color: lightgrey; 
            padding:1px;
            font: bold 14px Calibri, serif;
            }
        
.button1 { 
    margin:5px;
    border: none;       border-radius:2px 0 2px 0;
    box-shadow: 0 0 4px black;/*kutu etrafı gölge için*/ 
    text-shadow: -2px -2px 1px orange; 
    font: bold 20px Arial, serif;
    color:blue;    
    border-radius:10px 0 10px 0;/*baklava görünümü için*/
    transition: all 1s;
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    -o-transition: all 1s;
    }
.button1:hover {     
    box-shadow: 0 0 4px black;/*kutu etrafı gölge için*/ 
    text-shadow: 2px 2px blue;  
    font: bold 20px Arial, serif;
    color:orange;    
    border-radius:0px 10px 0px 10px;/*baklava görünümü için*/
    }

    .don90{		
		box-shadow: -1px -1px 5px black; /*kutu etrafı gölge için*/ 
		background-color: gray; 
		border-radius:30px;
		overflow: hidden;
		transition: all 1s;
		-webkit-transition: all 1s;
		-moz-transition: all 1s;
		-o-transition: all 1s;    
	}
	.don90:hover{
		box-shadow:0 0 20px gray;
		-ms-transform: rotate(90deg); 
		-webkit-transform: rotate(90deg); 
		transform: rotate(90deg);
		opacity:0.3;
	}