@media only screen and (max-width: 320px){
.section-header h3 {

    font-size: 30px;
    color: #27272f;
    text-transform: uppercase;
    text-align: center;
    font-weight: bold;
    position: relative;
    padding-bottom: 15px;

}
#contact .contact-content .contact-form h3 {

    font-size: 26px;
    color: #1d1e28;
    font-weight: bold;

}
.dola {

    font-size: 36px;
    position: absolute;
    right: 60%;
    top: 10px;

}
}
@media (max-width: 480px){
.add-header {

    float: left;
    text-align: center;

}
.social-header {

    float: right;
    text-align: center!important;

}

.bounceInUp {

    width: 100%!important;

}
#intro .carousel-content {

    text-align: center;
    width: 100%;

}
#features {

    margin-top: 80px;
    margin-bottom: 50px;
    text-align: center;

}
#about {

    padding: 0;
    position: relative;
    background: #f6f6f6;
    text-align: center;

}
.about-1 {

    background: url(https://via.placeholder.com/1000.png/27272f/fff)no-repeat;
        background-position-x: 0%;
        background-position-y: 0%;
        background-size: auto;
    background-position-x: 0%;
    background-position-y: 0%;
    background-size: auto auto;
    background-size: auto auto;
    display: inline-block;
    width: 100%;
    background-position: 0;
    background-size: 100% 100%;

}
.about-1 > .container > .text-about {

    padding-top: 80px;
    padding-bottom: 80px;
    padding-left: 0;
    margin-left: 0;

}
.text-about-detail {

    width: 100%;

}
.text-about-detail h2 {

    font-size: 36px;
    color: #fff;

}
.text-about-detail h4 {

    font-size: 18px;
    color: #fff;

}
.text-about-detail p {

    font-size: 14px;
    color: #fff;

}
.title-bold {

    width: 100%;
    display: inline-block;

}
.work-1 {

    background: url(https://via.placeholder.com/1000.png/0964d3/fff)no-repeat;
        background-position-x: 0%;
        background-position-y: 0%;
        background-size: auto;
    background-position-x: 0%;
    background-position-y: 0%;
    background-size: auto auto;
    background-size: auto auto;
    display: inline-block;
    width: 100%;
    background-position: 100%;
    background-size: 100% 100%;

}
.work-1 > .container > .text-work {

    padding-top: 80px;
    padding-bottom: 80px;
    padding-right: 0;
    width: 100%;
    text-align: center;

}
.text-work-detail h2 {

    font-size: 36px;
    color: #fff;

}
.text-work-detail h4 {

    font-size: 18px;
    color: #fff;

}
.text-work-detail p {

    font-size: 14px;
    color: #fff;

}
.work-1 > .container > .video-work {

    width: 100%;
    float: right;
    position: relative;
    display: inline-block;

}
.view-video {

    position: relative;
    top: auto;
    bottom: 95px;
    margin: 0 auto;
    left: auto;
    right: 0;

}
iframe {

    width: 100%;

}
.title-bold-por {

    width: 100%;
    display: inline-block;
    padding-right: 15px;
    padding-left: 15px;

}
#portfolio #portfolio-flters li {

    cursor: pointer;
    margin: 0;
    display: inline-block;
    padding: 10px;
        padding-right: 10px;
        padding-left: 10px;
    font-size: 12px;
    line-height: 20px;
    color: #666666;
    border-radius: 0;
    text-transform: uppercase;
    background: #fff;
    transition: all 0.3s ease-in-out;
    border-bottom: 2px solid transparent;

}
#portfolio .portfolio-item figure {

    margin-bottom: 15px;

}
#portfolio .portfolio-item {

    position: relative;
    height: auto;
    overflow: hidden;

}
.prices-1 {

    background: #0f06c1;
    width: 100%;
    margin: 0 auto;
    padding-top: 40px;
    padding-bottom: 40px;
    padding-left: 50px;
    padding-right: 50px;
    color: #fff;
    position: relative;
    float: right;
    display: inline-block;
    overflow: hidden;

}
.prices-1 p {

    font-size: 13px;
    line-height: 40px;

}
.prices-1 h2 {

    font-size: 25px;

}
.dola {

    font-size: 36px;
    position: absolute;
    left: 0;
    top: 10px;

}
.prices-2 {

    background: #1d1e28;
    width: 100%;
    margin: 0 auto;
    padding-top: 40px;
    padding-bottom: 40px;
    padding-left: 50px;
    padding-right: 50px;
    color: #fff;
    position: relative;
    float: left;
    display: inline-block;

}
.prices-2 h2 {

    font-size: 25px;

}
.prices-2 p {

    font-size: 13px;
    line-height: 40px;

}
#contact .contact-content {

    position: relative;
    display: inline-block;

}
#contact .contact-form {

    float: left;
    position: relative;
    width: 100%;
    right: 0;
    padding: 30px;
    box-shadow: 0px 0px 10px 10px #ededed;
    -moz-box-shadow: 0px 0px 10px 10px #ededed;
    -webkit-box-shadow: 0px 0px 10px 10px #ededed;
    background: #fafafa;

}
#footer .footer-bottom .credits {

    text-align: center;

}
#footer .footer-bottom .social-links a {

    font-size: 17px;
    display: inline-block;
    background: transparent;
    color: #1d1e28;
    line-height: 40px;
    margin-left: 5px;
    border-radius: 50%;
    text-align: center;
    width: 40px;
    height: 40px;
    transition: 0.3s;
    border: 1px solid #1d1e28;

}
#footer .footer-bottom .copyright {

    text-align: center;
    float: left;
    font-size: 16px;
    color: #1d1e28;
    line-height: 60px;

}
}
@media (max-width: 600px){
#contact {

    padding: 60px 0;
        padding-top: 60px;
    display: inline-block;
    width: 100%;
    padding-top: 0;

}
.add-header {

    float: left;
	text-align: center;

}
.social-header {

    float: right;
	text-align: center!important;


}
#intro .carousel-content {

    text-align: center;
    width: 100%;

}
.title-bold {

    width: 100%;
    display: inline-block;

}
.bounceInUp {

    width: 50%;

}
#features {

    margin-top: 80px;
    margin-bottom: 50px;
    text-align: center;

}
#about {

    padding: 0;
    position: relative;
    background: #f6f6f6;
    text-align: center;

}

.about-1 .container {

    position: relative;
    z-index: 10;

}
.about-1::before {

    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(255, 255, 255, 0.8);
    z-index: 9;

}
.about-1 {

    background: url("../img/about-bg.jpg")no-repeat;
        background-position-x: 0%;
        background-position-y: 0%;
        background-size: auto;
    background-position-x: 0%;
    background-position-y: 0%;
    background-size: auto auto;
    background-size: auto auto;
    display: inline-block;
    width: 100%;
    background-position: 0;
    background-size: 100% 100%;

}

.about-1 > .container > .text-about {

    padding-top: 80px;
    padding-bottom: 80px;
    padding-left: 0;
    margin-left: 0;

}
.text-about-detail {

    width: 100%;

}
.text-about-detail h2 {

    font-size: 36px!important;

}
.text-about-detail h4 {

    font-size: 18px!important;

}
.text-about-detail p {

    font-size: 14px!important;

}
.title-bold {

    width: 100%;
    display: inline-block;

}
.work-1 {

    background: url("../img/work-bg.jpg")no-repeat;
        background-position-x: 0%;
        background-position-y: 0%;
        background-size: auto;
    background-position-x: 0%;
    background-position-y: 0%;
    background-size: auto auto;
    background-size: auto auto;
    display: inline-block;
    width: 100%;
    background-position: 100%;
    background-size: 100% 100%;

}
.work-1 .container {

    position: relative;
    z-index: 10;

}
.work-1::before {

    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(255, 255, 255, 0.8);
    z-index: 9;

}
.work-1 > .container > .text-work {

    padding-top: 80px;
    padding-bottom: 80px;
    padding-right: 0;
    width: 100%;
    text-align: center;

}
.text-work-detail h2 {

    font-size: 36px!important;

}
.text-work-detail h4 {

    font-size: 18px!important;

}
.text-work-detail p {

    font-size: 14px!important;

}
.work-1 > .container > .video-work {

    width: 100%;
    float: right;
    position: relative;
    display: inline-block;

}
.view-video {

    position: relative !important;
    top: auto;
    bottom: 95px;
    margin: 0 auto;
    left: auto !important;
    right: 0;

}
iframe {

    width: 100%;

}
.title-bold-por {

    width: 100%;
    display: inline-block;
    padding-right: 15px;
    padding-left: 15px;

}
#portfolio #portfolio-flters li {

    cursor: pointer;
    margin: 0;
    display: inline-block;
    padding: 10px;
        padding-right: 10px;
        padding-left: 10px;
    font-size: 12px;
    line-height: 20px;
    color: #666666;
    border-radius: 0;
    text-transform: uppercase;
    background: #fff;
    transition: all 0.3s ease-in-out;
    border-bottom: 2px solid transparent;

}
#portfolio .portfolio-item figure {

    margin-bottom: 15px;

}
#portfolio .portfolio-item {

    position: relative;
    height: auto;
    overflow: hidden;

}
.prices-1 {
    background: #0f06c1;
    width: 100%;
    margin: 0 auto;
    padding-top: 40px;
    padding-bottom: 40px;
    padding-left: 50px;
    padding-right: 50px;
    color: #fff;
    position: relative;
    float: right;
    display: inline-block;
    overflow: hidden;
}
.dola {

    font-size: 36px;
    position: absolute;
    left: 0;
    top: 10px;

}
.prices-1 h2 {

    font-size: 20px;

}
.prices-1 p {

    font-size: 10px;
    position: relative;
    margin: 0;
    line-height: 40px;
    display: inline-block;
    width: 100%;

}
.button-prices-1 {

    color: #fff;
    border: 1px solid #fff;
    padding: 10px 20px;
    background: transparent;
    margin-bottom: 20px;
    position: relative;
    display: inline-block;
    margin-top: 20px;
    font-size: 10px;

}
.prices-2 {
    background: #1d1e28;
    width: 100%;
    margin: 0 auto;
    padding-top: 40px;
    padding-bottom: 40px;
    padding-left: 50px;
    padding-right: 50px;
    color: #fff;
    position: relative;
    float: right;
    display: inline-block;
    overflow: hidden;
}
.dola {

    font-size: 36px;
    position: absolute;
    left: 0;
    top: 10px;

}
.prices-2 h2 {

    font-size: 20px;

}
.prices-2 p {

    font-size: 10px;
    position: relative;
    margin: 0;
    line-height: 40px;
    display: inline-block;
    width: 100%;

}
.button-prices-2 {

    color: #fff;
    border: 1px solid #0f06c1;
    padding: 10px 20px;
    background: #0f06c1;
    display: inline-block;
    margin-top: 20px;
    margin-bottom: 20px;
    font-size: 10px;

}
#contact .contact-content {

    position: relative;
    display: inline-block;

}
#contact .contact-form {

    float: left;
    position: relative;
    width: 100%;
    right: 0;
    padding: 30px;
    box-shadow: 0px 0px 10px 10px #ededed;
    -moz-box-shadow: 0px 0px 10px 10px #ededed;
    -webkit-box-shadow: 0px 0px 10px 10px #ededed;
    background: #fafafa;

}
#footer .footer-bottom .credits {

    text-align: center;

}
#footer .footer-bottom .social-links a {

    font-size: 17px;
    display: inline-block;
    background: transparent;
    color: #1d1e28;
    line-height: 40px;
    margin-left: 5px;
    border-radius: 50%;
    text-align: center;
    width: 40px;
    height: 40px;
    transition: 0.3s;
    border: 1px solid #1d1e28;

}
#footer .footer-bottom .copyright {

    text-align: center;
    float: left;
    font-size: 16px;
    color: #1d1e28;
    line-height: 60px;

}
}
@media (max-width: 767px){
.title-bold-por {

    width: 80%;
    display: inline-block;

}

.menu-button {

    display: block;

}
.add-header {

    float: left;

}
.social-header {

    text-align: right;
    line-height: 40px;

}
#intro .carousel-content {

    text-align: center;
    width: 100%;

}
.title-bold {

    width: 100%;
    display: inline-block;

}
.bounceInUp {

    width: 50%;

}
#features {

    margin-top: 80px;
    margin-bottom: 50px;
    text-align: center;

}

#portfolio #portfolio-flters li {

    cursor: pointer;
    margin: 0;
    display: inline-block;
    padding: 10px;
        padding-right: 10px;
        padding-left: 10px;
    font-size: 12px;
    line-height: 20px;
    color: #666666;
    border-radius: 0;
    text-transform: uppercase;
    background: #fff;
    transition: all 0.3s ease-in-out;
    border-bottom: 2px solid transparent;

}

#portfolio .portfolio-item {

    position: relative;
    height: auto;
    overflow: hidden;

}
.text-about-detail h2 {

    font-size: 25px;
    color: #27272f;

}
.text-about-detail h4 {

    font-size: 15px;
    color: #27272f;

}
.text-about-detail p {

    font-size: 10px;
    color: #27272f;

}
.text-work-detail h2 {

    font-size: 25px;
    color: #27272f;

}
.text-work-detail h4 {

    font-size: 15px;
    color: #27272f;

}
.text-work-detail p {

    font-size: 10px;
    color: #27272f;

}
.view-video {

    position: absolute;
    top: auto;
    bottom: 95px;
    margin: 0 auto;
    left: 50px;
    right: 0;

}
iframe {

    width: 100%;

}
.prices-1 {
    background: #0f06c1;
    width: 100%;
    margin: 0 auto;
    padding-top: 40px;
    padding-bottom: 40px;
    padding-left: 50px;
    padding-right: 50px;
    color: #fff;
    position: relative;
    float: right;
    display: inline-block;
    overflow: hidden;
}
.dola {

    font-size: 36px;
    position: absolute;
    left: -20px;
    top: 10px;

}
.prices-1 h2 {

    font-size: 20px;

}
.prices-1 p {

    font-size: 10px;
    position: relative;
    margin: 0;
    line-height: 40px;
    display: inline-block;
    width: 100%;

}
.button-prices-1 {

    color: #fff;
    border: 1px solid #fff;
    padding: 10px 20px;
    background: transparent;
    margin-bottom: 20px;
    position: relative;
    display: inline-block;
    margin-top: 20px;
    font-size: 10px;

}
.prices-2 {
    background: #1d1e28;
    width: 100%;
    margin: 0 auto;
    padding-top: 40px;
    padding-bottom: 40px;
    padding-left: 50px;
    padding-right: 50px;
    color: #fff;
    position: relative;
    float: right;
    display: inline-block;
    overflow: hidden;
}

.prices-2 h2 {

    font-size: 20px;

}
.prices-2 p {

    font-size: 10px;
    position: relative;
    margin: 0;
    line-height: 40px;
    display: inline-block;
    width: 100%;

}
.button-prices-2 {

    color: #fff;
    border: 1px solid #0f06c1;
    padding: 10px 20px;
    background: #0f06c1;
    display: inline-block;
    margin-top: 20px;
    margin-bottom: 20px;
    font-size: 10px;

}

#contact .contact-content {

    position: relative;
    display: inline-block;

}
#contact .contact-form {

    float: left;
    position: relative;
    width: 100%;
    right: 0;
    padding: 30px;
    box-shadow: 0px 0px 10px 10px #ededed;
    -moz-box-shadow: 0px 0px 10px 10px #ededed;
    -webkit-box-shadow: 0px 0px 10px 10px #ededed;
    background: #fafafa;

}
#footer .footer-bottom .social-links a {

    font-size: 17px;
    display: inline-block;
    background: transparent;
    color: #1d1e28;
    line-height: 40px;
    margin-left: 5px;
    border-radius: 50%;
    text-align: center;
    width: 40px;
    height: 40px;
    transition: 0.3s;
    border: 1px solid #1d1e28;

}
}
@media (min-width: 768px) and (max-width: 979px){
.menu-button {

    display: block;

}
#nav-menu-container {

    display:none;

}
.social-header {

    text-align: right;
    line-height: 40px;

}
#intro .carousel-content {

    text-align: center;
    width: 100%;

}
.title-bold {

    width: 100%;
    display: inline-block;

}
#portfolio #portfolio-flters li {

    cursor: pointer;
    margin: 0;
    display: inline-block;
    padding: 10px;
        padding-right: 10px;
        padding-left: 10px;
    font-size: 12px;
    line-height: 20px;
    color: #666666;
    border-radius: 0;
    text-transform: uppercase;
    background: #fff;
    transition: all 0.3s ease-in-out;
    border-bottom: 2px solid transparent;

}
#portfolio .portfolio-item figure {

    margin-bottom: 15px;

}
#portfolio .portfolio-item {

    position: relative;
    height: auto;
    overflow: hidden;

}
.dola {

    font-size: 36px;
    position: absolute;
    left: 40px;
    top: 10px;

}
.prices-1 h2 {

    font-size: 32px;

}
.prices-2 h2 {

    font-size: 32px;

}
.prices-1 {

    width: 100%;

}
.prices-2 {

    width: 100%;

}
.blog-col h4 a {

    color: #27272f;
    font-size: 14px;

}
#contact .contact-content .contact-form h3 {

    font-size: 28px;
    color: #1d1e28;
    font-weight: bold;

}
#header #logo h1 {

    font-size: 18px;
    line-height: 0;
    font-family: "Poppins", sans-serif;
    font-weight: 700;
    letter-spacing: 3px;

}
}
@media (min-width: 980px) and (max-width: 1023px){
.container {

    max-width: 900px;

}
.nav-menu > li {

    margin-left: 0;

}
.nav-menu li:hover > a, .nav-menu > .menu-active > a {

    color: #083fd7;
    padding-top: 20px;
    padding-bottom: 20px;
    border-left: 5px solid #083fd7;
    padding-left: 10px;
    padding-right: 10px;

}
.nav-menu a {

    padding-top: 20px;
    padding-bottom: 20px;
    text-decoration: none;
    display: inline-block;
    color: #000;
    font-family: "Poppins", sans-serif;
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    outline: none;
    border-left: 5px solid transparent;
    line-height: normal;
    padding-right: 10px;
    padding-left: 10px;

}
#intro .carousel-content {

    text-align: center;
    width: 100%;

}
.title-bold {

    width: 100%;
    display: inline-block;

}
#portfolio #portfolio-flters li {

    cursor: pointer;
    margin: 0;
    display: inline-block;
    padding: 10px;
        padding-right: 10px;
        padding-left: 10px;
    font-size: 12px;
    line-height: 20px;
    color: #666666;
    border-radius: 0;
    text-transform: uppercase;
    background: #fff;
    transition: all 0.3s ease-in-out;
    border-bottom: 2px solid transparent;

}
#portfolio .portfolio-item figure {

    margin-bottom: 15px;

}
#portfolio .portfolio-item {

    position: relative;
    height: auto;
    overflow: hidden;

}
.dola {

    font-size: 36px;
    position: absolute;
    left: 40px;
    top: 10px;

}
.prices-1 h2 {

    font-size: 32px;

}
.prices-2 h2 {

    font-size: 32px;

}
.prices-1 {

    width: 100%;

}
.prices-2 {

    width: 100%;

}
.blog-col h4 a {

    color: #27272f;
    font-size: 14px;

}
#contact .contact-content .contact-form h3 {

    font-size: 28px;
    color: #1d1e28;
    font-weight: bold;

}
#header #logo h1 {

    font-size: 18px;
    line-height: 0;
    font-family: "Poppins", sans-serif;
    font-weight: 700;
    letter-spacing: 3px;

}
}
@media (min-width: 1024px) and (max-width: 1200px){
#intro .carousel-content {

    text-align: center;
    width: 100%;

}
#portfolio #portfolio-flters li {

    cursor: pointer;
    margin: 0;
    display: inline-block;
    padding: 10px;
        padding-right: 10px;
        padding-left: 10px;
    font-size: 12px;
    line-height: 20px;
    color: #666666;
    border-radius: 0;
    text-transform: uppercase;
    background: #fff;
    transition: all 0.3s ease-in-out;
    border-bottom: 2px solid transparent;

}
#portfolio .portfolio-item figure {

    margin-bottom: 15px;

}
#portfolio .portfolio-item {

    position: relative;
    height: auto;
    overflow: hidden;

}
}