/* --social buttons were not coming in the center of the page that is the reason we had to set up sevaral media queries for the size of the button.
Initially we had to take a fixed width of the buttons as buttons were showing in different sizes according to their icon.-- */

.social-buttons {
    padding: 0px;
    margin-top: 10px;
    margin-bottom: 0px;
    margin-left:;
    margin-right:;
}


.buttons {
    /*padding: 10px 15px;*/
    background-color: transparent;
    text-decoration: none;
    font-size: 16px;
    color: #FFF;
    /*width: 30px;*/
    margin: 2px ;
    /*border-radius:50%;*/
    /*background-color: #ccc;*/
    padding:6px 2px;
    height:40px;
    width:40px ;
    border-radius: 50%;
}


.twitter-share, .google-share, .facebook-share, .linkedin-share {
    color: #CCCCCC;
    background-color: transparent;
    font-size: 15px;
}

/*.fa {*/
    /*font-size:15px;*/
/*}*/

.btnz:hover {
    color: #efefef;


}

a {
    color: gray;
}



/* ----- Media queries----- */
@media(min-width:992px) and (max-width:1199px) {
    .buttons {
        width: 32px;
        height: 32px;
        padding:3px 2px;
    }

}

/*ipad*/
@media (min-width:787px) and (max-width:786px){
    .buttons {
        width: 40px;
    }
}
@media (min-width: 749px) and (max-width: 767px) {
    .buttons {
        width:55px;
        height: 55px;
        padding:14px 2px;
    }
    /*.twitter-share, .google-share, .facebook-share, .linkedin-share {*/
        /*font-size: 20px;*/

    /*}*/

}
@media (min-width: ) and (max-width: 748px) {
    /*.buttons {*/
        /*padding: 4px 2px;*/
    /*}*/
}
@media (min-width: 695px) and (max-width: 748px) {
    .buttons {
        width:50px;
        height: 50px;
        padding:11px 2px;
    }
}
@media (min-width: 673px) and (max-width: 696px) {
    .buttons {
        width:48px;
        height: 48px;
        padding:10px 7px;
    }
}
@media (min-width: 630px) and (max-width: 672px) {
    .buttons {
        width:44px;
        height: 44px;
        padding:9px 2px;
    }
}
@media (min-width: 608px) and (max-width: 629px) {
    .buttons {
        width:42px;
        height: 42px;
        padding:7px 0px;
    }
}
@media (min-width: 565px) and (max-width: 607px) {
    .buttons {
        width:38px;
        height: 38px;
        padding:5px 0px;
    }
}
@media(min-width:533px) and (max-width:564px) {
    .buttons {
        width: 35px;
        height: 35px;
        padding-bottom: 2px ;
        padding-right:2px;

    }
}
@media (min-width: 500px) and (max-width:532px) {
    .buttons {
        width:32px;
        height: 32px;
    }
}
@media (min-width: 457px) and (max-width: 499px) {
    .buttons {
        width:28px;
        height: 28px;
        padding:2px 2px;
    }
}
@media(min-width:425px) and (max-width:458px) {
    .buttons {
        width: 25px;
        height: 25px;
        margin: 2px ;
        padding:0px 2px;
    }
}
@media(min-width:413px) and (max-width:424px) {
    .buttons {
        width: 50px;
        height: 50px;
        padding:12px 2px;
    }

}
/*iPhone 6 Plus and Nexus 5X*/
@media (min-width:403px) and (max-width:414px){
    .buttons {
        width: 50px;
        height: 50px;
        padding:12px 2px;
    }
}
@media (min-width:360px) and (max-width:402px){
    .buttons {
        width: 42px;
        height: 42px;
    }
}
@media (min-width:340px) and (max-width:359px){
    .buttons {
        width: 38px;
        height: 38px;
    }
}
@media(min-width:322px) and (max-width:339px) {
    .buttons {
        width: 35px;
        height: 35px;
    }
}
@media(min-width:306px) and (max-width:321px) {
    .buttons {
        width: 32px;
        height: 32px;
        padding:3px 7px;
    }
}
/*iPhone 5*/
@media (min-width:319px) and (max-width:320px){
    .buttons {
        width: 33px;
        height: 33px;
        padding:3px 7px;
    }
}
@media(min-width:293px) and (max-width:305px) {
    .buttons {
        width: 30px;
        height: 30px;
        padding:3px 7px;
    }
}
@media(min-width:284px) and (max-width:294px) {
    .buttons {
        width: 28px;
        height: 28px;
        padding:3px 7px;
    }
}
@media(min-width:200px) and (max-width:285px) {
    .buttons {
        width: 25px;
        height: 25px;
        padding:0px 2px;
    }

}