
/*-----index-----*/
#Home_container{
    width:98%;
    margin:2% 1%;
}


.DisplayP{
    overflow: hidden;
    width:100%;
    height:70vw;
    margin:2% 0;
}

.DisplayP img{
    width:100%; 
}

.DisplayP:hover img{
    transform: scale(1.1);
    transition: 1.4s;
}

@media(min-width:480px){
    #Home_container{
     display:flex;
    flex-wrap:wrap;
    margin-top:80px;
    }
 
     #Home_container a{
        width:48%;
        margin:1%;
    }
    
    .DisplayP{
        height:34vw;
        } 
    }

@media(min-width:700px){
        #Home_container a{
        width:31%;
        margin:1%;
    }
    
    .DisplayP{
        height:22vw;
        } 
    } 
}

/*-----home_cover_imgs-----*/
/*#C_Murray:hover img{
    transform: scale(1.4);
    transition: 1.4s;}*/

#C_Murray{
margin:-10% 0 0;
} 

#Handy_Fella
/*{width:70%;
margin:-5% 0 0 10%;}*/
{
    margin:-10% 0 0 0;
}

#gorgeNZ
{   width:105%;
    margin: 0 0 0 -4%; 
    
    /*sticker1
    width:75%;
    margin:0% 0 0 14%;*/
    
    /*tshirt
    width:110%;
    margin:-16% 0 0 -5%;*/
}

#adrift
{margin:8% 0 0 0;}

#Letterpress
{width:105%;
margin:0% 0 0 -1%;}

#Fashion
{width:133%;
margin:0 0 0 -15%;} /*-7.2vw top if using dot*/

#Crunch
{width:100%;
margin:0 0 0 0;}

 #Angus
{width:72%;
margin:4% 0 0 15%;}

/*-----interior-----*/
#main{
    width:96%;
    margin:0 2%;
}

#main img{
    width:100%;
}

.description{
    margin:40px 3% 40px;
    /*text-align: center;*/
}

.description a{
    color: #222;
    font-style: italic;
}

.description a:hover{
    color: #5499C7;
}

.description h2{
    margin-bottom: 10px;
    font-size:18px;
    /*width:400px;*/
 font-family: 'Poppins', sans-serif;
}

.description p1{
font-size: 11px;
font-family: 'Poppins', sans-serif;
}
.description ul li{
    list-style: none;
    margin:8px 0 8px -20px;
}
.next_project{
    display: flex;
    justify-content: space-around;
}


.next_project h4{
    margin:30px auto 30px;
}

.next_project h4 a{
    text-decoration: none;
    color: #222;
    padding:0 7px;
    font-family: 'Poppins', sans-serif;
}

.next_project h4 a:hover{
    text-decoration:none;
    color: #5499C7;
}

@media(min-width:400px){
    .description h2{
    font-size:24px;
}

    .description p1{
        font-size: 16px;    
}
    
    iframe{
        height:54vw;
    }
}


@media(min-width:640px){
    #main{
        display: flex;
        flex-wrap: wrap;
        justify-content: space-around;
    align-items: center;
        
    }
    
    #container{
        width: 810px;
        margin: 0 auto;
    }
    
    /*iframe{
        height:400px;
    }*/
}

@media(min-width:840px){
  iframe{
        height:460px;
    }
}


/*-----interior handy-----*/
.H_imgBorder{
    overflow: hidden;
    height:90vw;
}

.H_img2{
    margin:-45% 0 0;
}
/*-----interior handy-----*/
#compare-2{
    /*display: flex;
    justify-content: space-around;
    align-items: center;
    flex-wrap: wrap;*/
}

#compare-2 img{
    width:100%;
}
/*-----fashion-----*/
div #B-Award{
    width:50px;
    position:relative;
    float:right;
    top:-15px;
    left:-20px;
}
/*-----Crunch-----*/
.flavours{
    opacity: 0.8;
    color:#5499C7; 
}
/*-----About pg-----*/
@media(min-width:560px){
    .about_text{
    margin-top:0;
    }
}
/*-----hamburger menu-----*/
  
.navbar-nav a:hover{
    color:#5499C7;

}

.navbar-nav a{
    text-decoration: none;
    color:black;
}

.navbar-nav .active{
    text-decoration: line-through;
    color: #5499C7;
}

  .T_portfolio{
        width:35%;
        max-width:120px;
        /*border:1px solid green;*/
        margin:20px 0 0px 1.5%;
       font-family: 'Playfair Display', serif;
    }

.T_portfolio a{
    color: #222;
    text-decoration: none;
}


.navbar-nav{
    width:auto;
    margin-top:-28px;
    float:right;
    margin-right: 1.5%;
    margin-bottom:40px;
    /*border: 1px solid blue;*/
}

.navbar-nav li{
    list-style: none;
    text-align:center;
    float:left;
    width:70px;
    margin:0 0% 0px;
    font-size: 20px;
    
}



.navbar{
overflow: hidden;
float:right;
width:30px;
height:30px;
margin: -32px 1.5% 40px 0px;
}
/*menu icon*/

.menu-bar{
    width:100%;
    height:1px;
    padding: 1;
}

.navbar a{
  float:right;
  display:block;
  color:#f2f2f2;
  text-align:center;
  text-decoration:none;
}

.navbar ul{
    margin:0px 0 0 0;
    list-style:none;
}

.navbar a:hover path{
    stroke:#5499C7;
}

.side-nav{
    height:100%;
    width:0;
    position:fixed;
    z-index:1;
    top:0;
    right:0;/*left:0 to come from the left*/
    background-color: whitesmoke;
    opacity:1;
    overflow-x:hidden;
    padding-top:;
    transition:0.3s; /*edits menu opening speed*/
}

.side-nav a{
    text-decoration: none;
    font-size:24px;
    padding:3px 0;
    color:black;
    display:block;
    transition:0.3s;
}

.side-nav .active{
    color:#5499C7; /*#D0D3D4*/
}

a.btn-close{
    float:right;
    font-size:50px;
    padding: 8px 15px 0 0px;
}

.side-nav ul{
    float: right;
    list-style: none;
    margin-top:38vh;
    margin-right: 34vw;
    padding:0;
}

.side-nav a:hover{
    color: #5499C7;
}

side-nav .btn-close{
    position:absolute;
    top:0px;
    right:0px;
    font-size:36px;
    
}

#main{
    transition:margin-left 0.5s;
    /*margin:20vw 0 0vw;
    overflow:hidden;
    width:100%;
    /*background-color: blue;*/
}

@media(max-width:500px){
    .navbar-nav{display:none;}

        
   
}

@media(min-width:500px){
    open-slide{display: none;}
    .navbar{display: none;}
    }
