<div id="myCarousel" class="carousel slide" data-ride="carousel">
    <!-- Indicators -->
    <ol class="carousel-indicators">
      <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
      <li data-target="#myCarousel" data-slide-to="1"></li>
      <li data-target="#myCarousel" data-slide-to="2"></li>
			 <li data-target="#myCarousel" data-slide-to="3"></li>
			 <li data-target="#myCarousel" data-slide-to="4"></li>
			 <li data-target="#myCarousel" data-slide-to="5"></li>
	    </ol>

    <!-- Wrapper for slides -->
    <div class="carousel-inner">
      <div class="item active">
         <a target="_blank" href="http://www.youtube.com/watch_popup?v=m8tTigD2DyQ"><img src="https://yyvxwa.bn1302.livefilestore.com/y4m_tEz3Mz3VbjXjNSSYb8Nd2f7iU1a_WHPVR5eliyJySPO8bM3hMK46Q2y8Kg_yZcG5XvL7nkKzxyvcRayz-_uZPYZSmvKFMERTnFSMbPeF4jCwn52apEPZtOkbeeunB6dnS8ew4YQJSjEpgKJLBWJPjXg4wqhb7yzMOifvkc2B5Lfgzl5e7PDkiJoUKsLb1LiHbCEn7YhEn8PGvUVMHiZsQ?width=5000&height=1667&cropmode=none" style="width:100%;"></a>
      </div>

      <div class="item">
        <a data-toggle="modal" data-target="#myModal"><img src="https://pj9uea.bn1302.livefilestore.com/y4mw7RzJ3ZUDyuRr7d_1EsvMjmJSs7lRa2UEdbwc_2DyoivhaSH54trvdedMVnLrknV2ZYJ2M1Edb-uoXrwauf70Q0RZpH6vSHPkGqiFiu_J4ZDDIPkmc51FJEM3y5RiSD7YYaT9XK40cfhpNsNDi9zG0XkDW_QbJcqI_Q10F55PjZtFRkH3kkGz7QTeJrdHnirJ0jN1N7J7i4uzBxNXUwyzQ?width=5000&height=1667&cropmode=none" style="width:100%;"></a>  <div class="carousel-caption">
        </div>
      </div>
    
      <div class="item">
        <img src="https://2bp6sg.bn1302.livefilestore.com/y4m_yw2eFj4Jm52sNGG8WuGHuFipwzsM-HbUEnbmadmENzd6B-QxjwA6ngbt2fhbPbrEJBsFnqkliX-Mx8IO9m7o0Pp1MhcF-LUYLO6zdsvP1nqoYuDm3woDuf68XEd_AZuBQTOTOvPeaQj4LotzL7PvybR0T3Rm_rSgZKzmCnAuvdnJvg9f2zSt42LuZMDHBok4dSufpUBboUxyewU7UxZTQ?width=5000&height=1667&cropmode=none" style="width:100%;">
      </div>
			
      <div class="item">
        <img src="https://d51jpa.bn1302.livefilestore.com/y4mf-AAQ4ocdTyBIFMQ3W3KRJkzUQcLV07SlJFvnpjfcRaGIuIVU36mZ9hjVqsphBf6XhXETEji775tnLMnHIiXN14wKCxeRfvqG_H5rHejnzZb2fdRZk13NzpjIJYOYH5DoznuyIUPCU6S50o0MH5IHAKbPfTSe1GUjse0covZxBUquLMU389zetGNaCh5_knQM3jA0XvTrRMMDbT8ZOoJPw?width=5000&height=1667&cropmode=none"  style="width:100%;">
      </div>
			
      <div class="item">
        <img src="https://pj9tea.bn1302.livefilestore.com/y4m-EIhpUwRYqWMfCW0z3ByElxPkmvwVtYiuRcnEs6I0hZI4472uVsDx_gf-PtrlxjmtP9qpWmZpA6WM_qxsTR2eUIGreyClz783j0ej_EJolgh2W5BU0ogjAhsmkjSdM6R4P96c97qmzW_HIiydYlqt17to54yCBqJpV0_hGo5XC3OFNID4rj9gUU99FAtIfPJmR3imHgpMwk9_k_Ht3I-xQ?width=5000&height=1667&cropmode=none" style="width:100%;">
      </div>
			
      <div class="item">
        <img src="https://d51kpa.bn1302.livefilestore.com/y4mZeWMd4kES6HIJxl97H7E1wOIzXlADrKNhvmMSOBMudYhZqrKkQa-oKrelEJAqElQcSJadO0kVw_23QDABnsCovVS6akTP2BRARozTWyVr4c3ejklY-YjftRXRnJOzJ5UrrkFzAtGpBl2N0ysB_DuKl5LXqCqZrpqsaLg1tA-osK9DJxjinRmhzneKcYWfw30Kkip86wMKqKiHyVXg3DTgw?width=5000&height=1667&cropmode=none"  style="width:100%;">
				        </div>
			
      
    </div>

    <!-- Left and right controls -->
    <a class="left carousel-control" href="#myCarousel" data-slide="prev">
      <span class="glyphicon glyphicon-chevron-left"></span>
      <span class="sr-only">Previous</span>
    </a>
    <a class="right carousel-control" href="#myCarousel" data-slide="next">
      <span class="glyphicon glyphicon-chevron-right"></span>
      <span class="sr-only">Next</span>
    </a>
  </div>


<!-- Modal -->
  <div class="modal fade" id="myModal" role="dialog">
    <div class="modal-dialog modal-lg">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title">GIVE THE GIFT THAT MATTERS SHOP <a target="_blank" class="gco" href="https://www.gabrielny.com/products/dkms-collection">GABRIEL & CO. <span class="x">X</span> COLLECTION</a> <br>AND SUPPORT <span class="x2">DKMS</span></h4>
        </div>
        <div class="modal-body"><img class="chains" src="https://dcikvq.bn1302.livefilestore.com/y4mYxDAKXVy--JVI5osZkd8yEqJdZTOqnnN4WxIFrTzu4vJhaEoTFUc4wnW2ePGjTTXvIuhlg7VG6vQ_rMsiKe4vrN9V4VpP8tp6ewnUj7wyzNaQ7BBUSP6e9ZwOMpUgsI8NonBpUywczMx02bOGYYP9KyPhpkuA4B3CR5LC_I6nhlK_KyNOBaw2LXz1u5L_WIBI4abGFkw7gaZH64mqmhywg?width=2554&height=1331&cropmode=none">
           <ol><li>SELECT YOUR ITEM</li><li>ADD TO CHART</li><li>ENTER "DKMS" IN FRIENDS & FAMILY CODE TO HELP DKMS RECEIVE 100% OF PROCEEDS TO SUPPORT OUR MISSION</li></ol>

        </div>
        <div class="modal-footer">
          <a href="https://www.gabrielny.com/products/dkms-collection" target="_blank"><button type="button" class="btn btn-default" >Shop</button></a>
        </div>
      </div>
    </div>
  </div>
</div>

<!-- Modal Youtube 
  <div class="modal fade " id="myModal2" role="dialog">
    <div class="modal-dialog modal-lg">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title">DKMS | This is Why I Give </h4>
        </div>
        <div class="modal-body"><center><iframe width="60%" height="250" src="https://www.youtube.com/embed/m8tTigD2DyQ" frameborder="0" gesture="media" allow="encrypted-media" allowfullscreen></iframe></center>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        </div>
      </div>
    </div>
  </div>
</div>-->


.carousel-control.left{background-image:none !important;}
.carousel-control.right{background-image:none !important;}
.glyphicon-chevron-left:before{color:#e2001a !important;}
.glyphicon-chevron-right:before{color:#e2001a !important;}
.carousel-indicators li {border-color:red !important;}
.carousel-indicators .active {background-color:#e2001a !important;}
.modal-title{font-family: "Gotham Rounded SSm A", "Gotham Rounded SSm B" !important;font-weight:bold !important;}
.modal-body{font-family: "Gotham Rounded SSm A", "Gotham Rounded SSm B" !important;font-weight:bold !important;}
.x{color:#fa451c !important;font-size:1.5em;font-family: 'Permanent Marker', cursive !important;}
.x2{color:#e2001a !important;font-size:1.2em;font-family: "Gotham Rounded SSm A", "Gotham Rounded SSm B" !important;}
.chains{width:30%;height:auto;float:left;margin-right:10px;}
.gco{color:#fa451c !important;}

External CSS

  1. https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css
  2. https://fonts.googleapis.com/css?family=Permanent+Marker
  3. https://cloud.typography.com/7721216/7655392/css/fonts.css

External JavaScript

  1. https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js
  2. https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js