@font-face {
    font-family: 'Roboto-Condensed';
    font-style: normal;
    font-weight: 400;
    src: url("/javax.faces.resource/fonts/RobotoCondensed-Regular.ttf.xhtml") format('truetype');
    font-display: swap;
}

@font-face {
    font-family: 'Shadows Into Light';
    font-style: normal;
    font-weight: 400;
    src: url("/javax.faces.resource/fonts/ShadowsIntoLight-Regular.ttf.xhtml") format('truetype');
    font-display: swap;
}

@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    src: url("/javax.faces.resource/fonts/OpenSans-Regular.ttf.xhtml") format('truetype');
    font-display: swap;
}

@font-face {
    font-family: 'Oswald';
    font-style: normal;
    font-weight: 400;
    src: url("/javax.faces.resource/fonts/Oswald-Regular.ttf.xhtml") format('truetype');
    font-display: swap;
}

@font-face {
    font-family: 'Glyphicons Halflings';
    src: url("/javax.faces.resource/fonts/glyphicons-halflings-regular.ttf.xhtml") format('truetype');
    src: url("/javax.faces.resource/fonts/glyphicons-halflings-regular.woff2.xhtml") format('woff2');
    src: url("/javax.faces.resource/fonts/glyphicons-halflings-regular.woff.xhtml") format('woff');
    font-display: swap;
}

@font-face {
    font-family: "FontAwesome";
    src : url("https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?v=4.3.0");
    src : url("https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.eot?#iefix&v=4.3.0") format("embedded-opentype"),
        url("https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff2?v=4.3.0") format("woff2"),
        url("https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.woff?v=4.3.0") format("woff"),
        url("https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.ttf?v=4.3.0") format("truetype"),
        url("https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/fonts/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular") format("svg");
    font-display: swap;
}

.content {
    background: #262524;
    color: lightgray;
    /*    background-repeat: repeat;    
        background-image: url("../images/bg.jpg");    */
}

.logo {
    margin: 5px 0;
    float: left;
    background-color: transparent;
}

.content .clear {
    clear: both;
}

.content .right-float {
    float: right;
}

.content .uppercase {
    text-transform: uppercase;
    font-family: 'Roboto-Condensed', sans-serif;
}

.content h1 {
    font-family: 'Oswald', sans-serif;
    color: #d98f4f;
    margin: 10px 0 20px;
    border-bottom: 5px solid #3F5792;
    display: inline-block;
}

.content .subtitle h2  {
    text-align: left;
    margin-top: -20px;
    margin-bottom: 40px;
    color: #3EAB45;
}

.content .subtitle h2.in-calculator  {
    margin-bottom: 0px;
}

.content .subtitle h3  {
    text-align: left;
    margin-top: -50px;
    margin-bottom: 40px;
    color: #3EAB45;
}

.content .subtitle.theory h2  {
    margin-bottom: 0px
}

.content .fluids .subtitle h2,  .content .standards .subtitle h2,  .content .deployments .subtitle h2  {
    margin-top: 10px;
    margin-bottom: 10px;
    color: #f5f5f5;
}

.content .deployments .deployments-left {
    float: left;
    width: 20%;
    text-align: center;
}

.content .deployments .deployments-body {
    width: 80%;
}

.content .deployments {
    overflow: auto;
}

.content ul .mild {
    color: #5cb85c;
    font-size: large;
}

.content .deployments .hot, .content .btn-toolbar .hot, .content .component .hot, .content .button-tag .hot  {
    color: #f15;
}

.content .deployments .mild, .content .component .mild  {
    color: #5cb85c;
}

.content .deployments .cold {
    color: #3F5792;
}

.content .deployments .light {
    color: #d98f4f;
}

.content .deployments td {
    vertical-align: middle;
}

.content .table.deployments th {
    border-top: none;
}

.content .panel-heading {
    background-color: transparent;
    border-bottom: none;
    color: #3F5792;
}


.content .no-bullet {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.content .jumbotron h1, .content .jumbotron.index-page h2, .content .jumbotron.calculator-page h2, .content .jumbotron.calculators h2 {
    font-family: 'Oswald', sans-serif;
    font-size: 36px;
    border-bottom: none;
    color: #3EAB45;
    display: inline-block;
}

.content .service h2 {
    color: #d98f4f;
    margin: 10px 0 20px;
    font-family: Oswald, sans-serif;
    display: inline-block;
    font-size: 36px;

}

.content .service h3 {
    font-family: 'Roboto-Condensed', sans-serif;
    font-size: 24px;
    border-bottom: none;
    text-align: left;
    font-family: Roboto-Condensed, sans-serif;

}

.content h2 {
    font-size: 22px;
    text-align: center;
    color: #94a3b8;
    margin: 0;
    padding: 8px 4px;
}

.content .jumbotron {
    background-color: #2a2a2a;
    padding: 20px;
}

.content .jumbotron.calculators {
    background-color: transparent;

}

.content .panel.panel-info.calculators {
    background-color: #333;
    border-top: none;
    border-bottom-width: 4px;
}

.content .panel.panel-info.calculators h2 {
    text-align: left;
    margin-left: 5px;
    color: whitesmoke;
}
.content .panel.panel-info.calculators h3 {
    text-align: left;
    margin-left: 5px;
    color: #777;
}

.content .panel.panel-info.calculators a {
    background-color: #3EAB45;
    cursor: pointer;
    padding: 4px;
    margin: 0 2px;
    color: #111;
    transition: 0.3s;
}

.content .panel.panel-info.calculators .line {
    min-height: 2px;
    margin: 20px 10px -8px 10px;
}

.content .panel.panel-info.calculators a:hover {
    background-color: #333;
    color: #3EAB45;
    border-color: #3EAB45;
}

.content .panel.panel-info.calculators .panel-body {
    padding: 0 5px;
}

.content .jumbotron.calculators h1 .title-second-color, .content .jumbotron.calculators h2 .title-second-color {
    color: whitesmoke;
}

.content .panel.panel-info.calculators {
    min-height: 430px;
}

.content .panel.panel-info.calculators.short {
    min-height: 300px;
}

.content .strong {
    font-weight: 700;
}

.content h2 {
    font-size: 22px;
    font-family: 'Roboto-Condensed', sans-serif;
    text-align: center;
    color: #3EAB45;
    margin: 0;
    padding: 8px 4px;
}

.content .subscription h2 {
    font-size: 34px;
    color: #d98f4f;
    margin-bottom: 24px;
}

.content .subscription input {
    background-color: #333;
    border: none;
    text-align: center;
}

.content .heading-link {
    color: #d98f4f;
}

.content .heading-link:hover {
    border-radius: 10px;
    text-decoration: none;
    background-color: #3c3f41;
}

.content .calculators .panel-heading, .content .calculators .thumbnail {
    padding: 0px;
    border-top: none;
}

#login-info-calc h2 {
    text-align: left;
    text-transform: uppercase;
}

.content h1.exclusive {
    text-align: left !important;
    text-transform: uppercase;
}

#login-info-calc {
    border-style: solid;
    border-width: 1px;
    border-color: #111;
    background-color: #222;
}

#login-info-calc .panel-title {
    color: #f15;
    margin: auto;
    font-size: 22px;
}

#login-info-calc .panel-footer .btn {
    background-color: transparent;
    border-color: #f15;
}

#login-info-calc .panel-footer .btn:hover {
    background-color: #eee;
    color: #f15;
    border-color: #f15;
}

.content .dropdown-menu .dropdown-link {
    background-color: transparent;
}

.content .index-list .mild {
    color: #5cb85c;
}

.content .hot .heading-link:hover {
    border-color: #f15;
}

.content .mild .heading-link:hover {
    border-color: #5cb85c;
}

.content .cold .heading-link:hover {
    border-color: #3F5792;
}

.content .light .heading-link:hover {
    border-color: #d98f4f;
}



.content .alert-info.calculation-service {
    background-color: #202020;
    border: none;
    margin: 5px;
}

.content .calculation-service {
    background-color: #303030;
    border: 1px solid #333;
    border-radius: 5px;
    margin: 5px 25px 5px 5px;
    padding: 10px;
}

.content .top-buffer {
    margin-top:  15px;
}

.content .top-buffer-double {
    margin-top:  30px;
}

.content .bottom-buffer {
    margin-bottom: 15px;
}

.content .center {
    margin-left: auto;
    margin-right: auto;
    margin-top: 12px;
}

.content .panel.panel-info .panel-heading {
    background-color: #333;
    border-radius: 10px;
    border-bottom: none;
}

.content .big {
    font-size: 300%;
}

.content #operation-point-form .big {
    font-size: 120%;
    color: #FB8C00;
}

.content #operation-point-form .light.big {
    font-size: 160%;
    color: #afafaf;
}

.content .superscript {
    font-size: 150%;
    vertical-align: top;
}

.content .price {
    margin: 0;
    padding: 0;
}

.content .price-sub-text {
    text-transform: uppercase;
    margin: 0;
}

.content .price-sub-text.mild, .content h4.panel-title.mild, .content .ui-dialog-title {
    color: #5cb85c;
}

.content .price-sub-text.hot, .content h4.panel-title.hot, .content h3.panel-title.hot {
    color: #F15;
}

.content .text-left {
    text-align: left;
}
.content .text-right {
    text-align: right;
}
.content .text-center {
    display: block;
    text-align: center;
}

.content h4, .content .ui-dialog-title {
    font-size: 18px;
    font-family: 'Roboto-Condensed', sans-serif;
    color: #94a3b8;
    margin: 12px 0 6px;
    padding: 2px 4px 0 0;
}

.content h3 {
    font-size: 18px;
    font-family: 'Roboto-Condensed', sans-serif;
    text-align: center;
    color: #3EAB45;
    margin: 2px 0 6px;
    padding: 2px 4px;
}

.content .theory-text h3 {
    text-align: left;
    color: #3F5792;
}

.content .eqn {
    padding: 0 0 12px 24px;
}

.content .in-text-theory {
    float: right;
    background: #202020;
    width: 220px;
    margin: 0 0 0 20px;
    padding: 15px;
    font: 1em times, serif;
    /*font-style: italic;*/
    border: 1px solid #1a1a1a;
    border-radius: 15px;
}

.content .in-text-example {
    background: #202020;
    margin: 20px;
    padding: 15px;
    border: 1px solid #1a1a1a;
    border-radius: 15px;
}

.content .in-text-theory a {
    text-decoration: none;
}
.content .in-text-theory a:hover {
    text-decoration: none;
}

.content .good {
    color: #3EAB45;
    margin-right: 10px;
}

.content .blue-light {
    color: #60a5fa;
    margin-right: 10px;
}

.content .wrong {
    color: #f15;
    margin-right: 8px;
}

.content .sky {
    color: #2878ff;
    margin-right: 8px;
}

.content .required {
    color: #3F5792;
}

.content .hot h3, .content .hot.cc, .content .box-header .hot {
    color: #f15;
}

.content .mild h3, .content .mild.cc, .content .box-header .mild {
    color: #5cb85c;
}

.content .cold h3, .content .cold.cc, .content .box-header .cold {
    color: #3F5792;
}

.content .light h3, .content .light.cc, .content .box-header .light {
    color: #d98f4f;
}

.content .paypal-button, .content .co-button, .content .faster-button {
    background-color: black;
    border-radius: 10px;
    border-bottom: #1fb solid thin;
}

.content .paypal-button h4, .content .co-button h4, .content .faster-button h4 {
    color: #777;
}

.content .paypal-button:hover, .content .co-button:hover, .content .faster-button:hover {
    background-color: #333;
    border-radius: 10px;
    border-bottom: #555 solid thin;
}

.content .btn-co.hot {
    background-color: #f15;
    border: whitesmoke solid thin;
}

.content .btn-co.mild {
    background-color: #5cb85c;
    border: whitesmoke solid thin;
}

.content .btn-co.cold {
    background-color: #3F5792;
    border: whitesmoke solid thin;
}

.content .btn-co.light {
    background-color: #d98f4f;
}

.content .paypal-button {
    background-color: red;
}

.content ul, .content p {
    padding: 2px 4px;
}

.equal {
    display: flex;
    display: -webkit-flex;
    flex-wrap: wrap;
}

.content .table-hover tr:hover {
    background-color: #3F5792;
}


.content .panel {
    background-color: transparent;
    border-radius: 10px;
    border: 1px solid#3F5792;
    border-left: none;
    border-right: none;
}

.content .title .panel {
    border: none;
}

.content .panel.download-info  {
    border: none;
}

.content .panel-table {
    background-color: transparent;
    border: 1px solid#3F5792;
    border-left: none;
    border-right: none;
    margin: 12px;
}

.content table tbody tr td, .content table thead tr th {
    border-top: none;
}

.content table thead tr th, .content table tfoot tr td, .content .ui-datatable-header {
    border-bottom: 1px solid #3F5792;
    background: #3F5792;
}

.content tr:nth-child(even) {
    background: #222;
}

.content tr:nth-child(even):hover {
    background: #111;
}

.content tr:nth-child(odd) {
    background: #303030;
}
.content tr:nth-child(odd):hover {
    background: #111;
}

.content .ui-datatable tbody td, .content .ui-datatable thead td, .content .ui-datatable tfoot td, .content .ui-datatable thead th, .content .ui-datatable-header {
    border-style: solid;
    border-width: 1px;
    border-color: #1a1a1a;
}

.content .ui-datatable tfoot td {
    font-weight: bold;
}

.content tr.ui-state-highlight {
    background-color: #3F5792;
}

.content tr.ui-state-highlight.ui-row-editing {
    background-color: #303030;
}

.content .calculator-form .panel  {
    border: 1px solid #303030;
    background-color: transparent;
}

.content .calculator-form .panel .panel-heading {
    background-color: #303030;
    border: none;
    color: #bdbdbd;
    font-size: 1.4em;
}

.content .calculator-form .panel .panel-heading #file-upload-network .upload, #calculator\:fileCalculator {
    font-size: 14px;
    color: white;
    padding: 6px 12px;
    font-weight: 400;
    border:#3F5792 thin solid;
}

.content .panel-left {
    margin: 20px 0;
}

.content .panel-center {
    margin: 20px 0;
}

.content .panel-right {
    margin: 20px 0;
}

.content .hot .panel {
    border-color: #f15;
}

.content .mild .panel {
    border-color: #5cb85c;
}

.content .cold .panel {
    border-color: #3F5792;
}

.content .light .panel {
    border-color: #d98f4f;
}

.content .panel-footer, .content .panel-header {
    background: transparent;
    /*background-color: #3c3f41;*/
    border: none;
}

.content .breadcrumb, .content .nav {
    background: transparent;
    margin: 20px 0 0;
    padding: 0px;

}

.content .header .no-margin {
    /*    margin-left: -30px;
        margin-right: -30px;    */

    margin-left: 0;
    margin-right: 0;


}

.content .nav {
    float: right;
}

.content .nav-pills > li > a:hover {
    background-color: #3F5792;
}

.content .dropdown-menu > li > a:hover {
    background-color: #222;
}

.content .panel-tables .nav {
    float: left;
}

.content .panel-tables .panel-body {
    text-align: justify;
}

.content .nav li a:hover {
    background-color: #3F5792;
    color: white;
}

.content .nav-pills li.active a {
    background-color: #3F5792;
    color: #000B24;
}

.content .btn-default:hover, .content .btn-light:hover {
    background-color:#3F5792;
    color: white;
}

.content p, .content ul, .content .jumbotron p {
    font-size: 13px;
    font-family: 'Open Sans', sans-serif;
    text-align: justify;
    margin: 0 0 20px;
    line-height: 1.4;
    font-weight: 300;
}

.content p {
    color: lightgray;
}

.content hr {
    background-image: linear-gradient(to right, transparent, #3F5792, transparent);
    border: 0;
    height: 1px;
    margin: 22px 20px;
}

.button {
    padding: 10px 6px;
    margin: 12px 0;
    background-color: #3F5792;
    color: whitesmoke;
    border: 1px solid #0000ff;
}

.button:hover {
    cursor: pointer;
}

.content .btn {
    margin-bottom: 4px;
}

.content .in-text-theory .nav, .content .in-text-theory p {
    margin-top: 0px;
    margin-bottom: 0px;
}

.content .button-tag {
    display: inline-block;
    padding: 0.4em;
    margin: 2px;
    white-space: nowrap;
    text-decoration: none;
    text-align: center;
    border-style: solid;
    border-width: 1px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.8em;
    color:#3F5792;
    border-color:#3F5792;
    width: 64px;
    transition: 0.3s;
}

/*.content .deployments .button-tag {
    display: inline-block;
    padding: 0;
    margin: 2px;
    white-space: nowrap;
    text-decoration: none;
    text-align: center;
    border-style: solid;
    border-width: 1px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 1em;
    color: #bdbdbd;
    border-color: black;   
    width:100%;
}*/

.content .standards .button-tag, .content .deployments .button-tag {
    display: inline-block;
    padding: 0;
    margin: 2px;
    white-space: nowrap;
    text-decoration: none;
    text-align: center;
    cursor: pointer;
    font-size: 1.2em;
    padding: 2em 0px;
    color: #bdbdbd;
    background-color:#3F5792;
    width:100%;
    border: none;
    transition: 0.3s;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.content .title .deployments .button-tag {
    display: inline-block;
    padding: 0;
    margin: 2px;
    white-space: nowrap;
    text-decoration: none;
    text-align: center;
    cursor: pointer;
    font-size: 1em;
    padding: 0.2em 0px;
    color: #bdbdbd;
    background-color: #3F5792;
    width:100%;
    border: none;
    transition: 0.3s;
}

.content .service-info, .content .panel.download-info {
    background-color: #333;
}

.content .backgound-composite {
    background-repeat: repeat;
    background-image: url("../images/bg.jpg");
}

.content .invite.mild {
    color: #5cb85c;
}

.content .download-invite, .content .subscription-promo {
    color: #eee;
    padding: 10px 20px;
    margin-bottom: 10px;
    border-radius: 10px;

    border-radius: 6px;
    border-style: solid;
    border-width: 1px;
    border-color: #111;
    background-color: #222;
    padding: 12px;
}

.content .subscription-promo p {
    margin: auto;
    text-align: right;
}

.content .btn-primary.mild {
    background-color: #3EAB45;
    color: #111;
}

.content .btn-primary.mild:hover {
    background-color: #333;
    color: #3EAB45;
    border-color: #3EAB45;
}

.content .download-invite .middle,  .content .subscription-promo .middle {
    text-align: center;
}

.content .subscription-promo .subtitle {
    font-size: 1.2em;
    color: #fff;
}

.content .subscription-promo h2, .content .subscription-promo svg, .content .download-invite h2 {
    font-size: 2.5em;
    color: #60a5fa;
}

.content .download-invite .btn-primary, .content .subscription-promo .btn-primary {
    background-color: #60a5fa;
    color: #333;
}

.content .download-invite .btn-primary:hover, .content .subscription-promo .btn-primary:hover {
    background-color: #333;
    color: #60a5fa;
    border-color: #60a5fa;
}

.content .subscription-promo .price-text {
    font-size: 1.4em;
}

.content .service-info {
    margin-bottom: 15px;
    border-radius: 10px;
}

.content .deployments.download-info .button-tag {
    background-color: #333;
    padding: 1em 0;
}

.content .fluids .button-tag {
    display: inline-block;
    padding: 0;
    margin: 2px;
    white-space: nowrap;
    text-decoration: none;
    text-align: center;
    cursor: pointer;
    font-size: 1.2em;
    padding: 2em 0px;
    color: #bdbdbd;
    background-color: #303030;
    width:100%;
    border: none;
    transition: 0.3s;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.content a.button-tag {
    color: whitesmoke;
}

/*.content .deployments a.button-tag:hover {
    background-color: #1a1a1a;
}*/

.content .standards a.button-tag:hover, .content .deployments a.button-tag:hover, .content .fluids a.button-tag:hover {
    background-color: #3F5792;
    box-shadow: none;
}

.content .fluids a.button-tag:hover {
    background-color: #3F5792;
}

.content .standards a.button-tag.active, .content .fluids a.button-tag.active, .content .deployments a.button-tag.active {
    transition: 0.3s;
    background-color: transparent;
    color: whitesmoke;
}

.content .deployments a.button-tag, .content .standards a.button-tag {
    background-color: #303030;
    transition: 0.3s;
}

.content .btn-primary, .content .ui-menubutton, .content .ui-button  {
    background-color: #3F5792;
    border-color: transparent;
    transition: 0.3s;
}

.content .btn-primary:hover, .content .btn-light:hover, .content .ui-menubutton:hover, .content .ui-button.ui-button-text-icon-left:hover {
    background-color: #000B24;
    color: #eee;

}

.content button {
    border: none;
}
.content .ui-splitbutton {
    padding-left: 0;
    padding-top: 0;
    padding-bottom: 0;
    padding-right: 28px;
}

.content .ui-menu, .content .ui-dialog {
    background-color: #333;
}

.content .btn-primary.exclusive {
    background-color: #d98f4f;
    color: #333;
    border-color: #111;
    transition: 0.3s;
}



.content .btn-primary.exclusive {
    background-color: #d98f4f;
    color: #333;
    border-color: #111;
    transition: 0.3s;
}

.content .btn-primary.active, .content .btn-primary.table-pipes-toolbar.active {
    background-color: #000B24;
    box-shadow: 0 2px 0 #3F5792;
    top: 2px;
}

.content .btn-primary.exclusive:hover {
    background-color: #333;
    color: #d98f4f;
    transition: 0.3s;
}

.content .calculation-service .btn-primary.disabled {
    background-color: #1a1a1a;
}

.content .calculation-service .cc {
    float: right;
}

.content .fa-big {
    font-size: 36px;
    color: #3EAB45;
    padding: 8px;
}

/*.content .deployments {
    color:#3F5792;
}*/

.content a {
    color: #3F5792;
}

.content a:hover {
    color: #2878ff;
}

.content a.heading-link {
    font-size: 22px;
    font-family: 'Roboto-Condensed', sans-serif;
    color: #3EAB45;
    margin: 4px;
    padding: 8px 4px;
}
.content a.btn {
    color: whitesmoke;
}

.content .pipe-table-heading a.btn {
    color: whitesmoke;
    background-color: #3F5792;
    transition: 0.3s;
}

.content .pipe-table-heading a.btn:hover {
    color: whitesmoke;
    background-color: #000B24;
    border-color: #3F5792;
}

.content .panel-body a {
    background-color: #3F5792;
    cursor: pointer;
    padding: 4px;
    margin: 0 2px;
    color: lightgray;
    transition: 0.3s;

}

.content .panel-body a:hover {
    background-color: #3F5792;
    color: lightgray;
    text-decoration: none;

}

.content .panel-body.rateit a {
    background-color: transparent;
    cursor: pointer;
    padding: 4px;
    margin: 0 2px;
    transition: 0.3s;
    size: 2em;
}

.content .panel-body.rateit a:hover {
    background-position: 0 -48px;
    cursor: pointer;
    padding: 4px;
    margin: 0 2px;
    color: gold;
}

.content .panel-body .btn-primary.rateit, .content .panel-body .btn-primary.issues {
    padding: 10px 16px;
}

.content .panel-body .btn-primary.rateit:hover, .content .panel-body .btn-primary.issues:hover {
    background-color: #000B24;
    padding: 10px 16px;
}

.content .stars {
    height: 250px;
}

.content .panel-body.rateit .ui-rating-on {
    color: blue;
}

.content .deployments .panel-body a.in-text {
    background-color: transparent;
    color:#3F5792;
}

.content .deployments .panel-body a.in-text:hover {
    background-color: transparent;
    color: #3F5792;
}

.content .panel-tables .panel-body a {
    cursor: pointer;
    color: white;
    background-color: #3F5792;

}

.content .panel-tables .panel-body a:hover {
    background-color: #3F5792;
    border-radius: 0;
    color: lightgray;
    text-decoration: none;
}

.content img {
    padding: 0 12px 0 0;
    border: 0px;
}

.content .panel-body h2 {
    text-align: left;
}

.content .panel-footer p {
    text-align: center;

}

.content .footer h4 {
    color: #3EAB45;
}

.content .footer {
    width: 100%;
    background-color: #333;
    border-radius: 20px 20px 0 0;
    text-align: left;
    margin-top: 48px;
    padding-bottom: 100px;
    /*font: 0.8em/1.2 arial, sans-serif;*/
}

.content .footer .img-responsive {
    padding: 0 12px 12px 12px;
}

.content .footer p  {

}

.content .footer li a, .content .theory-text li a {
    display: block;
    border-bottom: 1px dotted #555;
    padding: 0.5em 0 0.5em 0.5em;
    text-decoration: none;
    color: #efefef;
}

.content .footer li a:hover, .content .theory-text li a:hover {
    background-image: radial-gradient(circle, #666, #333);
    color: #efefef;
    transition-duration: 0.5s;

}

/*.content .footer li a::before {
    content: "▫ ";
    color: #2878ff;
}*/

.content .footer a.list {
    font: 1.2em/1.4 arial, sans-serif;
    text-decoration: none;
    padding: 4px;
    margin-bottom: 4px;
}

.content .footer a.list:hover {
    color: lightgray;
    border-bottom:#3F5792 solid thick;
}

.content .panel-footer .label {
    margin: 0 6px;
}

.content .nav .fa {
    padding-right: 4px;
}

.content .form-control {
    color: #ebebeb;
    background-color:#333;
    border-color: #303030;
    font-size: 1.2em;
    transition: 0.3s;
}

.content .selectone {
    width: 100px;
}

.content input.form-control:hover {
    background-color: #111;
}
.content .calculation-service .form-control {
    color: #d98f4f;
    background-color: #222;
}

.content .form-control .not-valid {
    color: #a94442;
    background-color: #ebccd1;
}

.content .form-group label {
    font-weight: normal;
    margin-top: 10px;
    color: #bdbdbd;
    font-size: 1.2em;
}

.content .calculation-service .form-group label {
    color: #d98f4f;
}

.content .form-group label.lead {
    margin-top: 5px;
    margin-bottom: 10px;
}

.content input:disabled, .content select:disabled {
    background-color:#2a2a2a;
    /*border: none;*/
    box-shadow: none;
}

.content input[readonly]  {
    background-color:#262524;
    border: none !important;
    box-shadow: none !important;
    color: #bbb;
}

.content .btn-header {
    background-color: #303030;
}

.content label.upload {
    background-color: #3F5792;
    padding: 12px;
    margin: 5px;
    border-radius: 4px;
}

.content .calculator-save label.upload {
    background-color: #3F5792;
    padding: 7px;
    margin: 0 0 0 5px;
    border-radius: 4px;
    font-weight: 400;
    color: white;
}

.content .calculator-save .btn {
    margin-left: 5px;
}

.content label.upload:hover {
    color: whitesmoke;
    background-color: #000B24;
    border-color: #3F5792;
    border-width: 1px;
    border-color: #3F5792;
}


.content .btn-header:hover {
    background-color: #606060;
    color: #f5f5f5;
}

.content .btn-header.active {
    background-color: #606060;
    color: #f5f5f5;
}


.content #file-upload-pipes\:filePipes, .content #file-upload-nodes\:fileNodes, .content #file-upload-network\:fileNetwork, .content #calculator\:fileCalculator {
    display: none;
}

label.upload {
    -webkit-appearance: button;
    -moz-appearance: button;
    appearance: button;
    padding: 2px;
    cursor: pointer;
}

.content .pull-right {
    float: right !important;
}

.content .pull-left {
    float: left !important;
}

.content .dropdown-menu {
    background-color: #303030 !important;
}

.content .dropdown-menu a {
    color: #d98f4f;
}

.content .dropdown-menu li {
    color: #d98f4f;
}

.content .user-form-error, .user-form-default, .content .alert {
    padding: 4px;
    border: none;
}

.content .alert {
    background-color: #202020;
    margin: 5px;
    border: none;
}

.content .user-form-error {
    border-color: lightcoral;
}

.content .alert-default {
    margin-top: 12px;
    border: none;
    list-style-type: none;
}

.content .alert.coeff-error {
    font-size: 0.75em;
    padding: 4px;
}

.user-form-default {
    border-color: #3F5792;
    background-color: lightblue;
    color: #3F5792;
}


.alert-info .form-horizontal .form-control {
    width: 180px;
    background-color: transparent;
    border: none;
    color: #3F5792;
}

.content .cc {
    color: #3F5792;
}

.content .table-pagination {
    margin-top: 12px;
    margin-bottom: 12px;
}

.content .pagination li a {
    background-color: #303030;
    color: #bdbdbd;
    border: none;
}

.content .pagination li a:hover {
    background-color: #3F5792;
    color: #303030;
}

.content .pagination li.active a {
    background-color: #3F5792;
    color: #bdbdbd;
}

.content .theory-list .list-group-item:nth-child(even), .content .index-list .list-group-item:nth-child(even) {
    background: #303030;
    border-right: #222 solid thick;
}

.content .theory-list .list-group-item:nth-child(odd), .content .index-list .list-group-item:nth-child(odd) {
    background: #262524;
    border-right: #333 solid thick;
}

.content .theory-list .list-group-item:first-child, .content .index-list .list-group-item:first-child {
    border-top: #333 solid thin;
}

.content .theory-list .list-group-item:first-child a, .content .theory-list .list-group-item:first-child {
    color: #d98f4f;
    text-transform: uppercase;
    font-family: 'Roboto-Condensed', sans-serif;
    font-size: 1.25em;
}

.content .theory-list .list-group-item .heading {
    font-size: 1.2em;
}

.content .theory-list .list-group-item:first-child a:hover {
    color: #3F5792;
}

.content .theory-list .list-group-item:first-child:hover, .content .index-list .list-group-item:first-child:hover {
    background-color: #3c3f41;
}

.content .theory-list .list-group-item, .content .index-list .list-group-item {
    background-color: #202020;
    /*border-color: #1a1a1a;*/
    color: #bdbdbd;
    border: none;
}

.content .index-list ul {
    margin: 0;
    padding: 0;
}

.content .theory-list .list-group-item.active, .content .index-list .list-group-item.active {
    background-color: #3F5792;
}

.content .list-group-item.active a {
    color: whitesmoke;
}

.content .theory-list .list-group-item:hover, .content .index-list .list-group-item:hover {
    background-color: #3c3f41;
    /*border-color: #1a1a1a;*/
}

.content .theory-list .list-group-item a, .content .index-list .list-group-item a {
    text-decoration: none;
    display: block;
    font-size: 1.2em;

}

.content .theory-list .list-group-item a:hover, .content .index-list .list-group-item a:hover {
    text-decoration: none;
}

.click_here {
    color: #ff9900;
    text-align: center;
}

.text-left h2, .text-left h3 {
    text-align: left;
}

.content .modal-body, .content .modal-header, .content .modal-footer {
    background-color: #303030;
}

.content .top_ad {
    margin-top: 20px;
}

/*.content .top_ad_next {
    text-align: center;

}*/

.content .btn_top_left {
    display: inline-block;
    cursor: pointer;
    border-color: red;
    border-width: 1px;
    border-top-style: solid;
    border-radius: 10px;
}

.content .btn_top_left:hover {
    background-color: white;
}

.content .button-tag {
    padding: 0;
    margin: 2px;
    white-space: nowrap;
    text-decoration: none;
    text-transform: uppercase;
    font-family: 'Roboto-Condensed', sans-serif;
    font-size: 1.4em;
}

.content .menu_all .button-tag {
    border: none;
    padding: 0;
    margin: 0;
    white-space: nowrap;
    text-decoration: none;
    text-transform: uppercase;
    font-family: 'Roboto-Condensed', sans-serif;
    font-size: 1.2em;
    width: 100%;
    color: #3F5792;
}

.content .menu_all .button-tag:hover {
    background-color: #3F5792;
    color: whitesmoke;
}

.content .menu_all .left .button-tag {
    text-align: right;
    padding-right: 4px;
}

.content .menu_all .right .button-tag {
    text-align: left;
    padding-left: 4px;
}

.content .menu_all .panel-info {
    background-color: #303030;
}

.content .btn-circle {
    width: 30px;
    height: 30px;
    text-align: center;
    padding: 6px 0;
    font-size: 12px;
    line-height: 1.428571429;
    border-radius: 15px;
}
.content .btn-circle.btn-lg {
    width: 50px;
    height: 50px;
    padding: 10px 16px;
    font-size: 18px;
    line-height: 1.33;
    border-radius: 25px;
}

.content .btn-circle.btn-xl {
    width: 70px;
    height: 70px;
    padding: 10px 16px;
    font-size: 24px;
    line-height: 1.33;
    border-radius: 35px;
}

.content .box-header {
    color: #d98f4f;
    /*text-transform: uppercase;*/
    text-align: left;
    font-family: 'Oswald', sans-serif;
    font-size: 28px;
    /*font-weight: bold;*/
    margin: 0 0 20px;
    padding: 20px 0;
}

.content .box-header .right {
    float: right;
    font-size: 36px;
}

.content .box-header .left {
    float: left;
}

.content .box-header:hover {
    background-color: #3F5792;
}

.content .box-header a {
    color:  #3EAB45;
    text-decoration: none;
    cursor: pointer;
    display: block;
    padding: 0 12px;
}

.content .box-body {
    background-color: #333;
    color: lightgrey;
    padding: 0;
    overflow: hidden;
    border-color: #111;
    border-style: solid;
    border-top-width: 1px;
    border-bottom-width: 1px;
    border-left-width: 1px;
    border-right: none;
}

.content .jumbotron.index-page, .content .jumbotron.calculator-page {
    background-color: #333;
    padding: 20px;
}

.content .box-body .in-box-text {
    padding: 0 12px;
    font-size: 18px;
}

.content .panel-default > .panel-heading {
    background-color: transparent;
}

.content .box-body .half {
    float: left;
    width: 50%;
}

.content .thumbnail {
    background: transparent;
    border: none;
}

.content .calc-thumb {
    padding: 0px;
    margin-bottom: 12px;
}

.content .modal-header .close {
    color: #5cb85c;
}

.content .modal-footer .btn {
    margin-bottom: 0px;
}

.content .btn.ml {
    margin-left: 4px;
}

.content .related-links {
    clear: left;
}


.content .sitemap h3, .content .related-links h3 {
    text-align: left;
}

.content .sitemap ul, .content .links ul, .content .footer ul {
    list-style-type: none;
}

.content .adsense_tables_right {
    height: 600px;
    width: 100%;
    margin-bottom: 24px;
}

.content .waldo_tables_right {
    width: 100%;
    margin-bottom: 24px;
}

.content .waldo_tables_middle {
    width: 300px;
    margin-bottom: 24px;
    float: left;
}

.content .tables_middle_pfc_ad {
    width: 300px;
    margin-bottom: 24px;
    margin-left: 24px;
    float: left;
}

.content .adsense_inText {
    height: 200px;
    width: 100%;
    margin-top: 24px;
    margin-bottom: 24px;
    /*    background-color: #0000ff;
        border: solid black;
        border-width: 1px;*/
}

.content .index-image {
    width: 60%;
    height: 100%;
    margin: 0 auto;
}

.content .container-panel {
    display: block;
    overflow: hidden;
    position: relative;
    border-radius: 5px;
    margin: -20px;
}

.content .content-panel {
    position: relative;
    z-index: 3;
    margin: 10px;
}

.content .jumbotron {
    padding: 0px;
}

.content .rotate-panel-one {
    display: block;
    position: absolute;
    z-index: 1;
    width: 100%;
    min-height: 150%;
    background: #303030;
    border: solid;
    border-width: 1px;
    border-color: #202020;
    transform: rotate(30deg);
    left: 75%;
    top: 0%;
}

.content .rotate-panel-two {
    display: block;
    position: absolute;
    z-index: 1;
    width: 100%;
    min-height: 150%;
    background: #262524;
    border: solid;
    border-width: 1px;
    border-color: #202020;
    transform: rotate(30deg);
    left: 90%;
    top: 0%;
}

.content .calc-weight {
    /*width: 100%;*/
    /*background-color: #303030;*/
}

.content .ad360x320 {
    padding-bottom: 24px;
}

.content .calculator-text {
    color: #d98f4f;
    font-size: large;
    padding-left: 24px;
}

.content .btn.table-pipes-toolbar {
    margin: 5px;
}

#ajaxloader {
    position: fixed;
    right: 50px;
    top: 150px;
    z-index: 1;
}

.content .jqplot-title {
    color: #efefef;
}

.content .jqplot-pie-series {
    color: #111111;
}

.content .jqplot-table-legend {
    color: #efefef;
}

.content .jqplot-target {
    color: white;
}

.content .jqplot-xaxis-label{
    color: #EFEFEF;
}
.content .jqplot-yaxis-label, .content .jqplot-yaxis-tick {
    color: #FF4081;
}
.content .jqplot-y2axis-label , .content .jqplot-y2axis-tick {
    color: #FB8C00;
}

.content .jqplot-y3axis-label , .content .jqplot-y3axis-tick {
    color: #43A047;
}

.content .jqplot-y4axis-label , .content .jqplot-y4axis-tick {
    color: #4512FF;
}

.content .ihs-ad-top-right {
    height: 250px;
    width: 300px;
    margin-top: 36px;
    margin-bottom: 36px;
}

.content .adsense-top-left, .content .global-ad-top-left {
    margin-top: 36px;
    margin-bottom: 36px;
}

.content .adsense-ad-right {
    margin-bottom: 36px;
}

.content .title-middle {
    padding-left: 24px;
    padding-right: 24px;
}

.content .title-right-description {
    color: #FCB97F;
    padding: 12px;
    padding-left: 30px;
    padding-right: 30px;
}

.content .title-right-exclusive {
    color: #FCB97F;
    padding: 12px;
    padding-left: 0px;
    padding-right: 0px;
}

.content .title-left-description {
    color: #FCB97F;
    padding: 12px 30px;
    margin-left: -24px;
}

.content .title-middle-description {
    color: #efefef;
    padding: 12px 30px;
    margin-right: 24px;
}

.content .carousel h2 {
    background-color: rgba(20,20,20,0.6);
    color: #FB8C00;
}

.content .model {
    color: #FCB97F;
    padding: 12px 30px;
}

.content .model p {
    margin-top: 40px;
    color: lightgray;
}

.content .description-title h3  {
    color: #d98f4f;
    text-align: left;
    padding-top: 10px;
    padding-bottom: 10px;
    margin: 0px;
}

.content .description-link {
    padding-top: 10px;
    padding-bottom: 10px;
}

.content .title-right-description, .content .title-left-description, .content .title-middle-description {
    border-style: solid;
    border-radius: 12px;
    border-width: 1px;
    border-color: #111;
    background: #222;
    margin-top: 24px;
    margin-bottom: 10px;

}

.content .example-download, .content .examples {
    background-color: #333;
    border-radius: 10px;
    padding: 10px;
}

.content .examples-box {
    padding: 10px;
    border: #333 solid thin;
    /*height: 196px;*/
}

.content .examples-box a.btn-primary {
    background-color: transparent;
    border:#3F5792 thin solid;
}

.content .examples-box a.btn-primary:hover {
    background-color: #2878ff;
}

.content .examples .example-title, .content .examples-box .example-title {
    font-family: 'Shadows Into Light', cursive;
    color: #2878ff;
    font-size: 2em;
}

.content .examples-box .example-title {
    margin-top: 12px;
}

.content .examples .example-subtitle, .content .examples-box .example-subtitle {
    font-family: 'Shadows Into Light', cursive;
    color: #2878ff;
    font-size: 1.5em;
}

.content .examples-box .calc-box {
    float: left;
    width: 150px;
    /*height: 150px;*/
    background-color: #111;
    margin: 12px;
    border-radius: 10px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.content .examples-box .calc-task {
    float: left;
}
.content .examples-box .calc-tube {
    float: right;
    /*width: 150px;*/
    /*height: 150px;*/
    margin: 12px;
}

.content .examples-box .calc-box-name {
    display: inline-block;
    font-size: 2.5em;
    color: #1fb;
    padding: 5px;
    height: 50%;
}

.content .examples-box .calc-box-fluid {
    display: inline-block;
    font-size: 1.4em;
    color: #3F5792;
    padding: 5px;
    height: 30%;
}

.content .examples-box .calc-box-left {
    font-size: 1.2em;
    color: #d98f4f;
    padding: 5px;
    height: 20%;
    width: 50%;
    text-align: left;

}

.content .examples-box .calc-box-right {
    font-size: 1.2em;
    color: #f15;
    padding: 5px;
    height: 20%;
    width: 50%;
    text-align: right;

}

.content .thumbnail {
    position: relative;
}

.content .thumbnail .btn {
    position: absolute;
    top: 80%;
    left: 10%;
    transform: translate(-5%, -5%);
    -ms-transform: translate(-5%, -5%);
}

.content .thumbnail .btn.right {
    position: absolute;
    top: 80%;
    right: 10%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
}

.content .well {
    background-color: transparent;
}

.content .videos {
    margin-bottom: 48px;
}

.content .top_ad {
    height: 250px;
    width: 300px;
    margin-bottom: 36px;
}

.content #top-arrow {
    position: fixed;
    bottom: 20px;
    right: 30px;
    z-index: 99;
    border: none;
    outline: none;
    background-color: #555;
    color: white;
    cursor: pointer;
    padding: 15px;
    border-radius: 10px;
    font-size: 18px;
}

#top-arrow:hover {
    background-color: #002068;
}

.content .dropdown-menu .divider {
    background-color: #202020;
}

.content .img-left {
    float: left;
}

.content .modal-header, .content .modal-footer {
    border: none;
}

.content .value-300x250 {
    width: 300px;
    height: 250px;
    margin: 16px 10px;

}

.content .video-300x250, .content .video-sticky-300x250 {
    width: 300px;
    height: 250px;
    margin: 16px 10px;
}

.content .thumbnail .caption {
    color: lightblue;
}

.content .value-728x90 {
    width: 728px;
    height: 90px;
    margin: 16px 10px;

}

.content .value-300x600 {
    width: 300px;
    height: 600px;
    margin: 16px 10px;

}

.content .value-970x250 {
    width: 970px;
    height: 250px;
    margin: 16px 10px;
}

.content .value-discovery-video {
    width: 300px;
    height: 250px;
    margin: 16px 10px;
}

.content .slide-container {
    position: relative;
    text-align: center;
    color: #eee;
}

.content .slide-container .top-right {
    position: absolute;
    top: 0px;
    right: 10px;
    background: rgba(1,0,10,0.5);
    padding: 16px 6px 16px 8px;
    font-size: 1.2em;
    border-radius: 0 0 0 10px;
    width: 400px;
}

.content .social-img {
    border-radius: 6px;
    padding: 0px;
    margin: 0 12px 0 0;
}

.content .bordered-panel {
    border-radius: 6px;
    border-style: solid;
    border-width: 1px;
    border-color: #111;
    background-color: #222;
    padding: 12px;
}

.content .ui-widget-overlay {
    opacity: 100 !important;
}

.content .alert-dismissable .close {
    color: #2878ff;
    opacity: 1;
    left: 0;
    border: none;
}

#rotator img {
    position: absolute;
}

/** na mobilnim uredjajima ne prikazuje reklamu 300x600 koja se nalazi na tabelama i na teoriji */
/** na mobilnim uredjajima ne prikazuje video reklamu 300x250 desnu pored naslova */
@media (max-width: 768px) {
    .content .value-300x600 {
        display: none;
    }

    /*    .content .desktop .adsense-ad-top-left, .content .desktop .video-300x250 {
            display: none;
        }*/
}

.content .about {
    float: right;
    width: 300px;
    background: #222;
    color: lightgrey;
    border-radius: 10px;
    margin: 0 0 16px 16px;
}

.content .about h2 {
    font-size: 1.4em;
    color: #1fb;
    text-align: left;
    margin: 10px;
}
.content .about h3 {
    font-size: 1.2em;
    color: #3F5792;
    text-align: left;
    margin: 6px 0 6px 10px;
}
.content .about .img-right {
    float: right;
    width: 80px;
    margin: 10px 0 10px 10px;
}

.content .about p {
    margin: 10px;
}

.content .banner-calc {
    margin-top: 36px;
    margin-bottom: 24px;
}

element #login-header:c {
    border: none;
}

.content .rotateimg180 {
    -webkit-transform:rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
}

.content .overlay-text a {
    position: absolute;
    right: 40px;
    bottom: 20px;
    padding: 8px;
    background-color: rgba(0, 0, 0, 0.5);
    border-radius: 4px;
    text-transform: uppercase;
    font-size: 1.2em;
    color: #d98f4f;

}

.content .overlay-text:hover a {
    background-color: black;
    color: #3F5792;
}

.content .index-head a, .content .index-head {
    color: #d98f4f;
    text-transform: uppercase;
    display: block;
}

.content .index-boxes p {
    margin: 0px;
    padding: 0 0 6px;
}

.content .nav > li > a {
    padding: 7px;
}

.content .panel-body a.table-pipes-toolbar {
    padding: 12px;
}

.content .panel-body.network a, .content #operation-point-form a {
    background-color: #3F5792;
    padding: 12px;
    color: whitesmoke;
    transition: 0.3s;
}

.content .panel-body.network a:hover, .content #operation-point-form a:hover {
    color: whitesmoke;
    background-color: #000B24;
    border-color: #3F5792;
}

.content .panel-body.network a.example {
    background-color: transparent;
    color: #3F5792;
    transition: 0.3s;
    text-decoration: none;
    padding: 0px;
}

.content .panel-body.network a.example:hover {
    color: #2878ff;
}

.content #pipe-grades\:iso_name  {
    color: #3EAB45;
    font-weight: bold;
}

.content .ui-datatable .ui-row-editor .ui-icon-pencil:before{
    content: "\f040";
}

.content .ui-datatable .ui-row-editor .ui-icon-check:before{
    content: "\f00c";
}

.content .ui-datatable .ui-row-editor .ui-icon-close:before{
    content: "\f00d";
}

.content .ui-datatable .ui-icon-trash:before{
    content: "\f1f8";
}

.content .panel-body a.ui-row-editor-check,
.content .panel-body a.ui-row-editor-close,
.content .panel-body a.ui-row-editor-pencil,
.content .ui-datatable .ui-button-icon-only {
    background-color: transparent;
}

.content .ui-datatable .ui-row-editor .ui-icon-pencil,
.content .ui-datatable .ui-row-editor .ui-icon-check,
.content .ui-datatable .ui-row-editor .ui-icon-close,
.content .ui-datatable .ui-icon-trash {
    font-family: FontAwesome;
    background-image: none !important;
    text-indent: 0px;
    background-repeat: no-repeat;
    display: block;
    overflow: visible;
    text-indent: 0px;
}

.content .ui-inputfield {
    border: 1px solid #303030;
    color: #3F5792;
}

.content .tube {
    padding: 10px 20px;
    border-radius: 6px;
    border-style: solid;
    border-width: 1px;
    border-color: #111;
    background-color: #222;
    margin-bottom: 20px;
}

.content .tube a {
    font-weight: 800;
    font-style: italic;
    font-size: 1.5em;
    color: #3EAB45;
    text-decoration: none;
}

.content .tube .fa-big {
    color: red;
}


.content .tube a:hover, .content .tube a:hover .fa-big {
    color: lightgray;
}

.content .math_eq {
    font-size: 24px;
}

.content h2.pipe-tables-title, .content h2.node-tables-title {
    font-size: 24px;
    color: lightgray;
    text-align: center;
}

.content .pipe-table-title {
    font-size: 24px;
}

.content .registrate-panel:hover {
    background-color: #555;
}

.content p.math-formula {
    font-size: 1.5em;
    font-weight: bold;
    text-align: left;
    margin: 20px 0;
}

.content li, .content dl {
    margin-left: 14px;
}


@media (max-width: 768px) {
    .table-calculator {
        display: none;
    }
}

@media (max-width: 768px) {
    .calculator_right {
        clear: left;
    }
}

@media (max-width: 992px) {
    .tables_middle_pfc_ad {
        display: none;
    }
}