.card-box {
    background-color: #fff;
    border: 1px solid #ededed;
    border-radius: 4px;
    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.2);
    margin-bottom: 30px;
    padding: 20px;
}

.btn-buscar{
    margin-top: 5px;
}


/*--UTIL--*/

.mt-50{
    margin-top: 50px;
}
.mb-50{
    margin-bottom: 50px;
}

.titulo-seguimiento{
    font-weight: bold;
}


/*--esquema seguimiento--*/



body {
    margin:0;
    padding:0;
    font-family: 'Open Sans', sans-serif;
}
.clear {
    clear:both;
}

.content{
    width:60%;
    margin:3% auto 0 auto;
    height:460px;
    background-color:#F5F5F5;
}


.shipment {
    width:100%;
    margin-top:10%;
}
span.line {
    height: 5px;
    width: 90px;
    background-color:#F5998E;
    display: block;
    position: absolute;
    top: 28%;
    left: 45%;
}
.confirm{
    text-align:center;
    width:20%;
    position:relative;
    float:left;
    margin-left:5%;
}
.realizado .imgcircle  {
    background-color:#98D091;
}
.listo span.line {
    background-color:#98D091;
}
.content3 p {
    margin-left:-50%;
    font-size:15px;
    font-weight:600;
}
.imgcircle {
    height:75px;
    width:75px;
    border-radius:50%;
    background-color:#F5998E;
    position:relative;
}
.imgcircle img {
    height:30px;
    position:absolute;
    top: 28%;
    left: 30%;
}
.process{
    position:relative;
    width:20%;
    text-align:center;
    float:left;
}
.quality {
    position:relative;
    width:20%;
    text-align:center;
    float:left;
}
.dispatch{
    position:relative;
    width:20%;
    text-align:center;
    float:left;
}
.delivery{
    position:relative;
    width:20%;
    text-align:center;
    float:left;
    margin-right:-9%;
}

.rechazado{
    color: #dc173d;
}

.anulado .imgcircle  {
    background-color:#c3c3c3;
}

.anulado p{
    color: #dc173d;
}

.l-anulado span.line {
    background-color:#c3c3c3;
}



/*---- responsive-design -----*/
@media(max-width:1920px){
    span.line {
        width:157px;
        left:32%;
    }
    .shipment{
        margin-top:6%;
    }
    .content3 p{
        margin-left:-65%;
    }
}

@media(max-width:1680px){
    .content3 p {
        margin-left: -60%;
    }
    span.line {
        width: 127px;
        left: 37%;
    }
}

@media(max-width:1600px){
    span.line {
        width: 117px;
        left: 39%;
    }
}

@media(max-width:1440px){
    .content3 p {
        margin-left: -53%;
    }
    span.line {
        width: 99px;
        left: 43%;
    }
}

@media (max-width: 1366px){
    span.line {
        width: 90px;
        left: 45%;
    }
    .shipment {
        margin-top: 10%;
    }
}

@media (max-width: 1280px){
    span.line {
        width: 80px;
        left: 48%;
        top:29%;
    }
}

@media (max-width: 1080px){

    span.line {
        width: 88px;
        left: 46%;
    }
}

@media (max-width: 1050px){
    span.line {
        width: 84px;
        left: 47%;
    }
}

@media (max-width: 1024px){
    .content{
        width:77%;
    }
    .content3 p {
        font-size:14px;
    }
}

@media (max-width: 991px){
    .content {
        width: 80%;
    }
    span.line {
        width: 84px;
        left: 47%;
    }
}

@media (max-width: 900px){
    .content {
        width: 85%;
    }
    span.line {
        width: 78px;
        left: 49%;
    }
}

@media (max-width: 800px){
    .content {
        width: 95%;
    }

}

@media (max-width: 768px){

    span.line {
        width: 72px;
        left: 51%;
    }
}

@media (max-width: 736px){
    span.line {
        width: 62px;
        left: 55%;
    }
}

@media (max-width: 667px){

    .shipment {
        margin-top: 13%;
    }
    .content3 p {
        font-size: 12px;
        margin-left: -35%;
    }
    .confirm{
        margin-left:4%;
    }
    span.line {
        width: 49px;
        left: 60%;
    }
}

@media (max-width: 600px){
    .imgcircle {
        height: 65px;
        width: 65px;
    }
    .imgcircle img{
        top: 26%;
        left: 27%;
    }
    .content3 p {
        margin-left: -38%;
        font-size:11px;
    }

    span.line {
        width: 50px;
        left: 58%;
    }
}

@media (max-width: 568px){

    span.line {
        width: 56px;
        left: 47%;
    }

    .imgcircle {
        height: 50px;
        width: 50px;
    }
    .imgcircle img {
        height: 25px;
        top: 27%;
        left: 25%;
    }
    .content3 p {
        font-size: 10px;
        margin-left: -46%;
    }
    .confirm {
        margin-left: 5%;
    }
}

@media (max-width: 414px){

    .confirm {
        width:100%;
    }
    .process {
        width:100%;
        margin: 22% 0 0 5%;
    }
    .quality{
        width:100%;
        margin: 22% 0 0 5%;
    }
    .dispatch{
        width:100%;
        margin: 22% 0 0 5%;
    }
    .delivery{
        width:100%;
        margin: 22% 0 0 5%;
    }
    .imgcircle {
        height: 70px;
        width: 70px;
        margin-left: 35%;
    }
    .imgcircle img {
        height: 30px;
        top: 27%;
        left: 28%;
    }
    span.line {
        width: 6px;
        left: 43.5%;
        height: 58px;
        top:152%;
    }
    .content3 p {
        font-size: 15px;
        margin: -12% 0 0 -72%;
    }
    .shipment {
        margin-left: 16%;
    }

}

@media (max-width: 384px){

    .content3 p {
        margin: -13% 0 0 -74%;
    }
    .shipment {
        margin-top: 11%;
    }
    span.line {
        top:154%;
        left:44%;
        height:52px;
    }

}

@media (max-width: 375px){

    span.line {
        top: 149%;
        left: 44.5%;
        height: 51px;
    }
    .shipment {
        margin-left: 17%;
    }
}

@media (max-width: 320px){


    .content3 p {
        margin: -16% 0 0 -79%;
    }
    .shipment {
        margin-left: 19%;
    }
    span.line {
        top: 115%;
        left: 46%;
    }

}
/*--INFO--*/

.campo-ficha {
    padding-left: 0px !important;
}

.pd-sub-title {
    color: #5a5a5a;
    display: block;
    font-family: "Lato",sans-serif;
    font-size: 16px;
    line-height: 12px;
    margin-bottom: 0!important;
    padding-bottom: 10px;
    position: relative;
    font-weight: bold;
}

.pd-sub-title::before {
    background-color: #9d9d9d;
    bottom: 0;
    content: "";
    height: 1px;
    left: 0;
    position: absolute;
    width: 30px;
}

.short-desc p {
    color: #8f8e8e;
    font-family: "Montserrat",sans-serif;
    font-size: 15px;
    font-weight: 300;
    line-height: 24px;
    margin-bottom: 10px !important;
}

.section {
    float: left;
    width: 100%;
}

ul {
    margin: 0px;
    padding: 0px;
}

ul li a:hover{
    text-decoration: none !important;
}

ul li a{
    text-decoration: none !important;
}

/*-- Info Tab List --*/
.pro-info-tab-list {
    border-bottom: 1px solid #ddd;
}
.pro-info-tab-list li {
    bottom: -1px;
    display: block;
    float: left;
    margin-right: 30px;
    position: relative;
    z-index: 2;
}
.pro-info-tab-list li a {
    border-bottom: 2px solid transparent;
    color: #282828;
    display: block;
    font-size: 18px;
    font-weight: 500;
    line-height: 14px;
    padding-bottom: 15px;
    text-transform: uppercase;
}
.pro-info-tab-list li.active a {
    border-bottom: 2px solid #000000;
}
/*-- Info Tab Content --*/
.pro-info-tab {
    padding-top: 20px;
}
.pro-info-tab p:last-child {
    margin: 0;
}
.pro-info-tab a {
    background-color: #282828;
    border: 0 none;
    color: #fff;
    display: inline-block;
    font-size: 13px;
    font-weight: 400;
    margin: 0;
    padding: 10px 15px;
    text-shadow: none;
    text-transform: uppercase;
}
.table-data-sheet {
    background: #fff none repeat scroll 0 0;
    border-bottom: 1px solid #ebebeb;
    margin: 0;
    width: 100%;
}
.table-data-sheet tr {
    border-top: 1px solid #ebebeb;
}
.table-data-sheet tr td {
    padding: 10px 20px 11px;
}
.table-data-sheet tr td:first-child {
    border-right: 1px solid #ebebeb;
    color: #333;
    font-weight: 700;
    width: 30%;
}
.table-data-sheet tr.even {
    background-color: #fdfdfd;
}