/* Smartphone */
@media screen and (min-width: 0px) and (max-width: 360px){
	
	.page_width{
	    width: 100%;}


/* Tablet */
@media screen and (min-width: 361px) and (max-width: 768px){
	
	.page_width{
	    width: 100%;}

/* Laptop */
@media screen and (min-width: 769px) and (max-width: 1366px){
	
	.page_width{
	    width: 100%;}	
	
		
		.site_navigation{
		    position: fixed;
			margin-top: 0px; }
			
		.site_navigation ul{
            margin-right: 0px;
			background-color: rgba(0, 0, 0, 0.9);
            float: left; }
	
	    .site_navigation .navbar_logo{
            padding-left: 15px;
            width: 100%; }
			
		.site_navigation .show + a, ul{
            display: none; }
			
		.site_navigation ul li, .site_navigation ul ul li{
            display: block;
            width: 100%; }
  
  .site_navigation ul li a:link, .site_navigation ul li a:visited{
        font-size: 1.2rem;	
	    font-weight: 600;
	    font-family: 'Open Sans', sans-serif; 
	    line-height: 65px; }
		
  .site_navigation ul li a:hover{
    box-shadow: none;
  }
  .site_navigation .show{
    display: block;
	color: #faf9f8;
    font-size: 1.2rem;	
	font-weight: 600;
	padding: 0 0.75rem;
	font-family: 'Open Sans', sans-serif; 
	line-height: 65px;
    cursor: pointer;
  }
  .site_navigation .show:hover{
    color: #459fe3;
  }
  .site_navigation .icon{
    display: block;
    color: white;
    position: absolute;
    top: 9px;
    right: 30px;
    cursor: pointer;
  }
  
  .site_navigation .menu_icon {
  display: inline-block;
  cursor: pointer;
  margin-top: 4px;
}

.site_navigation .bar1, .site_navigation .bar2, .site_navigation .bar3 {
  width: 35px;
  height: 5px;
  background-color: #faf9f8;
  margin: 6px 0;
  transition: 0.4s;
}

/* Rotate first bar */
.site_navigation .change .bar1 {
  -webkit-transform: rotate(-45deg) translate(-9px, 6px) ;
  transform: rotate(-45deg) translate(-9px, 6px) ;
}

/* Fade out the second bar */
.site_navigation .change .bar2 {
  opacity: 0;
}

/* Rotate last bar */
.site_navigation .change .bar3 {
  -webkit-transform: rotate(45deg) translate(-8px, -8px) ;
  transform: rotate(45deg) translate(-8px, -8px) ;
}
  
  
  .site_navigation ul ul{
    top: 70px;
    border-top: 0px;
    float: none;
    position: static;
    display: none;
    opacity: 1;
    visibility: visible;
  }
  .site_navigation ul ul a:link, .site_navigation ul ul a:visited{
    padding-left: 40px;
  }
  [id^=btn]:checked + ul{
    display: block;
  }
  .site_navigation ul ul li{

    border-bottom: 0px;
  }
	
}
