html, body {font-family: 'Roboto', sans-serif; font-size: 16px; font-weight: 300; color: #666666; position: relative;}
h1, h2, h3, h4, h5, h6 {font-family: 'Barlow', sans-serif; font-weight: 600; color: #595959;}

a {color: #00a8ff;transition: color 0.3s;}
a:hover, a:focus {color: #0065a1;  text-decoration: none;}
.btn {padding: 20px 40px; border-radius: 36px; font-family: 'Barlow', sans-serif; font-size: 16px; font-weight: 600; position: relative;}
.btn.btn-primary {background: #00a8ff; color: #fff !important; border: none;}
.btn.btn-primary:hover, .btn.btn-primary:focus {background: #0065a1;}
.btn.btn-secondary {padding: 16px 36px; background: #f9ce1a; border: 2px solid #fff; color: #fff;}
.btn.btn-secondary:hover, .btn.btn-secondary:focus {background: #fff; color: #f9ce1a;}
.btn.btn-tertiary {padding: 16px 36px; background: #018ef8; border: none; color: #fff;}
.btn.btn-tertiary:hover, .btn.btn-tertiary:focus {background: #fff; color: #018ef8;}

.wrapper {width: 1920px; max-width: 100%; min-height: 100vh; margin: auto; overflow: hidden; position: relative;}
.wrapper:after {content: ''; background-color: rgba(36,36,36,0.8); position: fixed; top: 0; bottom: 0; left: 0;  right: 0; opacity: 0; visibility: hidden; transition: visibility 0.3s, opacity 0.3s; z-index: 1;}
.wrapper.no-scroll {max-height: 100vh;}
.wrapper.no-scroll:after {visibility: visible; opacity: 1;}

.fixed-alerts {padding: 0 15px; position: fixed; top: 70px; left: 0; right: 0; z-index: 99;}
.fixed-alerts .alert {margin: 10px 0 0;}

.clearfix:after {content: ''; display: table; clear: both;}

.content-container {width: 1330px; max-width: 100%; padding: 0 90px; margin: auto;}

.m-0 {margin: 0;}
.mt-0 {margin-top: 0;}
.mb-0 {margin-bottom: 0;}
.ml-0 {margin-left: 0;}
.mr-0 {margin-right: 0;}
.m-30 {margin: 30px;}
.mt-30 {margin-top: 30px;}
.mb-30 {margin-bottom: 30px;}
.ml-30 {margin-left: 30px;}
.mr-30 {margin-right: 30px;}
.m-60 {margin: 60px;}
.mt-60 {margin-top: 60px;}
.mb-60 {margin-bottom: 60px;}
.ml-60 {margin-left: 60px;}
.mr-60 {margin-right: 60px;}

.section-title {font-size: 72px; color: #f9ce1a; line-height: 1; letter-spacing: -0.05em;}

strong {font-weight: 500 !important;}
.font-barlow {font-family: 'Barlow', sans-serif;}
.font-21 {font-size: 21px;}
.font-24 {font-size: 24px;}
.font-30 {font-size: 30px;}
.color-dark-grey {color: #595959;}
.color-purple {color: #87398d;}
.color-blue {color: #53b5ff;}
.line-height-1-1 {line-height: 1.1;}
.text-condensed {letter-spacing: -0.05em;}

.header, .main, .footer {padding-left: 80px; padding-right: 80px;}

/*header*/
.header {background: #fff; position: fixed; top: 0; left: 0; right: 0; z-index: 10; box-shadow: 0 0 0 transparent; transition: box-shadow 0.3s;}
.header:before {content: ''; display: block; width: 50%; background: #672785; position: absolute; top: 0; bottom: 0; right: 0; z-index: -1;}
.header .logo {display: block; float: left; padding: 16px 0 16px 20px; transition: padding 0.3s;}
.header .logo img {width: 151px; transition: width 0.3s;}
.header-contact {float: right; margin-top: 0; padding: 15px 40px 15px 30px; font-family: 'Barlow', sans-serif; font-size: 17px; font-weight: normal; color: #a373ba; line-height: 25px; position: relative; transition: margin-top 0.3s; background: url('../images/header-contact-phone.png') no-repeat left center;}
.header-contact .number {font-weight: 500; color: #fff;}

.main-menu {float: right; clear: right; width: 50%; padding-right: 15px;}
.main-menu:before {content: ''; display: block; height: 1px; margin-left: 60px; background: #ebebeb; opacity: 0.1;}
.main-menu .nav {float: right;}
.main-menu .nav-link {font-family: 'Barlow', sans-serif; padding: 0 20px; font-size: 18px; font-weight: 500; color: #fff; line-height: 80px; transition: line-height 0.3s, color 0.3s;}
.main-menu .nav-link.active, .main-menu .nav-link:hover, .main-menu .nav-link:focus {color: #f9ce1a;}

.menu-mobile {display: none; width: 46px; height: 46px; float: right; margin: 12px 0 12px 10px; padding: 7px 8px; border: 2px solid #fff; border-radius: 3px; text-align: center; cursor: pointer;}
.menu-mobile span{float: none; display: block; background-color: #fff; width: 100%; height: 4px; margin: 4px auto;}

/*main content*/
.main {padding-top: 135px;}
.main:before {content: ''; display: block; width: 50%; height: 600px; background: #672785; position: absolute; top: 0; right: 0; z-index: -1;}

/*main slider*/
.main-slider-container {position: relative;}
.main-slider {background: #fff;}
.main-slider .slide-image {display: block !important; background-repeat: no-repeat; background-size: cover; background-position: center center;}
.main-slider .slide-image:before {content: ''; display: block; padding-top: 615px;}
.main-slider-nav {display: flex; width: 50%; float: right; background: #fff;}
.main-slider-progress {height: 80px; position: relative; flex-grow: 1;}
.main-slider-progress:before {content: ''; display: block; height: 2px; background: #eaeaea; position: absolute; top: 50%; left: 0; right: 0; transform: translate(0,-50%);}
.main-slider-progress > div {height: 2px; background: #f9ce1a; position: absolute; top: 50%; left: 0; transform: translate(0,-50%);}
.main-slider-nav .slick-arrow {display: block; width: 140px; height: 80px; background: #fff; font-size: 40px; font-weight: 300; color: #383838; position: relative; transition: background 0.3s, color 0.3s; cursor: pointer;}
.main-slider-nav .slick-arrow i {display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);}
.main-slider-nav .slick-arrow:hover, .main-slider-nav .slick-arrow:focus {color: #fff; background: #f9ce1a;}
.main-slider-text {width: 585px; max-width: 50%; padding: 100px 90px; background: #f9ce1a; position: absolute; bottom: 0; right: 50%;}
.main-slider-text h1 {margin: 0 0 20px; font-size: 83px; font-weight: bold; color: #fff; line-height: 75px; letter-spacing: -0.05em;}
.main-slider-text p {font-family: 'Barlow', sans-serif; font-size: 30px; font-weight: 500; color: #fff; line-height: 1.1; letter-spacing: -0.05em;}
.main-slider-text .btn {margin-top: 30px;}

/*introduction*/
.introduction-container {position: relative;}
.introduction-container .content-left {width: 585px; max-width: 50%; padding: 120px 90px 540px 90px; background: url('../images/bg/bg-intro-content-left.jpg'), #f7f6f1; background-repeat: no-repeat; background-size: 100%; background-position: bottom center; position: absolute; top: 0; right: 50%;}
.introduction-container .content-left h2 {margin: 0 0 20px; font-size: 75px; font-weight: bold; color: #f9ce1a; line-height: 75px;}
.introduction-container .content-left p {font-family: 'Barlow', sans-serif; font-size: 30px; font-weight: 500; color: #f9ce1a; line-height: 1.1;}
.introduction-container .content-right {width: 640px; max-width: 50%; margin-left: 50%; padding: 120px 0 120px 160px;}

/*about us*/
.about-us-container {display: flex;}
.about-us-container > div {width: 50%; padding: 270px 0 240px;}
.about-us-container .content-left {background: #f5f5f5;}
.about-us-container .content-left > div {float: right; width: 670px; max-width: 100%; padding: 0 90px;}
.about-us-container .content-right {background: url('../images/bg/bg-about-us-content-right.png'), #f9ce1a; background-repeat: no-repeat; background-size: 100%; background-position: bottom right; position: relative; overflow: hidden;}
/*
.about-us-container .content-right .bg-cross {display: block; max-height: 90%; position: absolute; top: 50%; right: 0; transform: translate(50%,-50%);}
*/
.about-us-container .content-right .bg-cross {display: block; max-width: calc(100% - 425px); max-height: 90%; position: absolute; top: 50%; right: 0; transform: translate(50%,-50%);}
.about-us-container .content-right > div {width: 670px; max-width: 100%; padding: 0 90px;position: relative; z-index: 1;}
.about-us-container .content-right .section-title {color: #fff;}
.about-us-container .content-right p {color: #fff;}

/*clients*/
.clients-container {background: #672785; padding: 120px 0; position: relative;}
.clients-container:before {content: ''; display: block; width: 660px; background: url('../images/bg/bg-clients-left.png') #672785; background-repeat: no-repeat; background-position: bottom left; position: absolute; top: 0; bottom: -185px; left: 0;}
.clients-container-bottom {height: 370px; background: url('../images/bg/bg-clients-bottom.jpg') no-repeat center bottom; background-size: cover;}
.clients-container .content-container {position: relative; z-index: 1;}
.clients-container .section-title {color: #fff;}
/*
.clients {display: flex; align-items: center; justify-content: space-between;}
.client {margin-bottom: 30px;}
.client a {display: inline-block; position: relative;}
.client img {display: block; max-width: 100%; transition: opacity 0.3s;}
.client .mono {opacity: 1;}
.client .color {position: absolute; top: 0; left: 0; opacity: 0;}
.client a:hover .mono, .client a:focus .mono {opacity: 0;}
.client a:hover .color, .client a:focus .color {opacity: 1;}
*/

/*
.clients {display: flex; align-items: center; justify-content: space-between; margin: 0 -15px;}
.clients:after {content: none;}
.client {padding: 0 15px;}
.client a {display: inline-block; position: relative;}
.client img {display: block; max-width: 100%; transition: opacity 0.3s;}
.client .mono {opacity: 1;}
.client .color {position: absolute; top: 0; left: 0; opacity: 0;}
.client a:hover .mono, .client a:focus .mono {opacity: 0;}
.client a:hover .color, .client a:focus .color {opacity: 1;}
*/
.clients-container .section-title {margin-bottom: 60px;}
.clients-slider {margin: 0 -15px;}
.clients-slider .slick-track {display: flex; align-items: center;}
.client {padding: 0 15px; text-align: center;}
.client a {display: inline-block; position: relative;}
.client img {display: block; max-width: 100%; transition: opacity 0.3s;}
.client .mono {opacity: 1;}
.client .color {position: absolute; top: 0; left: 0; opacity: 0;}
.client a:hover .mono, .client a:focus .mono {opacity: 0;}
.client a:hover .color, .client a:focus .color {opacity: 1;}

/*perks*/
.perks-container {padding: 160px 0 130px;}
.perks-container .row > div {display: flex; margin-bottom: 30px;}
.perks-intro {max-width: 370px;}
.perk {max-width: 100%; position: relative;}
.perk:before {content: ''; display: block; border: 1px solid #ededed; position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: -1;}
/*.perk img {display: block; width: 100%;}*/
.perk-image {background-repeat: no-repeat; background-size: cover; background-position: center center;}
.perk-image:before {content: ''; display: block; padding-top: 98%;}
.perk h3 {display: flex; -ms-flex: 1; align-items: center; min-height: 70px; padding: 10px 40px 10px 30px; margin: 0; background: #00a8ff; background: linear-gradient(to right, #1fb5fa, #018ad8); font-size: 20px; color: #fff; position: relative;}
.perk h3:before {content: ''; display: block; border: 15px solid; border-color: #f9ce1a #fff #fff #f9ce1a; position: absolute; bottom: 0; right: 0;}
.perk h3:after {content: ''; display: block; width: 1px; height: 30px; background: #ededed; position: absolute; bottom: 0; right: 0;}
.perk h3 span {width: 100%; -ms-flex: 1;}
.perk-description {padding: 30px; font-size: 14px;}
.perk-description p:last-child {margin-bottom: 0;}

/*modules*/
.modules-container {position: relative;}
.modules-container:after {content: ''; display: block; width: 760px; max-width: 50%; background: url('../images/bg/bg-modules.jpg') no-repeat center center; background-size: cover; position: absolute; top: 0; bottom: 80px; right: -90px; z-index: -1;}
.modules-container .section-title {margin-bottom: 30px;}
.modules-intro {width: 460px; max-width: 100%;}
.modules-intro p:last-child {margin-bottom: 0;}
.modules {display: flex; padding-bottom: 80px; position: relative;}
.modules:after {content: ''; display: block; width: 100vw; background: #f5f5f5; position: absolute; top: 0; bottom: 0; left: 50%; transform: translate(-50%,0); z-index: -1;}
.modules-nav {min-width: 300px; padding: 80px 0;}
.modules-nav .nav {display: block;}
.modules-nav .nav-link {display: flex; align-items: center; min-height: 130px; padding-left: 30px; font-family: 'Barlow', sans-serif; font-size: 21px; font-weight: 500; color: #666666; line-height: 1; letter-spacing: -0.05em; background: transparent; transition: background 0.3s, color 0.3s}
.modules-nav .nav-link .arrow {display: block; width: 28px; height: 12px; margin-top: 10px; text-align: right; position: relative;}
.modules-nav .nav-link .arrow:before {content: ''; display: block; width: 28px; height: 12px; background: url('../images/arrow.png') no-repeat center right; background-size: contain; position: absolute; top: 0; left: 0; opacity: 0; transition: opacity 0.3s;}
.modules-nav .nav-link .arrow:after {content: ''; display: block; width: 28px; height: 12px; background: url('../images/line.png') no-repeat center right; background-size: contain; display: block; position: absolute; top: 0; left: 0;}
.modules-nav .nav-link.active {background: #672785; color: #fff;}
.modules-nav .nav-link:not(.active):hover, .modules-nav .nav-link:not(.active):focus {background: rgba(103,39,133,0.6); color: #fff;}
.modules-nav .nav-link.active .arrow:before,
.modules-nav .nav-link:hover .arrow:before,
.modules-nav .nav-link.modules-nav .nav-link:focus .arrow:before
{opacity: 1;}
.modules-content {flex-grow: 1; padding: 90px 90px 60px 150px; background: #672785;}
.module-description {margin-bottom: 30px; font-size: 14px; color: #fff;}
.module-icon {width: 58px; height: 58px; margin: 0 auto 30px 5px; border-radius: 50%; background-repeat: repeat; background-position: center center; background-size: cover; font-family: 'Barlow', sans-serif; font-size: 22px; font-weight: 500; line-height: 58px; text-align: center; text-shadow: 0 1px 3px rgba(0,0,0,0.2); position: relative;}
.module-icon:before {content: '.'; opacity: 0;}
.module-icon:after {content: ''; display: block; width: 75px; height: 75px; border: 1px solid #f9ce1a; border-radius: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);}
.module-description h3 {margin-bottom: 20px; font-family: 'Roboto', sans-serif; font-size: 16px; font-weight: 500; color: #fff;}
.modules-slider-nav {width: 300px; position: absolute; bottom: 80px; left: 0;}
.modules-slider-nav .module-arrow {display: block; float: left; width: 50%; height: 80px; background: #f5f5f5; font-size: 40px; font-weight: 300; color: #383838; line-height: 1.1; position: relative; transition: background 0.3s, color 0.3s; cursor: pointer;}
.modules-slider-nav .module-arrow i {display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);}
.modules-slider-nav .module-arrow:hover, .modules-slider-nav .module-arrow:focus {color: #fff; background: #f9ce1a;}

/*TrigoCMS!*/
.trigo-container {margin: 0 -80px 60px; background: url('../images/bg/bg-trigo-right.png') #111773; background-repeat: no-repeat; background-position: top right; color: #b5bbe0; position: relative;}
.trigo-container:before {content: ''; display: block; width: 50%; background: url('../images/bg/bg-trigo-left.jpg') no-repeat center center; background-size: cover; position: absolute; top: 0; bottom: 0; left: 0;}
.trigo-content {width: 670px; max-width: 50%; margin-left: 50%; padding: 160px 80px 100px;}
.trigo-container .section-title {margin-bottom: 15px; font-size: 55px; color: #fff;}
.trigo-features {display: flex; position: relative; z-index: 1;}
.trigo-features .feature {float: left; width: 25%; padding: 200px 80px 80px; position: relative;}
.trigo-features .feature-img { position:  absolute; top: 130px; left: 80px; transform: translate(0,-100%); max-width: calc(100% - 160px);}
.trigo-features .feature h3 {font-size: 21px; font-weight: 500; color: #fff; margin-bottom: 30px;}
.trigo-features .trigocms {padding-left: 150px; font-size: 30px; font-weight: 500; color: #fff;}
.trigo-features .trigocms .feature-img {top: 175px;}
.trigo-features .feature-1 {background: #16298e;}
.trigo-features .feature-2 {background: #018ef8; color: #fff;}
.trigo-features .feature-3 {background: #16298e;}

.trigo-features .feature-1 .feature-img.feature-img-alt {display: none;}

/*references*/
.references-container {position: relative;}
.references-intro .section-title {margin-bottom: 60px; font-size: 36px; color: #fff;}
.references-intro {height: 615px; background: url('../images/bg/bg-references.jpg') no-repeat center center; background-size: cover; position: relative;}
.references-intro .content-left {width: 585px; max-width: 50%; padding: 90px; background: #f9ce1a; color: #fff; position: absolute; top: 110px; bottom: -80px; right: 50%; z-index: 1;}
.references-intro .content-left .btn {margin-top: 30px;}
.references-intro .content-right {width: 640px; max-width: 50%; margin-left: 50%; padding: 200px 0 120px 160px; color: #fff;}
.references-slider {background: #f5f5f5; position: relative;}
.reference {display: block !important; position: relative;}
/*
.reference-image {width: 970px; max-width: 50%; background-repeat: no-repeat; background-position: center center; background-size: cover; position: absolute; top: 0; bottom: 0; right: 0;}
.reference-description {float: right; width: 585px; max-width: 50%; padding: 160px 90px; margin-right: 50%; background: #fff; min-height: 500px;}
*/
.reference-image {float: right; width: 970px; max-width: 50%; background-repeat: no-repeat; background-position: center center; background-size: cover;}
.reference-image:after {content: ''; display: block; padding-top: 75.25%;}
.reference-description {width: 585px; max-width: 50%; padding: 160px 90px; background: #fff; position: absolute; top: 0; bottom: 0; right: 50%;}
.reference-description h3 {margin: 0 0 30px; font-size: 30px; color: #666666;}
.reference-link {font-family: 'Barlow', sans-serif; font-size: 21px; font-weight: 500;}
.reference-content {margin: 60px 0 0 ; padding-top: 75px; background: url('../images/icon-quote.png') no-repeat top left;}
.references-slider-nav {width: 585px; max-width: 50%; position: absolute; bottom: 0; right: 50%;}
.references-slider-nav .slick-arrow {display: block; float: left; width: 140px; height: 80px; background: #f5f5f5; font-size: 40px; font-weight: 300; color: #383838; line-height: 1.1; position: relative; transition: background 0.3s, color 0.3s; cursor: pointer;}
.references-slider-nav .slick-arrow i {display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);}
.references-slider-nav .slick-arrow:hover, .references-slider-nav .slick-arrow:focus {color: #fff; background: #f9ce1a;}

/*portfolio*/
.portfolio-container {padding: 60px 0 0;}
.portfolio {}
.portfolio-container .section-title {margin-bottom: 60px;}
/*
.portfolio-item {display: block; float: left; width: 25%; background-repeat: no-repeat; background-position: center center; background-size: cover; position: relative;}
*/
.portfolio-item {display: block; background-repeat: no-repeat; background-position: center center; background-size: cover; position: relative; margin-bottom: 30px;}
.portfolio-item:before {content: ''; display: block; padding-top: 75%;}
.portfolio-item:after {content: ''; display: block; background: #f9ce1a; position: absolute; top: 0; bottom: 0; left: 0; right: 0; opacity: 0; transition: opacity 0.3s;}
.portfolio-item:hover:after, .portfolio-item:focus:after {opacity: 0.85;}
.portfiolio-item-description {padding: 30px; color: #fff; position: absolute; bottom: 0; left: 0; right: 0; z-index: 1; opacity: 0; transition: opacity 0.3s;}
.portfolio-item:hover .portfiolio-item-description, .portfolio-item:focus .portfiolio-item-description {opacity: 1;}
.portfolio-item-name {font-family: 'Barlow', sans-serif; font-size: 30px; font-weight: 500; color: #fff; line-height: 1.1; letter-spacing: -0.05em;}
.portfolio-item-name:after {content: ''; display: block; width: 40px; height: 2px; background: #fff; margin-top: 15px;}
.portfolio-see-online {display: inline-block; margin-top: 30px; padding-right: 20px; font-family: 'Barlow', sans-serif; font-size: 18px; font-weight: 600; color: #fff; line-height: 1.1; letter-spacing: -0.05em; position: relative;}
.portfolio-see-online:after {content: '\f125'; display: block; font-family: 'ionicons'; font-size: 12px; position: absolute; top: 50%; right: 0; transform: translate(0,-50%);}

/*partners*/
.partners-container {padding: 60px 0; border-top: 1px solid #ededed; border-bottom: 1px solid #ededed; position: relative; z-index: 1;}
.partners-container .row {align-items: center;}

/*footer*/
.footer {margin-top: 30px; padding: 90px 90px 0; background: url('../images/bg/bg-footer.jpg') no-repeat center bottom; background-size: cover; color: #fff; position: relative;}
.footer .bg-cross {display: block; max-width: 50%; position: absolute; top: 0; right: 0; transform: translate(50%, -39%);}
.footer .content-container {position: realtive; z-index: 1;}
.footer-middle {position: relative; z-index: 2;}
.footer-middle:before {content: ''; display: block; width: 100vw; height: 1px; background: rgba(255,255,255,0.3); position: absolute; top: 0; left: 50%; transform: translate(-50%,0);}
.footer-middle .content-container {position: relative;}
.footer-middle .content-container:before {content: ''; display: block; width: 50vw; height: 50vh; background: #f5f5f5; position: absolute; top: 0; left: 250px; transform: translate(-100%,0); z-index: -1;}
.footer .logo {width: 116px; float: left; margin-top: 20px;}
.footer .logo-xs {width: 79px; height: 50px; float: left; padding: 5px 10px 0; margin-left: -30px; background: #f5f5f5;}
.footer-menu {float: right;}
.footer-menu .nav-item {padding: 30px 0;}
.footer-menu .nav-link {padding: 8px 20px; font-family: 'Barlow', sans-serif; font-weight: 500; color: #fff;}
.footer-menu .nav-item:last-child .nav-link {padding-right: 0;}
.footer-menu .nav-link.active, .footer-menu .nav-link:hover, .footer-menu .nav-link:focus {color: #018ef8;}
.footer-bottom {text-align: right; position: relative; z-index: 1;}
.footer-bottom:before {content: ''; display: block; width: 100vw; background: #fff; position: absolute; top: 0; bottom: 0; left: 50%; transform: translate(-50%,0); z-index: -1;}
.copyrights {display: inline-block; font-size: 11px; font-weight: normal; color: #4b4b4d !important; line-height: 50px; padding-right: 100px; background: url('../images/logo-mediaessence.png') no-repeat 99% center; opacity: 0.3; transition: opacity 0.3s;}
.copyrights:hover, .copyright:focus {opacity: 0.8;}

.contact {font-family: 'Barlow', sans-serif; font-weight: 500; line-height: 1.1; letter-spacing: -0.05em; position: relative;}
.contact-left {float: left; position: relative; z-index: 1;}
.contact-right {float: right; position: relative; z-index: 1;}
.contact-portrait {position: absolute; top: -30px; left: 45%; transform: translate(-50%, 0);}
.contact .section-title {margin-bottom: 50px; color: #fff;}
.contact-name {margin-bottom: 30px; font-size: 30px;}
.contact-name span {font-size: 16px; opacity: 0.9;}
.contact-address {padding-left: 30px; background: url('../images/contact/icon-location.png') no-repeat top left; font-size: 18px; }
.contact-phone {margin: 0; padding: 26px 0 26px 40px; border-top: 1px solid rgba(255,255,255,0.3); background: url('../images/contact/icon-phone.png') no-repeat center left; font-size: 24px; }
.contact-email {margin: 0; padding: 26px 0 26px 40px; border-top: 1px solid rgba(255,255,255,0.3); background: url('../images/contact/icon-email.png') no-repeat center left; font-size: 24px; }

.contact-form {margin: 60px auto;}
.contact-form .row {margin-left: -7px; margin-right: -7px;}
.contact-form .row > div {padding-left: 7px; padding-right: 7px;}
.form-group {margin-bottom: 14px;}
.form-control {padding: 19px; height: auto; font-family: 'Roboto', sans-serif; font-size: 14px; font-weight: 300; color: #666666; line-height: 15px; border: 1px solid transparent; border-radius: 3px; box-shadow: 0 1px 3px rgba(0,0,0,0.1);}
textarea.form-control {min-height: 193px;}
.form-control.is-invalid {border-color: 0 1px 3px rgb(220,53,69);}
.form-control::placeholder {color: #999999 !important;}
.form-control::-webkit-input-placeholder {color: #999999 !important;}
.form-control::-moz-placeholder {color: #999999 !important;}
.form-control::-ms-input-placeholder {color: #999999 !important;}
.checkbox {cursor: pointer;}
.checkbox input {display: none;}
.checkbox span {display: inline-block; padding-left: 25px; font-size: 10px; font-weight: normal; text-shadow: 0 1px 3px rgba(0,0,0,0.3); position: relative;}
.checkbox span:before {content: ''; display: block; width: 15px; height: 15px; border: 1px solid transparent; border-radius: 3px; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,0.1); position: absolute; top: 0; left: 0;}
.checkbox.is-invalid span:before {border-color: rgb(220,53,69);}
.checkbox span:after {content: '\f122'; display: none; width: 15px; height: 15px; font-family: 'ionicons'; font-size: 14px; color: #666666; line-height: 15px; text-shadow: none; text-align: center; position: absolute; top: 0; left: 0;}
.checkbox input:checked + span:after {display: block;}
.btn-submit {min-width: 150px;}
.contact-form.submit .btn-submit {background: #dddddd !important; cursor: default;}
.captcha-container {float: left;}
label.is-invalid + .invalid-feedback, .g-recaptcha.is-invalid + .invalid-feedback {display: block;}
.g-recaptcha.is-invalid + .invalid-feedback {text-align: left;}

.to-top {width: 45px; height: 45px; background: #672785; text-align: center; position: fixed; bottom: 15px; right: 15px; z-index: 2; opacity: 0; visibility: hidden; transition: opacity 0.3s, visibility 0.3s; cursor: pointer;}
.scrolled .to-top {opacity: 0.6; visibility: visible;}
.to-top:before {content: '\f3d8'; font-family: 'ionicons'; font-size: 36px; color: #fff; line-height: 45px;}
.to-top:hover, .to-top:focus {opacity: 1;}

@media only screen and (min-width: 768px) {
    .scrolled .header {box-shadow: 0 1px 3px rgba(0,0,0,0.2);}
    .scrolled .header .logo {padding-top: 6px; padding-bottom: 6px;}
    .scrolled .header .logo img {width: 88px;}
    .scrolled .header-contact {margin-top: -55px;}
    .scrolled .main-menu .nav-link {line-height: 70px;}
}

@media only screen and (min-width: 1100px) {
    .main-slider-nav {width: calc(50% + 90px);}
    .main-slider-text {max-width: calc(50% - 90px); right: calc(50% + 90px);}

    .introduction-container .content-left {max-width: calc(50% - 90px); right: calc(50% + 90px);}
    .introduction-container .content-right {max-width: calc(50% + 90px); margin-left: calc(50% - 90px);}

    .references-intro .content-left {max-width: calc(50% - 90px); right: calc(50% + 90px);}
    .references-intro .content-right {max-width: calc(50% + 90px); margin-left: calc(50% - 90px);}

    /*
    .reference-description {max-width: calc(50% - 90px); margin-right: calc(50% + 90px);}
    */
    .reference-description {max-width: calc(50% - 90px); right: calc(50% + 90px);}
    .reference-image {max-width: calc(50% + 90px);}
    .references-slider-nav {max-width: calc(50% - 90px); right: calc(50% + 90px);}
}

@media only screen and (max-width: 1740px) {
    .trigo-features .trigocms {padding-left: 80px;}
}

@media only screen and (max-width: 1700px) {
    .trigo-container {background: #111773;}
}

@media only screen and (max-width: 1560px) {
    .about-us-container > div {width: 50%; padding: 160px 0 60px;}

    .portfiolio-item-description {padding: 30px;}
    .portfolio-item-name {font-size: 26px;}
}

@media only screen and (max-width: 1500px) {
    .about-us-container .content-right .bg-cross {max-width: 180px;}

    .perk h3 {padding: 10px 30px 10px 25px;}
    .perk h3:before {border-width: 12px;}
    .perk h3:after {height: 24px;}

    .trigo-features .trigocms {font-size: 21px;}

    .portfolio-item-name {font-size: 24px;}
    .portfolio-see-online {margin-top: 15px;}
}

@media only screen and (max-width: 1480px) {
    .references-intro .section-title {margin-bottom: 30px;}
    .references-intro .content-left .btn {margin-top: 15px;}
}

@media only screen and (max-width: 1410px) {
    .introduction-container .content-left {padding: 60px 60px 60px 90px; bottom: 0;}

    .about-us-container > div {width: 50%; padding: 60px 0;}

    .modules-container:after {background-position: -60px center;}
}

@media only screen and (max-width: 1367px) {
    .section-title {font-size: 60px;}

    .header, .main, .footer {padding-left: 40px; padding-right: 40px;}
    .content-container {padding: 0 60px;}

    .main:before {min-height: 605px;}

    .main-slider .slide-image {min-height: 390px;}
    .main-slider .slide-image:before {content: ''; display: block; padding-top: 0;}
    .main-slider-text {padding: 60px 60px;}
    .main-slider-text h1 {font-size: 75px; line-height: 70px;}

    .introduction-container .content-left {padding: 60px 60px 560px 60px;}
    .introduction-container .content-left h2 {font-size: 60px; line-height: 55px;}
    .introduction-container .content-left p {font-family: 'Barlow', sans-serif; font-size: 30px; font-weight: 500; color: #f9ce1a; line-height: 1.1;}
    .introduction-container .content-right {padding: 60px 0 60px 60px;}
    .about-us-container .content-right .bg-cross {display: none;}

    .about-us-container .content-left > div {padding: 0 60px;}
    .about-us-container .content-right > div {padding: 0 60px;}

    .clients-container {padding: 60px 0;}
    .clients-container:before {display: none;}

    .perks-container {padding: 60px 0 30px;}

    .modules-content {padding: 60px 60px 30px;}

    .trigo-container {margin: 0 -40px 60px;}
    .trigo-content {padding: 60px 40px;}
    .trigo-features .feature {padding: 140px 40px 40px;}
    .trigo-features .feature-img {top: 110px; left: 40px; max-width: calc(100% - 80px);}
    .trigo-features .trigocms {padding-left: 40px;}
    .trigo-features .trigocms .feature-img {top: 110px;}

    .references-intro {height: auto;}
    .references-intro .content-left {padding: 60px; top: 90px;}
    .references-intro .content-right {padding: 150px 30px 60px 90px;}
    .references-intro .section-title {margin-bottom: 15px;}
    .references-intro .content-left .btn {margin-top: 0;}
    .reference-description {padding: 140px 60px;}

    .portfolio-item-name {font-size: 24px;}
    .portfolio-see-online {margin-top: 15px;}
}

@media only screen and (max-width: 1367px) and (orientation:landscape) {
    .main-slider .slide-image:before {content: ''; display: block; padding-top: 100vh; padding-top: calc(100vh - 215px);}
    .main:before {height: 100vh;}

    .portfiolio-item-description {padding: 15px;}
}

@media only screen and (max-width: 1280px) {
    .references-intro .section-title {font-size: 33px;}
}

@media only screen and (max-width: 1199px) {
    .main-menu .nav-link {padding: 0 14px;}

    .main-slider-text h1 {font-size: 60px; line-height: 55px;}

    .perks-container .row > div {display: flex; margin-bottom: 30px;}
    .perks-intro {max-width: 100%;}
}

@media only screen and (max-width: 1164px) {
    .header, .main, .footer {padding-left: 30px; padding-right:30px;}
    .content-container {padding: 0;}

    .clients-container .content-container {padding: 0 60px;}

    .trigo-container {margin: 0 -30px 60px;}
    .trigo-content {padding: 60px 30px;}
    .trigo-features .feature {padding: 140px 30px 30px;}
    .trigo-features .feature-img {top: 110px; left: 30px; max-width: calc(100% - 60px);}
    .trigo-features .trigocms {padding-left: 30px;}
    .trigo-features .trigocms .feature-img {top: 110px;}

    .references-intro {display: flex;}
    .references-intro .content-left {position: static; margin-top: 60px;  padding-left: 30px; padding-right: 30px; width: 50%; float: left;}
    .references-intro .content-right {padding: 120px 30px 60px 30px; margin: 0; float: right;}
    .references-intro .content-left p:last-child, .references-intro .content-right p:last-child {margin-bottom: 0;}
    .reference-description {padding: 60px 30px 110px;}
    .reference-content {margin: 30px 0 0 ; padding-top: 60px;}
    .references-slider-nav {width: 585px; max-width: 50%; position: absolute; bottom: 0; right: 50%; padding-left: 30px;}
    .references-slider-nav .slick-arrow {width: 80px;}

    /*
    .portfolio-item {width: 33.333333%;}
    */

    .footer .logo {margin-left: 115px; transform: translate(-50%,0);}
}

@media only screen and (max-width: 1100px) {
    .references-intro .section-title {font-size: 36px;}
}

@media only screen and (max-width: 991px) {
    .font-md-18 {font-size: 18px;}
    .section-title {font-size: 50px; margin-bottom: 30px;}
    .trigo-container .section-title {font-size: 50px;}

    .header:before {width: 66.666666%;}
    .main-menu {width: 66.666666%;}

    .main:before {width: 66.666666%;}

    .main-slider-container {margin: 0 -30px;}
    .main-slider-nav .slick-arrow {width: 80px;}
    .main-slider-text {padding: 60px 30px;}
    .main-slider-text h1 {font-size: 50px; line-height: 1.1;}
    .main-slider-text p {font-size: 20px;}

    .introduction-container {margin: 0 -30px;}
    .introduction-container .content-left {padding-left: 30px; padding-right: 30px;}
    .introduction-container .content-left h2 {font-size: 50px; line-height: 1.1;}
    .introduction-container .content-left p {font-size: 20px;}
    .introduction-container .content-right {padding: 60px 30px;}

    .about-us-container {margin: 0 -30px;}
    .about-us-container .content-left > div {padding: 0 30px;}
    .about-us-container .content-right > div {padding: 0 30px;}

    .clients-container:before {display: none;}
    .clients-container {margin: 0 -30px;}
    .clients-container .content-container {padding: 0 30px;}
    .clients-container-bottom {margin: 0 -30px;}

    .perks-intro-container {margin-bottom: 60px !important;}
    .perks-intro p:last-child {margin-bottom: 0;}
    .perk-description {padding: 30px 15px;}

    .modules-container:after {content: none;}
    .modules-container .section-title {margin-bottom: 10px;}
    .modules-intro {width: auto;}
    .modules-content {padding: 60px 30px 30px;}
    .modules {display: flex; padding-bottom: 0; margin: 0 -30px; position: relative;}
    .modules-nav {min-width: 270px; width: 270px; padding: 90px 0;}
    .modules-nav .nav {display: block;}
    .modules-nav .nav-link {min-height: 90px;}
    .modules-slider-nav {width: 270px; bottom: 0;}

    .trigo-container {margin-bottom: 0;}
    .trigo-features {flex-wrap: wrap;}
    .trigo-features .feature {width: 50%;}
    .trigo-features .feature-img {top: 110px; left: 30px; max-width: calc(100% - 60px);}
    .trigo-features .trigocms {padding-left: 30px;}
    .trigo-features .trigocms .feature-img {top: 110px;}
    .trigo-features .feature-1 {background: #018ef8; color: #fff;}
    .trigo-features .feature-1 .feature-img {display: none;}
    .trigo-features .feature-1 .feature-img.feature-img-alt {display: block;}

    .references-container {margin: 0 -30px;}
    /*
    .references-intro {display: flex;}
    .references-intro .content-left {position: static; margin-top: 60px;  padding-left: 30px; padding-right: 30px; width: 50%; float: left;}
    .references-intro .content-right {padding: 120px 30px 60px 30px; margin: 0; float: right;}
    .references-intro .content-left p:last-child, .references-intro .content-right p:last-child {margin-bottom: 0;}
    .reference-description {padding: 60px 30px 110px;}
    .reference-content {margin: 30px 0 0 ; padding-top: 60px;}
    .references-slider-nav {width: 585px; max-width: 50%; position: absolute; bottom: 0; right: 50%; padding-left: 30px;}
    .references-slider-nav .slick-arrow {width: 80px;}
    */

    .portfiolio-item-description {padding: 20px;}
    .portfolio-item-name {font-size: 24px;}
    .portfolio-item-name:after {margin-top: 10px;}
    .portfolio-see-online {margin-top: 10px;}

    .contact-form {margin: 30px auto;}
    .contact-portrait {transform: none; position: static; float: left; width: 24%; padding-right: 30px;}
    .contact-left {width: 38%; float: left; padding-right: 15px;}
    .contact-right {width: 38%; float: left; padding-left: 15px;}
    .contact .section-title {margin-bottom: 30px;}
    .contact-name {margin-bottom: 15px; font-size: 30px;}
    .contact-name span {font-size: 16px; opacity: 0.9;}
    .contact-address {padding-left: 30px; background: url('../images/contact/icon-location.png') no-repeat top left; font-size: 18px; }
    .contact-phone {margin: 0; padding: 10px 0 10px 40px; font-size: 18px; border: none;}
    .contact-email {margin: 0; padding: 10px 0 10px 40px; font-size: 18px; border: none;}

    .footer {padding-top: 30px;}
    .footer .bg-cross {display: none;}
}

@media only screen and (max-width: 890px) {
    .contact-portrait {width: 22%; padding-right: 15px;}
    .contact-left {width: 39%;}
    .contact-right {width: 39%;}

    .portfolio-item-name {font-size: 22px;}
}

@media only screen and (max-width: 820px) {
    .contact-portrait {display: none;}
    .contact-left {width: 50%;}
    .contact-right {width: 50%;}

    .references-intro .section-title {font-size: 30px;}
    .reference-description h3 {margin: 0 0 15px; font-size: 26px;}

    /*
    .portfolio-item {width: 50%;}
    */
    .portfiolio-item-name {font-size: 20px;}
    .portfolio-item-name:after {margin-top: 5px;}
    .portfolio-see-online {margin-top: 5px;}
}

@media only screen and (max-width: 767px) {
    .fixed-alerts {top: 0;}

    .section-title {font-size: 46px;}
    .trigo-container .section-title {font-size: 46px;}

    .header {position: relative; top: auto; left: auto; right: auto; padding: 0 10px;}
    .header .logo {display: block; float: left; padding: 10px 0 10px 10px; margin-left: -10px;}
    .header .logo img {width: 73px;}

    .header-contact {padding: 0 20px 0 30px; line-height: 70px;}

    .menu-mobile {display: block;}

    .main-menu {float: none; width: auto; min-width: 320px; height: calc(100vh - 70px); padding: 15px 0; background: #fff; position: absolute; top: 100%; left: 0; transform: translate(-100%, 0); transition: transform 0.3s; overflow: auto;}
    .main-menu.active {transform: translate(0,0);}
    .main-menu:before {content: none;}
    .main-menu .nav {float: none; display: block;}
    .main-menu .nav-link {color: #666666; font-size: 22px; line-height: 1; padding: 9px 16px;}
    .main-menu .nav-link.active, .main-menu .nav-link:hover, .main-menu .nav-link:focus {color: #f9ce1a;}

    .main {padding-top: 0;}
    .main:before {content: none;}

    .main-slider-container .main-slider {position: absolute; top: 0; bottom: 45px; left: 0; right: 0;}
    .main-slider-container .main-slider .slick-list {position: absolute; top: 0; bottom: 0; left: 0; right: 0;}
    .main-slider-container .main-slider .slick-track {position: absolute; top: 0; bottom: 0; left: 0;}
    .main-slider .slide-image:before {content: none;}
    .main-slider .slide-image {position: absolute; top: 0; bottom: 0; left: 0; right: 0;}
    .main-slider .slide-image.slide-1 { background-position: right center;}
    .main-slider .slide-image.slide-2 { background-position: right center;}
    .main-slider .slide-image.slide-3 { background-position: right center;}
    .main-slider-nav {width: 100%;}
    
    .main-slider-progress {height: 45px;}
    .main-slider-nav .slick-arrow {width: 45px; height: 45px;}
    .main-slider-nav .slick-arrow i {font-size: 36px; line-height: 45px;}
    /*.main-slider-text {width: 100%; max-width: none; padding: 30px; background: rgba(249,206,26,0.6); top: 0; bottom: 45px; left: 0; right: 0;}*/
    .main-slider-text {width: 100%; max-width: none; padding: 60px 30px; background: rgba(249,206,26,0.6); position: relative; top: auto; left: auto; right: auto;}
    .main-slider-text h1 {font-size: 40px; line-height: 1;}
    .main-slider-text p {font-size: 21px;}
    .main-slider-text .btn {margin-top: 0;}

    .introduction-container .content-left {width: auto; max-width: none; padding: 60px 30px; margin: 0; background: #f7f6f1; position: static;}
    .introduction-container .content-right {width: auto; max-width: none; margin-left: 0; padding: 60px 30px;}

    .about-us-container {display: block;}
    .about-us-container > div {width: auto; padding: 60px 30px;}
    .about-us-container .content-left > div {float: none; width: auto; padding: 0;}
    .about-us-container .content-right > div {width: auto; padding: 0;}
    .about-us-container .content-right:before {content: none;}

    .clients-container {padding: 60px 30px; margin: 0 -30px;}
    .clients-container .content-container {padding: 0;}
    .clients-container-bottom {display: none;}

    .modules-content {padding: 60px 30px 30px;}
    .modules {display: block; margin: 0 -30px; padding-bottom: 0;}
    .modules-nav {min-width: 0; width: auto; padding: 25px 25px;}
    .modules-nav .nav-item {width: 50%; float: left; padding: 5px;}
    .modules-nav .nav-link {height: 60px; min-height: 0; padding: 8px 16px 11px; text-align: center; border: 2px solid #672785; border-radius: 3px;}

    .modules-nav .nav-link > span {display: block; flex-grow: 1;}
    .modules-nav .nav-link .arrow {display: none;}
    .modules-content {padding: 60px 30px 90px;}
    .modules-slider-nav {width: 120px;}
    .modules-slider-nav .module-arrow {height: 60px;}

    .trigo-container {margin-bottom: 0;}
    .trigo-container:before {content: none;}
    .trigo-content {width: auto; max-width: none; margin-left: 0;}
    .feature.trigocms {padding: 30px; display: flex; align-items: center;}
    .feature.trigocms .feature-img {position: static; transform: none; margin-bottom: 30px;}

    .references-intro {display: block; margin: 0; padding: 60px 30px;}
    .references-intro .content-left {width: auto; max-width: none; padding: 0; margin: 0; background: transparent; position: static; float: none;}
    .references-intro .content-right {width: auto; max-width: none; margin-left: 0; padding: 0; float: none;}
    .references-slider {margin: 0;}
    /*
    .reference-description {padding: 60px 30px; float: none; width: auto; max-width: none; margin: 0; background: rgba(255,255,255,0.8); color: #383838; position: relative; z-index: 1; min-height: 300px;}
    .reference-image {width: auto; max-width: none; position: absolute; top: 0; bottom: 0; left: 0; right: 0;}
    */
    .reference-description {display: flex; align-items: center; padding: 60px 30px; width: auto; max-width: none; background: rgba(255,255,255,0.8); color: #383838; left: 0; right: 0; z-index: 1; text-align: center;}
    .reference-description > div {flex-grow: 1;}
    .reference-description h3 {margin: 0 0 30px; font-size: 30px;}
    .reference-image {float: none; width: auto; max-width: none;}
    .references-slider-nav .slick-arrow {width: 60px; height: 60px;}
    .references-slider-nav {width: auto; max-width: none; left: 0; right: auto;}

    .portfiolio-item-description {padding: 15px;}
    .portfolio-item-name:after {margin-top: 10px;}
    .portfolio-see-online {margin-top: 10px;}

    .partner {margin-bottom: 30px;}

    .footer-middle .content-container:before {left: 150px;}
    .footer-menu .nav-link {padding: 8px 10px;}
    .footer-menu .nav-item:last-child .nav-link {padding-right: 0;}
    .footer-menu .nav-link.active, .footer-menu .nav-link:hover, .footer-menu .nav-link:focus {color: #018ef8;}
    .footer-bottom {text-align: right; position: relative; z-index: 1;}
    .footer-bottom:before {content: ''; display: block; width: 100vw; background: #fff; position: absolute; top: 0; bottom: 0; left: 50%; transform: translate(-50%,0); z-index: -1;}
    .copyrights {display: inline-block; font-size: 11px; font-weight: normal; color: #4b4b4d !important; line-height: 50px; padding-right: 100px; background: url('../images/logo-mediaessence.png') no-repeat 99% center; opacity: 0.3; transition: opacity 0.3s;}
    .copyrights:hover, .copyrights:focus {opacity: 0.8;}

    .footer .logo {margin-left: 0; transform: none;}
}

@media only screen and (max-width: 680px) {
    .footer .no-br-xs br {content: '';}
    .footer .no-br-xs br:after {content: ' ';}
    .contact-left {float: none; width: auto; padding: 0;}
    .contact-right {float: none; width: auto; padding: 0;}
    .contact-address {padding-left: 40px;}
}

@media only screen and (max-width: 575px) {
    .no-br-xs br {content: '';}
    .no-br-xs br:after {content: ' ';}
    .header-contact .text {display: none;}

    .m-xs-0 {margin: 0;}
    .mt-xs-0 {margin-top: 0;}
    .mb-xs-0 {margin-bottom: 0;}
    .ml-xs-0 {margin-left: 0;}
    .mr-xs-0 {margin-right: 0;}
    .m-xs-30 {margin: 30px;}
    .mt-xs-30 {margin-top: 30px;}
    .mb-xs-30 {margin-bottom: 30px;}
    .ml-xs-30 {margin-left: 30px;}
    .mr-xs-30 {margin-right: 30px;}

    .main:before {content: none;}

    .main-slider .slide-image.slide-1 { background-position: 80% center;}
    .main-slider .slide-image.slide-2 { background-position: 80% center;}
    .main-slider .slide-image.slide-3 { background-position: 70% center;}

    .module-description {text-align: center;}
    .module-icon {margin: 0 auto 30px;}

    .trigo-features {display: block;}
    .trigo-features .feature {float: none; width: auto; padding: 60px 30px;}
    .trigo-features .feature-img {position: static; transform: none; margin-bottom: 30px;} 
    .feature.trigocms {padding-top: 0 !important;}
    .feature.trigocms .feature-img {width: 200px;}
    .trigo-features .feature-1 {background: #16298e; color: inherit;}
    .trigo-features .feature-1 .feature-img {display: block;}
    .trigo-features .feature-1 .feature-img.feature-img-alt {display: none;}

    .reference-description {padding: 60px 30px;}

    /*
    .portfolio-container {margin: 0 -30px; padding: 0;}
    */
    .portfiolio-item-description {}
    .portfolio-item-name {font-size: 18px;}
    .portfolio-see-online {font-size: 14px;}

    /*.footer {margin-top: 0;}*/
    .footer .logo {display: none;}
    .footer-middle .content-container:before {content: none;}
    .footer-menu {float: none; text-align: center;}
    .footer-menu .nav {display: block;}
    .footer-menu .nav-item {display: inline-block; padding: 0;}
    .footer-menu .nav-link {padding: 10px 5px !important;}
    .footer-bottom {margin: 0 -5px;}

    .contact-address {margin-bottom: 30px;}
    .btn-submit {width: 150px; display: block; margin: 15px auto 0;}
    .captcha-container {float: none; display: inline-block;}
    .g-recaptcha.is-invalid + .invalid-feedback {text-align: center;}

    .to-top {width: 40px; height: 40px; bottom: 10px; right: 10px;}
    .to-top:before {font-size: 30px; color: #fff; line-height: 40px;}
}

@media only screen and (max-width: 480px) {
    .perks-container .row {display: block;}
    .perks-container .row > div {width: 100%; max-width: 100%;}
    .perk-image:before {padding-top: 50%;}

    /*
    .portfolio-container {padding: 0; margin: 0 -30px;}
    */

    /*side margins 15px*/
    .main, .footer {padding-left: 15px; padding-right: 15px;}

    .main-slider-container {margin: 0 -15px;}
    .main-slider-text {padding: 30px 15px;}

    .introduction-container {margin: 0 -15px;}
    .introduction-container .content-left {padding: 60px 15px;}
    .introduction-container .content-right {padding: 60px 15px;}

    .about-us-container {margin: 0 -15px;}
    .about-us-container > div {padding: 60px 15px;}

    .clients-container {margin: 0 -15px; padding: 60px 15px;}

    .modules {margin: 0 -15px;}
    .modules-nav {padding: 25px 10px;}
    .modules-content {padding: 60px 15px 90px;}

    .trigo-container {margin: 0 -15px;}
    .trigo-content {padding: 60px 15px;}
    .trigo-features .feature {padding: 60px 15px;}

    .references-container {margin: 0 -15px;}
    .references-intro {padding: 60px 15px;}
    .reference-description {padding: 60px 15px;}
    .references-slider-nav {padding-left: 15px;}
    /*
    .portfolio-container {margin: 0 -15px;}
    */
    .portfolio.row > div {width: 100% !important; max-width: none; flex-basis: 100%;}
    .portfiolio-item-description {padding: 30px;}
    .portfolio-item-name {font-size: 24px;}
    .portfolio-see-online {font-size: 16px;}

    .footer .logo-xs {margin-left: -15px;}
}

@media only screen and (max-width: 400px) {
    .header:before {width: 215px;}
    .header-contact {padding-right: 0;}

    .main-menu {width: 100%;}

    .clients {display: block;}
    .client {width: auto; float: none;}

    .modules-nav .nav-item {width: auto; float: none;}

    .reference-description h3 {margin: 0 0 15px; font-size: 26px;}

    .captcha-container {margin: 0 -30px;}
}

@media only screen and (max-width: 360px) {

    .header:before {width: 210px;}
    .header-contact {padding-left: 25px;}

    .reference-description h3 {margin: 0 0 10px; font-size: 22px;}

    .contact-address, .contact-phone, .contact-email {font-size: 16px;}
    .copyrights {padding-right: 90px;}
}