I don't often ask for help... but I've found myself in a bit of a bind. I'm trying to add a second menu onto a WordPress site and was able to register the location, and create a top menu using the wp_nav_menu function. Unfortunately this isn't responsive and if you view it on mobile or shrink the browser size it becomes jumbled instead of a drop down menu. The menu already used in the theme is responsive but when I use the code at the very top of the header it displays two menus. The website is tetononcology.com and here's the code I'm trying to use in the top menu bar (removing everything else up there). I really appreciate any help anyone can give.

Code:
			<?php
				// main menu
				echo '<div class="navigation-wrapper">';
				if( has_nav_menu('main_menu') ){
                    wp_nav_menu( array('container' => 'div', 'container_class' => 'menu-wrapper', 'container_id' => 'main-superfish-wrapper', 'menu_class'=> 'sf-menu headermenu',  'theme_location' => 'header-menu' ) );
                }
				echo '</div>'; // navigation-wrapper
				echo '<div class="clear"></div>';

				// responsive menu
				if( $gdl_is_responsive && has_nav_menu('main_menu') ){
                    dropdown_menu( array('dropdown_title' => '-- Main Menu --', 'indent_string' => '- ', 'indent_after' => '','container' => 'div', 'container_class' => 'responsive-menu-wrapper', 'theme_location'=>'header-menu') );
                }
			?>