@charset "utf-8";

/* Phone */
@media screen and (max-width:500px){

header {
	max-width: 100%;
  margin: 0% 2% !important;
}

.strap {
	left: 2%;

}

.navbar {
    width: 100% !important;

}

.logo img {
	width: 30% !important;
	margin-top: 2px !important;
  margin-right: 2%;
}

.content_fixed  {
  height: 78vh !important;
	margin-top: 5px !important;
	margin-bottom: 5px!important;
	padding: 0% 5% 0% 5% !important;
}

.content_gallery {
	height: 78vh !important;
	width: auto !important;
}

.services {
  display: block !important;
  margin-top: 0px !important;
}

.image_left {
	width: 100%;
	float: left;
}

.image_right {
	width: 100%;
	float: right;
}


.contact_main_box {
	background-color: rgba(255,255,255, .8) !important;

}

.scroller {
	font-size: 12px;

}

.subhead  {
  padding-top: 25px;

}

.marquee {
  height: 100%;
  width: 100% !important;

}

}

/* Tablet */
@media screen and (min-width:501px) and (max-width:1147px){

header {
	max-width: 80%;
}

.logo img {
  margin-right: 0%;
}

.image_left {
  width: 40%;
  float: left;
}

.image_right {
  width: 40%;
  float: right;
}

.content_gallery {
	height: 80vh;
	width: auto;
}

.marquee {
  width: 100%;

}

.scroller {
	font-size: 14px;

}

}

/* Desktop */
@media screen and (min-width:1148px){

header {
	max-width: 80%;

}

.content_gallery {
	height: 80vh;
}

.marquee {
  width: 100%;

}

.image_left {
	width: 40%;
	float: left;
}

.image_right {
	width: 40%;
	float: right;
}

}

/* All */
body {
  background-color: #E7E1DA;
  font-family: Tahoma, "Lucida Grande", "Trebuchet MS", Helvetica, sans-serif;
  margin: 0px;
  color: #7C7265;
}

body::-webkit-scrollbar {
      width: 0px;
    ::-webkit-scrollbar              {  };
    ::-webkit-scrollbar-button       {  };
    ::-webkit-scrollbar-track        {  };
    ::-webkit-scrollbar-track-piece  {  };
    ::-webkit-scrollbar-thumb        {  };
    ::-webkit-scrollbar-corner       {  };
    ::-webkit-resizer                {  };
	scrollbar-3dlight-color: #E7E2DB;
	scrollbar-arrow-color: #7D7267;
	scrollbar-base-color: #E7E2DB;
	scrollbar-darkshadow-color: #E7E2DB;
	scrollbar-face-color: #DFDAD4;
	scrollbar-highlight-color:#E7E2DB;
	scrollbar-shadow-color: #7D7267;
	scrollbar-track-color: #E7E2DB;
}

main {
	height: 100%;
	width: 100%;
}

header {
  height: 10vh;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
}

.strap {
	float: left;
	top: 20px;
	position: relative;
	line-height: 100%;
}

.contactlink {
	color: #7C7265;
	font-size: 90%;
	font-weight: bold;
}

.logo img {
	height: 70px;
	float: right;
	margin-top: 10px;
}

a {
  color: #7C7265;

}

a:visited {
	color: #FFFFFF;

}

nav {
  overflow: hidden;
  clear: both;
  background-color: #CDC6BC;
  border: 1px solid #7C7265;
  height: 34px;
}

.navbar {
  height: 34px;
  width: 80%;
  overflow: hidden;
  margin-right: auto;
  margin-left: auto;
  border-left: 1px solid #818A87;
}

nav a {
  height: 100%;
  float: left;
  padding: 6px 16px 0px 16px;
  text-decoration: none;
  min-width: 10%;
  border-right: 1px solid #818A87;
  border-bottom: 1px solid #818A87;
}

.navbar a:hover, .dropdown:hover .dropbtn {
  background-color: rgb(124, 114, 101);
}

.dropdown {
  height: 34px;
  min-width: 12%;
  float: left;
  overflow: hidden;
  border-right: 1px solid #818A87;
  background-image: url(../images/MenuBarDown.gif);
  background-repeat: no-repeat;
	background-position: 95% 50%;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: rgb(164, 156, 146);
  border: thin solid #7C7265;
  min-width: 12%;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 100;
}

/* Drop menu */
.dropdown-content a {
  float: none;
  color: white;
  padding: 8px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
  border: thin solid #7C7265;
}

/* Drop menu hover*/
.dropdown-content a:hover {
  background-color: rgb(124, 114, 101);

}
/* Drop menu hover updates to visible*/
.dropdown:hover .dropdown-content {
  display: block;

}

.dropdown .dropbtn {
  height: 35px;
  text-align: left;
  font-size: 16px;
  width: 100%;
  color: white;
  padding: 0px 16px;
  background-color: inherit;
  cursor: pointer;
  border: 0px;
  border-bottom: 1px solid #818A87;
}

.content_fixed {
	margin: 0px 0px 0px 0px;
	margin-left: 0%;
	height: 80vh;
	overflow-y: auto;
	overflow-x: hidden;
  padding: 0% 20% 0% 20%
}

.col-left_box {
	float: left;
	width: 50%;
}

.col-right_box {
	float: right;
	width: 50%;
}

.full_box {
  width: 100%;
	margin: 10px 0px;
	float: left;
}

.image_left {
  margin: 0% 1% 1% 1%;

}

.image_right {
  margin: 0% 1% 1% 1%;

}

.image_right_small {
	max-height: auto;
	width: 25%;
	float: right;
  margin: 0% 1% 1% 1%;
}

.contact_main_box {
  padding: 5% 0% 5% 5%;
	background-color: rgba(255,255,255, .4);
	text-align: left;
}

.contact_map_box {
	float: left;
	background-image: url(../images/uk_map_visuals3d.jpg);
	background-repeat: no-repeat;
	background-position: right top;
	width: 100%;
}

input[type=text]#tswname {
	width: 40%;
	height: 12px;
	border: 3px solid #cccccc;
	padding: 5px;
	margin: 0px;
}

input[type=text]#tswemail {
	width: 40%;
	height: 12px;
	border: 3px solid #cccccc;
	padding: 5px;
	background-position: bottom right;
	background-repeat: no-repeat;
}

textarea#tswcomments {
	width: 60%;
	height: 100px;
	border: 3px solid #cccccc;
	padding: 5px;
}

.bullets {
	font-size: 15px;
	line-height: 2em;
	font-weight: normal;
	text-align: left;
}

.subhead {
	font-size: 16px;
	font-weight: bold;
	padding-bottom: 10px;
}

.bodycopy {
	font-size: 15px;
	line-height: 18px;
	font-weight: normal;
}

.services {
  margin-top: 30px;
  display: grid;
  grid-template-columns: 16% 80%;
  gap: 30px;
  align-items: start;
}

.marquee {
	background-color: #7C7265;
	overflow: hidden;
  color: white;
}

.scroller {
  animation: marquee 30s linear infinite;

}

@keyframes marquee {
  0%   { transform: translate(100%, 0); }
  100% { transform: translate(-100%, 0); }
}

footer {
  height: auto;
	color: #333;
	background-color: #7C7265;
	padding: 5px 0px 5px 0px;
}

.copyright {
	color: #333;
	font-size: 10px;
	margin: 0% 10%;
}
