.top {
    background: url('../image/nodebg.png') no-repeat;
    z-index: 1;
    height: 44rem;
}
#addnode{
    margin-top: 4rem;
    flex-direction: column;
}
#nodeaddBtn{
    display: flex;
    justify-content: center;
    align-items: center;
}
.yes{
    color: white 1 !important;
}
#imgTit{
    justify-content: center;
}
.titleBtn{
    margin-top: 4rem;
    display: flex;
    align-items: center;
}
.has-error .form-control{
    border-color: #ff2b2b !important;
}
.form-control::before {
    border-color: #ff2b2b  !important;
}
.has-error::before {
    border-color: #ff2b2b  !important; 
}
.endtxt{
    margin-top: 4rem;
    margin-bottom: 4rem;
}
.nodeicon{
    margin-left: 2rem;
    margin-top: 2rem;
}
.codeBtn{
    background-color: #0c1328 !important; 
}
#codeBtn{
    height: 4rem !important;
}
.yicon{
    display: none;
}
.nodeBtn{
    margin-top: 2rem;
    width: 14rem;
    height: 4rem;
    line-height: 2.5rem;
    margin-left: 2rem;
    font-weight: bolder;
    background: none;
    cursor: inherit;
    border-color: white;
    color: white;
}
.btn.disabled, .btn[disabled], fieldset[disabled] .btn{
    opacity: 1 !important;
}
.form-group{
    margin-bottom: 2rem;
}
.programIns,.nodeSeting,.increase{
    display: flex;
    flex-direction: column;
    margin-top: 3rem;
    margin-bottom: 3rem;
}
.increase>h4{
 display: flex;
 align-items: center;
}
.nodeBtn:hover{
    background: none;
    border-color:white;
}
.command{
    display: flex;
    justify-content: center;
    flex-direction: column;
    border: 1px solid #213474;
    width: 62rem;
    justify-content: center;
    background: #111a39;
    height: 7rem;
    margin-top: 2rem;
    margin-bottom: 2rem;
}
.command>span{
    width: 60rem;
    margin-left: 1rem;
}
.form-control-feedback{
    right: 50%;
}
.goback{
    margin-top: 2rem;
    cursor: pointer;
    color: #1f79c0;
}
.has-success .form-control{
    border-color: #07c8c2 ;
}
.has-success .form-control:focus{
    border-color: #07c8c2 ;
}
.has-success .form-control-feedback{
    color: #07c8c2 ;
}
.form-control{
    width: 50%;
    background: #111a39;
    border-color: #1a285a;
    color: white;
    height: 4rem;
}
#code{
    width: auto;
    display: block;
}
#codeval{
    width: 20%;
}
.selectnode:hover{
    background-color: #23a4ff;
    border-color:#23a4ff;
}
.selectnode{
    background-color: #23a4ff;
    border-color:#23a4ff;
    
}

.navbar-default {
    background-color: initial;
    border-color: #0a0f21;
}

.topCon {
    display: flex;
    justify-content: center;
    align-items: center;
}

.leftBox {
    background: url('../image/jiedian_banner.png') no-repeat;
    background-size: 100%;
    height: 40rem;
    width: 40rem;
}

.rightBox {
    width: 40rem;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-direction: column;
    margin-left: 10rem;
    color: white;
}

.reportBox {
    display: flex;
    justify-content: space-between;
    align-items: center;
    text-align: center;
    margin-top: 10rem;
    margin-bottom: 10rem;
}

.nodes>img {
    width: 10rem;
    height: 10rem;
}

.nodes>span {
    font-size: 1.3rem;
}

.nodenums {
    width: 100%;
    display: flex;
    justify-content: space-around;
    align-items: center;
}

.nodenum {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: #12182f;
    height: 16rem;
    width: 20rem;
    border-top-left-radius: 1rem;
    border-top-right-radius: 1rem;
    border-radius: 1rem;
}

.nodenum>img {
    width: 8rem;
    height: 8rem;
}

.nodenum>span {
    font-size: 1.5rem;
}

.title {
    font-size: 2rem;
}

.ipBox {
    display: flex;
    width: 100%;
    flex-direction: column;
}

.ipBox>span {
    margin-top: 1rem;
    margin-left: 2rem;
}

.footBg {
    background: url('../image/nodes2.png') no-repeat;
    z-index: 1;
    background-size:100% 100%;
    height: 40rem;
    margin-top: 14rem;
    display: flex;
    flex-direction: column;
    color: white;
    justify-content: center;
    align-items: center;
}

.configTable {
    display: flex;
    justify-content: space-around;
    align-items: flex-end;
    margin-top: 3rem;
    margin-bottom: 8rem;
    margin-left: 2rem;
}

.first,
.second {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}
.firstnodes {
    height: 8rem;
    width: 6rem;
    background-color: #1b2646;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 0.5rem;
}
.has-feedback label~.form-control-feedback{
    top: 27px !important;
}
#code>.form-control-feedback{
    position: absolute;
    top: 2px !important;
    right: 80% !important; 
}
#code>.help-block{
    position: absolute;
    top: 106%;
    left: 1%;
}
.secondnodes {
    height: 8rem;
    width: 19rem;
    background-color: #1b2646;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: 0.5rem;
    margin-top: 0.5rem;
}

.first>div>span {
    display: block;
    width: 4rem;
    height: 4rem;
}

.nodestop {
    border-top-left-radius: 1rem;
    border-top-right-radius: 1rem;
}

.nodesbot {
    border-bottom-left-radius: 1rem;
    border-bottom-right-radius: 1rem;
}

.gre {
    color: #07c8c2;
}

.fot {
    color: #0d66bb;
}
input{
    -webkit-appearance: initial;
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
    .firstnodes{
        width: 7rem;
    }
    .secondnodes{
        width: 16rem;
    }
    .footBg{
        height: 25rem;
    }
    
}

@media(max-width:767px) {
    .footBg {
        margin-top: 2rem;
        height: 16rem;
        background: url('../image/nodes2.png') -40rem no-repeat;
        background-size: 300% 100%;
    }
    #code>.form-control-feedback{
        right: 40% !important; 
    }
    #codeval{
        width: 53%;
    }
    .footBg>h3{
        text-align: center;
        font-size: 1.8rem !important;
        margin-bottom: 2rem;
    }
    .nodeicon{
    margin-left: 1rem;
    }
    .endtxt{
        flex-direction: column;
    }
    .increase>h4{
        align-items: flex-start;
    }
    #code{
        width: 70%;
    }
    .nodeBtn{
        margin-left: 1rem;
    }
    .command>span{
        width: auto;
    }
    .top{
        height: auto;
    }
    .topCon {
        flex-direction: column;
    }
    .form-control{
        width: 100%;
    }
    .form-control-feedback{
        right: 0;
    }
    .leftBox {
        display: none;
    }
    .rightBox {
        display: flex;
        height: 20rem;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        color: white;
        margin: 0;
    }
    .rightBox>h2{
        margin-bottom: 2rem;
    }
    .nodes>img {
        width: 8rem;
        height: 8rem;
    }
    
    .nodes>span {
        font-size: 1rem;
    }
    .reportBox{
        margin-top: 5rem;
        margin-bottom: 5rem;
        width: auto;
    }
    .nodenum {
        height: 8rem;
        width: 9rem;
    }
    .nodenum>img {
        width: 6rem;
        height: 6rem;
    }
    .nodenum>span {
        font-size: 1rem;
    }
    .reportBox>h3{
        margin-top: 5rem !important;
    }
    .configTable{
        display: flex;
        align-items: stretch;
        justify-content: center;
        margin-left: 0;
    }
    .secondnodes{
        width: 8rem;
    }
    .node {
        height: 18rem;
        background: url('../image/nodes2.png') -20rem no-repeat;
        background-size: 200% 100%;
    }
    .node>h3{
        font-size: 1.5rem;
        margin-bottom: 1rem;
    }
    .addBtn{
        margin-top: 0;
    }
    .ipBox>span {
        text-align: left;
    }
    .command{
        width: auto;
    }
}


input[type="checkbox"] {
    width: 14px;
    height: 14px;
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    line-height: 12px;
    position: relative;
}

input[type="checkbox"]::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    background: white;
    width: 100%;
    height: 100%;
    border: 1px solid #1a285a;
}

input[type="checkbox"]:checked::before {
    content: "\2713";
    background-color: #2196F3;
    color: #fff;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    border: 1px solid #1a285a;
    font-size: 14px;
    font-weight: bold;
}