/* Gradients */
body {
    -webkit-animation: 6s nuts infinite;
    -webkit-animation-name: nuts; /* keyframes name. */
    -webkit-animation-duration: 6s;
    -webkit-animation-timing-function: ease; /*how the animation transitions through keyframes*/
    -webkit-animation-delay: 0s;        /*delay the start of an animation*/
    -webkit-animation-iteration-count: infinite; /*play the animation two times*/
    -webkit-animation-direction: alternate;  /*alternate direction on each run through the sequence*/
    -webkit-transition: all 0.75s ease;

    -moz-animation-name: nuts; /* keyframes name. */
    -moz-animation-duration: 6s;
    -moz-animation-timing-function: ease; /*how the animation transitions through keyframes*/
    -moz-animation-delay: 0s;        /*delay the start of an animation*/
    -moz-animation-iteration-count: infinite; /*play the animation two times*/
    -moz-animation-direction: alternate;  /*alternate direction on each run through the sequence*/
    -moz-transition: all 0.75s ease;

    -ms-animation-name: nuts; /* keyframes name. */
    -ms-animation-duration: 6s;
    -ms-animation-timing-function: ease; /*how the animation transitions through keyframes*/
    -ms-animation-delay: 0s;        /*delay the start of an animation*/
    -ms-animation-iteration-count: infinite; /*play the animation two times*/
    -ms-animation-direction: alternate;  /*alternate direction on each run through the sequence*/
    -ms-transition: all 0.75s ease;

    -o-animation-name: nuts; /* keyframes name. */
    -o-animation-duration: 6s;
    -o-animation-timing-function: ease; /*how the animation transitions through keyframes*/
    -o-animation-delay: 0s;        /*delay the start of an animation*/
    -o-animation-iteration-count: infinite; /*play the animation two times*/
    -o-animation-direction: alternate;  /*alternate direction on each run through the sequence*/
    -o-transition: all 0.75s ease;

    animation: 6s nuts infinite;
    animation-name: nuts; /* keyframes name. */
    animation-duration: 6s;
    animation-timing-function: ease; /*how the animation transitions through keyframes*/
    animation-delay: 0s;        /*delay the start of an animation*/
    animation-iteration-count: infinite; /*play the animation two times*/
    animation-direction: alternate;  /*alternate direction on each run through the sequence*/
    transition: all 0.75s ease;

    
	background-attachment: fixed !important;
}


body::before, body::after {
    content: '';
    position: fixed;
    width: 60vw;
    height: 60vh;
    border-radius: 50%;
    filter: blur(100px);
    z-index: -1;
    pointer-events: none;
}

body::before {
    top: -20%;
    left: -20%;
    background: radial-gradient(ellipse at center, rgba(124,58,237,0.45) 0%, transparent 70%);
}

body::after {
    bottom: -20%;
    right: -20%;
    background: radial-gradient(ellipse at center, rgba(236,72,153,0.35) 0%, transparent 70%);
}

@keyframes nuts {
    0% { background: linear-gradient(135deg, #0D0B14 0%, #1A1028 50%, #0D0B14 100%) fixed; }
    50% { background: linear-gradient(135deg, #120820 0%, #1D0F2E 50%, #120820 100%) fixed; }
    100% { background: linear-gradient(135deg, #0D0B14 0%, #1A1028 50%, #0D0B14 100%) fixed; }
}

@-webkit-keyframes nuts {
    0% { background: linear-gradient(135deg, #0D0B14 0%, #1A1028 50%, #0D0B14 100%) fixed; }
    50% { background: linear-gradient(135deg, #120820 0%, #1D0F2E 50%, #120820 100%) fixed; }
    100% { background: linear-gradient(135deg, #0D0B14 0%, #1A1028 50%, #0D0B14 100%) fixed; }
}

.carousel-inner .active.left { left: -25%; }
.carousel-inner .next        { left:  25%; }
.carousel-control.left,.carousel-control.right {background-image:none;}
.carousel-control.left,.carousel-control.right {background-image:none;}
.carousel-item { margin:0 auto; width:80%; }

#carouselNuters {
    margin: 15px auto;
}

@media (min-width:100px) {
    #carouselNuters  { width:300px;}
    .carousel-item img {width:31%; }
    .carousel-item {width:70%;}
}

@media (min-width: 1240px) {
    #carouselNuters { width:400px;}
    .carousel-item img {width:31%;}
    .carousel-item {width:70%;}
}
.carousel-item img { margin:0 auto; background-color: white; border-radius: 10px }

label.cameraButton {
  display: inline-block;
  margin: 1em 0;

  /* Styles to make it look like a button */
  background-image: url("../img/Photo.png");
  padding: 0.5em;
  width:250px;
  height:195px;
  background-size: cover;
}

/* Look like a clicked/depressed button */
label.cameraButton:active {
  background-blend-mode:darken;
}

/* This is the part that actually hides the 'Choose file' text box for camera inputs */
label.cameraButton input[accept*="camera"] {
  display: none;
}