body {
  font-family: Arial,Helvetica,Verdana,sans-serif;
  margin:0;
  padding:0;
}

.container-full {
  margin: 0 auto;
  width: 100%;
}

.container-full .row {
  margin: 0;
}

#intro_video {
  width: 512px;
  height: 288px;
}

@media (min-width: 768px) {
  #intro_video {
    width: 640px;
    height: 360px;
  }
}

@media (min-width: 992px) {
  #intro_video {
    width: 720px;
    height: 405px;
  }
}

@media (min-width: 1200px) {
  .container {
    width: 1200px;
  }

  #intro_video {
    width: 800px;
    height: 450px;
  }
}

@media (min-width: 1400px) {
  .container {
    width: 1400px;
  }

  #intro_video {
    width: 1024px;
    height: 576px;
  }
}

.scale25 {
  -moz-transform: scale(0.25, 0.25);
  -webkit-transform: scale(0.25, 0.25);
  -o-transform: scale(0.25, 0.25);
  -ms-transform: scale(0.25, 0.25);
  transform: scale(0.25, 0.25);
  -moz-transform-origin: top left;
  -webkit-transform-origin: top left;
  -o-transform-origin: top left;
  -ms-transform-origin: top left;
  transform-origin: top left;
}

.scalediv25 {
  width: 321px;
  height: 375px;
  overflow:hidden;
}

.scale40 {
  -moz-transform: scale(0.4, 0.4);
  -webkit-transform: scale(0.4, 0.4);
  -o-transform: scale(0.4, 0.4);
  -ms-transform: scale(0.4, 0.4);
  transform: scale(0.4, 0.4);
  -moz-transform-origin: top left;
  -webkit-transform-origin: top left;
  -o-transform-origin: top left;
  -ms-transform-origin: top left;
  transform-origin: top left;
}

.scalediv40 {
  width: 512px;
  height: 600px;
  overflow:hidden;
}

.scale55 {
  -moz-transform: scale(0.55, 0.55);
  -webkit-transform: scale(0.55, 0.55);
  -o-transform: scale(0.55, 0.55);
  -ms-transform: scale(0.55, 0.55);
  transform: scale(0.55, 0.55);
  -moz-transform-origin: top left;
  -webkit-transform-origin: top left;
  -o-transform-origin: top left;
  -ms-transform-origin: top left;
  transform-origin: top left;
}

.scalediv55 {
  width: 705px;
  height: 825px;
  overflow:hidden;
}

.scale70 {
  -moz-transform: scale(0.70, 0.70);
  -webkit-transform: scale(0.70, 0.70);
  -o-transform: scale(0.70, 0.70);
  -ms-transform: scale(0.70, 0.70);
  transform: scale(0.70, 0.70);
  -moz-transform-origin: top left;
  -webkit-transform-origin: top left;
  -o-transform-origin: top left;
  -ms-transform-origin: top left;
  transform-origin: top left;
}

.scalediv70 {
  width: 897px;
  height: 1050px;
  overflow:hidden;
}

.scale85 {
  -moz-transform: scale(0.85, 0.85);
  -webkit-transform: scale(0.85, 0.85);
  -o-transform: scale(0.85, 0.85);
  -ms-transform: scale(0.85, 0.85);
  transform: scale(0.85, 0.85);
  -moz-transform-origin: top left;
  -webkit-transform-origin: top left;
  -o-transform-origin: top left;
  -ms-transform-origin: top left;
  transform-origin: top left;
}

.scalediv85 {
  width: 1089px;
  height: 1275px;
  overflow:hidden;
}

.introtext {
  margin-top: 5%;
  margin-bottom: 15%;
}

.introtext h3 {
  color: #001d59;
  font-size: 30px;
}

.introtext p {
  line-height: 28px;
  font-weight: 600;
}

.introtext a.btn-square {
  border-radius: 3px;
  margin-top: 5%;
  margin-bottom: 5%;
  margin-left: 0;
  font-size: 22px;
  font-weight: 500;
}

.formnote {
  font-size: small;
  padding-left: 20px;
}

.container iframe {
  position: relative;
  z-index: 500;
}

#customcomments {
  position: relative;
  min-height: 150px;
  z-index: 600;
}

#topnav .navbar {
  background-color: #001d59;
  color: #FFF;
}

#topnav .topnavleft {
  margin-top: 15px;
}

#topnav .topnavleft a {
  background-color: #ebebeb;
  color: #000;
  text-decoration: none;
  padding: 3px 7px;
}
  
#topnav .topnavcenter h3 {
  margin-top: 12px;
}

#topnav .topnavright {
  margin-top: 15px; 
}

#topnav .topnavright a {
  background-color: #ebebeb;
  color: #000;
  text-decoration: none;
  padding: 3px 7px;
}

.lefttitle {
  color: #001d59;
  font-weight: bold;
}

.leftTemplateNav {
  margin-bottom: 20px;
}

.leftTemplateNav .active, .leftTemplateNav .active:hover, .leftTemplateNav .active:focus {
  background-color: #00acaf;
  color: #000;
}

.leftTemplateNav .active a, .leftTemplateNav .active:hover a, .leftTemplateNav .active:focus a {
  color: #000;
}

.leftTemplateNav > li {
  background-color: #001d59;
  border-radius: 3px;
  color: #FFFFFF;
  cursor: pointer;
  margin-bottom: 5px;
/*BAH  padding: 5px 0;*/
padding: 5px 15px;
  text-align: center;
  transition: background-color .3s ease-in-out;
}

.leftTemplateNav > li:hover, .leftTemplateNav > li:focus {
  background-color: #001237;
}

/* Hide the info icon for the "View All" option - self-explanatory */
.leftTemplateNav > .li-viewall > a {
  visibility: hidden;
}

.leftTemplateNav > li > div {
/*BAH  width: 190px;*/
  display: inline-block;
}

.leftTemplateNav > .active {
  position: relative;
}
.leftTemplateNav > .active:before {
  content: '';
  position: absolute;
  left: 10px;
  top: 7px;
  width: .5em;
  height: 1em;
  border-style: solid;
  border-width: 0 .2em .2em 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}

.leftTemplateNav .left-menu-popup,
.leftTemplateNav .left-menu-popup:hover,
.leftTemplateNav .left-menu-popup:focus {
/*BAH  padding: 0px 15px 0px 0px;*/
padding: 0;
  color: #FFFFFF;
  background-color: transparent;
}

#leftnav_div {
  padding-bottom: 100px;
}
#leftnav_div p {
  font-size: 14px;
}

#leftnav .panel-heading a.leftnav_a_left {
  display: inline-block;
  line-height: 1;
  text-align: center;
  width: 90%;
}

#leftnav .panel-heading a.leftnav_a_right {
  display: inline-block;
  width: 5%;
  text-align: center;
}

#leftnav .panel {
  border: 0;
  overflow: inherit;
}

#leftnav .panel-body {
  padding: 0;
}

#leftnav .panel-heading a:hover, #leftnav .panel-heading a:focus {
  text-decoration: none;
}

#leftnav .panel-heading a,#leftnav .panel-heading a:visited {
  color: #FFFFFF;
}

#leftnav .panel-heading {
  color: #FFFFFF;
  background-color: #001d59;
  padding: 5px 15px;
  transition: background-color .3s ease-in-out;
}

#leftnav .panel-heading:hover, #leftnav .panel-heading:focus {
  background-color: #001237;
}

#leftnav, 
#leftnav .panel,
#leftnav .panel-heading {
  border-radius: 3px;
  box-shadow: none;
}

/* uncomment to remove slow transition of left menu
#leftnav .collapsing {
  -webkit-transition: none;
  transition: none;
}
*/

.maincontent {
  background: #CCC;
}

#leftnav ul {
  border-bottom: 1px solid #FFF;
}

#leftnav li {
  color: #000;
  cursor: pointer;
  background-color: #bebebe;
  border-top: 1px solid #fff;
  margin: 0 5px;
  padding: 5px 5px 5px 10px;
  transition: background-color .3s ease-in-out;
}

#leftnav li:last-child {
  border-radius: 0 0 3px 3px;
}

#leftnav li:hover, #leftnav li:focus {
  background-color: #63666f;
  color: #fff;
}

/* Additional explanatory text for the option */
#leftnav li > p {
  background-color: #fff;
  border-radius: 3px;
  color: #000;
  font-size: 13px;
  margin: 5px 5px 5px 0;
  padding: 3px 5px;
}

#leftnav .active, #leftnav .active:hover, #leftnav .active:focus {
  background-color: #63666f;
  color: #fff;
}

.leftnavSelected {
  background: #63666f;
  border-radius: 0 0 3px 3px;
  color: #fff;
  margin: 0 5px;
  padding: 5px 5px 5px 10px;
}

.btn-square {
  margin-left: 10px;
  border-radius: 0;
  padding: 3px 8px;
}

#emailfriendlink.btn-default {
  color: #676767;
}

#savebookmarklink.btn-default {
  border-color: #676767;
  color: #676767;
}

#maincontent {
/*  overflow-x: hidden; */
  padding-bottom: 150px;
}

#bottomnav .navbar-inverse {
  background-color: #001d59;
  border: none;
}

#bottomnav .navbar-inverse .navbar-nav > li > a {
  color: #fff;
}
#bottomnav .navbar-inverse .navbar-nav > li > .circle {
  color: #000;
}

#bottomnav .bottomnav_disabled {
  color: #bbb;
  padding: 15px;
}

#bottomnav .navbar-inner {
  text-align:center;
  font-size: 11pt;
}

#bottomnav .navbar .nav,
#bottomnav .navbar .nav > li {
  float:none;
  display:inline-block;
}
 
.circle,
.circle .navbar-inverse .navbar-nav > li > a,
.circle .navbar-inverse .navbar-nav > li > a:hover,
.circle .navbar-inverse .navbar-nav > li > a:focus {
  display: block;
  background: none repeat scroll 0 0 #00acaf !important;
  font-weight: bold;
  outline: none;
}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {i
  #bottomnav .navbar .nav,
  #bottomnav .navbar .nav > li {
    vertical-align: top;
  }

  #bottomnav ul.nav {
    height: 50px;
  }

  #bottomnav .container {
    width: 100%;
  }

  .circle,
  .circle .navbar-inverse .navbar-nav > li > a,
  .circle .navbar-inverse .navbar-nav > li > a:hover,
  .circle .navbar-inverse .navbar-nav > li > a:focus {
    border-radius: 50%;
    width: 160px;
    height: 160px !important;
    margin-top: -15px;
    padding-top: 15px !important;
    padding-left: 30px !important;
    padding-right: 30px !important;
  }
}

.templateList {
  display: grid;
  grid-template-columns: repeat(auto-fit, 200px);
  grid-gap: 2em;

  margin-bottom: 8em;
}
@media (min-width: 992px) {
  .templateList {
    margin-bottom: 5em;
  }
}

.templateItem {
  text-align: center;
}
.templateItem-img {
  position: relative;
}

.templateItem img {
  transition: all .3s ease .1s;
}
.templateItem-hover img {
  transform: scale(1.2) translateY(1%);
}
.templateItem .title {
  background: #fff;
  transition: all .3s ease .1s;
}
.templateItem-hover .title {
/*  position: relative;
  padding: .25em 0;
  transform: scale(1.2) translateY(-2%);*/
color: #fff;
}
.templateItem-img span {
/*  background: rgba(255, 255, 255, .7);*/
  color: #000;
/*  font-size: 18px;*/
/*  padding: .25em;*/
  position: absolute;
  bottom: 0;
/*  right: 0;*/

font-size: 20pt;
right: 10px;
text-shadow: -1px 0 #fff, 0 1px #fff, 1px 0 #fff, 0 -1px #fff;

display: none;
}
.templateItem .title {
  margin: .25em 0;
}
.templateItem .title em {
  margin-left: .25em;
}
.templateItem .btn + .btn {
  margin-left: 1em;
}

#container_initialForm {
  width: 520px;  /* to keep the text from expanding in a single line */
  padding: 30px 40px 50px 40px;
}

#container_initialForm .formrow {
  position: relative; /* needed to align the input fields */
}

#container_initialForm .formrow input[type="submit"] {
  margin-top: 10px;
}

#container_initialForm .formrow input[type="text"],
#container_initialForm .formrow input[type="password"] {
  position: absolute;
  left: 100px;
  width: 280px;
}

#container_forgotForm {
  width: 520px; /* to keep the text from expanding in a single line */
  padding: 30px 40px 50px 40px;
}

#container_forgotForm .formrow input[type="submit"] {
  margin-top: 10px;
}

#container_forgotForm .formrow input[type="text"],
#container_forgotForm .formrow input[type="password"] {
  width: 280px;
}

#container_newuserForm {
  padding: 30px 40px 50px 40px;
}

#container_resetPasswordForm {
  width: 520px;
  padding: 30px 40px 50px 40px;
}

#container_resetPasswordForm .formrow {
  position: relative;
}

#container_resetPasswordForm .formrow input[type="submit"] {
  margin-top: 10px;
}

#container_resetPasswordForm .formrow input[type="text"],
#container_resetPasswordForm .formrow input[type="password"] {
  position: absolute;
  left: 120px;
  width: 280px;
}

#container_bookmarkForm {
  width: 380px;
  padding: 30px 40px 50px 40px;
}

#container_bookmarkForm .formrow input[type="text"] {
  width: 220px;
}

#container_bookmarkForm .formrow input[type="submit"] {
  margin-top: 10px;
}

#container_emailForm {
  width: 560px;
  padding: 30px 40px 50px 40px;
}

#container_emailForm .formrow {
  position: relative;
}

#container_emailForm .formrow #emailto,
#container_emailForm .formrow #emailsubject {
  position: absolute;
  left: 80px;
  width: 380px;
}

#container_emailForm .formrow textarea {
  position: absolute;
  left: 80px;
  width: 380px;
  height: 100px;
}

#container_emailForm .formrow #captchadiv {
  margin-top: 90px;
  margin-left: 20px;
}

#container_emailForm .formrow input[type="submit"] {
  margin-top: 10px;
}

#urlinfoform,
#additionalcommentsform,
#addinfoform,
#finalreviewform,
#fileupload {
  padding-bottom: 8em;
}
@media (min-width: 992px) {
  #urlinfoform, #additionalcommentsform, #addinfoform, #finalreviewform, #fileupload {
    padding-bottom: 5em;
  }
}

.btn-save {
  background-color: #001d59;
  border-color: #000c26;
  color: #fff;
  font-weight: bold;
}
.btn-save:hover,
.btn-save:focus {
  color: #FFFFFF;
}

.btn-select {
  background-color: #ebebeb;
  border-color: #959595;
  color: #000;
  font-weight: bold;
}
.btn-select:hover,
.btn-select:focus {
  background-color: #d2d2d2;
  /* border-color: #898b8e; */
  color: #000;
}


.btn-grey-plus {
  border: 0;
  border-radius: 0;
  background-color: #676767;
  color: #FFFFFF;
  padding: 3px 8px;
}
.btn-grey-plus:hover,
.btn-grey-plus:focus {
  background-color: #676767;
  color: #FFFFFF;
}

.btn-emailfriend {
  border: 0;
  padding: 3px 8px;
}

.btn-emailfriend i {
  padding-left: 2px;
  font-size: 20px;
}

.btn-bookmarks-left {
  border: 1px solid #676767;
  border-right: 0;
  border-radius: 0;
  color: #676767;
  padding: 3px 8px;
}

.btn-bookmarks-right {
  border: 1px solid #676767;
  border-left: 0;
  border-radius: 0;
  color: #676767;
  padding: 3px 8px;
}

.bookmark {
  clear: none !important;
}

.pagezoom, .pagezoom div {
  display: inline-block;
  padding-top: 6px;
  padding-bottom: 6px;
}

.pagezoom a, .pagezoom a:visited {
  color: #676767;
}

.pagezoom i {
  font-size:20px;
  margin-left: 7px;
  margin-right: 7px;
}

.color-sidebar {
  background-color: #CCC;
  border-radius: 3px;
  margin: 2px 5px 0;
  padding: 0 5px 0 10px;
}

.color-sidebar h4 {
  color: #000;
}

.color-sidebar input[type=text] {
  display: inline-block;
  width: 85px;
  height: 26px;
  border-radius: 0;
}

.bgcolor_div, #bgcolor1, #bgcolor2_div {
  margin-bottom: 5px;
}

.colorspot {
  position: relative;
  display: inline-block;
  width: 26px;
  height: 26px;
  border: 1px solid #676767;
  background-color: #FFF;
  top: 8px;
}

.colpick {
  position: relative;
  z-index: 9999;
}

/* page3 comments */
#comments p {
  font-size: 13px;
}

/* Need the iframe to be "scrollable" on iOS */
@supports (-webkit-overflow-scrolling: touch) {
  #templatecontentdiv {
    -webkit-overflow-scrolling: touch;
    overflow-y: scroll !important;
  }
}

/* Bootstrap overrides */
a, .link-color {
  color: #001d59;
}
.alert-success {
  background-color: #ebebeb;
  border-color: #00acaf;
  color: #000;
}

/* Accessibility contrast fixes */
.btn-success {
  background-color: #357935;
  border-color: #255625;
}
.btn-success:hover, .btn-success:focus {
  background-color: #306d30;
  border-color: #204a20;
}
.btn-warning, .btn-warning:hover, .btn-warning:focus {
  color: #000;
}
.btn-danger {
  background-color: #ca302c;
  border-color: #a02622;
}
.btn-danger:hover, .btn-danger:focus {
  background-color: #bc2d28;
  border-color: #92231f;
}

/* Page 3 Specific ------------------------------------------------------------ */
.alert-page3 .btn-sm {
  border-radius: 0;
  padding: 4px 8px;
  text-decoration: none;
}
.page3-proceed {
  color: #000;
  text-decoration: underline;
}

.label-page3 {
  background-color: #497a0d;
  border-color: #2e4c08;
  color: #fff;
  display: inline-block;
  font-size: 100%;
  font-weight: normal;
  padding: .5em .75em;
  white-space: normal;
}
a.label-page3[href]:hover, a.label-page3[href]:focus {
  background-color: #497a0d;
  border-color: #2e4c08;
  color: #fff;
}