Template:BIT/pz-test1/CSS

{

   margin: 0; 
   padding: 0; 
   text-decoration: none;

} body {

   padding: 20px;

}

1. container

{ position: relative;

   overflow: hidden; 

   width: 600px; height: 400px; border: 3px solid #333;

}

1. list

{ position: absolute;

   z-index: 1;
   width: 4200px; 
   height: 400px;

}

1. list img

{

   float: left;
   width: 600px;

}

1. buttons

{

   position: absolute; 
   z-index: 2; 
   bottom: 20px; 
   left: 250px;
   width: 100px;
    height: 10px;

}

1. buttons span

{float: left;

   width: 10px;
   height: 10px;
   margin-right: 5px;

   cursor: pointer; 
   border: 1px solid #fff;
    border-radius: 50%; 
    background: #333;

}

1. buttons .on

{

   background: orangered;

} .arrow {font-size: 36px;

   font-weight: bold; 
   line-height: 39px;
   position: absolute; 
   z-index: 2; 
   top: 180px; 
   display: none;
    width: 40px; 
    height: 40px;  

   cursor: pointer; 
   text-align: center; 
   color: #fff;
   background-color: RGBA(0,0,0,.3);

} .arrow:hover {

   background-color: RGBA(0,0,0,.7);

}

1. container:hover .arrow

{

   display: block;

}

1. prev

{

   left: 20px;

}

1. next

{

   right: 20px;

}