html {
    background: #800080;
    
    -webkit-font-smoothing: antialiased;
}

body {
    
    margin: 0 auto;
    max-width: 100%;
 background-color: blue;
}
.container {
 margin: 0 auto;
 max-width: 95%;

}
                        
        }

header, .site-footer {
      background: #FF6400;
     
      border: 1px sold black;
    
     height: 200px;
    align:left;
   padding: 0 20px;
}
 h2, h3, h4, h5, h6 {
    color: #a0522d;
    font-weight: 600;
    line-height: 1.3;
    text-align: left;
}

 h1 {
   color: #FF9640;
  font-size: 40px;
  width:100%;
text-align: center;
  margin: 0;
  background: -webkit-linear-gradient(bottom, #008000, #ffffff);
  background: -moz-linear-gradient(bottom, #008000, #ffffff);
  background: -ms-linear-gradient(bottom, #008000, #ffffff);
  background: linear-gradient(bottom, #008000, #ffffff);
  text-shadow: 2px 2px 2px #FF00ff, 2px 2px 1px black;
}
h2 {
    margin-top: 1.3em;
}

a {
    color: #0083e8;
}

b, strong {
    font-weight: 600;
}

samp {
    display: none;
}


img {
    -webkit-animation: colorize 2s cubic-bezier(0, 0, .78, .36) 1;
            animation: colorize 2s cubic-bezier(0, 0, .78, .36) 1;
    background: transparent;
    border: 10px solid rgba(0, 0, 0, 0.12);
    border-radius: 4px;
    display: block;
    margin: 1.3em auto;
    max-width: 20%;
   float:right;
}

@-webkit-keyframes colorize {
    0% {
        -webkit-filter: grayscale(100%);
    }
    100% {
        -webkit-filter: grayscale(0%);
    }
}

@keyframes colorize {
    0% {
        filter: grayscale(100%);
    }
    100% {
        filter: grayscale(0%);
    }
}



.items_add{
           position: absolute;
           color: #ff00ff;
           font-size: 15px;
          height: 18px;
          width: 100px;
         font-weight: bold;
        z-index: -1;
          background: url('/Assets/Images/Donation/btn_stepf.gpg') no-repeat;


}


.item1 { grid-area: header; padding-bottom: 80px; }
.item2 { grid-area: menu; }
.item3 { grid-area: main; }
.item4 { grid-area: right; }
.item5 { grid-area: footer; }

.grid-container {
  display: grid;
  grid-template-areas:
    'header  header header header header header'
  'footer footer footer footer footer footer';
  grid-gap:10px;
  background-color: #2196F3;
  padding: 10px;
width:fullscreen;
position: relative;
}

.grid-container > div {
  background-color: #228b22;
  text-align: left;
  padding: 10px 0;
  font-size: 30px;
 overflow:auto;
}


.item2  {

background:red;}

.item1  {
color:white;}
.item5  {
background-color:#b8860b ;
}

.item3  {
color:red;}
.flex-container {
  display: flex;
  height: auto;
  align-items: center;
  background-color:#b8860b ;
 border: 10px solid blue;
 text-decoration: none;
}

.flex-container3{
  display: flex;
  height: 400px;
  align-items: center;
  background-color:#b8860b ;
 border: 10px solid black;
}
.flex-container4{
  display: flex;
 align-items: center;
 border: 10px solid darkred;
  height: 565px;
background-color: #254441;
}
.flex-container2{
display: flex;
  height: auto;
  align-items: center;
width: auto;
 background-color:#b8860b ;
  border: 4px solid green;
}

.vimungi{
display: flex;
  height: 80px;
  align-items: center;
width: auto;
 background-color:#b8860b ;
  border: 4px solid green;
}



.flex-container >  ul  li {
  background-color: #f1f1f1;
  width: 300px;
  margin: 2px;
  text-align: center;
  line-height: 30px;
  font-size: 20px;
height:350px;
float:left;
list-style: none;
z-index:99;
}








.flex-container6 ul  li {
  background-color: #f1f1f1;
  width: 300px;
 height:350px;
  margin: 1px;
text-align: top;
 overflow:hidden;
  display: inline-block;
 padding:  8px;
 position:relative;
border-radius: 5px
  border: 3px solid #2e8b57;
color:black;
font-size: 16px;
 float:left;
z-index:99;
line-height:30px
text-overflow:auto;

}
.clearfix::after {
  content: "";
  clear: both;
  display: table;
}



.flex-container6 ul {



  padding: 0;

  margin: 0;

  list-style: none;

  position: relative;
font-size: 16px;
font-weight: bold;
text-shadow: none;
border: 2px ;
}

.flex-container7 ul  li {
 background-color: #f1f1f1;
width: 300px;
height:300px;
margin: 5px;
text-align: top;
 overflow:hidden;
 display: inline-block;
 padding:  20px;
 position:relative;
border-radius: 10px
 border: 3px solid #2e8b57;
color:black;
font-size: 16px;
 float:left;
z-index:99;

}
.propertyFamily{
 padding: 0;

  margin: 0;

  list-style: none;

  position: relative;
font-size: 16px;
font-weight: bold;
text-shadow: none;
border: 5px ;
}

.flex-container7 {
display:flex;
  align-items: center;
  background-color:#b8860b ;
 border: 10px solid blue;
 text-decoration: none;

}


.flex-container7 div {
  clear: left;
}
#PropertyFamilyPosition-DisplayNameLabelPropertyFamily-clMainArticle-cl2018-cart-name-product  {
  display: block;
  padding: 0 20px;
  color: black;
  font-size: 20px;
  line-height: 5px;
  text-decoration: none;

}

.item_add {
  display: block;
  padding: 20px;
  color:darkcyan;
  font-size: 20px;
  line-height: 10px;
  text-decoration: none;
 float:left;
}

nav ul li {
  margin: 0px;
  display: inline-block;
  float: left;
padding:5px;
}

nav ul {
  float: left;
  padding: 0;
  margin: 0;
  list-style: none;
  position: relative;
}

nav a {
  display: block;
  padding: 0 20px;
  color: #FFF;
  font-size: 20px;
  line-height: 10px;
  text-decoration: none;
}


* {
  box-sizing: border-box;
}

/* Style the search field */
form.example input[type=text] {
  padding: 10px;
  font-size: 17px;
  border: 1px solid grey;
align:center;
  width: 50%;
  background: #f1f1f1;
}

/* Style the submit button */
form.example button {
align:center;
  width: 5%;
  padding: 10px;
  background: #2196F3;
  color: white;
  font-size: 17px;
  border: 1px solid grey;
  border-left: none; /* Prevent double borders */
  cursor: pointer;
}

form.example button:hover {
  background: #0b7dda;
}

/* Clear floats */
form.example::after {
  content: "";
  clear: both;
  display: table;
}












 
.site-footer { height:600px; width:auto; background: #8b008b; float:bottom; boder-top:50 solid #00008b; padding:0; margin:0;align-item:center;line-height: 20px;  } #footer1{ margin:10; margin-left:2%; float:left; span-color:#F0FFFF;   display: block; } #footer2{ margin:10; margin-right:2%; float:left; span-color:#F0FFFF; } #footer3{ margin:10; margin-right:2%; float:left; span-color:#F0FFFF; } #footer4{ margin:10; margin-right:2%; float:left; span-color:#F0FFFF; } #footer5{ margin:10; margin-right:2%; float:left; span-color:#F0FFFF; } #footer6{ margin:10; margin-right:2%; float:left; span-color:#F0FFFF; } #footer7{ margin:10; margin-right:2%; float:left; span-color:#F0FFFF; } #footer8{ margin:10; margin-right:2%; float:left; span-color:#F0FFFF; } #footerA{ margin-top:100px; margin-right:2%; float:left; color:#F0FFFF; } #footerB{ margin-top:100px; margin-right:2%; float:right; color:#F0FFFF; }

#footer9{ margin:10; margin-right:2%; float:left; span-color:#F0FFFF; } #footerA{ margin-top:100px; margin-right:2%; float:left; color:#F0FFFF; } #footerB{ margin-top:100px; margin-right:2%; float:right; color:#F0FFFF; }
#footer10{ margin:10; margin-right:2%; float:left; span-color:#F0FFFF; } #footerA{ margin-top:100px; margin-right:2%; float:left; color:#F0FFFF; } #footerB{ margin-top:100px; margin-right:2%; float:right; color:#F0FFFF; }
.footerNaveBlock{ text-format:justify;  font-size:14px;   text-align:left; }
                                        </style> 
	
                       


.item_add{
font-size:30px;
background-color:blue;
color:white;
padding:2
}

@media (max-width: 600px) {
  .simpleCart_shelfItem {
    width: 100%;
    height: auto;
    overflow: hidden;
  }
 .article {
     width: 100%;
     height: auto;
    overflow: hidden;
  }
  .left {
    display: none;
  }
.site-footer{
display: none;}
.item_add{
width:48px;
height:38px;
}
}

body {
  font-family: Helvetica, sans-serif;
  padding: 1%;
  text-align: center;
}

#slideshow {
  overflow: hidden;
  height: 510px;
  width: 728px;
  margin: 0 auto;
}

.slide-wrapper {
  width: 2912px;
  -webkit-animation: slide 18s ease infinite;
}

.slide {
  float: left;
  height: 510px;
  width: 728px;
}

.slide:nth-child(1) {
  background: #D93B65;
}

.slide:nth-child(2) {
  background: #037E8C;
}

.slide:nth-child(3) {
  background: #36BF66;
}

.slide:nth-child(4) {
  background: #D9D055;
}

.slide-number {
  color: #000;
  text-align: center;
  font-size: 10em;
}

@-webkit-keyframes slide {
  20% {margin-left: 0px;}
  30% {margin-left: -728px;}
  50% {margin-left: -728px;}
  60% {margin-left: -1456px;}
  70% {margin-left: -1456px;}
  80% {margin-left: -2184px;}
  90% {margin-left: -2184px;}
}

.bt{
 background: black;
text-align: center;
 height: 300px;
font-size:20px;
color:white;
line-height: 30px;
 width: auto;
}
.social_info li{
padding:20px;
text-decolation: none;}