barceloneta.less

@import "mixins.less";
@import "widgets.less";
@import "pattern.livesearch.less";
@import "pattern.autotoc.less";
@import "pattern.modal.less";
@import "../bower_components/bootstrap/less/bootstrap.less";
@icon-font-path: "@{pathPrefix}../bower_components/bootstrap/dist/fonts/";


/*
 * Toolbar styles  
 * --------------------------------------------------
 */
body {
    padding-top: 70px;
}
.contentViews {
    .nav();
    .navbar-nav();
}
#contentActionMenus {
    .nav();
    .navbar-nav();
}
#portal-personaltools-wrapper .actionMenu {
    .nav();
    .navbar-nav();
    @media (min-width: @grid-float-breakpoint) {
      .pull-right();
    }
}
.navbar-collapse {
  @media (min-width: @grid-float-breakpoint) {
    #portal-personaltools-wrapper .actionMenu:last-child {
      margin-right: -@navbar-padding-horizontal;
    }
  }
}

.actionMenuSelected {
    .dropdown-header();
}


/*
 * Fonts
 * --------------------------------------------------
 */

@font-face {
  font-family: 'Open Sans';
  src: url('@{pathPrefix}fonts/barceloneta-OpenSans-BoldItalic-webfont.eot');
  src: local('Open Sans Bold Italic'), local('OpenSans-BoldItalic'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-BoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-BoldItalic-webfont.woff') format('woff'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-BoldItalic-webfont.ttf') format('truetype'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-BoldItalic-webfont.svg#open_sansbold_italic') format('svg');
  font-style: italic;
  font-weight: 700;
}

@font-face {
  font-family: 'Open Sans';
  src: url('@{pathPrefix}fonts/barceloneta-OpenSans-Bold-webfont.eot');
  src: local('Open Sans Bold'), local('OpenSans-Bold'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-Bold-webfont.eot?#iefix') format('embedded-opentype'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-Bold-webfont.woff') format('woff'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-Bold-webfont.ttf') format('truetype'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-Bold-webfont.svg#open_sansbold') format('svg');
  font-style: normal;
  font-weight: 700;
}

@font-face {
  font-family: 'Open Sans';
  src: url('@{pathPrefix}fonts/barceloneta-OpenSans-ExtraBoldItalic-webfont.eot');
  src: local('Open Sans Extrabold Italic'), local('OpenSans-ExtraboldItalic'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-ExtraBoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-ExtraBoldItalic-webfont.woff') format('woff'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-ExtraBoldItalic-webfont.ttf') format('truetype'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-ExtraBoldItalic-webfont.svg#open_sansextrabold_italic') format('svg');
  font-style: italic;
  font-weight: 800;
}

@font-face {
  font-family: 'Open Sans';
  src: url('@{pathPrefix}fonts/barceloneta-OpenSans-ExtraBold-webfont.eot');
  src: local('Open Sans Extrabold'), local('OpenSans-Extrabold'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-ExtraBold-webfont.eot?#iefix') format('embedded-opentype'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-ExtraBold-webfont.woff') format('woff'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-ExtraBold-webfont.ttf') format('truetype'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-ExtraBold-webfont.svg#open_sansextrabold') format('svg');
  font-style: normal;
  font-weight: 800;
}

@font-face {
  font-family: 'Open Sans';
  src: url('@{pathPrefix}fonts/barceloneta-OpenSans-Italic-webfont.eot');
  src: local('Open Sans Italic'), local('OpenSans-Italic'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-Italic-webfont.eot?#iefix') format('embedded-opentype'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-Italic-webfont.woff') format('woff'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-Italic-webfont.ttf') format('truetype'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-Italic-webfont.svg#open_sansitalic') format('svg');
  font-style: italic;
  font-weight: 400;
}

@font-face {
  font-family: 'Open Sans';
  src: url('@{pathPrefix}fonts/barceloneta-OpenSans-LightItalic-webfont.eot');
  src: local('Open Sans Light Italic'), local('OpenSansLight-Italic'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-LightItalic-webfont.eot?#iefix') format('embedded-opentype'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-LightItalic-webfont.woff') format('woff'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-LightItalic-webfont.ttf') format('truetype'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-LightItalic-webfont.svg#open_sanslight_italic') format('svg');
  font-style: italic;
  font-weight: 300;
}

@font-face {
  font-family: 'Open Sans';
  src: url('@{pathPrefix}fonts/barceloneta-OpenSans-Light-webfont.eot');
  src: local('Open Sans Light'), local('OpenSans-Light'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-Light-webfont.woff') format('woff'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-Light-webfont.ttf') format('truetype'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-Light-webfont.svg#open_sanslight') format('svg');
  font-style: normal;
  font-weight: 300;
}

@font-face {
  font-family: 'Open Sans';
  src: url('@{pathPrefix}fonts/barceloneta-OpenSans-Regular-webfont.eot');
  src: local('Open Sans'), local('OpenSans'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-Regular-webfont.woff') format('woff'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-Regular-webfont.ttf') format('truetype'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-Regular-webfont.svg#open_sansregular') format('svg');
  font-style: normal;
  font-weight: 400;
}

@font-face {
  font-family: 'Open Sans';
  src: url('@{pathPrefix}fonts/barceloneta-OpenSans-SemiboldItalic-webfont.eot');
  src: local('Open Sans Semibold Italic'), local('OpenSans-SemiboldItalic'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-SemiboldItalic-webfont.eot?#iefix') format('embedded-opentype'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-SemiboldItalic-webfont.woff') format('woff'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-SemiboldItalic-webfont.ttf') format('truetype'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-SemiboldItalic-webfont.svg#open_sanssemibold_italic') format('svg');
  font-style: italic;
  font-weight: 600;
}

@font-face {
  font-family: 'Open Sans';
  src: url('@{pathPrefix}fonts/barceloneta-OpenSans-Semibold-webfont.eot');
  src: local('Open Sans Semibold'), local('OpenSans-Semibold'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-Semibold-webfont.eot?#iefix') format('embedded-opentype'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-Semibold-webfont.woff') format('woff'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-Semibold-webfont.ttf') format('truetype'),
       url('@{pathPrefix}fonts/barceloneta-OpenSans-Semibold-webfont.svg#open_sanssemibold') format('svg');
  font-style: normal;
  font-weight: 600;
}


/*
 * Variables
 * --------------------------------------------------
 */

// Fonts
@font-family-sans-serif: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;

// Navbar
@navbar-margin-bottom: 0;

//List
@bullet-color: #a2c5e0;

// Input
@input-border: #cccccc;

// Footer
@footer-bg: #2e3133;
@footer-text-main: #929BA1;
@sep-line: @footer-text-main;

// accessibility overrides
@validgrey: #767676; //lightest gray that'll validate
@brand-primary: #007BB3;
@link-darkbg: #16a1e3;
@input-color-placeholder: @validgrey;
@input-border:  @validgrey;
@input-bg-disabled: @validgrey;         




/*
 * Toolbar styles
 * --------------------------------------------------
 */
body {
    padding-top: 70px;
}
.contentViews {
    .nav();
    .navbar-nav();
}
#contentActionMenus {
    .nav();
    .navbar-nav();
}
#portal-personaltools-wrapper .actionMenu {
    .nav();
    .navbar-nav();
    @media (min-width: @grid-float-breakpoint) {
      .pull-right();
    }
}
.navbar-collapse {
  @media (min-width: @grid-float-breakpoint) {
    #portal-personaltools-wrapper .actionMenu:last-child {
      margin-right: -@navbar-padding-horizontal;
    }
  }
}

.actionMenuSelected {
    .dropdown-header();
}
/*
 * Style tweaks
 * --------------------------------------------------
 */
html {
    overflow-x: hidden; /* Prevent scroll on narrow devices */
}


/* Behaviors and BS3 patterns */

.hiddenStructure {
    .text-hide();
    margin: 0;
}

#portal-logo {
    .navbar-brand();
}

#portal-globalnav {
    .nav();
    .navbar-nav();
}

.portalMessage.info {
  .alert();
  .alert-info();
}

/* Styles */

#content-header {
    background-color: transparent;
    border: 0;
}

/* Anonymous user toolbar */

#edit-zone {
  background:rgba(235,235,235,0.5);
  min-height: 20px;
  border: 0px;

  .actionMenu>li>a {
    padding-top: 2px;
    padding-bottom: 2px;
  }
}



/* Authenticated user toolbar */

body.userrole-authenticated {
  padding-top: 70px;
}

.userrole-authenticated #edit-zone {
  background:rgba(15,15,15,0.8);
  min-height: 50px;
  border: 0px;

  .actionMenu>li>a {
    padding-top: 15px;
    padding-bottom: 15px;
  }
}

@media (min-width: 767px) {

  .actionMenu>li>a {
    padding: 5px;
  }

  .userrole-authenticated .actionMenu>li>a {
    padding: 15px;
  }

}

/* Above content wrapper */

#above-content-wrapper {
  padding: 0px; 
  margin: 0px;
}

/* Global nav wrapper */

#globalnav-wrapper {
  background: rgb(0,123,179,1);
  box-shadow: 0px 5px 5px #aaa;
  z-index: 50;
  position: relative;

  #portal-globalnav>li>a {
    color: white;
    font-size: 1.1em;
    text-transform: uppercase;
  }

  #portal-globalnav>li>a:hover {
    background-color: rgba(154,189,214,1);
  }

}

/* Search */

#searchGadget {
  border: 1px solid @input-border;
  border-radius: 3px;
  float: right;
}

/* Hero */

.hero {
  background: url('@{pathPrefix}images/barceloneta-ticks.png');
  background-repeat: repeat-x;

  .jumbotron {
    background: url('@{pathPrefix}images/barceloneta-bg-watermark.png');
    margin-bottom: 0px;
    img {
      width: 100%;
    }
  }
}



/* Breadcrumbs */

#portal-breadcrumbs {
  background: url('@{pathPrefix}images/barceloneta-bg-breadcrumb.png');
  background-repeat: repeat-x;
  padding-top: 10px;
  padding-bottom: 10px;
  font-weight: bold;
  li {
    display: inline-block;
  }
}


.hiddenStructure {
  display: none;
}

/*Content*/

ul, ol {
  list-style: none;
  padding-left: none;
}

#content {
  .documentDescription {
    font-style: italic;
    font-size: 120%;
    margin-bottom: 1.5em;
  }

  ul, ol {
    counter-reset: ol;
    padding-left: 0;
    li {
      margin-bottom: .5em;
      padding-left: 2em;
      text-indent: -2em;
    }
  }
  ul li:before {
    content: "●";
    color: @bullet-color;
    padding-right: 1em;
  }
  ol li:before {
    content: counter(ol) ".";
    counter-increment: ol;
    padding-right: 1em;
  }

}
/* Footer */

footer {
    padding: 30px 0;
}
#portal-footer-wrapper {
  background-color: @footer-bg;
  color: @footer-text-main;
  p {
    border-bottom: 1px solid @sep-line;
    padding-bottom: 28px;
  };
  a {
    color: @link-darkbg;
  }
}
#portal-footer {
  text-align: center;
}
#portal-siteactions {
  li {
    display: inline-block;
    margin-left: 50px;
    &:first-child {
      margin-left: 0;
    }
  }
}

/* Ajax less */

body.ajax_load {
  padding-top: 0px;
}


/*
 * Off Canvas
 * --------------------------------------------------
 */
@media screen and (max-width: 767px) {
    .row-offcanvas {
        position: relative;
        -webkit-transition: all 0.25s ease-out;
        -moz-transition: all 0.25s ease-out;
        transition: all 0.25s ease-out;
    }

    .row-offcanvas-right
    .sidebar-offcanvas {
        right: -50%; /* 6 columns */
    }

    .row-offcanvas-left
    .sidebar-offcanvas {
        left: -50%; /* 6 columns */
    }

    .row-offcanvas-right.active {
        right: 50%; /* 6 columns */
    }

    .row-offcanvas-left.active {
        left: 50%; /* 6 columns */
    }

    .sidebar-offcanvas {
        position: absolute;
        top: 0;
        width: 50%; /* 6 columns */
    }
}