.delete-app{
cursor:pointer;
padding: 5px 7px;
text-align: center;
position: absolute;
color: #828284;
background: #ccc;
border-radius: 50%;
z-index:9999;
display: none;
}

.index-row{
float: left;
width: 100%;
padding:4% 2%;
}

.index-row > .app-icons{
float: left;
padding: 0;
margin-left:2%;
}

.icon-linksys{
background: url('../img/app-store/linksys-icon.png') no-repeat;
background-size: 96%;
height: 135px;
width: 120px; 
cursor: pointer;
}

.icon-app-store{
background: url('../img/app-store/app-store-icon.png') no-repeat;
background-size: 87%;
background-position-x: 5px;
height: 135px;
width: 120px; 
}

.icon-app-home{
background: url('../img/app-store/apple-home.png') no-repeat;
background-size: 83%;
background-position-x:10px;
height: 135px;
width: 120px; 
}

.icon-app-settings{
background: url('../img/app-store/apple-settings.png') no-repeat;
background-size: 83%;
background-position-x:10px;
height: 135px;
width: 120px; 
}

.icon-linksys:hover,
.icon-app-settings:hover,
.icon-app-store:hover,
.icon-app-home:hover{
border:2px solid green;
cursor: pointer;
}

.app-name{
float: left;
width: 100%;
color: #fff;
font-size: 16px;
text-align: center;
margin-top: 90%;
} 

#control-center-btn{
background: rgba(122, 122, 122, 0.51);
position: absolute;
margin: 0 auto;
border-radius: 50%;
border: 2px solid #000;
bottom: 15px;
width: 95px;
height: 95px;
left: 43%;
border: 1px solid rgb(231, 231, 231);
z-index: 999;
}

.active-btn:hover{
border:2px solid green !important;
background: rgba(126, 211, 33, 0.24) !important;
cursor:pointer;
}

.cancel-del-app:hover{
border:2px solid green !important;
background: rgba(126, 211, 33, 0.24) !important;
cursor:pointer;
}

#apple-settings{
height: 100%;
width: 100%;
background-color: rgb(242, 242, 247);
padding: 0;
margin:0;
}

#apple-settings > div{
float: left;
height:100%;
}
#apple-settings > div.left-side{
width: 40%;
border-right: 1px solid #ccc;
}
#apple-settings > div.left-side > div{
float: left;
width: 100%;  
}
#apple-settings > div.left-side > .ls-body{
height: 100%;
background: rgb(242, 242, 247);   
}
#apple-settings > div.left-side > .ls-body > div{
float: left;
width: 100%;
}

/* pending css for settings [SOC] */
  #apple-settings > div.left-side > .ls-body > div.app-settings-header{
  background: url('../img/app-settings/setting-1.png') no-repeat !important;
  background-size: 253% 690% !important;
  background-position-y: -15px !important;
  height: 15% !important;
  }

  #apple-settings > div.left-side > .ls-body > div.app-settings-floating-header{
  background: url('../img/app-settings/setting-2.png') no-repeat !important;
  background-size: 253% 1017px !important;
  background-position-y: -20px !important;
  height: 5% !important;
  position: absolute;
  width: 40%;
  border-right: 1px solid #ccc;
  }

  #apple-settings > div.left-side > .ls-body > div.app-settings-body{
  /*background: #fff;*/
  /*padding:1%;*/
  background: url('../img/app-settings/setting-1.png') no-repeat !important;
  background-size: 253% 690% !important;
  background-position-y: -15px !important;
  height: 15% !important;
  }
/* pending css for settings [EOC] */

.setting-1{
background: url('../img/app-settings/setting-1.png') no-repeat;
background-size: 253% 103% !important;
background-position-y: -15px !important;
}

#setting-1{
height: 100%;
background: url('../img/app-settings/setting-1.png') no-repeat;
background-size: 253% 103%;
background-position-y: -15px;
}
#setting-1 > .ipad-owner{
float: left;  
width: 100%;
margin-top: 58%;
}
#setting-1 > .ipad-owner > .io-initials{
float: left;
padding: 6px 3px;
font-size: 20px;
color: #fff;
background: #c7c7cc;
/* border: 1px solid; */
margin-top: 10%;
margin-left: 7%;
text-align: center;
}
#setting-1 > .ipad-owner > .io-name{
float: left;
font-size: 20px;
background: rgb(255, 255, 254);
/* border: 1px solid; */
margin-left: 7%;
padding: 2% 0;
margin-top: 6%;
width: 70%;
}
#setting-1 > div.btn-settings{
float: left;
width: 100%;
margin-top: 178%; 
padding: 8%;
border: 1px solid green;
cursor: pointer;
}
#setting-1 > div.btn-settings:hover{
background: rgba(0, 128, 0, 0.45);
}

#setting-2{
height: 100%;
background: url('../img/app-settings/setting-2.png') no-repeat;
background-size: 253% 103%;
background-position-y: -64px;
}

#setting-2 > div.btn-settings{
float: left;
width: 100%;
padding: 7%;
border: 1px solid green;
cursor: pointer;
margin-top: 302%; 
}
@-moz-document url-prefix() { 
  #setting-2 > div.btn-settings {
     margin-top: 306%;
  }
}

#setting-2 > div.btn-settings:hover{
background: rgba(0, 128, 0, 0.45);
}

#setting-3{
height: 100%;
background: url('../img/app-settings/setting-3.png') no-repeat;
background-size: 253% 103%;
background-position-y: -67px;
margin-top: -54px;
}

.active-setting-general{
background: url('../img/app-settings/active-general.png') no-repeat !important;
background-size: 253% 103% !important;
background-position-y: -15px !important; 
}
.setting-general-content{
background: url('../img/app-settings/active-general.png') no-repeat !important;
background-size: 165% 103% !important;
background-position-y: -15px !important;
background-position-x: -246px !important;  
}

.active-setting-home{
background: url('../img/app-settings/active-home.png') no-repeat !important; 
background-size: 253% 103% !important;
background-position-y: -64px !important;
}
.setting-home-content{
background: url('../img/app-settings/setting-1.png') no-repeat !important;
background-size: 165% 108% !important;
background-position-y: -15px !important;
background-position-x: -246px !important;  
}


#apple-settings > div.left-side > .content-overflow{
overflow-y: auto;  
}

#apple-settings > div.right-side{
width: 60%;
}

#apple-settings > div.right-side > div{
float:  left;
width: 100%;
}

#apple-settings > div.right-side > #setting-home-con > .btn-slide-con{
float: right;
margin-top: 23%;
margin-right: 5%;
padding: 5% 7%;
background-position-y: 3px;
background-position-x: 5px;
background-size: 80% 80%;
}

.btn-slide-con:hover{
border: 1px solid green;
cursor: pointer;
}

.bs-on{
background: url('../img/app-settings/slider-on.png') no-repeat;
background-size: contain;  
}

#app-store{
height: 100%;
background: rgb(240, 240, 240);
padding: 0;
margin:0;
}

#app-store > .top-part{
float: left;
width: 100%;
height: 38px;	
background: url('../img/app-store/top-part.png') no-repeat;
background-size: 100%;
}

#app-store > .middle-part{
float: left;
width: 100%;	
height: 815px;
background: rgb(240, 240, 240);
overflow-y: auto;
}

.ipad-app-store > .middle-part{
height: 852px !important;
}

/* CUSTOMIZE SIDE MENU SCROLL BAR [SOC] */

  /* Gray Scroll */
  /* width */
  #app-store > .middle-part::-webkit-scrollbar {
    width: 8px;
    border-radius:20px;
  }

  /* Track */
  #app-store > .middle-part::-webkit-scrollbar-track {
    /*background: #ccc;*/
    background: #fff;
    padding:5px;
  }
   
  /* Handle */
  #app-store > .middle-part::-webkit-scrollbar-thumb {
    /*background: rgb(152, 152, 152);*/
    background: #ccc;
    border-radius:20px;
  }

  /* Handle on hover */
  #app-store > .middle-part::-webkit-scrollbar-thumb:hover {
    /*background: #666;*/
    background: #ccc;
    border-radius:20px;
  }

   /* for FIREFOX MOZILLA */
  @-moz-document url-prefix() { 
      
      /* Gray Scroll */
      #app-store > .middle-part{
          /*scrollbar-color: rgb(152, 152, 152) #ccc;*/
          scrollbar-color: #ccc #fff;
          scrollbar-width: thin;
      }
  }
/* CUSTOMIZE  SIDE MENU SCROLL BAR [EOC] */

#app-store > .middle-part > .todays-app,
#app-store > .middle-part > .search-app,
#app-store > .middle-part > .search-result{
float: left;
width: 100%;	
height: 815px;
}

.ipad-app-store > .middle-part > .todays-app,
.ipad-app-store > .middle-part > .search-app,
.ipad-app-store > .middle-part > .search-result{
float: left;
width: 100%;  
height: 852px;
}

#ta-1{
background: url('../img/app-store/IMG_1479.png') no-repeat;
background-size: 100%;	
}
.ipad-app-store > .middle-part > #ta-1{
background: url('../img/app-store/ipad/IMG_0314.png') no-repeat;
background-size: 100%;
}

#ta-2{
background: url('../img/app-store/IMG_1480.png') no-repeat;
background-size: 100%;	
}
.ipad-app-store > .middle-part > #ta-2{
background: url('../img/app-store/ipad/IMG_0315.png') no-repeat;
background-size: 100%;
}

#ta-3{
background: url('../img/app-store/IMG_1481.png') no-repeat;
background-size: 100%;	
}
.ipad-app-store > .middle-part > #ta-3{
background: url('../img/app-store/ipad/IMG_0316.png') no-repeat;
background-size: 100%;
}

#ta-4{
background: url('../img/app-store/IMG_1482.png') no-repeat;
background-size: 100%;	
}

#sa-1{
background: url('../img/app-store/IMG_1483.png') no-repeat;
background-size: 100%;	
}
.ipad-app-store > .middle-part > #sa-1{
background: url('../img/app-store/ipad/IMG_0321.png') no-repeat;
background-size: 100% 115%;  
}

#sa-1 > #search-input{
float: left;
padding: 5%;
margin-top: 30%;
margin-left: 5%;
width: 90%;
cursor: pointer;
}
.ipad-app-store > .middle-part > #sa-1 > #search-input{
float: left;
padding: 4%;
margin-top: 14%;
margin-left: 3%;
width: 94%;
cursor: pointer;
}

#sa-2{
background: url('../img/app-store/IMG_1484.png') no-repeat;
background-size: contain;
}
.ipad-app-store > .middle-part > #sa-2{
background: url('../img/app-store/ipad/IMG_0318_.png') no-repeat;
background-size: contain;  
background-position-y: 20px;
}

#search-input-con{
background: url('../img/app-store/IMG_1484.png') no-repeat;
height: 102px;
width: 100%;
position: absolute;
top: 37px;
}
.ipad-app-store > .middle-part > #search-input-con{
background: url('../img/app-store/ipad/bg-search-input.png') no-repeat;
background-size: 100% 60%;
}

#search-input-con > input#sa-input{
float: left;
margin-top: 20px;
margin-left: 13%;
width: 60%;
color: #3b3b3b;
font-size: 34px;
border: none;
caret-color: rgb(66, 107, 243);
}
.ipad-app-store > .middle-part > #search-input-con > input#sa-input{
float: left;
margin-top: 12px;
margin-left: 148px;
width: 346px;
border-radius: 10px;
color: #3b3b3b;
height: 38px;
font-size: 26px;
border: none;
caret-color: rgb(66, 107, 243);
}

#search-input-con > input.active{
background-color: rgb(228, 229, 231);	
}

#search-input-con > div#sa-cancel{
float: right;
padding: 8% 10%;
margin-right: 2%;
}
.ipad-app-store > .middle-part > #search-input-con > div#sa-cancel{
float: right;
padding: 5%;
margin-right: 2%;
}

#search-input-con > div#sa-cancel:hover{
border: 2px solid green;
background: rgba(126, 211, 33, 0.24);
cursor:pointer;
}

#keyboard{
background: url('../img/app-store/keypad.png') no-repeat;
background-size: contain;
position: absolute;
width: 100%;
height: 425px;
bottom:0;
}
.ipad-app-store > .middle-part > #keyboard{
background: url('../img/app-store/ipad/keypad.png') no-repeat;
background-size: contain;
background-color: rgb(214, 216, 221);
position: absolute;
width: 100%;
height: 260px;
bottom: 0;
}

#keyboard > div#key-btn-search{
float: right;
padding: 7% 13%;
margin-top: 53%;
}
.ipad-app-store > .middle-part > #keyboard > div#key-btn-search{
float: right;
padding: 5% 8%;
margin-top: 15%;
}

#keyboard > div.active{
background: url('../img/app-store/active-search-btn.png') no-repeat;
background-size: 100%;
}

.ipad-app-store > .middle-part > #keyboard > div.active{
background: url('../img/app-store/active-search-btn.png') no-repeat;
background-size: 95%;
background-position-x:4px;  
}
/*#keyboard > div#key-btn-search:hover{
border: 2px solid green;
background-color: rgba(126, 211, 33, 0.24);
cursor: pointer;
}*/
#keyboard > div.active:hover{
background: url('../img/app-store/active-search-btn.png') no-repeat !important;
background-size: 100% !important;
border: 2px solid green;
background-color: rgba(126, 211, 33, 0.24);
cursor: pointer;
}
.ipad-app-store > .middle-part > #keyboard > div.active:hover{
background: url('../img/app-store/active-search-btn.png') no-repeat !important;
background-size: 95% !important;
background-position-x:4px !important; 
border: 2px solid green;
background-color: rgba(126, 211, 33, 0.24);
cursor: pointer;
}

#sa-3{
background: url('../img/app-store/IMG_1485.png') no-repeat;
background-size: 100%;	
}
.ipad-app-store > .middle-part > #sa-3{
background: url('../img/app-store/ipad/IMG_0319_.png') no-repeat;
background-size: contain;  
background-position-y: 20px;
}

#sr-0{
background: url('../img/app-store/IMG_1484.png') no-repeat;
background-size: 100%;
height: 100px !important;
}
.ipad-app-store > .middle-part > #sr-0{
background: url('../img/app-store/ipad/IMG_0320.png') no-repeat !important;
background-size: 100% !important;
background-position-y: 5px !important;
height: 100% !important;
}
#sr-0 > div.open-app{
float: left;
padding: 3% 5%;
margin: 58% 0 0 38%;
}
#sr-0 > div.next-action:hover{
border: 2px solid green;
background-color: rgba(126, 211, 33, 0.24);
cursor: pointer;  
}

#sr-0 > div.download{
background: url('../img/app-store/download-home-icon.png') no-repeat;
background-color: #fff;
background-position: center;
}
#sr-0 > div.dl-1{
background: url('../img/app-store/dl-1.png') no-repeat;
background-size: contain;
background-color: #fff !important;
background-position-x: 15px; 
}
#sr-0 > div.dl-2{
background: url('../img/app-store/dl-2.png') no-repeat;
background-size: contain;
background-color: #fff !important;
background-position-x: 16px;  
}
#sr-0 > div.dl-3{
background: url('../img/app-store/dl-3.png') no-repeat; 
background-size: contain;
background-color: #fff !important;
background-position-x: 17px; 
}
/*#sr-4 > div.dl-1:hover,
#sr-4 > div.dl-2:hover,
#sr-4 > div.dl-3:hover,*/
#sr-0 > div.download:hover{
border: 2px solid green;
background-color: #fff;
cursor: pointer;  
}

#sr-1{
background: url('../img/app-store/IMG_1486.png') no-repeat;
background-size: 100%;	
}
.ipad-app-store > .middle-part > #sr-1{
background: url('../img/app-store/ipad/IMG_0322.png') no-repeat !important;
background-size: 100% !important;
background-position-y: 5px !important;
height: 100% !important;
margin-top: -132px;
}

#sr-2{
background: url('../img/app-store/IMG_1487.png') no-repeat;
background-size: 100%;	
}
#sr-3{
background: url('../img/app-store/IMG_1488.png') no-repeat;
background-size: 100%;	
}

#sr-4{
background: url('../img/app-store/IMG_1489.png') no-repeat;
background-size: 100%;	
}
#sr-4 > div.open-app{
float: right;
padding: 6% 12%;
margin: 16% 4% 0 0;
}
#sr-4 > div.next-action:hover{
border: 2px solid green;
background-color: rgba(126, 211, 33, 0.24);
cursor: pointer;	
}

#sr-4 > div.download{
background: url('../img/app-store/download-home-icon.png') no-repeat;
background-size: 95px;
background-color: #fff;
background-position-x: 110%;
}
#sr-4 > div.dl-1{
background: url('../img/app-store/dl-1.png') no-repeat;
background-size: 95px;
background-color: #fff !important;
background-position-x: 110%;
background-position-y:-11px; 	
}
#sr-4 > div.dl-2{
background: url('../img/app-store/dl-2.png') no-repeat;
background-size: 95px;
background-color: #fff !important;
background-position-x: 110%;
background-position-y:-11px; 	
}
#sr-4 > div.dl-3{
background: url('../img/app-store/dl-3.png') no-repeat;	
background-size: 95px;
background-color: #fff !important;
background-position-x: 110%;
background-position-y:-11px; 
}
/*#sr-4 > div.dl-1:hover,
#sr-4 > div.dl-2:hover,
#sr-4 > div.dl-3:hover,*/
#sr-4 > div.download:hover{
border: 2px solid green;
background-color: #fff;
cursor: pointer;	
}


#sr-5{
background: url('../img/app-store/IMG_1490.png') no-repeat;
background-size: 100%;	
}
#sr-6{
background: url('../img/app-store/IMG_1491.png') no-repeat;
background-size: 100%;	
}
#sr-7{
background: url('../img/app-store/IMG_1492.png') no-repeat;
background-size: 100%;	
}


#app-store > .bottom-part{
float: left;
width: 100%;
height: 96px;	
background: url('../img/app-store/active-today.png') no-repeat;
background-size: 100%;
}

.ipad-app-store > .bottom-part{
height: 60px !important; 
border-top: 1px solid #ccc;
}

#app-store > .bg-btn-today{
background: url('../img/app-store/active-today.png') no-repeat;
}
.ipad-app-store > .bg-btn-today{
background: url('../img/app-store/ipad/active-today.png') no-repeat !important;
background-size: 110% 54px !important;
background-position-x: -40px !important;
}

#app-store > .bg-btn-search{
background: url('../img/app-store/active-search.png') no-repeat;
}
.ipad-app-store > .bg-btn-search{
background: url('../img/app-store/ipad/active-search.png') no-repeat !important;
background-size: 110% 54px !important;
background-position-x: -40px !important;
}

#app-store > .bottom-part > div.app-store-btns{
float:left;
height: 100%;
padding:10%;
}

#app-store > .bottom-part > div.app-store-btns:hover{
border: 2px solid green;
background: rgba(126, 211, 33, 0.24);
cursor:pointer;
}

#app-store > .bottom-part > #btn-search{
float: right;
}


/* CUSTOMIZE SIDE MENU SCROLL BAR [SOC] */

  /* Gray Scroll */
  /* width */
  .content-overflow::-webkit-scrollbar {
    width: 8px;
    border-radius:20px;
  }
  .thin-scroll::-webkit-scrollbar {
    width: 5px;
    border-radius:20px;
  }
  .fading-select-options::-webkit-scrollbar {
    width: 5px;
    border-radius:20px;
  }

  /* Track */
  .content-overflow::-webkit-scrollbar-track {
    background: #ccc;
    padding:5px;
  }
  .thin-scroll::-webkit-scrollbar-track {
    background: #ccc;
    padding:5px;
  }
  .fading-select-options::-webkit-scrollbar-track {
    background: #fff;
    padding:5px;
  }
  .transparent-scroll::-webkit-scrollbar-track{
  background: transparent !important;  
  }

  /* Handle */
  .content-overflow::-webkit-scrollbar-thumb {
    background: rgb(152, 152, 152);
    border-radius:20px;
  }
  .thin-scroll::-webkit-scrollbar-thumb {
    background: rgb(152, 152, 152);
    border-radius:20px;
  }
  .fading-select-options::-webkit-scrollbar-thumb {
    background: #fff;
    border-radius:20px;
  }
  .transparent-scroll::-webkit-scrollbar-thumb{
  background: transparent !important;  
  } 


  /* Handle on hover */
  .content-overflow::-webkit-scrollbar-thumb:hover {
    background: #666;
    border-radius:20px;
  }
  .thin-scroll::-webkit-scrollbar-thumb:hover {
    background: #666;
    border-radius:20px;
  }
  .fading-select-options::-webkit-scrollbar-thumb:hover {
    background: #fff;
    border-radius:20px;
  }
  .transparent-scroll::-webkit-scrollbar-thumb:hover{
  background: transparent !important;  
  } 

   /* for FIREFOX MOZILLA */
  @-moz-document url-prefix() { 
      
      /* Gray Scroll */
      .content-overflow{
          scrollbar-color: rgb(152, 152, 152) #ccc;
          scrollbar-width: thin;
      }
      .thin-scroll{
          scrollbar-color: rgb(152, 152, 152) #ccc;
          scrollbar-width: thin;
      }
      .fading-select-options{
          scrollbar-color: #fff #fff;
          scrollbar-width: thin;
      }
      .transparent-scroll{
          scrollbar-color: transparent transparent !important;
      }
  }
/* CUSTOMIZE  SIDE MENU SCROLL BAR [EOC] */