.zfriends { font-size: 12px; margin:0; padding:0;}
    .clearfix { clear:both;}
    .zfriends .separator{border-bottom: 1px solid #CCCCCC; clear: both;}
    .zfriends .th-confirmation{ margin: 10px 0; padding: 10px;}
    .zfriends .th-confirmation div{ background-color: #FFFFFF; border: 1px solid #CCCCCC; padding: 10px; text-align: center; }
    .zfriends .no-groups-friends { float: left; padding: 4px;  color:#888; font-weight: normal; font-size: 10px;}
    .zfriends .no-groups-tpl {margin: 10px 0; padding: 10px;}
    .zfriends .no-groups-tpl div{background-color: #FFFFFF; border: 1px solid #CCCCCC; padding: 10px; text-align: center;}

    .ui-widget{ font-size: 13px;}

                        /* ----------- form ----------- */

    .form-dialog{margin:0 auto; padding:5px;}
    .form-dialog p{ font-size:11px; color:#666666; margin-bottom: 20px; border-bottom:solid 1px #b7ddf2; padding-bottom:10px;}
    .form-dialog .border-top{ font-size:11px; color:#666666; border-top:solid 1px #b7ddf2; border-bottom: 0px; margin:10px 0 0 0; padding: 5px 0 0 5px;}
    .form-dialog p a:link, .form-dialog p a:visited, .form-dialog p a:hover{ font-size:11px; color:#048; margin: 0 0 0 20px; text-decoration: none;}
    .form-dialog ul li{list-style-type: none;}
    .form-dialog .desc{ font-size:11px; color:#666666; margin-bottom:20px; border-bottom:solid 1px #b7ddf2; padding-bottom:10px;}
    .form-dialog label{ display:block; font-weight:bold; text-align:left; width:225px; float:left;}
    .form-dialog .explanation{ display:block; font-weight:bold; text-align:left; width:300px; float:left;}
    .form-dialog .small{ color:#666666; display:block; font-size:11px; font-weight:normal; text-align:right;}
    .form-dialog .small2{ color:#666666; display:block; font-size:11px; font-weight:normal; text-align:left; }
    .form-dialog .large{ padding: 3px; margin:5px; color:#666666; display:block; font-size:11px; font-weight:normal;}
    .form-dialog input[type="text"]{ float:left; font-size:12px; padding:4px 2px; width:250px; margin:2px 0 20px 10px;}
    .form-dialog input.radio{float:left; font-size:12px; padding:4px 2px; width:50px; margin:2px 0px 20px 210px;}
    .form-dialog input[type="checkbox"] {float:none; font-size:12px; padding:4px; margin:5px;}
    .form-dialog #new-group-name{ margin:5px 0px 10px 235px;}
    .form-dialog #select-group-modal{ float:left; font-size:12px; margin:2px 0 5px 10px;}
    .form-dialog button{ clear:both;  background:#666666; text-align:center; color:#FFFFFF; font-size:11px; font-weight:bold; float: right;}
    .form-dialog .alias-nick-id{ font-weight: bold; font-size: 14px; font-family: Arial; color: #000}
    .form-dialog .create-new-group-layer{display: none; margin-bottom: 35px;}
    .form-dialog #user-groups{ height:100px; min-height: 80px; max-height: 200px; overflow-y: auto; border: 1px solid #e2e2e2;}
    .form-dialog #user-groups ul {margin:4px; padding:0;}
    .form-dialog #user-groups span {cursor: pointer;}


    #friends-names{ font-weight: bold;}

    .zfriends #main-friends-content{margin-right:10px; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5); padding: 4px; margin-top: 5px;}

    .zfriends #main-friends-content .actions-container{ padding: 10px; background-color: #eee;}
    .zfriends #main-friends-content .actions-container #select-groups-container{ text-align: center; line-height: 26px; margin-left: 10px;}
    .zfriends #main-friends-content .actions-container #group-actions{ float: right;}

    .zfriends #main-friends-content .actions-container #group-actions #create-group{ padding: 5px; background: #447cad; color: #fff; }
    .zfriends #main-friends-content .actions-container #group-actions #create-group i{ color: #fff; }

    .zfriends #main-friends-content .actions-container #button-actions ul { list-style-type: none; margin:0; padding:0}
    .zfriends #main-friends-content .actions-container ul li{ float:left; display: inline;}

    .zfriends #main-friends-content .actions-container #button-actions #create-group{ padding: 5px; background: #447cad; color: #fff; }
    .zfriends #main-friends-content .actions-container #button-actions #create-group i{ color: #fff; }

    .zfriends #links-groups-friends-container{ text-align: left; border-bottom: 1px solid #e2e2e2; margin-right: 5px;}
    .zfriends #links-groups-friends-container #my-groups{ font-size:12px;  color:#888; float: left; padding-right: 5px; text-decoration: none;}
    .zfriends #links-groups-friends-container #create-group {float: right; font-size: 10px; display: inline;}
    .zfriends #edit-group {font-size: 10px; display: inline; padding: 5px; background: #447cad; color: #fff; }
    .zfriends #edit-group i{color: #fff; font-size: 14px;}
    .zfriends .remove-group {font-size: 10px}
    .zfriends #select-group{ font-size: 12px; width: 150px; }

    .zfriends .display-groups{ display: block; position: absolute; background-color: #f8f8f8; z-index:1; border: 1px solid #eee; border: 1px solid #ccc; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5);}
    .zfriends .display-groups div{ max-width:400px; padding:3px 5px; cursor: pointer;}
    .zfriends .display-groups div:hover{ background-color: #333; color:#fff;}

    .zfriends .display-groups2{ display: block; position: absolute; background-color: #f8f8f8; z-index:1; border: 1px solid #eee; border: 1px solid #ccc; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5);}
    .zfriends .display-groups2 div{ max-width:400px; padding:3px 5px; cursor: pointer;}
    .zfriends .display-groups2 div:hover{ background-color: #333; color:#fff;}

    .zfriends #group-title-container{ padding:0px 5px 5px 5px; -moz-border-radius: 5px 5px 0px 0px; border-radius: 5px 5px 0px 0px; text-align: left; font-size: 16px; color: #2A71B4;}
    .zfriends #group-title{ font-weight:bold; float: left; color: #222; margin-left: 5px;}
    .zfriends #select-groups-container{ padding:3px;}
    .zfriends #select-groups-container #my-groups a{ text-decoration: none; color: #000; font-size: 14px;}

    .zfriends #count-groups-friends {float:left; text-align: left; margin-left: 5px; padding-left: 5px; font-size: 14px; color: #000;}

    .zfriends .friends-buttons-2{  clear: both; padding:2px 8px; text-align: left; border-bottom: 1px solid #e2e2e2}
    .zfriends .friends-buttons-2 .fa-button{ float: left; padding: 6px 0px; font-size: 10px;}
    .zfriends .friends-buttons-2 .move-to{ margin: 0px; padding: 6px; border-right: 1px solid #e2e2e2}
    .zfriends .friends-buttons-2 .move-to:hover{ cursor:pointer; background-color: #e2e2e2;}
    .zfriends .friends-buttons-2 .copy-to{ margin: 0px; padding: 6px; border-right: 1px solid #e2e2e2}
    .zfriends .friends-buttons-2 .copy-to:hover{ cursor:pointer; background-color: #e2e2e2;}
    .zfriends .friends-buttons-2 .remove-to{ margin: 0px; padding: 6px; border-right: 1px solid #e2e2e2}
    .zfriends .friends-buttons-2 .remove-to:hover{ cursor:pointer; background-color: #e2e2e2;}

    .zfriends .add-friend{ float: left; padding: 5px; background: #447cad; color: #fff;}
    .zfriends .add-friend i{ color: #fff;}
    .zfriends .friends-buttons-2 .fa-button a{padding:8px; text-decoration:none; }
    .zfriends .friends-buttons-2 .fa-button a:hover{ background-color: #e2e2e2; color: #800;}
    .zfriends .friends-buttons-2 .fa-text-button { font-size: 11px; margin: 0px 2px; }

    .zfriends .friends-buttons { text-align: left; margin: 10px 0px;}
    .zfriends .friends-buttons .select-all-button{ border-radius: 6px 6px 6px 6px; cursor: pointer;  padding: 5px; border: 1px solid #CCCCCC; background-color: #eee; overflow: visible; display: inline-block; margin-right: 3px;}

    .zfriends #user-friends-container{ text-align: left; padding: 5px 15px 5px 8px;}
    .zfriends #user-friends-container .user-friend-container{ padding: 10px 0px; border-bottom:1px solid #DDD;}

    .zfriends .user-friend-container ul{ padding:0px; margin:0px;}
    .zfriends .user-friend-container ul li{ border-right: 1px solid #ccc; float: left; margin-left: 0; overflow: hidden; padding: 5px 8px;}
    .zfriends .user-friend-container .mini-title{ font-size: 10px; color:#406080; font-weight:bold; }

    .zfriends #user-friends-container .user-friend-info{ height: 20px; line-height: 20px;}
    .zfriends #user-friends-container .user-friend-input{ float:left; margin-right: 3px;}
    .zfriends #user-friends-container .user-friend-link {width: 450px; float: left; color: #AAA;}
    .zfriends #user-friends-container .user-friend-name {float:left;}
    .zfriends #user-friends-container .user-friend-name a{font-family: arial,sans-serif; font-weight: bold; font-size:12px; color: #000; padding-right:5px; text-decoration: none;}
    .zfriends #user-friends-container .user-friend-name a:hover{ cursor: pointer;}
    .zfriends #user-friends-container .user-friend-alias { float:left; margin-left: 5px; font-size:10px;}
    .zfriends #user-friends-container .user-friend-alias a{color: #276DB4; font-size:10px; text-decoration: none}
    .zfriends #user-friends-container .user-friend-alias a:hover {cursor: pointer;}
    .zfriends #user-friends-container .send-message {margin-left: 15px; float: left;}
    .zfriends #user-friends-container .send-message img{ vertical-align: text-top;}
    .zfriends #user-friends-container .edit-aliases-friend{ float: right; display: none; margin-right: 3px;}
    .zfriends #user-friends-container .remove-user-friend{ float: right; display: none; margin-right: 10px;}
    .zfriends #user-friends-container .user-friend-region { float: left; padding-top: 2px; color: #a2a2a2; margin-left: 10px; font-size: 9px;}
    .zfriends #user-friends-container .user-friend-region img{ vertical-align: text-top;}

    .zfriends #user-friends-container .user-rev a, .zfriends #user-friends-container .user-rev span{ float:left; font-size: 10px; margin-left: 20px; width:25px; text-align: right; text-decoration: none;}
    .zfriends #user-friends-container .user-list a, .zfriends #user-friends-container .user-list span{ float:left;  font-size: 10px; margin-left: 20px; width:20px; text-align: right; text-decoration: none;}
    .zfriends #user-friends-container .user-rat a, .zfriends #user-friends-container .user-rat span{ float:left; font-size:10px; margin-left: 50px; width:30px; text-align: right; text-decoration: none;}
    .zfriends #user-friends-container .user-avg a, .zfriends #user-friends-container .user-avg span{ float:left;  font-size: 10px; margin-left: 20px; width:30px; text-align: right; color: #900; font-weight: bold; text-decoration: none;}


    .zfriends #user-friends-container .user-friend-modify{ float: right;}
    .zfriends #user-friends-container .user-friend-modify ul{ list-style:none;}

    .zfriends #user-friend-profile-container{ float: left;}

    .user-friend-activity{ border-collapse: collapse; font-size: 12px; text-align: left; width: 140px;}

    .user-friend-activity td{ border-bottom: 1px solid #FFFFFF; color: #000; padding: 4px; color: #000; font-size: 11px;}
    .user-friend-activity .review-counts{ color:#000; text-align: right;}
    .user-friend-activity .list-count{ color:#000; text-align: right;}
    .user-friend-activity .movie-counts{ color:#000; text-align: right;}
    .user-friend-activity .avg-ratings{ color:#000;  text-align: right; color:#990000; font-weight: bold;}

    .zfriends #user-friend-preloader{ position: relative; z-index:3; border-radius: 4px 4px 4px 4px; border: 1px solid #DDDDDD; color: #333333; float: right; padding: 20px 0px;}

    .zfriends #friends-search-container{ float:right; text-align: left; padding: 0 5px 5px 5px;}
    .zfriends #friends-search-container input{ width: 250px; font-size: 10px; -moz-border-bottom-colors: none; -moz-border-image: none; -moz-border-left-colors: none; -moz-border-right-colors: none; -moz-border-top-colors: none; background: none repeat scroll 0 0 #FFFFFF; border-color: #C0C0C0 #D9D9D9 #D9D9D9; border-radius: 1px 1px 1px 1px; border-right: 1px solid #D9D9D9; border-style: solid; border-width: 1px; height: 27px; padding: 0 0 0 5px; -moz-border-bottom-colors: none;}
    .zfriends #friends-search-container input:focus{ border: 1px solid #4D90FE; box-shadow: 0 1px 2px rgba(0 , 0, 0, 0.3) }
    .zfriends #friends-search-icon{ padding-right: 5px;}

    .zfriends .main-groups-container{ text-align: left; margin: 5px;}
    .zfriends .main-groups-title{ font-size: 12px; color: #048; border-bottom: 1px solid #eee; margin: 0px; padding: 0 0 5px 0; font-weight: bold;}

    .zfriends .groups-info-container{ font-size:12px; padding: 5px; border-bottom: 1px solid #eee;}
    .zfriends .groups-info-container:hover{ background-color: #e2e2e2; color: #333; text-decoration: none;}
    .zfriends .groups-info-container a:link, .zfriends .groups-info-container a:visited{ cursor: pointer; color: #333; font-size: 13px; text-decoration: none; width: 100%; height: 100%}
    .zfriends .groups-info-container a:hover{ background-color: #e2e2e2; color: #333; text-decoration: none; width: 100%; height: 100%}
    .zfriends .groups-info-container .remove-group-in { cursor:pointer; float:right;}
    .zfriends .groups-info-container .modify-name-group-in { cursor:pointer; float:right; padding: 0 3px 0 0;}
    .zfriends .groups-info-container .friends-group-name { font-size: 12px; color: #333;}
    .zfriends .groups-info-container .friends-group-name:hover { font-size: 12px; color: #333; cursor: pointer;}
    .zfriends .groups-info-container .friends-group-count { color:#276DB4}


    .zfriends h1{ font-family:arial; color:#000; font-size:14px; font-size-adjust:none;  font-stretch:normal; font-style:normal; font-variant:normal; font-weight:normal; line-height:19px; margin-bottom:7px;}

    a.ui-menu-item-wrapper{ display: block;}
    #go-back{ float:left; background: #447cad;}