﻿#map-page, #trip-map-content { width: 100%; height: 90%; padding: 0; position: absolute !important; right : 0; left: 0 !important;}

.mainwrapper {
	width: 90%;
	max-width: 940px;
	margin: 20px auto;
	background-color: #ffffff;
}

.home-hero {
	display: grid;
	grid-gap: 1px;
	grid-auto-rows:
	minmax(150px, auto);
}
.home-hero > * {
	padding: 10px;
	background-repeat:
no-repeat;
	background-size:
cover;
	background-color: #fff;
}

.feature {
	background-image: 
	url(../photos/HomePagePhoto.jpg);
	color: #fff;
	display: flex;
	flex-direction: column;
	background-position: 
	bottom left;
}

.photos {
	background-image: 
	url(../photos/AT-home-page-photo.jpeg);
	color: #fff;
	display: flex;
	flex-direction: column;
	background-position: 
	bottom left;
}

.tripmap {
	background-image: linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0.9)),
	url(../photos/map-of-australia.jpg);
	color: #fff;
	display: flex;
	flex-direction: column;
	background-position: 
	bottom left;
}

.aboutus {
	background-image: linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0.8)),url(../photos/AboutUsPhoto1.jpg);
	color: #fff;
	display: flex;
	flex-direction: column;
}


.trips {
	background-image: linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0.8)),url(../photos/trips.jpg);
	color: #fff;
	display: flex;
	flex-direction: column;
}


.tripreport {
	background-image: linear-gradient(rgba(0,0,0,0),rgba(0,0,0,0.9)),url(../photos/OurTripReport.jpg);
	color: #fff;
	display: flex;
	flex-direction: column;
}

.cta{
	background-color: rgb(58, 120, 178);
	color: #fff;
	display: flex;
	flex-direction: column;
}

a.select-button:link {
	border: 1px solid #ccc;
	border-radius: 3px;
	text-decoration: none;
	background-color: #fff;
	color: #333;
	display: block;
	padding:  5px;
	margin: auto auto 20px;
	width: 90%;
	text-align: center;
}

@media (min-width: 500px) {
	.home-hero {
		grid-template-columns: 1fr 1fr;
	}
	.feature {
		grid-column: 1 / 3;
		grid-row: 1 / 3;
	}
	.aboutus {
		grid-column: 1;
		grid-row: 3/4;
	}
	.trips {
		grid-column: 1;
		grid-row: 4/6;
	}
	.tripreport{
		grid-column: 1;
		grid-row: 6/7;
	}
	.tripmap{
		grid-column: 1;
		grid-row: 7 / 9;
	}
	.photos{
		grid-column: 1;
		grid-row: 9 / 11;
	}
	.cta {
		grid-column: 1;
		grid-row: 11 / 11;
	}
}


@media (min-width: 800px) {
	.home-hero {
		grid-template-columns: 1fr 1fr 1fr;
		grid-template-rows: minmax(150px,auto) minmax(150px,auto);
		grid-auto-rows: minmax(100px, auto);
	}
	.feature {
		grid-column: 1 ;
		grid-row: 1 / 4;
	}
	.aboutus {
		grid-column: 1;
		grid-row: 4/6;
	}
	.trips {
		grid-column: 2;
		grid-row: 1/4;
	}
	.tripreport{
		grid-column: 2;
		grid-row: 4 / 6;
	}
	.tripmap{
		grid-column: 3;
		grid-row: 1 / 3;
	}
	.photos{
		grid-column: 3;
		grid-row: 3 / 5;
	}
	.cta {
		grid-column: 3;
		grid-row: 5 / 6;
	}
}


.list-item-title
{
	overflow: hidden;
	text-overflow: ellipsis;
}
.list-item-narrative
{
	color: #666666;
	font-weight: normal;
	overflow: hidden;
	text-overflow: ellipsis;
	min-height: 19px;
}
.report-item-narrative
{
	color: #666666;
	min-width: 240px;
	white-space:normal;
	font-weight: normal;
	overflow: hidden;
	text-overflow: ellipsis;
	min-height: 19px;
}
.TripDetail > .x-panel-body > div {
  width: 530px;
  text-align: left;
  font-size: 16px;
  line-height: 14px;
  color: #666;
}
.TripDetail > .x-panel-body h2 {
  letter-spacing: -1px;
  font-size: 18px;
  font-weight: bold;
  color: #000;
}
.TripDetail .x-panel-body span {
  color: #999;
}
.TripDetail > .x-panel-body > div {
  width: 530px;
  text-align: left;
  font-size: 16px;
  line-height: 14px;
  color: #666;
}
.TripDetail > .x-panel-body h2 {
  letter-spacing: -1px;
  font-size: 18px;
  font-weight: bold;
  color: #000;
}
.TripDetail .x-panel-body span {
  color: #999;
}
.TripDetail > .Tripimg {
	padding-left: 2em;
	width: 5%;
	margin-top: 0;
	padding-top: 0;
}
.Cellbreak {
	padding-left: .5em;
}
.summaryPhone img {
	margin: 7px 7px;
	width: 100px;
	height: 75px;
	/*object-fit: contain;/
	/*background: url(images/thumbnail.png) 0 0 no-repeat;*/
	background-color:#000;
	border: 3px solid #DDD;
}

/* Listview */
.has-right-radio {
	white-space:normal;
	overflow: hidden;
	text-overflow: ellipsis;
	min-height: 19px;
}
/*.has-right-radio img {
    width: 80px;
    height: 50px;
	float:left;
	margin-right: 3px;
	margin-bottom: 0px;
	margin-left: 0;
}*/

.has-right-radio a p {
    white-space: normal !important;
    margin: 0;
}
.right-radio {
    position: absolute;
    top: 0px; bottom: 0px; right: 0px;
    width: 80px;
    border: 0;
   /* background-color: rgb(246, 246, 246) !important; */
}
#aboutusimg {
	float: left;
	margin-top: 0;
	margin-bottom:10px;
	margin-left: 20px;
	margin-right: 20px;
	border-width: 8px 8px 20px 8px;
	background-color: #ffffff;
}
#aboutuscolleft {
	float: left;
	width: 210px;
	margin-top: 0;
	margin-left: 1.67em;
	margin-right: 1.67em;
	padding-top: 0;
	padding-right: 1em;
	padding-bottom: 20px;
}
#aboutuscolright {
	padding-left: 2em;
	width: auto;
	margin-top: 0;
	padding-top: 0;
	padding-left: 100px;
}
#welcomeimg {
	float: right;
	margin-top: 0;
	margin-bottom:10px;
	margin-left: 20px;
	margin-right: 20px;
	border-width: 8px 8px 20px 8px;
	background-color: #ffffff;
}
#logentry {
	margin-top: 0;
	margin-left: 20px;
	margin-right: 20px;
	padding-top: 0;
	padding-right: 1em;
	padding-bottom: 20px;
}

#welcomescreenh1 {
  text-align:left;
  margin-left: 20px;
  letter-spacing: -1px;
  font-size: 26px;
  font-weight: bold;
  color: #000;
}
/* Button up */
.ui-widget-overlay.ui-front {
	background:none;
}
.ui-widget-content {
	background-color:#DDD;
}
.ui-page-theme-c .ui-btn,
html .ui-bar-c .ui-btn,
html .ui-body-c .ui-btn,
html body .ui-group-theme-c .ui-btn,
html head + body .ui-btn.ui-btn-c,
html head + body .ui-btn.ui-btn-c,
/* Button visited */
.ui-page-theme-c .ui-btn:visited,
html .ui-bar-c .ui-btn:visited,
html .ui-body-c .ui-btn:visited,
html body .ui-group-theme-c .ui-btn:visited,
html head + body .ui-btn.ui-btn-c:visited {
	background-color: #ed1c24 /*{c-bup-background-color}*/;
	border-color: #820f13 /*{c-bup-border}*/;
	color: #ffffff /*{c-bup-color}*/;
	text-shadow: 0 /*{c-bup-shadow-x}*/ 1px /*{c-bup-shadow-y}*/ 0 /*{c-bup-shadow-radius}*/ #444444 /*{c-bup-shadow-color}*/;
}
/* Button visited */
.ui-page-theme-c .ui-btn:visited,
html .ui-bar-c .ui-btn:visited,
html .ui-body-c .ui-btn:visited,
html body .ui-group-theme-c .ui-btn:visited,
html head + body .ui-btn.ui-btn-c:visited {
	background-color: #ed1c24 /*{c-bup-background-color}*/;
	border-color: #820f13 /*{c-bup-border}*/;
	color: #ffffff /*{c-bup-color}*/;
	text-shadow: 0 /*{c-bup-shadow-x}*/ 1px /*{c-bup-shadow-y}*/ 0 /*{c-bup-shadow-radius}*/ #444444 /*{c-bup-shadow-color}*/;
}
/* Button hover */
.ui-page-theme-c .ui-btn:hover,
html .ui-bar-c .ui-btn:hover,
html .ui-body-c .ui-btn:hover,
html body .ui-group-theme-c .ui-btn:hover,
html head + body .ui-btn.ui-btn-c:hover {
	background-color: #FF2029 /*{c-bhover-background-color}*/;
	border-color: #8c1116 /*{c-bhover-border}*/;
	color: #ffffff /*{c-bhover-color}*/;
	text-shadow: 0 /*{c-bhover-shadow-x}*/ 1px /*{c-bhover-shadow-y}*/ 0 /*{c-bhover-shadow-radius}*/ #444444 /*{c-bhover-shadow-color}*/;
}
/* Button down */
.ui-page-theme-c .ui-btn:active,
html .ui-bar-c .ui-btn:active,
html .ui-body-c .ui-btn:active,
html body .ui-group-theme-c .ui-btn:active,
html head + body .ui-btn.ui-btn-c:active {
	background-color: #FF2029 /*{c-bdown-background-color}*/;
	border-color: #8c1116 /*{c-bdown-border}*/;
	color: #ffffff /*{c-bdown-color}*/;
	text-shadow: 0 /*{c-bdown-shadow-x}*/ 1px /*{c-bdown-shadow-y}*/ 0 /*{c-bdown-shadow-radius}*/ #444444 /*{c-bdown-shadow-color}*/;
}
/* Active button */
.ui-page-theme-c .ui-btn.ui-btn-active,
html .ui-bar-c .ui-btn.ui-btn-active,
html .ui-body-c .ui-btn.ui-btn-active,
html body .ui-group-theme-c .ui-btn.ui-btn-active,
html head + body .ui-btn.ui-btn-c.ui-btn-active,
/* Active checkbox icon */
/*grid */
.loggrid {
	display: grid;
	grid:
	/*rows: repeat (20) */
	repeat(var(--logRowNum), minmax(.12rem, max-content))
	/
	/*columns: left to right */
	minmax(100%, 1fr);
	gap: .01rem;
	/*font-size: .08rem; */
}
.loggrid * {
	padding: calc( 2rem / 100);
}

.logone {
	/*border: 1px solid black; */
	background: lightgray;
}
.logtwo {
	background: white;
}
/*grid */
.aboutusgrid {
	display: grid;
	grid:
	/*rows: repeat (20) */
	repeat(var(--aboutusRowNum), minmax(.12rem, max-content))
	/
	/*columns: left to right */
	minmax(30%, 1fr)  minmax(70%, 1fr);
	gap: .01rem;
	/*font-size: .08rem; */
}
.aboutusgrid * {
	padding: calc( 2rem / 100);
}

.aboutusone {
	/*border: 1px solid black; */
	background: lightgray;
}
.aboutustwo {
	background: white;
}