<style>
* {
  box-sizing: border-box;
}

body {

}

#indexcercve{

padding-bottom: 550px;
margin-left: 600px;
margin-top:160px;
width: 900px;
height: 900px;
border-size:3px #8989;

}

div.hapisortacerceve{
  padding-bottom: 550px;
  margin-left: 0px;
width: 1300px;
height: 100%;





}
div.usback{

position:fixed;
background-color:#56555555;
padding: 15px; 
margin-bottom: 3;
border-radius: 0;
width: 100%;


}
div.icsolcerceve{
  top:110px;
margin-left:210px;
width: 200px;
height: 300px;

padding: 0px; 
border-radius: 1px;
position:fixed;



}

/* ortanın içindeki iki blok*/

#icortacercevesag{
border-left:1px #00BFFF88 solid; 
width: 450px;
height: 300px;

background-color:#;
float: left;

}
#icortacercevesol{
margin-top:0px;
width: 450px;
height: 380px;

background-color:#;
float: left;

}
/* orta kısın ana blok */
#a1{
border-top: 3px #00BFFF88 solid;
margin-top:0px;
width: 900px;
height: 410px;
box-shadow: 5px 5px 7px rgba(0,0,0,0.5);
background-color:#56555555;
float: left;
}
#cerceveindex{

margin-left:500px;
margin-top:260px;
width: 900px;
height: 900px;
border-size:10px #56566666;

}
/* index.php orta kısın ana blok */
#a2{
border-top: 180px #00BFFF88 solid;
border-left: 500px;
width: 900px;
height: 380px;
box-shadow: 5px 5px 7px rgba(0,0,0,0.5);
background-color:#56555555;
float: left;
}



/*alt bolum*/

#icortacercevealt{
margin-top:1px;
width: 900px;
height: 100px;
background-color:#56555555;
box-shadow: 5px 5px 7px rgba(0,0,0,0.5);
float: left;

}
#icortacerceve{

box-shadow: 5px 5px 7px rgba(0,0,0,0.5);
margin-top:70px;
margin-left:420px; 
width: 900px;
height: 100%;
background-color:#;

}

/*/LİSTE DIŞI /*/
#icortacercevelist{


background-size: 100%,100%;
box-shadow: 5px 5px 7px rgba(0,0,0,0.5);
margin-top:70px;
margin-left:420px; 
width: 900px;
height: 100%;
background-color:#56555555;

}

/*/LİSTE ORTASI /*/
div.orta{


width: 450px;
margin-top:1px;
margin-left:25px; 
width: 850px;
height: 100%;
background-color:

}
div.ustortaceceve1{

margin-top:1px;
font-color:#56555555;
width: 900px;
height: 30px;
box-shadow: 5px 5px 7px rgba(0,0,0,0.5);
background-color:#56555555;
float:left;



}

div.baslıkcerceve{
margin-top:-20px;
font-color:#ffffff;
width: 200px;
height: 40px;
background-color:#00BFFF88;
float:left;

}
div.baslıkaltcerceve{
width: 300px;
height:180px;
background-color:#565555;
background: fixed;
}

div.altcerceve1{

margin-top:-20px;
font-color:#ffffff;
width: 200px;
height: 30px;
background-color:#56555555;
float:left;

}

div.baslik{
margin-left: 33px;
  margin-top:8px;
color:#ffff;
}
h5.baslikalt{
margin-left: 30px;
color:#fff;

}

div.ustortaceceveonay{
  color: #fff;
  text-underline-position:center; 
  text-align: center;
  font-size: 25px;
border-top: 1px #00BFFF88 solid;
margin-top:300px;
margin-left: 600px;
width: 500px;
height: 200px;
box-shadow: 1px 1px 1px rgba(0,0,0,0.5);
background-color:#56555555;
float: left;

}

.vertical-menu {
    width: 200px;
    height:240px; 
    background-color: #56555555;
     /* Set a width if you like */

}

.vertical-menu a {
   background-color:#56555555;  /* Grey background color */
    color: #fff; /* Black text color */
    display: block; /* Make the links appear below each other */
    padding: 10px; 
    font-family:arial;/* Add some padding */
     /* Remove underline from links */
}

.vertical-menu a:hover {
    background-color: #ff6600; /* Dark grey background on mouse-over */
}

.vertical-menu a.active {
    background-color: #56555555; /* Add a green color to the "active/current" link */
    color: white;
   text-decoration: none;
}



</style>