.cgsg {
    background-color: #ffffff;
}

.cgsg-selectionBox {
    background-color: #666666;
    border: 1 #000000;
    opacity: 1;
}

/*
Regular CGSGNode attributes
*/
.cgsgnode {
    background-color: #ffffff;

    /*background: -o-linear-gradient(#9c9c9c, #575757);*/ /* For Opera 11.1 to 12.0 */
    /*background: -moz-linear-gradient(#9c9c9c, #575757);*/ /* For Firefox 3.6 to 15 */
    /*background: linear-gradient(#9c9c9c, #575757);*/ /* Standard syntax */

    border: 1px solid #e0e0e0;
    border-radius: 0;
    opacity: 1.0;
}

/*
Bounding box around the node when it's selected
*/
.cgsgnode-bbox {
    /* lines */
    outline: #3e3e3e 2px;

    /* handles */
    background-color: #707080;
    border-width: 6px;
}

/*************************************************************************************
Specific attributes for CGSGNodeText
**************************************************************************************/

.cgsg-h1 {
    color: #212121;

    text-align: left;
    font-size: 20px;
    font-family: Arial, sans-serif;
    text-transform: uppercase;
    border: 0;
}

.cgsg-h2 {
    color: #212121;
    text-align: left;
    font-size: 16px;
    font-family: Arial, sans-serif;
    text-transform: capitalize;
    border: 0;
}

.cgsg-h3 {
    color: #303030;

    text-align: left;
    font-size: 12px;
    font-weight: bolder;
    font-family: Arial, sans-serif;
    border: 0;
}

.cgsg-h4 {
    color: #303030;

    text-align: left;
    font-size: 10pt;
    font-style: italic;
    font-family: Arial sans-serif;
    font-variant: diagonal-fractions;
    border: 0;
}

.cgsg-h5 {
    color: #303030;

    text-align: left;
    font-size: 10px;
    font-style: italic;
    font-family: "Times New Roman", Georgia, Serif;
    border: 0;
}

.cgsg-h6 {
    color: #303030;

    text-align: left;
    font-size: 10px;
    font-style: italic;
    font-family: "Times New Roman", Georgia, Serif;
    border: 0;
}

.cgsg-p {
    color: #222222;
    text-align: left;
    font-size: 32px;
    font-family: Arial, sans-serif;
    border: 0;
}

.cgsg-left {
    text-align: left;
}
.cgsg-center {
    text-align: center;
}
.cgsg-right {
    text-align: right;
}

/*************************************************************************************
Specific attributes for CGSGNodeButton
**************************************************************************************/
.cgsg-button {
    background: -webkit-linear-gradient(#9c9c9c, #575757); /* For Safari */
    background: -o-linear-gradient(#9c9c9c, #575757); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#9c9c9c, #575757); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#9c9c9c, #575757); /* Standard syntax */

    padding-top: 12px;
    padding-left: 10px;
    border: 0 #4B4B4B;
    border-radius: 8px;
    opacity: 1.0;
}

.cgsg-button-text {
    text-align: center;
    font-size: 14px;
    font-family: Arial, sans-serif;
    color: #212121;
}

.cgsg-button-over {
    background: -webkit-linear-gradient(#5F5F5F, #4B4B4B); /* For Safari */
    background: -o-linear-gradient(#5F5F5F, #4B4B4B); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#5F5F5F, #4B4B4B); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#5F5F5F, #4B4B4B); /* Standard syntax */

    padding-top: 12px;
    padding-left: 10px;
    border: 0 #4B4B4B;
    border-radius: 8px;
    opacity: 1.0;
}

.cgsg-button-over-text {
    text-align: center;
    font-size: 14px;
    font-family: Arial, sans-serif;
    color: #FFF;
}

.cgsg-button-deactivated {
    background: -webkit-linear-gradient(#D8D8D8, #B5B5B5); /* For Safari */
    background: -o-linear-gradient(#D8D8D8, #B5B5B5); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#D8D8D8, #B5B5B5); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#D8D8D8, #B5B5B5); /* Standard syntax */

    padding-top: 12px;
    padding-left: 10px;
    border: 0 #4B4B4B;
    border-radius: 8px;
    opacity: 1.0;
}

.cgsg-button-deactivated-text {
    text-align: center;
    font-size: 14px;
    font-family: Arial, sans-serif;
    color: #FFF;
}

.cgsg-button-selected {
    background: -webkit-linear-gradient(#4B4B4B, #494949); /* For Safari */
    background: -o-linear-gradient(#4B4B4B, #494949); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#4B4B4B, #494949); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#4B4B4B, #494949); /* Standard syntax */

    padding-top: 12px;
    padding-left: 10px;
    border: 0 #4B4B4B;
    border-radius: 8px;
    opacity: 1.0;
}

.cgsg-button-selected-text {
    text-align: center;
    font-size: 14px;
    font-family: Arial, sans-serif;
    color: #FFF;
}

/**
At the time I wrote this CSS integration, "icon" attribute was not supported by current modern browsers.
So I had to use "list-style-image" attribute.
*/
.cgsg-button-icon-alert {
    list-style-image: url("../imges/cgsg/alert.png");

}
.cgsg-button-icon-error {
    list-style-image: url("../imges/cgsg/error.png");
}
.cgsg-button-icon-ok {
    list-style-image: url("../imges/cgsg/ok.png");
}