Skip to content
Snippets Groups Projects
style.css 11.07 KiB
html {
  overflow : hidden ;
  height : 100% ;
}

body {
  overflow : auto ;
  overflow-x : hidden ;
  height : 100% ;
}

@media(max-width:767px){
  body {
    padding-bottom : 30px ;
  }
}

#root-containet {
  background : #fff ;
}

#program {
  position : relative ;
}

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

.no-margin-bottom {
  margin-bottom : 0 ;
}

script {
  display : block ;
}

@media(max-width:767px){
  .teaser-left {
    margin-bottom : 20px ;
    display : block ;
    margin-left : auto ;
    margin-right : auto ;
  }
  
  .teaser-right {
    margin-bottom : 20px ;
    display : block ;
    margin-left : auto ;
    margin-right : auto ;
  }
}

@media(min-width:768px){
  .teaser-left {
    margin-right : 20px ;
    margin-bottom : 20px ;
    float : left ;
    max-width : 35% ;
  }
  
  .teaser-right {
    margin-left : 20px ;
    margin-bottom : 20px ;
    float : right ;
    max-width : 35% ;
  }
}



.Map {
  text-align : center ;
  padding : 5px;
  list-style-type : none ;
  margin-top : 5px ;
  margin-bottom : 5px;
  margin-left : auto ;
  margin-right : auto ;
  display : block ;
}

.Map li {
  display : inline-block ;
  margin : 0px ;
  width : 30.2% ;
  vertical-align : middle ;
}

.square {
  width : 100% ;
  padding-bottom : 100% ;
  position : relative ;
}

.square > a {
  display : block ;
  position : absolute ;
  left : 0 ;
  right : 0 ;
  width : 100% ;
  height : 100% ;
}

.tile, .empty_tile {
  border: 0px ;
  min-height : 0px ;
  display: inline-block ;
  position: relative ;
}

#tile_top_container,
#tile_left_container,
#tile_right_container,
#tile_bottom_container {
  -webkit-box-shadow: 0px 0px 10px #000;
  box-shadow: 0px 0px 10px #000;
  background-color: #000 ;
  width : 100% ;
  height : 100% ;
  z-index: 0 ;
}

#tile_center_container {
  width : 100% ;
  height : 100% ;
  z-index : 1 ;
}

#tile_top,
#tile_left,
#tile_right,
#tile_bottom,
#tile_center
{
  min-width : 100% ;
  width : 100% ;
}

#tile_top, #tile_top_container {
  border-top-right-radius: 20% ;
  border-top-left-radius: 20% ;
}

#tile_left, #tile_left_container {
  border-top-left-radius: 20% ;
  border-bottom-left-radius: 20% ;
}

#tile_right, #tile_right_container {
  border-top-right-radius: 20% ;
  border-bottom-right-radius: 20% ;
}

#tile_bottom, #tile_bottom_container {
  border-bottom-right-radius: 20% ;
  border-bottom-left-radius: 20% ;
}

.arrow, .boussole {
  -webkit-border-radius: 50% ;
  border-radius: 50% ;
  margin : auto ;
  width: 25% ;
  height: 25% ;
  -webkit-box-shadow: 0px 0px 10px #000;
  box-shadow: 0px 0px 10px #000;
  z-index: 2 ;
  display : inline-block ;
  vertical-align : middle ;
  background-size : contain ;
}

.overlay {
  position : absolute ;
  left : 0 ;
  top : 0 ;
  height : 100% ;
  width : 100% ;
  text-align : center ;
}

.overlay::before {
  content: '\200B';
  display: inline-block;
  height: 100%; 
  vertical-align: middle;
}

.boussole[transform=r0] {
  background-image: 
    url('../Images/boussole_overlay.png'),
    url('../Images/boussole_r0.png') ;
}

.boussole[transform=r1] {
  background-image: 
    url('../Images/boussole_overlay.png'),
    url('../Images/boussole_r1.png') ;
}

.boussole[transform=r2] {
  background-image: 
    url('../Images/boussole_overlay.png'),
    url('../Images/boussole_r2.png') ;
}

.boussole[transform=r3] {
  background-image: 
    url('../Images/boussole_overlay.png'),
    url('../Images/boussole_r3.png') ;
}

.boussole[transform=r0_flip] {
  background-image: 
    url('../Images/boussole_overlay.png'),
    url('../Images/boussole_r0_flip.png') ;
}

.boussole[transform=r1_flip] {
  background-image: 
    url('../Images/boussole_overlay.png'),
    url('../Images/boussole_r1_flip.png') ;
}

.boussole[transform=r2_flip] {
  background-image: 
    url('../Images/boussole_overlay.png'),
    url('../Images/boussole_r2_flip.png') ;
}

.boussole[transform=r3_flip] {
  background-image: 
    url('../Images/boussole_overlay.png'),
    url('../Images/boussole_r3_flip.png') ;
}

.Map a:hover .arrow_top,
.Map a:hover .arrow_left,
.Map a:hover .arrow_right,
.Map a:hover .arrow_bottom
{
  -webkit-box-shadow: 0px 0px 30px #7abfe7;
  box-shadow: 0px 0px 30px #7abfe7;
}

.arrow_top {
  background-image : url('../Images/arrow_top_dark.png') ;
}

.arrow_left {
  background-image : url('../Images/arrow_left_dark.png') ;
}

.arrow_right {
  background-image : url('../Images/arrow_right_dark.png') ;
}

.arrow_bottom {
  background-image : url('../Images/arrow_bottom_dark.png') ;
}

.Map a:hover .arrow_top {
  background-image : url('../Images/arrow_top.png') ;
}                                                                                            
.Map a:hover .arrow_left { 
  background-image : url('../Images/arrow_left.png') ;
}                                                                                            
.Map a:hover .arrow_right {
  background-image : url('../Images/arrow_right.png') ;
}                                                                                            
.Map a:hover .arrow_bottom {
  background-image : url('../Images/arrow_bottom.png') ;
}

.note {
  width : 100% ;
  height : 20em ;
  resize : vertical ;
}

#local-notes-panel .panel-title {
  padding-top : 9px ;
  padding-bottom : 8px ;
}

.example-list {
  list-style-type : none ;
  padding : 0 ;
}

.example-list li {
  display : inline-block ;
}

.tabbed-heading {
  padding-bottom : 0 ;
  padding-left : 5px ;
  padding-right : 5px ;
  position : relative ;
}

#btn-close-library {
  padding : 10px ;
  position : absolute ;
  right : 0 ;
  top : 0 ;
  text-decoration : none ;
  border-left : 1px solid #ddd ;
  border-bottom : 1px solid #ddd ;
  border-bottom-left-radius : 5px ;
}

#btn-close-library:hover {
  background : #ccc ;
}

#open-btn {
  text-decoration : none ;
}

.tabbed-heading > .nav-tabs {
  border-bottom : 0 ;
}

.no-top-border-lists > .list-group > .list-group-item:first-child {
  border-top : 0 ;
}

.pgm-command {
  white-space : nowrap ;
  overflow : auto ;
}

.pgm-command input {
  margin-top : -10px ;
  margin-bottom : -10px ;
}

.pgm-block {
  padding : 0 ;
  margin : 0 ;
}

.pgm-block > .panel-heading {
  border-radius : 0 ;
  white-space : nowrap ;
  overflow : auto ;
  z-index : 110 ;
}

.pgm-block > .list-group {
  box-sizing : content-box ;
  min-height : 2em ;
  border-left : 15px solid #ddd ;
}

.pgm-block > .list-group:last-child {
  border-bottom : 15px solid #ddd ;
}

.pgm > ul {
  min-height : 2em ;
}

#pgm {
  min-height : 39em ;
  text-align : center ;
  box-sizing : content-box ;
}

#pgm-main {
  text-align : left ;
}

.pgm > .panel-heading {
  padding-top : 9px ;
  padding-bottom : 8px ;
  overflow : hidden ;
}

#pgm-title {
  margin-top : 9px ;
  margin-right : 10px ;
}

#phone-toolbar {
  position : absolute ;
  top : 0 ;
  margin : 0 ;
  height : calc(100% - 20px) ;
  width : calc(100% - 30px) ;
  max-height : 100vh ;
  text-align : center ;
  pointer-events : none ;
  box-sizing : content-box ;
}

@media(max-width:767px){
  #phone-toolbar {
    width : 100% ;
  }
}

#phone-toolbar:before {
  content: '\200B';
  display: inline-block;
  height: 100%; 
  vertical-align: middle;
}

#phone-toolbar > .btn-group {
  position : absolute ;
  display : inline-block ;
  bottom : 20px ;
  margin : 0 ;
  transform : translate(-50%, 0) ;
  overflow : hidden ;
  white-space : nowrap ;
  pointer-events : all ;
}

#phone-toolbar > .btn-group.fixed-bottom {
  position : fixed ;
  bottom : 10px ;
}

#phone-toolbar > .btn-group > .btn {
  float : none ;
  display : inline-block ;
}


#desktop-switches {
  margin-right : 10px ;
}

.block-add {
  text-align : center ;
}

.pgm-recv {
  margin : 0 ;
  padding : 0 ;
  display : inline-block ;
  list-style-type : none ;
}

.pgm-recv li {
  display : inline-block ;
}

.pgm-recv .list-group-item {
  border : 1px solid #ddd ;
  border-radius : 5px ;
  vertical-align : middle ;
  padding : 3px;
}

.pgm-recv-void > .sortable-ghost *,
.pgm-recv-void > .library-ghost * {
  display : none !important ;
}

.pgm-recv-void > .sortable-ghost,
.pgm-recv-void > .library-ghost {
  border-radius : 0 !important ;
  border : 4px solid #337ab7 !important ;
  line-height : 0 ;
  color : #fff ;
  margin : 0 ;
  padding : 0 ;
  z-index : 101 ;
  width : 100%
}

.pgm-block.add-target,
.pgm-command.add-target {
  border-top : 15px solid #337ab7 !important ;
}

.error-target {
  border : 4px solid #ac2925 !important ;
  border-radius : 5px ;
}

.copy-source,
.placeholder.add-target,
input.add-target {
  border : 4px solid #337ab7 !important ;
  border-radius : 5px ;
}

.library-group .sortable-ghost {
  display : none !important ;
}

/*
.pgm-recv > .sortable-ghost+.placeholder {
  display : inline-block ;
  border : 2px solid #ddf ;
}

.pgm-recv > .sortable-ghost~.placeholder {
  display : inline-block ;
  border : 2px solid #ddf ;
}
*/

.pgm-recv > .placeholder,
.pgm-recv > .field {
  display : none ;
}

.pgm-recv > .placeholder:only-child,
.pgm-recv > .field:only-child {
  display : inline-block ;
}

.pgm-recv .list-group-item input {
  margin : 0 ;
}

.pgm-recv .list-group-item .placeholder {
  margin : 0 ;
}

.placeholder {
  padding : 3px ;
  padding-left : 15px ;
  padding-right : 15px ;
  margin-top : -10px ;
  margin-bottom : -10px ;
  color : #aaa ;
  border : 1px solid #ddd ;
  background : rgb(245, 245, 245) ;
  border-radius : 3px ;
  display : inline-block ;
}

.filter-void .pgm-type-bool,
.filter-void .pgm-type-int,
.filter-void .pgm-type-str {
  display : none ;
}

.filter-color .pgm-type-void,
.filter-color .pgm-type-direction,
.filter-color .pgm-type-bool,
.filter-color .pgm-type-int,
.filter-color .pgm-type-str {
  display : none ;
}

.filter-direction .pgm-type-color,
.filter-direction .pgm-type-void,
.filter-direction .pgm-type-bool,
.filter-direction .pgm-type-int,
.filter-direction .pgm-type-str {
  display : none ;
}

.filter-int .pgm-type-direction,
.filter-int .pgm-type-color,
.filter-int .pgm-type-void,
.filter-int .pgm-type-bool,
.filter-int .pgm-type-str {
  display : none ;
}

.filter-bool .pgm-type-direction,
.filter-bool .pgm-type-color,
.filter-bool .pgm-type-void,
.filter-bool .pgm-type-int,
.filter-bool .pgm-type-str {
  display : none ;
}

.filter-str .pgm-type-direction,
.filter-str .pgm-type-color,
.filter-str .pgm-type-void,
.filter-str .pgm-type-int,
.filter-str .pgm-type-bool {
  display : none ;
}

.fixed-top {
  position : fixed !important ;
  top : 10px ;
}

@media(max-width:767px){
  .col-xs-12, 
  .col-md-9,
  .col-md-3 {
    padding : 0px ;
  }

  .col-xs-12 .nav-tabs li a {
    padding : 10px ;
  }

 .row-offcanvas {
    position: relative;
    -webkit-transition: all .25s ease-out;
         -o-transition: all .25s ease-out;
            transition: all .25s ease-out;
    overflow-y : visible ;
  }

  .row-offcanvas-left {
    left: 0;
  }

  .row-offcanvas-left
  .sidebar-offcanvas {
    left: calc(-100% - 30px);
    display : none ;
  }

  .row-offcanvas-left.active
  .sidebar-offcanvas {
    left: calc(-100% - 30px);
    display : block ;
  }

  .row-offcanvas-left.active {
    left: calc(100% + 60px) ;
  }

  .row-offcanvas-right {
    right: 0;
  }

  .sidebar-offcanvas {
    position: absolute ;
    top: 0;
    width: 100%;
  }
}