@font-face {
    font-family: 'architects_daughterregular';
    src: url('../fonts/architectsdaughter/architectsdaughter-webfont.eot');
    src: url('../fonts/architectsdaughter/architectsdaughter-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/architectsdaughter/architectsdaughter-webfont.woff2') format('woff2'),
         url('../fonts/architectsdaughter/architectsdaughter-webfont.woff') format('woff'),
         url('../fonts/architectsdaughter/architectsdaughter-webfont.ttf') format('truetype'),
         url('../fonts/architectsdaughter/architectsdaughter-webfont.svg#architects_daughterregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'sf_cartoonist_hand_bold';
    src: url('../fonts/sf_cartoonist/sf_cartoonist_hand_bold-webfont.eot');
    src: url('../fonts/sf_cartoonist/sf_cartoonist_hand_bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/sf_cartoonist/sf_cartoonist_hand_bold-webfont.woff2') format('woff2'),
         url('../fonts/sf_cartoonist/sf_cartoonist_hand_bold-webfont.woff') format('woff'),
         url('../fonts/sf_cartoonist/sf_cartoonist_hand_bold-webfont.ttf') format('truetype'),
         url('../fonts/sf_cartoonist/sf_cartoonist_hand_bold-webfont.svg#architects_daughterregular') format('svg');
    font-weight: normal;
    font-style: normal;
}


html {
       overflow-y: scroll;
}
body{
	background-color: #d5d5d5;
}
.container{
	background-color: white;
	padding-right: 10px;
	padding-left: 10px;
}

p {
	padding: 0px;
	margin: 0px;
	padding-top: 5px;
	padding-bottom: 15px;
}
ul {
	margin: 0px;
	padding: 0px;
	padding-bottom: 25px;
	margin-bottom: 5px;

}
.list {
	padding: 0px;
	margin: 0px;
	padding-top: 5px;
	padding-bottom: 5px;

}

.row.header h4{
	text-align: right;
	font-family: 'architects_daughterregular', sans-serif;
	color: white;
	text-shadow: 0 3px 0 grey;
	padding-right:30px;
	padding-top:2%;
	background-repeat: no-repeat;
    background-size: 100%;
	padding-bottom: 8%;
    background: url(../images/banner.jpg);
	height: 0;
	margin: -10px -10px 0px -10px
}
.header p {
/* 	border: solid 1px black;
 */}

.copyright {
	font-family: sans-serif;
	font-size: 1em;
	padding-left: 0.5em;
	margin-top: 1em;
	color: #FFF;
	width: 100%;
}

.row h1, h2, h3 {
	font-family: sans-serif;
	padding: 0.3em 0em 0.1em 0em;
	margin: 0;
	font-size: 1.4em;
 	border-bottom: solid 1px #fce379;

}
.row.header a:hover {text-decoration:none;border:none;}
.row a {text-decoration: none;color: #4C70B2; outline: none;}
.row a:hover {text-decoration:underline;border:none;}
.row ul {margin: 0px;padding: 0px 0px 0px 0px;font-size: 1em;font-weight: normal;}
.row li {margin: 0px;padding: 0px 0px 0px 20px;font-size: 1em;font-weight: normal;}

.row ul li  {
	list-style-type:disc
}
.row ul li li  {
	list-style-type:circle
}
.navbar a {
	color: white;
}
.releases {
	background: #FFE68D;
	list-style-type:circle;
}

.row .title {
	border-bottom: 3px solid #FFE68D;
	border-top: 3px solid #FFE68D;
}

.threecoltable .col1h, .threecoltable .col2h, .threecoltable .col3h {
	background-color: #FDE95E;
	color: #505050;
	padding-top: 3px;
	padding-bottom: 3px;
	padding-left: 3px;
}
.threecoltable .col1, .threecoltable .col2, .threecoltable .col3 {
	padding-top: 3px;
	padding-bottom: 3px;
	padding-left: 3px;
}
.threecoltable .col1h {
	width: 20%;
}
.threecoltable .col2h {
	width: 60%;
}
.threecoltable .col3h {
	width: 30%;
}

.threecoltable_narrow .col1h, .threecoltable_narrow .col2h, .threecoltable_narrow .col3h {
	background-color: #FDE95E;
	color: #505050;
	padding-top: 3px;
	padding-bottom: 3px;
	padding-left: 3px;
}
.threecoltable_narrow .col1, .threecoltable_narrow .col2, .threecoltable_narrow .col3 {
	padding-top: 3px;
	padding-bottom: 3px;
	padding-left: 3px;
}
.threecoltable_narrow .col1h {
	width: 5%;
}
.threecoltable_narrow .col2h {
	width: 75%;
}
.threecoltable_narrow .col3h {
	width: 20%;
}


.twocoltable_wide .col1h,.twocoltable_wide .col2h {
	background-color: #FDE95E;
	color: #505050;
	padding-top: 3px;
	padding-bottom: 3px;
	padding-left: 3px;
}
.twocoltable_wide .col1, .twocoltable_wide .col2{
	padding-top: 3px;
	padding-bottom: 3px;
	padding-left: 3px;
}
.twocoltable_wide .col1h {
	width: 15%;
}
.twocoltable_wide .col2h {
	width: 85%;
}
.twocoltable_wide ul {
	margin: 0;
	padding-left: 10px;
}
.twocoltable_wide li {
	margin: 0;
	padding: 0;
}

.row.software p {
	margin: 0px;
	padding: 0px;
}
.row.software h1 {
	font-weight: normal;
}
.row.software h2 {
	font-size: 1.2em;
}
.row.software {
	border-bottom: 1px solid #C8C8C8;
	padding-top: 10px;
	padding-bottom: 5px;
}
.row.software .icon{
 	width: 100%;
 	padding: 10px 0px 10px 10px;
	border: 0px solid black;
}
.row.software img {
 	width: 90%;
	padding-top: 1em;
}
.row.release .row.software{
	border: 0px solid red;
}
.row.release .row.software{
	border: 0px solid red;
}
.row.version p {
	padding-top: 5px;
	padding-bottom: 5px;
	border: 0px solid green;
}
.contactgraphic {
	width: 200px;
	margin-bottom: -10px;
}
.author {
	font-weight: bold;	
}
#navbar-menu {
	white-space: nowrap;
	border: 0px;
}

#navbar-menu ul {
	width:100%; /* fixed width only please - you can use the "subMenusMinWidth"/"subMenusMaxWidth" script options to override this if you like */
	background-color: white;
}

#navbar-menu li{
	background-color: white;
}

#navbar-button {
	border-bottom: solid 1px green;
    display:none;
}

#navbar-button {
 	border-bottom: solid 1px #fce379;
	color: #000;
    line-height: 2em;
}
#navbar-button:before {
	content:'Menu -';
}
#navbar-button.collapsed:before {
	content:'Menu +';
}
@media screen and (max-width: 640px) {
  /* show the button on small screens */
  #navbar-button {
    display:inline-block;	
}
  /* hide the menu when it has the "collapsed" class set by the script */
  #navbar-menu.collapsed {
    display:none;
  }
 .icon{
    display:none;
  }
}
#footer {
	background-color: #616B7B;
	margin: 0px -10px 0px -10px
}

@media screen and (max-width: 640px) {
	.header h4 {
		font-size: 1.3em;
	}
}
@media screen and (max-width: 450px) {
	.header h4 {
		font-size: 1.0em;
	}
}

