.desktop-only { display: block; }
.header .desktop-only { display: inline-block; }
.mobile-only { display: none; }
.mobile-exp-fade { display: none; }

@media (min-width: 992px) {
	.col-md-5ths {
		width: 20%;
		float: left;
	}
}

@media (min-width: 1200px) {
	.col-lg-5ths {
		width: 20%;
		float: left;
	}
}

@media (max-width:1200px) {
  .sign-in-page .container, .sign-up-page .container, .forgot-pw-page .container, .reset-pw-page .container {
    padding-left: 50px;    
}
}

.vcenter {
	display: inline-block;
	vertical-align: middle;
	float: none;
}

md-toast.md-center {
	top: 10%;
	left: 50%;
	transform: translate3d(-50%, 0, 0);
}

@media (min-width: 990px) {
  .side-collapse { display: none; }
}
@media (max-width: 990px) {

  .sign-in-page .container, .sign-up-page .container, .forgot-pw-page .container, .reset-pw-page .container{
    padding-left: 50px;
    } 
    .navbar-header {
        float: none;
    }
    .navbar-toggle {
        display: none;
    }
    .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: 15px;
        padding-bottom: 15px;
    }


    .navbar-brand {
      width: 100%;
    }
    .navbar-toggle {
      top: 64px;
      position: absolute;
      right: 0px;
    }

    .account-home .navbar-toggle{
      top:0 !important;
    }

    .top_header .btn-demo{
      width:90px;
      font-size: 12px;
    }

    .header_map .btn-demo{
      width:90px;
      margin-right: 4px;
      margin-left: 4px;
    }

    
}

@media (max-width: 800px) {
  .campaign-page .spr-consider-buttons .btn {
    margin-right: 10px;
  }

}

@media (max-width: 768px) {
  #navbar {
    height: auto;
  }

  .spr-obj {
    margin-right: 6px;
  }

  .campaign-page .spr-consider-buttons .btn {
    margin-right: 5px;
  }
}

@media only screen and (min-width : 320px) and (max-width : 680px) {
  div.sign-up-page, div.sign-in-page, div.forgot-pw-page, div.reset-pw-page {
    background-image: url('../images/corner_artwork.png');
    padding-top: 24px;
  }
  .header .links .desktop-only {
    display: none;
  }

  .journey-builder-controls,.btn-download, .faq-icon{
    display: none;
  }
}

/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-width : 320px) and (max-width : 480px) {
/* Styles */

  .sign-in-page .container, .sign-up-page .container, .forgot-pw-page .container, .reset-pw-page .container {
    padding-left: 0px;
  } 

  .account-home .page-container .account-content{
    padding: 0;
  }

  .account-home .page-container .account-content .account-row{
    padding: 25px 37px 12px;
  }

  .journey-builder-container{
    display: none;
  }

  #mobileJourneyDisplay{
    display: block !important;
    padding: 50px 20px 20px 20px;
    text-align: center;
    min-height:100vh;
  }

  #mobileJourneyDisplay img{
    width: 90vw;
    position: relative;
    top: 100px;
  }

  #loader{
    left: 45vw;
  }

  #loader img{
    height: 50px;
  }

  html { overflow-y: hidden; }

  div.sign-up-page, div.sign-in-page, div.forgot-pw-page, div.reset-pw-page {
    background-image: url('../images/corner_artwork.png');
    padding-top: 24px;
  }

  .desktop-only, .header .desktop-only  { display: none; }
  .mobile-only { display: block; }

  .header { padding-top: 0px; }
  .header .links { float: none; margin-top: 0px; }
  .header .links .btn { margin-left: 0; }
  .header .sb-logo {
    margin-bottom: 24px;
  }
  .springboard .sb-logo {
    position: absolute;
    left: 0;
  }



  #unsubscribe .sb-logo{
    position: initial !important;
  }

  .navbar-brand {
    text-align: center;
  }
  .springboard header .navbar-nav .logo-keystone {
  	background-image: url('../images/Keystone_Mobile.png');
  	background-repeat: no-repeat;
    background-position: center;
    margin-bottom: 31px;
  	width: 140px;
  	height: 23px;
  }

  .container {
    padding-left: 12px;
    padding-right: 12px;
  }
  .sign-up-page h1.mobile-padding, .sign-up-page p.mobile-padding {
    padding-left: 20px;
    padding-right: 20px;
  }

  .board-page .spr-board-header input.title{
    width:262px;
  }

  .ShareNDownload{
    margin-top: -45px;
    margin-right: 15px;
  }

  .board-page .spr-board-header{
    height:125px;
  }

  .header-container {
		width: 100%;
		margin: 0 auto;
		position: fixed;
		top: 0px;
		-moz-box-shadow: 0 0 0px 2px #d2d0d0;
		-webkit-box-shadow: 0 0 0px 2px #d2d0d0;
		box-shadow: 0 0 0px 2px #d2d0d0;
	}

  .navigation-container {
		left: 7px !important;
  }
  
  .obj-board-wrapper {
		background: none !important;
		;
	}
	.obj-strategy-wrapper .spr-obj .obj-menu-icon {
		background-image: url(../images/icon_boards_menu.png);
		background-position: center;
		background-repeat: no-repeat;
		width: 16px;
		height: 16px;
		position: absolute;
		top: 16px;
		right: 17px;
		cursor: pointer;
		z-index: 999;
  }
  
  .strategy-wrapper{
    padding: 15px 0 0 0;
    margin-top: 120px;
  }

  .strategic-considerations-container h1 {
		color: #4A4A4A;
		font-size: 16px;
		font-weight: bold;
		line-height: 20px;
		margin-left: 15px;
		margin-bottom: 16px;
		text-align: left;
  }

  .strategic-considerations-container .add-new{
    margin-top: 30px;
    margin-right: 26px;
  }

  .obj-strategy-wrapper .spr-obj {
		width: 100%;
		background-color: #ffffff;
		border-top: 1px solid #0F9DAA;
		height: 100%;
		margin-bottom: 0px;
		padding-bottom: 0px;
		margin-right: 2px;
	}

  .obj-strategy-wrapper .spr-obj .obj-content .strategy-title {
		color: #4A4A4A;
		margin-bottom: 15px;
		border: 0px;
		font-weight: 600;
		font-size: 14px;
		border: 0px;
  }
  
  .obj-strategy-wrapper .spr-obj .obj-content {
		position: relative;
		text-align: left;
		font-size: 14px;
		padding: 20px 30px;
		background-color: #ffffff;
		width: 100%;
  }
  
  .pa-item {
    width: 96% !important;
    height:300px !important;
		float: left;
	}
  
  .spr-obj {
    height: 174px;
  	width: 166px;
    float: left;
    margin-right: 11px;
    font-size: 14px;
  }

  .spr-obj.obj-board.create-board {
		background-color: #0F9DAA !important;
		color: #FFFFFF !important;
		margin-right: 26px;
  }
  
  .obj-board-wrapper, .obj-campaign-wrapper {
  	width: 140px;
  	height: 156px;
    width: 44%;
    margin-left: 3%;
		margin-right: 0px;
  }

  .obj-strategy-wrapper {
    width: 93%;
		background-color: #EEEEEE;
		padding-right: 1px;
		padding-bottom: 1px;
		margin-left: 19px;
		margin-right: 6px;
		margin-bottom: 10px;
  }
  
  .spr-obj .icon-plus {
  	width: 10px;
  	height: 10px;
    background-image: url('../images/Add_m.png');
    margin-top: 37%;
  	margin-bottom: 15px;
  }
  .spr-obj .obj-content {
    font-size: 12px;
    padding: 9px 8px;
  }
  .spr-obj .obj-content .board-counter {
    display: none;
  }

  .obj-faq .obj-content{
    overflow: auto;
  }

  .obj-faq .obj-content h5 {
    margin-top: 0;
    margin-bottom: 7px;
  }

  .obj-faq .obj-content p {
    font-size: 11px;
    margin-bottom: 7px;
    line-height: 14px;
  }

  .campaign-page .loader {
    margin-bottom: 0px;
  }
  .campaign-page .spr-campaign-header {
    padding-left: 0px;
    padding-right: 0px;
    margin-top: 0px;
    height: 115px;
    padding-bottom: 16px;
    padding-top: 0px;
  }
  .campaign-page .spr-campaign-header .spr-campaign-title {
    float: none;
    box-shadow: none;
    border-bottom: 1px solid #f1f1f1;
    margin-bottom: 0px;
  }
  .campaign-page .spr-campaign-header input.title {
    width: 100%;
/*    padding: 12px 18px; */
  }
  .campaign-page .spr-campaign-header .btn-export {
    display: none;
  }
/* .campaign-page .spr-campaign-header .spr-consider-buttons, .campaign-page .spr-campaign-header .spr-board-menu-icon */

  .campaign-page .spr-campaign-header .spr-consider-buttons {
    float: none;
/*    padding-left: 17px;
    padding-right: 17px;*/
    text-align: center;
    padding-top: 8px;
  }
  .campaign-page .spr-campaign-header .spr-consider-buttons .btn-objective {
    float: none;
    margin-right: 3px;
    margin-bottom: 0px;
  }
  .campaign-page .spr-campaign-header .spr-consider-buttons .btn-description {
    float: none;
    margin-right: 0px;
    margin-bottom: 0px;
  }

  .campaign-page .spr-campaign-header .spr-board-menu-icon {
    position: absolute;
    top: 0px;
    right: 0px;
  }

  .mobile-exp-fade {
    width: 100vw;
    height: 100vh;
    background: rgb(0, 0, 0); /* Fall-back for browsers that don't support rgba */
    background: rgba(0, 0, 0, .5);
    z-index: 1010;
    position: absolute;
    top: 0; left: 0;
    text-align: center;
    padding-left: 50px;
    padding-right: 50px;
    color: #ffffff;
    font-size: 12px;
    line-height: 15px;
    font-weight: 300;
    padding-top: 65%;
    display: block;
  }
  .mobile-exp-fade p { margin-top: 36px; }

  .footer-tip .tipMsg{
    min-width: 200px;
  }

  .account-home .page-container .account-content .account-row .country{
    margin-bottom: 35px;
  }

  .footer-tip{
    display: none;
  }
  
  

  
}

/* Smartphones (landscape) ----------- */
@media only screen and (min-width : 321px) {
/* Styles */
}

/* Smartphones (portrait) ----------- */
@media only screen and (max-width : 320px) {
/* Styles */
}

@media only screen and (min-width : 767px) and (max-width : 826px) {
  .sign-up-footer {
    background: #eae8e8;
    padding: 40px 45px 230px 83px;
    width: 100%;
}
}

/* iPads (portrait and landscape) ----------- */
@media only screen and (min-width : 768px) and (max-width : 1200px) {
/* Styles */

.button-section{
  padding-top: 80px;
  float: left;
  text-align: right;
  margin-left: -50px;
}

.right-image-section {
  width: 75%;
  float: left;
  margin-left: -33px;
}

}

@media only screen and (min-width : 768px) and (max-width : 790px) {
  .mac-image-yellow{
    top: -500px;
  }
}


@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 1) {
	.pa-item {
		/* width: 48%; */
		float: left;
	}
}

/* iPads (landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
/* Styles */
}

/* iPads (portrait) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
/* Styles */
}
/**********
iPad 3
**********/
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio : 2) {
/* Styles */
}

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio : 2) {
/* Styles */
}
/* Desktops and laptops ----------- */

/* Large screens ----------- */

/* iPhone 4 ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio : 2) {
/* Styles */
}

@media only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio : 2) {
/* Styles */
}

/* iPhone 5 ----------- */
@media only screen and (min-device-width: 320px) and (max-device-height: 568px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2){
/* Styles */
}

@media only screen and (min-device-width: 320px) and (max-device-height: 568px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2){
/* Styles */
}

/* iPhone 6 ----------- */
@media only screen and (min-device-width: 375px) and (max-device-height: 667px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2){
/* Styles */
}

@media only screen and (min-device-width: 375px) and (max-device-height: 667px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2){
/* Styles */
}

/* iPhone 6+ ----------- */
@media only screen and (min-device-width: 414px) and (max-device-height: 736px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2){
/* Styles */
}

@media only screen and (min-device-width: 414px) and (max-device-height: 736px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2){
/* Styles */
}

/* Samsung Galaxy S3 ----------- */
@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2){
/* Styles */
}

@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2){
/* Styles */
}

/* Samsung Galaxy S4 ----------- */
@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 3){
/* Styles */
}

@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 3){
/* Styles */
}

/* Samsung Galaxy S5 ----------- */
@media only screen and (min-device-width: 360px) and (max-device-height: 640px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 3){
/* Styles */
}

@media only screen and (min-device-width: 360px) and (max-device-height: 640px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 3){
/* Styles */
}




body {
/*  padding-top: 56px; */
  position: relative;
}

pre {
  tab-size: 8;
}

.navbar-inverse {
  background-color: #f8f8f8;
  border-color: #ddd;
}
.navbar-inverse .navbar-toggle, .navbar-collapse {
/*            border-color: #ddd !important; */
  background-color: #ffffff;
  padding-left: 0px;
  padding-right: 0px;
  /* overflow-y: auto; */
  height: 100%;
  overflow: hidden;
  margin-right: -15px;
  width: inherit;
}
.navbar-fixed-top .navbar-collapse {
  max-height: 100%;
}
.navbar-fixed-top .navbar-collapse::-webkit-scrollbar {
    display: none;
}
 /* .navbar-nav>li>a:hover {
 color: #333 !important;
} */
.navbar-toggle, .navbar-toggle:hover {
  background-color: #ffffff !important;
  margin-left:20px;
}
.navbar-toggle .icon-bar {
  background-color: #9b9b9b;
}

@media screen and (max-width: 990px) {
  .side-collapse-container{
      /* width:100%; */
      position:relative;
      left:0;
      transition:left .4s;
  }
  .side-collapse-container.out {
      left:255px;
  }
  .side-collapse {
      top:115px;
      bottom:0;
      left:0;
      width:255px;
      position:fixed;
      overflow:hidden;
      transition:width .4s;
      background-color: #ffffff;
      box-shadow: 4px 0 5px -5px #888;

  }

  .account-home .side-collapse{
    top: 58px !important;
  }
  .side-collapse.in {
      width:0;
  }

  /* .springboard .desktop-menu {
   display: block;
  } */
}

@media screen and (min-width: 767px) {
  .springboard.spr-home .spr-content {
    margin-left: 255px;
  }
  .springboard.account-home .spr-content {
    margin-left: 240px;
  }
}

@media screen and (max-width: 767px){

  .navbar-toggle{
    display: block;
  }

  div.springboard .desktop-menu{
    display: none;
  }
  .spr-content{
    padding-left: 0;
  }

  .spr-home .spr-content{
    margin-left: 15px;
  }
  
   .spr-boards-container .row {
      margin-left: -35px;
  }

  .account-home .account-header{
    text-align: center;
  }
  
  .account-home .account-header .edit-account{
    margin-left: 0 !important;
  }

  .account-home .page-container{
    padding-right: 0;
  }

  .account-home form{
    padding: 0;
    margin-top:20px;
  }

  .account-home .page-container .account-content{
    padding-bottom: 150px;
    border-bottom: 0;
  }

  .account-home .page-container .account-content .account-row .full-name, .account-home .page-container .account-content .account-row .title, .account-home .page-container .account-content .account-row .company, .account-home .page-container .account-content .account-row .country, .account-home .page-container .account-content .account-row .state, .account-home .page-container .account-content .account-row .postal, .account-home .page-container .account-content .account-row .current-pw, .account-home .page-container .account-content .account-row .new-pw, .account-home .page-container .account-content .account-row .confirm-pw, .account-home .page-container .account-content .account-row .save-pw, .account-home .page-container .account-content .account-row .change-pw{
    width:100%;
  }
}

@media screen and (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 18px;}
}

/*    @media screen and (min-width: 769px) {
.side-collapse-container {
    left:200px;
}
}*/

@media (max-width: 450px) and (min-width: 400px) {
  .obj-board-wrapper, .obj-campaign-wrapper{
    height: 176px !important;
  }

  .spr-home .spr-obj {
    height: 194px !important;
    width: 182px !important;
  }

  .spr-home .spr-content{
    margin-left: 8px;
  }

  .board-page .spr-board-header input.title{
    width:305px;
  }

}

@media (width: 768px) {
  .side-collapse-container{
    width: 70%;
  }

  .account-home .page-container .account-content .account-row .full-name, .account-home .page-container .account-content .account-row .title, .account-home .page-container .account-content .account-row .company, .account-home .page-container .account-content .account-row .country, .account-home .page-container .account-content .account-row .state, .account-home .page-container .account-content .account-row .postal, .account-home .page-container .account-content .account-row .current-pw, .account-home .page-container .account-content .account-row .new-pw, .account-home .page-container .account-content .account-row .confirm-pw, .account-home .page-container .account-content .account-row .save-pw, .account-home .page-container .account-content .account-row .change-pw{
    width: 30%;
    margin-right: 6px;
  }
}

@media (max-width: 400px) and (min-width: 320px){
  .spr-home .spr-content{
    margin-left: 4px;
  }
}

@media (max-width: 320px){
  .spr-home .spr-content{
    margin-left: 15px;
  }
}

@media (max-width: 375px){

  .obj-faq .obj-content h5 {
    margin-top: 0;
    margin-bottom: 7px;
    font-size: 12px;
  }

  .obj-faq .obj-content p {
    font-size: 10px;
    margin-bottom: 8px;
    line-height: 12px;
}
}

/* @media (max-width: 990px) and (min-width: 769px){
  .account-home .page-container{
    width: 72%;
  }
}

@media (min-width: 1025px) and (max-width: 1200px) {
  .account-home .page-container{
    width: 100%;
  }
}

@media (width: 834px){
  .account-home .page-container{
    width: 100%;
  }
} */
