/* Custom Stylesheet */
/**
 * Use this file to override Materialize files so you can update
 * the core Materialize files in the future
 *
 * Made By MaterializeCSS.com
 */

@font-face {
    font-family: 'Aller_Std_Lt';
    src: url('../font/aller/Aller_Std_Lt.eot');
    src: url('../font/aller/Aller_Std_Lt.woff') format('woff'), url('../font/aller/Aller_Std_Lt.ttf') format('truetype'), url('../font/aller/Aller_Std_Lt.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Aller_Std_B';
    src: url('../font/aller/aller_bd-webfont.eot');
    src: url('../font/aller/aller_bd-webfont.woff') format('woff'), url('../font/aller/aller_bd-webfont.ttf') format('truetype'), url('../font/aller/aller_bd-webfont.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}

html {
    font-family: 'Aller_Std_Lt';
    overflow-x: hidden;
}


table {
    table-layout: fixed;
}

nav ul a,
nav .brand-logo {
    color: #444;
}

nav .brand-logo {
    top: -3px;
}

nav nav-mobile {
    font-size: 30px;
}

#mainPresentationNavigation .top-nav a {
    color: #FFFFFF !imp	ortant;
    height: 120px;
}


.coarchtects-color {
    background-color: rgb(169,80,149) !important;
}

div.description {
    font-size: 12px;
    color: rgb(139,139,139);
}

.coarchtects-color-text {
    color: rgb(169,80,149) !important;
}

.coarchtects-color-grey-text {
    color: rgba(0, 0, 0, 0.7) !important;
}

.coarchtects-color-grey {
    background-color: rgba(0, 0, 0, 0.7) !important;
}

.header {
    height: 15px;
    font-size: 30px;
    margin-top: 60px;
    font-weight: bold;
    color: rgb(169, 80, 149);
    margin-left: 20px;
    text-transform: uppercase;
}

.card .card-title {
    font-size: 1.57vw;
    font-weight: bold;
    color: rgb(169, 80, 149);
    text-transform: uppercase;
}

nav div ul li a {
    font-size: 20px;
    font-weight: bold;
}

.my-nav-main {
    bottom: 38px;
    background-color: transparent;
    box-shadow: none;
}

.my-nav.scroled nav {
    top: 0px;
    position: fixed;
    z-index: 199;
    height: 44px;
}

.my-nav nav {
    -webkit-transition: all 0.2s ease-in;
    -moz-transition: all 0.2s ease-in;
    -o-transition: all 0.2s ease-in;
    transition: all 0.2s ease-in;
}

.my-nav nav .nav-wrapper .brand-logo,
.my-nav nav .nav-wrapper ul:not(.side-nav) {
    -webkit-transition: all 0.2s ease-in;
    -moz-transition: all 0.2s ease-in;
    -o-transition: all 0.2s ease-in;
    transition: all 0.2s ease-in;
}

.my-nav.scroled nav .nav-wrapper ul:not(.side-nav) {
    margin-right: -74px;
}


.my-nav.scroled nav .nav-wrapper .brand-logo {
    margin-left: -30px;
}

.my-nav.scroled nav .nav-wrapper .brand-logo,
.my-nav.scroled nav .nav-wrapper ul:not(.side-nav) {
    transform: scale(0.7);
    margin-top: -10px;
}

.my-nav.scroled nav .nav-wrapper .button-collapse i {
    line-height: 45px;
    height: 45px;
}


.bottomRow {
    position: fixed;
    z-index: 11000;
    bottom: -2px;
    width: 100%;
    height: 40px;
    background-color: rgba(0, 0, 0, 0.7);
    color: white;
    font-size: 20px;
    margin-bottom: 0px;
}

.bottomRow .logo {
    float: right;
    padding-left: 10px;
}

.bottomRow a img {
    width: 20px;
    height: 20px;
}

.bottomRow a {
    width: 20px;
    height: 20px;
}

.page-footer {
}

.h1-logo {
    /*position: absolute;*/
    /*top: 50%;
    left: 50%;*/
    /*transform: translateX(-50%) translateY(-50%);*/
    margin: 0;
    /*cursor:pointer;*/
    color: white;
}

#logo-container span,
.logo span,
.h1-logo span {
    font-family: 'Aller_Std_B';
    color: rgb(169,80,149);
}


.cbp-bislideshow {
    position: absolute;
    width: 100%;
    height: 100%;
}

.cbp-bislideshow
    /*Text label --------------------------------------------*/
    .input-field label {
    color: white;
}

/* label underline focus color */
/*.input-field input[type=text]:focus {
     border-bottom: 1px solid rgb(169,80,149);
     box-shadow: 0 1px 0 0 rgb(169,80,149);
   }*/

.grid-item {
    float: left;
    overflow: hidden;
    position: relative;
    text-align: center;
    box-shadow: 1px 1px 2px #e6e6e6;
    padding-top: 4px;
}

.grid-item .content {
    color: black;
    width: 100%;
    position: absolute;
    overflow: hidden;
    top: 50%;
    left: 0;
    transform: translateX(-100%) translateY(-50%);
    transition: all 0.4s ease-in-out;
    /*transition-delay: 0.4s;*/
}

.grid-item:focus .content,
.grid-item:hover .content {
    transform: translateX(0%) translateY(-50%);
}

.grid-item .mask {
    width: 100%;
    height: 100%;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0;
    background-color: white;
    transform: translateX(-100%);
    transition: all 0.4s ease-in-out;
}

.grid-item:focus .mask,
.grid-item:hover .mask {
    transform: translateX(0px);
}

.grid-item img {
    display: block;
    position: relative;
    width: 100%;
    transition: all 0.2s ease-in-out;
}

.grid-item:focus img,
.grid-item:hover img {
    transform: translateX(100%);
    transition-delay: 0.1s;
}

.grid-item h3 {
    line-height: 42px;
    text-transform: uppercase;
    margin: 0;
    text-align: center;
    position: relative;
    font-weight: bold;
    padding: 0 30px 20px 30px;
}

.grid-item table {
    position: relative;
    margin: 0 auto;
    padding: 0px 40px 20px 40px;
    transition-delay: 0.4s;
    transition: all 0.2s linear;
    text-align: left;
}

.project-info table td:first-child,
.grid-item table td:first-child {
    text-align: right;
    color: rgb(139,139,139);
}

.project-info table td,
.grid-item table td {
    padding: 0 5px;
}

.grid-item a.info {
    display: inline-block;
    text-decoration: none;
    padding: 7px 14px;
    background: rgb(169,80,149);
    color: #fff;
    text-transform: uppercase;
    box-shadow: 0 0 1px #000;
    margin-top: 20px;
}

.grid-item a.info:hover {
    box-shadow: 0 0 5px #000;
}

.gradient {
    background: rgba(0, 0, 0, 0.5); /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(rgba(0, 0, 0, 0.5), rgba(255, 255, 255, 0)); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(rgba(0, 0, 0, 0.5), rgba(255, 255, 255, 0)); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(rgba(0, 0, 0, 0.5), rgba(255, 255, 255, 0)); /* For Firefox 3.6 to 15 */
    background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(255, 255, 255, 0)); /* Standard syntax */
}


.list li {
    margin: 0 20px;
    list-style: circle inside;
    font-size: 20px;
    list-style: circle;
    color: rgba(0, 0, 0, 0.7) !important;
}

ts {
    width: 0;
    height: 0;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    outline: 1px solid red;
    filter: url(#goo);
    -o-filter: url(#goo);
    -ms-filter: url(#goo);
    -webkit-filter: url(#goo);
    -moz-filter: url(#goo);
}

.cssload-dot {
    zoom: 0;
    width: 0;
    height: 0;
    position: absolute;
    left: 0;
    top: 0;
}

.cssload-dot:before {
    content: "";
    width: 34px;
    height: 34px;
    border-radius: 49px;
    background: rgb(251,211,1);
    position: absolute;
    left: 50%;
    transform: translateY(0);
    -o-transform: translateY(0);
    -ms-transform: translateY(0);
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    margin-left: -17.5px;
    margin-top: -17.5px;
}



.cssload-dot:nth-child(5):before {
    z-index: 100;
    width: 44.5px;
    height: 44.5px;
    margin-left: -21.75px;
    margin-top: -21.75px;
    animation: cssload-dot-colors 4.6s ease infinite;
    -o-animation: cssload-dot-colors 4.6s ease infinite;
    -ms-animation: cssload-dot-colors 4.6s ease infinite;
    -webkit-animation: cssload-dot-colors 4.6s ease infinite;
    -moz-animation: cssload-dot-colors 4.6s ease infinite;
}


.cssload-dot:nth-child(1) {
    animation: cssload-dot-rotate-1 4.6s 0s linear infinite;
    -o-animation: cssload-dot-rotate-1 4.6s 0s linear infinite;
    -ms-animation: cssload-dot-rotate-1 4.6s 0s linear infinite;
    -webkit-animation: cssload-dot-rotate-1 4.6s 0s linear infinite;
    -moz-animation: cssload-dot-rotate-1 4.6s 0s linear infinite;
}

.cssload-dot:nth-child(1):before {
    background-color: rgb(255,50,112);
    animation: cssload-dot-move 4.6s 0s ease infinite;
    -o-animation: cssload-dot-move 4.6s 0s ease infinite;
    -ms-animation: cssload-dot-move 4.6s 0s ease infinite;
    -webkit-animation: cssload-dot-move 4.6s 0s ease infinite;
    -moz-animation: cssload-dot-move 4.6s 0s ease infinite;
}

.cssload-dot:nth-child(2) {
    animation: cssload-dot-rotate-2 4.6s 1.15s linear infinite;
    -o-animation: cssload-dot-rotate-2 4.6s 1.15s linear infinite;
    -ms-animation: cssload-dot-rotate-2 4.6s 1.15s linear infinite;
    -webkit-animation: cssload-dot-rotate-2 4.6s 1.15s linear infinite;
    -moz-animation: cssload-dot-rotate-2 4.6s 1.15s linear infinite;
}

.cssload-dot:nth-child(2):before {
    background-color: rgb(32,139,241);
    animation: cssload-dot-move 4.6s 1.15s ease infinite;
    -o-animation: cssload-dot-move 4.6s 1.15s ease infinite;
    -ms-animation: cssload-dot-move 4.6s 1.15s ease infinite;
    -webkit-animation: cssload-dot-move 4.6s 1.15s ease infinite;
    -moz-animation: cssload-dot-move 4.6s 1.15s ease infinite;
}

.cssload-dot:nth-child(3) {
    animation: cssload-dot-rotate-3 4.6s 2.3s linear infinite;
    -o-animation: cssload-dot-rotate-3 4.6s 2.3s linear infinite;
    -ms-animation: cssload-dot-rotate-3 4.6s 2.3s linear infinite;
    -webkit-animation: cssload-dot-rotate-3 4.6s 2.3s linear infinite;
    -moz-animation: cssload-dot-rotate-3 4.6s 2.3s linear infinite;
}

.cssload-dot:nth-child(3):before {
    background-color: rgb(175,225,2);
    animation: cssload-dot-move 4.6s 2.3s ease infinite;
    -o-animation: cssload-dot-move 4.6s 2.3s ease infinite;
    -ms-animation: cssload-dot-move 4.6s 2.3s ease infinite;
    -webkit-animation: cssload-dot-move 4.6s 2.3s ease infinite;
    -moz-animation: cssload-dot-move 4.6s 2.3s ease infinite;
}

.cssload-dot:nth-child(4) {
    animation: cssload-dot-rotate-4 4.6s 3.45s linear infinite;
    -o-animation: cssload-dot-rotate-4 4.6s 3.45s linear infinite;
    -ms-animation: cssload-dot-rotate-4 4.6s 3.45s linear infinite;
    -webkit-animation: cssload-dot-rotate-4 4.6s 3.45s linear infinite;
    -moz-animation: cssload-dot-rotate-4 4.6s 3.45s linear infinite;
}

.cssload-dot:nth-child(4):before {
    background-color: rgb(251,211,1);
    animation: cssload-dot-move 4.6s 3.45s ease infinite;
    -o-animation: cssload-dot-move 4.6s 3.45s ease infinite;
    -ms-animation: cssload-dot-move 4.6s 3.45s ease infinite;
    -webkit-animation: cssload-dot-move 4.6s 3.45s ease infinite;
    -moz-animation: cssload-dot-move 4.6s 3.45s ease infinite;
}

@keyframes cssload-dot-move {
    0% {
        transform: translateY(0);
    }

    18%, 22% {
        transform: translateY(-68px);
    }

    40%, 100% {
        transform: translateY(0);
    }
}

@-o-keyframes cssload-dot-move {
    0% {
        -o-transform: translateY(0);
    }

    18%, 22% {
        -o-transform: translateY(-68px);
    }

    40%, 100% {
        -o-transform: translateY(0);
    }
}

@-ms-keyframes cssload-dot-move {
    0% {
        -ms-transform: translateY(0);
    }

    18%, 22% {
        -ms-transform: translateY(-68px);
    }

    40%, 100% {
        -ms-transform: translateY(0);
    }
}

@-webkit-keyframes cssload-dot-move {
    0% {
        -webkit-transform: translateY(0);
    }

    18%, 22% {
        -webkit-transform: translateY(-68px);
    }

    40%, 100% {
        -webkit-transform: translateY(0);
    }
}

@-moz-keyframes cssload-dot-move {
    0% {
        -moz-transform: translateY(0);
    }

    18%, 22% {
        -moz-transform: translateY(-68px);
    }

    40%, 100% {
        -moz-transform: translateY(0);
    }
}

@keyframes cssload-dot-colors {
    0% {
        background-color: rgba(251,211,1,0.98);
    }

    25% {
        background-color: rgb(255,50,112);
    }

    50% {
        background-color: rgb(32,139,241);
    }

    75% {
        background-color: rgb(175,225,2);
    }

    100% {
        background-color: rgb(251,211,1);
    }
}

@-o-keyframes cssload-dot-colors {
    0% {
        background-color: rgba(251,211,1,0.98);
    }

    25% {
        background-color: rgb(255,50,112);
    }

    50% {
        background-color: rgb(32,139,241);
    }

    75% {
        background-color: rgb(175,225,2);
    }

    100% {
        background-color: rgb(251,211,1);
    }
}

@-ms-keyframes cssload-dot-colors {
    0% {
        background-color: rgba(251,211,1,0.98);
    }

    25% {
        background-color: rgb(255,50,112);
    }

    50% {
        background-color: rgb(32,139,241);
    }

    75% {
        background-color: rgb(175,225,2);
    }

    100% {
        background-color: rgb(251,211,1);
    }
}

@-webkit-keyframes cssload-dot-colors {
    0% {
        background-color: rgba(251,211,1,0.98);
    }

    25% {
        background-color: rgb(255,50,112);
    }

    50% {
        background-color: rgb(32,139,241);
    }

    75% {
        background-color: rgb(175,225,2);
    }

    100% {
        background-color: rgb(251,211,1);
    }
}

@-moz-keyframes cssload-dot-colors {
    0% {
        background-color: rgba(251,211,1,0.98);
    }

    25% {
        background-color: rgb(255,50,112);
    }

    50% {
        background-color: rgb(32,139,241);
    }

    75% {
        background-color: rgb(175,225,2);
    }

    100% {
        background-color: rgb(251,211,1);
    }
}

@keyframes cssload-dot-rotate-1 {
    0% {
        transform: rotate(-105deg);
    }

    100% {
        transform: rotate(270deg);
    }
}

@-o-keyframes cssload-dot-rotate-1 {
    0% {
        -o-transform: rotate(-105deg);
    }

    100% {
        -o-transform: rotate(270deg);
    }
}

@-ms-keyframes cssload-dot-rotate-1 {
    0% {
        -ms-transform: rotate(-105deg);
    }

    100% {
        -ms-transform: rotate(270deg);
    }
}

@-webkit-keyframes cssload-dot-rotate-1 {
    0% {
        -webkit-transform: rotate(-105deg);
    }

    100% {
        -webkit-transform: rotate(270deg);
    }
}

@-moz-keyframes cssload-dot-rotate-1 {
    0% {
        -moz-transform: rotate(-105deg);
    }

    100% {
        -moz-transform: rotate(270deg);
    }
}

@keyframes cssload-dot-rotate-2 {
    0% {
        transform: rotate(165deg);
    }

    100% {
        transform: rotate(540deg);
    }
}

@-o-keyframes cssload-dot-rotate-2 {
    0% {
        -o-transform: rotate(165deg);
    }

    100% {
        -o-transform: rotate(540deg);
    }
}

@-ms-keyframes cssload-dot-rotate-2 {
    0% {
        -ms-transform: rotate(165deg);
    }

    100% {
        -ms-transform: rotate(540deg);
    }
}

@-webkit-keyframes cssload-dot-rotate-2 {
    0% {
        -webkit-transform: rotate(165deg);
    }

    100% {
        -webkit-transform: rotate(540deg);
    }
}

@-moz-keyframes cssload-dot-rotate-2 {
    0% {
        -moz-transform: rotate(165deg);
    }

    100% {
        -moz-transform: rotate(540deg);
    }
}

@keyframes cssload-dot-rotate-3 {
    0% {
        transform: rotate(435deg);
    }

    100% {
        transform: rotate(810deg);
    }
}

@-o-keyframes cssload-dot-rotate-3 {
    0% {
        -o-transform: rotate(435deg);
    }

    100% {
        -o-transform: rotate(810deg);
    }
}

@-ms-keyframes cssload-dot-rotate-3 {
    0% {
        -ms-transform: rotate(435deg);
    }

    100% {
        -ms-transform: rotate(810deg);
    }
}

@-webkit-keyframes cssload-dot-rotate-3 {
    0% {
        -webkit-transform: rotate(435deg);
    }

    100% {
        -webkit-transform: rotate(810deg);
    }
}

@-moz-keyframes cssload-dot-rotate-3 {
    0% {
        -moz-transform: rotate(435deg);
    }

    100% {
        -moz-transform: rotate(810deg);
    }
}

@keyframes cssload-dot-rotate-4 {
    0% {
        transform: rotate(705deg);
    }

    100% {
        transform: rotate(1080deg);
    }
}

@-o-keyframes cssload-dot-rotate-4 {
    0% {
        -o-transform: rotate(705deg);
    }

    100% {
        -o-transform: rotate(1080deg);
    }
}

@-ms-keyframes cssload-dot-rotate-4 {
    0% {
        -ms-transform: rotate(705deg);
    }

    100% {
        -ms-transform: rotate(1080deg);
    }
}

@-webkit-keyframes cssload-dot-rotate-4 {
    0% {
        -webkit-transform: rotate(705deg);
    }

    100% {
        -webkit-transform: rotate(1080deg);
    }
}

@-moz-keyframes cssload-dot-rotate-4 {
    0% {
        -moz-transform: rotate(705deg);
    }

    100% {
        -moz-transform: rotate(1080deg);
    }
}



















p {
    line-height: 2rem;
}

.button-collapse {
    color: rgb(169,80,149);
}

.parallax-container {
    min-height: 380px;
    line-height: 0;
    height: auto;
    color: rgba(255,255,255,.9);
}

.parallax-container .section {
    width: 100%;
}

.about .firs-img {
    background-image: url(../images/kancelar1.jpg);
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    height: 100%;
}

.about .sec-img {
    background-image: url(../images/kancelar2.jpg);
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    height: 100%;
    margin-left: 5px;
}

.grid-item {
    float: left;
    overflow: hidden;
    position: relative;
    text-align: center;
    box-shadow: 1px 1px 2px #e6e6e6;
    padding-top: 4px;
}

.grid-item .content {
    color: black;
    width: 100%;
    position: absolute;
    overflow: hidden;
    top: 50%;
    left: 0;
    transform: translateX(-100%) translateY(-50%);
    transition: all 0.4s ease-in-out;
    /*transition-delay: 0.4s;*/
}

.grid-item:focus .content,
.grid-item:hover .content {
    transform: translateX(0%) translateY(-50%);
}

.grid-item .mask {
    width: 100%;
    height: 100%;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0;
    background-color: white;
    transform: translateX(-100%);
    transition: all 0.4s ease-in-out;
}

.grid-item:focus .mask,
.grid-item:hover .mask {
    transform: translateX(0px);
}

.grid-item img {
    display: block;
    position: relative;
    width: 100%;
    transition: all 0.2s ease-in-out;
}

.grid-item:focus img,
.grid-item:hover img {
    transform: translateX(100%);
    transition-delay: 0.1s;
}

.grid-item table {
    position: relative;
    margin: 0 auto;
    padding: 0px 40px 20px 40px;
    transition-delay: 0.4s;
    transition: all 0.2s linear;
    text-align: left;
}

.grid-item table td:first-child {
    text-align: right;
    color: rgb(139,139,139);
}

.grid-item a.info {
    display: inline-block;
    text-decoration: none;
    padding: 7px 14px;
    background: rgb(169,80,149);
    color: #fff;
    text-transform: uppercase;
    box-shadow: 0 0 1px #000;
}

.grid-item a.info:hover {
    box-shadow: 0 0 5px #000;
}

.side-nav .sec-level-item {
    padding-left: 40px;
}

.cbp-bicontrols span {
    width: auto;
    height: auto;
}


@media only screen and (max-width : 992px) {
    .parallax-container .section {
        position: absolute;
        top: 40%;
    }

    #index-banner .section {
        top: 10%;
    }

    .card .card-title {
        font-size: 3vw;
    }
}

/*-------------------------------------------------------*/


@media screen and (max-width: 600px) {
    .header {
        text-align: center;
        font-size: 24px;
    }

    .h1-logo {
        font-size: 4vw;
    }

    nav :not(.nav-mobile) .brand-logo {
        font-size: 24px;
        padding-left: 24px;
    }

    .grid-item {
        width: 98%;
    }

    .grid-item h3 {
        font-size: 5vw;
        line-height: 6vw;
    }

    .grid-item table {
        font-size: 2.5vw;
    }

    .grid-item a.info {
        font-size: 2.5vw;
    }

    #index-banner .section {
        top: 0;
    }

    .icon-block {
        padding: 0 15px;
    }

    .icon-block .material-icons {
        font-size: inherit;
    }

    footer.page-footer {
        margin: 0;
    }

    .about .firs-img {
        margin-right: 0px;
    }

    .card .card-title {
        font-size: 5vw;
    }
}





@media screen and (min-width: 601px) and (max-width: 1100px) {
    .h1-logo {
        font-size: 3vw;
    }

    .grid-item {
        width: 33%;
    }

    .grid-item h3 {
        font-size: 2.2vw;
        line-height: 3vw;
        padding-bottom: 5px;
    }

    .grid-item table {
        font-size: 1.2vw;
    }

    .grid-item a.info {
        font-size: 1.2vw;
    }

    .about .firs-img {
        margin-right: 5px;
    }
}

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




@media screen and (min-width: 1101px) {
    .h1-logo {
        font-size: 3vw;
    }

    .grid-item {
        width: 33%;
    }

    .grid-item h3 {
        font-size: 1.4vw;
        line-height: 2vw;
        padding-bottom: 8px
    }

    .grid-item table {
        font-size: 0.8vw;
    }

    .grid-item a.info {
        font-size: 1.2vw;
    }

    .grid-item .btn {
        margin-top: 10px;
        zoom: 0.7;
    }

    .about .firs-img {
        margin-right: 5px;
    }
}

@media screen and (min-width: 601px) and (max-width: 1100px) {
    /*.logo {
        font-size: 30px;
    }*/

    .grid-item {
        width: 49%;
    }
}