/*Styling demo container*/
#example {
    text-align: center;
}

    #example .demo-container {
        width:549px;
    }

/*Styling all the social icons using the social-icon CSS class*/
.demo-container .social-icon {
    width: 8px;
}

.demo-container .RadToolBar_Material .social-icon {
    width: 16px;
}

.demo-container .RadToolBar.RadToolBar_Metro .social-icon,
.demo-container .RadToolBar.RadToolBar_MetroTouch .social-icon,
.demo-container .RadToolBar.RadToolBar_BlackMetroTouch .social-icon,
.demo-container .RadToolBar.RadToolBar_Bootstrap .social-icon,
.demo-container .RadToolBar.RadToolBar_Material .social-icon,
.demo-container .RadToolBar .rtbItem.rtbHovered .social-icon {
    background-image: none;
}

.demo-container .RadToolBar .rtbItem.rtbHovered .social-icon {
    cursor: pointer;
}

.demo-container .RadToolBar .rtbItem.rtbFocused .social-icon {
    box-shadow: none;
}

/*Styling Facebook social icon using the facebook CSS class*/
.demo-container .RadToolBar .facebook {
    background-image: linear-gradient(#5e7ec1, #3b5998);
}

.demo-container .RadToolBar .facebook,
.demo-container .RadToolBar .rtbItem.rtbHovered .facebook,
.demo-container .RadToolBar .rtbItem.rtbFocused .facebook {
    border-color: #3b5998;
}

.demo-container .RadToolBar .facebook,
.demo-container .RadToolBar.RadToolBar_Metro .facebook,
.demo-container .RadToolBar.RadToolBar_MetroTouch .facebook,
.demo-container .RadToolBar.RadToolBar_BlackMetroTouch .facebook,
.demo-container .RadToolBar.RadToolBar_Bootstrap .facebook,
.demo-container .RadToolBar.RadToolBar_Material .facebook,
.demo-container .RadToolBar .rtbItem.rtbHovered .facebook {
    background-color: #3b5998;
}

/*Styling Dribbble social icon using the dribbble CSS class*/
.demo-container .RadToolBar .dribbble {
    background-image: linear-gradient(#eb75a2, #ea4c89);
}

.demo-container .RadToolBar .dribbble,
.demo-container .RadToolBar .rtbItem.rtbHovered .dribbble,
.demo-container .RadToolBar .rtbItem.rtbFocused .dribbble {
    border-color: #ea4c89;
}

.demo-container .RadToolBar .dribbble,
.demo-container .RadToolBar.RadToolBar_Metro .dribbble,
.demo-container .RadToolBar.RadToolBar_MetroTouch .dribbble,
.demo-container .RadToolBar.RadToolBar_BlackMetroTouch .dribbble,
.demo-container .RadToolBar.RadToolBar_Bootstrap .dribbble,
.demo-container .RadToolBar.RadToolBar_Material .dribbble,
.demo-container .RadToolBar .rtbItem.rtbHovered .dribbble {
    background-color: #ea4c89;
}

/*Styling Twitter social icon using the twitter CSS class*/
.demo-container .RadToolBar .twitter {
    background-image: linear-gradient(#82c9ff, #55acee);
}

.demo-container .RadToolBar .twitter,
.demo-container .RadToolBar .rtbItem.rtbHovered .twitter,
.demo-container .RadToolBar .rtbItem.rtbFocused .twitter  {
    border-color: #55acee;
}

.demo-container .RadToolBar .twitter,
.demo-container .RadToolBar.RadToolBar_Metro .twitter,
.demo-container .RadToolBar.RadToolBar_MetroTouch .twitter,
.demo-container .RadToolBar.RadToolBar_BlackMetroTouch .twitter,
.demo-container .RadToolBar.RadToolBar_Bootstrap .twitter,
.demo-container .RadToolBar.RadToolBar_Material .twitter,
.demo-container .RadToolBar .rtbItem.rtbHovered .twitter {
    background-color: #55acee;
}

/*Styling Google Plus social icon using the google-plus CSS class*/
.demo-container .RadToolBar .google-plus {
    background-image: linear-gradient(#f7685b, #dc4e41);
}

.demo-container .RadToolBar .google-plus,
.demo-container .RadToolBar .rtbItem.rtbHovered .google-plus,
.demo-container .RadToolBar .rtbItem.rtbFocused .google-plus {
    border-color: #dc4e41;
}

.demo-container .RadToolBar .google-plus,
.demo-container .RadToolBar.RadToolBar_Metro .google-plus,
.demo-container .RadToolBar.RadToolBar_MetroTouch .google-plus,
.demo-container .RadToolBar.RadToolBar_BlackMetroTouch .google-plus,
.demo-container .RadToolBar.RadToolBar_Bootstrap .google-plus,
.demo-container .RadToolBar.RadToolBar_Material .google-plus,
.demo-container .RadToolBar .rtbItem.rtbHovered .google-plus {
    background-color: #dc4e41;
}

/*Styling Pinterest social icon using the pinterest CSS class*/
.demo-container .RadToolBar .pinterest {
    background-image: linear-gradient(#f03247, #bd081c);
}

.demo-container .RadToolBar .pinterest,
.demo-container .RadToolBar .rtbItem.rtbHovered .pinterest,
.demo-container .RadToolBar .rtbItem.rtbFocused .pinterest {
    border-color: #bd081c;
}

.demo-container .RadToolBar .pinterest,
.demo-container .RadToolBar.RadToolBar_Metro .pinterest,
.demo-container .RadToolBar.RadToolBar_MetroTouch .pinterest,
.demo-container .RadToolBar.RadToolBar_BlackMetroTouch .pinterest,
.demo-container .RadToolBar.RadToolBar_Bootstrap .pinterest,
.demo-container .RadToolBar.RadToolBar_Material .pinterest,
.demo-container .RadToolBar .rtbItem.rtbHovered .pinterest {
    background-color: #bd081c;
}