Div is hidden by decreasing the width of the browser

I am editing the styles of this website: link

The problem is that by decreasing the width of the browser the div called "site-top-bar-right" does not show its content, as shown in the following screenshot:

Any suggestions or help is welcome.

Html Code

 <header id="masthead" class="site-header site-header-one bg-left header-nosocial header-boxed-in">
        <div class="site-top-bar site-pad">
            <div class="site-container">

                <div class="site-top-bar-left">
                  <!--

                  <i class="fa fa-map-marker"></i>
                  -->
                    <a href="http://www.isha.net">Visit ISHA.net</a>
                </div>



                <div class="site-top-bar-right">



                    <i class="fa fa-envelope-o"></i>
                      <a href="mailto:%63%6fn&#116;&#097;c&#116;&#064;%69s%68%61%6d&#101;%65&#116;&#105;n%67%73%2e&#099;&#108;">[email protected]</a>

                  <!--

                          <i class="fa fa-phone"></i>
                      +569 0000 0000                                        -->

                    &nbsp;
                    &nbsp;

                    JOIN US IN SANTIAGO



                </div>
                <div class="clearboth"></div>
            </div>
        </div>
        <div class="header-bar site-pad">
            <div class="site-container">
                <div class="header-bar-inner">
                    <div class="site-branding">


                      <div class="logo_isha">
                        <a href="http://ishameetings.cl/"><img src="http://ishameetings.cl/wp-content/uploads/2017/01/logo.png"/></a>

CSS

  .site-header-one .site-top-bar-left {
      background-color: #D7565D !important;
  color: #ffffff;
  }

  .site-header-one .site-top-bar-right {
      background-color: #D7565D !important;
      color: #ffffff;
      float: right;

  }

  .site-header-one .site-top-bar {
      background-color: #D7565D !important;
  }

  .site-header .header-bar .site-container {
      margin-top: 0px !important;
  }