/*
 * Copyright 2014 Open Networking Laboratory
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

/*
 ONOS GUI -- Masthead -- CSS file

 @author Simon Hunt
 */

#mast {
    height: 36px;
    padding: 4px;
    vertical-align: baseline;
}

.light #mast {
    background-color: #bbb;
    box-shadow: 0 2px 8px #777;
}
.dark #mast {
    background-color: #444;
    box-shadow: 0 2px 8px #777;
}

#mast img#logo {
    height: 38px;
    padding-left: 8px;
    padding-right: 8px;
}

#mast span.title {
    font-size: 14pt;
    font-style: italic;
    vertical-align: 12px;
}

.light #mast span.title {
    color: #369;
}
.dark #mast span.title {
    color: #eee;
}

#mast span.right {
    padding-top: 8px;
    padding-right: 16px;
    float: right;
}

#mast span.radio {
    font-size: 10pt;
    margin: 4px 2px;
    padding: 1px 6px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    cursor: pointer;
}

.light #mast span.radio {
    border: 1px dotted #222;
    color: #eee;
}
.dark #mast span.radio {
    border: 1px dotted #bbb;
    color: #888;
}

#mast span.radio.active {
    padding: 1px 6px;
}

.light #mast span.radio.active {
    background-color: #bbb;
    border: 1px solid #eee;
    color: #666;

}
.dark #mast span.radio.active {
    background-color: #222;
    border: 1px solid #eee;
    color: #78a;
}

/* Button Bar */

#bb {
    margin: 0 30px;
    padding: 0 2px;
}

#bb .btn {
    margin: 0 4px;
    padding: 2px 6px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    font-size: 9pt;
    cursor: pointer;
}

.light #bb .btn {
    border: 1px solid #fff;
    border-right-color: #444;
    border-bottom-color: #444;
    color: #222;
}

.light #bb .btn.active {
    border: 1px solid #444;
    border-right-color: #fff;
    border-bottom-color: #fff;
    background-color: #888;
    color: #ddf;
}

.dark #bb .btn {
    border: 1px solid #888;
    border-right-color: #111;
    border-bottom-color: #111;
    color: #888;
}

.dark #bb .btn.active {
    border: 1px solid #111;
    border-right-color: #888;
    border-bottom-color: #888;
    background-color: #555;
    color: #78a;
}