﻿
main .display
{
    width:100%; 
    min-width: 320px;
    padding-bottom:500px;
    padding-bottom:800px;

    display:flex;
    flex-direction:column; 
    justify-content:center;
    align-items:centeR;

    }   
    
   @media (max-width: 400px)
{
    main .display 
    {

     padding-left: 0px;
     padding-right:0px;
    }
}   
    
.applicationPanel 
{
    width:100%;
    }
    
main .display section
{
    width:65%;
    }   
    
@media (max-width: 900px)
{
    main .display section
    {
     width:80%;    
    }
}      

@media (max-width: 400px)
{
    main .display section
    {
     width:100%;
     margin-right: 0px;    
     padding-left: 20px;
     padding-right: 20px;
    }
}   

main .display section.article
{
    align-items:flex-start;
    background-color:rgba(255, 252, 247, 0.8);
    }

.stripeBackground
{
    width: 100%;
    padding-top:80px;
    display:flex;
    justify-content:center;
    }

.stripeBackground:nth-child(odd)
{
   }  

.stripeBackground:nth-child(even)
{
    
    background-image:
    url('../Pix/StripeBackgroundTop.png'), 
    url('../Pix/StripeBackgroundBottom.png'), 
    url('../Pix/white.png')
    ;
    background-position: 
    left 0px,
    left bottom,
    left center    
    ;    
    background-repeat:
    no-repeat,
    no-repeat,
    repeat-x
    ;
    background-size: 
    100% 18%,
    100% 18%,
    100% 65%
    ;
    

    padding-bottom:40px;

    }    
    
    
main .display .stripeBackground:nth-child(even) section.article
{

    background-color:rgba(255, 252, 247, 0.0);
    }

h3.rotation
{
    transform: rotate(-3deg);
    margin-bottom:10px;
    }
    
.formSection .textField, .formSection select
{
    background-color: #ffffff;
}


.formSection label
{
    color:#ffffff;
}

main .display footer
{

    bottom: -300px;

    }
    
@media (max-width: 1100px)
{
    main .display footer
    {
    
     background-image: url('../../../Pix/Layout/FooterLEdgewise.png');

    }
} 

@media (max-width: 500px)
{
    main .display footer
    {

     background-image: url('../../../Pix/Layout/FooterSEdgewise.png');
    }
}  

@media (max-width: 780px)
{
    main .display footer
    {
     background-size: 190%;
    }
}  

@media (max-width: 500px)
{
    main .display footer
    {
     background-size: 250%;
    }
}

main figure figcaption {
    text-align: center;
}

.message {
    width: 65%;
}
