@charset "utf-8";
/*font-family: "magistral", sans-serif;
font-weight: 700;
font-style: normal;
*/
/*
font-family: "adobe-myungjo-std", sans-serif;
font-weight: 500;
font-style: normal;
*/
/*colors
saturated light blue #4ccdfa
desaturated light blue #b7e3fa
dark blue #007dfa
white #ffffff
black #241322
*/

/* Background color for navbar and dropdown menus */
.navbar-custom, .navbar-custom .dropdown-menu {
    background-color: #b7e3fa;
}
/* 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: #241322;
}
/* 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: #4ccdfa;
    color: #fff;
	height:120%;
	
}

/* Border and text colors for menu icon on small screens */
.custom-toggler.navbar-toggler {
    border-color: rgba(0,0,0,1.00);
    color: #241322;
}
/* 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(0,0,0, 255)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}

.navbar-brand {
    background-image: url(../Images/CrossfireArtLogo.png);
    background-repeat: no-repeat;
    background-size: 204px auto;
    background-position: left center;
    background-clip: padding-box;
    background-origin: padding-box;
    visibility: visible;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 0px;
    padding-left: 215px;
    font-family: "magistral", sans-serif;
font-weight: 0;
font-style: oblique; 
}
.col-sm {
    font-family: "adobe-myungjo-std", sans-serif;
font-weight: 500;
font-style: normal;
}

.nav-link     {
    font-family: "magistral", sans-serif;
font-weight: 700;
font-style: normal;
}

.navbar-nav .mr-auto{display: flex;
justify-content: flex-end;}

/*Header*/



#Port_head {
	padding-top: 20px;
	padding-left: 0px;
	/*padding-right: 800px;*/
	position: relative;
	width: 50px;
	max-width: 35%;
	min-width: 35%;
}



#Port_head h1{
	position:absolute;
	left: 2%;
	font-size:50pt;
	
	font-family: "magistral", sans-serif;
	font-weight: 700;
	font-style: normal;
	color:#ffffff;
	text-shadow: 3px 0px #007dfa ;
}

#h1 {font-size:50pt;
	
	font-family: "magistral", sans-serif;
font-weight: 700;
font-style: normal;}


/* Body heading*/


footer{text-align:center;
line-height:30px;
background-color:#241322;
color:#ffffff;
}

#body {font-family: "magistral", sans-serif;
font-weight: 700;
	font-style: normal;}

#foot_links {display: flex;
flex-direction: row;
	justify-content: space-around;
}


 /*Media Query Breakpoints*/

 /*Media Query Breakpoints*/
@media screen and (min-width:1px){
#home_banner h1 {
    left: 50%;
	bottom:50%;
	font-size:10pt;
    }    
}

/*X-SMALL ONLY*/
@media screen and (min-width:375px){
#home_banner h1 {
    left: 50%;
	bottom:50%;
	font-size:20pt;
    }    
}

@media screen and (min-width:576px){
#home_banner h1 {
    left: 50%;
	bottom:50%;
	font-size:25pt; }    
}

/*MEDIUM SIZE ONLY*/
@media (min-width: 768px) {
  #home_banner h1 {left: 50%;
	bottom:50%;
	font-size:40pt;
              }
  }


/*LARGE SIZE ONLY*/
@media screen and (min-width:992px){
    #home_banner h1 {
       left: 50%;
	bottom:50%;
	font-size:50pt;
        }
}

/*portfolio*/
@media screen and (min-width:1px){
#Port_head h1 {
   font-size: 10pt;
    
    }    
}

@media screen and (min-width:1px){
#Port_head {
   max-width: 35%;
	min-width: 35%;
        }  
}


/*X-SMALL ONLY*/
@media screen and (min-width:375px){
#Port_head h1 {
     
	font-size: 20pt;
	top: 44%;
	}    
}

@media screen and (min-width:375px){
#Port_head {
   max-width: 50%;
	min-width: 50%;
	 
        }  
}


@media screen and (min-width:576px){
#Port_head h1 {
    font-size: 30pt;
	top: 30%;}    
}

@media screen and (min-width:576px){
#Port_head {
   max-width: 50%;
	min-width: 50%;
	 
        }  
}

/*MEDIUM SIZE ONLY*/
@media screen and (min-width:768px){
#Port_head h1 {
    font-size: 40pt;
	top: 23%;
 	 }    
}

@media screen and (min-width:768px){
#Port_head {
   max-width: 43%;
	min-width: 43%;
	 
        }  
}

@media screen and (min-width:992px){
#Port_head h1{
    font-size: 50pt;
    background-size: 400px auto; }    
}

@media screen and (min-width:992px){
#Port_head {
   max-width: 40%;
	min-width: 40%;
	 
        }  
}

@media screen and (min-width:1200px){
#Port_head {
   max-width: 30%;
	min-width: 30%;
	 
        }  
}

@media screen and (min-width:576px){
.col-sm-4 h2{
	font-size:14pt; }    
}

@media screen and (min-width:768px){
.col-sm-4 h2{
	font-size:20pt; }    
}


@media screen and (min-width:375px){
#t2{ display:flex;
	flex-direction: column-reverse;
	   }  
}

@media screen and (min-width:576px){
.col-sm-6{ font-size: 12pt
	   }  
}

@media screen and (min-width:768px){
.col-sm-6{ font-size: 15pt
	   }  
}

@media screen and (min-width:992px){
.col-sm-6{ font-size: 15pt
	   }  
}

@media screen and (min-width:375px){
#body .img-fluid  { width: 250px;
	display: flex;
	align-items: center;
	justify-content: space-around;
	   }  
}

@media screen and (min-width:375px){
#body .img-fluid  { width: 250px;
	display: flex;
	align-items: center;
	justify-content: space-around;
	   }  
}



@media screen and (min-width:576px){
#t2{ display:flex;
	flex-direction: row;
	   }  
}