#interactive-map {
		width: 1100px;
		margin: auto;
	}

	.int-box-outter {
		height: 675px;
		position: relative;
		display: inline-block;
	} 

	.int-box  {
		width: 1150px;
		height: 650px;
		background-repeat: no-repeat;
		z-index: -1;
		position: absolute;
		display: inline-block;
		-webkit-box-shadow: 1px 1px 15px -4px rgba(0,0,0,0.50); 
        box-shadow: 1px 1px 15px -4px rgba(0,0,0,0.50);
	}

	.def  {
		width: 1150px;
		height: 60px;
		z-index: 8;
		position: absolute;
		display: inline-block;
		top: 565px;
		left: 0;
		padding: 5px 10px;
		background-color: #FFFFFF; opacity:0.7 /* !important */ ;
		z-index: 9;
		transition: all .7s linear;
		-webkit-box-shadow: 1px 1px 15px -4px rgba(0,0,0,0.50); 
        box-shadow: 1px 1px 15px -4px rgba(0,0,0,0.50);
	}

	.countries  {
		width: 1150px;
		height: 30px;
		z-index: 8;
		position: absolute;
		display: inline-block;
		top: 65px;
		left: 0;
		padding: 5px 10px;
		background-color: #FFFFFF; opacity:0.7 /* !important */ ;
		z-index: 9;
		transition: all .7s linear;
		-webkit-box-shadow: 1px 1px 15px -4px rgba(0,0,0,0.50); 
        box-shadow: 1px 1px 15px -4px rgba(0,0,0,0.50);
	}

	.countries  p{
		text-align: center;
	}

	#training-countries  {
		opacity: 0;
	}

	#conferences-countries  {
		opacity: 0;
	}

	#students-countries  {
		opacity: 0;
	}

	#bank-countries  {
		opacity: 0;
	}

	#trade-countries  {
		opacity: 0;
	}

	.int-background  {
		background-image: url("https://www.awwa.org/Portals/0/AWWA/Executive/International/Images/map/background.svg") ;
		z-index: -1;
	}

	.bank  {
		background-image: url("https://www.awwa.org/Portals/0/AWWA/Executive/International/Images/map/bank.svg") ;
		z-index: 1;
		transition:all .7s linear;
	}

	#bank {
		opacity: 0; 		
	}

	.conferences  {
		background-image: url("https://www.awwa.org/Portals/0/AWWA/Executive/International/Images/map/conferences.svg") ;
		z-index: 2;
		transition:all .7s linear;
	}

	#conferences {
		opacity: 0; 
	}

	.students  {
		background-image: url("https://www.awwa.org/Portals/0/AWWA/Executive/International/Images/map/students.svg") ;
		z-index: 3;
		transition:all .7s linear;
	}

	#students {
		opacity: 0; 
	}

	.trade  {
		background-image: url("https://www.awwa.org/Portals/0/AWWA/Executive/International/Images/map/trade.svg") ;
		z-index: 4;
		transition:all .7s linear;
	}

	#trade {
		opacity: 0; 
	}

	.training  {
		background-image: url("https://www.awwa.org/Portals/0/AWWA/Executive/International/Images/map/training.svg") ;
		z-index: 5;
		transition:all .7s linear;
	}

	#training {
	  	opacity: 0; 
	}

	#training-def, #students-def, #conferences-def, #trade-def, #bank-def {
		opacity: 0; 	
	}

	#training-def p{
		opacity: 1;
		transition:all .7s linear;
	}

	#students-def p{
		opacity: 1;
		transition:all .7s linear;
	}

	#conferences-def p{
		opacity: 1;
		transition:all .7s linear;
	}

	#trade-def p{
		opacity: 1;
		transition:all .7s linear;
	}

	.training-button-int:focus ~ #training-countries  { opacity: .9; }
	.training-button-int:focus ~ #training-def  { opacity: .9; }
	.training-button-int:focus ~ #training { opacity: 1; }
	.training-button-int:focus ~ #training-def  { opacity: .9; }
	.training-button-int:focus {background-color:  #0a74ba;}
	.training-button-int:hover {box-shadow: 2px 1px 5px 0px rgba(122,122,122,0.9);
-webkit-box-shadow: 2px 1px 5px 0px rgba(122,122,122,0.9);
-moz-box-shadow: 2px 1px 5px 0px rgba(122,122,122,0.9); }
	.bank-button-int:focus ~ #bank-countries { opacity: .9; }
	.bank-button-int:focus ~ #bank-def { opacity: .9; }
	.bank-button-int:focus ~ #bank { opacity: 1; }
	.bank-button-int:focus { background-color:  #6e2313; }
	.bank-button-int:hover {box-shadow: 2px 1px 5px 0px rgba(122,122,122,0.9);
-webkit-box-shadow: 2px 1px 5px 0px rgba(122,122,122,0.9);
-moz-box-shadow: 2px 1px 5px 0px rgba(122,122,122,0.9); }
	.conference-button-int:focus ~ #conferences-countries { opacity: .9; }
	.conference-button-int:focus ~ #conferences-def { opacity: .9; }
	.conference-button-int:focus ~ #conferences { opacity: 1; }
	.conference-button-int:focus {background-color: #574097;}
	.conference-button-int:hover {box-shadow: 2px 1px 5px 0px rgba(122,122,122,0.9);
-webkit-box-shadow: 2px 1px 5px 0px rgba(122,122,122,0.9);
-moz-box-shadow: 2px 1px 5px 0px rgba(122,122,122,0.9); }
	.students-button-int:focus ~ #students-countries { opacity: .9; }
	.students-button-int:focus ~ #students-def { opacity: .9; }
	.students-button-int:focus ~ #students { opacity: 1; }
	.students-button-int:focus {background-color: #0f8657;}
	.students-button-int:hover {box-shadow: 2px 1px 5px 0px rgba(122,122,122,0.9);
-webkit-box-shadow: 2px 1px 5px 0px rgba(122,122,122,0.9);
-moz-box-shadow: 2px 1px 5px 0px rgba(122,122,122,0.9); }
	.trade-button-int:focus ~ #trade-countries { opacity: .9; }
	.trade-button-int:focus ~ #trade-def { opacity: .9; }
	.trade-button-int:focus ~ #trade { opacity: 1; }
	.trade-button-int:focus {background-color: #007a8d;}
	.trade-button-int:hover {box-shadow: 2px 1px 5px 0px rgba(122,122,122,0.9);
-webkit-box-shadow: 2px 1px 5px 0px rgba(122,122,122,0.9);
-moz-box-shadow: 2px 1px 5px 0px rgba(122,122,122,0.9); }
	
	.button-int {
		z-index: 8;
		position: absolute;
		top: 25px;
		width: 194px;
		text-align: center;
		transition:all 0.5s linear;
		cursor: pointer;
		height: 30px;
		padding-top: 5px;
		text-decoration: none !important;
		font-weight: 800;
	}

	a.button-int:focus {
  		color: #FFFFFF; 
	}

	.training-button-int {
		left: 78px;
		color:  #0a74ba;
		border:  1px solid #0a74ba;
	}
	
	a.training-button-int:hover {
		color:#0a74ba !important;
	}
	a.training-button-int:hover:focus {
		color:#FFFFFF !important;
	}
	.conference-button-int {
		left: 277px;
		color:#574097;
		border:  1px solid #574097;
	}
	a.conference-button-int:hover {
		color:#574097 !important;
	}
	a.conference-button-int:hover:focus {
		color: #FFFFFF !important;
	}
	.students-button-int {
		left: 477px;
		color: #0f8657;
		border:  1px solid #0f8657;
	}
	a.students-button-int:hover {
		color:#0f8657 !important;
	}
	a.students-button-int:hover:focus {
		color: #FFFFFF !important;
	}
	.bank-button-int {
		left: 677px;
		color:  #6e2313; 
		border:  1px solid #6e2313;
	}
	a.bank-button-int:hover {
		color: #6e2313 !important;
	}
	a.bank-button-int:hover:focus {
		color: #FFFFFF !important;
	}
	.trade-button-int {
		left: 877px;
		color: #007a8d; 
		border:  1px solid #007a8d;
	}
	a.trade-button-int:hover: {
		color: #bfa39d !important;
	}
	a.trade-button-int:hover:focus {
		color: #FFFFFF !important;
	}
	.button-int-background {
		height: 40px;
		background-color: #FFFFFF;
		z-index: 6;
		position: absolute;
		top: 20px;
		width: 1150px;
		opacity: .9;
		-webkit-box-shadow: 1px 1px 15px -4px rgba(0,0,0,0.50); 
        box-shadow: 1px 1px 15px -4px rgba(0,0,0,0.50);
        z-index: 7;
	}

/*side side layout */

	.nh-container-color, .nh-container-dropshaddow {
		width: 100%;
		position:relative;
	}

	.nh-container-color {
		background: linear-gradient(3deg, rgba(238,238,238,1) 0%, rgba(250,250,250,1) 100%); 
	}

	.nh-container-color:after {
		content:"";
	    position:absolute;
	    z-index:-1;
	    -webkit-box-shadow:0 0 15px rgba(0,0,0,0.2);
	    box-shadow:0 0 10px rgba(0,0,0,0.2);
	    bottom:0px;
	    left:10%;
	    right:5%;
	    width:90%;
	    height:10%;
	    -moz-border-radius:100%;
	    border-radius:100%;
	}
	.nh-container-color:before {
		content:"";
	    position:absolute;
	    z-index:-1;
	    -webkit-box-shadow:0 0 15px rgba(0,0,0,0.2);
	    box-shadow:0 0 10px rgba(0,0,0,0.2);
	    top:0px;
	    left:10%;
	    right:5%;
	    width:90%;
	    height:10%;
	    -moz-border-radius:100%;
	    border-radius:100%;
	}
	.nh-container {
		max-width: 1150px;
		margin: auto;
		font-family: Roboto;
	}
	.nh-photo-left, .nh-photo-right  {
		width: 46%;
		margin: 2% 2% 0% 2%;
	}

	.nh-photo-left img, .nh-photo-right img  {
		width: 100%;
	}

	.nh-photo-left {
		float: left;
	}
	.nh-photo-right {
		float: right;
	}
	.nh-photo-left p, .nh-photo-right p {
		font-style: italic;
		font-size:  12px;
	}
	.nh-text-full {
		margin: 2%;
		padding-top: 15px;
		float: left;
	}
	.nh-text-left, .nh-text-right{
		width: 46%;
		margin: 2%;
		padding-top: 15px;
	}
	.nh-text-left {
		float: left;
	}
	.nh-text-right {
		float: right;
	}
	.nh-clear {
		clear: both;
	}
	.nh-photo-left img, .nh-photo-right img {
		box-shadow: 2px 2px 5px 0px rgba(0,0,0,.2);
		-webkit-box-shadow: 2px 2px 5px 0px rgba(0,0,0,.2);
		-moz-box-shadow: 2px 2px 5px 0px rgba(0,0,0,.2);
	}
	.nh-4 {
		width: 25%;
	 	float: left;
	 	padding: 0% 1.5%;
	 	border-left:  1px solid #EEEEEE;
	}
	.nh-4 p {
	}
	.nh-4 h5 {
		text-align: center;
	}
	.nh-icon {
		margin: auto;
		text-align: center;
		width: 80px;
		padding-bottom: 20px;
	}
	.nh-icon img{
		width: 100%;
	}
	.nh-clear-mobile {
		clear: none;
	}

/* logos */

	.int-outside-box {
		width: 100%;
	}
	.int-wrapper{
		width: 24.5%;
		border: 1px solid #EEEEEE;
		height: 150px;
		float: left;
	  	box-shadow: rgba(17, 17, 26, 0.05) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 0px 8px;
	  	margin: .25%;
	  	background-color: #FFFFFF;
	}
	.int-wrapper:hover {
	  	box-shadow: rgba(17, 17, 26, 0.05) 0px 1px 0px, rgba(17, 17, 26, 0.3) 0px 0px 8px;
	}
	.int-wrapper-wrapper {
		width: 90%;
		margin: auto;
	}
	.int-logo {
		height: 125px;
		display: flex;
	}
	.int-logo img {
		align-self: center;
  		margin: 0 auto;
  		max-height: 90%;
  		max-width: 100%;
	}
	.int-copy {
		height: 25px;
		text-align: center;
		font-size: 14px;
	}

	.int-mobile-show {
	display: none;
	width: 100%;
	margin: auto;
}

.int-mobile-hide{
	display:block;
}

.int-margin-top {
	margin-top: 30px;
}

.int-margin-top-90{
	margin-top: 50px;
}





@media screen and (max-width: 1200px) {

	.int-mobile-show {
		display:block;
	}

	.int-mobile-hide{
		display:none;
	}

	.int-margin-top {
		margin-top: 10px;
	}

	.int-margin-top-90 {
		margin-top: 10px;
	}

		.int-wrapper{
			width: 32.7% !important;
		}


}

@media screen and (max-width: 1000px) {

	.nh-photo-left, .nh-photo-right,  .nh-text-left,  .nh-text-right  {
	    width: 90%;
	    margin: 5% 5% 0% 5%;
	  }

	.nh-4 {
	 	width: 45%;
	 	margin: 2% 2% 0% 2%;
	 }

	  .nh-clear-mobile {
	 	clear: both;
	 }

	 .nh-container p {
    	line-height: 25px !important;
	}


	.int-wrapper{
			width: 48% !important;
		}



}