body
{
    font-size: .80em;
}

/* sidebar */
div#iris-sidebar ul li > i
{
    float: right;
    margin-top: 5px;
}

.toplogo {
	display: block;
	width: 93px;
	height: 93px;
	position: absolute;
	left: 0;
	top: 0;
	border: none;
	background-image: url('/Content/Images/toplogo.png');
	background-size: 100% 100%;
}

/* end sidebar*/

thead
{
    font-weight: bold;
    background-color: #03305A;
    color: white;
  
}
.iris-table-header
{
    
    text-align:center
}
tr a:hover
{
    color: red;
}

.selected-row
{
    background-color: #23e9f6;
}

.iris-table tbody tr:hover
{
    background-color: rgba(232, 232, 243, 0.75);
    color: red;
    border: 1px solid rgba(13, 13, 13, 0.41);
    border-radius: 10px;
}

.iris-table tr:hover a
{
  
}

.btn
{
    font-family: Tahoma;
}

#div-user-detail div.row-fluid
{
    margin-bottom: 10px;
    border-bottom: dashed 1px;
    border-bottom-color: #2e2cfa;
}
/* info and errors */
.message-info
{
    border: 1px solid;
    clear: both;
    padding: 10px 20px;
}

.message-error
{
    clear: both;
    color: #e80c4d;
    font-size: 1.1em;
    margin: 20px 0 10px 0;
}

.message-success
{
    color: #17a407;
    font-size: 1.3em;
    margin: 20px 0 10px 0;
}

.error
{
    color: #e80c4d;
}

/* styles for validation helpers */
.field-validation-error
{
    color: #e80c4d;
}

.field-validation-valid
{
    display: none;
}

input.input-validation-error
{
    border: 1px solid #e80c4d;
}

input[type="checkbox"].input-validation-error
{
    border: 0 none;
}

.validation-summary-errors
{
    color: #e80c4d;
    font-size: 1.1em;
    list-style: none !important;
}

.validation-summary-valid
{
    display: none;
}

/* custom css*/
.iris-table td
{
    text-align: center;
}
/* Comment DataTable css */
#comment-table div#sent-time
{
    font-size: 12px;
}

#comment-table table td
{
    vertical-align: middle;
}

/* End comment DataTable css */


/* Begin user datatable*/
#user-table table td
{
    vertical-align: middle;
}
/* End user DataTable */
div#loadingMessage
{
    text-align: center;
    padding: 5px;
    position: fixed;
    width: 200px; /* adjust */
    height: 30px; /* adjust */
    top: 50%;
    z-index: 9999999999999999999;
    left: 50%;
    margin-left: -100px; /* half of the width */
    margin-top: -100px; /* half of the height */
    background-color: #77aad0;
    background-color: rgba(119, 170, 208, 0.56);
    border-radius: 5px;
    border: 1px solid #03305A;
    display: none;
}
div#loadingMessage img {
    float: right;
}

    div#loadingMessage div
    {
        font-weight: bold;
        margin-top: 5px;
    }



  a.phonebook
{
    background: url(../content/icons/bulletin.jpg) no-repeat top left;
     display: block;
     width: 128px;
     height: 128px;
     text-align:center;
 margin: auto;
    /* text-indent: -9999px; /* hides the link text */
    
}
   a.eghtesadi
{
    background: url(../content/icons/eghtesadi.jpg) no-repeat top left;
     display: block;
     width: 128px;
     height: 128px;
     text-align:center;
 margin: auto;
    /* text-indent: -9999px; /* hides the link text */
    
}

    a.mahvare
{
    background: url(../content/icons/mahvare.jpg) no-repeat top left;
     display: block;
     width: 128px;
     height: 128px;
     text-align:center;
 margin: auto;
    
}

        a.Forein
{
    background: url(../content/icons/Forein.gif) no-repeat top left;
     display: block;
     width: 128px;
     height: 128px;
     text-align:center;
 margin: auto;
    
}

   a.farhangi
{
    background: url(../content/icons/farhangi.jpg) no-repeat top left;
     display: block;
     width: 128px;
     height: 128px;
     text-align:center;
 margin: auto;
    
}
   a.searchlogo
{
    background: url(../content/Saman.ICON/Search/search3.png) no-repeat top left;
     display: block;
     width: 128px;
     height: 128px;
     text-align:center;
 margin: auto;
    /* text-indent: -9999px; /* hides the link text */
    
}
        a.accesstel
{
    background: url(../content/Saman.ICON/access/accesstel.png) no-repeat top left;
     display: block;
     width: 150px;
     height: 150px;
     text-align:center;
 margin: auto;
    /* text-indent: -9999px; /* hides the link text */
    
}
  a.lovecontact
{
    background: url(../content/Saman.ICON/LOveCall/Favorite1.png) no-repeat top left;
    display: block;
    text-align:center;
     width: 150px;
     height: 150px;
    margin: auto;
  
}
      a.contact
{
    background: url(../content/img/icon/folder_music_green.png) no-repeat top left;
    display: block;
    text-align:center;
     width: 128px;
     height: 128px;
    margin: auto;
  
}

            a.users
{
    background: url(../content/img/icon/buddy_group.png) no-repeat top left;
    display: block;
    text-align:center;
     width: 128px;
     height: 128px;
     margin-left:50%;
    
}

            
   a.usersList
{
    background: url(../content/Saman.ICON/users/Groupusers.png) no-repeat top left;
    display: block;
    text-align:center;
     width: 128px;
     height: 128px;

     margin: auto;
}

    a.Roles
{
    background: url(../content/Saman.ICON/users/group-of-people.png) no-repeat top left;
    display: block;
    text-align:center;
     width: 128px;
     height: 128px;

     margin: auto;
}
 a.Organization
{
    background: url(../content/Saman.ICON/users/agency.png) no-repeat top left;
    display: block;
    text-align:center;
     width: 128px;
     height: 128px;

     margin: auto;
}
      
     a.MenuAccess
{
    background: url(../content/Saman.ICON/setting/application-x-pem-key.png) no-repeat top left;
    display: block;
    text-align:center;
     width: 128px;
     height: 128px;

     margin: auto;
}
   
      
    a.MainUser
{
    background: url(../content/Saman.ICON/UserProfile/Buzz-Contact-card-icon.png) no-repeat top left;
    display: block;
    text-align:center;
     width: 128px;
     height: 128px;

     margin: auto;
}      
            
  a.onlineUsers
{
    background: url(../content/Saman.ICON/onlineusers/around-the-world.png) no-repeat top left;
     margin: auto;
    display: block;
    text-align:center;
     width: 128px;
     height: 128px;
}
      a.onlinecontact
{
    background: url(../content/Saman.ICON/Contacts/128Phone-icon_2.png) no-repeat top left;
     display: block;
        margin: auto;
     width: 128px;
     height: 128px;
     text-align:center;

    /* text-indent: -9999px; /* hides the link text */
    
}
  .onlinecontactpage {
    background: url(../content/Saman.ICON/Contacts/128Phone-icon_3.png) no-repeat left top;
    text-align: center;
   
    display: block;
    position: absolute;
    top: 35px;
    right: 20px;
    width:96px;
    height:96px;
}

    .usermanagepage {
      background: url(../content/Saman.ICON/users/Group-icon2.png) no-repeat top left;
    text-align: center;
   
    display: block;
    position: absolute;
    top: 35px;
    right: 20px;
    width:96px;
    height:96px;
}
    a.offlinecontact
{
    background: url(../content/Saman.ICON/Contacts/SettingsPhone.png) no-repeat top left; 
    margin: auto;
    display: block;
    text-align:center;
     width: 128px;
     height: 128px;
    
}


   .offlinecontactpage {
    background: url(../content/Saman.ICON/Contacts/SettingsPhone1.png) no-repeat left top;
    text-align: center;
   
    display: block;
    position: absolute;
    top: 35px;
    right: 20px;
    width:96px;
    height:96px;
}

    .offlinesearchpage {
    background: url(../Content/Saman.ICON/setting/Settings-icon64.png) no-repeat right top;
    text-align: center;
   
    display: block;
    position: absolute;
    top: 5px;
    right: 5px;
    width:64px;
    height:64px;
}
   a.changepass
{
    background: url(../content/Saman.ICON/password/change-password.png) no-repeat top left;
    display: block;
    text-align:center;
     width: 128px;
     height: 128px;
    margin: auto;
    
}
      a.account
{
    background: url(../content/Saman.ICON/UserProfile/id_card.png) no-repeat top left;
    display: block;
    text-align:center;
     width: 128px;
     height: 128px;
 margin: auto;
    
}

  a.massage
{
    background: url(../content/Saman.ICON/Message/e_mail.png) no-repeat top left;
    display: block;
    text-align:center;
     width: 128px;
     height: 128px;
     margin: auto;
    
}

  
  a.exit
{
    background: url(../content/Saman.ICON/other/exit.png) no-repeat top left;
    display: block;
    text-align:center;
     width: 128px;
     height: 128px;
   margin: auto;
   list-style: none outside none;
    
}

    a.exit1
{
    background: url(../content/images/logout-32.png) no-repeat top left;
    display: block;
    text-align:left;
     width: 32px;
     height: 32px;
   margin: auto;
   list-style: none outside none;
           color: #FFFFFF;
            text-decoration: none;
            text-shadow: 0 1px 0 #49afcd;
    
}
  a.usermanage
{
    background: url(../content/Saman.ICON/users/Group-icon1.png) no-repeat top left;
    display: block;
    text-align:center;
     width: 128px;
     height: 128px;
    margin: auto;
    
}

   a.ReportList
{
    background: url(../content/Saman.ICON/Report/icon-reportsee.png) no-repeat top left;
    display: block;
    text-align:center;
     width: 128px;
     height: 128px;
   margin: auto;
    
}
  a.UsersLog
{
    background: url(../content/Saman.ICON/log/128.png) no-repeat top left;
    display: block;
    text-align:center;
     width: 128px;
     height: 128px;
 margin: auto;
    
}
   
  a.HardwareManage
{
    background: url(../content/Saman.ICON/Hardware/hardware.png) no-repeat top left;
    display: block;
    text-align:center;
     width: 128px;
     height: 128px;
 margin: auto;
    
}
  
  a.HardwareMonitoring
{
    background: url(../content/Saman.ICON/Monitoring/monitoring.png) no-repeat top left;
    display: block;
    text-align:center;
     width: 128px;
     height: 128px;
     margin: auto;
}
  a.Charting
{
    background: url(../content/Saman.ICON/Monitoring/monitoring.png) no-repeat top left;
   
    text-align:center;
     width: 24px;
     height: 24px;
     margin: auto;
}
  
  a.HardwareCard
{
    background: url(../content/Saman.ICON/Hardware/hardwarecards.png) no-repeat top left;
    display: block;
    text-align:center;
     width: 128px;
     height: 128px;
      margin: auto;
}
  
  a.harwarelog
{
    background: url(../content/Saman.ICON/Hardware/harwarelog.png) no-repeat top left;
    display: block;
    text-align:center;
     width: 128px;
     height: 128px;
    margin: auto;
}
  
  a.LineManage
{
    background: url(../content/Saman.ICON/Hardware/pbx-icon.png) no-repeat top left;
    display: block;
    text-align:center;
     width: 128px;
     height: 128px;
   margin: auto;
}
 icon_del
{
    background: url(../content/img/icon/delete.png) no-repeat top left;
    display: block;
    text-align:center;
     width: 128px;
     height: 128px;
     margin: auto;

}

  #ShowOnlineVoice
{
    background:  url(../content/img/icon/forward_next1.png) no-repeat top left ;
    font-size:0;
    width:36px;
    height:36px;    
   
    
}

   #viewvoice
{
    background:  url(../content/Saman.ICON/Detail/1384131571_59_Chat.png) no-repeat top left ;

    font-size:0;
    width:36px;
    height:36px;    
   
    
}


    .demo-section {
        padding: 30px;
        width: 577px;
    }
    #listView {
        padding: 10px;
        margin-bottom: -1px;
        min-width: 555px;
        min-height: 510px;
    }
    .product {
        float: left;
        position: relative;
        width: 111px;
        height: 170px;
        margin: 0;
        padding: 0;
    }
    .product img {
        width: 110px;
        height: 110px;
    }
    .product h3 {
        margin: 0;
        padding: 3px 5px 0 0;
	    max-width: 96px;
	    overflow: hidden;
        line-height: 1.1em;
        font-size: .9em;
        font-weight: normal;
        text-transform: uppercase;
        color: #999;
    }
    .product p {
        visibility: hidden;
    }
    .product:hover p {
        visibility: visible;
        position: absolute;
        width: 110px;
        height: 110px;
        top: 0;
        margin: 0;
        padding: 0;
        line-height: 110px;
        vertical-align: middle;
        text-align: center;
        color: #fff;
        background-color: rgba(0,0,0,0.75);
        transition: background .2s linear, color .2s linear;
        -moz-transition: background .2s linear, color .2s linear;
        -webkit-transition: background .2s linear, color .2s linear;
        -o-transition: background .2s linear, color .2s linear;
    }
    .k-listview:after, .product dl:after {
        content: ".";
        display: block;
        height: 0;
        clear: both;
        visibility: hidden;
    }

.copyright {
    margin-top:5px;
    font-family: tahoma;
    font-size: 12px;
    
    color: rgba(100, 108, 138, 0.9);

}


 .dashbordMENU {
    float: right;
    display: block;
    padding: 5px 15px 10px 10px;
    margin-right: -20px;
    font-size: 12px;
    font-weight:bold;
   
    color: #777777;

     text-decoration: none;
          margin-top: 10px;
    margin-right: 15px;
 list-style: none outside none;
           color: #FFFFFF;
            text-decoration: none;
            text-shadow: 0 1px 0 #49afcd;
}




#btnSearch {
  
}

.datatablediv {
    display:block;
    margin-top:0px;
}

.tdstyle {
    padding:10px;
    color:blue;
}


.scrollContact {
	margin:auto;
    overflow: auto; height: 520px; width: 100%;
	-webkit-overflow-scrolling: touch;
}
.scrollSearch {
	margin:auto;
    overflow: visible; height: 100%; width: 95%;
	-webkit-overflow-scrolling: touch;
}
.chkcontact {
    border-style: solid;
    border-width: inherit;
    border-color: #CCCCCC;


}






















/*
input[type=checkbox] {
	visibility: hidden;
}*/

/* SLIDE ONE */
.slideOne {
	width: 50px;
	height: 10px;
	background: #333;
	margin: 20px auto;

	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
	position: relative;

	-webkit-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
	-moz-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
	box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
}

.slideOne label {
	display: block;
	width: 16px;
	height: 16px;

	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;

	-webkit-transition: all .4s ease;
	-moz-transition: all .4s ease;
	-o-transition: all .4s ease;
	-ms-transition: all .4s ease;
	transition: all .4s ease;
	cursor: pointer;
	position: absolute;
	top: -3px;
	left: -3px;

	-webkit-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
	box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
	background: #fcfff4;

	background: -webkit-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -moz-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -o-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -ms-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfff4', endColorstr='#b3bead',GradientType=0 );
}

.slideOne input[type=checkbox]:checked + label {
	left: 37px;
}

/* SLIDE TWO */
.slideTwo {
	width: 80px;
	height: 30px;
	background: #333;
	margin: 20px auto;

	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
	position: relative;

	-webkit-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
	-moz-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
	box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
}

.slideTwo:after {
	content: '';
	position: absolute;
	top: 14px;
	left: 14px;
	height: 2px;
	width: 52px;

	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
	background: #111;

	-webkit-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
	-moz-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
	box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
}

.slideTwo label {
	display: block;
	width: 22px;
	height: 22px;

	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;

	-webkit-transition: all .4s ease;
	-moz-transition: all .4s ease;
	-o-transition: all .4s ease;
	-ms-transition: all .4s ease;
	transition: all .4s ease;
	cursor: pointer;
	position: absolute;
	top: 4px;
	z-index: 1;
	left: 4px;

	-webkit-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
	box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
	background: #fcfff4;

	background: -webkit-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -moz-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -o-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -ms-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfff4', endColorstr='#b3bead',GradientType=0 );
}

.slideTwo label:after {
	content: '';
	position: absolute;
	width: 10px;
	height: 10px;

	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
	background: #333;
	left: 6px;
	top: 6px;

	-webkit-box-shadow: inset 0px 1px 1px rgba(0,0,0,1), 0px 1px 0px rgba(255,255,255,0.9);
	-moz-box-shadow: inset 0px 1px 1px rgba(0,0,0,1), 0px 1px 0px rgba(255,255,255,0.9);
	box-shadow: inset 0px 1px 1px rgba(0,0,0,1), 0px 1px 0px rgba(255,255,255,0.9);
}

.slideTwo input[type=checkbox]:checked + label {
	left: 54px;
}

.slideTwo input[type=checkbox]:checked + label:after {
	background: #00bf00;
}

/* SLIDE THREE */
.slideThree {
	width: 80px;
	height: 26px;
	background: #333;
	margin: 20px auto;

	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
	position: relative;

	-webkit-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
	-moz-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
	box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,0.2);
}

.slideThree:after {
	content: 'OFF';
	font: 12px/26px Arial, sans-serif;
	color: #000;
	position: absolute;
	right: 10px;
	z-index: 0;
	font-weight: bold;
	text-shadow: 1px 1px 0px rgba(255,255,255,.15);
}

.slideThree:before {
	content: 'ON';
	font: 12px/26px Arial, sans-serif;
	color: #00bf00;
	position: absolute;
	left: 10px;
	z-index: 0;
	font-weight: bold;
}

.slideThree label {
	display: block;
	width: 34px;
	height: 20px;

	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;

	-webkit-transition: all .4s ease;
	-moz-transition: all .4s ease;
	-o-transition: all .4s ease;
	-ms-transition: all .4s ease;
	transition: all .4s ease;
	cursor: pointer;
	position: absolute;
	top: 3px;
	left: 3px;
	z-index: 1;

	-webkit-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
	box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
	background: #fcfff4;

	background: -webkit-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -moz-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -o-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -ms-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfff4', endColorstr='#b3bead',GradientType=0 );
}

.slideThree input[type=checkbox]:checked + label {
	left: 43px;
}

/* ROUNDED ONE */
.roundedOne {
	width: 28px;
	height: 28px;
	background: #fcfff4;

	background: -webkit-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -moz-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -o-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -ms-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfff4', endColorstr='#b3bead',GradientType=0 );
	margin: 20px auto;

	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;

	-webkit-box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);
	-moz-box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);
	box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);
	position: relative;
}

.roundedOne label {
	cursor: pointer;
	position: absolute;
	width: 20px;
	height: 20px;

	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
	left: 4px;
	top: 4px;

	-webkit-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,1);
	-moz-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,1);
	box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,1);

	background: -webkit-linear-gradient(top, #222 0%, #45484d 100%);
	background: -moz-linear-gradient(top, #222 0%, #45484d 100%);
	background: -o-linear-gradient(top, #222 0%, #45484d 100%);
	background: -ms-linear-gradient(top, #222 0%, #45484d 100%);
	background: linear-gradient(top, #222 0%, #45484d 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#222', endColorstr='#45484d',GradientType=0 );
}

.roundedOne label:after {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity=0);
	opacity: 0;
	content: '';
	position: absolute;
	width: 16px;
	height: 16px;
	background: #00bf00;

	background: -webkit-linear-gradient(top, #00bf00 0%, #009400 100%);
	background: -moz-linear-gradient(top, #00bf00 0%, #009400 100%);
	background: -o-linear-gradient(top, #00bf00 0%, #009400 100%);
	background: -ms-linear-gradient(top, #00bf00 0%, #009400 100%);
	background: linear-gradient(top, #00bf00 0%, #009400 100%);

	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
	top: 2px;
	left: 2px;

	-webkit-box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);
	-moz-box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);
	box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);
}

.roundedOne label:hover::after {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
	filter: alpha(opacity=30);
	opacity: 0.3;
}

.roundedOne input[type=checkbox]:checked + label:after {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	opacity: 1;
}

/* ROUNDED TWO */
.roundedTwo {
	width: 28px;
	height: 28px;
	background: #fcfff4;

	background: -webkit-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -moz-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -o-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -ms-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfff4', endColorstr='#b3bead',GradientType=0 );
	margin: 20px auto;

	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;

	-webkit-box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);
	-moz-box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);
	box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);
	position: relative;
}

.roundedTwo label {
	cursor: pointer;
	position: absolute;
	width: 20px;
	height: 20px;

	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
	left: 4px;
	top: 4px;

	-webkit-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,1);
	-moz-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,1);
	box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,1);

	background: -webkit-linear-gradient(top, #222 0%, #45484d 100%);
	background: -moz-linear-gradient(top, #222 0%, #45484d 100%);
	background: -o-linear-gradient(top, #222 0%, #45484d 100%);
	background: -ms-linear-gradient(top, #222 0%, #45484d 100%);
	background: linear-gradient(top, #222 0%, #45484d 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#222', endColorstr='#45484d',GradientType=0 );
}

.roundedTwo label:after {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity=0);
	opacity: 0;
	content: '';
	position: absolute;
	width: 9px;
	height: 5px;
	background: transparent;
	top: 5px;
	left: 4px;
	border: 3px solid #fcfff4;
	border-top: none;
	border-right: none;

	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

.roundedTwo label:hover::after {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
	filter: alpha(opacity=30);
	opacity: 0.3;
}

.roundedTwo input[type=checkbox]:checked + label:after {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	opacity: 1;
}

/* SQUARED ONE */
.squaredOne {
	width: 28px;
	height: 28px;
	background: #fcfff4;

	background: -webkit-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -moz-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -o-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -ms-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfff4', endColorstr='#b3bead',GradientType=0 );
	margin: 20px auto;
	-webkit-box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);
	-moz-box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);
	box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);
	position: relative;
}

.squaredOne label {
	cursor: pointer;
	position: absolute;
	width: 20px;
	height: 20px;
	left: 4px;
	top: 4px;

	-webkit-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,1);
	-moz-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,1);
	box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,1);

	background: -webkit-linear-gradient(top, #222 0%, #45484d 100%);
	background: -moz-linear-gradient(top, #222 0%, #45484d 100%);
	background: -o-linear-gradient(top, #222 0%, #45484d 100%);
	background: -ms-linear-gradient(top, #222 0%, #45484d 100%);
	background: linear-gradient(top, #222 0%, #45484d 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#222', endColorstr='#45484d',GradientType=0 );
}

.squaredOne label:after {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity=0);
	opacity: 0;
	content: '';
	position: absolute;
	width: 16px;
	height: 16px;
	background: #00bf00;

	background: -webkit-linear-gradient(top, #00bf00 0%, #009400 100%);
	background: -moz-linear-gradient(top, #00bf00 0%, #009400 100%);
	background: -o-linear-gradient(top, #00bf00 0%, #009400 100%);
	background: -ms-linear-gradient(top, #00bf00 0%, #009400 100%);
	background: linear-gradient(top, #00bf00 0%, #009400 100%);

	top: 2px;
	left: 2px;

	-webkit-box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);
	-moz-box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);
	box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);
}

.squaredOne label:hover::after {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
	filter: alpha(opacity=30);
	opacity: 0.3;
}

.squaredOne input[type=checkbox]:checked + label:after {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	opacity: 1;
}

/* SQUARED TWO */
.squaredTwo {
	width: 28px;
	height: 28px;
	background: #fcfff4;

	background: -webkit-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -moz-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -o-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -ms-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfff4', endColorstr='#b3bead',GradientType=0 );
	margin: 20px auto;

	-webkit-box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);
	-moz-box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);
	box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);
	position: relative;
}

.squaredTwo label {
	cursor: pointer;
	position: absolute;
	width: 20px;
	height: 20px;
	left: 4px;
	top: 4px;

	-webkit-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,1);
	-moz-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,1);
	box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,1);

	background: -webkit-linear-gradient(top, #222 0%, #45484d 100%);
	background: -moz-linear-gradient(top, #222 0%, #45484d 100%);
	background: -o-linear-gradient(top, #222 0%, #45484d 100%);
	background: -ms-linear-gradient(top, #222 0%, #45484d 100%);
	background: linear-gradient(top, #222 0%, #45484d 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#222', endColorstr='#45484d',GradientType=0 );
}

.squaredTwo label:after {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity=0);
	opacity: 0;
	content: '';
	position: absolute;
	width: 9px;
	height: 5px;
	background: transparent;
	top: 4px;
	left: 4px;
	border: 3px solid #fcfff4;
	border-top: none;
	border-right: none;

	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

.squaredTwo label:hover::after {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
	filter: alpha(opacity=30);
	opacity: 0.3;
}

.squaredTwo input[type=checkbox]:checked + label:after {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	opacity: 1;
}


/* SQUARED THREE */
.squaredThree {
	width: 20px;	
	margin: 2px auto;
	position: relative;
}

.squaredThree label {
	cursor: pointer;
	position: absolute;
	width: 20px;
	height: 20px;
	top: 0;
	border-radius: 4px;

	-webkit-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,.4);
	-moz-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,.4);
	box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,.4);

	background: -webkit-linear-gradient(top, #222 0%, #45484d 100%);
	background: -moz-linear-gradient(top, #222 0%, #45484d 100%);
	background: -o-linear-gradient(top, #222 0%, #45484d 100%);
	background: -ms-linear-gradient(top, #222 0%, #45484d 100%);
	background: linear-gradient(top, #222 0%, #45484d 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#222', endColorstr='#45484d',GradientType=0 );
}

.squaredThree label:after {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity=0);
	opacity: 0;
	content: '';
	position: absolute;
	width: 9px;
	height: 5px;
	background: transparent;
	top: 4px;
	left: 4px;
	border: 3px solid #fcfff4;
	border-top: none;
	border-right: none;

	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

.squaredThree label:hover::after {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
	filter: alpha(opacity=30);
	opacity: 0.3;
}

.squaredThree input[type=checkbox]:checked + label:after {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	opacity: 1;
}

/* SQUARED FOUR */
.squaredFour {
	width: 20px;	
	margin: 20px auto;
	position: relative;
}

.squaredFour label {
	cursor: pointer;
	position: absolute;
	width: 20px;
	height: 20px;
	top: 0;
	border-radius: 4px;

	-webkit-box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);
	-moz-box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);
	box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);
	background: #fcfff4;

	background: -webkit-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -moz-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -o-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -ms-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfff4', endColorstr='#b3bead',GradientType=0 );
}

.squaredFour label:after {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity=0);
	opacity: 0;
	content: '';
	position: absolute;
	width: 9px;
	height: 5px;
	background: transparent;
	top: 4px;
	left: 4px;
	border: 3px solid #333;
	border-top: none;
	border-right: none;

	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

.squaredFour label:hover::after {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
	filter: alpha(opacity=30);
	opacity: 0.5;
}

.squaredFour input[type=checkbox]:checked + label:after {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	opacity: 1;
}


.footer {
  position: fixed;
  width: 100%;
  left:0px;
  height: 60px;
  bottom:0px;
  background-color: rgba(0, 0, 0, .5);
  text-align: center;
  padding: 10px;
  direction: rtl;
  color:white;
  border:1px solid rgba(0,0,0, .1);
}


.circular {
	width: 300px;
	height: 300px;
	border-radius: 70px;
	-webkit-border-radius: 150px;
	-moz-border-radius: 150px;
	/*background: url(http://link-to-your/image.jpg) no-repeat;*/
	box-shadow: 0 0 8px rgba(0, 0, 0, .8);
	
	}

.circular img {
	opacity: 0;
	filter: alpha(opacity=0);
	}