/*
    To change this license header, choose License Headers in Project Properties.
    To change this template file, choose Tools | Templates
    and open the template in the editor.
*/
/*
    Created on : Jan 12, 2020, 8:06:15 PM
    Author     : DantheManwiththePlan
*/
/* _______________________ begin variables in body ___________________________ */
/* _______________________ end variables in body ___________________________ */
/* _______________________ begin variables in header ___________________________ */
/* _______________________ end variables in header ___________________________ */
/* _______________________ begin variables in content ___________________________ */
/* begin content container variables */
/* end content container variables */
/* begin carousel variables */
/* end carousel variables */
/* begin gallery variables */
/* end gallery variables */
/* _______________________ end variables in content ___________________________ */
/* _______________________ begin variables in footer ___________________________ */
/* _______________________ end variables in footer ___________________________ */
/* _____________________________________________________________________________ */
/* _______________________ begin styles in body ___________________________ */
body {
  display: block;
  font: 14px Verdana;
  font-weight: normal;
  margin: 0; }

/* _______________________ end styles in body ___________________________ */
/* _______________________ begin styles in header ___________________________ */
#header {
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  height: auto;
  display: block;
  overflow: visible;
  padding: 0px; }

#menu_container {
  position: absolute;
  top: 0px;
  right: 0px;
  width: auto;
  height: auto;
  display: block;
  overflow: visible;
  padding: 0px 30px 0px 15px;
  z-index: 2; }

.menu {
  float: left;
  padding: 10px;
  font-weight: normal;
  cursor: pointer; }

.moremenu:link {
  font: inherit;
  text-align: center;
  text-decoration: none;
  padding: 3px 7px;
  color: #fff;
  background-color: #000;
  opacity: 0.7;
  border: solid 1px yellow;
  border-radius: 2px;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px; }

.moremenu:visited {
  font: inherit;
  text-align: center;
  text-decoration: none;
  padding: 3px 7px;
  color: #1C3E8C;
  border: solid 1px #CCC;
  border-radius: 2px;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px; }

.moremenu:hover {
  text-decoration: none;
  color: #5A7A9B;
  border: solid 1px #666;
  border-radius: 2px;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px; }

#ul_Rep {
  position: relative;
  left: 0;
  top: 5px;
  margin: 0;
  padding: 0; }

#ul_Rep li {
  margin: 0;
  padding: 0;
  list-style: none;
  float: left;
  font: inherit; }

#ul_Rep div {
  position: absolute;
  margin: 0;
  padding: 0;
  border: solid 1px #DE9292; }

#ul_Rep div a {
  position: relative;
  display: block;
  margin: 0;
  padding: 5px 10px;
  white-space: nowrap;
  text-align: left;
  text-decoration: none;
  background: #C43434;
  color: #FFF;
  font: inherit; }

#ul_Rep div a:hover {
  background: #DE9292;
  color: #FFF; }

.menuactive:link {
  background-color: green;
  opacity: 0.7; }

/* _______________________ end styles in header ___________________________ */
/* _______________________ begin styles in content ___________________________ */
#content {
  position: relative;
  left: 0px;
  top: auto;
  width: auto;
  height: auto;
  display: block;
  overflow: hidden;
  margin: 0 0 auto;
  border: solid 2px yellow;
  padding-bottom: 30px;
  margin-top: 10em;
  z-index: 1; }

/* begin content container styles */
.container {
  position: relative; }

@media screen and (min-width: 450px) {
  .container {
    margin-top: -1em; } }
@media screen and (min-width: 600px) {
  .container {
    margin-top: 4em; } }
@media screen and (min-width: 800px) {
  .container {
    margin-top: 7em; } }
@media screen and (min-width: 1000px) {
  .container {
    margin-top: 10em; } }
@media screen and (min-width: 1200px) {
  .container {
    margin-top: 15em; } }
@media screen and (min-width: 1400px) {
  .container {
    margin-top: 19em; } }
@media screen and (min-width: 1600px) {
  .container {
    margin-top: 23em; } }
/* end content container styles */
/* begin carousel styles */
.gallery {
  margin: 4% auto;
  width: 210px;
  height: 140px;
  position: relative;
  perspective: 1000px; }

#carousel {
  width: 100%;
  height: 100%;
  position: absolute;
  transform-style: preserve-3d;
  animation: rotation 20s infinite linear; }

#carousel:hover {
  animation-play-state: paused; }

#carousel figure {
  display: block;
  position: absolute;
  width: 90%;
  height: 78%;
  left: 10px;
  top: 10px;
  overflow: hidden;
  border: solid 5px #c71730; }

#carousel figure:nth-child(1) {
  transform: rotateY(0deg) translateZ(288px); }

#carousel figure:nth-child(2) {
  transform: rotateY(45deg) translateZ(288px); }

#carousel figure:nth-child(3) {
  transform: rotateY(90deg) translateZ(288px); }

#carousel figure:nth-child(4) {
  transform: rotateY(135deg) translateZ(288px); }

#carousel figure:nth-child(5) {
  transform: rotateY(180deg) translateZ(288px); }

#carousel figure:nth-child(6) {
  transform: rotateY(225deg) translateZ(288px); }

#carousel figure:nth-child(7) {
  transform: rotateY(270deg) translateZ(288px); }

#carousel figure:nth-child(8) {
  transform: rotateY(315deg) translateZ(288px); }

#carousel figure:nth-child(9) {
  transform: rotateY(360deg) translateZ(288px); }

#carousel img {
  -webkit-filter: grayscale(0);
  cursor: pointer;
  transition: all 0.5s ease;
  width: 100%; }

#carousel img:hover {
  -webkit-filter: grayscale(0.8);
  transform: scale(1.2, 1.2); }

@keyframes rotation {
  from {
    transform: rotateY(0deg); }
  to {
    transform: rotateY(360deg); } }
.button_contain {
  position: absolute;
  bottom: 0px;
  left: 0px;
  width: auto;
  height: auto;
  visibility: hidden;
  overflow: visible;
  background-color: #000;
  opacity: 0.7;
  z-index: 2; }

.img_button_link {
  width: auto;
  height: auto;
  display: block;
  overflow: hidden;
  background-color: #000;
  border: solid 1px #fff;
  border-radius: 3px;
  -moz-border-radius: 3px;
  padding-left: 2px;
  padding-right: 2px; }

.img_button_text {
  font-family: arial;
  font-size: 8pt;
  color: #fff;
  line-height: 0px; }

/* end carousel styles */
/* begin gallery styles */
#content_container {
  position: relative;
  top: auto;
  left: 0px;
  width: auto;
  height: auto;
  display: table;
  overflow: hidden;
  margin: 0px auto;
  margin-top: 6em; }

.content_col {
  width: auto;
  height: auto;
  display: table;
  overflow: hidden;
  float: left; }

.sub_col {
  width: auto;
  height: auto;
  display: block;
  overflow: hidden;
  float: left;
  padding-left: 10px;
  padding-right: 10px;
  padding-top: 5px;
  padding-bottom: 5px; }

.galimage {
  width: 29em;
  height: auto;
  display: block;
  overflow: hidden; }

.galintrotext {
  font-family: arial black;
  font-size: 16pt;
  letter-spacing: 2px;
  text-align: center; }

@media (min-width: 576px) {
  .galimage {
    max-width: 35em; } }
/* end gallery styles */
/* _______________________ end styles in content ___________________________ */
/* _______________________ begin styles in footer ___________________________ */
#footer {
  position: relative;
  top: auto;
  left: 0em;
  width: auto;
  height: auto;
  display: block;
  overflow: hidden;
  background-color: #000;
  border-top: solid 5px #ddf7db;
  z-index: 1;
  margin-top: 50px; }

#soci {
  width: 20em;
  height: auto;
  display: table;
  margin: 0 auto; }

.soci {
  width: 16.6%;
  height: auto;
  overflow: hidden;
  float: left; }

.mine {
  color: #bd2e28;
  text-align: center; }

/* _______________________ end styles in footer ___________________________ */

/*# sourceMappingURL=mainsass_photoSITE.css.map */