@font-face {
    font-family: "Raleway";
    src: url('../fonts/Raleway-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: "Raleway";
    src: url('../fonts/Raleway-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}
@font-face {
    font-family: "Raleway";
    src: url('../fonts/Raleway-Italic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
}
@font-face {
    font-family: "Raleway";
    src: url('../fonts/Raleway-Thin.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
}
@font-face {
    font-family: "Raleway";
    src: url('../fonts/Raleway-ThinItalic.ttf') format('truetype');
    font-weight: 100;
    font-style: italic;
}
@font-face {
    font-family: "Raleway";
    src: url('../fonts/Raleway-Light.ttf') format('truetype');
    font-weight: 200;
    font-style: normal;
}
@font-face {
    font-family: "Raleway";
    src: url('../fonts/Raleway-LightItalic.ttf') format('truetype');
    font-weight: 200;
    font-style: italic;
}
@font-face {
    font-family: "Comfortaa";
    src: url('../fonts/Comfortaa-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: "Comfortaa";
    src: url('../fonts/Comfortaa-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}
@font-face {
    font-family: "Comfortaa";
    src: url('../fonts/Comfortaa-Light.ttf') format('truetype');
    font-weight: 200;
    font-style: normal;
}
@font-face {
    font-family: "MPlus";
    src: url('../fonts/MPLUSRounded1c-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: "MPlus";
    src: url('../fonts/MPLUSRounded1c-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}
@font-face {
    font-family: "MPlus";
    src: url('../fonts/MPLUSRounded1c-Thin.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
}
/*Secondary*/
@font-face {
    font-family: "Roboto";
    src: url('../fonts/Roboto-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: "Roboto";
    src: url('../fonts/Roboto-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}
@font-face {
    font-family: "Roboto";
    src: url('../fonts/Roboto-Italic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
}
@font-face {
    font-family: "Roboto";
    src: url('../fonts/Roboto-Thin.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
}
@font-face {
    font-family: "Roboto";
    src: url('../fonts/Roboto-ThinItalic.ttf') format('truetype');
    font-weight: 100;
    font-style: italic;
}
@font-face {
    font-family: "Roboto";
    src: url('../fonts/Roboto-Light.ttf') format('truetype');
    font-weight: 200;
    font-style: normal;
}
@font-face {
    font-family: "Roboto";
    src: url('../fonts/Roboto-LightItalic.ttf') format('truetype');
    font-weight: 200;
    font-style: italic;
}

:root, :root.light{
    --title_text: #545454;
	--main_text: #5B5B5B;
	--sub_text: #858585;
    --light_text: #fdfdfd;

	--main_color: #ffffff;
    --sub_color: #3e69af;
    --sub_color2: #1d55cc;
	--sub_color3: #59a2ff;
    
    --light_blue : #d1e4fd;
    --dark_blue : #0056b3;
    --blue-violet: #131E3F;
    --blue-gray: #ecf3f5;
    --blue-gray2: #7190ad;
    --black: #141414;
	--border_color: #dddddd;
    --nav_sticky_bg: rgba(255, 255, 255, 0.6);
    --portfolio_bg: rgba(0, 0, 0, 0.50);
    --feature_bg: #f8f8f8;
    --feature_hover:#747474;
    --icon_color: #e4e4e4;
    --footer_bg: #f8f8f8;
    --footer_siteinfo: #f5f5f5;

    --container-box-shadow: 0px 2px 4px 1px rgba(24, 24, 24, 0.16), 0px 0px 2px 0px rgba(24, 24, 24, 0.08);
    --container-box-shadow-hover: rgba(24,24,24,0.08) 0px 12px 24px -4px,rgba(24,24,24,0.16) 0px 16px 32px -4px;

    /* --icon_check: url('../images/check-mark.svg');
    --icon_check-white: url('../images/check-mark-white.svg'); */
}

::selection {
    background: var(--sub_color);
    color: var(--main_color);
}


.logo-usc-short {
    background-image: url(../images/logos/usc_short_darkblue.png);
}

/*--------------- Body style ---------------*/
html { /* in html !!! */
    overflow-x: hidden;
    overflow-y: scroll;
    scroll-behavior: smooth;
}

html, body{
    font-family: "Raleway", "Roboto", sans-serif;
	font-size:100%;
    width: 100%;
    height: 100%;
    margin: 0px;
    padding: 0px;
	text-align:justify;
	line-height: 1.5;
	color: var(--main_text);
	text-decoration:none; 
}
h1, h2, h3, h4, h5, h6 {
	/* color: var(--main_text); */
    font-weight: normal;
    margin-top: 0;
    padding-bottom: 20px;
}
a {
    color: var(--sub_text);
    text-decoration: none;
    /* cursor: pointer; */
}
a.colored {
    color: var(--sub_color3);
}
@media (hover: hover) {
    a:hover {
        color: var(--sub_color);
    }
}

a.icon_phone {background-image: url(../images/icons/i_phone.png); background-repeat: no-repeat; background-position: left; padding: 0 25px 0 25px;}
a.icon_mail {background-image: url(../images/icons/i_mail.png); background-repeat: no-repeat; background-position: left; padding: 0 25px 0 25px;}
a.icon_location {background-image: url(../images/icons/i_location.png); background-repeat: no-repeat; background-position: left; padding: 0 25px 0 25px;}
/*------------------------------------------*/

/*--------------- Header style ---------------*/
#header {
    font-family: 'Comfortaa';
    width: 100%;
}
#header .header_top {
    max-width: 987px;
    height: 70px;
    text-align: center;
    margin-left:auto;
    margin-right: auto;
}
#header .header_logo{
    width:40%;
    float:left;
}

/*Normal Logo*/
#header  #header-logo {
    height:70px;
    background:url(../images/logos/usc_darkblue.png) no-repeat center;
}
/*Christmas Logo*/
/*#header #header-logo {background:url(../images/logos/UCSLogo_Christmas.png) no-repeat 30px 10px; height:55px;}/*top right bottom left*/

#header .header_bar {
    display: table;
    height: 100%;
    float: right;
    margin-top: 25px;
}
#header .header_bar a.nav {
    font-size: 0.875em;
    display: table-cell;
    vertical-align: middle;
    color: var(--sub_text);
    text-decoration: none;
}
@media (hover: hover) {
    #header .header_bar a.nav:hover {
        color: var(--sub_color3);
    }
}

#header .menu {display: none;}



/*Normal #navbar*/
#header.sticky_padding + #main {
    padding-top: 60px;
}
#navbar {
    position: relative;
    top: 0px;
    z-index: 10;
    margin: 0 auto;
    text-align: center;
    background-color: rgba(255, 255, 255, 0.9);
}
#navbar:before, #navbar:after, #footer:before, .idk .container  .text-props:after {
    background-image: linear-gradient(to right, rgba(225, 225, 225, 0), rgba(0, 0, 0, 0.1) 20%, rgba(0, 0, 0, 0.1) 50%, rgba(0, 0, 0, 0.1) 80%, rgba(225, 225, 225, 0));
    content: "";
    height: 1px;
    left: 0;
    margin: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 2;
}
#navbar:after, .idk .container  .text-props:after{
    top: initial;
    bottom: 0;
}

#navbar .nav_logo {
    display: none;
}
#header.sticky, #navbar.sticky {
    position: fixed;
    top: 0px;
    width: 100%;
    background-color: var(--nav_sticky_bg);
    backdrop-filter: blur(10px);
    z-index: 10;
}
#navbar.sticky .nav_logo {
    display: block;
    padding: 0;
    width: 65px;
    margin-right: 2rem;
}
#navbar.sticky .logo {
    position: absolute;
    /* float: left;
    padding: 30px 40px;
    margin-left: 80px; */
    /* background:url(../images/logos/UCSLogoShort_Blue.png) no-repeat center; */
    background-repeat:  no-repeat;
    background-position: center;
    padding: 0;
    width: 65px;
    height: 100%;
}

#nav {
    /* width: 920px;
    text-align: center;
    margin: 0 auto; */

    max-width: 920px;
    width: fit-content;
    text-align: center;
    margin: 0 auto;
    display: flex
;
    flex-direction: row;
    padding: 0;
}
#navbar > ul > li {
    position: relative;
    /* display: inline-block; */
    list-style-type: none;
}
#navbar a:not(.nav_logo + a), #navbar div {
    color: var(--sub_text);
    display: block;
    font-size: 13px;
    text-transform: uppercase;
    font-weight: normal;
    text-align: left;
    padding: 20px 20px;
    cursor: pointer;
}
@media (hover: hover) {
     #navbar a:not(.nav_logo + a):hover, #navbar div:hover {
        color: var(--sub_color3);
    }
}

#navbar > ul > li:before {
    content: '';
    border-right: 1px solid;
    border-right-color: var(--border_color);
    position: absolute;
    height: 20%;
    right: 0;
    top: 40%;
}
#navbar > ul > li:last-child:before {
    border-right: none;
}

#navbar ul li ul {
    list-style-type: none;
    position: absolute;
    top: 100px;
    padding: 0;
    margin: 0;
    opacity: 0;
    -moz-opacity: 0;
    filter: alpha(opacity = 0);
    visibility: hidden;
    line-height: 32px;
    background-color: var(--main_color);
    -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.15);
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.15);
    min-width: 240px;
    width: max-content;
    z-index: 9999;
    -webkit-transition: all .40s ease;
    -moz-transition: all .40s ease;
    -ms-transition: all .40s ease;
    -o-transition: all .40s ease;
    transition: all .40s ease;
}
#navbar > ul > li:hover > ul, #navbar > ul > li.focus > ul {
    display: block;
    opacity: 1;
    -moz-opacity: 1;
    filter: alpha(opacity = 100);
    visibility: visible;
    top: 54px;
    border-radius: 10px;
}
#navbar ul li ul, #navbar ul li:hover ul ul{
    visibility: hidden;
}
#navbar ul li ul li {
    float: none;
    margin: 0;
    position: relative;
    text-align: left;
    /* width: 240px; */
    z-index: 1;
}
#navbar ul li ul li:first-child:before {
    border-top: none;
}
#navbar ul li ul li:before {
    border-top: 1px dotted;
    border-top-color: var(--border_color);
    content: "";
    height: 1px;
    left: 10px;
    position: absolute;
    top: 0;
    width: 90%;
}
#navbar ul li ul li a {
    float: none;
    line-height: 20px;
    font-size: 14px;
    height: inherit;
    padding: 12px 15px;
    color: var(--sub_text);
    text-transform: none;
}
@media (hover: hover) {
    #navbar ul li ul li a:hover {
        color: var(--sub_color3);
    }
}

#nav:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
/*------------------------------------------*/


.container {
    margin: 0 auto;
    max-width: 1170px;
    padding: 0;
    position: relative;
    z-index: 2;
}


/*-----------Slider-------------*/
.main-splash, .main-splash .container {
    position: relative;
}

.main-splash .image-splash {
	/* background-image:url('../images/splash.jpg'); */
    background-image:url('../images/features.jpg');
    background-attachment: fixed;
    background-position: center -50px;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    /* padding: 10% 5%; */
    padding: 7% 5% 13%;
    min-height: 350px;
}
.splash-content {
	width: 50%;
    margin: 0;
    /* text-align: right;
    float: right; */
    text-align: center;
    position: absolute;
    right: 0;
    z-index: 99;
	visibility: hidden;
    color: var(--blue-violet);
}
.splash-content .splash-title {
    font-size: 295%;
	line-height: 1.2em;
    /* padding-bottom: 2.5em; */
}

.splash-content .splash-text {
	font-size: 2em;
	line-height: 1.2em;
    padding: 0;
    margin: 0;
}

.btn-default {
    display: inline-block;
    text-transform: uppercase;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 10px;
    line-height: 26px;
    padding: 10px 20px;
	color: var(--main_color);
    background-color: var(--sub_color);
    /* border: 1px solid;
    border-color: var(--sub_color); */
    user-select: none;
    margin-top: 1rem;
    transition: all 300ms ease-out 0s;
    cursor: pointer;
    position: relative;
}

.btn-default.arrow {
    padding: 10px 30px;
    position: relative;
}

.btn-default.white {
    color: var(--sub_color);
    background-color: var(--main_color);
    margin-top: 2rem;
}

@media (hover: hover) {
    .btn-default.change-color:hover {
        color: var(--main_color);
        background-color: var(--sub_color3);
    }
}

@media (hover: hover) {
    .btn-default.zoom-upper:hover {
        transform: translateY(-5px);
        -webkit-box-shadow: 0 8px 6px -6px var(--feature_hover);
        -moz-box-shadow: 0 8px 6px -6px var(--feature_hover);
        box-shadow: 0 8px 6px -6px var(--feature_hover);
    }
}

.btn-default.colored {
    background-color: transparent;
    border-color: var(--sub_color);
    color: var(--sub_color);
}

.btn-default.animate-2s {
    animation: zoomShake 0.8s ease-in-out;
}
@keyframes zoomShake {
    0% {
      transform: scale(1) rotate(0deg);
    }
    20% {
      transform: scale(1.1) rotate(5deg);
    }
    40% {
      transform: scale(1.1) rotate(-10deg);
    }
    60% {
      transform: scale(1.1) rotate(10deg);
    }
    80% {
      transform: scale(1.1) rotate(-5deg);
    }
    100% {
      transform: scale(1) rotate(0deg);
    }
}

/* .glow-button {
      position: relative;
      padding: 14px 30px;
      font-size: 16px;
      color: white;
      background: #3e69af;
      border: none;
      border-radius: 6px;
      overflow: hidden;
      cursor: pointer;
      z-index: 1;
    }


.glow-button.wave::before {
    content: "";
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0) 40%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0) 60%);
    transform: rotate(0deg);
    animation: diag-wave 5s ease-in-out infinite alternate;
    z-index: -1;
} */

    
@keyframes diag-wave {
    from {
    transform: translate(-100%, -100%);
    }
    to {
    transform: translate(100%, 100%);
    }
}


.btn-default span {
    border-left: 1px solid;
    border-left-color: var(--main_color);
    margin-left: 16px;
    padding: 4px 0 6px 18px;
}
.btn-default:hover span {
    border-left-color: var(--sub_color);
}


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

/*---------Main-----------------*/

.container_internal {
    max-width: 978px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    row-gap: 2rem;
}
.features {
    margin-top: 10rem;
	margin-bottom: 0;
    padding: 90px 0 60px;
    position: relative;
    text-align: center;
    background-color: var(--main_color);
}
.features h2 {
    font-size: 26px;
    line-height: 35px;
    color: var(--title_text);
}
.features .feature-sub-title {
    margin-bottom: 60px;
    padding: 0 20px;
}
.features::before {
    content: '';
    position: absolute;
    /* bottom: 0; */
    top: 0;
    left: 8%;    
    background: linear-gradient(180deg, #ecf3f5 30%, var(--main_color) 100%);
    width: 100%;
    height: 41%;
    border-radius: 256px 0 0 0;
}
.features::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 8%;    
    background: linear-gradient(180deg, var(--main_color) 0%, #ecf3f5 100%);
    width: 100%;
    width: 100%;
    height: 31%;
    border-radius: 0 0 0 256px;
}
.column {
    display: flex;
    flex-direction: row;
    column-gap: 2rem;
    position: relative;
    margin: 0 -20px;
    min-height: 200px;
}
/* .column:first-of-type::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    background: #f4f5f7;
    width: 100%;
    height: 45%;
    border-radius: 256px 0 0 0;
} */
.clearfix {
	display: block;
}
.three-column {
    width: 33.33%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}
.three-column, .four-column {
    /* float: left; */
    /* padding: 0 20px 40px; */
    min-width: 100px; /* for performance */
    min-height: 200px; /* for performance */
}

.clearfix:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}
.three-column-content {
	border-radius: 20px;
    background-color: var(--main_color);
    padding: 40px 20px;
    -moz-transition: all 300ms ease-out 0s;
    -o-transition: all 300ms ease-out 0s;
    -webkit-transition: all 300ms ease-out 0s;
    transition: all 300ms ease-out 0s;
    box-shadow: var(--container-box-shadow);
}
.three-column-content div{
	border: 0;
    font-size: 100%;
    font-style: inherit;
    font-weight: inherit;
    margin: 0;
    outline: 0;
    padding: 0;
    vertical-align: baseline;
}
@media (hover: hover) {
    .three-column-content:hover {
        margin-top: -5px;
        box-shadow: var(--container-box-shadow-hover);
        -webkit-box-shadow: var(--container-box-shadow-hover);
    }
}

.three-column-icon {
    background-color: var(--sub_color);
    border: 5px solid;
    border-color: var(--icon_color) ;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    -ms-box-sizing: content-box;
    box-sizing: content-box;
    display: block;
    margin: 0px auto 30px;
    padding: 12px;
    -moz-transition: all 500ms ease-out 0s;
    -o-transition: all 500ms ease-out 0s;
    -webkit-transition: all 500ms ease-out 0s;
    transition: all 500ms ease-out 0s;
}
@media (hover: hover) {
    .three-column-content:hover .three-column-icon {
        border-color: var(--sub_color);
    }
}

.three-column-icon, .three-column-icon img {
    /* width: 36px;
    height: 36px; */
    width: 55px;
    height: 55px;
    object-fit: contain; /* for best practice from google tests */
    -moz-transition: all 300ms ease-out 0s;
    -o-transition: all 300ms ease-out 0s;
    -webkit-transition: all 300ms ease-out 0s;
    transition: all 300ms ease-out 0s;
}
article{
	display: block;
}
.three-column-title {
    font-weight: 200;
    font-size: 20px;
    line-height: 27px;
    display: block;
    overflow: hidden;
}
.three-column-title a {
    color: var(--title_text);
    font-weight: 200;
}

p {
    padding: 0;
    margin: 0 0 20px 0;
}
a.more-link {
    position: relative;
	color: var(--sub_color);
}
@media (hover: hover) {
    a.more-link:hover {
        color: var(--sub_color3);
    }
}
a.more-link:after, .btn-default.arrow:after {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: '\2192';
    font-family: "Genericons";
    font-size: 18px;
    line-height: 20px;
    vertical-align: top;
    top: 0px;
    position: absolute;
    visibility: hidden;
    opacity: 0;
    -moz-opacity: 0;
    filter: alpha(opacity = 0);
    margin-left: 30px;
    -webkit-transition: all 500ms ease-in-out;
    -moz-transition: all 500ms ease-in-out;
    -o-transition: all 500ms ease-in-out;
    -ms-transition: all 500ms ease-in-out;
    transition: all 500ms ease-in-out;
}
.btn-default.arrow:after {
    top: 25%;
}
@media (hover: hover) {
    a.more-link:hover:after, .btn-default.arrow:hover:after {
        visibility: visible;
        margin-left: 5px;
        opacity: 1;
        -moz-opacity: 1;
        filter: alpha(opacity = 100);
    }
}

.fly-section .background {
    background-color: var(--light_blue);
    height: 7rem;
}
.fly-section .background p{
    text-align: center;
    padding-top: 1rem;
    margin: 0;
    color: var(--dark_blue);
    /* font-weight: bold;с */
    font-size: 18px;
}
.fly-section .container {
    top: -2rem;
}



.ucs-map {
    width: 100%;
    height: 40rem;
    border: none;
    margin: 0px;
    overflow: hidden;
}


.big-content-wrapper {
    display: flex;
    flex-direction: row;
    gap: 2rem;
}
.big-content-wrapper:nth-of-type(odd) {
    flex-direction: row-reverse;
}
.big-content-wrapper .content-text {
    width: 48%;
    text-align: left;
}
.big-content-wrapper .content-text h3 {
    font-size: 180%;
    font-family: 'MPlus';
}
.big-content-wrapper .content-text h2 {
    color: var(--dark_blue);
    margin: 0;
    font-size: 100%;
}

.big-content-wrapper .content-text .functionality {
    position: relative;
    margin-top: 1.5rem;
}
.big-content-wrapper .content-text .icon-left {
    position: absolute;
    background-image: url('../images/svg/check-mark.svg');
    background-repeat: no-repeat;
    width: 20px;
    height: 20px;
    background-size: 20px;
    top: 2px;
}
.big-content-wrapper .content-text p {
    padding-left: 30px; 
    margin: 0;
}
.big-content-wrapper .content-image {
    width: 48%;
    height: 700px;
}
.big-content-wrapper .content-image .img-props{
    position: absolute;
    width: 100%;
    height: 100%;    
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: center;
}
.big-content-wrapper .content-image .dreem-mobile-img {
    /* background-image: url("../images/kpi.png"); */
    background-image: url("../images/dreem_mobile_apps2.png");
}
.big-content-wrapper .content-image .dm1{
    background-image: url("../images/DM1.png");
}
.big-content-wrapper .content-image .dm2 {
    background-image: url("../images/DM2.png");
}
.big-content-wrapper .content-image .dm3 {
    background-image: url("../images/DM3.png");
}
.big-content-wrapper .content-image .dm4 {
    background-image: url("../images/DM4.png ");
}
.big-content-wrapper .content-image .dp1 {
    background-image: url("../images/DP.png ");
}
.big-content-wrapper .content-image .dp2 {
    background-image: url("../images/DP2.png ");
}
.big-content-wrapper .content-image .d1 {
    background-image: url("../images/DreemERP_1.png ");
}
.big-content-wrapper .content-image .d2 {
    background-image: url("../images/DreemERP_2.png ");
}

.ad-wrapper {
    background-color: var(--blue-gray);
    border-bottom: 1px solid #e4ebf3;
}
.ad-wrapper .ad {
    max-width: 1000px;
    padding: 3rem;
    margin: 4rem auto 0rem;

}
.ad-wrapper .ad .ad-container {
    background-color: var(--main_color);
    border-radius: 15px;
    padding: 3rem;
    display: flex;
    flex-direction: row;
    gap: 1rem;
    position: relative;
}
.ad-wrapper .ad .ad-container .text {
    padding: 0rem;
    width: 50%;
    text-align: left;
}
.ad-wrapper .ad .ad-container .text h3{
    margin: 0;
}
.ad-wrapper .ad .ad-container .text p {
    margin: 0;
    padding: 0;
    line-height: 2;
}
.ad-wrapper .ad .ad-container .text .btn {
    font-size: 90%;
}
.ad-wrapper .ad .ad-container .img-props {
    background-image: url("../images/ad.jpg");
    width: 50%;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}


.idk {
    margin-top: 10rem;
    padding-bottom: 5rem;
    /* background-color: #daf3f3; */
    /* background-color: #f5f5f5; */
    /* background: linear-gradient(180deg, #ffffff 0%, #B9C4C1 100%); */
    /* background: linear-gradient(180deg, #FFFFFF 0%, var(--light_blue) 100%); */
    /* background: linear-gradient(180deg, var(--main_color) 0%, var(--footer_bg) 100%); */
    /* background: linear-gradient(180deg, transparent 50%, #eaf5fe80 60%); */
    background: linear-gradient(180deg, transparent 0%, #eaf5fe80 60%);
}
.idk .img-props {
    position: relative;
    width: 100%;
    height: 250px;
    /* margin-bottom: 8rem; */
    background-repeat: no-repeat;
    background-position: center;
}
.idk .dreem-mobile-ad {
    /* background-image: url("../images/dreem_mobile_ad.png"); */
    /* background-image: url("../images/dreem_mobile_ad3.png"); */
    /* background-image: url("../images/dreem_mobile_header.png"); */
    background: linear-gradient(180deg, var(--main_color) 0%, var(--light_blue) 100%)
}
.idk .dreem-mobile-ad .container{
    height: inherit;
}

.idk .container  .title {
    margin-bottom: 4rem;
}
.idk .container  .title .text-props {
    position: relative;
    width: 50%;
    text-align: center;
    margin: auto;
}
.idk .container  .title .text-props h2 {
    /* position: absolute;
    top: 45%;
    right: 15%;
    top: 60%;
    right: 19%;
    color: var(--main_color);
    font-size: 130%;
    letter-spacing: 2px; */


    /* border-bottom: 1px solid; */
    margin: 0;
    padding: 5px;
    font-size: 180%;
}
.idk .container  .title .text-props h4 {
    color: var(--dark_blue);
    margin: 0;
    padding: 5px;
}
.idk .container  .three-containers {
    display: flex;
    flex-direction: row;
    gap: 1rem;
    text-align: left;
}
.idk .container  .three-containers:not(:last-child) {
    margin-bottom: 4rem;
}
.idk .container  .one-container {
    width: 31%;
    padding: 24px;
    background-color: var(--main_color);
    border-radius: 16px;
    box-shadow: var(--container-box-shadow);
    transition: 0.3s;
}
@media (hover: hover) {
    .idk .container  .one-container:hover {
        box-shadow: var(--container-box-shadow-hover);
    }
}
.idk .container  .one-container h3 {
    font-size: 145%;
}
.idk .container  .one-container p {
    line-height: 2;
    margin: 0;
}


.dynamic-section h2 {
    text-align: center;
    font-size: 200%;
    margin: auto;
    padding: 0;
    width: 65%;
}
.dynamic-section .bar { 
    font-size: 105%;
    padding: 0rem 4rem;
}
/* .dynamic-section .bar .arrow-right {
    width: 0;
    height: 0;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-left: 10px solid black;
    position: absolute;
    right: 0;
    top: 22px;
}   */
.dynamic-section .bar .arrow-wrapper {
    width: 32px;
    height: 32px;
    background-color: transparent; /* или друг фон, ако искаш */
    position: absolute;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
}
.dynamic-section .bar .arrow-wrapper.left {
    left: 0;
    top: 22px;
}
.dynamic-section .bar .arrow-wrapper.right {
    right: 0;
    top: 22px;
}
  
.dynamic-section .bar .arrow-wrapper .arrow {
    position: absolute;
    top: 2px;
    left: 10px;
    width: 0;
    height: 0;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
}
.dynamic-section .bar .arrow-wrapper .arrow.right {
    border-left: 12px solid var(--title_text);
}

.dynamic-section .bar .arrow-wrapper .arrow.left {
    border-right: 12px solid var(--title_text);
}


.dynamic-section .bar .scrollable-horizontal {
    display: flex;
    position: relative;
    scrollbar-width: none;
    overflow-x: auto;
}
.dynamic-section .bar .scrollable-horizontal.scrolling {
  cursor: grabbing;
}
.dynamic-section .bar .scrollable-horizontal::-webkit-scrollbar {
    display: none;
}
.dynamic-section .bar .scrollable-horizontal .tab {
    /* transition: all .3s; */
    margin-right: 64px;
    padding: 20px 15px;
    display: block;
    white-space: nowrap;
    user-select: none;
    cursor: pointer;
}
.dynamic-section .bar .scrollable-horizontal .tab:last-child {
    margin-right: 0;
}
.dynamic-section .bar .scrollable-horizontal.scrolling .tab{
    cursor: grabbing;
}
.dynamic-section .bar .scrollable-horizontal .tab.active {
    border-bottom: 3px solid var(--sub_color);
    font-weight: bold;
}
.dynamic-section .content {
    margin-top: 3rem;
    margin-bottom: 5rem;
    /* overflow: hidden; !!! */
}
.dynamic-section .content .header h2 {
    width: 65%;
    padding: 0;
    margin: auto;
    text-align: center;
    font-size: 150%;
    color: var(--sub_color);
}
.dynamic-section .content .header p {
    text-align: center;
    margin-top: 1rem;
}

.dynamic-section .content .body {
    display: flex;
    flex-direction: row;
    gap: 3rem;
    margin-top: 3rem;
}
.dynamic-section .content .body .reveal-section-group {
    display: flex;
    flex-direction: column;
    gap: 3rem;
    width: 100%;
}
/*------------------------------*/

/*--------Reveal Section--------*/
.reveal-section .title {
    position: relative;
}
.reveal-section .text p {
    margin: 0;
    overflow: hidden;
    transition: all 0.3s ease-in-out;
    height: 0;
}
.flip-sign {
    position: absolute;    
    width: 12px;
    height: 12px;
    transition: all .3s ease-in-out;
    transform: rotate(0deg);
    cursor: pointer;
}
.flip-sign.active {
    transform: rotate(180deg);
}
.flip-sign .line-vert {
    position: absolute;
    top: 50%;
    height: 2px;
    width: 100%;
    background-color: var(--title_text);
    transition: all .3s ease-in-out;    
}
.flip-sign.active .line-vert {
    background-color: var(--sub_color);
}
.flip-sign .line-hor {
    position: absolute;
    top: 50%;
    transform: rotate(90deg);
    height: 2px;
    width: 100%;
    background-color: var(--title_text);
    opacity: 1;
    transition: all .3s ease-in-out;
}
.flip-sign.active .line-hor {
    opacity: 0;
}

.reveal-section.faq-item {
    position: relative;
    padding: 2rem 0rem;
    cursor: pointer;
    min-height: 50px; /* for performence */
    min-width: 300px; /* for performence */
}
.reveal-section.faq-item:not(:last-child) {
    border-bottom: 1px solid var(--icon_color);    
}
.reveal-section.faq-item .title h2 {
    font-size: 135%;
    padding: 0;
    width: 95%;
    text-align: left;
}
.reveal-section.faq-item .text p {
    padding: 0rem 1rem;
}
.reveal-section.faq-item .text a {
    color: var(--dark_blue);
}
.reveal-section.faq-item .text a:hover {
    color: var(--sub_color3);
}
.faq-item .flip-sign {
    top: 20%;
    right: 0;
}


.reveal-section.feature-item {
    padding: 1.5rem;
    border-radius: 16px;
    box-shadow: var(--container-box-shadow);
    transition: 0.3s;
    text-align: left;
    cursor: pointer;
}
@media (hover: hover) {
    .reveal-section.feature-item:hover {
        box-shadow: var(--container-box-shadow-hover);
    }
}
.reveal-section.feature-item .title h3{
    margin: 0;
    padding: 0;
    color: var(--sub_color);
    padding-right: 1rem;
}

.feature-item .title .flip-sign {
    top: 20%;
    right: 0;
}
.reveal-section.feature-item .text p.show {
    padding-top: 2rem;
}

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

/*------ Horizontal cards ------*/
.horizontal-cards-container {
    display: flex;
    flex-direction: row;
    gap: 1rem;
    width: 100%;
    margin: auto;
}
.horizontal-cards-container.diagonal {
    flex-direction: column;
}

.horizontal-cards-container .horizontal-card {
    width: 30%;
    padding: 2rem 1.5rem;
    overflow: hidden;    
    border-radius: 12px;
    box-shadow: var(--container-box-shadow);
    transition: 0.3s;
    color: var(--dark_blue);
}

.horizontal-cards-container .horizontal-card.ver-1 {
    background-color: var(--footer_bg);
    text-align: center;
}
.horizontal-cards-container .horizontal-card.ver-2 {
    background-color: var(--main_color);
}

.horizontal-cards-container.diagonal .horizontal-card:nth-child(1){
    margin-top: -1rem;
}
.horizontal-cards-container.diagonal .horizontal-card:nth-child(2){
    margin-left: 30%;
}
.horizontal-cards-container.diagonal .horizontal-card:nth-child(3){
    margin-left: 60%;    
    margin-bottom: -4rem;
}

@media (hover: hover) {
    .horizontal-cards-container .horizontal-card:hover{
        box-shadow: var(--container-box-shadow-hover);
    }
}

.horizontal-cards-container .horizontal-card h2 {
    font-size: 130%;
}
/*------------------------------*/

/*------- Horizon card --------*/
.big-horizontal-card-wrapper {
    margin: 3rem;
}
.big-horizontal-card {
    max-width: 750px;
    margin: auto;
    padding: 3rem 2rem;
    font-size: 110%;
    line-height: 2;
    border-radius: 10px;
    background-color: var(--main_color);
    box-shadow: var(--container-box-shadow-hover);
    position: relative;
    z-index: 3;
    background-image: url(../images/bg-radial-1.png);
    background-size: cover;
}
.big-horizontal-card.fly {
    margin: 0rem auto -6rem;
}
.big-horizontal-card h2 { 
    text-align: center;
    margin: 0;
}

.big-horizontal-card.fly .content {
    display: flex;
    flex-direction: row;
    gap: 2rem;
}
.big-horizontal-card.fly .content .btn-default{
    width: -webkit-fill-available;
    width: -moz-available;
}

.big-horizontal-card.fly .content .btns {
    width: 25%;
}
.big-horizontal-card.fly .content p {
    margin: 0;
    /* width: 75%; */
    flex: 1;
}

.big-horizontal-card.intro {
    max-width: 1150px;
}
.big-horizontal-card.intro .content {
    display: flex;
    flex-direction: row;
    gap: 5rem;
}
.big-horizontal-card.intro .content p { 
    font-size: 90%;
    flex: 1;
}
.big-horizontal-card.intro .content .pointers {
    font-size: 90%;
    flex: 1;
}
.big-horizontal-card.intro .content .pointers .pointer {
    display: flex;
    flex-direction: row;
    gap: 1rem;
    align-items: center;
}
.big-horizontal-card.intro .content .pointers .pointer:not(:first-child) {
    margin-top: 1rem;
}
.big-horizontal-card.intro .content .pointers .pointer .icon-props {
    min-width: 32px;
    height: 32px;
    background-size: 32px;
}
.big-horizontal-card.intro .content .pointers .pointer .icon-1 {
    background-image: url(../images/checkicon.png);
}
/*------------------------------*/

/*------- Round section --------*/
.round-section {
    /* position: relative; */
    margin-bottom: 7rem;
    /* height: 150rem; */
}
.round-section .start {
    position: relative;
    /* height: 30rem; */
    /* height: 32% */
}
.round-section .start:before {
    content: '';
    position: absolute;
    /* top: 2%; */
    /* left: 4%; */
    /* left: 23%; */
    left: 35%;
    /* background: #ecf3f5; */
    background-color: var(--blue-gray2);
    opacity: 0.8;
    width: 100%;
    height: 100%;
    /* height: -webkit-fill-available; */
    /* height: -moz-available; */
    border-radius: 256px 0 0 0;
}

.round-section .start .bricks {
    display: flex;
    /* position: absolute;
    top: 23%;
    left: 7%; */
    grid-column-gap: 27px;
    grid-row-gap: 27px;
    flex-flow: wrap;
    justify-content: center;
    padding: 5rem 0rem 8rem;
    /* max-width: 1200px;*/

}

.round-section .start .bricks .brick {
    width: 15rem;
    height: 3rem;
    padding: 1rem;
    border-radius: 8px;
    box-shadow: var(--container-box-shadow);
    /* background-color: #349fb8; */
    /* background-color: var(--light_blue); */
    background-color: var(--main_color);
    background-size: 100%;
    font-size: 85%;
    transition: all 300ms ease-out 0s;
    text-align: left;
}

@media (hover: hover) {
    .round-section .start .bricks .brick:hover{
        transform: translateY(-5px);
    }
}

.round-section .start .bricks .brick:nth-child(3n+2) {
    background-image: url(../images/bg-radial-1.png);
}

.round-section .start .bricks .brick:nth-child(3n+1) {
    background-image: url(../images/bg-radial-3.png);
}
.round-section .start .bricks .brick:nth-child(3n) {
    background-image: url(../images/bg-radial-2.png);
}

.round-section .start .bricks .brick .icon-props {
    width: 100%;
    height: 100%;
    background-size: 65px;
    background-repeat: no-repeat;
    margin-top: -40px;
}
.round-section .start .bricks .brick .icon-props.icon-brick1 {
    background-image: url(../images/brick1.png);
}
.round-section .start .bricks .brick p {
    margin: 0;
    padding-top: .5rem;
    color: var(--blue-violet);
}


.dark-blue-container {
    height: 33%;
    background-color: var(--blue-violet);
    color: var(--main_color);
    padding: 6rem 1rem 3rem;
}
.dark-blue-container .titles h2 {    
    text-align: center;
    font-size: 200%;
    letter-spacing: 2px;
    margin: 0;
}
.dark-blue-container .titles h3 {
    text-align: center;
    font-size: 115%;
}


.round-section .end {
    position: relative;
    /* height: 27%; */
}
.round-section .end:before {
    content: '';
    position: absolute;
    top: 0%;
    right: 6%;
    /* background: #ecf3f5; */
    background-color: var(--blue-gray2);
    opacity: 0.8;
    width: 100%;
    height: 70%;
    border-radius: 0 0 256px 0;
}

.end .wrapper {
    padding-top: 6rem;
}

.end .wrapper h2 {
    text-align: center;
    margin-bottom: 3rem;
    font-size: 180%;
    color: var(--main_color);
}
.end .wrapper .widget {
    width: 66%;
    margin: auto;
    padding: 3rem 2rem;
    font-size: 110%;
    line-height: 2;
    border-radius: 10px;
    background-color: var(--main_color);
    box-shadow: var(--container-box-shadow-hover);
}
.end .wrapper .widget p {
    margin: 0;
}

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

/*--------Visual feature--------*/

.visual-feature {
    padding-top: 3rem;
    display: flex;
    flex-direction: row;
    gap: 3rem;
}
.visual-feature .card { 
    width: 33%;
}
.visual-feature .card h3, .visual-feature .card h4 {
    margin: 0;
}

/**/

/**/
.discover-wrapper {
    background-color: #E7F6FB;
    margin: 7rem 0rem;
}

.discover-wrapper .discover {
    max-width: 1000px;
    padding: 3rem;
    margin: auto;
}


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

/*-------Rotating ballons-------*/
.header-flex {
    display: flex;
    flex-direction: row;
    gap: 1rem;
}

.circle-container {
    position: absolute;
    /* top: 25%;
    left: 20%; */
    top: 15%;
    left: 16%;
    /* width: 20rem;
    height: 20rem;
    border-radius: 50%;
    background-color: rgba(153, 202, 240, .8); */
}
.logos-circle-wrapper {
    position: relative;
    width: 48%;
}
.logos-circle-wrapper .ballons {
    position: relative;
    width: 20rem;
    height: 20rem;
    margin: 0;
    padding: 0;
    /* border-radius: 50%; */
    /* transform: rotate(270deg); */
    /* background-color: rgba(153, 202, 240, .8); */
    /* background: radial-gradient(
        circle,
        rgba(153, 202, 240, 0.0) 20%,
        rgba(153, 202, 240, 0.2) 40%,
        rgba(153, 202, 240, 0.4) 60%,
        rgba(153, 202, 240, 0.6) 80%,
        rgba(153, 202, 240, 0.8) 100%
    ); */
    /* opacity: .99; */
    /* transform: rotate(0deg); */
    /* background: url("../images/cloud.png") no-repeat center; */
    /* background-size: 100%; */
    
    animation-play-state: running;
    animation: circle-container-rotate 30s linear infinite both;
}
/* .logos-circle-wrapper .logo-item {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #fff;
    position: absolute;
    top: 35%;
    left: 36%;
    width: 10em;
    height: 10em;
    margin: -2.5em;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 0 2px 25px rgba(0,0,0,.3);
    border-radius: 50%;
    font-size: 14px;  
} */
.logos-circle-wrapper .logo-item {
    position: absolute;
    top: 17%;
    left: 17%;
    width: 13em;
    height: 13em;
}

.logos-circle-wrapper .logo-item:nth-child(1) {
    transform: rotate(144deg) translate(12.5rem) rotate(-144deg);
    animation: circle-container-rotate-1 30s linear infinite both;
}
.logos-circle-wrapper .logo-item:nth-child(2) {
    transform: rotate(216deg) translate(12.5rem) rotate(-216deg);
    animation: circle-container-rotate-2 30s linear infinite both;
}
.logos-circle-wrapper .logo-item:nth-child(3) {
    transform: rotate(288deg) translate(12.5rem) rotate(-288deg);
    animation: circle-container-rotate-3 30s linear infinite both;
}
.logos-circle-wrapper .logo-item:nth-child(4) {
    transform: rotate(360deg) translate(12.5rem) rotate(-360deg);
    animation: circle-container-rotate-4 30s linear infinite both;
}
.logos-circle-wrapper .logo-item:nth-child(5) {
    transform: rotate(432deg) translate(12.5rem) rotate(-432deg);
    animation: circle-container-rotate-5 30s linear infinite both;
}

.logo-item span {
    transform: rotate(0deg);
    display: block;
    text-align: center;
}

.header-flex .title {
    color: var(--title_text);
    margin-top: 6rem;
    text-align: left;
    width: 48%;
    padding-left: 5rem;
}
.header-flex .title h2 {
    font-size: 3em;
    line-height: 1.2em;
    font-family: 'MPlus';
}


.logo-container {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    animation: fadeInScale 2s ease-in-out;
    z-index: 2;
    filter: opacity(0.8); 
    /* display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10; */
}
.home-png {
    position: absolute;
    width: 100%;
    height: 100%;
    background-image: url(../images/home.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100%;
    opacity: 0.5;
}

/* .logo-props {
    height: auto;
    animation: rotateLogo 10s linear infinite;
} */

.ballon-empty {
    background-image: url("../images/ballon_empty.png");
}
.ballon-empty-1 {
    background-image: url("../images/ballon_empty_1.png");
}
.ballon-empty-2 {
    background-image: url("../images/ballon_empty_2.png");
}
.ballon-empty-3 {
    background-image: url("../images/ballon_empty_3.png");
}

.fly-ballon-1 {
    position: absolute;
    width: 100px;
    height: 100px;
    background-size: 100%;
    transform-origin: center;
    animation: zoomCycle 5s infinite;
    animation-delay: 2s;
    opacity: 0;
}
.fly-ballon-2 {
    position: absolute;
    width: 150px;
    height: 150px;
    /* top: 54%;
    right: 12%; */
    top: 64%;
    right: 26%;
    background-size: 100%;
    transform-origin: center;
    animation: zoomCycle 7.5s infinite;
    animation-delay: 3s;
    opacity: 0;
}
.ballon-props {
    background-repeat: no-repeat;
    background-size: 100%;
    width: 100%;
    height: 100%;
}
.ballon-props.animate-2s {
    animation: zoomOutIn 2s infinite ease-in-out;
}
.ballon-props.animate-3s {
    animation: zoomOutIn 3s infinite ease-in-out;
}
.ballon-props.ballon-1 {
    background-image: url("../images/ballon_dreem.png");
    /* transform-origin: center;
    animation: zoomOutIn 3s infinite ease-in-out;
    animation-delay: 3s; */
}
.ballon-props.ballon-2 {
    background-image: url("../images/ballon_pos.png");
}
.ballon-props.ballon-3 {
    background-image: url("../images/ballon_mobile.png");
    /* transform-origin: center;
    animation: zoomOutIn 2s infinite ease-in-out;
    animation-delay: 5s; */
}
.ballon-props.ballon-4 {
    background-image: url("../images/ballon_saas.png");
    /* transform-origin: center;
    animation: zoomOutIn 4s infinite ease-in-out;
    /* animation-delay: 8s; */
}
.ballon-props.ballon-5 {
    background-image: url("../images/ballon_more.png");
}


@keyframes fadeInScale {
    0% {
        opacity: 0;
        transform: translate(-50%, -50%) scale(0.5);
    }
    100% {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1);
    }
}

@keyframes rotateLogo {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

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

/*------------Widgets-----------*/
.widget_portfolio {
    margin-bottom: 0;
    margin-top: -1px;
    position: relative;
    text-align: center;
    background-color: var(--main_color);
}
.widget_portfolio .portfolio-container {
    border: 40px solid;
    border-color: var(--footer_bg);
    border-color: var(--blue-gray);
    background-color: var(--sub_color);
}
.widget_portfolio .four-column-full-width:first-child {
    min-height: 250px;
    padding: 60px 40px 20px;
}
.widget_portfolio .four-column-full-width {
    float: left;
    position: relative;
    overflow: hidden;
    height: 100%;
    text-align: left;
}
.four-column-full-width {
    width: 25%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}



.widget_portfolio .widget-title, .widget_portfolio .widget-sub-title {
    color: var(--main_color);
    text-align: left;
    margin-bottom: 20px;
    padding: 0px;
}

.widget_portfolio .four-column-full-width .functionality {
    position: relative;
    margin-top: 1.5rem;
}
.widget_portfolio .four-column-full-width .functionality .icon-left {
    position: absolute;
    background-image: url('../images/svg/check-mark-white.svg');
    background-repeat: no-repeat;
    width: 20px;
    height: 20px;
    background-size: 24px;
}
.widget_portfolio .four-column-full-width .functionality p {
    padding-left: 30px; 
    margin: 0;
}
.widget-title {
    font-size: 28px;
    line-height: 35px;
    font-weight: 400;
    padding-bottom: 20px;
}
.widget_portfolio .widget-title:after {
    background-color: var(--main_color);
    content: " ";
    display: block;
    height: 1px;
    margin: 10px 0 auto;
    width: 80px;
}
.widget-sub-title {
    font-size: 1em;
    line-height: 1.5em;
    color: var(--main_text);
}
.widget_portfolio .four-column-full-width img {
    left: 0;
    height: auto;
    display: block;
    filter: contrast(0.7);
}
.widget_portfolio img {
    max-width: 100%;
}
.widget_portfolio .four-column-full-width .portfolio-content {
    background-color: var(--portfolio_bg);
    color: var(--main_color);
    z-index: 100;
    -webkit-transition: all 500ms ease-out;
    -moz-transition: all 500ms ease-out;
    -o-transition: all 500ms ease-out;
    -ms-transition: all 500ms ease-out;
    transition: all 500ms ease-out;
    height: 100%;
    width: 100%;
    text-align: left;
    padding: 20px 20px 0;
    position: absolute;
    display: block;
    top: 0;
    left: 100%;
    opacity: 0;
    -moz-opacity: 0;
    filter: alpha(opacity = 0);
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}
.widget_portfolio .four-column-full-width:hover .portfolio-content, .widget_portfolio .four-column-full-width.focus .portfolio-content {
    opacity: 1;
    -moz-opacity: 1;
    filter: alpha(opacity = 100);
    left: 0;
}
.portfolio-content h3 {
     padding-bottom: 5px;
     margin-bottom: 10px;
     color: var(--main_color);
     font-size: 1.2rem;
     line-height: 1.5rem;
}
.portfolio-content h3:after {
    background-color: var(--sub_color);
    content: " ";
    display: block;
    height: 1px;
    margin: 10px 0px auto;
    width: 50px;
}
.portfolio-content p {
    font-size: 15px;
    line-height: 22px;
    padding-bottom: 10px;
    margin-bottom: 0px;
}

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

/*-----------ROLLER------------*/

.widget_roller {
    background-color: var(--footer_bg);
    margin-bottom: 0;
    position: relative;
}

.roller_bg {
    background-image: url("../images/roller_splash.jpg");
    background-attachment: fixed;
    background-position: center center;
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    padding: 60px 0;
    text-align: center;
    position: relative;
    width: 100%;
}

.roller {
    max-width: 100%;
    margin: auto;
}

.quote-wrapper {
    overflow: hidden;
}

.quotes {
    text-align: center;
    float: left;
    width: 100%;
    margin-right: -100%;
    opacity: 0;
    -moz-opacity: 0;
    filter: alpha(opacity = 0);
    transition: opacity 2s ease-in-out;
    -moz-transition: opacity 2s ease-in-out;
    -webkit-transition: opacity 2s ease-in-out;
}

.quotes.showing {
    opacity: 1;
    transition: opacity 2s ease-in-out;
    -moz-transition: opacity 2s ease-in-out;
    -webkit-transition: opacity 2s ease-in-out;
}

.roller .quote {
    border: none;
}

.quote {
    width: 90%;
    margin: auto;
    text-align: left;
    position: relative;
    padding: 10px 20px 10px 220px;    
    color: var(--main_text);
    font-size: 16px;
    font-weight: normal;
    line-height: 1.32;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

.roller .quote img {
    /* height: 160px;
    width: 160px; */
    background-color: var(--main_color);
    border: 1px solid;
    border-color: var(--border_color);
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 4px;
    position: absolute;
    left: 0;
    margin: 20px 0;
    z-index: 2;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
}

.roller .roller-title {
    color: var(--title_text);
    font-size: 28px;
    line-height: 35px;
    font-weight: 400;
    padding-bottom: 20px;
}

.roller .quote p {
    line-height: 1.4;
    padding: 0 0 20px 0;
    text-transform: none;
    font-style: italic;
    position: relative;
    z-index: 2;
}

.roller .quote span {
    color: var(--sub_color);
    font-weight: bold;
    margin: 0px 0px 20px;
    text-align: left;
}

.roller ul {
    list-style-type: disc;
}
.roller .next-prev {
    border: none;
}
ul.next-prev {
    top: 50px;
    list-style: none;
    margin: 0 0 5px;
    padding: 0;
    position: absolute;
    right: 20px;
}
ul.next-prev li {
    border: 2px solid;
    border-color: var(--sub_color);
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    display: block;
    width: 18px;
    height: 18px;
    line-height: 18px;
    font-size: 0;
    opacity: 0.7;
    -moz-opacity: 0.7;
    filter: alpha(opacity = 70);
    background: transparent;
    margin: 0 4px 10px;
    cursor: pointer;
    -moz-transition: background .3s ease;
    -webkit-transition: background .3s ease;
    -ms-transition: background .3s ease;
    transition: background .3s ease;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}
ul.next-prev li.active{
    background-color: var(--sub_color);
}
@media (hover: hover) {
    ul.next-prev li:hover {
        background-color: var(--sub_color);
    }
}

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

/*-----------PAGES-------------*/
.page-header {
    background-color: var(--sub_color);
    padding: 1rem;
    position: relative;
    overflow: hidden;
}
.page-header-horizontal {
    padding: 4rem 0rem;
    background: linear-gradient(90deg, var(--main_color) 30%, var(--light_blue) 100%);
}

.page-header-vertical {
    background-color: var(--light_blue);
    background: linear-gradient(180deg, var(--light_blue) 0%, var(--main_color) 100%);
    color: var(--main_text);
    padding: 5rem 0rem;
}
/* .page-header-vertical.dreem-erp-img {
    background-image: linear-gradient(#fffc,#fffc), url("../images/dreem_erp2.jpg");
    background-image: url("../images/dreem_erp_header.jpg");
} */
/* .page-header-vertical.img-props{
    background-color: none;
    width: 100%;
    height: 100%;
} */
.page-header-vertical .page-header-wrapper {    
    margin: auto;
    text-align: center;    
    max-width: 700px;
    padding: 4rem 2rem;
}
.page-header-vertical .page-header-wrapper h3 {
    margin: 0;
    color: var(--dark_blue);
    /* text-transform: uppercase; */
    letter-spacing: 2px;
    /* letter-spacing: 1px; */
    font-size: 130%;
}
.page-header-vertical .page-header-wrapper .btn-container .btn-default {
    padding: 1rem 3rem;
}

.page-header-vertical .page-header-wrapper h1{
    font-size: 180%;
    font-family: 'MPlus';
}

.page-header-centered {
    display: flex;
    flex-direction: row;
    min-height: 60vh;
    align-items: center;
}
.page-header-centered .left-part {
    text-align: center;
    /* padding: 0rem 4rem;
    width: 65%; */
    /* width: 50%; */
    width: 70%;
}
.page-header-centered .left-part h1{
    font-size: 200%;
    font-family: 'MPlus';
}    
.page-header-centered .right-part {
    /* width: 35%; */
    width: 60%;
    margin: 10% 15% 0% 10%;
    /* margin-top: 3rem; */
}
.page-header-centered .right-part .btn {
    width: 60%;
    /* width: 30%; */
    margin-bottom: 2rem;
    padding: 1rem;
    box-shadow: var(--container-box-shadow);
    background: transparent;
    color: var(--black);
}

.page-header-centered .right-part .btn:nth-child(1){
    margin-left: 4rem;
}
.page-header-centered .right-part .btn:nth-child(2){
    margin-left: 2rem;
}
/* .page-header-centered .right-part .btn:nth-child(3){
    margin-left: 4rem;
} */

.page-header-angle-photo {
    position: relative;
    background-position: top left;
    background-repeat: no-repeat;
    background-size: 40%;
}

.page-header-angle-photo.saas {
    background-image: url(../images/saas.png);
}
.page-header-angle-photo.erp {
    background-image: url(../images/learning.png);
}
.page-header-angle-photo.accounting {
    background-image: url(../images/accounting.png);
}
/* .page-header-angle-photo .img-props {
    width: 625px;
    height: 450px;
    position: absolute;
    top: 0;
     right: 0;
    left: 0;
} */

.page-title {
    font-size: 2rem;
    line-height: 2.5rem;
    color: var(--main_color);
    float: left;
    margin: 0;
    padding: 0;
}
#content {
    padding: 2rem 0 1.5rem;
}


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

/*-----AGREEMENT CONTAINER------*/
.agreement-modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 20;
    backdrop-filter: blur(10px);
    background-color: rgba(22, 26, 35, 0.8);
    padding: 2rem;
    opacity: 0;
    pointer-events: none;
}
.agreement-modal.visible {
    opacity: 1;
    transition: opacity 1s ease;
    pointer-events: all;
}
.agreement-modal .agreement-container {
    display: flex;
    flex-direction: column;
    height: 100%;
    margin: 0 auto;
    max-width: 1170px;
}
.agreement-modal .agreement-container h2{
    margin: 0;
    color: var(--main_color);
}
.agreement-modal .agreement-container iframe {
    height: 100%;
    border: none;
}
.agreement-modal .agreement-container .btns {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}
/*------------------------------*/

/*------REGISTRATION FORM-------*/

.form {
    width: auto;
    position: relative;
    top: 25%;
    background-color: var(--main_color);
    margin: auto;
    padding: 30px;
    border-radius: 12px;
    max-width: 400px;
    box-shadow: var(--container-box-shadow-hover);
}

.form .form-header {
    text-align: center;
    font-size: 160%;
    padding: 2rem 0rem;
}

/* Групи във формата */
.form .form-group {
    margin-bottom: 20px;
}
.form .form-group.code {
    width: 75%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 3rem;
}

/* Етикети */
.form .label, .form .fly-label {
    display: flex;
    gap: 3px;
    margin-bottom: 5px;
}

.form .required-label {
    font-size: 150%;
    height: 0;
    color: red;
}

/* Полета */
.form .input {
    width: 100%;
    padding: 10px 12px;
    font-size: 16px;
    border: 1px solid var(--border_color);
    border-radius: 6px;
    box-sizing: border-box;
}

.form .input:focus {
    outline: none;
    border-color: var(--sub_color);
    box-shadow: 0 0 3px var(--sub_color);
}

/* Икони (ако се използват със background) */
.form .input-icon-left,
.form .input-icon-right {
    position: relative;
}

/* .form .icon-email::before,
.form .icon-user::before,
.form .icon-pass::before,
.form .icon-show-pass::before {
    content: "";
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    width: 20px;
    height: 20px;
    background-size: contain;
    background-repeat: no-repeat;
} */

/* Добави собствени иконки тук */
/* .icon-email::before {
    background-image: url('icon-email.svg');
}
.icon-user::before {
    background-image: url('icon-user.svg');
}
.icon-pass::before {
    background-image: url('icon-lock.svg');
}
.icon-show-pass::before {
    background-image: url('icon-eye.svg');
} */

.form .captcha {
    display: flex;
    flex-direction: row;
    justify-content: center;
    margin: 1rem 0rem;
}

/* Бутон за регистрация */
.form .btn.register {
    display: block;
    width: 100%;
    border: none;
    background-color: var(--sub_color);
    color: white;
    padding: 12px;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    border-radius: 6px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}
.form .btn.register.disabled {
    background-color: var(--border_color);
}

@media (hover: hover) {
    .btn.register:hover {
        background-color: var(--sub_color3);
    }
}

/* Съобщения */
.error-msg {
    color: red;
    text-align: center;
    padding-top: 1rem;
    font-size: 90%;
    font-weight: 500;
}
.success-msg {
    color: green;
    text-align: center;
    padding-top: 1rem;
    font-size: 110%;
}




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

/*-------INFO BLOCKQUOTE--------*/
blockquote {
    background-color: var(--feature_bg);
    border-left: 4px solid var(--sub_color);
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    color: var(--feature_hover);
    font-style: italic;
    -webkit-hyphens: none;
    -moz-hyphens: none;
    -ms-hyphens: none;
    hyphens: none;
    letter-spacing: 0.5px;
    margin-bottom: 40px;
    padding: 30px 25px 10px 30px;
    position: relative;
    quotes: none;
    line-height: 26px;
}

blockquote.info {
    background-image: url(../images/icons/i_info.png);
    background-repeat: no-repeat;
    background-position: left 0.5rem top 0.5rem;
    padding-left: 3rem;
}


hr {
    background-color: rgba(0, 0, 0, 0.1);
    border: 0;
    height: 1px;
    margin-bottom: 1.5em;
}
/*
.download{
    width: 100%;
    display: table;
    background-color: var(--feature_bg);
    border-radius: 5px;
    margin-bottom: 5rem;
}
.download .download-cell{
    width: 50%;
    padding: 4rem;
    display: table-cell;
    vertical-align: top;
}
.download .download-cell.left{
    padding-right: 2rem;
    text-align: right;
}
.download .download-cell.right{
    padding-left: 2rem;
    text-align: left;
}

.download .btn{
    max-width: 390px;
    margin: auto;
    width: 100%;
    box-sizing: border-box;
    background-size: 36px;
    position: relative;
    border-radius: 18px;
    line-height: 26px;
    padding: 7px 18px;
	color: var(--main_color);
    background-color: var(--sub_color);
}
*/
/*#download-dreem {
    max-width: 390px;
    margin: auto;
}*/
/*
#download-dreem .btn{
    background-image: url(../images/icons/i_download.png);
    background-repeat: no-repeat;
    background-position: left 1.8rem top 1.1rem;
}
*/
/*
#download-dreem .btn-default:hover{
    color: var(--main_color);
    border-color: var(--sub_color);
    background-color: var(--sub_color);
}
*/
/*
.download .btn .name{
    font-size: 150%;
    text-align: center;
    font-variant: small-caps;
    text-transform: none;
    padding-top: 1rem;
    padding-left: 80px;
}
.download .btn .build {
    text-align: center;
    padding-bottom: 1rem;
    padding-left: 80px;
}
.download .btn .size {
    position: absolute;
    left: 1.2rem;
    bottom: 0.8rem;
}
*/
.download .three-column-content {
    text-align: center;
    padding: 40px 10px;
}
@media (hover: hover) {
    .download .three-column-content:hover {
        margin-top:inherit;
    }
}

.download .three-column-title {
    padding: 0;
    padding-top: 30px;
    font-weight: bold;
}
.download p {
    margin: 0;
}
.download .btn {
    margin: 2rem auto 0rem;
    width: 80%;   
    border-radius: 18px;
    line-height: 26px;
    padding: 15px;
	color: var(--main_color);
    background-color: var(--sub_color);
    background-image: url(../images/icons/i_download.png);
    background-size: 28px;
    background-repeat: no-repeat;
    background-position: left 1.8rem top 0.8rem;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
}
@media (hover: hover) {
    .download .btn:hover {
        background-color: var(--sub_color3);
    }
}



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


/*-----------ADMIN--------------*/


/* Top Subnavigation Bar */
#top_sub_navbar { margin: 2rem; }
#top_sub_navbar ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: row; justify-content: center; font-size: 105%; }
#top_sub_navbar ul li{ flex: 1; position: relative; text-align: center; }
#top_sub_navbar ul li:not(:last-child):after { content: ''; border-right: 1px solid var(--border_color); position: absolute; height: 50%; right: 0; top: 30%; }
#top_sub_navbar ul li a { font-family:'Candara', 'Trebuchet MS', Tahoma, Helvetica, Sans-serif; display: block; }
#top_sub_navbar ul li a:hover { color:var(--sub_color3); }
/* #top_sub_navbar ul li.tsn_current { background:url(bg/images/border_button_a.png) no-repeat 0px 0px; background-position:right; float:left; height:25px; line-height:25px; width:69px; margin:0; padding:0px;} */
#top_sub_navbar ul li.tsn_current a { color:var(--sub_color); }

/* table */
#table_main { 
    margin-left: auto;
    margin-right: auto;
    width: 1100px;
}
#table_main table.standart {
    text-align: center;
    margin-bottom: 2rem;
    width: 100%;;
}
#table_main table.standart .title {
    font-size: 140%;
    color: var(--sub_color);
}
#table_main table.standart .subtitle {
    font-size: 105%;
    color: var(--sub_color);
}
#table_main table.standart .subtitle .frm_open {
    color: var(--sub_color3);
    cursor: pointer;
}
@media (hover: hover) {
    #table_main table.standart .subtitle .frm_open:hover {
        color: var(--sub_color);
        font-weight: bold;
    }
}

#table_main table.standart tr td table.ppl-table {
    width: 100%;
}


#table_main table.standart tr td table.ppl-table thead tr td.line {
    height:1px; 
    border-bottom:solid 1px var(--border_color);
}

#table_main table.standart tr td table.ppl-table thead tr.header {
    height: 50px;
}

#table_main table.standart tr td table.ppl-table tbody tr:first-child td { 
    border-top: dotted 1px #707070;
}
#table_main table.standart tr td table.ppl-table tbody tr td { 
    padding: .9rem .5rem;
    border-left: dotted 1px #707070;
    border-bottom: dotted 1px #707070;
    text-align: left;
}
#table_main table.standart tr td table.ppl-table tbody tr td.number {
    text-align: right;
}
#table_main table.standart tr td table.ppl-table tbody tr td:last-child { 
    border-right: dotted 1px #707070;
}

#table_main table.standart tr td table.ppl-table tbody tr td.refurl {
    text-align:left;
    max-width:700px;
    word-wrap:break-word;
}

#table_main table.standart tr td table.ppl-table tbody tr td a { 
    color: var(--sub_color3);
    font-weight: bold;
    /* opacity: 0.8;
    transition: opacity 0.2s ease; */
}
@media (hover: hover) {
    #table_main table.standart tr td table.ppl-table tbody tr td a:hover { 
        color: var(--sub_color);
        /* opacity: 1; */
        /* font-weight: bold; */
    }
}

.page_numbers {
    text-align: center;
    margin: 1rem 0rem;
}
.page_numbers a {
    color: var(--sub_color3);
}
@media (hover: hover) {
    .page_numbers a:hover {
        color: var(--sub_color);
    }
}
.page_numbers .disabled {
    color: var(--border_color);
}

/* adm_visits.php */
#table_main table.standart tr td table.ppl-history tr td:nth-child(1) {
    /* width: 130px; */
    width: 15%;
}
#table_main table.standart tr td table.ppl-history tr td:nth-child(2) {
    /* width: 130px; */
    width: 15%;
}
#table_main table.standart tr td table.ppl-history tr td:nth-child(3) {
    /* width: 510px; */
    width: 55%;
}
#table_main table.standart tr td table.ppl-history tr td:nth-child(4) {
    /* width: 50px; */
    width: 7.5%;
}
#table_main table.standart tr td table.ppl-history tr td:nth-child(5) {
    /* width: 80px; */
    width: 7.5%;
}

/* adm_visitsByIp.php */
#table_main table.standart tr td table.ppl-ip tr td:nth-child(1) {
    /* width: 240px; */
    width: 20%;
}
#table_main table.standart tr td table.ppl-ip tr td:nth-child(2) {
    /* width: 460px; */
    width: 65%;
}
#table_main table.standart tr td table.ppl-ip tr td:nth-child(3) {
    /* width: 50px; */
    width: 7.5%;
}
#table_main table.standart tr td table.ppl-ip tr td:nth-child(4) {
    /* width: 100px; */
    width: 7.5%;
}

/* adm_pplDreem.php */
#table_main table.standart tr td table.ppl-dreem tr td:nth-child(1) {
    /* width: 240px; */
    width: 27.5%;
}
#table_main table.standart tr td table.ppl-dreem tr td:nth-child(2) {
    /* width: 460px; */
    width: 10%;
}
#table_main table.standart tr td table.ppl-dreem tr td:nth-child(3) {
    /* width: 50px; */
    width: 10%;
}
#table_main table.standart tr td table.ppl-dreem tr td:nth-child(4) {
    /* width: 100px; */
    width: 10%;
}
#table_main table.standart tr td table.ppl-dreem tr td:nth-child(5) {
    /* width: 100px; */
    width: 10%;
}
#table_main table.standart tr td table.ppl-dreem tr td:nth-child(6) {
    /* width: 100px; */
    width: 10%;
}
#table_main table.standart tr td table.ppl-dreem tr td:nth-child(7) {
    /* width: 100px; */
    width: 7.5%;
}
#table_main table.standart tr td table.ppl-dreem tr td:nth-child(8) {
    /* width: 100px; */
    width: 7.5%;
}
#table_main table.standart tr td table.ppl-dreem tr td:nth-child(9) {
    /* width: 100px; */
    width: 7.5%;
}

/* adm_users.php */
#table_main table.standart tr td table.ppl-register tr td:nth-child(1) {
    /* width: 240px; */
    width: 5%;
}
#table_main table.standart tr td table.ppl-register tr td:nth-child(2) {
    /* width: 460px; */
    width: 20%;
}
#table_main table.standart tr td table.ppl-register tr td:nth-child(3) {
    /* width: 50px; */
    width: 25%;
}
#table_main table.standart tr td table.ppl-register tr td:nth-child(4) {
    /* width: 100px; */
    width: 20%;
}
#table_main table.standart tr td table.ppl-register tr td:nth-child(5) {
    /* width: 100px; */
    width: 20%;
}
#table_main table.standart tr td table.ppl-register tr td:nth-child(6) {
    /* width: 100px; */
    width: 10%;
}

.vat-error { color: red; }
.vat-address { font-size: 10px; text-align: left; }
img.vat-loader { border: 0; }
.clickable { color: var(--sub_color3); cursor: pointer; font-weight: bold; }
.clickable:hover { color: var(--sub_color); }


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

/*---------------- Form style --------------*/
:focus-visible {outline: none;}
#form-top{background:url(bg/images/frm_reg_top.jpg) no-repeat left top; width:465px; height:99px; border-collapse:collapse; padding:0; margin:0;}
#form-left{background:url(bg/images/frm_reg_left.jpg) repeat-y left top; width:15px; border-collapse:collapse; padding:0; margin:0;}
#form-right{background:url(bg/images/frm_reg_right.jpg) repeat-y right top; width:17px; border-collapse:collapse; padding:0; margin:0;}
#form-bottom{background:url(bg/images/frm_reg_bottom.jpg) no-repeat left bottom; width:465px; height:74px; border-collapse:collapse; padding:0; margin:0;}
#form-main.form tr td {padding:3px;}
#form-main table { width: 100%; }
#form-main .form-border { position:relative; border:1px solid var(--sub_color); text-align:center; }
#form-main td.title{ color:#3399ff; text-indent:30px; text-align:left;}
#form-main td.title div{ width:90%; margin:0px 30px; border-bottom:#3399ff solid 1px;}
#form-main td.title2{ color:var(--sub_color); text-indent:30px; text-align:left;}
#form-main td.title2 div{ margin:0px 20px 0px 30px; ; border-bottom:var(--sub_color) solid 1px;}
#form-main td.label{ font-size:1em; color:#000; font-weight:normal; text-align:right}
#form-main td label.fly-label { position: relative; width: auto; height: auto; font-size: 90%; float: left; margin: 0px 0px -5px 5px; padding: 0px 5px; background: linear-gradient(to bottom, rgba(255,255,255,1) 80%, rgba(255,255,255,0) 20%); z-index: 1;}
#form-main td.data{ font-size:0.875em; color:var(--sub_color); vertical-align:top;}
#form-main td input{ font-family:'Candara','Trebuchet MS', Tahoma, Sans-serif; font-size:1em; color:#000; vertical-align:top;
background: var(--main_color);
border: 1px solid #ddd;
padding: .4em .6em;
border-radius: 3px;
}
#form-main td input:disabled { background-color: #f5f5f5;}

#form-main td input[type="radio"]{width: 20px; height: 20px; border:1px solid var(--sub_color); appearance: none; border-radius: 100%; background: #fff; font-size: 10px; vertical-align: middle;}
#form-main td input[type='radio']:before { content:''; display:block; width: 10px; height: 10px; margin: 0px -2px; border-radius: 100%;}
#form-main td input[type='radio']:disabled { opacity: 0.3;}
#form-main td input[type="radio"]:checked:before{ background:var(--sub_color);}
#form-main td input[type="radio"].green{border:1px solid #008000;}
#form-main td input[type="radio"].green:checked:before{ background:#008000;}
#form-main td input[type="checkbox"]{position: relative;}
#form-main td input[type="checkbox"]:before { content: ""; display: block; position: absolute; width: 18px; height: 18px; top: 0; left: 0; border: 2px solid var(--sub_color); border-radius: 3px; background-color: #fff;}
#form-main td input[type="checkbox"]:checked:after { content: ""; display: block; width: 5px; height: 10px; border: solid var(--sub_color); border-width: 0 2px 2px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); position: absolute; top: 3px; left: 8px;}

/*#form-main td input:hover{
	box-shadow: 0px 0px 5px 0px var(--sub_color);
}
*/
#form-main td input:focus{
	border: 1px solid var(--sub_color);
}
#form-main td textarea{font-family:'Candara', 'Trebuchet MS', Tahoma, Sans-serif; font-size:1em; color:#000; vertical-align:top;
background: #ffffff;
border: 1px solid #ddd;
padding: .4em .6em;
border-radius: 3px;
}
/*
#form-main td textarea:hover{
	box-shadow: 0px 0px 5px 0px var(--sub_color);
}
*/
#form-main td textarea:focus{
	border: 1px solid var(--sub_color);
}
#form-main td select{ font-family:'Candara', 'Trebuchet MS', Tahoma, Sans-serif; font-size:1em; color:#000; vertical-align:top;
background: #ffffff;
border: 1px solid #ddd;
padding: .4em .6em;
border-radius: 3px;
}
/*
#form-main td select:hover{
	box-shadow: 0px 0px 5px 0px var(--sub_color);
}
*/
#form-main td select:focus{
	border: 1px solid var(--sub_color);
}

#form-main #realfield{
	width:300px;
  opacity: 1;
  -moz-opacity: 1;
  filter:progid:DXImageTransform.Microsoft.Alpha(opacity=1);
	box-shadow: none;
/*	shadow: none;*/
}
#realfield:hover ~ #fakefield {
	box-shadow: 0px 0px 5px 0px var(--sub_color);
/*	shadow: 0px 0px 5px 0px var(--sub_color);*/
}
#realfield:hover ~ #fakebutton {
	border: 1px solid var(--sub_color);
	box-shadow: 0px 0px 5px 0px var(--sub_color) inset;
}

#form-main td input.button { 
    background-color: var(--sub_color);
    color: var(--main_color);
    border-radius: 5px;
    cursor: pointer;
}
/*
#form-main td input.button:hover{
	border: 1px solid var(--sub_color);
	box-shadow: 0px 0px 5px 0px var(--sub_color) inset;
}
*/
#form-main td input.button:focus{
	border: 1px solid var(--sub_color);
	box-shadow: 0px 0px 5px 0px var(--sub_color) inset;
}

.frm_header {
    font-size:1.4em;
    height:35px;
    text-indent:15px;
    text-align:left;
    /* background: var(--sub_color) !important; for non-css3 browsers */
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ef5001', endColorstr='var(--sub_color)'); /* for IE */
	/* background: -webkit-gradient(linear, left top, left bottom, from(#ef5001), to(var(--sub_color))) !important; for webkit browsers */
	/* background: -moz-linear-gradient(top,  #ef5001,  var(--sub_color)) !important; for firefox 3.6+ */
    background: var(--sub_color);
	color: #fff;
}	
.frm_header td {
	/* filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ef5001', endColorstr='var(--sub_color)'); for IE */
    background: var(--sub_color);
    height: 55px;
}


/* DATETIME PICKER */
/*fix size*/
.ui-datepicker {font-size:66%; width: 19em;}
/*fix colored Saturday and Sunday*/
.ui-datepicker-week-end{color:var(--sub_color) ;}
.ui-datepicker-week-end a.ui-state-default  { background-color: 999;}
.ui-datepicker-week-end, .ui-datepicker-week-end a.ui-state-default {color:var(--sub_color);}
/*fix month and year dropdown comboboxes*/
.ui-datepicker select.ui-datepicker-month{width: 59%;}
.ui-datepicker select.ui-datepicker-year{ width: 39%;}
/*fix opacity for other months*/
.ui-priority-secondary, .ui-widget-content .ui-priority-secondary, .ui-widget-header .ui-priority-secondary {opacity: 0.5; font-weight: normal;}
/*fix opacity and style to Today button*/
.ui-datepicker div.ui-datepicker-buttonpane button.ui-datepicker-current {font-weight: bold; opacity: 1; filter:Alpha(Opacity=100);}
/*slyle for arrow*/
.frm_open div.btn { display:block;
	padding:5px 8px 5px 5px;
	margin: 0px 3px;
	font-weight:bold;
  background-color: #fff;
  color: #5B5B5B;
  border: 1px solid #999;
  text-shadow: 0 1px 1px rgba(0, 0, 0, .3);
   
  border-radius: 4px 4px 4px 4px;
  -webkit-border-radius: 4px 4px 4px 4px;
  -moz-border-radius: 4px 4px 4px 4px;

	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#fefefe', endColorstr='#e4e3e3');
	background: -webkit-gradient(linear, left top, left bottom, from(#fefefe), to(#e4e3e3)) !important;
	background: -moz-linear-gradient(top,  #fefefe,  #e4e3e3) !important;
}
.frm_open div.btn:hover {
	cursor:pointer;
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#e4e3e3', endColorstr='#fefefe'); /* for IE */
	background: -webkit-gradient(linear, left top, left bottom, from(#e4e3e3), to(#fefefe)) !important; /* for webkit browsers */
	background: -moz-linear-gradient(top,  #e4e3e3,  #fefefe) !important; /* for firefox 3.6+ */
  text-decoration: none;	
	}
.frm_open div.btn img {width:16px; height:16px; float:left; margin:4px 5px;}
/* div.arrow { background:transparent url(bg/images/icons/i_arrow.png) no-repeat scroll 0px -16px; width:16px; height:16px; display:block; padding:0px 0px 0px 20px;} */
div.up { background-position:0px 0px;}
#mask {
    display: none;
    background: #000;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 10;
    width: 100%;
    height: 100%;
    opacity: 0.6;
    z-index: 999;
}
.form_popup {
    display: none;
    background: #fff;
    padding: 10px;
    float: left;
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 99999;
    box-shadow: 0px 0px 20px #999;
    /* CSS3 */
        -moz-box-shadow: 0px 0px 20px #999;
    /* Firefox */
        -webkit-box-shadow: 0px 0px 20px #999;
    /* Safari, Chrome */
	border-radius: 3px 3px 3px 3px;
    -moz-border-radius: 3px;
    /* Firefox */
        -webkit-border-radius: 3px;
    /* Safari, Chrome */;
}
img.btn_close {
		float: right;
/*    margin: -28px -28px 0 0;*/
}


/* DATETIME PICKER */
/*fix size*/
.ui-datepicker {font-size:66%; width: 19em;}
/*fix colored Saturday and Sunday*/
.ui-datepicker-week-end{color:var(--sub_color) ;}
.ui-datepicker-week-end a.ui-state-default  { background-color: 999;}
.ui-datepicker-week-end, .ui-datepicker-week-end a.ui-state-default {color:var(--sub_color);}
/*fix month and year dropdown comboboxes*/
.ui-datepicker select.ui-datepicker-month{width: 59%;}
.ui-datepicker select.ui-datepicker-year{ width: 39%;}
/*fix opacity for other months*/
.ui-priority-secondary, .ui-widget-content .ui-priority-secondary, .ui-widget-header .ui-priority-secondary {opacity: 0.5; font-weight: normal;}
/*fix opacity and style to Today button*/
.ui-datepicker div.ui-datepicker-buttonpane button.ui-datepicker-current {font-weight: bold; opacity: 1; filter:Alpha(Opacity=100);}
/*slyle for arrow*/
.frm_open div.btn { display:block;
	padding:5px 8px 5px 5px;
	margin: 0px 3px;
	font-weight:bold;
  background-color: #fff;
  color: #5B5B5B;
  border: 1px solid #999;
  text-shadow: 0 1px 1px rgba(0, 0, 0, .3);
   
  border-radius: 4px 4px 4px 4px;
  -webkit-border-radius: 4px 4px 4px 4px;
  -moz-border-radius: 4px 4px 4px 4px;

	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#fefefe', endColorstr='#e4e3e3');
	background: -webkit-gradient(linear, left top, left bottom, from(#fefefe), to(#e4e3e3)) !important;
	background: -moz-linear-gradient(top,  #fefefe,  #e4e3e3) !important;
}
.frm_open div.btn:hover {
	cursor:pointer;
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#e4e3e3', endColorstr='#fefefe'); /* for IE */
	background: -webkit-gradient(linear, left top, left bottom, from(#e4e3e3), to(#fefefe)) !important; /* for webkit browsers */
	background: -moz-linear-gradient(top,  #e4e3e3,  #fefefe) !important; /* for firefox 3.6+ */
  text-decoration: none;	
	}
.frm_open div.btn img {width:16px; height:16px; float:left; margin:4px 5px;}
/* div.arrow { background:transparent url(bg/images/icons/i_arrow.png) no-repeat scroll 0px -16px; width:16px; height:16px; display:block; padding:0px 0px 0px 20px;} */
div.up { background-position:0px 0px;}
#mask {
    display: none;
    background: #000;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 10;
    width: 100%;
    height: 100%;
    opacity: 0.6;
    z-index: 999;
}
.form_popup {
    display: none;
    background: #fff;
    padding: 10px;
    float: left;
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 99999;
    box-shadow: 0px 0px 20px #999;
    /* CSS3 */
        -moz-box-shadow: 0px 0px 20px #999;
    /* Firefox */
        -webkit-box-shadow: 0px 0px 20px #999;
    /* Safari, Chrome */
	border-radius: 3px 3px 3px 3px;
    -moz-border-radius: 3px;
    /* Firefox */
        -webkit-border-radius: 3px;
    /* Safari, Chrome */;
}
img.btn_close {
		float: right;
/*    margin: -28px -28px 0 0;*/
}




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





/*-----------FOOTER-------------*/

#footer {
    /* border-top: 1px solid; */
    position: relative;
    border-top-color: var(--border_color);
    font-size: 14px;
    line-height: 22px;
    margin-top: -1px;
}

#footer .widget-wrap {
    background-color: var(--footer_bg);
    background: linear-gradient(180deg, #ffffff 20%, #ecf3f5 100%);
    border-bottom: 1px solid;
    border-bottom-color: var(--border_color);
    color: var(--sub_text);
}
.big-horizontal-card-wrapper + #footer .widget-wrap { /* pagenotfound card in footer */
    /* footer .widget-wrap се стилизира ако непосредствено преди нея има big-horizontal-card */
    padding-top: 3rem;
}

#footer .widget-area {
    padding: 50px 1rem 20px;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-orient: horizontal;
    -moz-box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    -webkit-flex-direction: row;
    flex-direction: row;
}
#footer .column-3 {
    width: 33.33%;
    margin-bottom: 30px;
    padding: 0 30px;
    border-right: 1px solid;
    border-right-color: var(--border_color);
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    -webkit-box-direction: normal;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
}
#footer .column-3:last-child {
    border-right: none;
}

#footer .widget {
    margin-bottom: 30px;
}
#footer .widget-title {
    text-transform: uppercase;
    font-size: 18px;
    line-height: 25px;
    color: var(--title_text);
}
#footer .widget-title a {
    color: var(--title_text);
}
#footer .widget-title:after {
    background-color: var(--title_text);
    content: " ";
    display: block;
    height: 1px;
    margin: 8px 0 auto;
    width: 60px;
    box-sizing: border-box;
}

#footer .widget ul{
    padding: 0;
}
#footer .widget ul li {
    padding: 10px 0px;
    list-style: none;
}
#footer .widget ul li a {
    display: block;
    color: var(--main_text);
}
@media (hover: hover) {
    #footer .widget ul li a:hover {
        color: var(--sub_color3);
    }
}

#footer .widget.widget_links ul li{
    border-bottom: 1px solid;
    border-bottom-color: var(--border_color);
}

#footer .site-info {
    padding: 0px 0px 15px;
    background-color: var(--footer_siteinfo);
    background-color: var(--blue-gray);
    font-size: 14px;
    line-height: 21px;
}
#footer .site-info .copyright {
    float: left;
    padding-top: 15px;
}
#footer .site-info .copyright a {
    color: var(--main_text);
}
@media (hover: hover) {
    #footer .site-info .copyright a:hover {
        color: var(--sub_color);
    }
}

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

/*----------keyframes------------*/
@keyframes slowFadeInRight {
	0% {
		opacity: 0;
		transform: translateX(5%); 
	}
	100% {
		visibility: visible;
		opacity: 1;
		transform: translateX(0%); 
	}
}
@keyframes slowFadeInLeft {
	0% {
		opacity: 0;
		transform: translateX(-5%); 
	}
	100% {
		visibility: visible;
		opacity: 1;
		transform: translateX(0%); 
	}
}
@keyframes fadeInUp {
	0% {
		opacity: 0;
		transform: translate3d(0, 100%, 0);
	}
	100% {
		opacity: 1;
		transform: none;
	}
}
@keyframes fadeInLeft {
	0% {
		opacity: 0;
		transform: translate3d(-100%, 0, 0);
	}
	100% {
		opacity: 1;
		transform: none;
	}
}
@keyframes fadeInRight {
	0% {
		opacity: 0;
		transform: translate3d(100%, 0, 0);
	}
	100% {
		opacity: 1;
		transform: none;
	}
}
@keyframes zoomIn {
    0% {
        opacity: 0;
        transform: scale3d(.3, .3, .3);
    }
    50% {
        opacity: 1;
    }
}

@keyframes zoomInOut {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.3);
    }
    100% {
        transform: scale(1);
    }
}

@keyframes zoomOutIn {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(0.7);
    }
    100% {
        transform: scale(1); 
    }
}

@keyframes zoomCycle {
    0% {
      transform: scale(0);
      opacity: 0;
    }
    25% {
      transform: scale(1);
      opacity: 1;
    }
    75% {
      transform: scale(1);
      opacity: 1;
    }
    100% {
      transform: scale(0);
      opacity: 0;
    }
}

@keyframes circle-container-rotate {
    100% {
        transform: rotate(360deg);
    }
}
@keyframes circle-container-rotate-1 {
    100% {
        transform: rotate(144deg) translate(12.5rem) rotate(-504deg);
    }
}
@keyframes circle-container-rotate-2 {
    100% {
        transform: rotate(216deg) translate(12.5rem) rotate(-576deg);
    }
}
@keyframes circle-container-rotate-3 {
    100% {
        transform: rotate(288deg) translate(12.5rem) rotate(-648deg);
    }
}
@keyframes circle-container-rotate-4 {
    100% {
        transform: rotate(360deg) translate(12.5rem) rotate(-720deg);
    }
}
@keyframes circle-container-rotate-5 {
    100% {
        transform: rotate(432deg) translate(12.5rem) rotate(-792deg);
   }
}
/* @keyframes rotateAround {
    0%   { transform: rotate(0deg) translate(0, -160px) rotate(0deg); }
    100% { transform: rotate(360deg) translate(0, -160px) rotate(-360deg); }
} */


/* attach to class */
.slowFadeInRight {
	animation: 2s slowFadeInRight;
}
.slowFadeInLeft {
	animation: 2s slowFadeInLeft;
}
.fadeInUp {
	animation: 2s fadeInUp;
}
.fadeInLeft {
	animation: 2s fadeInLeft;
}

.fadeInRight {
    animation: 2s fadeInRight;
}
.zoomIn {
    animation: 2s zoomIn;
}

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


@media (min-width: 1921px) {
    .page-header-angle-photo {
        max-width: 1440px;
        margin: 0 auto;
        background-size: 50%;
    }
}

@media only screen and (max-width: 1300px) {
    .container {
        max-width: 970px;
    }
    .four-column-full-width {
        width: 33.33%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        -ms-box-sizing: border-box;
        box-sizing: border-box;
    }
    .download .btn{
        background-position: left 1.1rem top 0.8rem;
    }
}
@media only screen and (max-width: 1023px) {
    #header .header_bar a.nav:first-child {
        display: none;
    }
    .container {
        max-width: 708px;
    }
    .splash-content .splash-title {
        font-size: 220%;
        line-height: 1.2em;
        /* padding-bottom: 2em; */
    }
    .splash-content .splash-text {
        font-size: 130%;
        line-height: 1.2em;
    }
    .splash-content {
        width: 80%;
        margin: 0;
        margin: auto;
        position: static;
    }
    .column {
        margin: 0 5px;
    }
    /* .three-column, .four-column {
        padding: 0 15px 40px;
    } */
    .four-column-full-width {
        width: 50%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        -ms-box-sizing: border-box;
        box-sizing: border-box;
    }

    .dynamic-section .content .body {
        flex-direction: column;
    }

    /* idk container */
    .idk .container .three-containers { 
        flex-direction: column;
    }
    .idk .container .one-container { 
        width: auto;
    }

    /* visual feature */
    .visual-feature {
        flex-direction: column;
    }
    .visual-feature .card {
        width: auto;
    }

    /* round section */
    .end .wrapper .widget {
        width: auto;
    }

    /* Horizontal card */
    .big-horizontal-card-wrapper {
        margin: 1rem 1rem 3rem;
    }
    .big-horizontal-card.intro .content {
        flex-direction: column;
        gap: 1rem;
    }

    /* page-header */
    .logos-circle-wrapper {
        display: none;
    }
    .header-flex .title {
        width: auto;
        padding-left: 0;
    }
    .features {
        margin-top: 5rem;
    }


    .page-header-angle-photo {
        background-size: 60%;
    }

    .roller_bg {
        background-attachment: scroll;
    }
    blockquote {
        margin-left: 0;
        margin-right: 0;
    }
    .download .btn{
        background-image: none;
    }
    #footer .widget-area {
        margin: 0;
        display: block;
    }
    #footer .column-3 {
        border-right: none;
        width: 100%;
        float: none;
        padding: 0;
        display: block;
    }
}

@media only screen and (max-width: 767px) {
    #header .header_bar{
        display: none;
    }
    #header .header_logo {
        width: 60%;
        float: left;
        margin: 0px 0px 0px 20px;
    }   
    #header  #header-logo {
        background-size: 100%;
    }
    #header .menu {
        display: block;
        background-color: rgba(0, 0, 0, 0);
        font-size: 0;
        border: 0 none;
        padding: 0;
        width: 32px;
        float: right;
        margin: 22px 25px 5px 25px;
        cursor: pointer;
    }
    .m_line_1, .m_line_2, .m_line_3 {
        backface-visibility: hidden;
        display: block;
        height: 3px;
        margin: 5px auto;
        -webkit-transition: all 0.3s;
        -moz-transition: all 0.3s;
        -o-transition: all 0.3s;
        transition: all 0.3s;
        width: 100%;
        background-color: var(--main_text);
    }
    #header .menu.show .m_line_1 {
        -moz-transform: rotate(-45deg) translate(-5px, 5px);
        -o-transform: rotate(-45deg) translate(-5px, 5px);
        -webkit-transform: rotate(-45deg) translate(-5px, 5px);
        transform: rotate(-45deg) translate(-5px, 5px);
    }
    #header .menu.show .m_line_2 {
        opacity: 0;
        -moz-opacity: 0;
        filter: alpha(opacity = 0);
    }
    #header .menu.show .m_line_3 {
        -moz-transform: rotate(45deg) translate(-6px, -6px);
        -o-transform: rotate(45deg) translate(-6px, -6px);
        -webkit-transform: rotate(45deg) translate(-6px, -6px);
        transform: rotate(45deg) translate(-6px, -6px);
    }

    #navbar {
        float: none;
        height: 100%;
    }
    #navbar.sticky {
        position: relative !important;
    }
    #header.sticky_padding + .main-splash {
        padding-top: 0px;
    }
    #nav {
        display: none;
    }
    #nav.show {
        display: block;
        overflow: auto;
        height: 93%;
        scrollbar-width: none;
    }
    #navbar > ul > li {
        position: inherit;
        width: 100%;
        border-top: 1px dotted;
        border-top-color: var(--border_color);
        margin-left: 0;
    }
    #navbar > ul > li::before {
        border-right: none;
    }
    #navbar a {
        float: none;
        padding: 10px 0;
        height: inherit;
    }
    #navbar ul li ul {
        top: auto;
        width: 100%;
        left: 40px;
        display: block;
        opacity: 1;
        -moz-opacity: 1;
        filter: alpha(opacity = 100);
        visibility: visible;
        position: static;
        box-shadow: none;
        transition: none;
    }
    #navbar ul li ul li {
        float: none;
        margin: 0;
        position: relative;
        text-align: left;
        width: 100%;
        z-index: 1;
        display: block;
        opacity: 1;
        -moz-opacity: 1;
        filter: alpha(opacity = 100);
        visibility: visible;
        border-top: 1px dotted;
        border-top-color: var(--border_color)
    }
    #navbar ul li ul li::before {
        position: static;
    }
    #navbar ul li ul li a {
        margin-left: 2rem;
    }
    .container {
        max-width: 460px;
    }
    .main-splash .image-splash {
        background-position: center -75px;
    }
    .splash-content .splash-title {
        font-size: 180%;
        line-height: 1.2em;
        /* padding-bottom: 4em; */
    }

    .column { flex-direction: column;}

    .three-column {
        padding: 0 0 30px;
        width: 100%;
    }
    .widget_portfolio .four-column-full-width:first-child {
        padding: 60px 40px;
    }
    .four-column-full-width {
        margin: 0;
        width: 100%;
    }

    .fly-section .background p {
        font-size: 100%;
    }

    .horizontal-cards-container {
        flex-direction: column;   
    }
    .horizontal-cards-container .horizontal-card.ver-1 {
        width: auto;
    }
    .big-content-wrapper,.big-content-wrapper:nth-of-type(odd) {
        flex-direction: column;
    }
    .big-content-wrapper .content-image {
        width: 100%;
        height: 585px;
    }
    .big-content-wrapper .content-text {
        width: 100%; 
    }
    
    .dynamic-section .bar .scrollable-horizontal .tab {
        margin: 0rem 12rem;
    }

    /* Round section */
    .round-section .start:before {
        left: 50%;
    }
    .round-section .end:before {
        right: 0%;
    }

    

    /* ad container */
    .ad-wrapper .ad .ad-container .text {
        width: 100%
    }
    .ad-wrapper .ad .ad-container .img-props {
        display: none;
    }

    .roller_bg {
        padding: 30px 0;
    }
    .quote {
        padding: 10px;
        width: 100%;
    }
    .roller .quote img {
        position: relative;
    }
    .roller .roller-title {
        padding-bottom: 10px;
    }

    .page-header-angle-photo {
        background-size: 75%;
    }

    .page-header {
        padding: 0.5rem;
    }
    .page-title {
        font-size: 1.5rem;
    }

    .page-header-centered {
        flex-direction: column;
    }
    .page-header-centered .right-part {
        margin: 14% 0% 15% 40%;
    }

    .download .btn{
        background-image: url(../images/icons/i_download.png);
        background-position: left 1.8rem top 0.8rem;
    }

}

@media only screen and (max-width: 480px) {
    /* ad container */
    .ad-wrapper .ad {
        padding: 1.5rem;
    }
    .ad-wrapper .ad .ad-container {
        padding: 1.5rem;
    }


    .header-flex .title {
        margin-top: 0;
    }

    .container {
        max-width: 330px;
    }
    .page-header-vertical .page-header-wrapper h1 {
        font-size: 150%;
    }

    .page-header-angle-photo {
        background-size: 90%;
    }

    .page-header-centered .right-part {
        width: 100%;
        margin: 29% 0% 15% 48%;
    }

    .page-header-centered .right-part .btn {
        width: 45%;
    }

    .btn-default {
        padding: 10px 5px;
    }
}