/*-------- css code for responsive layout  --------*/


/*  1 - media screen and (max-width: 1199px)
------------------------------------------------------------------------------------------ */
@media screen and (max-width: 7000px) {
    #header-logo {
	    padding: 1.5% 3%;
	}
	.login-links {
        padding: 3.5% 3%;
    }
}
@media screen and (max-width: 5000px) {
    #header-logo {
	    padding: 1.1% 3%;
	}
	.login-links {
        padding: 3.5% 3%;
    }
}
@media screen and (max-width: 2700px) {
    #header-logo {
	    padding: 0.9% 3%;
	}
	.login-links {
        padding: 3.5% 2.8%;
    }
}
@media screen and (max-width: 2100px) {
    #header-logo {
	    padding: 0.4% 2.9%;
	}
	.login-links {
        padding: 3.5% 2.6%;
    }
}
@media screen and (max-width: 1199px) {
    #header-logo {
	    padding: 0% 2.9%;
	}
	.bgCream {
      width: 94% !important;
      margin: 0px 3%;
    }
    .dashboard-metrics li {
        width: 100%;
    }
    
    .blog-section-right {
        padding-left: 15px !important;
        padding-right:30px !important;
    }
    
    .not-stuck {
        /*height:85px;*/
    }
    .login-links {
        padding: 3.5% 2.5%;
    }
}


/*  2 - media screen and (max-width: 991px)
------------------------------------------------------------------------------------------ */

@media screen and (max-width: 991px) {
    body {
        /*margin-right:5px;
        margin-left: 5px;*/
        overflow-x: hidden;
    }
    .london_logo_1
    {
      width:300px !important;
    }
    
    .container {
        padding:0;
        margin:0;
        width:100% !important;
    }
    
    .page-head-content {
        left: 23%;
    }
    
    .user-info h4 {
        font-size: 38px;
    }
    
    .profile-photo
    {
      margin-right: 0px;
      border-radius: 5px;
      min-width: 150px;
      max-height: 150px;
      top: 35px;
    }
    
    .profile{
      top:40px;
    }
    
    .icon-default {
        display:inline-block;
        width:20px;
        /*color: #6c1525;*/
    }

    .blog-main-title.fl-left {
        float: none;
    }
    .candles .more-candles{
      width:150px;
      margin-left:2.5%;
    
    }
    .view-more-btn{
      margin-left:-22%;
    }
    
    .carousel-control{
    	margin-left:-24px;
    	margin-right:-24px;
    }
    .edit_candle .carousel-control{
    	margin-left:0px;
    	margin-right:0px;
    }
    .visitor-box-candles h6{
        height:105px ;
    }
    .visitor-box-candles{
        height:270px !important;
    }
	.menu-icon img{
		width:20px;
		height:20px;
	}
	.edit-candle-btn{
	    width:26px !important;
	    height:26px !important;
	}
	.not-stuck {
        /*height:85px;*/
    }
    .icon-space-right {
        padding-right:10px;
    }
    
    .login-links {
        padding: 4.5% 2.8%;
    }
    .bgCream {
      width: 92% !important;
      margin: 0px 4% 10px;
    }
    #upload-demo-banner{
      width: 530px !important ;
    }
    .banner{
      margin-top:-50px !important;
      margin-left:5px !important;
    }
 
    .profile-info {
      padding-left: 200px;
    }
    .user-info h1{
      padding-top:15px !important;
    }
    .icons-block
    {
      margin-left:8px !important;
      margin-top:-3px !important;  
    }
    .candles-icons-sec{
      padding-bottom:50px !important;
      padding-right: 10px !important;
      padding-left: 5px;
    }
    .social-sharing-sec{
      margin-top:0 !important;
      margin-right: 25px;
    }

     .blog-single-comment-donation
    {
      margin-right:15px;  
    }
    .blog-location
    {
       margin-right:25px;
    }
    .internal_memo
    {
      word-wrap: break-word;
      padding-top:0px;
    }

} 


/*  3 - media screen and (max-width: 767px)
------------------------------------------------------------------------------------------ */

@media screen and (max-width: 767px) {
    body {
        /*margin-right:5px;
        margin-left: 5px;*/
        overflow-x: hidden;
    }
    .container {
        padding:0;
        margin:0;
        width:100% !important;
    }
    .item-grid {
        width: 50%
    }
    .page-head-content {
        left: 23%;
    }
    .profile-photo {
        position: relative;
        border-radius: 5px;
        max-width: 220px;
        margin: -125px auto 0;
        display: block;
    }
    .profile-info {
        padding: 0;
        text-align: center;
    }
    .profile-details {
        min-height: auto;
    }
    .user-info {
        padding-top: 0;
    }
    .share-memo-links {
        text-align: left;
        margin-top: 5px;
        padding-left: 240px;
    }
    .user-info h4 {
        font-size: 30px;
    }
    #nav-off {
        width: 14px;
    }
    #site-header {
        /*padding: 20px 0px;*/
        position: absolute;
    }
    .page-head-section {
        /*top: 65px;*/
    }
    .banner-content {
        padding-top: 60px;
    }
    .icon-default {
        display:inline-block;
        width:20px;
        /*color: #6c1525;*/
				height:20px;
    }
		.icon-default img {
				 width:20px;
				 height:20px;
		}
    .blog-main-title.fl-left {
        float: none;
    }
    .dashboard-metrics li {
        width: 50%;
    }
    
     .visitor-box {
      /*text-align: center;
      padding: 0px 10px;
      width: 140px;
      height: 200px;*//*160px;*/
    }
    
    .p-1 {
      padding: 10px 10px 10px 10px;
    }
    
    .carousel-control{
    	margin-left:-24px;
    	margin-right:-24px;
    }
    .not-stuck {
        /*height:85px;*/
    }
    
    .login-links {
        padding: 5% 3%;
    }
    .bgCream {
      width: 92% !important;
      margin: 0px 4% 10px;
    }

     #upload-demo-banner{
      width: 550px !important;
    }
    .blog-single-comment-donation
    {
      margin-right:15px;  
    }
    .blog-location
    {
       margin-right:25px; 
    }
    .internal_memo
    {
      word-wrap: break-word;
      padding-top:0px;
    }
   
}


/*  4 - media screen and (max-width: 580px)
------------------------------------------------------------------------------------------ */

@media screen and (max-width: 580px) {
    .visitor-box {
      /*text-align: center;
      padding: 0px 10px;
      width: 140px;
      height: 200px;*//*160px;*/
    }
    
    .p-1 {
      padding: 10px 10px 10px 10px;
    }
    
    .blog-section-right-column {
        margin-bottom: 20px !important;
        padding-left: 8px !important;
    }
    
    .carousel-control{
    	margin-left:30px;
    	margin-right:32px;
    }
	.icon-default img {
			 width:20px;
			 height:20px;
	}
	.not-stuck {
        /*height:75px;*/
    }
    
    .login-links {
        padding: 10% 3%;
    }
    .bgCream {
      width: 92% !important;
      margin: 0px 4% 10px;
    }
    .blog-single-comment-donation
    {
      margin-right:15px;  
    }
    .blog-location
    {
       margin-right:25px; 
    }
    .internal_memo
    {
      word-wrap: break-word;
      padding-top:0px;
    }
}


/*  1 - media screen and (max-width: 480px)
------------------------------------------------------------------------------------------ */

@media screen and (max-width: 480px) {
    .camera-icon {
      left:109px;
      width:auto;
    }
    .visitor-box {
      /*text-align: center;
      padding: 0px;
      width: 120px;
      height: 265px;*//*160px;*/
      
    }
    .visitor-box h6{
      height:105px;
      font-size:12px !important;
    }
    .date{
      font-size:12px !important;
    }
    .p-1 {
      padding: 7px 7px 7px 8px;
    }
    
    .carousel-control{
    	margin-left:30px;
    	margin-right:32px;
    }
    .not-stuck {
        /*height:75px;*/
    }
    
    .login-links {
        padding: 10% 3%;
    }
    .bgCream {
      width: 90% !important;
      margin: 0px 5% 10px;
    }
    #upload-demo-banner{
      width:265px !important;
    }
    #upload-demo-banner .cr-viewport{
      width:250px !important;
      height:50px !important;
    }
    .banner{
      margin-left:-105px !important;
      margin-top: 125px !important;
    }
    .swiper-wrapper{
      background:#f5f5f5;
      margin-left:10px;
    }
    .social-sharing-sec{
      margin-right:30px !important;
    }
    .blog-single-comment-donation
    {
      margin-right:15px;  
    }
    .blog-location
    {
       margin-right:25px; 
    }
    .internal_memo
    {
      word-wrap: break-word;
      padding-top:0px;
    }
}


/*  1 - media screen and (max-width: 420px)
------------------------------------------------------------------------------------------ */

@media screen and (max-width: 420px) {
    .page-head-section {
        /*padding-bottom: 330px;*/
    }
    .profile-photo
    {
     min-width:100px;
     max-height:100px;
     margin-top:-70px !important;
    }
    
    .camera-icon{
      width:auto;
    }
    .profile {
      left:10em;
      width:auto;
      top: 22px !important; 
    }
    .visitors-list {
        margin-bottom: 2px;
    }
    .visitor-box {
      /*text-align: center;
      padding: 4px;
      width: 120px;
      height: 260px !important;*//*140px;*/
    }
    .visitor-box h6{
        height:100px;
         font-size:12px;
    }
    
    .date{
      font-size:12px !important;
    }
    .p-1 {
      padding: 10px 7px 10px 5px;
    }
    
    .carousel-inner .item img{
    	margin:auto;
    	max-width:110px;
    }
    
    .carousel-control{
    	margin-left:30px;
    	margin-right:32px;
    }
	.menu-icon img{
		width:20px;
		height:20px;
	}
	.icon-default img {
	   width:20px;
	   height:20px;
	}
	.not-stuck {
        /*height:70px;*/
    }
    
     /*Mobile view of candles in memorial wall*/
    .icons-sec-mobile img{
        width:15px !important;
        height:15px !important;
    }
    .equalButton{
        padding:0.2rem;
    }
    
    /*Mobile view of candles in candles page*/
    .icons-sec-images{
        padding-right:3px;
        display:flex;
        width:15px !important;
        height:15px !important; 
        padding-bottom:2px;
    }
    
    /*.equalButtonCandles{
        padding:0.5rem;
    }*/
     /*.modal-header
    {
      padding-left:0px !important;
    }*/
    
    .login-links {
        /*padding: 10% 3%;*/
        padding: 6% 3%;
    }
    .bgCream {
      width: 88% !important;
      margin: 0px 6% 10px;
    }
    #upload-demo-banner{
      width:260px !important;
    }
    #upload-demo-banner .cr-viewport{
      width:250px !important;
      height:50px !important;
    }
     .banner{
      margin-top:0px !important;
    }
    .swiper-wrapper{
      background:#f5f5f5;
      margin-left:10px;
    }
    .blog-single-comment-donation
    {
      margin-right:15px;  
    }
    .blog-location
    {
       margin-right:25px; 
    }
    .internal_memo
    {
      word-wrap: break-word;
      padding-top:0px;
    }
    /*.p-4{
      padding:4px;
    }*/
}


/*  1 - media screen and (max-width: 375px)
------------------------------------------------------------------------------------------ */
@media screen and (max-width: 395px) {
    .camera-icon {
      /*position:absolute;*/
      /*top:15px;*/
      left:75px;
      /*margin-left: 12px;*/
      top: 88px !important;
      width:auto;
    }
    .profile {
      left:9.5em;
      width:auto;
      top: 25px !important; 
    }
 
    .login-links {
        padding: 10% 3%;
    }
    .bgCream {
      width: 88% !important;
      margin: 0px 6% 10px;
    }
    #upload-demo-banner{
      width:240px !important;
    }
    #upload-demo-banner .cr-viewport{
      width:235px !important;
      height:47px !important;
    }
    .banner{
      margin-left:-70px !important;
    }
     .icons-block {
    margin-left: 3px !important;
    margin-top: -8px !important;
     }
     .visitor-box{
      /*text-align: center;
      width:115px;
      height: 260px !important;*/
    }
    .p-1 {
      padding: 10px 7px 10px 7px;
    }
    .blog-single-comment-donation
    {
      margin-right:15px;  
    }
    .blog-location
    {
       margin-right:25px; 
    }
    .internal_memo
    {
      word-wrap: break-word;
      padding-top:0px;
    }
    .london_logo_1{
      width:250px;
    }

}

@media screen and (max-width: 376px) {
    .camera-icon {
      /*position:absolute;*/
      /*top:15px;*/
      left:69px;
      width:auto;
      /*margin-left: 15px;*/
      top: 88px !important;
    
    }
    .profile 
    {
      left:9em;
      width:auto;
      top: 28px !important; 
    }
    .banner{
      margin-left:-50px;
    }
    .page-head-section {
       /* padding-bottom: 330px;*/
    }
    
    .visitor-box {
      /*text-align: center;
      padding: 0px;
      width: 110px;
      height: 220px;*//*150px;*/
    }
    .visitor-box h6{
      height:103px;
    }
		.menu-icon img{
			width:20px;
			height:20px;
		}
    
    .p-1 {
      padding: 7px 7px 7px 6px;
    }
    
    .carousel-control{
    	margin-left:30px;
    	margin-right:32px;
    }
	.icon-default img {
			 width:20px;
			 height:20px;
	}
	 /*.modal-header
    {
      padding-left:0px !important;
    }*/
	.not-stuck {
        /*height:70px;*/
    }
    
   /* .profile-photo {
      margin-left:70px !important;
    }*/
    
    .login-links {
        /*padding: 10% 3%;*/
        padding: 6% 3%;
    }
    .bgCream {
      width: 88% !important;
      margin: 0px 6% 10px;
    }
     #upload-demo-banner{
      width:230px !important;
    }
    #upload-demo-banner .cr-viewport{
      width:225px !important;
      height:45px !important;
    }
    .blog-single-comment-donation
    {
      margin-right:15px;  
    }
    .blog-location
    {
       margin-right:25px; 
    }
    .internal_memo
    {
      word-wrap: break-word;
      padding-top:0px;
    }

}
@media screen and (max-width: 361px) {
    .camera-icon 
    {
      left:72px;
      width:auto;
    }
    .profile 
    {
      left:9em;
      width:auto;
      top: 28px !important; 
    }
    .london_logo_1
    {
      width:250px !important;
    }
    .login-links {
       /* padding: 10% 3%;*/
       padding: 6% 3%;
    }
    .bgCream {
      width: 86% !important;
      margin: 0px 7% 10px;
    }
     #upload-demo-banner{
      width:235px !important;
    }
    #upload-demo-banner .cr-viewport{
      width:245px !important;
      height:49px !important;
    }
    .visitor-box{
      /*text-align: center;
      padding: 0 px;
      width:108px;
      height: 275px !important;*/
    }
    .visitor-box h6{
      font-size:12px;
      height:120px;
    }
    .date{
      font-size:11px !important;
    }
    .p-1 {
      padding: 10px 7px 10px 7px;
    }
     .blog-single-comment-donation
    {
      margin-right:15px;  
    }
    .blog-location
    {
       margin-right:25px; 
    }
    .internal_memo
    {
      word-wrap: break-word;
      padding-top:0px;
    }
    
}