.ref-link {
  text-align: center;
  font-size: 24px;
  padding: 50px 0;
}
.ref-link a {
  color: #999;
}

.hide {
  display: none;
}

/* Flexible iFrame */

.Flexible-container {
    position: relative;
    padding-bottom: 20px;
    padding-top: 20px;
    height: 100%;
    overflow: hidden;
}

.Flexible-container iframe,   
.Flexible-container object,  
.Flexible-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}

.example-layout {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
  height: calc(100vh - 300px);
max-width:1024px;
margin-left:auto;
margin-right:auto;
}
.example-layout header
{
  padding: 20px;
  background: white;
}

.example-layout footer {
	padding-top: 10px;
	padding-left: 10%;
	padding-right: 10%;
	background: #000;
	colour: white;
	font-family: "Arial Black", Gadget, sans-serif;
	font-size: 16px;
	color: #FFF;
	vertical-align: middle;
	text-align: center;
	padding-bottom: 10px;
}

.intro {
	font-family: "Arial Black", Gadget, sans-serif;
	font-size: 24px;
	color: #FFF;
	background-image: url(../images/Binary.jpg);
	background-size: 100%;
	overflow:hidden
	background-repeat: no-repeat;
	text-align: left;
	text-indent: 3%;
	width: 100%;
	padding-top: 3%;
	padding-right: 0%;
	padding-bottom: 3%;
	padding-left: 0%;
}

.example-layout .body {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
  -webkit-flex-grow: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  background: white;
}
.example-layout .body .col-1 {
	-webkit-box-flex: 1;
	-webkit-flex-grow: 1;
	-ms-flex-positive: 1;
	flex-grow: 1;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #000;
	line-height: 18px;
	background-color: #FFF;
	padding: 20px;
}
.example-layout .body .col-2 {
	background: white;
	width: 60%;
	-webkit-box-ordinal-group: 0;
	-webkit-order: -1;
	-ms-flex-order: -1;
	order: -1;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	color: #000;
	line-height: 20px;
	font-weight: bold;
}

.header-image {
	width: 60%;
	float:right;

}

.Intro-image {
	width: 100%;
	float: left;
	display: block;
}


@media (max-width: 800px) {
  .example-layout .body {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .example-layout .body .col-2, .example-layout .body .col-3 {
    width: auto;
  }
  
  .header-image {
	  width: 100%;
}

.example-media .media, .example-media .search-group {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  max-width: 600px;
}
.example-media .media img, .example-media .search-group img {
  margin-right: 10px;
}
.example-media .media .content, .example-media .search-group .content {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.example-media .media input, .example-media .search-group input {
  padding: 10px;
}
.example-media .media input[type="text"], .example-media .search-group input[type="text"] {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
}