.mytopnav-center {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
}

/* Add a black background color to the top navigation */
.mytopnav {
    background-color: rgb(195,242,96);
    overflow: hidden;
}

    /* Style the links inside the navigation bar */
    .mytopnav a {
        float: left;
        display: block;
        color: #000000;
        text-align: center;
        padding: 4px 8px;
        text-decoration: none;
        font-size: 16px;
        font-weight: bold;
    }

    /* Hide the link that should open and close the topnav on small screens */
    .mytopnav .icon {
        display: none;
    }

/* Dropdown container - needed to position the dropdown content */
.mydropdown {
    float: left;
    overflow: hidden;
}

    /* Style the dropdown button to fit inside the topnav */
    .mydropdown .mydropbtn {
        font-size: 16px;
        font-weight: bold;
        border: none;
        outline: none;
        color: #000000;
        padding: 4px 12px;
        background-color: rgb(195,242,96);
        font-family: inherit;
        margin: 0;
    }

/* Style the dropdown content (hidden by default) */
.mydropdown-content {
    display: none;
    position: absolute;
    background-color: rgb(239,255,208);
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

    /* Style the links inside the dropdown */
    .mydropdown-content a {
        float: none;
        color: black;
        padding: 12px 12px;
        text-decoration: none;
        display: block;
        text-align: left;
    }

/* Add a dark background on topnav links and the dropdown button on hover */
.mytopnav a:hover, .dropdown:hover .mydropbtn {
    background-color: rgb(179,222,88);
    color: #000000;
}

.mydropbtn:hover {
    background-color: rgb(179,222,88);
}

/* Add a grey background to dropdown links on hover */
.mydropdown-content a:hover {
    background-color: rgb(179,222,88);
    color: #000000;
}

.footer-img {
    display: none;
}


@media screen and (min-width: 1200px) {
    /* Show the dropdown menu when the user moves the mouse over the dropdown button */
	
    /*.mydropdown:hover .mydropdown-content {
	   display: block;
	} */
	.mydropdown ul {
	    list-style-type: none;
		margin: 0;
        padding: 0;
		position:absolute;
		width: 250px;
	}
		
	.mydropdown ul ul {
		left:250px;
		margin: 0;
        padding: 0;
		top: 0px;
		background-color: rgb(239,255,208);
	}
	
	.mydropdown li {
		position:relative;
	}
	
	.mydropdown li:hover ul ul,
	.mydropdown li:hover li:hover ul ul{
        display: none;
    }
	
	.mydropdown:hover ul ul {
        display: none;
    }
	
    .mydropdown:hover ul {
        display: block;
    }
	
	.mydropdown li:hover ul, 
	.mydropdown li:hover li:hover ul { 
	    display: block;
	}
	
	
	
	/*.mydropdown:hover ul ul {
        display: none;
    }*/
}

@media screen and (max-width: 820px) {
    .footer-img {
        display: inline;
    }
}

@media screen and (max-width: 1200px) {
    .mytopnav-center {
        display: inherit;
        display: inherit;
        -ms-flex-pack: inherit;
        justify-content: inherit;
    }

    .mytopnav a:not(.active), .mydropdown .mydropbtn:not(.active) {
        display: none;
    }

    .mytopnav a.icon {
        float: right;
        display: block;
    }

    .mytopnav a {
        padding: 12px 12px;
    }

    .mydropdown .mydropbtn {
        padding: 12px 12px;
    }

    .mytopnav.responsive {
        position: relative;
    }

        .mytopnav.responsive a.icon {
            position: absolute;
            right: 0;
            top: 0;
        }

        .mytopnav.responsive a {
            float: none;
            display: block;
            text-align: left;
        }

        .mytopnav.responsive .mydropdown {
            float: none;
        }

        .mytopnav.responsive .mydropdown-content {
            position: relative;
        }

        .mytopnav.responsive .mydropdown .mydropbtn {
            display: block;
            width: 100%;
            text-align: left;
        }

    .mydropdown.toggle .mydropdown-content.toggle {
        display: block;
    }
	
	.mydropdown ul {
	    list-style-type: none;
	}
	
	/*
	.mydropdown.toggle .mydropdown-content.toggle ul {
        display: none;
    } */
	
	
	
}