@font-face {
    font-family: 'proxima_novalight';
    src: url(/fonts/proximanova-light-webfont.eot);
    src: url(/fonts/proximanova-light-webfont.eot?#iefix) format('embedded-opentype'), url(/fonts/proximanova-light-webfont.woff) format('woff'), url(/fonts/proximanova-light-webfont.ttf) format('truetype'), url(/fonts/proximanova-light-webfont.svg#proxima_novalight) format('svg');
    font-weight: normal;
    font-style: normal;
}



    @media screen and (max-width:1200px) {
        @font-face {
            font-family: 'proxima_novalight';
            src: url(/fonts/proximanova-light-webfont.eot);
            src: url(/fonts/proximanova-light-webfont.eot?#iefix) format('embedded-opentype'), url(/fonts/proximanova-light-webfont.woff) format('woff'), url(/fonts/proximanova-light-webfont.ttf) format('truetype'), url(/fonts/proximanova-light-webfont.svg#proxima_novalight) format('svg');
            font-weight: normal;
            font-style: normal;
        }

        @-moz-document url-prefix() {
            #main-header .nav-outer {
                margin: 40px 0 0 0;
            }
        }

        .browse-button-outer a {
            font-family: 'proxima_novalight';
        }

        .navbar-default .navbar-nav > li > a {
            font-size: 14px;
            padding: 10px 4px;
        }

        #main-footer .footer-btm-list ul li {
            font-size: 15px;
        }

        #main-footer .footer-btm-list ul li {
            font-size: 14px;
        }

        div.middle {
            left: 0;
            margin-left: 650px;
        }

        #firstCommentDiv {
            top: 140px !important;
            right: 370px !important;
        }

        #main-banner .banner-menu ul li {
            margin-right: 20px;
        }
    }

    @media screen and (max-width:1091px) {
        form#ManageGCForm {
            width: 100%;
        }

        
    }




    @media screen and (max-width:990px) {

        #main-header .nav-outer {
        }

        .top-socialicons {
            display: none;
        }

        .navbar-default .navbar-nav > li > a {
            font-size: 12px;
        }

        #main-footer .footer-btm-list ul li {
            font-size: 12px;
            padding: 0px;
        }

        .contribute_table .sub {
            padding-right: 0px !important;
        }

        div.middle {
            left: 0;
            margin-left: 530px;
        }

        #firstCommentDiv {
            top: 50px !important;
            right: 150px !important;
        }

        .gc-comment {
            margin-top: 90px;
        }


        form#ManageGCForm {
            width: 100%;
            margin-top: 40px;
        }

        .transferdetail-para img {
            display: block;
            margin: 0 auto;
            margin-bottom: 15px;
        }
    }


    @media screen and (max-width:979px) {

        div.middle {
            left: 0;
            margin-left: 410px;
        }

        #firstCommentDiv {
            top: 140px !important;
        }
    }

    @media screen and (max-width:845px) {
        .transferdetail-para img {
            display: block;
            margin: 0 auto;
            margin-bottom: 20px;
        }

        .transferdetail-para button {
            margin-bottom: 15px;
        }
    }

    @media screen and (max-width:767px) {

        #main-header .nav-outer {
            margin: 0px !important;
        }

        .navbar-nav {
            float: left !important;
        }

        .top-socialicons {
            display: block;
        }

        #content .form-row {
            margin: 0;
        }

        #content .rsvp-inviteexample img {
            width: 100%;
        }

        #content .groupcard-example img {
            width: 100%;
            height: auto;
        }

        #content .contributing-thumbnail img {
            width: 100%;
            margin: 15px 0 0 0;
        }

        #content .content-subheading {
            margin: 15px 0 0 0;
        }

        .login_inner .grey_bg {
            float: left !important;
        }

        #main-header .logo {
            margin: 8px auto 0px !important;
            text-align: center;
        }

            #main-header .logo img {
                margin-left: 40px;
            }

        .navbar-toggle {
            float: left;
            position: absolute;
            top: -75px;
            left: 10px;
        }

        .navbar-header {
            margin-top: -50px;
        }

        .navbar-default .navbar-collapse, .navbar-default .navbar-form {
            background-color: #131313;
            position: absolute;
            left: -15px;
            top: 0px;
            width: calc(100% + 30px);
        }

        .navbar-default {
            min-height: initial;
        }

        #content .form-row ul li:last-child input[type="button"] {
            margin-left: 0px;
        }

        #content .form-row ul li button {
            margin-left: 0px;
        }

        #content .rsvp-inviteexample img {
            margin: 0;
        }

        #content .groupcard-example {
            margin: 0 0 25px 0;
        }

        .gt-container {
            min-width: inherit;
        }

        #content .form-row ul li:last-child a {
            margin: 0px;
        }

        #content .form-row ul li {
            width: 100%;
            margin-left: 2%;
            margin-bottom:15px;
        }

            #content .form-row ul li:first-child {
                margin-left: 0;
            }

            #content .form-row ul li:last-child button {
                margin-left: 0;
            }

        #content .contribute-grp input[type="text"] {
            margin-bottom: 15px;
        }

        #content .rsvp-inviteexample {
            margin: 20px 0;
            display: inline-block;
            width: 100%;
        }

        div.middle {
            left: 0;
            margin-left: 310px;
        }

        #info_box {
            left: 20%;
        }

        #firstCommentDiv {
            right: 160px !important;
        }

        .box_right {
            margin-top: 120px;
        }

        .box-rightouterone {
            margin-top: 30px;
            margin-bottom: 20px;
            display: inline-block;
        }

        .navbar-nav {
            float: left !important;
        }

        .box-rightouter {
            text-align: center;
        }



        .logo img {
            max-width: 100%;
            margin-left: 0 !important;
        }
    }

    @media screen and (max-width:640px) {

        #main-footer {
            display: none;
        }

        #main-banner {
            display: none;
        }

        #content .content-detail {
            margin: 15px 0 0 0 !important;
        }

        #content .content-detail-edit {
            margin: 30px 0 0 0 !important;
        }

        .box-rightouter {
            margin: 0 auto 20px auto;
        }

        .box_right {
            width: 100% !important;
            margin: 30px auto auto auto !important;
        }

        .box-rightouterone {
            margin: 70px auto auto auto;
        }






        .gc_heading {
            font-size: 30px;
            margin-bottom: 15px;
        }

        div.middle {
            left: 0;
            margin-left: 130px;
            top: 82px !important;
        }

        #info_box {
            left: 10%;
        }

        #firstCommentDiv {
            right: 150px !important;
            display: block;
            margin: 0 -50px 0 0 !important;
        }

            #firstCommentDiv img {
                width: 180px;
            }

        .boxright-one {
            width: 100% !important;
            margin-top: 80px !important;
        }

        .gc_comment_name {
            width: 87%;
        }

        .nick_outr_cont {
            margin-top: 0px !important;
        }

        .neick_detail {
            margin-top: 0;
        }

            .neick_detail > h2 {
                margin: 0 !important;
            }
    }

    @media screen and (max-width:591px) {

        .box-rightouter {
            /*text-align: center;*/
            text-align: left;
        }

        .gc_heading {
            font-size: 27px;
        }
    }

    @media screen and (max-width:507px) {


        div#gc_heading_1 span {
            padding: 0;
            text-align: center;
            display: 0;
            font-size: 18px !important;
            line-height: 1.2 !important;
        }
    }

    /* For iphone 5 styling*/
    @media screen and (max-width:480px) {

        .login_inner .grey_bg {
            width: 245px !important;
        }

        .img_pop {
            width: 100% !important;
        }

        div.middle {
            margin-left: 0px;
        }

        #firstCommentDiv {
            top: 280px !important;
            right: 70px !important;
        }

        .gc_heading {
            font-size: 25px;
            text-transform: uppercase;
        }

        .gc_subheading {
            font-size: 14px;
            line-height: normal;
            margin-bottom: 20px;
        }

        .box-rightouter {
            width: 100%;
            display: inline-block;
            margin-top: 20px;
        }



        .gc_comment_name {
            width: 77%;
        }

        .gc_comment {
            width: 77%;
        }



        .box-rightouterone {
            margin: 0 auto;
        }

        .box_right {
            width: 100% !important;
            margin: 0px auto auto auto !important;
        }
    }

    @media screen and (max-width:380px) {

        #content .summarytarget-left {
            width: 100%;
        }

        #content .summarytarget-right {
            width: 100%;
            text-align: center;
        }

            #content .summarytarget-right img {
                float: none;
                margin: 10px auto;
                text-align: center;
            }

        #content .form-row ul li:last-child button {
            margin-left: 0px;
        }
    }


    @media screen and (max-width:359px) {

        .form-row ul li {
            width: 128px;
        }
    }

#cropdivCroppie {
    padding: 0px 30px!important;
    background: #f9f9f9;
    border-radius: 10px;
    border: none;
}

#controls_croppie {
    max-width: 341px;
}

.croppie-container .cr-resizer, .croppie-container .cr-viewport {
    border: 2px solid #c1c1c1 !important;
}

.choose-image-btn {
    background: rgb(177,205,130);
    background: linear-gradient(0deg, rgba(177,205,130,1) 0%, rgba(177,205,130,1) 45%, rgba(155,197,97,1) 100%);
    border: none;
    padding: 0px 10px !important;
    cursor: pointer;
    margin-bottom: 25px;
    font-size: 12px;
    height: 40px;
    line-height: 40px;
}

.remove-img-btn {
    background: rgb(252 127 134);
    background: linear-gradient(0deg, rgb(251 110 118) 0%, rgb(252 128 135) 45%, rgb(253 147 153) 100%);
    border: none;
    padding: 0px 10px !important;
    cursor: pointer;
    margin-bottom: 25px;
    font-size: 12px;
    height: 40px;
    line-height: 40px;
}

.rotate-image-btn {
    background: rgb(19 167 251);
    background: linear-gradient(0deg, rgb(23 169 251) 0%, rgb(61 187 252) 45%, rgb(23 169 251) 100%);
    border: none;
    padding: 0px 10px !important;
    cursor: pointer;
    margin-bottom: 25px;
    font-size: 12px;
    height: 40px;
    line-height: 40px;
}

@media(max-width:767px) {
    #controls_croppie {
        max-width: 348px;
    }

    .choose-image-btn {
        background: rgb(177,205,130);
        background: linear-gradient(0deg, rgba(177,205,130,1) 0%, rgba(177,205,130,1) 45%, rgba(155,197,97,1) 100%);
        border: none;
        padding: 2px 10px;
        cursor: pointer;
        margin-bottom: -5px;
        font-size: 12px;
        width: 100%;
    }

    .remove-img-btn {
        background: rgb(252 127 134);
        background: linear-gradient(0deg, rgb(251 110 118) 0%, rgb(252 128 135) 45%, rgb(253 147 153) 100%);
        border: none;
        padding: 2px 10px;
        cursor: pointer;
        margin-bottom: 5px;
        font-size: 12px;
        width: 100%;
    }

    .rotate-image-btn {
        background: rgb(19 167 251);
        background: linear-gradient(0deg, rgb(23 169 251) 0%, rgb(61 187 252) 45%, rgb(23 169 251) 100%);
        border: none;
        padding: 2px 10px;
        cursor: pointer;
        margin-bottom: 15px;
        font-size: 12px;
        width: 100%;
    }
}