/* global classes */
.center {
    text-align:center;
}
.cb {
    clear:both;
}

.device 
{
    position:absolute;
    cursor:pointer;

	.on { background-color:Green; }
	.off { background-color:Red; }
	
	.cpicker {
		width:65px;
		height:60px;
		padding:2px;
		input {
			width:50px;
			margin: 18px 0 0 4px;
		}
	}
}

/* basic layout  */
header {
	width: 600px;
	margin: 20px auto 0;
	padding:10px 0 0 0;
	
    background-color:#aaa;
	
    border-radius: 5px;
    border: 2px solid #000;
    
    position:relative;
    z-index:1;
}

#content {
    width:550px;
    margin: -10px auto;
    padding: 20px 5px 5px 5px;
       
    background-color: #ddd;
    border-radius: 5px;
    border: 2px solid #000;
}

h1 { 
    font-size: 1.4em;
	a { text-decoration:none; color:#000; }
}

nav {
	ul li {
	    float:left;
	    width:100px;
	    height:80px;
	    border: 1px solid #fff;
	    margin: 9px;
	    text-align:center;
	    background-color: #444;
		a {
		    display:block;
		    height: 80px;
		    text-decoration:none;
		    color: #fff;
		    line-height:80px;
		}
		a:hover { background-color:#777; }
	}
}

.room 
{
    position:relative;
    height: 300px;

	&#room1 { background:url(../img/room1.png) no-repeat center; }
	&#room2 { background:url(../img/room2.png) no-repeat center; }
	&#room3 { background:url(../img/room3.png) no-repeat center; }
	&#room4 { background:url(../img/room4.png) no-repeat center; }
	&#room5 { background:url(../img/room5.png) no-repeat center; }
}