/*icon section*/
        .flex-container {
             padding: 30px 30px 15px 60px;
        }
        .flex-container {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: start;
            -ms-flex-pack: start;
            justify-content: flex-start;
            -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        }
        .key-sets {
            width: 25%;
        }
        .key-sets .contents {
            position: relative;
            padding: 0 0 40px 60px;
        }
        .key-sets .contents i {
            position: absolute;
            left: 0;
            top: 8px;
            width: 40px;
        }
        .main-icon-box{
            padding: 45px 0 0;
            /*border-radius: 10px;*/
            /*box-shadow: 0 0 5px rgba(6, 83, 116, 0.14);*/
        }
        .contents p {
            font-size: 14px;
        }
        .contents h4 {
            font-size: 20px;
            padding-bottom: 5px;
            font-weight: 500;
        }
        @media screen and (max-width: 767px){
            .key-sets {
                width: 100%;
            }
            .flex-container {
                padding: 30px 0 0 0;
            }
            .key-sets .contents {
                padding: 0 0 40px 60px;
            }
            .main-icon-box {
                padding: 30px 45px 0;
            }
        }
        @media screen and (min-width: 768px) and (max-width: 900px){
            .flex-container {
                padding: 30px 0 15px 0;
            }
        }    
        /*icon section ends*/

        /*popup and form section*/
            .call-to-action-section a:active {
            color: #fff !important;
        }
        .call-to-action-section a:focus {
            color: #fff !important;
        }
        .popup-form-sec input, textarea{
            color: rgb(0, 0, 0);
            background-color: rgb(255, 255, 255);
            font-family: "Open Sans", sans-serif;
            font-weight: 400;
            font-style: normal;
            font-size: 16px;
            text-align: left;
            border-width: 1px;
            border-color: rgb(204, 204, 204);
            border-style: solid;
            border-radius: 0px;
            box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px inset;
            text-shadow: rgba(0, 0, 0, 0) 0px 0px 0px;
            padding: 0px 14px;
            margin: 0px;
            display: block;
            width: 100%;
            /*max-height: 52px;*/
            height: 52px;
            transition: none 0s ease 0s;
            margin-bottom: 20px;
        }
        .popup-form-sec textarea{
            height: 70px !important;
            margin-bottom: 20px;
            font-weight: 400;
            color:#000;
            font-size: 16px !important;
            padding-top: 10px;
        }
        .popup-form-sec textarea:hover{
            border: 1px solid #ccc!important;
        }
        .popup-form-sec textarea::placeholder {
            font-weight: 400;
            color: #757575;
            padding: 10px 0;
        }
        .popup-form-sec .btn{
            width: 100%;
        }
        .popup-form-sec .btn.active{
            background: #ea5b36;
        }
        .popup-form-sec span.error {
            font-size: 14px;
        }
        .popup-form-sec div#status, .popup-form-sec div#status2, .popup-form-sec div#status3, .popup-form-sec div#status4, .popup-form-sec div#status5 {
            text-align: center;
            padding: 0 10px 20px 10px;
            font-size: 20px;
            font-weight: 600;
        }
        .modal-title{
            margin: 0 20px !important;
            padding-top: 25px;
            text-align: center;
            color: #e86865;
            font-weight: 600;
        }
        .modal-body form{0 !important;}
        .intl-tel-input input{padding-left: 50px !important;}
        .intl-tel-input {margin-bottom: 20px !important;}
        .intl-tel-input .flag-container{height: 50px !important;}
        .iti-mobile .intl-tel-input.iti-container {
            top: 285px !important;
            bottom: 30px;
            left: 56px !important;
            right: 56px !important;
        }
        .main-box-flex {
            display: flex;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
            flex-wrap: wrap;
            margin:5% 0 0;
        }
        .main-block {
            margin: 0 15px;
            max-width: 350px;
            min-width: 350px;
            padding:0;
            margin-bottom: 5%;
        }
        
        .main-block ul li{
            font-size: 14px;
        }
        .top-banner{
            background-size: cover;
            background-repeat: no-repeat;
            height: 250px;
            position: relative;
            border-radius: 0 25px 0 25px;
            overflow: hidden;
        }
        .main-block:hover{
            -webkit-transform: translateY(-10px);
            -moz-transform: translateY(-10px);
            -ms-transform: translateY(-10px);
            transform: translateY(-10px);
            transition: 0.2s;
        }
        /*.main-block .top-banner::before {
            background: #0000008f;
            position: absolute;
            content: "";
            background-size: cover;
            width: 100%;
            height: 100%;
            transition: 0.2s;
        }*/
        .top-banner .corner-btn {
            position: absolute;
            top: 26px;
            right: -40px;
            transform: rotate(45deg);
            padding: 5px 40px;
            color: #fff;
            pointer-events: none;
            cursor: default;
            z-index: 1;
        }

        .title-sec {
            position: absolute;
            bottom: 0px;
            transition: 0.3s;
            background: #191919de;
            width: 100%;
            padding: 0 10px 13px 22px;
        }
        /*.top-banner:hover .title-sec {
            left: 30px !important;
        }*/
        .title-sec p {
            font-size: 20px !important;
            color: #fff!important;
            margin: 0 0 5px 0;
        }
        .title-sec .dwn-btn {
            padding: 0px 5px;
            font-size: 10px !important;
        }
        .title-sec .dwn-btn:focus {
            color: #fff !important;
        }

        .title-sec .dwn-btn:active {
            color: #fff !important;
        }

        @media screen and (max-width: 768px){
            .main-box-flex {
                flex-wrap: wrap;
            }
            .main-block {
                max-width: 300px;
                min-width: 300px;
            }
            .call-to-action-section .bannerbtn {
                font-size: 10px !important;
            }
             .main-block:hover{
                transform: translateY(0px) !important;
            }
        }
        @media screen and (min-width: 1441px){
            .main-box-flex {
                margin:5% 12% 0 !important;
            }
        }


        /*box iconstyles*/
        .big-box{
            position: relative;
        }
        .box2 {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            justify-content: center;
            -webkit-box-align: start;
            -ms-flex-align: start;
            align-items: flex-start;
            -ms-flex-wrap: wrap;
            flex-wrap: wrap;
            padding: 4% 0 2% 25% !important;
            box-shadow: 0 0 10px 0px #bbb;
            text-align: center;
        }
        .box2 .big-inner {
            width: 30%;
            margin: 20px 0;
        }
        .box1 {
            position: absolute;
            background: linear-gradient(45deg, #df457a 0%, #fbb03b 100%) !important;
            width: 40%;
            display: flex;
            flex-wrap: wrap;
            z-index: 9;
            top: 40%;
            padding: 30px 0 10px;
        }
        .big-inner {
            text-align: center;
            width: 40%;
            margin: 20px;
            
        }
        .box1 .big-inner p, .box1 .big-inner h3{
            color: #fff !important;
            line-height: 20px;
            margin-bottom: 5px;
        }
        .big-inner img {
            width: 30%;
            margin-bottom: 20px;
        }
        @media screen and (max-width: 768px){
            .box1 .big-inner p, .box1 .big-inner h3, .box2 .big-inner p, .box2 .big-inner h3 {
            text-align: center !important;
        }
        .box1 {
            position: unset;
            width: 100%;
        }
        .big-inner {
            width: 38%;
        }
        .box2{
            padding: 0 !important;
            margin: 0;
            margin-top: 5%;
        }
        .box2 .big-inner{
            width: 50%;
        }
        .btn-style-four{
            padding: 10px !important;
        }
        }

        /**/
        .bs-example {
            padding: 0 !important;
        }

        #portfolio .re-learn{color: #ea5b36 !important;}
        #portfolio .re-learn .zn_arrow {
            border: 1px solid #ea5b36 !important;
        }
        #portfolio .re-learn .zn_arrow:after {
            background-color: #ea5b36 !important;
        }
        #portfolio .re-learn .zn_arrow:before {
            color: #ea5b36 !important;
        }
        #portfolio .re-learn:hover .zn_arrow {
            border-color: transparent !important;
        }