/* ================================= 
  Base Element Styles
==================================== */

@import url('https://fonts.googleapis.com/css?family=Open+Sans');

* {
	box-sizing: border-box;
}

body {
	width: 100%; 
	background-color: #343434; 
	font-family:  "Open Sans", Times, serif;
	color: white;
	line-height: 1.6;
	margin: 0;
	font-size: 1.1em;
}

ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

p {
	font-size: .95em;
}
h2,
h3,

}
h2,
h3 {
	margin-top: 0;
}
a {
	text-decoration: none;
	color:red;
}
img {
	max-width: 100%;
}

/* ================================= 
  Base Layout Styles
==================================== */

/* ---- Navigation ---- */

.name {
	font-size: 1.35em;
	margin: 0;
	margin-top: 10px;
}
.main-nav,
.secondary-nav {
	margin-top: 5px;
	margin-left: 1.3em;
}

#navigation a {
padding: 5px 10px;
}

#claim a {
	color: grey;
}

.name a,
.main-nav a,
.secondary-nav a
 {
	text-align: center;
	display: block;
	padding: 5px 15px;
	margin-right: 2em;
}

.btn {
        color:#ffffff;
        background:transparent;
        border:1px solid #ffffff;
        border-radius:2px; 
        
}

.btn:hover {
        color:#fff;
        background-color:#1D1C1C; 
        border: 1px solid #fff;
}

.active {
        color:#fff;
        background-color:#1D1C1C; 
        border:1px solid #fff;
        border-radius:2px; 
}

.page-heading {
		text-align: center;
		text-decoration: underline;
		text-transform: uppercase;
		margin-top: .5em;
}

/* ---- Layout Containers ---- */

.main-header {
	padding-top: .5em;
	padding-bottom: .5em;
}

.banner {
	margin: 0 auto;
 	margin-top: 20px; 
  	margin-bottom: 20px;

}
.col {
	padding-right: 1em;
	padding-left: 1em;
}

.main-footer {
	background: #343434;
	padding: .03em 0;
	margin-top: 30px;
	text-align: right;
	font-size: .8rem;
}

.advisory-board,
.execuritves,
.islamic,
.trade-and-finance,
.treaty,
.facultative {
margin-top: 3em;
margin-bottom: 3em;
}

/* welcome page */
#content_home {
	text-align: center;
	margin: 170px 0 100px;
	font-size: 1em;
}

#content_home #navigation { 
	margin-top: 120px; 
}
#content_home #claim { 
	margin-top: 120px; 
}


/* ---- Page Elements ---- */

#address p {
	text-align: center;
}
#address a {
	color: grey;
}

.logo {
	width: 140px;
}
.headline {
	margin-bottom: 0;
}
.feat-img {
	border-radius: 5px;
}

.suez-logo img{
margin-bottom: -1px;
width: 30px;
height: 11px;
display: inline;
}

.shiv img,
.manana img,
.board img {
border-radius: 100%;
height: 230px;
width: 230px;
}

.shiv,
.manana,
.board {
	text-align: center;
	margin: 0 auto;
}

.shiv a,
.manana a,
.board a {
color: grey;
}

.pictureld img {
float:left;
margin-right: 1em;
border-radius: 100%;
height: 230px;
width: 230px;
}

.primary {
	 text-align: justify; 
}

figure {
position: relative;
display: table;
margin: auto;
}

figcaption {
  position: absolute;
  bottom: 0;
  display: table-caption;
  padding:  15px;
  color: white;
  background-color: rgba( 29, 20, 17, .6);
  text-align: right;
  text-transform: uppercase;
  font-size: 1rem;
  width: 100%;
}

.col li {
	 list-style-type: circle;
}


/* ================================= 
  FlexBox Property
==================================== */

body {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

.row {
	flex: 1;
}



/* ================================= 
  Media Queries
==================================== */


@media (min-width: 769px) {
	.main-header,
	.row,
  	.footer-inner {
		width: 80%;
		margin: 0 auto;
		max-width: 1025px;
	}

	.name,
	.secondary-nav {
		margin-top: 1em;
		margin-bottom: 1em;
	}

	.advisory-board,
	.row-with-col {
		display:flex;
	}

	.tagline {
		font-size: 1.4em;
	}

	.main-header,
	.main-nav,
	.secondary-nav,
	.secondary-header {
		display: flex;
	}

	.our-leadership-col {
		flex: 1 50%;
	}

	.main-header,
	.secondary-header {
		flex-direction: column;
		align-items: center;
	}

	.secondary-nav {
		margin-bottom: 1em;
	}

	.banner img {
		max-width: 100%;
		text-align: center;
		display: block;
		margin: auto;
	}

	.row-busines {
		display: flex;
		flex-direction: row;
		align-items: flex-start;
		flex: 2;
		flex-wrap: wrap;
		justify-content: space-between;	
	}


}

@media (min-width: 1025px) {

	
}