submenu expands on small screens (toggled-on)

Hi all,

I’m struggling with a strange problem. My sub-menus expand (showing all the sub and sub sub items) when displayed in toggled-on state on small screens. I’m using the accessible one-two theme as a child of the 2012 theme. And I’ve been tweaking a little (moving the menu to the left for example.)
I’ve tracked down the problem to this bit of css code:

.main-navigation ul.nav-menu.toggled-on, .menu-toggle {
    display: inline-block;
}

I’ve had to turn that on to get the toggle function to work. If I don’t display, the toggle doesn’t work and no menu is displayed.

This peace of code, the display of the sub menus: <ul class=”sub-menu”> is not active (display: none) on the normal view. I’m looking for a way to target the submenu in the toggle-on state. I’ve come this far:

.main-navigation ul.nav-menu.toggled-on sub-menu{
	display:none;
}

But this has no effect.

I hope someone can help me and point me in the right direction. This is the website: http://annemariemaes.net/

Thanks very much in advance, danielle