/*** ICONS ***/

.ix-tracker { background-image: url("../images/icons1.svg#tracker_1"); }
.ix-msg { background-image: url("../images/icons1.svg#message"); }
.ix-like { background-image: url("../images/icons1.svg#like"); }
.ix-results { background-image: url("../images/icons1.svg#results"); }
.ix-cup { background-image: url("../images/icons1.svg#charts"); }
.ix-schedule { background-image: url("../images/icons1.svg#schedule"); }
.ix-set { background-image: url("../images/icons1.svg#set"); }
.ix-all_x5F_clubs { background-image: url("../images/icons1.svg#all_x5F_clubs"); }
.ix-member { background-image: url("../images/icons1.svg#member"); }
.ix-manager { background-image: url("../images/icons1.svg#manager"); }
.ix-clock { background-image: url("../images/icons1.svg#clock"); }
.ix-compare { background-image: url("../images/icons1.svg#compare"); }
.ix-arrow { background-image: url("../images/icons1.svg#arrow"); }
.ix-logo { background-image: url("../images/icons1.svg#logo"); }


.i-coach { background-image: url("../images/icons2.svg#coach_1"); }
.i-tracker { background-image: url("../images/icons2.svg#tracker_1"); }
.i-msg { background-image: url("../images/icons2.svg#message"); }
.i-like { background-image: url("../images/icons2.svg#like"); }
.i-dislike { background-image: url("../images/icons2.svg#dislike"); }
.i-results { background-image: url("../images/icons2.svg#results"); }
.i-cup { background-image: url("../images/icons2.svg#charts"); }
.i-cup-w { background-image: url("../images/icons2.svg#charts_w"); }
.i-schedule { background-image: url("../images/icons2.svg#schedule"); }
.i-set { background-image: url("../images/icons2.svg#set"); }
.i-clock { background-image: url("../images/icons2.svg#clock"); }
.i-compare { background-image: url("../images/icons2.svg#compare"); }
.i-arrow { background-image: url("../images/icons2.svg#arrow"); }
.i-logo { background-image: url("../images/icons2.svg#logo"); }
.i-graph-edt { background-image: url("../images/icons2.svg#graph_x5F_edit_1"); }
.i-graph-up { background-image: url("../images/icons2.svg#graph_2"); }
.i-time { background-image: url("../images/icons2.svg#time_1"); }
.i-abacus { background-image: url("../images/icons2.svg#abacus_1"); }
.i-first { background-image: url("../images/icons2.svg#first_1"); }
.i-prize { background-image: url("../images/icons2.svg#prize_1"); }
.i-score { background-image: url("../images/icons2.svg#score_1"); }
.i-finish { background-image: url("../images/icons2.svg#finish_1"); }
.i-members { background-image: url("../images/icons2.svg#all_x5F_clubs_2"); }
.i-member { background-image: url("../images/icons2.svg#member_2"); }
.i-manager { background-image: url("../images/icons2.svg#manager_2"); }
.i-plus { background-image: url("../images/icons2.svg#plus"); }
.i-plus-w { background-image: url("../images/icons2.svg#plus_w"); }
.i-setting { background-image: url("../images/icons2.svg#setting_1"); }
.i-help { background-image: url("../images/icons2.svg#help_1"); }
.i-period { background-image: url("../images/icons2.svg#period_1"); }
.i-back { background-image: url("../images/icons2.svg#back_1"); }
.i-list { background-image: url("../images/icons2.svg#list"); }
.i-filter { background-image: url("../images/icons2.svg#filter"); }
.i-cup2 { background-image: url("../images/icons_big.svg#cup2"); }

img.svg-icon {
    width: 40px;
    height: 40px;	
    border: 0px solid red;
    margin:0;
    padding:0;
    /*background-size: 50px 50px ;
    background-position: -10px -10px ;    */
}

span.svg-icon {
    width: 30px;
    height: 30px;	
    /*border:1px solid red;*/
    background-size: 40px 40px;
    background-position: -6px -6px;
}

span.svg-icon.i-2x {
    width: 54px;
    height: 45px;	
   /* border:1px solid red;*/
    background-size: 60px 60px;
    background-position: -4px -9px;
}
span.svg-icon.i-big {
    width: 100px;
    height: 100px;	
    /*border:1px solid red;*/
    background-size: 100px 100px;
    background-position: -1px -1px;
}


/*** BOOTSTRAP ***/
/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575px) { 
    h1 {
        /*color: red !important;*/
    }
    h3 {
        /*display: inline !important;*/
    }
    
    .tile-btn {
        /*color: red !important;*/
        width: 25% !important;
        height: 75px !important;
        padding-top: 7px !important;
    }
    div.tile-btn.header-tile div.btn-group button.dropdown-toggle {        
        height: 75px !important;
        margin-top: -7px !important;
    }
    
    .header-logo {
        /*max-height: 150px !important;*/
    }
    #header-title {
        height: 80px !important;
    }
    
}

/* SD Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) and (max-width: 767px) { 
    h1 {
        /*color: orange !important;*/
        
    }
    h3 {
        /*display: inline !important;*/
    }
    #header-title {
        text-align: center !important;
    }
    .tile-btn {
        /*color: red !important;*/
        width: 25% !important;
        height: 75px !important;
        padding-top: 7px !important;
        
    }
    div.tile-btn.header-tile div.btn-group button.dropdown-toggle {        
        height: 75px !important;
        margin-top: -7px !important;
    }
    #header-title {
        height: 80px !important;
    }
    
}

/* MD Medium devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991px) { 
    h1 {
        /*color: blue !important;*/
    }    
    .tile-btn {
        /*color: red !important;*/
        width: 25% !important;
/*        height: 75px !important;
        padding-top: 7px !important;*/
    }
    /*
    .header-logo {
        height: 170px !important;        
    }
    #user-avatar-main {
        height: 140px;
    }
    */
}

/* LD Large devices (desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199px) { 
    h1 {
        /*color: pink !important;*/
    }
    .header-logo {
        
    }
    
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { 
    h1 {
        /*color: red !important;*/
    }    
}

