*, html { 
	  		font-family: Verdana, Arial, Helvetica, sans-serif; 
		}
	  
	    body, form, ul, li, p, h1, h2, h3, h4, h5 {
            margin: 0;
            padding: 0;
        }
        
        a {
            outline: none;
            -moz-outline-style: none;
        }
       img {
		    border: none; 
		}

       #container {
            background: url(../img/bg.jpg) no-repeat !important;
            width: 300px;
			
            font-size: 1.1em;
            color: #000000;
            padding: 50px 50px 0px 50px
        }

        #light_fixture {
            position:relative;
            left:80px;
            top:10px;
            padding-bottom:10px;
            width: 100px;
            height: 100px;
        }

        #metronome {
            background: #0099c8;
            width: 100px;
            height: 100px;
        }
        
        #bpm {
            margin: 25px 0px;
        }
        .subdivision {
            height:12.5%;
            background: #0099c8;
        }

        #note_control {
            float: left;
            font-size: 12px;
        }
        
        #note_control p {
            	font: 1.2em/1.7em;
        }
        #slide_control {
            float: right;
            width: 95px;
            margin-bottom: 5px;
            padding-right: 50px;
        }
        #slide_control a {
            margin:0px 5px 10px 0px;
        }
        
        .clearboth {
           clear: both;
        }
        
        /* Slider Background*/
        .slider {
            width: 230px;
            height: 11px;
            background: url(../img/slider-bg.png);
            position: relative;
            margin: 0;
            padding: 0 10px;
        }
        
        /* Slider Button */
        .ui-slider-handle{
            width: 24px;
            height: 24px;
            position: absolute;
            top: -7px;
            margin-left: -12px;
            z-index: 200;
            background:url(../img/slider-button.png);
        }
        
        /* Div for showing results */
        #bpmshow {
            font-size: 24px;
            height: 68px;
            font-family: Arial, Helvetica, sans-serif;
            color: #000000;
            width: 250px;
            text-align: center;
            text-shadow: 0 1px 1px #000;
            font-weight: 700;
            padding: 20px 0;
        }
        
        /* Farbe der Fill Bar */
        .ui-widget-header {
            background: url(../img/fill.png) no-repeat left;
            height: 8px;
            left: 1px;
            top: 1px;
            position: absolute;
        }
        

        /* Plus/Minus Button */
        .ctrlButton {
			-moz-box-shadow:inset 0px 0px 0px 1px #d6d6d6;
			-webkit-box-shadow:inset 0px 0px 0px 1px #d6d6d6;
			box-shadow:inset 0px 0px 0px 1px #d6d6d6;
			background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #45d4ff), color-stop(1, #0099c8) );
			background:-moz-linear-gradient( center top, #45d4ff 5%, #0099c8 100% );
			filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#45d4ff', endColorstr='#0099c8');
			background-color:#45d4ff;
			-moz-border-radius:42px;
			-webkit-border-radius:42px;
			border-radius:42px;
			display:inline-block;
			color:#ffffff;
			font-family:Courier New;
			font-size:28px;
			font-weight:bold;
			padding:2px 10px;
			text-decoration:none;
			text-shadow:0px -2px 0px #0099c8;
		}
        
        .ctrlButton:hover {
                background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #0099c8), color-stop(1, #45d4ff) );
                background:-moz-linear-gradient( center top, #0099c8 5%, #45d4ff 100% );
                filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#0099c8', endColorstr='#45d4ff');
                background-color:#0099c8;
        }
        
        .ctrlButton:active {
                position:relative;
                top:1px;
        }
        
        /* On/Off Button */
        a.pwrButton {
            display: block;
            width: 92px;
            height: 109px;
            background: url('../img/pwrbtn_sprite.png') 0px 0px;
        }
        a.pwrButton:hover {
            background-position: 0px -119px;
        }
        
        a.pwrButton.active {
            background-position: 0px -238px;
        }
        
        /* Checkboxes */

        .iPhoneCheckContainer {
      position: relative;
      height: 27px;
      cursor: pointer;
      overflow: hidden; }
      .iPhoneCheckContainer input {
        position: absolute;
        top: 5px;
        left: 30px;
        filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
        opacity: 0; }
      .iPhoneCheckContainer label {
        white-space: nowrap;
        font-size: 17px;
        line-height: 17px;
        font-weight: bold;
        font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
        cursor: pointer;
        display: block;
        height: 27px;
        position: absolute;
        width: auto;
        top: 0;
        padding-top: 5px;
        overflow: hidden; }
      .iPhoneCheckContainer, .iPhoneCheckContainer label {
        user-select: none;
        -moz-user-select: none;
        -khtml-user-select: none; }

    .iPhoneCheckDisabled {
      filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
      opacity: 0.5; }

    label.iPhoneCheckLabelOn {
      color: white;
      background: url('images/iphone-style-checkboxes/on.png?1284697268') no-repeat;
      text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.6);
      left: 0;
      padding-top: 5px; }
      label.iPhoneCheckLabelOn span {
        padding-left: 8px; }
    label.iPhoneCheckLabelOff {
      color: #8b8b8b;
      background: url('images/iphone-style-checkboxes/off.png?1284697268') no-repeat right 0;
      text-shadow: 0px 0px 2px rgba(255, 255, 255, 0.6);
      text-align: right;
      right: 0; }
      label.iPhoneCheckLabelOff span {
        padding-right: 8px; }

    .iPhoneCheckHandle {
      display: block;
      height: 27px;
      cursor: pointer;
      position: absolute;
      top: 0;
      left: 0;
      width: 0;
      background: url('images/iphone-style-checkboxes/slider_left.png?1284697268') no-repeat;
      padding-left: 3px; }

    .iPhoneCheckHandleRight {
      height: 100%;
      width: 100%;
      padding-right: 3px;
      background: url('images/iphone-style-checkboxes/slider_right.png?1284697268') no-repeat right 0; }

    .iPhoneCheckHandleCenter {
      height: 100%;
      width: 100%;
      background: url('images/iphone-style-checkboxes/slider_center.png?1284697268'); }

    .iOSCheckContainer {
      position: relative;
      height: 27px;
      cursor: pointer;
      overflow: hidden; }
      .iOSCheckContainer input {
        position: absolute;
        top: 5px;
        left: 30px;
        filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
        opacity: 0; }
      .iOSCheckContainer label {
        white-space: nowrap;
        font-size: 17px;
        line-height: 17px;
        font-weight: bold;
        font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
        cursor: pointer;
        display: block;
        height: 27px;
        position: absolute;
        width: auto;
        top: 0;
        padding-top: 5px;
        overflow: hidden; }
      .iOSCheckContainer, .iOSCheckContainer label {
        user-select: none;
        -moz-user-select: none;
        -khtml-user-select: none; }

    .iOSCheckDisabled {
      filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
      opacity: 0.5; }

    label.iOSCheckLabelOn {
      color: white;
      background: url('images/ios-style-checkboxes/on.png?1284697268') no-repeat;
      text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.6);
      left: 0;
      padding-top: 5px; }
      label.iOSCheckLabelOn span {
        padding-left: 8px; }
    label.iOSCheckLabelOff {
      color: #8b8b8b;
      background: url('images/ios-style-checkboxes/off.png?1284697268') no-repeat right 0;
      text-shadow: 0px 0px 2px rgba(255, 255, 255, 0.6);
      text-align: right;
      right: 0; }
      label.iOSCheckLabelOff span {
        padding-right: 8px; }

    .iOSCheckHandle {
      display: block;
      height: 27px;
      cursor: pointer;
      position: absolute;
      top: 0;
      left: 0;
      width: 0;
      background: url('images/ios-style-checkboxes/slider_left.png?1284697268') no-repeat;
      padding-left: 3px; }

    .iOSCheckHandleRight {
      height: 100%;
      width: 100%;
      padding-right: 3px;
      background: url('images/ios-style-checkboxes/slider_right.png?1284697268') no-repeat right 0; }

    .iOSCheckHandleCenter {
        height: 100%;
        width: 100%;
        background: url('images/ios-style-checkboxes/slider_center.png?1284697268'); 
    }

    /* Custom style for iphone boxes */
    .css_sized_container .iPhoneCheckContainer {
        width: 60px;
    }