body {
  height: 100%;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
body header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  padding: 5px 25px;
  background: #000000;
}
body {
  background: #eeeeee !important;
  overflow: hidden !important;
}
.margin-img-left {
  margin: 0 0 0 30px;
}
.card {
  display: flex;
  flex-grow: 1;
  flex-direction: column;
  overflow-y: auto;
  margin: 1%;
  padding: 16px;
  color: #757575;
  border-radius: 5px;
  background-color: #fff;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12),
    0 3px 1px -2px rgba(0, 0, 0, 0.2);
  height: 90%;
  width: 98%;
}
#mobileRatio {
  background: #000000;
  position: fixed;
  top: 61px;
  right: 0;
  bottom: -120px;
  transition-property: visibility;
  z-index: 100000;
  width: 65px;
}
#mobileRatio ul {
  margin: 0;
  text-align: center;
  padding: 35px 0 0 0;
}
#mobileRatio ul li {
  margin: 15px 0;
}
.fa {
  color: #fff;
}
#mobileRatio .fa {
  /*font-size: 35px;*/
}
header {
  /*float: left;*/
  width: 100%;
  padding: 0 1%;
}
header .close-icons {
  padding: 20px 16px 16px 16px;
}
.fa-2x {
  font-size: 1.6em !important;
}
.size {
  font-size: 1.5em !important;
}
.tablet-rotation {
  -ms-transform: rotate(90deg); /* IE 9 */
  -webkit-transform: rotate(90deg); /* Chrome, Safari, Opera */
  transform: rotate(90deg);
}
.mobile-rotation {
  -ms-transform: rotate(90deg); /* IE 9 */
  -webkit-transform: rotate(90deg); /* Chrome, Safari, Opera */
  transform: rotate(90deg);
}
header .close-icons i {
  margin: 0 20px 0 0;
}
#sites ul,
#shops ul {
  list-style: none;
}
#sites ul li,
#shops ul li {
  display: inline-block;
}
#sites ul li img,
#shops ul li img {
  cursor: pointer;
  display: block;
  width: 100%;
}
#sites ul li a,
#shops ul li a {
  display: block;
  margin: 10%;
  text-decoration: none;
}
.nav-tabs {
  border: 0px !important;
  text-align: center;
  font-size: 14px;
}
.nav-tabs li a {
  color: #757575;
}
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
  border-bottom: 2px solid #004969 !important;
  border-top: 0px !important;
  border-left: 0px !important;
  border-right: 0px !important;
}
.nav > li > a:hover,
.nav > li > a:focus {
  text-decoration: none;
  background-color: #fff !important;
}
.nav-tabs > li > a {
  margin-right: 0px !important;
  line-height: 2 !important;
  border: 0px solid transparent !important;
  border-radius: 0px 0px 0 0 !important;
}
.laptop iframe {
  display: block;
  height: 768px;
  width: 1366px;
  margin-top: 44px;
  margin-left: 175px;
}
.tablet iframe {
  display: block;
  height: 1024px;
  width: 758px;
  margin: 0 auto;
}
.tabletPortail iframe {
  display: block;
  height: 768px;
  width: 1024px;
  margin: 0 auto;
  margin-top: 50px;
  margin-bottom: 50px;
}
.phone iframe {
  display: block;
  height: 736px;
  width: 414px;
  margin: 0 auto;
  margin-top: 60px;
}
.phonePortail iframe {
  display: block;
  height: 414px;
  width: 731px;
  margin: 0 auto;
  margin-top: 210px;
  margin-bottom: 20px;
}
img {
  cursor: pointer;
}
img.preview-image {
  position: fixed;
  z-index: 1001;
  top: 50%;
  transform: translateY(-50%);
  max-width: 50%;
  border: 1px solid #ddd;
}
.d-inline-block {
  display: inline-block;
}

.templateTitle {
  background: #000000;
  color: #fff;
  padding: 5px;
  font-weight: bold;
  text-decoration: none;
}