/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/*
    Created on : Jun 18, 2018, 11:11:21 AM
    Author     : Lubost
*/

* {
    /*outline: 1px solid #bada55;*/
}

@font-face {
    font-family: "Coolvetica";
    src: url("../fonts/coolvetica rg.ttf");
}


@font-face {
    font-family: "Roboto";
    src: url(../fonts/Roboto-Regular.ttf);
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "Roboto";
    src: url(../fonts/Roboto-Light.ttf);
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: "Roboto";
    src: url(../fonts/Roboto-Bold.ttf);
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: "Roboto Slab";
    src: url(../fonts/RobotoSlab-Bold.ttf);
    font-weight: bold;
    font-style: normal;
}


* {
    font-family: "Roboto", sans-serif;
    font-weight: normal;
    font-style: normal;
}


@font-face {
    font-family: "Oswald";
    src: url(../fonts/Oswald-Regular.ttf);
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "Oswald";
    src: url(../fonts/Oswald-Light.ttf);
    font-weight: 300;
    font-style: normal;
}

em {
    font-style: italic;

}

.croppie-container .cr-viewport, .croppie-container .cr-resizer {
    /*border: none;*/
}

.hamburger-checkbox {
    display: none;
}

.spinner {
    margin: 0 auto;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    background-color: #014a6cbd;
}

.spinner > div {
    width: 10px;
    height: 10px;
    background-color: white;
    position: relative;
    top: 25%;
    border-radius: 100%;
    display: inline-block;
    -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
    animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}

.spinner .bounce1 {
    -webkit-animation-delay: -0.32s;
    animation-delay: -0.32s;
}

.spinner .bounce2 {
    -webkit-animation-delay: -0.16s;
    animation-delay: -0.16s;
}



@-webkit-keyframes sk-bouncedelay {
    0%, 80%, 100% { -webkit-transform: scale(0) }
    40% { -webkit-transform: scale(1.0) }
}

@keyframes sk-bouncedelay {
    0%, 80%, 100% {
        -webkit-transform: scale(0);
        transform: scale(0);
    } 40% {
        -webkit-transform: scale(1.0);
        transform: scale(1.0);
    }
}

a.ajax, button.ajax {
    position: relative;
}

.pac-container {
    z-index: 1051;
}

.with-errors textarea, .with-errors select, .with-errors .select2 {
	margin-bottom: 20px;
}

.modal .modal-dialog .modal-body textarea {
	border: 1px solid #a6cfe2;
	box-shadow: 1px 1px 2px rgba(128, 128, 128, 0.2);
    padding-left: 5px;
	
	max-width: 100%;
}

.list-of-categories-adviser .vip-positions {
	margin-top: 30px;
}

.list-of-categories-adviser .vip-positions .link-position {
	display: inline-block !important;
	vertical-align: top !important;
}

.list-of-categories-adviser .vip-positions .position {
	display: inline-block;
	vertical-align: top;
	margin: 0px 10px;
	text-align: center;
}

.list-of-categories-adviser .vip-positions .position img {
	max-width: 200px;
	max-height: 200px;
}

.list-of-categories-adviser .vip-positions .position .name {
	margin-top: 3px;
	font-size: 15px;
	font-weight: bold;
}

section.vip-positions label {
  margin-left: 30px;
  font-weight: normal;
  color: #4c4c4c;
  margin-bottom: 0;
  position: relative;
  top: 7px;
}

section.vip-positions label.checkbox {
  top: 0;
}

section.vip-positions input[type="text"], section.vip-positions input[type="password"], section.vip-positions input[type="url"] {
  width: 90%;
  height: 30px;
  margin-bottom: 20px;
  box-shadow: 1px 1px 2px grey;
  border: 1px solid #abd4e6;
  padding-left: 5px;
}

section.vip-positions .btn-send {
  float: right;
  -webkit-appearance: none;
  appearance: none;
  background-color: #014a6c;
  color: white;
  background-image: none;
  text-shadow: none;
  border-radius: 0;
  margin-left: 20px;
}

a.link-order {
	color: #000;
	text-decoration: underline;
}

a.link-order-current {
	font-weight: bold;
	text-decoration: underline;
}

section.profile #kontakt .additional-addresses {
}

section.profile #kontakt .address-map {
	width: 100%;
	height: 200px;
}

section.profile #kontakt .box-qr-code {
	box-shadow: 2px 2px 12px #aaa;
}

section.profile #kontakt .box-qr-code .image-area {
	padding: 20px 0px;
}

section.profile #kontakt .box-qr-code .image-area img {
	width: 70%;
	height: 70%;
}

section.profile #kontakt .box-qr-code .text-area {
	padding: 20px 40px 10px 0px;
}

section.profile #kontakt .box-qr-code .text-area input[type="text"] {
	width: 100%;
	height: 30px;
	border: 1px solid #999;
	box-shadow: 2px 2px 10px #ccc;
	padding-left: 5px;
}

section.profile #kontakt .box-qr-code .text-area .link-plan-area {
	margin-top: 10px;
}

section.profile #kontakt .box-qr-code .text-area .link-plan-area a {
	color: #337ab7;
}

section.profile #kontakt ul.smap-suggest li span.text {
	padding: 8px 32px 8px 0px !important;
}


@media (max-width: 992px) {

    #menu-hamburger
    {
        display: block;
        position: absolute;
        right: 0;
        top: 10%;
        left: 0;
        padding-bottom: 10px;
        z-index: 3;

        -webkit-user-select: none;
        user-select: none;
    }

    #menu-hamburger input.hamburger-checkbox
    {
        display: block;
        width: 40px;
        height: 32px;
        position: absolute;
        top: -7px;
        left: 85%;

        cursor: pointer;

        opacity: 0; /* hide this */
        z-index: 2; /* and place it over the hamburger */

        -webkit-touch-callout: none;
    }

    /*
     * Just a quick hamburger
     */
    #menu-hamburger span.hamburger-hr
    {
        display: block;
        width: 33px;
        height: 4px;
        left: 85%;
        position: relative;
        margin-bottom: 5px;
        background-color: black;

        z-index: 1;

        transform-origin: 4px 0px;

        transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
            background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
            opacity 0.55s ease;
    }

    #menu-hamburger span.hamburger-hr:first-child
    {
        transform-origin: 0% 0%;
    }

    #menu-hamburger span.hamburger-hr:nth-last-child(2)
    {
        transform-origin: 0% 100%;
    }

    /*
     * Transform all the slices of hamburger
     * into a crossmark.
     */
    #menu-hamburger input.hamburger-checkbox:checked ~ span.hamburger-hr
    {
        opacity: 1;
        transform: rotate(45deg) translate(-2px, -1px);

    }

    /*
     * But let's hide the middle one.
     */
    #menu-hamburger input.hamburger-checkbox:checked ~ span.hamburger-hr:nth-last-child(3)
    {
        opacity: 0;
        transform: rotate(0deg) scale(0.2, 0.2);
    }

    /*
     * Ohyeah and the last one should go the other direction
     */
    #menu-hamburger input.hamburger-checkbox:checked ~ span.hamburger-hr:nth-last-child(2)
    {
        transform: rotate(-45deg) translate(0, -1px);
    }

    /*
     * Make this absolute positioned
     * at the top left of the screen
     */
    #menu-content
    {
        height: 0;
        width: 100%;
        position: absolute;
        top: 90%;
        background-color: #f5f9fb;
        overflow: auto;
        -webkit-font-smoothing: antialiased;
        /* to stop flickering of text in safari */

        transform-origin: 0% 0%;
        /*transform: translate(0, -170%);*/

        /* transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);*/
    }


    header.homepage #menu-content {
        top: 100%;
    }

    /*
     * And let's slide it in from the left
     */
    #menu-hamburger input.hamburger-checkbox:checked ~ #menu-content
    {
        /*transform: none;*/
    }
}