Bar Above Slider Sizing Issue

Hello,

I am currently in the process of (heavily) customising the Customizr theme. I have a slight issue, in that the bar above the slide is slightly too long on the right side, meaning it looks odd. You can view it here; russinternational.backpackerspassport.com 🙂

Any advice on how to fix this would be greatly appreciated. I have used a reasonable amount of custom CSS, which I have posted below, as the issue may well be to do with something there 🙁

/* Adjust Menu (red) text color, (Garamond) font-family, (1.5em) font-size  */
.navbar .nav > li > a, .navbar .nav > li > a:first-letter,
.navbar .nav > li.current-menu-item > a,
.navbar .nav > li.current-menu-ancestor > a {
display:        inline;
color:          #7b0000;
font-family:    century gothic;
font-size:      2em;
padding:        10px 10px;
font-weight: bold;
}

/*  Reposition Navbar Box - change top/left as needed */
.navbar.notresp .navbar-inner {
position:       relative;
top:            0px;            /* Adjust using -1px move Up, 1px move Down, 0px No change  */
left:           0%;             /* Adjust using -1% move Left, 1% move Right, 0% No change  */
}

/* Set the color (red) of the body, wrapper, header & footer */
body, #main-wrapper, header.tc-header, footer#footer .colophon {
background-color: lightgrey;
margin-top:     0px;
margin-bottom:  0px;
padding:        10px 10px;
}

.round-div {
display: block;
-webkit-transition: all .3s ease;
-moz-transition: all .3s ease;
-o-transition: all .3s ease;
transition: all .3s ease;
position: absolute;
width: 170px;
height: 170px;
z-index: 99;
-webkit-border-radius: 60px;
-moz-border-radius: 500px;
border-radius: 900px;
border: 104px solid lightgrey;
border-image: none;
top: -66px;
left: -54px;
}

/*  Adjust Navbar Box settings      */
 .tc-header, .navbar.notresp .navbar-inner  {
background-color:   #7b0000;                                       /* Change red */
background-image: linear-gradient(to bottom, lightgrey, lightgrey);      /* Change white, pink */
background-image: -webkit-linear-gradient (top, white, pink);   /* Change white, pink */
background-repeat: repeat-x;
border:           -1px solid pink;                               /* Change pink */
border-radius:    4px 4px 4px 4px;
box-shadow:       0 px 0px rgba(0, 0, 0, 0.067);
min-height:       40px;
padding-left:     20px;
padding-right:    20px;
}

/* Remove all Navbar Box colours and shading (Credit: @ElectricFeet) */
.navbar,
.navbar .navbar-inner,
.navbar .nav {
    webkit-box-shadow:  none;
    -moz-box-shadow:    none;
    box-shadow:         none;
    filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
}

/* Adjust Menu colors - Hover */
.navbar .nav > li > a:hover, .navbar .nav > li > a:hover:first-letter {
color:          #7b0000;
text-shadow:    none;
}

/* Adjust Menu colors - Normal */
.navbar .nav > li > a, .navbar .nav > li > a:first-letter {
color:          #2a2a2a;
text-shadow:    none;
}

/* Adjust colors as needed */
.footer-widgets {
background:     none repeat scroll 0 0 #2a2a2a;
color:          #5a5a5a !important;
padding-top:    10px ;
}

footer#footer {
color: #fafafa!important;
border-top: 10px solid #7b0000;
background: #2a2a2a;
padding: 0;
}

/*Header Bar */
header.tc-header {
border-bottom:  10px solid #7b0000;
}

/* Make Carousel fade - adapt 5s to required delay */
.carousel-inner > .item {
-webkit-transition: opacity 5s ease-in-out ;
transition:         opacity 5s ease-in-out ;
}
.carousel-inner > .next.left,
.carousel-inner > .prev.right {
opacity:        1;
z-index:        1;
left:           0;
}
.carousel-inner > .active.left {
opacity:        0;
z-index:        2;
left:           0;
}
.carousel-inner > .active.right {
opacity:        0;
z-index:        2;
left:           0;
}

/* remove previous/next arrows from home page only */
.home .carousel-control {
display:        none ;
}

/* Change Background, Border, Font/Color as needed  */
footer#footer .colophon {
background:     none repeat scroll 0 0 #7b0000;
border-top:     12px solid #7b0000;
color:          #7b0000;
padding:        0;
}

/* Change Featured Pages Button color  */
.btn.btn-primary.fp-button {
  color: white;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  background-color: #7b0000;
  background-image: -moz-linear-gradient(top, #2a2a2a, #2a2a2a);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#7b0000), to(#7b0000));
  background-image: -webkit-linear-gradient(top, #7b0000, #7b0000);
  background-image: -o-linear-gradient(top, #7b0000, #7b0000);
  background-image: linear-gradient(to bottom, #7b0000, #7b0000);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000' , endColorstr='#000000' , GradientType=0);
  border-color: #000000 #00000 #000000;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  *background-color: #7b0000;
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
}
.btn.btn-primary.fp-button:hover,
.btn.btn-primary.fp-button:focus,
.btn.btn-primary.fp-button:active,
.btn.btn-primary.fp-button.active,
.btn.btn-primary.fp-button.disabled,
.btn.btn-primary.fp-button[disabled] {
  color: white;
  background-color: #7B0000;
  *background-color: #7b0000;
}
.btn.btn-primary.fp-button:active,
.btn.btn-primary.fp-button.active {
  background-color: #b04d07 9;
}
.btn.btn-primary.fp-button:hover,
.btn.btn-primary.fp-button:focus,
.btn.btn-primary.fp-button:active,
.btn.btn-primary.fp-button.active,
.btn.btn-primary.fp-button.disabled,
.btn.btn-primary.fp-button[disabled] {
  color: white;
  background-color: #2a2a2a;
  *background-color: #7b0000;
}
.btn.btn-primary.fp-button:active,
.btn.btn-primary.fp-button.active {
  background-color: #b04d07 9;
}

I do have a few other issues that I am trying to resolve, but that is the main one for now..

Any help is greatly appreciated! Cheers.