#sync1 .item{
  background: #0c83e7 none repeat scroll 0 0;
    border-radius: 3px;
    color: #fff;
    height: 467px;
    margin: 5px;
    padding: 0;
    text-align: center;
    }
    #sync2 .item{
        background: #e1515a;
         color: #fff;
    cursor: pointer;
    height: 74px;
    margin: 5px;
       text-align: center;
    }
    #sync2 .item h1{
      font-size: 18px;
    }
    #sync2 .synced .item{
      background: #e30613 none repeat scroll 0 0;
    }
	
	   #sync1 .item h1{  
    color: #fff;
    float: left;
    font-family: inherit;
    font-size: 26px;
    font-weight: 500;
    line-height: 1.1;
    padding-left: 34px;
    padding-top: 328px;
    position: absolute;
    text-align: left;   text-shadow: 1px 1px #000000;
	}
	
		   #sync1 .item p{  
    color: #fff;
    float: left;
    font-family: inherit;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.1;
    padding-left: 38px;
    padding-top: 367px;
    position: absolute;
    text-align: left;
	   text-shadow: 1px 1px #000000;  text-transform: uppercase;
	}
img {
  /* Responsive images (ensure images don't scale beyond their parents) */

  max-width: 100%;
  /* Part 1: Set a maxium relative to the parent */

  width: auto\9;
  /* IE7-8 need help adjusting responsive images */

  height: auto;
  /* Part 2: Scale the height according to the width, otherwise you get stretching */

  vertical-align: middle;
  border: 0;
  -ms-interpolation-mode: bicubic;
}



.container {
  margin-right: auto;
  margin-left: auto;
  *zoom: 1;
}



[class^="icon-"],
[class*=" icon-"] {
  background-image: url("../img/glyphicons-halflings-green.png");
    background-position: right top;
    background-repeat: no-repeat;
    display: inline-block;
    height: 55px;
    line-height: 14px;
    margin-top: 4px;
    vertical-align: text-top;
    width: 27px;
}


.icon-prev{
    background-position: left top;
    background-repeat: no-repeat;
    display: inline-block;
    height: 55px;
    line-height: 14px;
    margin-top: 4px;
    vertical-align: text-top;
    width: 27px;
}


/* White icons with optional class, or on hover/focus/active states of certain elements */
.icon-white,
.nav-pills > .active > a > [class^="icon-"],
.nav-pills > .active > a > [class*=" icon-"],
.nav-list > .active > a > [class^="icon-"],
.nav-list > .active > a > [class*=" icon-"],
.navbar-inverse .nav > .active > a > [class^="icon-"],
.navbar-inverse .nav > .active > a > [class*=" icon-"],
.dropdown-menu > li > a:hover > [class^="icon-"],
.dropdown-menu > li > a:focus > [class^="icon-"],
.dropdown-menu > li > a:hover > [class*=" icon-"],
.dropdown-menu > li > a:focus > [class*=" icon-"],
.dropdown-menu > .active > a > [class^="icon-"],
.dropdown-menu > .active > a > [class*=" icon-"],
.dropdown-submenu:hover > a > [class^="icon-"],
.dropdown-submenu:focus > a > [class^="icon-"],
.dropdown-submenu:hover > a > [class*=" icon-"],
.dropdown-submenu:focus > a > [class*=" icon-"] {
  background-image: url("../img/glyphicons-halflings-white.png");
}


.icon-chevron-left {
background-position: left top;
   margin-top: 161px;
}
.icon-chevron-right {
background-position: right top;
   margin-top: 161px;
}



  .span12 {
 margin: 0 auto;
    width: 988px;
  }