@charset "utf-8";
/* CSS Document */

main > .column-1 {
    
    width:100%;
    position: relative;
    vertical-align: top;
    
}

main > .columns {
    
    width:1200px;
    position: relative;
    margin:0 auto 0 auto;
    vertical-align: top;
    
}

main > .columns > .column {
    
    padding: var(--general-padding);
    margin:1%;
    display: inline-block;
    vertical-align: top;
    
}

main > .columns > .column.zero-pad {
    
    padding: 0;
    margin: 1% 0;
    
}

main > .columns > .column-2 {
    
    width:98%;
    margin-bottom: 0;
    
}

.page-format-1 > .columns > .column-3,
.page-format-1 > .columns > .column-5 {
    
    width:28%;
    
}

.page-format-1 > .columns > .column-4 {
    
    width:40%;
    margin:1% 0;
    
}

.page-format-2 > .columns > .column-3,
.page-format-2 > .columns > .column-5 {
    
    width:20%;
    
}

.page-format-2 > .columns > .column-4 {
    
    width:56%;
    margin:1% 0;
    
}

.page-format-3 > .columns > .column-3 {
    
    width:20%;
    
}

.page-format-3 > .columns > .column-4 {
    
    width:77%;
    margin:1% 0;
    
}

@media screen and (max-width: 1220px) {
  
    main > .column-2,
    main > .columns {

        width:971px;

    }
    
}

@media screen and (max-width: 1000px) {
  
    main > .columns {
        
        width:100%;    
        
    }
    
    main > .columns > .column,
    main > .columns > .column-2 {

        width:98%;
        margin:1%;

    }
    
    .page-format-1 > .columns > .column-3,
    .page-format-1 > .columns > .column-4,
    .page-format-1 > .columns > .column-5,
    .page-format-2 > .columns > .column-3,
    .page-format-2 > .columns > .column-4,
    .page-format-2 > .columns > .column-5,
    .page-format-3 > .columns > .column-3,
    .page-format-3 > .columns > .column-4 {

        width:98%;
        margin:1%;

    }
    
    main > div,
    main > .columns > div {
        
        display:block;    
        
    }
    
    .page-format-2 > .columns > .column-4 {
        
        width:calc(96% - 220px);
        margin:1%;   
        
    }
    
    .page-format-2 > .columns > .column-5 {
        
        width:220px;  
        
    }

}

@media screen and (max-width: 640px) {
    
    
    .page-format-2 > .columns > .column-4,
    .page-format-2 > .columns > .column-5 {
        
        width:98%;
        margin:1%;
        
    }
    
}