HTML, BODY

{

	width: 100%;

	height: 100%;

	overflow: hidden;

	background: black !important;

}

#main

{

	width: 100%;

	height: 100%;

	background: url(../images/backgrounds/1.jpg) no-repeat  center center;

	-moz-background-size: 100% !important;

	-o-background-size: 100% !important;

	background-size: 100% !important;

	background-size: cover !important;

}

#settingscont{

	width: 100%;

	height: 400px;

	margin-left: auto;

    margin-right: auto ;

	background-color: #252525;

	position: fixed;

	margin-top: 40.5%;

	opacity: 1;

	display: none;

}

#heading{

	width: 100%;

	height: 33px;

	margin-left: auto;

    margin-right: auto ;

	background-color: #0A1217;

	position: fixed;

	color:white;

	font-size: 18px;

	padding-top: 5px;

	cursor: pointer;

}

.test{
margin:auto;
	

}

.vtest{

	    margin: auto;

}

.buttonslider{

	margin-top: 20px;

}

.sett{

	   

	font-family: 'Roboto', sans-serif;

	color: white;

	opacity: 1;

	text-align: center;

	font-size: 14px;

	margin-top: 160px !important;

}

#logo

{

	display: block;

    margin-left: auto;

    margin-right: auto ;

    margin-top: 20px;

    text-align: center;

    width: 10%;

}

a.toggler {

    background: #243E4E;

    cursor: pointer;

    border: 2px solid white;

    border-right-width: 15px;

    padding: 0 5px;

    border-radius: 5px;

    text-decoration: none;

    transition: all .5s ease;

}



a.toggler.off {

    background: #8cb3ca;

    border-right-width: 2px;

    border-left-width: 15px;

}

.rg{    text-align: right;}

 .rg2{   color: #FFFFFF;

    font-size: 14px;}

.time

{

	

       font-family: 'Roboto', sans-serif;

    color: white;

    opacity: 0.2;

    font-size: 25px;    margin-top: 118px;



}

.start{

	position:absolute;

    top: 30%;

    margin-left: auto;

    margin-right: auto;

    width: 100%;

    display: none;

    font-family: 'Roboto', sans-serif;

	color: white;

	opacity: 1;

	text-align: center;

	font-size: 20px;

}

#fullscreen{

	

}

#controls

{

	    width:315px;

    margin: 0 auto;

	

}

.wrapper {

    position: absolute;

    width: 100%;

    margin: auto;

    bottom: 8px;    margin-left:0px;

}



.button

{

	/*//position:relative;

	margin-top -200px;*/

	/*width: 50px;

	height: 50px;*/

	margin-top:119px !important;

}

#volume{

	margin-left: 50%;

	

}

#pause{



	margin-top:118px!important;

}

#speed{

	margin-left: 80%;



	

}

.shape{

	  position:absolute;

    top: 40%;

    

}

#diamond

{

	-webkit-box-sizing: content-box;

  -moz-box-sizing: content-box;

  box-sizing: content-box;

  width: 20px;

  height: 20px;

  background: red;

  -webkit-transform: rotateZ(-45deg)   ;

  transform: rotateZ(-45deg)   ;

  -webkit-transform-origin: 0 100% 0deg;

  transform-origin: 0 100% 0deg;

}

#full{

	display: block;

}

#mob{

	display: none;

}

#square {

	width: 20px;

	height: 20px;

	background: red;

}

#circle {

	width: 20px;

	height: 20px;

	background: red;

	-moz-border-radius: 50px;

	-webkit-border-radius: 50px;

	border-radius: 50px;

}



.volSlider{



	margin-top: -220%;

	margin-left: 70%;

}

.spSlider{



	margin-top: -220%;

	margin-left: 105%;

}

@media screen and (max-width: 1250px) {

.volSlider{



	margin-top: -350%;

	margin-left: 95%;

}

.spSlider{



	margin-top: -355%;

	margin-left: 125%;

}

	}

/*.slider{

	margin-top: 22px;

	

}*/

/*.slider .ui-slider-handle{

    width:50px; 

    height:50px; 

    background: transparent url(../images/backgrounds/s1.png) no-repeat 0 0;

    position:absolute;

    top: -24px;

    border-style:none; 

    background-size: contain;

}/*

/*.ui-slider-horizontal {

    height: 5px !important;

}*/

.spinner {

    display:    block;

    position:   fixed;

    z-index:    1000;

    top:        0;

    left:       0;

    height:     100%;

    width:      100%;

    background: rgba( 255, 255, 255, .8 ) 

                background: rgba( 255, 255, 255, .8 ) 

                url('http://i.stack.imgur.com/FhHRx.gif') 

                50% 50% 

                no-repeat;

                

}

.cen{color:#FFFFFF;font-size: 14px;}

.cen2{}

img#sleft {

    margin-top:157px!important;width: 16px;

}

img#sright{

    margin-top:157px!important;    width: 16px;

}

img#bleft{

    margin-top: 157px!important;    width: 16px;

}

img#bright{

    margin-top:157px!important;width: 16px;

}

.bk{ padding-left: 0px!important;

    padding-right: 0px!important;}

.pd1 {

    padding-right: 0px!important;

}

	

.w2{width: 215px!important}	



@media screen  and (max-width: 1200px) {


	.time {

    margin-top: 132px;

}

	.ui-widget-content{}

	.wrapper {

    margin-left: 0px!important;

}

	.w2 {

    width: 175px !important;

}



	.sett {

    margin-left: 0px!important;

}

#fullscreen {240



    margin-left: 0px;



}

.cen {

    font-size: 12px;

}

.rg2 {

    font-size: 12px;

}

.sett {

    font-size: 12px;}

	.w2{padding-left: 0px!important;

padding-right: 0px!important;}

.rg{text-align:center}

}

	.wi{width: 11%;}

	.align ul  {

    padding-left:0px;

}

.align ul li {

    display: inline;

}

.align {

    text-align: center;

}

.col-lg-6.col-sm-6.col-xs-6.pd2 {

    padding-left: 6px!important;

    padding-right: 0px!important;

}

.col-lg-3.col-sm-3.col-xs-3.pd1 {

    padding-left: 0px!important;

}

.pd3 {

    padding-right: 0px!important;

}

.col-lg-2.col-sm-3.col-xs-3.w2 {

    width: 215px;

}

.wi{    width: 135px!important;}
.ct{text-align:center}
.logo-new {
    text-align: center;
    padding-top: 8px;
}