/*the container for slider linked to the home page */
#Snav {
    display:block;
	top:50%;
    left:22%;
	width:51%;
    height:33.5%;
    position:absolute;
    margin-left: auto;
    margin-right: auto;
	outline: 0px dashed black;
}
/* where the circles are going to be*/
#SnavUp {
    display: block;
    width: 100%;
    height: 20%;
}
#Scircles /*remove circles by making their dimensions 0%*/
{
    display:block;
    width:0%;
    height:0%;
    margin-right:5%;
    margin-top:2%;
    float:right;        /* is going to be on the right side of the slider*/
}
#Scircles ul {
    margin:0;
    float:right;
    display:block;
    width:100%;
    height:100%;
}
#Scircles li {
    /*we don't need the dots*/
    list-style:none;
    display:block;
    background-color:rgba(0, 0, 0, 0); /*last numeral colours slide sequence dots*/ 
    width:25%;
    height:90%;
    margin-left:5%;
    float:left;     /*on the same line*/
    visibility:hidden;
    /*we need circles, not squares*/
    border-bottom-left-radius:25px;
    border-top-left-radius:25px;
    border-bottom-right-radius:25px;
    border-top-right-radius:25px;
}
/*ok , we are done with the SnavUp*/
#SnavMiddle {
    display: block;
    width:100%;
    height:85%;
    margin-top:-15%;
	outline: 0px dotted blue;/*this is up to you , where you want the buttons*/
}
/*left button*/
#Sleft {
    width:10%;
    height:90%;
    float:left;
    margin-left:5%;
    opacity:0.8;
}
/*button effect*/
#Sleft:hover {
    opacity:0.5;
}
#Sright {
    width:10%;
    height:90%;
    float:right;
    margin-right:5%;
    opacity:0.8;
}
#Sright:hover {
    opacity:0.5;
}
/*now we have to add the info at the bottom of the slider*/
#SnavBottom {
    display:block;
    background-color:rgba(0, 0, 0, 0);/*change 4th code from 0.8 to 0*/
    width:150%;
    height:20%;
    position:absolute;
    bottom:35px;
    left:0%;
}
#SnavBottom p {
    font:normal 120% Arial;
    color:#fff;
	text-shadow: 4px 4px #000;
    position:absolute;
    bottom:20px;
	font-weight: 900;
    left:2.5%;
    margin-left:0%;
    visibility:hidden;
}
/*that's all , now we need to code the slider, the effect*/