/* Name:Rodney Bradshaw
 Class:Class:WEB 289
        Date:3/5/2026  
/* imports*/
@import url("https://fonts.googleapis.com/css2?family=Russo+One&display=swap");
svg {
	font-family: "Russo One", sans-serif;
}
/* Body*/
html, body {
    height: 100%;
    margin:0;
    padding:0;
    background-color: #C4EFDE;
    overflow-x: hidden;
  }
main{background-color: #88a3aa;
  /*background-color: #88a3aa;*/
}
  /* Navigation */
.navbar-brand {
    font-family: 'Courgette', cursive;
}
  .brand{
    font-size:calc(1.275rem + 0.3vw) !important;
  }
@media screen and  (max-width: 419px){
  .brand{
    font-size: 18px !important;
  }
}
.btn-hover:hover {
color:#ffffff !important;
}
.navbarcolor {
  background: linear-gradient(-45deg,#015c92,#2d82b5,#010E1F,#000011);
  background-size: 400% 400%;
  animation: gradient-animation 15s ease infinite;
}
@keyframes gradient-animation {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}
.nav-link{
  color: #FFD43B !important;
}
.nav-link:hover{
  color:#ffffff !important;
}
/*Modal*/
.modal-header{
 background-color: #C4EFDE;
}
.modal-footer {
  background-color: #015c92 !important;
}
/* Social nav */
ul{
  list-style-type: none;
}
.social{
  color:white;
}
.social:hover {
transform: scale(1.50) !important;
color:#FFD43B;
padding:5px;
}
/* hidden nav image animation */
@media (max-width: 339px) {
  #spin {
    display: none !important;}
}
#spin{
  border: 2px solid #FFD43B !important;
  border-radius: 50% !important;
	animation: rotateAnimation 5s linear infinite !important;
}
@keyframes rotateAnimation {
  from {transform: rotateY(0deg) ;}
	to {transform: rotateY(360deg) ;}
}
/* Carousel */

#myCarousel{
background-color:#C4EFDE;
} 

.carousel-caption {
    background: rgba(0, 0, 0, 0.2);
  border-radius: 20px;
}
.carousel-item {
  height: 32rem;
}
.carousel-caption {
  z-index: 10;
}
@media (max-width: 766px) {
  .carousel_img {
    margin-top: 70px !important;
  }
}
@media (max-width: 437px) {
  .carousel_img {
    margin-top: 0px !important;
  }
  #myCarousel{
    margin-top: -50px;
  }
  .carousel-item {
    height: 35rem;
  }
  .fs-xs{
    font-size: 22px;
  }
}
@media (min-width: 1400px) {
  .fs-lg-4 {
    font-size: calc(1.275rem + 0.3vw) !important;
  }
  .bt-sm { font-size: calc(1.275rem + 0.3vw) !important;
  }
  .mt-lg-5{
    margin-top: 5rem !important;
  }
}
/* home page background*/
/*  from unsplash.com :green tree under blue sky during daytime by J Lee */
#back1{
  background: url(../images/rodney_designs_background.jpg) no-repeat center center fixed;
 }
 /* Quote section *//* image by unsplash.com */
 #back2{
  background: url(../images/background2.jpg) no-repeat center center fixed;
 }
 /*Few of my Works Section*/
 .card{
  transition: all 0.3s;
  }
  .card:hover{
  transform: scale(1.05);
  }
/* Quote section*/
hr.solid {
  border-top: 2px solid #999;
}
/* Font for landing page*/
.roboto-light {
  font-family: "Roboto", sans-serif;
  font-weight: 300;
  font-style: normal;
}
/* About Page */
.mt-6 {
  margin-top: 6rem; 
}
#blob{
  background-size: cover;
  background-position: center center;
  margin: 20px;
  padding: 2px;
  box-shadow: 0 5px 5px 5px rgba(1, 30, 73, 0.6);
  animation: animat 5s ease-in-out infinite !important ;
  transition: all 1s ease-in-out !important;
}
@keyframes animat{
 0%, 100% {
  border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%;
 }
 50% {
  border-radius: 30% 60% 70% 40% / 50% 60% 30% 60%;
 }
}
svg path {
  background: linear-gradient(-45deg,#015c92,#2d82b5,#010E1F,#000011);
  background-size: 400% 400%;
  animation: gradient-blob 15s ease infinite;
}
/* about - skills area*/
.progress{
  min-height: 35px !important;
  background: white !important;
}
/* Portfolio */
svg {
	font-family: "Russo One", sans-serif;
}
svg text {
	animation: stroke 5s infinite alternate;
	stroke-width: 2;
	stroke: #FFD43B;
	font-size: 50px;
}
@keyframes stroke {
	0%   {
		fill: rgba(255,255,255,0.1); stroke: rgba(255,212,59,1);
		stroke-dashoffset: 25%; stroke-dasharray: 0 50%; stroke-width: 2;
	}
	70%  {fill: rgba(255,255,255,0.1); stroke: rgba(255,212,59,1); }
	80%  {fill: rgba(255,255,255,0.1); stroke: rgba(255,212,59,1); stroke-width: 3; }
	100% {
		fill: #000011; stroke: rgba(255,212,59,0);
		stroke-dashoffset: -25%; stroke-dasharray: 50% 0; stroke-width: 0;
	}
}
/* Footer area*/
footer{
  background-color: #FFD43B;
  color: #000011 !important;
}
footer a {
  color: #000011;
}
.footer-social:hover{
  color:white;
}
.mycolor{
  color:#C4EFDE !important;
}
.mycolor1{
  background-color: #000011;
}