/*						COMMON 				*/
* {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	text-shadow:none;
	font-family: 'Montserrat';
	color: #373c50;
}
html, body {
	padding: 0;
	margin: 0;
	font-size: 100%;
	height: 100%;
    background-color: #FFF;
    width: 100%;
}
input:focus, select:focus {
    outline: none;
}
.font-575vw-BB {
	font: 700 5.75vw 'Montserrat';
}
.font-425vw-B {
	font: 600 4.25vw 'Montserrat';
}
#homePage, #roomsListingPage, #roomsPage, #addPage, #addRoomsPage, #addDevicesPage, #editDevicesPage, #loginPage, #signupPage {	
	width:100%;
	height: 100vh;
}
#loginPage, #signupPage {
	background: url(../images/imgHomePage.jpg) no-repeat center top !important;
	background-size: cover !important;
}
.logo {
	font: 700 10vw 'Montserrat';
	color: rgb(255,255,153,1);
	position: fixed;
	left: 50px;
	top: 130px;
}
.paddingContainer {
	width:100%;
	padding: 22px;
}
.hGreeting {
	width: 75%;
	height: 45px;
	float: left;
	margin: 25px 0 0 0;
	line-height: 45px;
}

.contProfile {
	width: 25%;
	height: 45px;
	float: left;
	margin: 25px 0 0 0;
}
.btnProfile {
	border-radius: 100px;
	width: 45px;
	height: 45px;
	float: right;
	border: 2px solid #35affe;
	line-height: 42px;
	text-align: center;
}
.contTips {
	width: 100%;
	height: 60px;
	padding: 10px;
	border-radius: 5px;
	float: left;
	margin: 22px 0 0 0;
	background: #fffde8 url(../images/iconTips.png) no-repeat 25px center;
	background-size: 25px;
	box-shadow: 2px 2px 2px #ddd;
}
.tips {
	float: right;
	width: 80%;
	border-left: 1px solid #b7c4cd;
	font: 400 3vw 'Montserrat';
	color: #373c50;
	padding: 8px 15px 5px 20px;
}
.hSection {
	width: 100%;
	float: left;
	margin: 32px 0 0 0;
	font: 700 4.1vw 'Montserrat';
}
.roomShadow {
	box-shadow: 2px 2px 10px #ddd;
}
.listingLivingRoom, .listingMasterBedroom, .listingBedroomOne, .listingBedroomTwo, .listingKidsBedroom, .listingKitchen, .listingBathroom {
	width: 100%;
	height: 177px;
	float: left;
	margin: 18px 0 0 0;
	border-radius: 10px;
	box-shadow: 2px 2px 10px #ddd;
	position:relative; 

}
.listingLivingRoom {
	background: url(../images/imgLivingRoom.jpg) no-repeat center bottom;
	background-size: cover;
}
.listingMasterBedroom {
	background: url(../images/imgMasterBedroom.jpg) no-repeat center bottom 10px;
	background-size: cover;
}
.listingBedroomOne {
	background: url(../images/imgBedroomOne.jpg) no-repeat center bottom 20px;
	background-size: cover;
}
.listingBedroomTwo {
	background: url(../images/imgBedroomTwo.jpg) no-repeat center bottom 20px;
	background-size: cover;
}
.listingKidsBedroom {
	background: url(../images/imgKidsBedroom.jpg) no-repeat center bottom 10px;
	background-size: cover;
}
.listingKitchen {
	background: url(../images/imgKitchen.jpg) no-repeat center center;
	background-size: cover;
}
.listingBathroom {
	background: url(../images/imgBathroom.jpg) no-repeat center bottom 20px;
	background-size: cover;
}
.contRoomsInfo {
	width: 100%;
	height: 48px;
	border-radius: 0 0 10px 10px;
	position:absolute;                  
    bottom:0;                          
    left:0;
    display: table;
    background-color: #fff;
}
.roomsTitle {
	font: 700 3vw 'Montserrat';
    padding: 0 0 0 18px;
  	display: table-cell;
  	vertical-align: middle;
}
.roomsDeviceInfo {
	font: 400 2.75vw 'Montserrat';
	color: #a1acb4;
	padding: 0 40px 0 0;
  	display: table-cell;
  	text-align: right;
  	vertical-align: middle;
  	background: url(../images/iconPower.png) no-repeat right 10px center;
}

/* SWITCHES */

.switch {
  position: relative;
  height: 140px !important;
  width: 155px !important; 
}
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  -webkit-transition: .4s;
  transition: .4s;
  border: 2px solid #FFF;
  border-radius: 15px;
  box-shadow: 2px 2px 10px #ddd;
  background: #fff url(../images/bgToggleBtn.png) no-repeat left 15px bottom 15px;
}

.slider:before {
  position: absolute;
  content: "";
  height: 15px;
  width: 15px;
  left: 15px;
  bottom: 15px;
  background-color: #7d868f;
  -webkit-transition: .4s;
  transition: .4s;
  border-radius: 34px;
}
input['checkbox'] {
  display: none;
}

input:checked + .slider {
  background-color: #fff;
  border: 2px solid #079dfe;
    box-shadow: 2px 7px 10px #bfe1f7;
}

input:checked + .slider:before {
background-color: #079dfe;
  -webkit-transform: translateX(20px);
  -ms-transform: translateX(20px);
  transform: translateX(20px);


}

/* END: SWITCHES*/

.deviceTitle {
	padding-top:20px;
	background: url(../images/iconBulb.png) no-repeat left 15px top 15px;
	font: 600 2.85vw 'Montserrat';
	padding: 50px 0 0 15px;
	color: #7D868F;
}
.switchLeft {
	float: left;
		margin: 18px 0 0 0;
}
.switchRight {
	float: right;
		margin: 18px 0 0 0;
}
.bottomSpace {
	width: 100%;
	height: 100px;
	float: left;
}
.footer {
	width:100%;
	height:80px;
	position: fixed;
	bottom:0;
	background-color: #FFF;
	box-shadow: 2px 0px 10px #ddd;
}
.footerHome {
	width:19%;
	height: 80px;
	float: left;
   line-height: 80px;
   text-align: center;
}
.footerRooms {
	width:19%;
	height: 80px;
	float: left;
	line-height: 80px;
	text-align: center;
}
.footerAdd {
	width:24%;
	height: 80px;
	float: left;
	text-align: center;	
	padding: 7px 0 0 0;
}
.footerSchedule {
	width:19%;
	height: 80px;
	float: left;
	line-height: 80px;
	text-align: center;	
}
.footerSettings {
	width:19%;
	height: 80px;
	float: left;
	line-height: 80px;
	text-align: center;	
}
.goBack, .btnClose {
	line-height: 32px;
	height: 32px;
	margin: 25px 0 0 0;
	background-color: #FFF;
	width: 50px;
	text-align: right;

}
.goBackSignup {
	line-height: 32px;
	height: 32px;
	margin: 25px 0 0 0;
	background-color: #000;
	width: 50px;
	text-align: right;

}

.roomPhoto, .addRoomPhoto, .addDevicePhoto, .editDevicePhoto, .housePhoto {
	width: 100%;
	height: 225px;
	float: left;
	background: url(../images/imgLivingRoom.jpg) no-repeat center top;
	background-size: cover;
}
.addRoomPhoto {
	background: url(../images/addRooms.jpg) no-repeat center top;
	background-size: cover;
}
.addDevicePhoto {
	background: url(../images/addDevices.jpg) no-repeat center top;
	background-size: cover;
}
.editDevicePhoto {
	background: url(../images/editDevices.jpg) no-repeat center top;
	background-size: cover;
}
.housePhoto {
	background: url(../images/housePhoto.jpg) no-repeat center top;
	background-size: cover;
}
.contRoomsInfo-RP {
	width: 100%;
	height: 48px;
    background-color: #fff;
    float: left;
	display: table;
	box-shadow: 2px 2px 10px #ddd;
}
.roomsTitle-RP {
	font: 700 3vw 'Montserrat';
    padding: 0 0 0 18px;
  	display: table-cell;
  	vertical-align: middle;
}
.roomsDeviceInfo-RP {
	font: 400 2.75vw 'Montserrat';
	color: #a1acb4;
	padding: 0 40px 0 0;
  	display: table-cell;
  	text-align: right;
  	vertical-align: middle;
  	background: url(../images/iconPower.png) no-repeat right 10px center;
}
.addItems {
	font: 700 3.25vw 'Montserrat';
	width: 100%;
	height: 75px;
	float: left;
	border-radius: 10px;
	margin-bottom: 20px;
	box-shadow: 2px 2px 10px #ccc;
	line-height: 75px;
	padding-left: 55px;

}
.addItemsRooms {
		background: #D9EEFF url(../images/iconRooms.png) no-repeat left 25px center;
}
.addItemsDevices {
		background: #D9EEFF url(../images/iconDevices.png) no-repeat left 25px center;
}
.addItemsSchedules {
		background: #D9EEFF url(../images/iconSchedule.png) no-repeat left 25px center;
}


#listAddRooms, #listAddRoomID {
	border: 0 !important;
	border-bottom: 1px solid #079dfe !important;
	background: #FFF !important;
	font: 400 3.25vw 'Montserrat' !important;
	border-radius: 0;
	width: 100%;
	padding: 10px !important;
	margin: 15px 0 0 0 !important;
	height: 50px;
}
.btnAddRooms, .btnAddDevices, .btnDeleteRoom, .btnAddRoomDevices, .btnLogin, .btnSignup {
	margin: 20px 0 0 0;
	height: 50px;
	width: 40vw;
	color: #079dfe;
	border: 1px solid #079dfe;
	border-radius: 5px;
	background-color: #FFF;
	font: 600 4vw 'Montserrat';
	box-shadow: 2px 2px 10px #ddd;
}
.btnAddRoomDevices, .btnDeleteRoom  {
	width: 70% !important;
	margin: 20px auto 0 !important;
	font: 600 3.5vw 'Montserrat' !important;
	height: 40px;
}
.btnDeleteRoom  {
	background-color: #fba3a3;
	border: 1px solid #f00;
	color: #C00;
}
.btnLogin, .btnSignup {
	width: 100% !important;
	height: 40px;
	font: 600 3.5vw 'Montserrat' !important;
	background: rgb(255,255,153,0.9); 
	border: 1px solid #cccc66;
	color: #333;
	box-shadow: none;	
	margin: 15px auto 0 !important;
}

#txtEditDevice, #txtAddDevice, #txtEmail, #txtPassword, #txtSignupFullname, #txtSignupMobile, #txtSignupEmail, #txtSignupPassword, #txtSignupRePassword {
	border-width: 0 0 1px;
	border-color: #079dfe;
	background: #FFF !important;
	font: 400 3.25vw 'Montserrat' !important;
	border-radius: 0 !important;
	width: 100% !important;
	padding: 15px 0 15px 15px !important;
	margin: 15px 0 5px !important;
}

#txtEmail, #txtPassword, #txtSignupFullname, #txtSignupMobile, #txtSignupEmail, #txtSignupPassword, #txtSignupRePassword {
	background: rgb(0,0,0,0.3) !important;
	color: #FFF;
	margin: 10px 0 0 0 !important;
	border-width: 0 0 1px;
	border-color: #FFF;
	padding: 15px 0 15px 0 !important;
}
.editDisDeviceName {
	margin: 15px 0 0 0;
	font: 400 3vw 'Montserrat';
	width: 72%;
	height: 35px;
	float: left;
	line-height: 35px;
	border-bottom: 1px solid #a1acb4 !important;
}
.iconEdit, .iconDelete {
	margin: 15px 0 0 0;
	width: 14%;
	height: 35px;
	float: left;
	text-align: right;
	line-height: 35px;
	border-bottom: 1px solid #a1acb4 !important;
}

#roomNotFound {
	width: 100%;
	float: left;
	margin: 25px 0 0 0;
	text-align: center;
}
.editTxtDeviceName {
	width: 75%;
	float: left;
}
.btnEdit{
	float: left;
}
.abc {
	width: 100%;
	float: left;
	background-color: red;
}
.conTxtEditDevice {
	width: 88% !important;
	float: left;
}
.conBtnEditDevice {
	height: 60px;
	float: left;
	line-height: 60px;
	text-align: right;
	width: 12%;
}
.conBtnEditDevice img {
	vertical-align: bottom;

}
#contTxtEditDevices {
	display: none;
}

.contEmail, .contTxtbox, .contSignup {
	width: 80% !important;
	text-align: center !important;
	margin: 0 auto !important;
	font: 400 3.25vw 'Montserrat' !important;
	color: #FFF;
}
.alignLogin{
	/*margin-top: 500px !important;*/
	width: 100%;
	position: fixed;
	bottom: 110px;
}
.alignSignup {
	width: 100%;
	position: fixed;
	bottom: 135px;
}
.contSignup {
	width: 80% !important;
	margin-top: 20px !important;
}
.contSignup a {
	color: rgb(255,255,153,1) !important;
}
.contSignup a:visited {
	color: #FFF;
}
.contSignup a:active {
	color: #FFF;
}


#loaderCover {
	background: rgba(0,0,0,0.7);
	width: 100%;
	height: 100%;
	z-index: 99999;
	position: absolute;
	left: 0;
	top: 0;
	display: none;
}
.loaderContainer {
	font: 400 3vw 'Montserrat';
	background: rgba(255,255,255,1);
	padding: 25px;
	-webkit-box-shadow: 2px 2px 4px 2px rgba(0,0,0,0.1);
    -moz-box-shadow: 2px 2px 4px 2px rgba(0,0,0,0.1);
    box-shadow: 2px 2px 4px 2px rgba(0,0,0,0.1);
    width: 75%;
    text-align: center;
    position: absolute;
 	top: 50%; left: 50%;
  	transform: translate(-50%,-50%);
}










::placeholder { 
    color: #adb3bc;
    opacity: 1; 
}
:-ms-input-placeholder { 
    color: #adb3bc;
}
::-ms-input-placeholder { 
    color: #adb3bc;
}
::-moz-selection {
	background: #f45b52;
	color: #fff;
}
::selection {
	background: #f45b52;
	color: #fff;
}