/* menu */

#logo{
    background-image:url(../../images/sqf-logo-small.jpg);
    width:140px;
    height:75px;
    float:left;
    margin-left:20px;
    margin-right:40px;
}

div.menu{
    display:inline;
    position:absolute;
    left:-190px;
    top:0px;
    right:0px;
    background-color:white;
    z-index:10;
    height:100px;
    min-width:1000px;
    margin:30px 25% 0px;
    vertical-align:central;
}
div.menu-links{
    margin:20px 40px 0px;
    padding-left:40px;
    left:40px;
}
div.menu-button,
div.menu-button-self,
div.menu-button-parent{
    display:inline;
}

a.menu:link,
a.menu:visited{
    color:#aaa;
    font-family:arial, helvetica, sans-serif;
    font-size:20px;
    text-decoration:none;
    padding:0.5em;
    border-bottom:2px solid #fff;
}
a.menu-self:link,
a.menu-self:visited{
    color:#007;
    font-family:arial, helvetica, sans-serif;
    font-size:20px;
    text-decoration:none;
    padding:0.5em;
    border-bottom:2px solid #007;
}
a.menu-parent:link,
a.menu-parent:visited{
    color:#aaa;
    font-family:arial, helvetica, sans-serif;
    font-size:20px;
    text-decoration:none;
    padding:0.5em;
    border-bottom:2px solid #aaa;
}
a.menu-self:hover,
a.menu:hover{
    color:#007;
    text-decoration:none;
    padding:0.5em;
    border-bottom:2px solid #007;
}

/* sub menu */

div.sub-menu div{
    display:block;
}
div.sub-menu{
    position:absolute;
    top:140px;
    right:76%;
}
div.sub-menu a:link,
div.sub-menu a:visited{
    font-size:16px;
    width:140px;
    display:block;
}
/* 
    sub menu's
*/
div.menu-l3 div{
    display:block;
    padding-left:0.5em;
}
div.menu-l3 a:link,
div.menu-l3 a:visited{
    font-size:12px;
    width:140px;
    display:block;
}
div.menu-l4 div{
    display:block;
    padding-left:1em;
}
div.menu-l4 a:link,
div.menu-l4 a:visited{
    font-size:11px;
    width:140px;
    max-width:140px;
    display:block;
}

/*
    lang menu
 */

div.lang-menu{
    display:inline;
    position:absolute;
    top:20px;
    right:0px;
    margin-right:25%;
    z-index:100;
}
div.lang-button,
div.lang-button-self{
    display:inline;
    margin:2px 3px;
}

div.lang-button-self{
    border-bottom:#007 solid 1px;
}

div.lang-button a,
div.lang-button-self a{
    border-bottom:none;
}

div.right-page{
    position:absolute;
    top:100px;
    left:0px;
    margin-left:75%;
}

div.left-page{
    padding:1em 0em;
    border-top:1px solid #eee;
    width:140px;
}

div.socialLinks{
    display:inline;
}
div.socialLinks a{
    width:auto !important;
}

div.socialLinks a,
div.socialLinks img{
    display:inline !important;
}


*.twitter-follow{
    padding:0.25em 0.5em;
    width:140px;
    top: 18px;
    position: relative;
}

.github,
.w3c{
    padding:0.25em 0.5em;
}
.github a,
.github a:hover,
.w3c a,
.w3c a:hover,
.blog a,
.blog a:hover{
    border:none !important;
}

.blog {
    padding:0.5em 0.5em;
    font-family:Raleway,Helvetica,Arial,sans-serif;
    font-weight:bold;
    -webkit-border-radius:3px;
    -moz-border-radius:3px;
    border-radius:3px;
    background-color:#00AAFF;
    color:#fff !important;
    font-size:7pt;
    -webkit-box-shadow:#B3B3B3 5px 5px 5px;
    -moz-box-shadow:#B3B3B3 5px 5px 5px;
    box-shadow:#B3B3B3 5px 5px 5px;
    position: relative;
    top: 4px;
    left: 0.75em;
}

.twitter {
    top: 18px;
}
.twitter, .tweet {
    padding: 0em 1.5em 0.5em 0.5em;
    position: relative;
    font-size: 0.5em;
    
    font-family:Raleway,Helvetica,Arial,sans-serif;
    font-weight:bold;
    -webkit-border-radius:3px;
    -moz-border-radius:3px;ol
    border-radius:3px;
    background-color:#1b95e0;
    color:#fff !important;
    -webkit-box-shadow:#B3B3B3 5px 5px 5px;
    -moz-box-shadow:#B3B3B3 5px 5px 5px;
    box-shadow:#B3B3B3 5px 5px 5px;
    left: 0.75em;
    cursor: pointer;
    display: inline-block;
}

.twitter .icon, .tweet .icon {
    position: relative;
    top: 4px;
    display: inline-block;
    width: 14px;
    height: 14px;
    background: transparent 0 0 no-repeat;
    background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2072%2072%22%3E%3Cpath%20fill%3D%22none%22%20d%3D%22M0%200h72v72H0z%22%2F%3E%3Cpath%20class%3D%22icon%22%20fill%3D%22%23fff%22%20d%3D%22M68.812%2015.14c-2.348%201.04-4.87%201.744-7.52%202.06%202.704-1.62%204.78-4.186%205.757-7.243-2.53%201.5-5.33%202.592-8.314%203.176C56.35%2010.59%2052.948%209%2049.182%209c-7.23%200-13.092%205.86-13.092%2013.093%200%201.026.118%202.02.338%202.98C25.543%2024.527%2015.9%2019.318%209.44%2011.396c-1.125%201.936-1.77%204.184-1.77%206.58%200%204.543%202.312%208.552%205.824%2010.9-2.146-.07-4.165-.658-5.93-1.64-.002.056-.002.11-.002.163%200%206.345%204.513%2011.638%2010.504%2012.84-1.1.298-2.256.457-3.45.457-.845%200-1.666-.078-2.464-.23%201.667%205.2%206.5%208.985%2012.23%209.09-4.482%203.51-10.13%205.605-16.26%205.605-1.055%200-2.096-.06-3.122-.184%205.794%203.717%2012.676%205.882%2020.067%205.882%2024.083%200%2037.25-19.95%2037.25-37.25%200-.565-.013-1.133-.038-1.693%202.558-1.847%204.778-4.15%206.532-6.774z%22%2F%3E%3C%2Fsvg%3E);
    padding-right: 0.5em;
}

.blog a:link, .blog a:visited {
    font-size: 9pt !important;
}

/* fix divs */
.warning{
    padding:5px;
    border:2px dashed #007;
}
.warning td{
    padding:10px;
    height:50px;
    vertical-align:middle;
}

.bottom-page{
    margin-top:2em;
}
.bottom-page p{
    text-align:center;
    font-size:8pt;
    color:#777;
    line-height:8pt;
}
.bottom-page a.intern:link{
    color:#777;
    border:none;
}
.bottom-page a.intern:visited{
    color:#777;
    border:none;
}
.bottom-page a.intern:hover{
    color:#777;
    text-decoration:underline;
}

/* deco */
div.deco-hor{
    position:fixed;
    left:0px;
    top:90%;
    width:100%;
    z-index:-5;
    border-bottom:1px solid #007;
    opacity:0.3;
}
div.deco-ver{
    position:fixed;
    left:90%;
    top:0px;
    height:100%;
    width:50px;
    z-index:105;
    border-right:1px solid #007;
    border-left:1px solid #007;
    opacity:0.3;
}
div.deco-body{
    position:fixed;
    left:24%;
    top:89%;
    width:52%;
    height:2%;
    z-index:-4;
    background-color:white;
    opacity:0.5;
}

/* body */
.body{
    margin:140px 25% 30px;
    min-width:710px;
    padding-left:0px 20px;
    font-family:arial, helvetica, sans-serif;
    opacity:1;
}

div.uplink{
    text-align:right;
    font-size:8pt;
    padding:0.5em 1.5em;
}
div.uplink a:link,
div.uplink a:visited{
    text-decoration:none;
    color:#aaa;
    border-bottom:none;
}

div.body > div.section{
    padding-bottom:1em;
    border-bottom:2px solid #eee;
}

div.section{
    margin-top:1em;
}

h1,
h2,
h3,
h4,
h5,
h6{
    color:#007;
}
h1{
    font-size:24px;
}
h2{
    margin-top:3em;
    font-size:20px;
}
h3{
    margin-top:2em;
    font-size:16px;
}
h4{
    margin-top:0.5em;
    font-size:14px;
}
h5{
    margin-top:0.5em;
    font-size:12px;
}
h6{
    margin-top:0.5em;
    font-size:12px;
    font-weight:normal;
    margin-bottom:1px;
    margin-top:0.5em;
}
ul{
    list-style-image:url(../../images/list-bullit-2.gif);
    font-size:9pt;
}

ol{
    font-size:9pt;
}

li p{
    margin:2px;
    padding:0px;
}
li .code {
    margin-top: 0.5em;
}

.liTitle{
    color:#007;
}
p{
    margin-top:0.5em;
    font-size:10pt;
    line-height:13.5pt;
}
a.image:link{
    border:none;
}
a:link,
a.intern:visited{
    white-space:nowrap;
    color:#007;
    text-decoration:none;
    border-bottom:#007 dashed 1px;
}
a:visited{
    white-space:nowrap;
    color:#777;
    text-decoration:none;
    border-bottom:#aaa dashed 1px;
}
a:hover{
    border-bottom-style:solid;
}
a:focus,
a:active{
    border-bottom-style:solid;
    outline:none;
}

img.inline{
    display:inline;
    margin:0;
    padding:0;
}
img.inlineImg{
    display:inline;
    height:18pt;
    margin:0;
    padding:0;
}

div.me-img{
    float:right;
    margin:-40px 1em 1em 1em;
}
/*
    inline code
 */
span.icode-element{
    font-family:consolas, courier, monospace;
    color:#000096;
}
span.icode-element-sqf{
    font-family:consolas, courier, monospace;
    color:#006600;
}
span.icode-element-xsl{
    font-family:consolas, courier, monospace;
    color:#005AB4;
}
span.icode-element-es{
    font-family:consolas, courier, monospace;
    color:#FF0000;
}
span.icode-attribute,
span.icode-attribute-sqf,
span.icode-attribute-xsl,
span.icode-attribute-es{
    font-family:consolas, courier, monospace;
    color:#F5844C;
}
span.icode-attributeValue{
    font-family:consolas, courier, monospace;
    color:#993300;
}
span.icode-pi{
    font-family:consolas, courier, monospace;
    color:#8B26C9;
}
span.icode-none,
span.icode-none-sqf{
    font-family:consolas, courier, monospace;
    color:black;
}


/* code */
.code *{
    margin:0px;
    padding:0px;
}
.code{
    font-family:consolas, courier, monospace;
    font-size:10pt;
    /*border-top: 1px solid #ee1200;
    border-bottom: 1px solid #ee1200;*/
    padding:1em 1em;
    background-color:#eee;
}

.code td{
    font-size:10pt;
}

.code-line{

}

.element{
    color:#000096;
}
.element-sqf{
    color:#006600;
}
.element-xsl{
    color:#005AB4;
}
.element-es{
    color:#FF0000;
}
.attribute{
    color:#F5844C;
}
.attributeValue{
    color:#993300;
}
.pi{
    color:#8B26C9;
}
.comment{
    color:#006400;
}


.skip,
.unhighlight{
    color:#aaa;
}

td.lineNr{
    color:#aaa;
    padding-right:0.5em;
    border-right:1px solid #ee1200;
    margin-right:0.5em;
    vertical-align:central;
}
td.line{
    padding-left:0.5em;
}
div.code-ref{
    text-align:right;
    font-size:8pt;
}
div.code-ref a:link,
div.code-ref a:visited{
    text-decoration:none;
    color:#aaa;
    border-bottom:none;
}

table.default th{
    vertical-align:top;
    background-color:#eee;
    color:#007;
    font-weight:normal;
    padding:0.5em;
    margin:0;
}
table.default td{
    vertical-align:top;
    border:1pt solid #eee;
    padding:0.5em;
    margin:0;
}
table.default{
    border:1pt solid #eee;
    background-color:white;
}
/*
 * reference
 */
div.oxygen_svg_choose_global,
div.oxygen_svg_choose{
    float:right;
}

div.oxygen_svg_choose_global *,
div.oxygen_svg_choose *{
    font-size:8pt;
}
div.oxygen_svg_choose_global p,
div.oxygen_svg_choose p{
}
div.oxygen_svg_choose_global input,
div.oxygen_svg_choose input{
    width:1.2em;
    height:1.2em;
}

table.reference-attribute th{
    vertical-align:top;
    background-color:#eee;
    color:#007;
    font-weight:normal;
    padding:0.5em;
    margin:0;
}
table.reference-attribute td{
    vertical-align:top;
    border:1pt solid #eee;
    padding:0.5em;
    margin:0;
}
table.reference-attribute{
    border:1pt solid #eee;
    background-color:white;
    width:70%;
}

.translation{
    color:red !important;
}
*.translation *{
    color:red !important;
}

g.svg-element-ref:hover path{
    background-color:blue;
    color:white;
}

ol.alpha-bracket {
    counter-reset: list;
}

ol.alpha-bracket > li {

    list-style: none;
    position: relative;

}

ol.alpha-bracket > li::before {
    content: counter(list, lower-alpha) ") ";
    counter-increment: list;
    position: absolute;
    left: -1.4em;
    top: 0.2em;
}

li.colored::before {
    color: #007;
}