/* CSS for the entire site */

body {
    background-color: white;
    /*background-image: url('graphics/c_programming_w1.jpg');*/
    /*background-image: url('graphics/sectional.tiff');*/
    background-repeat: no-repeat;
    background-attachment: fixed;
    /*background: transparent;*/
    /* opacity: 1; /* Does everything except the background */
}

/* ***** FOR TESTING PURPOSES ONLY ***** */
/*
body:hover {
    background-image: url('graphics/avionics-and-instruments.jpg');
}
*/

/* ***** FOR TESTING PURPOSES ONLY ***** */
div {
    //border: 2px solid orange;
}

div.tight_fit {
    width: auto;
    flex: 0 0 auto;
}

#body {
    border: 0px solid red; /* ***** TESTING ONLY ***** */
    width: 90%;
    min-height: 95%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 10px;
    margin-bottom: 10px;

    display: flex;
    flex-flow: column;
    height: 100%;
}

#header, #footer, #flex-space, .content_div {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 10px;
    margin-bottom: 10px;
    //border: 2px solid black;
    border-radius: 35px;
    vertical-align: middle;
    //background-color: rgba(225, 225, 225, 0.8);
    background-color: white;
    padding: 10px;
    box-sizing: border-box;

    /* flex: 0 1 30px; */
    /* flex: 0 1 auto; */
}

/* DUPLICATE FROM MOBILE CSS */
input[type=text], input[type=url], input[type=email], input[type=password], input[type=tel], textarea {
  -webkit-appearance: none; -moz-appearance: none;
  /* display: block; */
  display: inline-block;
  margin: 5px;
  width: 90%; height: 20px;
  line-height: 16px; 
  font-size: 16px;
  border: 1px solid #bbb;
  border-radius: 5px;
}

.g-recaptcha {
    display: inline-block;
}

#header, #footer {
    clear: both;
    flex: 0 0 auto;
}

#header h1 {
    font-size: 300%;
}

div.item {
    //background-color: blue;
}

div.item h1, h2{
    //background-color: orange;
    margin: 0;
    position: relative;
    top: 50%;
    transform: translate(0%, -50%);
}

#article {
    /* border: 0px solid blue; */  /* TESTING */
    width: 100%;
    /* display: table-cell; */
    text-align: center;
    flex: 0 0 auto;
}

#flex-space {
    flex: 1 1 auto;
    margin: 0px;
    border: 0px solid yellow; /* TESTING */
    border-radius: 0;
    background-color: transparent;
    padding: 0;
}

div.row, div.item_row {
    display: flex;
    flex-flow: row wrap;
    //justify-content: space-around;
    justify-content: space-between;
}

#footer {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-around;
    //justify-content: space-between;
}

div.item {
    /*width: 30%;*/
    flex: 0 1 auto;
}

.flex_width {
    display: flex;
    justify-content: space-between;
}

.flex_grow {
    flex: 1 1 auto;
}

#navigation {
    border: 0px solid black;
    float: left;
    width: auto;
}

#popup_background {
    z-index: 1;
    width: 100%;
    height: 100%;
    left: 0px;
    top: 0px;
    position: fixed;
    //background-color: rgba(225, 225, 225, 0.8);
    background-color: rgba(0, 0, 0, 0.5);
}

#popup_background.invisible {
    visibility: hidden;
}

#popup_foreground {
    width: 70%;
    height: 70%;
    top: 15%;
    margin: 0 auto;
    position: relative;
    background-color: rgba(225, 225, 225, 0.8);
    border: 2px solid black;
    overflow: auto;
}

.table_cell {
    display: table-cell;
}

h1, h2, p {
    color: #FB0307;/*#7d9500*/
    font-family: Impact, "Arial Narrow", sans-serif;/*"League Gothic Regular"*//*Georgia, Tahoma, Verdana, sans-serif*/
    font-weight: normal;
    text-align: center;
}

/* a image is for IE */
a img, a.service {
    text-decoration: none; border: 0px;
}

/* FOR Firefox */
a {
   outline: 0;
}

/*
ul, .plain {
    color: black;
    font-family: "Helvetica Neue", "Helvetica", sans-serif;
    font-weight: light;
}
*/

ul, .plain, .header_text, .article_text, .footer_text, .rental_text, .signature_text {
    color: black;
    font-family: "Helvetica Neue", "Helvetica", sans-serif;
    font-weight: light;
}

.article_text {
    text-align: left;
}

.rental_text, .signature_text {
    text-align: right;
}

ul {
    text-align: left;
}

.right {
    text-align: right;
    /*float: right;*/
}

.left {
    text-align: left;
    /*float: left;*/
}

.center {
    text-align: center;
}

.float_right {
    float: right;
}

.float_left {
    float: left;
}

h1 {
    /*display: inline;*/
}

p.service {
    font-size: 20px;
}

html, body {
    height: 100%;
}

table {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 10px;
    margin-bottom: 10px;
    /* border: 2px solid orange !important; */ /* TESTING */
    border: 2px solid black;
    border-radius: 35px;
    vertical-align: middle;
    background-color: rgba(225, 225, 225, 0.8);
}

table.inner {
    width: 100%;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
}

table.invisible {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 0px;
    margin-bottom: 0px;
    border: 0px solid black;  /* Change the px to show hidden tables */
    border-radius: 0px;
    vertical-align: middle;
    background-color: rgba(225, 225, 225, 0.0);
    padding: 0px;
}

table.page_format {
    width: 90%;
    height: 100%;
}

table.tight_fit {
    width: auto;
}

td {
    text-align: center;
    padding: 10px;
}

/* GET ONLY THE td IN A table class="invisible" */
table.invisible > tbody > tr > td {
    padding: 0px;
}

textarea {
    //width: 50em;
    height: 10em;
    //border: 0px;
}

ul.sidebar {
    list-style-type: none;
    margin: 0px;
    padding: 5px;
    width: 200px;
    //background-color: #f1f1f1;
    background-color: rgba(225, 225, 225, 0.0);
}

li a {
    display: block;
    color: #FB0307;
    padding: 8px 0 8px 16px;
    margin: 5px;
    text-decoration: none;
    background-color: white;
    border-radius: 10px;
    border: 1px solid white;
}

/* Change the link color on hover */
li a:hover {
    //background-color: #FB0307;
    //color: white;
    border: 1px solid #FB0307;
}

li.active a {
    background-color: #FB0307;
    color: white;
    border: 1px solid #FB0307;
}

/* PICTURES */
/*
img {
    max-width: 100%;
    height: auto;
    width: auto\9; / * ie8 * /
}
*/

.rounded, .rental_pic {
    border-radius: 35px;
    /* background: #73AD21; */
    padding: 10px; 
    object-fit: cover;
}

.rental_pic {
    float: left;
}

.logo {
    border-radius: 25px;
    padding: 10px; 
    object-fit: cover;
    float: left;
    max-height: 150px;
    width: auto;
}

.footer_image {
    height: 70px;
    float: left;
    padding: 10px;
    border-radius: 25px;
}

.top_pic {
    width: 300px;
    height: 225px;
}

.top_pic.small {
    height: 100px;
}

.desk_pic {
    width: 450px;
    height: 225px;
}

/* SHOW OR HIDE */
.rendered {
    display: inherit;
    border: 0px solid green /* TESTING */
}

.nonrendered, .phone_rendered {
    display: none;
}






/* HANDHELD DEVICES */
@media only screen and (max-device-width: 640px) {

body {
    background-color: black;
    background-image: none;
}

#body {
    width: auto;
}

#header, #footer, #flex-space, #navigation .content_div{
    //background-color: #cccccc;
    background-color: white;
}

#header div.item {
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px;
    margin-bottom: 20px;
}

img.top_pic {
    display: none;
}

div.item_row {
    flex-flow: column nowrap;
}

p.service {
    font-size: 75px;
    text-align: left;
}

div.item a.service {
    display: block;
    font-size: 72px;
    text-align: left;
    color: white;
    padding: 8px 0 8px 16px;
    margin: 5px;
    text-decoration: none;
    background-color: #FB0307;
    border-radius: 10px;
    border: 1px solid #FB0307;
}

div.item a.service p {
    color: white;
    padding: 0;
    margin: 0;
}

h1, p.title {
    //font-size: 72px;
}

ul, .plain, .header_text, .article_text, .footer_text, .rental_text, .signature_text {
    //font-size: 48px;
}

li a {
    font-size: 20px;
    font-weight: bold;
}

li.active a {
    background-color: white;
    color: #FB0307;
    border: 1px solid white;
}

.footer_text {
    text-align: center;
}

.footer_image {
    height: 150px;
}

.title, .desk_pic {
    display: none;
}

.phone_rendered {
    display: inherit;
}

.phone_nonrendered {
    display: none;
}

ul.sidebar {
    width: 100%;
    box-sizing: border-box;
    font-size: 16px;
    overflow-x: auto;
}

div.tight_fit {
    width: auto;
    flex: 1 1 auto;
}

.phone_content_div{
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 10px;
    margin-bottom: 10px;
    border: 2px solid black;
    border-radius: 35px;
    vertical-align: middle;
    //background-color: rgba(225, 225, 225, 0.8);
    background-color: white;
    padding: 10px;
    box-sizing: border-box;

    /* flex: 0 1 30px; */
    /* flex: 0 1 auto; */
}

input[type=text], input[type=url], input[type=email], input[type=password], input[type=tel], textarea {
  -webkit-appearance: none; -moz-appearance: none;
  /* display: block; */
  display: inline-block;
  margin: 5px;
  width: 90%; height: 20px;
  line-height: 16px; 
  font-size: 16px;
  border: 1px solid #bbb;
  border-radius: 5px;
}

textarea {
    height: 5em;
    padding: 8px;
}

input[type=submit] {
 -webkit-appearance: none; -moz-appearance: none;
 /* display: block; */
 display: inline-block;
 margin: 5px 0;
 font-size: 16px; 
 line-height: 2.5em;
 color: #333;
 font-weight: bold;
 height: 2.5em; width: 90%;
 background: #fdfdfd; 
 background: -moz-linear-gradient(top, #fdfdfd 0%, #bebebe 100%); 
 background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fdfdfd), color-stop(100%,#bebebe)); 
 background: -webkit-linear-gradient(top, #fdfdfd 0%,#bebebe 100%); 
 background: -o-linear-gradient(top, #fdfdfd 0%,#bebebe 100%); 
 background: -ms-linear-gradient(top, #fdfdfd 0%,#bebebe 100%); 
 background: linear-gradient(to bottom, #fdfdfd 0%,#bebebe 100%);
 border: 1px solid #bbb;
 -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;
}



} /* END MEDIA QUERY */