﻿/***  CSS MEDIA QUERIES  ***/


/* Min width 1200px */
@media screen and (min-width: 75.000em) {
	
	#navbar { margin-top: .5em }
	
 
	#navbar ul.nav li{
		margin: 0 .69em
	}
	
	#navbar ul.nav li:nth-last-child(1){
		margin-right: 0
	}
	
	#navbar ul.nav li.dropdown ul.dropdown-menu{
		position: absolute;
		top: 96%
	}

	#navbar ul.nav li.dropdown ul.dropdown-menu li a,
	.nav-footer ul.dropdown-menu li a{
		text-align: left;
		padding: 1em;
		border-bottom: 1px solid #ccc;
	}

	#navbar ul.nav li.dropdown ul.dropdown-menu li:nth-last-child(1) a,
	.nav-footer ul.dropdown-menu li:nth-last-child(1) a{
		border-bottom: 0;
	}
	
	

	ul.nav-footer{
		padding: 2em 0;
	}


	.eventList .col-md-9{
		border-right: 1px solid #ccc;
		padding-right: 3%;
	}

	.eventList .col-md-3{
		padding-left: 3%;
	}

	#carousel .carousel-inner{
		height: 260px;
	}
	
	.withEnterpriseWrapper .leftSide{
		border-right: 1px solid #fff;
		width: 320px
	}
	
	.enterpriseBanner #Container .enterprise{
		height: 935px
	}
	
	.homepage-hero-module #Container .content{
		height: 1080px
	}
	
	.timelineWrapper{
		margin:0 auto;
		max-width:84%;
		padding: 0 5%
	}
	
	.comparison table{
		border-right: 3px solid #fff
	}
	
	#videoModal  .modal-lg, #videoModal2  .modal-lg{
		width: 85%;
		height: auto
	}

	#mediaapsmodal  .modal-media{
		width: 49%;
		height: auto
	}

	#enterprisemodal  .modal-media{
		width: 46%;
		height: auto
	}
	
	.comparison .leftTable{
		border-right: 1px solid #ccc
	}

}


/* Mobile Devices */
@media only screen and (max-device-width : 736px){
	html, body{
   		overflow-x: hidden;
	}
	
	body{
		padding-top: 105px
	}

	body.loginPage{
		padding-top: 25px;
	}
	
	.topButtons{
		 
	}
	
	.topButtons a{
		color: #FFF
	}
	
	.topButtons .btn-group{
		padding:.5em;
		width: 100%
	}
	
	.topButtons .btn-group button{
		width: 50%;
		text-transform: uppercase
	}
	
	.btn-group>.btn:first-child:not(:last-child):not(.dropdown-toggle){
		border-top-left-radius: 4px;
		border-bottom-left-radius: 4px;
	}
	
	.btn-group>.btn:not(:first-child):not(:last-child):not(.dropdown-toggle){
		border-top-right-radius: 4px;
		border-bottom-right-radius: 4px;
		 
	}
	
	#rotate .div2 h1{ 
		position: relative;
		margin-top: -30px
	}


	.navbar{
		padding: 0;
	}
	
	.container>.navbar-header{
		margin: 5px 0 0 15px
	}
	
	.container>.navbar-header>.navbar-toggle{
		margin: .2em 0 0 0
	}

	.navbar-nav{
		padding: 0 5%;
	}

	.navbar-header .fa{
		font-size: 1.6em;

	}

	.dropdown-menu{
		width: 100%;
	}
	
	#navbar ul.nav li{
		
	}
	
	#navbar ul.nav li a{
		font-size: 1.6em;
		border-bottom: 1px dotted #ccc;
		text-transform: uppercase;
		display: block;
		padding: .5em;
		font-weight: 300
	}

	#navbar ul.nav li a h2.feature-headline{
		font-size: 1.2em
	}
	
	#navbar ul.nav li.dropdown ul.dropdown-menu li a {
		text-align: center;
		font-size: 1em
	}
	
	#navbar ul.nav li a.free{
		margin: 1em auto;
		border-bottom: none
	}
	
	h1.banner-headline, h1, h2, h2.feature-headline, h3.section-headline, #carousel2 h3{
		font-size: 2em
	}

	.navbar-fixed-top .navbar-collapse{
		max-height: 100vh;	

	}

	.seamless h1{
		font-size: .8em;
	}

	.ef-logo{
		margin-top: .5em;
	}

	.orange, .orange2{
		padding: 1em;
	}

	.orange2 img.cloud{
		width: 80px;
		height: auto;
		margin-top: -60px;
	}

	.orange2 h3{
		font-size: 1.5em;
	}

	.downloads .row{
		margin-top: 2em;
	}

	.hero .learn-how span{
		margin-top: 5%;
	}

	.hero .downloads{
		left: 8%;
		position: relative;
		margin-top: 5%;
	}

	.searchform{
		margin: 1em 0;
	}

	.topSection{
		text-align: center;
		display: block;
	}

	.slider h2{
		font-size: 2em;
	}

	.carousel .item p{
		padding: 0;
		
	}

	.carousel .item{
		padding-left: 0;
		padding-right: 0;

	}

	#solution-highlights #rotate {
    margin-top: 50%;
		margin-top: 20%
	}

	h3.banner-headline{
		font-size: 3rem;
	}

	#solution-highlights{
		background: url(../img/VideoStills_HomePage.jpg);
		background-size: cover
	}
	
	#solution-highlights .content{
		height: 500px
	}
	
	#ef-enterprise .content{
		height: 420px
	}
	
	#ef-enterprise{
		background: url(../img/VideoStills_Enterprise.jpg);
		background-size: cover
	}
	
	#solution-highlights #rotate{
		margin-top: 50%
	}

	#solution-highlights .solution, .stats .heading, .we-are h3, .we-are h3.showtell{
		font-size: 2em;
	}

	#solution-highlights h1{
		font-size: 2em;
	}

	#solution-highlights img, .stats img{
		max-width: 120px;
		height: auto;
	}

	.we-are{
		padding-top: 0;
		text-align: center;
	}

	.stats .col-md-4{
		margin-bottom: 2em;
	}

	.stats, .we-are{
		background-size: cover;
	}

	.stats p{
		font-size: 1.4em;
	}

	.we-are .left p{
		font-size: 1.4em;
	}

	.eventList .col-sm-2, .eventList .col-sm-6{
		margin-bottom: 1em;
	}

	.comparison table th{
		font-size: 1em;
		font-weight: 300;
	}

	.powering{
		background-size: cover;
	}

	.powering h2{
		font-size: 2em;
	}

	.powering  p{
		font-size: 1.5em;
	}

	.powering h3.showtell{
		font-size: 3em;
	}
	
	.powering .col-sm-4{
		margin-bottom: 2em
	}

	.industry-standard p.redefines, .redfines2{
		font-size: 1.8em;
	}

	.industry-standard h3{
		font-size: 2em;
	}

	.dark-grey{
		background-size: cover;
		 height: 50%;
	}

	.dark-grey h2{
		font-size: 2em;
	}

	.dark-grey p{
		font-size: 1.5em;
	}
	
	.industry-standard span.redefines2{
		font-size: 1.2em
	}
	
	.industry-standard .col-sm-6, .industry-standard .col-xs-6{
		margin-bottom: 2em
	}
	
	.ef-media-apps p{
		font-size: 1em;
		font-weight: 500
	}

	footer ul{
		margin-left: 0;
		padding-left: 0
	}

	footer ul li{
		padding: .7em
	}
	
	.nav-footer li a {
		padding: .2em
	}
	
	.nav-footer ul.dropdown-menu{
		top: -507%
	}
	
	.nav-footer ul.dropdown-menu li{
		display: flex
	}
	
	.eventsuite-banner{
		background-size: cover;
		height: 400px
	}
	
	.mediaapps-banner{
		background-size: cover;
		height: 400px
	}

	.eventsuite-banner img, .mediaapps-banner img{
		width: 250px;
		height: auto
	}
	
	.enterpriseBanner {
		background: url(../img/solutions/banner_enterprise.jpg) no-repeat top center;
		background-size: cover;
		 
	}

	.solutionsBanner{
		padding-top: 3%;
	}	

	.solutionsBanner p{
		font-size: 1.2em;
		padding: 2% 0;
	}

	.withEnterprise{
		font-size: 1em;
	}

	.unify{
		 padding-top: 5%;;
		 padding-bottom: 30%;
	}

	.unify h2{
		font-size: 1.5em;
		margin-top: 2%;
	}

	.comparison{
		margin: 8% 0
	}

	.chart h2{
		font-size: 1.3em;
		font-weight: 500;
	}

	.chart p{
		font-size: 1em;
	}

	.square{
		width: 12px;
		height: 12px;
	}

	.comparison h2{
		font-size: 1.5em ;
	}
	
	.comparison table tbody tr td{
		font-size: 1em
	}
	
	.greyBar h2{
		font-size: 1.5em	
	}

	/*** EVENT SUITE ***/
	.eventsuite-banner{
		padding-top: 0;

	}

	.eventsuite-banner h1{
		font-size: 1.7em;
		margin-top: 10px;
	}

	.measurement-analytics{
		padding-bottom: 72%;
	}

	.measurement-analytics h2{
		font-size: 1.2em;
		margin-top: 1%;
	}

	.measurement-analytics p{
		font-size: 1em;
	}

	.measurement-btm{
		padding-top: 1%;
		padding-bottom:4%;
	}

	.measurement-btm .listing ul li{
		font-size: 1.2em;
	}

	.measurement-btm h2{
		font-size: 1.7em;
	}

	.event-suite-powering #Container .content{
		height: 300px
	}

	.event-suite-powering{
		padding-top: 0;
		background: url(../img/VideoStills_EventSuite_Dashboard.jpg) no-repeat top center;
		background-size: cover
	}
	
	.mobileApp{
		padding-top: 0;
		background: url(../img/VideoStills_EventSuite_MobileApp.jpg) no-repeat top center;
		background-size: cover
	}

	.event-suite-powering img{
		width: 50px;
		height: auto;
	}

	.event-suite-powering h2{
		font-size: 1.6em;
		margin-top: 5%
	}


	.heavy p{
		font-size: 1em;
		margin-top: 4%;
	}

	.starburst{
		background: none;
	}

	.starburst .container {
		padding: 0 8%;
	}

	.starburst p{
		font-size: 1.2em;
	}

	.starburst h2{
		font-size: 1.8em;
	}

	.proven{
		background-size: auto;
		height: auto;
		padding-bottom: 5%;
	}

	.proven h2{
		font-size: 1.8em;
		margin: 5% 0;
	}

	.proven p{
		font-size:1em;
	}
	
	/*** MEDIA APPS PAGE ***/	
	.hand img.fadeImg{
			top: 10%;
			width: 100px;
			height: auto
	}

	/*** LEARN PAGE ***/
	.orangebar h1{
		font-size: 1.5em;
	}

	/*** EVENTS PAGE ***/

	.eventsBanner h1{

		padding-top: 1%;
	}

	/*** ABOUT PAGE ***/
	.aboutBanner {
		background-size: 100%;
		height: 160px
		
	}

	.aboutBanner h1{
		font-size: 1.8em;
		
	}

	.bestTechnology, .timeline p, .aboutBanner p{
		font-size: 1.1em;
	}

	.timeline h2{
		font-size: 1.6em;
	}
	
	.bestTechnology h1{
		font-size: 2.2em
	}
	
	.bestTechnology p{
		font-size: 1.1em
	}
	
	.choose h2{
		font-size: 1.8em
	}
	
	.timelineWrapper{
		padding: 0 1em
	}
	
	/*** CONTACT PAGE ***/
	.thepower h1{
		font-size: 1.8em
	}
	
	.contactUs h2{
		font-size: 2em	
	}
	
	.tinynav { 
		width: 90%;
		display: block;
		margin: 1em auto;
		
		text-transform: uppercase
	}
	
	.tinynav option{
		padding: 1em;
		font-size: 1.8em;
	}
	
    .nav-footer { display: none }
	
	#carousel-about .carousel-indicators{
		left: 0;
		margin-left: 0;
		width: 100%;
		position: relative
	}
	
	.mobile-carousel-indicators ul{
		list-style:none;
		padding: 0
	}
	
	#carousel-about .carousel-indicators li{
		width: 23.5%;
		border:1px solid #8b8a8f;
		text-align: center;
		height: 25px;
		padding: 0
	}
	
	#carousel-about .carousel-indicators li.active{
		border:1px solid #8b8a8f;
		padding: 0;
		margin: 0;
		font-weight: 300;
		background: #8b8a8f;
		color: #fff;
		font-size: 1.2em
	}
	
	
	
	.solution-banners img{
		width: 300px;
		height: auto
	}
	
	.mobile-nav-solutions div{
		display: none 
	}
	
	.mobile-nav-solutions a h2{
		font-size: 1.6em;
		text-transform: uppercase;
		color: #8b8a8f
	}
	
	#mediaapsmodal  .modal-media, #enterprisemodal  .modal-media{
		width: 94%
	}
	
	.border-right, #caseStudyTabs li, #caseStudyTabs li:first-child{
		border: none
	}
	
	.boxWrap{
		border: none;
		padding: 0
	}
	
	.hiddenSignin{
		background: #000;
		top: 50px!important;
	}
	
	.hiddenSignin .forgottenPassword a{
		float: none;
		display: block;
		text-align: center
	}

	#webinarTabs li, #webinarTabs li:first-child{
		border: none;
	}

	.ef-manufacturing-banner{

		background-size: cover;
		height: 540px;
	
	}

	.ef-manufacturing-banner img{
		width: 250px;

	}

	.manufacturing-tablet{
		background: url(../img/manufacturing-tablet-mobile.jpg) no-repeat top left;
		background-size: cover;
		padding: 18px 0; 
	}

	.manufacturing-tablet ul{
		font-size: 1em;
		color: #fff;
	}

	.banner-learn{

		background-size: cover;
		height: 220px;
	}

	

}

/* iPad */
@media screen and (min-device-width : 768px) and (max-device-width : 1024px) {
	body{
		padding-top: 80px
	}
	
	h1.banner-headline{
		font-size: 2.5em
	}
	
	h2.feature-headline, h3.section-headline{
		font-size: 2em
	}
	
	.navbar-fixed-top .navbar-collapse{
		max-height: 100vh;
	}
	
	.thinNav{
			padding: 0
	}
	
	#rotate .div2 h1{ 
		position: relative;
		margin-top: -38px
	}
	
	a.navbar-brand img{
		padding-top: 10px
	}
	
	.navbar{
		padding: .5em 0;

	}
	
	.navbar>.container .navbar-brand, .navbar>.container-fluid .navbar-brand{
		margin-left: 0
	}
	
	.navbar-toggle{
		margin-right: 0;
		padding-right: 0
	}
	
	.topSection{
		font-size: 1.2em;
	}
	
	.hiddenNav .tabs p{
		text-align: justify;
		padding: 0 1em;
	}

	.hiddenNav .learnMore{
		padding: .2em;
		display: block;
		text-align: center;
		font-size: .8em;
	}

	#navbar ul.nav li a{
		font-size: 1.6em;
		border-bottom: 1px dotted #ccc;
		text-transform: uppercase;
		display: block;
		padding: .5em;
		font-weight: 300
	}

	#navbar ul.nav li a h2.feature-headline{
		font-size: 1.2em
	}
	
	#navbar ul.nav li.dropdown ul.dropdown-menu li a {
		text-align: center;
		font-size: 1em
	}
	
	#navbar ul.nav li a.free{
		margin: 1em auto;
		border-bottom: none
	}

	.hero .downloads{
		position: absolute;
		bottom: 5%;
		right: 5%;
	}

	.hero .downloads img{
		width: 150px;
		height: auto;
	}

	.seamless h1{
		font-size: 1.4em;
	}
	
	.carousel-inner{
		height: 360px;
	}
	
	.slider h2{
		font-size: 3em
	}
	
	#carousel2 h3.section-headline{
		font-size: 2em
	}

	#carousel2 .item{
		padding: 10% 0
	}		


	.tablet{
		padding: 0;
	}
	
	.enterpriseBanner{
		background: url(../img/VideoStills_Enterprise.jpg) no-repeat top center;
		background-size: cover
	}
	
	.homepage-hero-module{
		background: url(../img/VideoStills_HomePage.jpg) no-repeat top center;
		background-size: cover
	}
	
	.event-suite-powering{
		background: url(../img/VideoStills_EventSuite_Dashboard.jpg) no-repeat top center;
		background-size: cover
	}
	
	.homepage-hero-module #Container .content{
		height: 600px
	}

	.enterpriseBanner #Container .enterprise{
		height: 500px
	}

	.cloud{
		width: 100px;
		height: auto;
	}

	.dropdown-menu{
		width: 100%;
	}
	
	.hiddenNav{
		background: #000
	}

	#navbar ul.nav li.dropdown ul.dropdown-menu li a {
		text-align: center;
	}

	.navbar-header i{
		font-size: 2em;
	}

	.navbar-header {
		float: none;
	}
	
	.navbar-toggle {
		display: block;
	}
	
	.navbar-collapse {
		border-top: 1px solid transparent;
		box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
	}
	
	.navbar-collapse.collapse {
		display: none!important;
	}
	
	.navbar-nav {
		float: none!important;
		margin: 7.5px -15px;
	}
	
	.navbar-nav>li {
		float: none;
	}
	
	.navbar-nav>li>a {
		padding-top: 10px;
		padding-bottom: 10px;
	}
	
	.navbar-text {
		float: none;
		margin: 15px 0;
	}
	
	/* since 3.1.0 */
	.navbar-collapse.collapse.in { 
		display: block!important;
	}
	.collapsing {
		overflow: hidden!important;
	}
	

	.powering, .stats{
		background-size: cover;
	}

	.industry-standard p.redefines{
		font-size: 2em;
	}

	.dark-grey{
		background-size: cover;
		height: auto;
		padding-bottom: 5%;
	}

	.dark-grey p{
		font-size: 1.7em;
	}
	
	.hand img.fadeImg{
		margin-top: 0
	}

	/* ENTERPRISE PAGE */
	
	.enterpriseOverview-banner, .eventsuite-dashboard-banner, .banners{
		height: 320px
	}

	

	.withEnterprise{
		font-size: 1.5em;
	}

	.unify{
		 padding-top: 8%;;
		 padding-bottom: 20%;
	}

	.unify h2{
		font-size: 2em;
		margin-top: 2%;
	}

	

	.chart h2{
		font-size: 2em;
		font-weight: 500;
	}

	.chart p{
		font-size: 1.5em;
	}

	.square{
		width: 12px;
		height: 12px;
	}

	.comparison h2{
		font-size: 2em ;
	}

	/*** EVENT SUITE ***/
	.eventsuite-banner{
		padding-top: 2%;
	}

	.eventsuite-banner h1{
		font-size: 3em;
	}

	.measurement-analytics{
		padding-bottom: 73%;
	}

	.measurement-analytics h2{
		font-size: 2.5em;
		margin-top: 1%;
	}

	.measurement-analytics p{
		font-size: 1.3em;
	}

	
	.event-suite-powering #Container .content{
		height: 500px
	}

	.event-suite-powering{
		padding-top: 0;
		background: url(../img/VideoStills_EventSuite_Dashboard.jpg) no-repeat top center;
		background-size: cover
	}
	
	.mobileApp{
		padding-top: 0;
		background: url(../img/VideoStills_EventSuite_MobileApp.jpg) no-repeat top center;
		background-size: cover
	}

	.event-suite-powering img{
		width: 150px;
		height: auto;
	}

	.event-suite-powering h2{
		font-size: 2em;
		margin-top: 8%
	}

	.heavy{
		background-size: cover;
	}

	.heavy p{
		font-size: 2em;
		margin-top: 2%;
	}

	.starburst{
		background: none;
	}

	.starburst .container {
		padding: 0 8%;
	}

	.starburst p{
		font-size: 1.5em;
	}

	.starburst h2{
		font-size: 1.8em;
	}

	.proven{
		background-size: auto;
		height: auto;
		padding-bottom: 5%;
	}

	.proven h2{
		font-size: 2em;
		margin-top: 1%;
		margin-bottom: 5%;
	}

	.proven p{
		font-size:1.5em;
	}

	/*** LEARN PAGE ***/
	.orangebar h1{
		font-size: 1.8em;
	}

	/*** EVENTS PAGE ***/

	.eventsBanner h1{
		font-size: 3em;
		padding-top: 3%;
	}

	/*** ABOUT PAGE ***/
	.aboutBanner {
		background-size: 100%;
		 height: 300px;
		padding-bottom: 3%
	}

	.bestTechnology h1{
		font-size: 2em;
	 
	}

	.timeline p{
		font-size: 1.4em;
	}

	.timeline h2{
		font-size: 1.8em;
	}
	
	.nav-footer ul.dropdown-menu {
		background-clip: padding-box;
		background-color: #fff;
		border: 1px solid rgba(0,0,0,0.15);
		border-radius: 4px;
		box-shadow: 0 6px 12px rgba(0,0,0,0.176);
		display: none;
		float: left;
		font-size: 14px;
		left: 0;
		list-style: outside none none;
		margin: 2px 0 0;
		min-width: 200px;
		padding: 0;
		position: absolute;
		text-align: left;
		top: -724%;
		z-index: 1000;
	}
	
	.nav-footer ul.dropdown-menu li a{
		font-size: 1.2em
	}
	
	ul.nav-footer{
		padding: 0
	}
	
	.orange, .orange2{
		padding: 1.6em 0;
	}
	
	#carousel-about{
		height: 405px
	}
	
	#carousel-about .carousel-indicators{
		width: 100%;
		bottom: 0;
		left: 40%;
		margin-left: -42%
	}
	
	.boxWrap{
		border: none
	}
	
	.topButtons a{
		color: #FFF
	}
	
	.topButtons .btn-group{
		padding: .5em 1.6em;
		width: 100%
	}
	
	.topButtons .btn-group button{
		width: 50%;
		text-transform: uppercase
	}
	
	.btn-group>.btn:first-child:not(:last-child):not(.dropdown-toggle){
		border-top-left-radius: 4px;
		border-bottom-left-radius: 4px;
	}
	
	.btn-group>.btn:not(:first-child):not(:last-child):not(.dropdown-toggle){
		border-top-right-radius: 4px;
		border-bottom-right-radius: 4px;
		 
	}
	
	.hiddenNav{
		top: 171px
	}
	
	.hiddenSignin{
		top: 128px
	}
	
	.fulfillment-banner{
		padding-bottom: 50%
	}

	#webinarTabs li{
		border: 1px solid #ccc;
		margin-left: -1px;
		margin-top: -1px;
	}

	.ef-manufacturing-banner{
		background-size: cover;
		height: 800px;
	
	}

	.manufacturing-tablet{
		padding-bottom: 5%
	}
	
}

/* Change the NAV breakpoint */
@media (max-width: 1024px) {
  .navbar-header {
      float: none;
  }
  .navbar-left,.navbar-right {
      float: none !important;
  }
  .navbar-toggle {
      display: block;
  }
  .navbar-collapse {
      border-top: 1px solid transparent;
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
  }
  .navbar-fixed-top {
      top: 0;
      border-width: 0 0 1px;
  }
  .navbar-collapse.collapse {
      display: none!important;
  }
  .navbar-nav {
      float: none!important;
      margin-top: 7.5px;
  }
  .navbar-nav>li {
      float: none;
  }
  .navbar-nav>li>a {
      padding-top: 10px;
      padding-bottom: 10px;
  }
  .collapse.in{
      display:block !important;
  }
}