﻿body {
    margin: 0;
    padding: 0;
}

* {
    box-sizing: border-box;
}

.primary-color {
}

.row {
    display: flex;
    flex-wrap: wrap;
    padding: 10px;
}

    /* 100 /(12/col */
    .col {
        flex: 100%;
       
        
    }

    

   

@media only screen and (max-width: 600px) {

    .col-s-1 {
        flex: 8.33%;
    }

    .col-s-2 {
        flex: 16.66%;
    }

   .col-s-3 {
        flex: 25%;
       
    }

    .col-s-4 {
        flex: 33.33%;
    }

    .col-s-5 {
        flex: 41.66%;
    }

     .col-s-6 {
        flex: 50%;
    }

    .col-s-7 {
        flex: 58.33%;
    }

     .col-s-8 {
        flex: 66.66%;
    }

   .col-s-9 {
        flex: 75%;
       
    }

    .col-s-10 {
        flex: 83.33%;
    }

     .col-s-11 {
        flex: 91.66%;
    }

     .col-s-12 {
        flex: 100%;
      
    }
}

@media only screen and (min-width: 600px) {
    .col-1 {
        flex: 8.33%;
        /*width: 8.33%;*/
    }

    .col-2 {
        flex: 16.66%;
        /*width: 16.66%;*/
    }

    .col-3 {
        flex: 25%;
        /*width: 25%;*/
        
    }

    .col-4 {
        flex: 33.33%;
        /*width: 33.33%*/
    }

    .col-5 {
        flex: 41.66%;
        /*width: 41.66%;*/
    }

     .col-6 {
        flex: 50%;
        /*width:50%;*/
        
    }

     .col-7 {
        flex: 58.33%;
        /*width: 58.33%;*/
    }

    .col-8 {
        flex: 66.66%;
        /*width: 66.66%;*/
    }

    .col-9 {
        flex: 75%;
        /*width: 75%;*/
    }

    .col-10 {
        flex: 83.33%;
        /*width: 83.33%;*/
    }

    .col-11 {
        flex: 91.66%;
        width:  91.66%;
    }

     .col-12 {
        flex: 100%;
        width:100%;
        
    }
     .text-align-center{
        text-align:center
    }
}
.navbar{
    display:flex;
    flex-wrap:nowrap;
}
.navbar a{
    display:block;
   
}
@media only screen and (max-width: 768px) {
    .navbar {
        flex-wrap :wrap;
        flex-direction:column;
        justify-items:flex-start;
    }
    .navbar a {
        flex: 100%;
       
    }
}