/* There's no differences between a RGB and hex color (#). But with rgba (alpha) you can add a alpha variable it add a % opacity to your color */

html, body {width: auto !important; overflow-x: hidden !important} /* Stop lateral page movement on mobile */

body
{ font-family: Verdana,georgia; 
  font-size:12pt; 
  margin:0; 
  line-height:1.4; 
  background: url('../images/orion.jpg') no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

form {margin:0px 0px 0px 0px;}
.form-container {display: flex; justify-content: center; align-items: center;}  /* Centralise form fields */
.row-centered {text-align:center;}  /* centered columns styles */
.col-centered
{ display:inline-block;
  float:none;
  text-align:left;  /* reset the text-align */
  margin-right:-4px;  /* inline-block space fix */
}

/* #4169E1 Royal Blue */
A:link {color: #4169E1; text-decoration: none; font-weight:bold;}
A:active {color: #4169E1; font-size: 12pt; text-decoration: none; font-weight:bold;} 
A:visited {color: #4169E1; font-size: 12pt; text-decoration: none; font-weight:bold;}
A:hover {color: yellow; font-size: 12pt; text-decoration: none; font-weight:bold;}

form { font-family: Verdana; margin: 0;}

h1 { font-size: 14pt; font-family: Verdana,georgia; font-weight:800; color:#000080;}
h2 { font-size: 12pt; font-family: Verdana,georgia; line-height:150%; font-weight:800; color:#000080;}
h3 { font-size: 14pt; font-family: Verdana,georgia; line-height:100%; font-weight:80;}

li   {margin-top: 0; margin-bottom: 0;}
ul  {margin-top: 0; margin-bottom: 0;}

.normal {font-family: Verdana,georgia; background-color:#EEAEEE; background-image: none; font-size:12pt; margin:0; line-height:120%;}
.small {font-family: Verdana,georgia; font-size: 8pt; line-height:150%; margin:0;}
/** .small {font-family: Verdana,georgia; font-size: 8pt; color:#808080; line-height:150%; margin:0;} **/
.astrology {font-family: georgia; font-size: 12pt; font-weight:800; margin:0;}
.center40 {display: block; margin-left: auto; margin-right: auto; width: 40%;} /** used to center header image **/

/* Boxes */
.goldBox { border: 1px solid #FFD700;}  /* Gold */
.goldX3 {  border-left: 1px solid #FFD700; border-right: 1px solid #FFD700; border-bottom: 1px solid #FFD700;}  /* Gold. No Top */
.goldX2 { border-left: 1px solid #FFD700; border-right: 1px solid #FFD700;}  /* Gold. Just the sides */

/* Textwrap images;  margin(margin-top margin-right margin-bottom margin-left;) */
.TextWrapLeft {float:left; margin: 0 5px 5px 0;}
.TextWrapRight {float:right; margin: 0 5px 5px 0;}
.Circular {border-radius: 50%;}

/* https://www.bestcssbuttongenerator.com/#/14 */
/* Bottom margin is so buttons seperate on mobile screens */
.btn.btn-blue
{ box-shadow: 0px 1px 0px 0px #f0f7fa;
  background: linear-gradient(to bottom, #bbffff 5%, #019ad2 100%);
  background-color: #bbffff;   /* Turquoise */
  border-radius: 20px;
  border: 1px solid #057fd0;
  display: inline-block;
  cursor: pointer;
  color: black;
  font-family: tahoma;
  font-size: 14px;
  font-weight: bold;
  padding: 5px 15px;
  margin-bottom:10px;
  text-decoration: none;
  text-shadow: 0px -1px 0px #5b6178;
}
.btn.btn-blue:hover {background: linear-gradient(to bottom, #019ad2 5%, #bbffff 100%);}
.btn.btn-blue:active {position: relative; top:1px;}

.btn.btn-yellow
{ box-shadow: 0px 1px 0px 0px #fff6af;
  background: linear-gradient(to bottom, #ffec64 5%, #ffab23 100%);
  background-color: #ffec64;
  border-radius: 20px;
  border: 1px solid #ffaa22;
  display: inline-block;
  cursor: pointer;
  color: #333333;  /* Gray 20 */
  font-family: tahoma;
  font-size: 14px;
  font-weight: bold;
  padding: 5px 15px;
  margin-bottom:10px;
  text-decoration: none;
  text-shadow: 0px 1px 0px #ffee66;
}
.btn.btn-yellow:hover {background: linear-gradient(to bottom, #ffab23 5%, #ffec64 100%);}
.btn.btn-yellow:active {position: relative; top:1px;}

-webkit-box-sizing: border-box; /* Android = 2.3, iOS = 4 */
-moz-box-sizing: border-box; /* Firefox 1+ */
box-sizing: border-box; /* Chrome, IE 8+, Opera, Safari 5.1 */
