@charset "utf-8";
/*headline:font-family: 'Bree Serif', serif;
paragraph: font-family: 'Signika Negative', sans-serif;
*/

body {font-family: 'Bree Serif', serif;
	background-color: #FCFBF7;
}
h1, h2, h3, h3, h4, h5, h6 {font-family: 'Signika Negative', sans-serif;
	color: #403837;
}
p {
	color: #73655D;
}
.navbar-custom {font-family: 'Signika Negative', sans-serif;
}
li {
	color: #73655D;
}
a {
	color: #D99E32;
}

/*Acquarian pastels
purple: #6B2A59;
light blue: #61C1D9;
soft mint: #9EE0D7;
soft yellow: #E4E5C3;
soft pink: #FFC0CB;
*/

/*Plain smooth gray paper background
black: #000000;
grey: #737373;
soft grey: #BFBFBF;
lighter grey: #D9D9D9;
white: #FCFCFC;
*/

/*Sand color theme
Darker Brown: #403837;
Medium Brown: #73655D;
Light brown: #BFA89B;
Brown: #A68F81;
Super light brown:#D9C3B0;
bacground brown: #FCFBF7;
red: #F20505;
Gold: #D99E32;
*/

/* Background color for navbar and dropdown menus */
.navbar-custom, .navbar-custom .dropdown-menu {
    background-color: #A68F81;
}
/* Text color for navbar and dropdown menus */
.navbar-custom .navbar-brand, .navbar-custom .navbar-text,
.navbar-custom .navbar-nav .nav-link,
.navbar-custom .dropdown-item {
    color: #FCFCFC;
}
/* Background and text colors for current page link and links on hover and focus */
.navbar-custom .nav-item.active .nav-link,
.navbar-custom .nav-item:hover .nav-link,
.navbar-custom .nav-item:focus .nav-link,
.navbar-custom .dropdown-item:hover, 
.navbar-custom .dropdown-item:focus {
    background-color: #403837;
    color: #FCFCFC;
}
/* Border and text colors for menu icon on small screens */
.custom-toggler.navbar-toggler {
    border-color: #FCFCFC;
    color: #FCFCFC;
}
/* Hamburger icon - use same rgb values as previous rule for stroke */
.custom-toggler .navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,255,255,0.70)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}

/*navbar-brand logo
.navbar-brand {
	background-image: url("../images/logo.png");
	background-repeat: no-repeat;
	padding-left: 60%;
	background-position: 60% center;
	background-size: 30px auto;
}*/

.navbar-brand {
	background-image: url("../images/logo-rvd.png");
	background-repeat: no-repeat;
	background-size: 25px auto;
	background-position: 7% center;
	padding-left: 45px;
}

/*header banner section*/
#HomeBanner {
	padding-left:0px;
	padding-right: 0px;
	position: relative;
}

/*rem value are relative to the root html element, 1rem=16px*/
#HomeBanner h1 {
	font-size: 4rem;
	color: #fff;
	position: absolute;
	
}

.btn-main {
	background: #403837;
	color: #FCFCFC;
}

/*2col main section*/
#main_box1, main_box2 {
	padding: 40px;

	}

#main_box1 {
	margin: 20px;
}
#main_box2 {
	border: solid thin;
	background: #E4E5C3;
	}

/*2col main section image*/
#main_image1 {
	text-align: center;
	padding: 20px 20px;
	margin-top: 20px;
}

#main_image2 {
	text-align: center;
	padding: 20px 20px;
	margin-top: 20px;
}

#main_image3 {
	text-align: center;
	padding: 20px 20px;
	margin-top: 20px;
}

.embed-responsive-16by9 {
	align-content: center;
	padding: 20px 20px;
	margin: 20px 35px;
	margin-right: 35px;
}
#menu {
	padding: 20px 20px;
	margin-top: 20px;
}

.weavy {
	position: relative;
	}
.weavy span {
	position: relative;
	display: inline-block;
	color: #D99E32;
	font-size: 2.5em;
	animation: animate 1s ease-in-out infinite;
	animation-delay: calc(0.1s * var(--i)); 
	}
@keyframes animate {
	0%
	{transform: translateY(0px);}
	20%
	{transform: translateY(-20px);}
	40%,100%
	{transform: translateY(0px);}
}

/*about banner section*/
#about_banner {
	padding-left: 0px;
	padding-right: 0px;
	position: relative;
}
	
#about_banner h1 { 
	font-size: 4rem;
	color: #FCFCFC;
	text-shadow: 1px 1px #707070;
	position: absolute;
	left: 45%;
	bottom: 40%;
}
	
#about_heading h1 {
	font-size: 1.5rem;
	padding-top: 1%;
	padding-left: 20%;
	padding-right: 20%;
	margin:40px 50px;
	position: relative;
	color: #D99E32;
}

#about_box{
	padding: 3px 5px;
	

}
#about_box1 {
	border: solid thin #2D2D2D;
	padding: 3px 5px;
	margin-top: 20px;
	}
#about_box2 {
	border: solid thin #2D2D2D;
	padding: 3px 5px;
	margin-top: 20px;
	
}
#about_box3 {
	border: solid thin #2D2D2D;
	padding: 3px 5px;
	margin-top: 20px;
}


#infographic {
	background:  #403837;
	padding: 3px 5px;
	margin-top: 20px;
	}
#infographic h4 {
	color: #FCFCFC;
}
#info1 {
	color: #FCFCFC;
}
#info2 {
	color: #FCFCFC;
}
#info3 {
	color: #FCFCFC;
}

#about_hobby {
	padding: 20px 20px;

}

#about_hobby1 {
	border: solid thin #403837;
	margin-bottom: 20px;
}

.media-body {
	padding-left: 20px;
}

.container {
   position: relative;
   width: 100%;
   padding-right: 15px;
   padding-left: 15px;
}

#resumeBody {
	padding: 30px;
}

#resumeEducation {
	padding: 30px;
}
.progress-bar{
	background: #403837;
}

#WorkExperience {
	padding: 30px;
	text-align: center;
}
#WorkExperience1 {
	padding-right: 10px;
}

#WorkExperience2 {
	padding-right: 10px;
}

.badge{
	margin-left: 10px;
}

.badge-1 {
	background: #403837;
	color: #FCFCFC;
}
#WorkExperience1 p {
	margin-left: 10px;
}

#WorkExperience2 p {
	margin-left: 10px;
}

#hs-p {
	padding: 3px 5px;
	margin-top: 20px;
}

#hs-img {
	padding: 3px 5px;
	margin-top: 20px;
}

#hs-mid-sec {
	border: solid thin #403837;
	padding: 3px 5px;
	margin-top: 35px;
	background: #403837;
	}
#hs-mid-sec h2 {
	color: #FCFCFC;
}
.mid-prot {
	padding: 3px 5px;
	margin-top: 45px
}

#hs-e {
	padding: 3px 5px;
	margin-top: 45px;
}

#mid-prot-rwb {
	padding: 3px 5px;
	margin-top: 45px;
}

#rwb-mid-sec {
	border: solid thin #403837;
	padding: 3px 5px;
	margin-top: 35px;
	background: #403837;
}

#rwb-mid-sec h2 {
	color: #FCFCFC;
}

#add-sec {
	border: solid thin #403837;
	padding: 3px 5px;
	margin-top: 35px;
	background: #403837;
}
#add-sec h2 {
	color: #FCFCFC;
}

#add-sec2 {
	padding: 3px 5px;
	margin-top: 35px;
}

#ifrg-mid-sec {
	border: solid thin #403837;
	padding: 3px 5px;
	margin-top: 35px;
	background: #403837;
	}

#ifrg-mid-sec h2 {
	color: #FCFCFC;
}
.ifrg-mid-prot {
	padding: 3px 5px;
	margin-top: 30px;
}

#ifrg-e {
	padding: 3px 5px;
	margin-top: 45px;
}

#ifrg-e2 {
	padding: 3px 5px;
	margin-top: 45px;
}

#dd-mid-sec {
	border: solid thin #403837;
	padding: 3px 5px;
	margin-top: 35px;
	background: #403837;
	}
#dd-mid-sec h2 {
	color:  #FCFCFC;
}

#dd-sketch {
	padding: 3px 5px;
	margin-top: 45px;
}

#dd-add {
	padding: 3px 5px;
	margin-top: 45px
}

#dd-third{
	padding: 3px 5px;
	margin-top: 45px;
}

#dd-end {
	padding: 3px 5px;
	margin-top: 45px;
}

#ow-mid-sec {
	border: solid thin #403837;
	padding: 3px 5px;
	margin-top: 35px;
	margin-bottom: 35px;
	background: #403837;
	}
	
#ow-mid-sec h2 {
	color:  #FCFCFC;
}

.mid-wo {
	align-items: center;
}

#wo-third {
	padding: 3px 5px;
	margin-top: 45px;
}

#wo-image {
	padding: 3px 5px;
	margin-top: 45px;
	margin-bottom: 45px;
}

.copal-wo {
	padding: 3px 5px;
	margin-top: 45px;
}

#wo-e {
	padding: 3px 5px;
	margin-top: 45px;
	}

#wo-img {
	padding: 3px 5px;
	margin-top: 45px;
}
#wo-ca {
	padding: 3px 5px;
	margin-top: 45px;
}

/* washington wine section*/

#ww-mid-sec {
	border: solid thin #403837;
	padding: 3px 5px;
	margin-top: 35px;
	margin-bottom: 35px;
	background: #403837;
	}
#ww-mid-sec h2 {
	color:  #FCFCFC;
}

#ww-ts {
	padding: 3px 5px;
	margin-top: 45px;
}

#ww-end {
	padding: 3px 5px;
	margin-top: 45px;
}

#ww-add {
		overflow: hidden;
}
#ww-add img {
	width: 100%;
	transition: 1s;
	}

#ww-add img:hover {
	transform: scale(4);
	cursor: pointer;
	
}

/* glory candle section*/

#gc-mid-sec {
	border: solid thin #403837;
	padding: 3px 5px;
	margin-top: 35px;
	margin-bottom: 35px;
	background: #403837;
}

#gc-mid-sec h2 {
	color:  #FCFCFC;
}

#gc-ts {
	padding: 3px 5px;
	margin-top: 45px;
}

#gc-e {
	padding: 3px 5px;
	margin-top: 45px;
}

/* Washington Renaissance Festival Poster*/

#wrf-mid-sec {
	border: solid thin #403837;
	padding: 3px 5px;
	margin-top: 35px;
	margin-bottom: 35px;
	background: #403837;
}

#wrf-mid-sec h2 {
	color:  #FCFCFC;
}

#wrf-third {
	padding: 3px 5px;
	margin-top: 45px;
}

#wrf-end {
	padding: 3px 5px;
	margin-top: 45px;
}

#wrf-ca {
	padding: 3px 5px;
	margin-top: 45px;
}

/* Motion Graphic Portfolio*/

#pmg-mid-sec {
	border: solid thin #403837;
	padding: 3px 5px;
	margin-top: 35px;
	margin-bottom: 35px;
	background: #403837;
}

#pmg-mid-sec h2 {
	color:  #FCFCFC
}

#pmg-third {
	padding: 3px 5px;
	margin-top: 45px;
}

#pmg-end {
	padding: 3px 5px;
	margin-top: 45px;
}

#pmg-ca {
	padding: 3px 5px;
	margin-top: 45px;
}

/* Contact Page */
#contactHeader {
	padding-top: 50px;
	padding-bottom: 20px;
}

.contact_head {
	color: #6B2A59;
	font-weight: 900;
}

.contact_side {
	background: white url("../images/Artboard 1@2x.png") no-repeat
		center center;
	background-size: cover;
	padding: 0;
	height: 540px;
}


/* Style all font awesome icons */
.fa {
  padding: 10px;
  font-size: 30px;
  width: 40px;
  margin-right: 5px;
  text-align: center;
  text-decoration: none;
}

/* Add a hover effect if you want */
.fa:hover {
  opacity: 0.7;
}

#SocialMedia {
	padding: 20px;
	margin: 10px;
	width: 35%;
	}

/* Set a specific color for each brand */

/* Facebook */
.fa-facebook-f {
  background: #3B5998;
  color: white;
  }

/* Instagram */
.fa-instagram {
  background: #3B5998;
  color: white;
}

/* LinkedIn */
.fa-linkedin {
	background:#3B5998;
	color: white;
}

/*footer*/
#footer { text-align: center;
	line-height: 60px;
	background-color: #A68F81;
	color: #FCFCFC;
	margin-top: 2%;
	}

/*Media Query Breakpoints*/
/*X-SMALL ONLY*/
@media screen and (min-width:375px){
#HomeBanner h1 {
    font-size: 1rem;
    bottom: 40%;
    left: 40%;
    }    
}


/*SMALL SIZE ONLY*/
@media screen and (min-width:576px){
#HomeBanner h1 {
    font-size: 2rem;
    bottom: 40%;
    left: 35%;
    }    
}

/*MEDIUM SIZE ONLY*/
@media (min-width: 768px) {
  #HomeBanner h1 {font-size: 3rem;
               left: 30%;
			bottom: 35%;
              }
  }


/*LARGE SIZE ONLY*/
@media screen and (min-width:992px){
    #HomeBanner h1 {
        font-size: 4rem;
        left: 30%;
		bottom: 35%;
        }
}

/*Media Query Breakpoints*/
/*X-SMALL ONLY*/
@media screen and (min-width:375px){
	#about_banner h1 {
	font-size: 1rem;
    bottom: 45%;
    left: 40%;
	}
}
/*SMALL SIZE ONLY*/
@media screen and (min-width:576px){
#about_banner h1 {
    font-size: 2rem;
    bottom: 45%;
    left: 40%;
    }    
}

/*MEDIUM SIZE ONLY*/
@media (min-width: 768px) {
#about_banner h1 {font-size: 3rem;
               left: 45%;
			bottom: 40%;
              }
  }


/*LARGE SIZE ONLY*/
@media screen and (min-width:992px){
 #about_banner h1 {
        font-size: 4rem;
        left: 45%;
		bottom: 40%;
        }
}