﻿.navbar-header img{
    margin-top:5px;
}
.bg-overlay {
      opacity: 0.4;
      left:0;
}
    .logoPayportSmallMenu{
        display:none;
    }

    .logoPayport{
        position:relative;
        display:inline-block;
        padding-top:0.5em;
        left:-1.5em;
    }
        .logoPayport img, .logoPayportSmallMenu img{
            max-width:15em;
        }

.adjustedImages img{
    max-width:200px !important;
    height:auto !important;
}


.backgroundTrack{
    position:relative;
    background-color:white;
    border:1px solid #dddddd;
    left:25%;
    width:50%;
    min-width:30em;
    padding:2em;
    min-height:12em;
    margin-bottom:10em;
        box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-shadow: 5px 5px 12px 0px #e5e5e5;
}
 .urgentNewsAndLoginForPhoneContainer{
    display:none;

}
.enterParcelId{
    position:relative !important;
    top:30% !important;
    margin:0 auto;
    width:15.1em;

}

.waitingAjax{
    position:absolute;
    top:45%;
    left:45%;
    font-size:150%;
}

.inputConsignmentId{
     width:100%;
    padding:0.5em;
    padding-top:0.7em;
    border:1px solid #cccccc;
    border-top-left-radius:0.5em;
    border-top-right-radius:0.5em;
    border-bottom:0px;
    background-color:#f4fdff;
    font-size:180%;
    font-family: "courier";
    font-weight:800;
    
}


.inputConsignmentId:focus{
    outline: none;

    border:1px solid #3bafda !important;
    border-top-left-radius:0.5em;
    border-top-right-radius:0.5em;
    border-bottom:0px;
    background-color:#ffffff;
    color:#08173e;

}

.inputConsignmentId::-webkit-input-placeholder { color:#bbb; font-size:50%; font-family:Arial; font-weight:200; text-align:center;}
.inputConsignmentId::-moz-placeholder { color:#bbb; font-size:50%; font-family:Arial; font-weight:200; text-align:center;}
.inputConsignmentId:-ms-input-placeholder { color:#bbb; font-size:50%; font-family:Arial; font-weight:200; text-align:center;}
.inputConsignmentId input:-moz-placeholder { color:#bbb; font-size:50%; font-family:Arial; font-weight:200; text-align:center;}
.inputConsignmentId:focus::-webkit-input-placeholder { color:#fff;}

#noGoodFormat{
    color:red;
    font-size:75%;
    text-align:center;
    margin-top:1em;
}

.bValidTracking{
    display:block;
    width:100%;
    border-radius:0;
    border-bottom-left-radius:0.5em;
    border-bottom-right-radius:0.5em;
}

.trackingDetails{
    position:relative;
    margin:0 auto;
    text-align:center;
    padding-bottom:3em;

}

.trackingDetails #mainStatus{
    display:inline-block;
    padding:0.5em;
    margin-bottom:0.5em;
    min-width:12em;
    background-color:#75c04c;
    color:white;
    font-weight:900;
    border-radius:1.5em;


}

.trackingDetails #drawingStatus {
    position:relative;
    display: block;
    margin-top: 1em;
    margin-bottom: 0em;
    min-width: 12em;
    height: 6em;
    background-image: url('../images/deliveryState_0.jpg');
    background-size:100% auto;
    background-repeat:no-repeat;
}


.bValidTracking:focus{
    outline: none;
}

#mainStatusReport{
    text-align:justify;
    border:1px solid #3bafda;
    border-radius:0.5em;
    border-top-left-radius:0em;
    padding:1.5em;
    padding-top:0.7em;
    padding-bottom:0.7em;
    color:#058fc2;
    font-weight:900;
    margin-bottom:1em;

}

.allTheStatus{
    margin-left:-1em;
    text-align:left;
}

#consignmentStatusAbstract{
    display:inline-block;
    border:1px solid #0076a2;
    margin:1em;
    border-bottom-left-radius:0.5em;
    border-bottom-right-radius:0.5em;
    border-top-right-radius:0.7em;

    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;

}

.trackExplaination{
    text-align:center;
    margin:2em;
    color:#aaaaaa;
}

#consignmentStatusAbstract .timeOfStatus{
    position:relative;
    display:block;
    background-color:#0076a2;
    color:white;
    text-align:left;
    padding-left:0.6em;
    font-weight:900;
    border-top-right-radius:0.5em;

}

#consignmentStatusAbstract .timeAgo{
    position:relative;
    display:inline;
    color:white;
    text-align:right;
    font-weight:400;
    float:right;
    padding-right:1em;
    padding-left:2em;

}

#textOfStatus{
    padding:0.6em;
    padding-left:1.5em;
    padding-right:1.5em;
    font-weight:800;
}

.bBackToTrack{
    display:inline-block;
    position:relative;
    margin:1em;
}

.infosProviders{
    display:inline-block;
    background-color:#fafafa;
    border:1px solid #efefef;
    border-radius:0.5em;
    padding:0.5em;
    max-width:49%;
    min-width:17em;
    margin:0.5em;
    font-size:90%;
    line-height:140%;
        box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-shadow: 5px 5px 12px 0px #e5e5e5;
}
.logoProvider img{
    margin:0.5em;
    max-height:4em;
}

#percentageDone{
    position:absolute;
    bottom:0em;
    height:1.5em;
    width:20%;
    color:#3bafda;
    font-weight:900;
    text-align:right;
    
}

.buttonLinksContainer{
    position:relative;
    display:inline-block;
    float:right;
    width:20em !important;
    background-color:red;
}

.bFreightLogin, .bUrgentNewsLandPage{
    position:relative;
    display:inline-block;
    color:#3bafda;
    border-radius:1em;
    background-color:#fafafa;
    border:1px groove #3bafda !important;
    padding:0.2em 1em 0.2em 0.8em !important;
    transition:0.3s;
    cursor:pointer;
}

.bFreightLogin:hover, .bUrgentNewsLandPage:hover{
    color:#fafafa;
    background-color:#8ad2ed;
    
}

.top_socials{
    position:absolute !important;
    right:1em !important;

}
.top_socials li{
   vertical-align:middle;

}

.youtubeVideo{
    text-align:center;
}
    .youtubeVideo iframe{
        border:2px solid #dddddd;
    }
    
@media only screen and (max-width: 1200px) {
    .containerBase{
        width:100%;
    }
   .logoPayport{
        position:absolute;
        left:0.5em;
        padding-top:0.5em;
    }
        .logoPayport img{
            max-width:13.2em;
        }

}
@media only screen and (max-width: 1010px) {
    .activemenu{
        padding-top:1em;
    }
    .logoPayport{
        position:absolute;
        left:0.5em;
        padding-top:0em;
        top:0.23em;
    }

}
@media only screen and (max-width: 900px) {
    .backgroundTrack{
        left:15%;
        width:70%;
    }

    .activemenu li a{
        padding-left:0.55em;
        padding-right:0.55em;
    }
}

@media only screen and (max-width: 767px) {
    .parallax .container{
        margin-top:5em;
    }
    .urgentNewsAndLoginForPhoneContainer{
        position:absolute;
        display:block !important;
        top:7em;
        width:100%;
        height:2em;
        text-align:center;
        z-index:2;
    }
        .urgentNewsAndLoginForPhoneContainer div{
            font-size:120%;
            border:1px solid rgba(0,0,0,0)!important;
            padding:0.5em 2em !important;
            border-radius:5em;
            margin:0.7em;
        }
            .urgentNewsAndLoginForPhoneContainer div:hover{
                border-color:#3bafda;
            }
    .logoPayport{
        display:none;
    }
    .logoPayportSmallMenu{
        position:absolute;
        display:block;
        top:1.4em;


    }

}

@media only screen and (max-width: 615px) {
    #percentageDone{
        bottom:-1em;
    
    }
    .trackingDetails #drawingStatus {
        margin-bottom:1em;
    }
}
@media only screen and (max-width: 600px) {
    .backgroundTrack{
        left:5%;
        width:90%;
        min-width:20em;
    }
    #percentageDone{
        bottom:-1.5em;
    
    }
    .trackingDetails #drawingStatus {
        position:relative;
        display: block;
        margin-top: 1em;
        margin-bottom: 1.5em !important;
        min-width: 12em;
        height: 6em;
        background-image: url('../images/deliveryStateSP_5.jpg');
        background-size:100% auto;
        background-repeat:no-repeat;
    }
        .youtubeVideo iframe{
            width:100%;
        }

}

@media only screen and (max-width: 470px) {
    #percentageDone{
        bottom:0em;
    
    }
    .enterParcelId{
        left:8%;
    }
}

@media only screen and (max-width: 430px) {

        .urgentNewsAndLoginForPhoneContainer div{
            font-size:110%;
            padding:0.5em 2em !important;
            margin:0.2em 0em;
        }
}

@media only screen and (max-width: 340px) {

        .urgentNewsAndLoginForPhoneContainer div{
            font-size:93%;
        }
}
