/*

======================================================================
 @breakpoint
 @ Wide Display Layout: 1600px.
======================================================================

*/




@media only screen and (min-width: 1600px) {

    /*====================================================================
    @ General CSS
    ======================================================================*/

    .position-relative {
        bottom: -200px;
    }



}



/*

======================================================================
 @breakpoint
 @ Wide Display Layout: 1200px.
======================================================================

*/




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


    /*====================================================================
    @ General CSS
    ======================================================================*/

    .default-section-heading h2 {
        font-size: 3.72em;
    }

    .section-padding {
        padding: 100px 0;
    }

    .content-margin-top {
        margin-top: 80px;
    }

    /*====================================================================
    @ Main menu styles
    ======================================================================*/

    .ringer-menu ul li a {
        font-size: 1.0em;
        margin: 0 12px;
        font-weight: 400;
    }

    /*====================================================================
    @ Welcome section
    ======================================================================*/

    .welcome-section {
        height: 800px;
    }

    .welcome-section .welcome-tbl,
    .welcome-screenshot .welcome-tbl {
        height: 630px;
    }
    .welcome-content h1 {
        font-size: 3.0em;
        line-height: 1.2;
        margin-bottom: 30px;
    }

    .welcome-screenshot img {
        /* height: 430px; */
        transform: scale(1.25);
        position: initial;
    }

    /*====================================================================
    @ Dialer section
    ======================================================================*/

    .dialer-section-img {
        transform: scale(.9);
        padding-top: 75px;
    }
    .dialer-single-feature {
        width: 50%;
        float: left;
        padding: 7px;
        text-align: center;
    }
    .dialer-single-feature-content {
        box-shadow: 0 0 25px rgba(0,0,0,.08);
        padding: 15px 15px;
    }
    .dialer-single-feature-content i {
        font-size: 2.500em;
        width: 65px;
        height: 65px;
        box-shadow: 0 12px 24px rgba(0,0,0,.28);
        line-height: 65px;
        margin-bottom: 15px;
    }
    .dialer-single-feature-content h3 {
        font-size: 1.414em;
    }

    /*====================================================================
    @ Receptive section
    ======================================================================*/

    .receptive-section-img {
        transform: scale(.9);
        padding-top: 75px;
    }
    .receptive-single-feature {
        width: 50%;
        float: left;
        padding: 7px;
        text-align: center;
    }
    .receptive-single-feature-content {
        box-shadow: 0 0 25px rgba(0,0,0,.08);
        padding: 15px 15px;
    }
    .receptive-single-feature-content i {
        font-size: 2.500em;
        width: 65px;
        height: 65px;
        box-shadow: 0 12px 24px rgba(0,0,0,.28);
        line-height: 65px;
        margin-bottom: 15px;
    }
    .receptive-single-feature-content h3 {
        font-size: 1.414em;
    }

    /*====================================================================
    @ Security section
    ======================================================================*/

    .security-section .security-img {
        transform: scale(.9);
        padding-top: 75px;
    }
    .security-section.section-padding {
        padding: 100px 0;
    }
    .security-section .content-margin-top {
        margin-top: 60px;
    }
    .security-container {
        width: 100%;
    }

    /*====================================================================
    @ Features section
    ======================================================================*/

    .feature-row-img {
        transform: scale(.9);
    }
    .single-feature {
        width: 50%;
        float: left;
        padding: 7px;
        text-align: center;
    }
    .single-feature-content {
        box-shadow: 0 0 25px rgba(0,0,0,.08);
        padding: 15px 15px;
    }
    .single-feature-content i {
        font-size: 2.500em;
        width: 65px;
        height: 65px;
        box-shadow: 0 12px 24px rgba(0,0,0,.28);
        line-height: 65px;
        margin-bottom: 15px;
    }
    .single-feature-content h3 {
        font-size: 1.414em;
    }

    /*====================================================================
    @ Benefits section
    ======================================================================*/

    .benefits-section{
        height: 550px;
    }

    /*====================================================================
    @ Subscribe section
    ======================================================================*/

    .subscribe-content h2 {
        font-size: 2.201em;
    }
    .subscribe-section-wraper:before,
    .subscribe-section-wraper:after {
        top: -45px;
        left: 45px;
        width: 15px;
        height: 200px;
    }
    .subscribe-section-wraper:after {
        left: inherit;
        right: 45px;
    }
    .apps-craft-signup-form-content-inner {
        width: calc(100% - 90px);
        padding: 45px 0;
    }
    .apps-craft-signup-form-content h2 {
        font-size: 2.32em;
    }

    /*====================================================================
    @ Questions section
    ======================================================================*/

    .default-accordion .panel-title a {
        font-size: 1.31em;
        padding: 0 0 0 50px;
    }
    .default-accordion .panel-title {
        height: 70px;
    }
    .default-accordion .panel-default > .panel-heading+.panel-collapse > .panel-body {
        padding: 18px 25px;
    }
    .apps-craft-contact-form-content-inner {
        width: calc(100% - 90px);
        padding: 45px 0;
    }
    .apps-craft-contact-form-content h2 {
        font-size: 2.32em;
    }

    /*====================================================================
    @ Footer section
    ======================================================================*/

    .footer-logo {
        padding-bottom: 35px;
    }
    .footer-logo-and-social {
        padding-bottom: 90px;
    }
    .footer-social-link {
        margin-top: 50px;
    }

    /*====================================================================
    @ Swiper Slider
    ======================================================================*/

    .apps-craft-banner-swiper:before {
        border-bottom: 30vh solid #F4F4F4;
    }



}




/*

======================================================================
 @breakpoint
 @ Tablet Layout: 768px
======================================================================

*/




@media only screen and (min-width: 768px) and (max-width: 991px) {


    /*====================================================================
    @ General CSS
    ======================================================================*/
	
    .default-dash-border {
        height: 120%;
    }

    .content-margin-top {
        margin-top: 50px;
    }
    .section-padding {
        padding: 80px 0;
    }
    .position-relative {
        bottom: -50px;
    }
    .default-section-heading h2 {
        font-size: 2.9em;
    }

    /*====================================================================
    @ Main menu styles
    ======================================================================*/

    .ringer-menu ul li a {
        margin: 0 5px;
    }

    /*====================================================================
    @ Welcome section
    ======================================================================*/

    .welcome-content h1 {
        font-size: 2em;
        margin-bottom: 25px;
    }
    .welcome-screenshot img {
        top: -50px;
        position: absolute;
        transform: scale(2.5);
    }
    
    /*====================================================================
    @ Benefits section
    ======================================================================*/

    .benefits-section {
        height: 450px;
    }
    .benefits-content a i {
        font-size: 6em;
    }
    .benefits-content h4 {
        margin-bottom: 30px;
    }

    /*====================================================================
    @ Features section
    ======================================================================*/

    .feature-section .content-margin-top {
        margin-top: 150px;
    }
    .feature-row-img {
        margin-bottom: 25px;
    }
    .feature-section .figures-div {
        display: none;
    }
    .feature-section .feature-row-features-grid .single-feature {
        display: block;
    }
    .feature-section .second-row {
        margin-top: 0px;
    }
    .feature-section .third-row {
        margin-top: 0px;
    }
    .single-feature {
        padding: 20px;
    }
    .single-feature-content {
        padding: 20px 20px;
    }

    /*====================================================================
    @ Dialer section
    ======================================================================*/

    .dialer-section .content-margin-top {
        margin-top: 50px;
    }
    .dialer-section-img {
        margin-bottom: 25px;
        padding-top: 0 !important;
    }
    .dialer-single-feature {
        padding: 20px;
    }
    .dialer-single-feature-content {
        padding: 20px 20px;
    }

    /*====================================================================
    @ Receptive section
    ======================================================================*/

    .receptive-section .content-margin-top {
        margin-top: 50px;
    }
    .receptive-section-img {
        margin-bottom: 25px;
        padding-top: 0 !important;
    }
    .receptive-single-feature {
        padding: 20px;
    }
    .receptive-single-feature-content {
        padding: 20px 20px;
    }

    /*====================================================================
    @ Security section
    ======================================================================*/
    
    .security-section.section-padding {
        padding: 80px 0;
    }
    .security-ico span.default-round {
        width: 65px;
        height: 65px;
        box-shadow: 0 10px 25px rgba(0,0,0,.28);
        line-height: 70px;
        font-size: 2.0em;
    }
    .security-single {
        margin-bottom: 15px;
    }
    .security-content-txt h3 {
        font-size: 1.514em;
        margin: 15px 0 15px;
    }
    .security-section .security-img {
        transform: scale(.9);
    }
    figure.security-img img:first-child {
        width: 290px;
    }
    .security-section .content-margin-top {
        margin-top: 80px;
    }

    /*====================================================================
    @ API section
    ======================================================================*/

    .single-api-item-pic {
        width: 100px;
        height: 100px;
        box-shadow: 0 8px 32px rgba(0,0,0,.08);
        line-height: 100px;
    }
    .single-api-item-pic img {
        width: 85px;
        height: 85px;
        box-shadow: 0 8px 32px rgba(0,0,0,.28);
    }
    .single-api-item-pic:before {
        width: 100px;
        height: 100px;
    }
    .single-api-item-pic:before {
        opacity: .83;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=83)";
        filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=83)";
    }
    .single-api-item-pic .apps-craft-api-hover {
        top: 50%;
        opacity: 1;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
        filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    }
    .single-api-feature-img {
        margin-bottom: 50px;
    }
    .single-api-feature-img:before {
        height: 45px;
    }
    .api-feature-bio h2 {
        font-size: 1.4em;
        margin-bottom: 10px;
    }
    .api-feature-bio h5 {
        font-size: .9em;
    }

    /*====================================================================
    @ Contact section
    ======================================================================*/

    .contact-content {
        width: 90%;
        padding: 100px auto;
    }
    .contact-content h3 {
        font-size: 2.171em;
        margin-bottom: 30px;
    }
    .contact-content p {
        margin-bottom: 30px;
    }

    /*====================================================================
    @ Subscribe section
    ======================================================================*/

    .subscribe-section.section-padding {
        padding: 110px 0 80px 0;
    }
    .subscribe-section-wraper {
        padding: 100px 0;
    }
    .apps-craft-signup-form-content-inner {
        width: calc(100% - 40px);
        padding: 25px 0;
    }
    .apps-craft-signup-form-content h2 {
        font-size: 2.0em;
    }
    .apps-craft-signup-form input[type="email"] {
        height: 45px;
    }

    /*====================================================================
    @ Questions section
    ======================================================================*/

    .default-accordion .panel-title {
        height: 55px;
        padding: 0 15px;
    }
    .default-accordion .panel-title a {
        font-size: 1.2em;
        padding: 0 0 0 45px;
    }
    .default-accordion .panel-title a.collapsed:before {
        width: 28px;
        height: 28px;
        font-size: 1.0em;
        line-height: 31px;
    }
    .default-accordion .panel-title a:before {
        width: 28px;
        height: 28px;
        font-size: 1.0em;
        line-height: 32px;
    }
    .default-accordion .panel {
        margin-bottom: 15px;
    }
    .apps-craft-contact-form-content-inner {
        width: calc(100% - 40px);
        padding: 25px 0;
    }
    .apps-craft-contact-form-content h2 {
        font-size: 2.0em;
    }
    .apps-craft-contact-form input[type="email"], .apps-craft-contact-form textarea {
        height: 45px;
    }
    .apps-craft-contact-form textarea {
        height: 155px;
        padding: 15px;
    }
    .subscribe-content {
        width: 80%;
        margin: 0 auto;
        color: #FFFFFF;
    }

    /*====================================================================
    @ Footer section
    ======================================================================*/

    .footer-section {
        padding-top: 250px;
    }
    .footer-logo {
        padding-bottom: 0px;
    }
    .footer-logo-and-social {
        padding-bottom: 70px;
    }
    .footer-social-link {
        margin-top: 10px;
    }

    /*====================================================================
    @ WhatsApp Link
    ======================================================================*/

    .ringer-whatsapp-link {
        width: 55px;
        height: 55px;
        font-size: 2.8em;
    }



}



/*

======================================================================
 @breakpoint
 @ Mobile Layout: 320px.
======================================================================

*/




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



    /*====================================================================
    @ General CSS
    ======================================================================*/
	
    .default-section-heading h2 {
        font-size: 2.5em;
    }
    .section-padding {
        padding: 80px 0;
    }
    .content-margin-top {
        margin-top: 30px;
    }

    /*====================================================================
    @ Main menu styes
    ======================================================================*/

    #main-menu-icon {
        display: block;
        font-size: 22px;
        line-height: 1;
        text-align: right;
    }
    #main-menu-icon img {
        width: 25px;
        height: 25px;
        content: url(/assets/img/ringer-menu-toggle.png);
        margin: 0 10px;
    }
    #ringer-menu {
        min-width: 200px;
        right: 0;
        display: none;
        position: absolute;
        margin-top: 20px;
        top: 20px;
        background-color: #fff;
        background-image: -webkit-linear-gradient( -20deg, rgb(29, 161, 242) 0%, rgb(29, 161, 242) 0%, rgb(29, 161, 242) 0%, rgb(29, 161, 242) 1%, rgb(29, 161, 242) 57%, rgb(29, 161, 242) 100%);
        background-image: -ms-linear-gradient( -20deg, rgb(29, 161, 242) 0%, rgb(29, 161, 242) 0%, rgb(29, 161, 242) 0%, rgb(29, 161, 242) 1%, rgb(29, 161, 242) 57%, rgb(29, 161, 242) 100%);
    }
    .menu-and-search {
        position: relative;
    }
    .ringer-menu ul li {
        width: 100%;
        padding: 6px 12px;
        border-bottom: 1px solid #FFFFFF;
    }
    .ringer-menu ul li:last-child {
        border-bottom: 0px solid #FFFFFF;
    }
    .main-menu-area.sticky-menu .ringer-menu ul li a {
        color: #fff;
    }

    /*====================================================================
    @ Welcome section
    ======================================================================*/

    .welcome-section {
        height: inherit;
    }

    .welcome-section .welcome-tbl,
    .welcome-screenshot .welcome-tbl {
        height: 430px;
    }
    .welcome-content {
        text-align: center;
    }
    .welcome-content h1 {
        font-size: 2.0em;
    }

    /*====================================================================
    @ Benefits section
    ======================================================================*/

    .benefits-section {
        height: 350px;
    }
    .benefits-content h4 {
        margin: 0;
        font-size: 2.071em;
        margin-bottom: 25px;
    }
    .benefits-content a i {
        font-size: 6em;
    }

    /*====================================================================
    @ Features section
    ======================================================================*/

    .feature-section .content-margin-top {
        margin-top: 150px;
    }
    .feature-section .figures-div {
        display: none;
    }
    .feature-section .feature-row-features-grid {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        justify-content: stretch;
        width: 100%;
    }
    .feature-section .feature-row-features-grid .single-feature {
        /* display: block; */
        width: 100%;
    }
    .feature-section .second-row {
        margin-top: 0px;
    }
    .feature-section .third-row {
        margin-top: 0px;
    }
    .feature-section {
        overflow: hidden;
    }
    .feature-row-img {
        transform: scale(.8);
        padding-top: 0;
    }
    .single-feature {
        width: 100%;
        padding: 10px 6px;
    }

    /*====================================================================
    @ Dialer section
    ======================================================================*/

    .dialer-section .content-margin-top {
        margin-top: 25px;
    }
    .dialer-section {
        overflow: hidden;
    }
    .dialer-section-img {
        transform: scale(.8);
        padding-top: 0;
    }
    .dialer-single-feature {
        width: 100%;
        padding: 10px 6px;
    }

    /*====================================================================
    @ Receptive section
    ======================================================================*/

    .receptive-section .content-margin-top {
        margin-top: 25px;
    }
    .receptive-section {
        overflow: hidden;
    }
    .receptive-section-img {
        transform: scale(.8);
        padding-top: 0;
    }
    .receptive-single-feature {
        width: 100%;
        padding: 10px 6px;
    }

    /*====================================================================
    @ Security section
    ======================================================================*/

    .security-section.section-padding {
        padding: 80px 0;
    }
    .security-img {
        display: none;
        position: relative;
        width: 100%;
        margin: auto;
        float: none;
    }
    .security-container {
        max-height: 550px;
    }
    figure.security-img img:first-child {
        width: 80%;
    }
    figure.security-img img:last-child {
        width: 100%;
    }
    .security-content-txt h3 {
        margin: 0px 0 20px;
    }

    /*====================================================================
    @ API section
    ======================================================================*/

    .single-api-feature-img {
        margin-bottom: 58px;
    }
    .single-api-feature-img:before {
        height: 55px;
    }
    .single-api-item-pic:before {
        opacity: .83;
        filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=83)";
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=83)";
    }
    
    /*====================================================================
    @ Contact section
    ======================================================================*/

    .contact-content {
        width: 100%;
        padding: 100px auto;
    }
    .contact-content h3 {
        font-size: 2.071em;
        margin-bottom: 25px;
    }
    .contact-content p {
        margin-bottom: 30px;
        line-height: 1.8;
    }

    /*====================================================================
    @ Subscribe section
    ======================================================================*/

    .subscribe-section.section-padding {
        padding: 100px 0 70px 0;
        overflow: hidden;
    }
    .subscribe-content {
        width: 90%;
    }
    .subscribe-content h2 {
        font-size: 1.5em;
    }
    .subscribe-content-actions {
        line-height: 6.5rem !important;
    }
    .apps-craft-subscribe-form input[type="email"] {
        width: calc(100% - 0px);
        height: 55px;
        padding: 0 15px;
    }
    .apps-craft-subscribe-form input[type="submit"] {
        width: 100px;
        height: 40px;
        margin-left: -108px;
        font-size: 1.0em;
        margin-top: 8px;
    }
    .subscribe-section-wraper {
        padding: 115px 0;
        min-height: 340px;
    }
    .subscribe-section-wraper:before, .subscribe-section-wraper:after {
        top: -55px;
        left: 49px;
        width: 10px;
        height: 180px;
    }
    .subscribe-section-wraper:after {
        left: inherit;
        right: 49px;
    }

    /*====================================================================
    @ Question section
    ======================================================================*/

    .default-accordion {
        margin-top: 35px;
    }
    .footer-section {
        padding-top: 230px;
    }
    
    /*====================================================================
    @ Footer section
    ======================================================================*/

    .footer-logo-and-social {
        padding-bottom: 25px;
    }
    .footer-logo {
        padding-bottom: 5px;
    }
    .footer-menu-and-copyright-txt .footer-copyright-txt {
        width: 100%;
        text-align: center;
        margin-bottom: 20px;
    }
    .footer-menu-and-copyright-txt .footer-menu {
        width: 100%;
        text-align: center;
    }
    .footer-menu ul li a {
        margin: 0 5px;
    }
    .footer-social-link {
        margin-top: 20px;
    }

    /*====================================================================
    @ Swiper Slider
    ======================================================================*/

    .apps-craft-banner-swiper:before {
        display: none;
    }

    /*====================================================================
    @ WhatsApp Link
    ======================================================================*/

    .ringer-whatsapp-link {
        width: 50px;
        height: 50px;
        font-size: 2.5em;
    }

	
}




/*

======================================================================
 @breakpoint
 @ Wide Mobile Layout: 480px.
======================================================================

*/





@media only screen and (min-width: 480px) and (max-width: 767px) {
	

    /*====================================================================
    @ Features section
    ======================================================================*/

    .feature-section .feature-row-features-grid .single-feature {
        display: block;
    }
    

}




/*

======================================================================
 @breakpoint
 @ Small Mobile Layout: 320px.
======================================================================

*/




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


    /*====================================================================
    @ Features section
    ======================================================================*/

    .feature-section .feature-row-features-grid .single-feature {
        display: block;
    }


}