body {
    width:100%;
    background-color:#1a2227;
    background-size:100%;
   
}

.container-landing img {
    height:100vh;
    width:100vw;
}

.carousel-inner img{
    height:300px;
}



/*style the navigation bar*/

.navbar-inverse{
    width:100%;
    background-color:#1a2227;
    padding:none;
    border:none;
    margin: 0 auto;
}

.nav li{
    width:auto;
    color:#c6ccc8;
    font-size:20px;
    margin-right:35px;
    margin-top:50px;
    padding: 10px 0 10px 0;
}



.dropdown-menu{
    text-align:center;
    background-color:#1a2227;
    height:380px;
    width:120px;
    padding-top:60px;
    float:left;
    
}
/*.dropdown-item{*/
    .navbar-nav li{
    height:60px;
    color:#c6ccc8;
    font-size:20px;
    display:block;
}

.navbar-collapse .navbar-nav li a:hover{
    color:#fff;
    text-decoration:none;
    /*background-color:#1d1b1b;*/
}
.navbar-inverse:hover{
    padding-bottom:0px;
    cursor:pointer;
}
.logo{
    height:150px;
    width:130px;
    margin:16px;
    padding:0;
}

/*----------------------------main------------------------------*/

.container1{
    background-image:url("boynejewellers4-min.JPG");
    height:500px;
    width:auto;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.container1 p{
    font-size: 22px;
    background-color:rgba(0,0,0,0.5);
    height:500px;
    color:#fff;
    padding:70px;
}

.container2{
    height:120px;
    width:auto;
}

.container2 img{
    height:270px;
    width:320px;
    padding:25px;
}



/*--------------------------footer-------------------------------*/



.call-outs-container{
    text-align:left;
    height:210px;
    margin:20px auto;
    background-color:#1a2227;
    color:#fff;
    margin-bottom:20px;
    margin-top:120px;
}

.call-out{
    box-sizing:border-box;
    margin-bottom:30px;
    
}

.call-out img{
    height:200px;
    width:180px;
    padding:30px;
    margin-left:50px;
}

.call-out-1{
    box-sizing:border-box;
    margin-bottom:20px;
    flex-basis:30%;
    font-size:1em;
    margin-top:35px;
    line-height:2.0;

}

.call-out-1 .fas{
    color:rgb(155, 124, 77);
    font-size:1.2em;
}

.call-out-1 .far{
    color:rgb(155, 124, 77);
    font-size:1.2em;
}

.call-out-2{
    box-sizing:border-box;
    margin-bottom:20px;
    flex-basis:30%;
    font-size:1.8em;
    margin-left:60px;
    margin-top:35px;
}

.call-out-2 a{
    text-decoration:none;
}

.facebook{
    font-size: 22px;
}

.budget-footer{
    letter-spacing:0px;
}

.reserved{
    font-size:.5em;
    letter-spacing:0px;
}


/*---------------------------------------nest hub max 1280px-----------------------------------*/

@media(max-width:1280px){
    body{
        height:3500px;
    }
 
    .container1{
        width:auto;
        height:auto;
        text-align:center;
        margin:auto;
       
    }

    .container2 {
        margin-left:20px;
    }
    #containerTwo2{
        margin-left:0px;
    }

    .logo{
        display:visible;
        height:150px!important;
    }
    .footer{
        height:400px;
    }
    .call-out img{
        height:170px!important;
    }
}

/*------------------------------------------nest hub/ ipad pro 1024px----------------------------*/

@media(max-width:1024px){
    body{
        height:5000px;
    }
    .container1{
        width:100%!important;
    }
 
    .container1 p{
        width:auto!important;
        height:auto;
        text-align:center;
        margin:auto;
       
    }
    
    .container2 img{
        width:400px;
        margin-left:35px!important;
        padding:20px 10px;
    }
    
    .call-out img{
        width:160px;    
    }

    .call-out-1{
        margin-left:-10px!important;
    }

    .call-out-2{
        margin-left:-10px!important;
    }
    
}

/*-------------------------------------------Surface prp 7  912px------------------------------------*/
@media(max-width:912px){
    body{
        height:6000px;
    }
    .container2 {
        margin-left:-20px;
    }
    .call-out img{
        width:200px;
        height:220px!important;
        margin-left:-40px;
    }
    .footer{
        height:1500px;
        margin-left:80px;
    }
}

/*-------------------------------------------i pad Air  820px------------------------------------*/
@media(max-width:820px){
    .container2 img{
        margin-left:15px!important;
    }
    .call-out-2{
        height:600px!important;
    }
    .call-out img{
        width:200px;
        height:220px!important;
        margin-left:-40px;
    }
}

/*-------------------------------------------i pad 768px------------------------------------*/
@media(max-width:768px){
.container2 img{
    width:320px;
    margin-left:50px!important;
    padding:20px 0px;
}

.call-out img{
    width:200px;
    height:220px!important;
    margin-left:-30px;
}
.call-out-1{
    margin-left:0px!important;
}

.call-out-2{
    margin-left:0px!important;
    padding-bottom:30px;
}

}

/*-------------------------------------------surface duo 540px------------------------------------*/
@media(max-width:540px){
.container1 p{
    height:700px;
    }
    .container2 img{
        margin-left:130px!important;
    }
    .footer{
        height:800px;
        margin-left:30px;
    }
    .call-out img{
        height:240px!important;
        margin-left:175px!important;
    }
    .call-out-1{
        margin-left:115px!important;
    }
    .call-out-2{
        margin-left:115px!important;
    }
}

/*-------------------------------------------mobile phones 480px------------------------------------*/
@media(max-width:480px){
    .logo{
        height:60px!important;
        width:60px!important;
    }
    .container1{
        height:1400px;
    }
    .container1 p{
        height:1200px;
    }
    .container2{
        margin-left:-80px!important;
    }
    .call-out-2{
        height:600px!important;
    }
    .call-out img{
        height:200px!important;
        width:200px;
        margin-left:60px!important;
    }
    .call-out-1{
        margin-left:20px!important;
    }
    .call-out-2{
        margin-left:20px!important;
    }
}
/*--------------------------------------pixel 2------pixel 2 xl 411px------------------------------------*/
/*@media(max-width:414px){
    .container1 p{
        height:1000px;
        background-color: rgba(0,0,0,0.5);
        text-align:center;
        margin:auto;
       
    }
    .container2 img{
        margin-left:50px!important;
    }

    .call-out img{
        margin-left:30%!important;
    }
    .call-out-1{
        margin-left:15%!important;
    }
    .call-out-2{
        margin-left:15%!important;
    }
}*/
/*--------------------------------------Samsung Galaxy A51/71  412px------------------------------------*/
/*@media(max-width:412px){
    .footer{
        height:1000px;
    }
    .call-out img{
        height:190px!important;
    }
    .call-out-1{
        margin-left:30px!important;
    }
    .call-out-2{
        margin-left:30px!important;
    }
    }*/

       /*-------------------------------------------i phone 12 pro 390px-----------------------------*/


    /*-------------------------------------------Pixel 5 393px-----------------------------*/
/*@media(max-width:393px){
    .container2 img{
        margin-left:40px!important;
    }
    .call-out img{
        margin-left:30px!important;
    }
}*/
        
/*-------------------------------------------i phone x / iphone 6 7 8 375px-----------------------------*/
/*@media(max-width:375px){
    .container1{
        width:100%;
    }
    .container2 img{
        margin-left:30px!important;
    }
    .call-out img{
        margin-left:30%!important;
    }
}*/

/*-------------------------------------------moto galaxy s5 moto g4 360px--------------------------*/
/*@media(max-width:360px){
    .container1 p{
        width:100vw;
        height:800px;
        font-size:16px;
        line-height:22px;
    }
    .container2 img{
        margin-left:24px!important;
    }
    .call-out img{
        margin-left:25%!important;
    }
    .call-out-1{
        font-size: 12px;
        margin-left:10%!important;
    }
    .call-out-2{
        margin-left:10%!important;
    }
    .facebook{
        font-size: 12px;
    }
    .budget-footer{
        font-size: 12px;
    }
    .reserved{
        font-size: 12px;
    }
}*/

/*-------------------------------------------320px--------------------------*/
/*@media(max-width:320px){
    .container1{
        width:340px;
    }
    .container1 p{
        height:780px;
        width:340px;
        background-color: rgba(0,0,0,0.5);
    }
    .container2 img{
        width:300px;
        margin-left:12px!important;
    }

    .call-out img{
        width:140px;
        margin-left:26%!important;
    }
    .call-out-1{
        margin-left:10%!important;
    }
    .call-out-2{
        margin-left:10%!important;
    }
}*/

/*-------------------------------------------galaxy fold 280px--------------------------*/
@media(max-width:280px){
    .logo{
        height:60px!important;
        width:60px!important;
    }
    .container1{
       margin-left:0px!important;
      
    }
    .container1 p{
        height:850px;
        font-size: 14px;
        margin-left:0px!important;
    }
    .container2 img{
        margin-left:45px!important;
    }
    .footer{
        margin-left:-20px;
    }

    .call-out img{
        margin-left:80px!important;
        height:180px!important;
        width:160px;
    }

    .call-out-1{
        font-size:10px;
        width:200px;
        margin-left:95px!important;
    }
    
    .call-out-2{
        font-size:10px;
        margin-left:95px!important;
        padding-bottom:30px;
    }
    .facebook{
        font-size:10px;
    }
    .budget-footer{
        font-size:10px;
    }
}