html{
    -webkit-font-smoothing: antialiased !important;
    font-smoothing: antialiased !important;
   
    height: 100%;
     margin: 0;
    padding: 0;
}

body{
    margin: 0; 
    padding: 0;
    height: 100%;
    
    color: #000;

}


a img{
    border: none;
}
.hide{
    display:none !important;
}
.show{
     display:block !important;
}

img{
    width: 100% !important;
    max-width: 960px !important;
}

/*RESPONSIVE PAGE LAYOUT*/

.hidden-mobile{
        display:block !important;
}

.hidden-desktop{
        display:none !important;
}

.hidden-tablet{
    display:block !important;
}

.visible-desktop{
    display:block !important;
}

.container{
    position: relative;
    min-width:100%;
    padding: 0;
    margin: 0;
    min-height: 0px;
    clear:both;
}

.row{

    margin-left:auto;
    margin-right:auto;
    width: 960px !important;
    min-height: 0px !important;
    overflow:hidden;

}



quote{
    display:inline-block !important;
    float:right;
    width: 25%;
    height: 100%;
    padding-left:5%;
   

    quotes: "..quote.." "..endquote...";
}
quote:before {
    content: open-quote;
}
quote:after {
    content: close-quote;
}


.col10{
    width: 10% !important;
    display: inline-block;
    float: left;
    
}
.col20{
    width: 10% !important;
    display: inline-block;
    float: left;
    
}
.col30{
    width: 30% !important;
    display: inline-block;
    float: left;
    
}
.col33{
    width: 33.333% !important;
    display: inline-block;
    float: left;
    
}
.col40{
    width: 40% !important;
    display: inline-block;
    float: left;
    
}
.col50{
    width: 50% !important;
    display: inline-block;
    float: left;
    
}
.col60{
    width: 60% !important;
    display: inline-block;
    float: left;
    
}
.col70, .main-article{
    width: 70% !important;
    display: inline-block;
    float: left;
    
}

.col80{
    width: 80% !important;
    display: inline-block;
    float: left;
    
}
.col90{
    width: 90% !important;
    display: inline-block;
    float: left;
    
}
.col100{
    width: 100% !important;
    display: inline-block;
    float: left;
    
}

/*mobile*/
@media (min-width: 0px) and (max-width:600px){
    
    quote{
        display: none !important;
    }
    
     .hidden-tablet{
        display:block !important;
    }
    
    .hidden-desktop{
        display:block !important;
    }
    
    .hidden-mobile{
        display:none !important;
    }
    .visible-desktop{
        display:none !important;
    }

    

    
    input, select, textarea{
        width: 90%;
        min-width: 90% !important;
        margin: 5px;
        margin-left:auto !important;
        margin-right: auto !important;
        
        clear:both !important;
       
    }
    
    .row{
        margin-left:auto;
        margin-right:auto;
        max-width: 100% !important;
         min-height: 0px !important;
        overflow:hidden;
        
    }
    .col10{
        width: 100% !important;
        display: inline-block;
        float: left;

    }
    .col20{
        width: 100% !important;
        display: inline-block;
        float: left;

    }
    .col30{
        width: 100% !important;
        display: inline-block;
        float: left;

    }
    .col33{
        width: 100% !important;
        display: inline-block;
        float: left;
    
    }
    .col40{
        width: 100% !important;
        display: inline-block;
        float: left;

    }
    .col50{
        width: 100% !important;
        display: inline-block;
        float: left;

    }
    .col60{
        width: 100% !important;
        display: inline-block;
        float: left;

    }
    .main-article, .col70 {
        width: 100% !important;
        display: inline-block;
        float: left;

    }
    .col80{
        width: 100% !important;
        display: inline-block;
        float: left;

    }
    .col90{
        width: 100% !important;
        display: inline-block;
        float: left;

    }
    .col100{
        width: 100% !important;
        display: inline-block;
        float: left;

    }
    
}

/*tablet*/
@media (min-width: 601px) and (max-width:960px){
    
    .hidden-mobile{
        display:block !important;
    }
    
    .hidden-desktop{
        display:block !important;
    }
    
    .hidden-tablet{
        display:none !important;
    }
    .visible-desktop{
        display:none !important;
    }
    .row{
        margin-left:auto;
        margin-right:auto;
        max-width: 100% !important;
         min-height: 5px !important;
        overflow:hidden;
        
    }
    .col10{
        width: 50% !important;
        display: inline-block;
        float: left;

    }
    .col20{
        width: 50% !important;
        display: inline-block;
        float: left;

    }
    .col30{
        width: 50% !important;
        display: inline-block;
        float: left;

    }
    .col33{
        width: 50% !important;
        display: inline-block;
        float: left;

    }
    .col40{
        width: 50% !important;
        display: inline-block;
        float: left;

    }
    .col50{
        width: 50% !important;
        display: inline-block;
        float: left;

    }
    .col60{
        width: 100% !important;
        display: inline-block;
        float: left;

    }
    .main_article, .col70 {
        width: 100% !important;
        display: inline-block;
        float: left;

    }
    .col80{
        width: 100% !important;
        display: inline-block;
        float: left;

    }
    .col90{
        width: 100% !important;
        display: inline-block;
        float: left;

    }
    .col100{
        width: 100% !important;
        display: inline-block;
        float: left;

    }
    
}



/*IMAGE CONTROL*/


/*containing div arround img*/
.image-crop-small {
  position: relative;
  width: 50px;
  height: 50px;
  overflow: hidden;
  
}

.image-crop-small img {
  width: auto !important;
  height: 100px !important;
}

.image-crop-medium {
  position: relative;
  width: 200px;
  height: 150px;
  overflow: hidden;

}

.image-crop-feature{
  position: relative;
  width: 200px;
  height: 150px;
  overflow: hidden;

}

.image-crop-feature img {
  width: 200px !important;
  min-height: 150px !important;

}

.image-crop-medium img {
  width: 150px !important;
  height: 200px !important;
}

.image-crop-big {
  position: relative;
  width: 300px;
  height: 250px;
  overflow: hidden;

}

.image-crop-big img{
  width: 300px !important;
  height: 300px !important;

}

/*add to img class*/
.centered {
  position: absolute;
  left: -100%;
  top: -38%;
}