
/* Extra small devices (phones, up to 480px) */


@media screen and (max-width: 767px) {
  h1, h2, h3, p, body{font-family:calibri, sans-serief !important;}
h2{
    font-size: 25px !important;
   
   }
p{font-size:16px  !important;}
.FeaturesIcon{float:left !important;}
.indexDivFirstSection{color:#fff;text-align:center;    padding: 8% 3% 3% 3% !important;}

.indexSecondSectionTitle {    padding-top: 10%;    padding-bottom: 10%;    text-align: center; padding-left: 3% !important; padding-right: 3%  !important;}
.indexSecondSectionPara {    padding-bottom: 3%;   text-align:left !important;   }
.indexThirdSectionTitle {    padding-top: 5%;    padding-bottom: 3%;   text-align: center; }
.firstSectionH2 {    padding: 24% 3% 0 3% !important;}

.indexSecondSectionPara, .indexThirdSectionTitle, .indexThirdSectionPara, .EngagementEmployeeDiscounts, .ThirdSectionSubPara, .FifthSectionTitle, .RecognitionSectionSixthTitle, .RecognitionSectionSixthPara, .employee_savingDiscountingText, .companyThirdSectionPara {  padding-left: 3% !important;    padding-right: 3% !important; }

.sendCVs{color: #000;    background-color: #f2f2f2 !important;    margin-left: 3%  !important;    margin-right: 3%  !important;    padding: 3%  !important;}

.RecognitionSectionSixthTitle{    padding-top: 0%;font-size:25px !important}

.eng_text_para {   margin-left: 3% !important;    margin-right: 3% !important; }

.SecondSectionPara{padding-bottom: 10% !important ;    padding-left: 5%  !important;    padding-right: 5% !important;}

.SecondSectionTitle{padding:5% !important;}
.laptopImage{left: 0 !important;}

.RecognitionSectionFirstTitle { padding-top: 28% !important;    padding-bottom: 3% !important;    color: #fff;    font-size: 25px;    text-align: center;}
.ReconitionFirstSection1stRow{background-position:0px 0px !important;}

.RecognitionSectionFirstTitle h1{ font-size: 25px !important;}

.RecognitionSectionSecondTitle {    padding-top: 5%;    padding-bottom: 3%;    padding-left: 3%;    padding-right: 3%;}
.RecognitionSectionSecondPara {    padding-bottom: 8%;    padding-left: 3%;    padding-right: 3%;}
.savingHolder{width: 238px !important;    padding: 1% 1% 2% 1%;    background-color: rgba(245, 245, 240, 0.5);    box-shadow: 1px 1px 1px 1px #cdcdcd}

.imgHistory, .happynessMobileImage{margin-bottom:1px;}



.ThirdSectionTitle {    padding-top: 8%;    padding-bottom: 4%;    padding-left: 3%;    padding-right: 3%;}
.ThirdSectionPara {    padding-bottom: 5%;    padding-left: 3%;    padding-right: 3%}
.RecognitionSectionfourthTitle {    padding-top: 5% !important;    padding-left: 3%  !important;    padding-right: 3%  !important;}
.savingPage {    padding:9% 9% 9% 9% !important;    text-align: center;}
.UnbeatableEmployeeDiscounts {    padding: 5% 3% 6% 3% !important;    text-align: center;    font-size: 19px}
.DiscountingText {    text-align: center;    padding: 9% 3% 9% 3% !important;}
.companySectionFirstTitle {    padding-top: 23%;    padding-bottom: 5%;    color: #fff;    text-align: center;    padding-left: 3% !important;    padding-right: 3% !important;    font-size: 25px;}
.companySectionTwotitle {    color: #33adda;    box-shadow: 1px 2px 2px 2px #cdcdcd;    text-align: center;    padding: 3% 3% 3% 3% !important;    margin-left: 10px;    margin-right: 10px;    margin-top: 9px;    margin-bottom: 6px}

.RecognitionSectionSecondTitle, .ThirdSectionTitle {    padding-top: 8% !important;    padding-bottom: 1% !important;    padding-left: 3% !important;    padding-right: 3% !important;}

.RecognitionSectionSecondPara, .ThirdSectionPara {    padding-bottom: 11% !important;    padding-left: 3% !important;    padding-right: 3% !important;}


.indexDivFirstSectionDownArrow, .engment_down_Arrow { margin-top: 0px !important;    padding-bottom: 1% !important;}

.employee_benefits1stImage {
    background-position: 0px !important;    background-size: 100% 88% !important;
}

.employee_benefits1stTextHolder{padding: 26% 13% 22% 13% !important}
.perksText1stDiv {font-size:50px;font-weight: 600;}










}









/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991px) {
  h1, h2, h3, p, body{font-family:calibri, sans-serief !important;}



.indexDivFirstSection {    text-align: center;    padding: 30% 6% 5% 6% !important;}
.firstSectionH2 {    padding: 30% 6% 0 6% !important;}


.indexSecondSectionTitle, .indexSecondSectionPara, .indexThirdSectionTitle, .FifthSectionTitle, .SecondSectionPara, .RecognitionSectionSecondTitle, .RecognitionSectionSecondPara, .ThirdSectionTitle, .ThirdSectionPara, .RecognitionSectionfourthTitle, .RecognitionSectionSixthTitle, .RecognitionSectionSixthPara, .UnbeatableEmployeeDiscounts, .DiscountingText, .indexThirdSectionPara, .SecondSectionTitle,  .companyThirdSectionPara{    padding-left: 6% !important;    padding-right: 6% !important;}

.sendCVs {padding-left: 6% !important;    padding-right: 6% !important;}

.indexSecondSectionTitle, .indexThirdSectionTitle, .SecondSectionTitle, .ThirdSectionTitle, .RecognitionSectionSecondTitle, .RecognitionSectionfourthTitle , .companyThirdSectionPara{padding-top: 0% !important;}



.indexSecondSectionTitle, .indexThirdSectionTitle, .SecondSectionTitle, .ThirdSectionTitle, .RecognitionSectionSecondTitle, .RecognitionSectionfourthTitle , .unbeatabletitle, h2 {font-size:30px !important;}

.SecondSectionPara {padding-bottom: 1% !important;}


#Right_Top_Arrow_CommentBox:before{top:98px !important;}
#leftDirectionTop:before{top:107px !important;}
#Left_Bottom_Arrow_CommentBox2:before{bottom:251px !important;}




.FifthSectionTitle {    padding-top: 1% !important;        padding-bottom: 0% !important;}
.RecognitionSectionFirstTitle{padding-top: 32% !important;}



.RecognitionSectionfourthTitle {    padding-top: 3% !important;}
.savingPage {    padding: 18% 6% 6% 6% !important;    text-align: center;}

.emp_saving_user {    min-height: 160px !important;}

.user_heading{    font-size: 19px !important; }
.contactContainer{    padding: 10% 3% 10% 3% !important;}


.employee_benefits1stTextHolder{padding: 34% 14% 8% 13% !important}





}




/* tablets/desktops and up ----------- */
@media (min-width: 992px) and (max-width: 1199px) {
  h1, h2, h3, p, body{font-family:calibri, sans-serief !important;}




}


/* large desktops and up ----------- */
@media screen and (min-width: 1200px) {

/*
.benepik_header_logo{width: 157px;    height: 60px;    position: relative;    top: -14px;    left: 58px;}
ul.nav li {     margin-top: 10px !important;}
ul.nav li a{font-weight:bold;    font-size: 14px !important;}
ul.nav {margin-left:40px !important;}
.rights{margin-left: 38px !important;}
.indexFourthSectionPara{font-size: 22px !important;font-weight:normal !important;}
*/


.benepik_header_logo{width: 157px;    height: 60px;    position: relative;    top: -7px;    left: 58px;}
ul.nav li {     margin-top: 7px !important;}
ul.nav li a{font-weight:bold;    font-size: 14px !important;}
ul.nav {margin-left:40px !important;}
.rights{margin-left: 38px !important;}
.indexFourthSectionPara{font-size: 22px !important;font-weight:normal !important;}


}