@media (min-width:320px) and (max-width:768px) {
/************* @HEADER BAR  *************/	
.bannerSlider { height: 280px; }
.reachoutwrap .salesInfo { position: absolute; right: 0; }

/************* @INDEX PAGE  *************/
.cartBox { margin-right: 0; }

/************* MODAL BOX  *************/
.simplePopup { width: 85%; min-width: 85%; }
.simplePopupClose { top: 5px; right: 5px; color: #000; font-size: 0; }

/*************  @EVENTS *************/
.eventmodalContainer .owl-carousel .owl-item .item { height: 200px; margin: 60px 0px 0px; }
.eventmodalContainer .itemDetail h2 { font-size: 12px; }
.eventmodalContainer .owl-buttons .owl-next,
.eventmodalContainer .owl-buttons .owl-prev { font-size: 28px; }
.eventmodalContainer .owl-buttons .owl-next { right: -48px; }
.eventmodalContainer .owl-buttons .owl-prev { left: -45px; }
.galleryWrap ul .imgWrap { width: 100%; }
.galleryWrap ul .imgWrap span { background-position: left center; }
/*************  @TAB  *************/
.cd-tabs nav { overflow: auto; }
.cd-tabs-navigation { text-align: left; }
.cd-tabs-navigation a.upcoming { position: relative; top: inherit; right: inherit; }
.cd-tabs-navigation a.upcoming:before { left: 5px; bottom: 22px; }
.newsPage .cd-tabs-navigation { width: 550px; }
.companyPage .cd-tabs-navigation { width: 750px; }
.prodDetailPage .cd-tabs-navigation { width: 460px; text-align: center; }
.trainingPage .cd-tabs-navigation { width: 1160px; }
.eventPage .cd-tabs-navigation,
.upcomingeventPage .cd-tabs-navigation { width: 940px; }


/************* @MEDIA SECTION  *************/
.brandsVideoBox .owl-item { padding: 0 1px; }
.anniverVideoBox .owl-item { padding: 0 1px; }
.articlelist .owl-controls { margin-left: 0; width: 100%; padding: 0 15px; }
.articlelist .owl-controls .icon-arrow:before,
.articlelist .owl-controls .icon-arrow2:before { font-size: 26px; }
.articlelist .owl-controls .icon-arrow:before { display: inline-block; padding: 11px 0 0 0; }
/** FIXES **/
.prodImg { min-width: 100%; }
.productPage .prodItem span { height: auto; }
.productPage .prodItem .prodDetail p { width: auto !important; }
    
  
}


@media (min-width:480px) {
/************* @INDEX PAGE  *************/
 
.itemDetail p { line-height: 22px; }
/************* @BUSINESS OPPORTUNITIES SECTION  *************/
.profitBox { min-height: 210px; }
.profitBox span { display: block; width: 150px; height: 150px; }
.profitBox span small { width: 150px; min-height: 78px; top: 50%; left: 50%; margin: -34px 0 0 -75px; font-size: 55px; }
.profitBox b { bottom: 10px; }
.cd-tabs-content li .profitBox p { font-size: 16px; }



/************* MODAL BOX  *************/
.simplePopup { width: 50%; min-width: 50%; left: 50%;/*margin-left: -25%;*/ }


.upcomingeventPage .tab-content ul li:last-child { padding-bottom: 20px;}
/************* @MODAL BOX - EVENTS  *************/
.eventmodalContainer .owl-carousel .owl-item .item { width: 100%; height: auto; }
.eventmodalContainer .owl-carousel .owl-item .item { margin: 100px 0 0; }

@media (min-width:1024px) {
.icon-search,
.icon-arrow { font-size: 38px; }
.loginForm { width: 0; }
.loginForm h2,
.loginForm form { display: none; }
.loginForm.showhide { width: 400px; }
.loginForm.showhide h2,
.loginForm.showhide form { display: block; }


/****/
#onstartmodal.simplePopup a { display: block; }
}

/*************  @PRODUCT DETAIL *************/
.prodDetailPage .prodetailContainer li { padding: 40px 200px; }
.prodDetailPage .prodetailContainer span { margin: 8px 20px 0 20px; }
.prodDetailPage .supplementTab .transformer-tabs li { width: auto; margin: 0 18px; padding: 0; }
/*************  @NEWS *************/
.newsPage .offerSlider { width: 1200px; }
.upcomingContainer ul li:nth-child(odd) { padding-left: 30px; padding-right: 30px; }
.upcomingContainer ul li:nth-child(even) { padding-right: 30px; padding-left: 30px; }
/*************  @UPCOMINGEVENTS *************/ 
.upcomingeventPage .tab-content ul li { padding: 60px 40px 0; }
.upcomingeventPage .tab-content ul li:last-child { padding-bottom: 60px; }
.upcomingeventPage .tab-content .upcomingDetail { top: 100px; left: 100px; width: 35%; }

.simplePopup.storydetailsPopup,
.simplePopup.businessPopup { width: 30%; min-width: 30%; }
/************* @PRODUCT, EVENT, MEDIA-HOVER - STYLES  *************/
.productPage .prodImg,
.newsPage .mediaImg,
.eventPage .GalleryImg { overflow: hidden; position: relative; }
.productPage .prodItem span,
.newsPage .mediaImg span,
.eventPage .GalleryImg span { -webkit-transition: all 0.5s; transition: all 0.5s; }
.productPage .prodItem:hover .prodImg span,
.newsPage .mediaWrap:hover .mediaImg span,
.eventPage .MainWrapper:hover .GalleryImg span { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); }
.eventPage .GalleryImg.blackbg { -webkit-filter: grayscale(1); filter: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="filter"><feColorMatrix type="matrix" color-interpolation-filters="sRGB" values="0.2126 0.7152 0.0722 0 0 0.2126 0.7152 0.0722 0 0 0.2126 0.7152 0.0722 0 0 0 0 0 1 0" /></filter></svg>#filter'); -webkit-filter: grayscale(1); filter: grayscale(1); transition: all 0.5s; -webkit-transition: all 0.5s; }
.eventPage .MainWrapper:hover .GalleryImg { -webkit-filter: grayscale(0); filter: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="filter"><feColorMatrix type="matrix" color-interpolation-filters="sRGB" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0" /></filter></svg>#filter'); -webkit-filter: grayscale(0); filter: grayscale(0); }
/*************  @SUCCESS STORIES - ACHEIVER TAB  *************/
.achivertabcontent ul li { width: calc(25% - 10px); }
.itemDetail.bannertxtright { }
.itemDetail.bannertxtright h2 { text-align: right; }
}

@media(min-width: 320px) and (max-width: 767px)
{
	.eventmodalContainer .owl-buttons .owl-next, .eventmodalContainer .owl-buttons .owl-prev {
    font-size: 42px!important;
}
.eventmodalContainer .itemDetail h2 {
    font-size: 13px;
    margin-top: -3px!important;
}
}
@media(min-width: 768px) and (max-width: 991px)
{
	.eventmodalContainer .itemDetail h2 
	{
    font-size: 15px;
    margin-top: -3px!important;
    }
}
@media(min-width: 992px) and (max-width: 1199px)
{
		.eventmodalContainer .itemDetail h2 
	{
    font-size: 17px;
    margin-top: -3px!important;
    }
}    
@media(min-width: 1200px) and (max-width: 1600px)
{

	.eventmodalContainer .itemDetail h2 
	{
    font-size: 19px;
    margin-top: -3px!important;
    }
}