/*--
Author: W3layouts
Author URL: http://w3layouts.com
License: Creative Commons Attribution 3.0 Unported
License URL: http://creativecommons.org/licenses/by/3.0/
--*/
/*--reset--*/
@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/Montserrat-Regular.ttf') format('truetype');
}

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, dl, dt, dd, ol, nav ul, nav li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
    font-family: 'Montserrat', 'Nunito', sans-serif;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block;
}

ol, ul {
    list-style: none;
    margin: 0px;
    padding: 0px;
}

blockquote, q {
    quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after {
    content: '';
    content: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

/*--start editing from here--*/
a {
    text-decoration: none;
    color: #029eb5;
    -webkit-transition: 0.5s all;
    -moz-transition: 0.5s all;
    transition: 0.5s all;
    -o-transition: 0.5s all;
    -ms-transition: 0.5s all;
}

a:hover {color: #FE7200}

i {margin-right: 10px;}

.txt-rt {
    text-align: right;
}

/* text align right */
.txt-lt {
    text-align: left;
}

/* text align left */
.txt-center {
    text-align: center;
}

/* text align center */
.float-rt {
    float: right;
}

/* float right */
.float-lt {
    float: left;
}

/* float left */
.clear {
    clear: both;
}

/* clear float */
.pos-relative {
    position: relative;
}

/* Position Relative */
.pos-absolute {
    position: absolute;
}

/* Position Absolute */
.vertical-base {
    vertical-align: baseline;
}

/* vertical align baseline */
.vertical-top {
    vertical-align: top;
}

/* vertical align top */
nav.vertical ul li {
    display: block;
}

/* vertical menu */
nav.horizontal ul li {
    display: inline-block;
}

/* horizontal menu */
img {
    max-width: 100%;
}

/*--end reset--*/
body, input, select {
    font-family: 'Dosis', sans-serif;
    background: #008080;
    background-attachment: fixed;
}

h1 {
    font-size: 3em;
    text-align: left;
    color: #fff;
    font-weight: 100;
}

/*--main--*/
.main-title {
    margin-bottom: 50px;
    float: left;
    min-width: 420px;
}

.main-logout {float: right;}

.main-info {
    width: 50%;
    margin: 4em auto;
}

.main-logout a {color: white;}

h3.title {
    font-size: 1.5em;
    font-weight: 600;
    color: #029eb5;
    margin-bottom: 0.8em;
}

p {
    font-size: 1em;
    color: #999;
    line-height: 1.8em;
}

.full-width {width: 100% !important;}
.go-to-center {text-align: center;}
.go-to-left {text-align: left;}
.text-justify {text-align: justify;}
.hide{display: none;}
.color-white{color: white;}
.font-size-large{font-size: 22px;}
.margin-top-20 {margin-top: 20px;}
.margin-top-30 {margin-top: 30px;}
.margin-top-40 {margin-top: 40px;}

/*--//main--*/

.profile-grid {
    background: #fff;
    width: 42.5%;
    padding: 1.5em;
    min-height: 267px;
}
.activation-page-for-desktop {
    padding: 0.6em 1.5em;
    min-height: 374px;
}

.logo {
    text-align: center;
}

.profile-grid img {
    border-radius: 0%;
    border: 0px solid #8eb021;
    margin-top: 7px;
}

.profile-grid h2 {
    font-size: 2.5em;
    color: #029EC5;
}

.profile-grid p {
    font-size: 1em;
    color: #999;
}

.profile-grid span {
    color: #029EC5;
    font-weight: bold;
}

.profile-grid .terms-and-conditions {
    font-size: 12px;
    padding: 10px 0 0 0;
}
.profile-grid .terms-and-conditions span {color: #999;font-weight: normal;vertical-align: text-bottom;}

.profile-grid input[type="text"],
.profile-grid input[type="password"],
.profile-grid input[type="email"],
.profile-grid input[type="tel"] {
    width: 84%;
    padding: .8em 3em .8em 1em;
    font-size: 0.8em;
    margin-top: 1.2em;
    outline: none;
    color: #008080;
    border: 2px solid #e3e3e3;
    border-radius: 3px;
}
.profile-grid input[type="tel"] {
    width: 100%;
    padding: .8em 3em .8em 3em;
}

.profile-grid input[type="text"] {
    background: url(../images/1.png) no-repeat 97% center;
    display: block;
}

.profile-grid input[type="password"] {
    background: url(../images/2.png) no-repeat 97% center;
    display: block;
}

.profile-grid input[type="email"] {
    background: url(../images/l2.png) no-repeat 97% center;
    display: block;
}

.phone-input {
    background: url(../images/phone-2.png) no-repeat 97% center !important;
    display: block;
}

.sim-input {
    background: url(../images/sim-3.png) no-repeat 97% center !important;
    display: block;
}

.phonenumber-mobile {
    background: url(../images/select.png) no-repeat 97% center !important;
    display: block;
}

.profile-grid input[type="submit"] {
    outline: none;
    padding: 0.6em 0;
    width: 100%;
    margin-top: 10px;
    text-align: center;
    font-size: 1em;
    border: none;
    color: #fff;
    cursor: pointer;
    background: rgb(255, 168, 76);
    background: -moz-linear-gradient(-45deg, rgba(255, 168, 76, 1) 31%, rgba(255, 123, 13, 1) 60%);
    background: -webkit-linear-gradient(-45deg, rgba(255, 168, 76, 1) 31%, rgba(255, 123, 13, 1) 60%);
    background: linear-gradient(135deg, rgba(255, 168, 76, 1) 31%, rgba(255, 123, 13, 1) 60%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffa84c', endColorstr='#ff7b0d', GradientType=1);
    border: 2px solid rgb(255, 168, 76);
    -webkit-transition: .5s all;
    -moz-transition: .5s all;
    transition: .5s all;
    -o-transition: .5s all;
    -ms-transition: .5s all;
}

.profile-grid input[type="submit"]:hover {
    color: #008080;
    background: rgb(245, 246, 246);
    background: -moz-linear-gradient(-45deg, rgba(255, 167, 76, 0.41) 31%, rgba(255, 123, 13, 0.6) 60%);
    background: -webkit-linear-gradient(-45deg, rgba(255, 168, 76, 0.41) 31%, rgba(255, 123, 13, 0.6) 60%);
    background: linear-gradient(135deg, rgba(255, 168, 76, 0.41) 31%, rgba(255, 123, 13, 0.6) 60%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f5f6f6', endColorstr='#f5f6f6', GradientType=1);
}

.profile-grid select {
    width: 100%;
    padding: .7em;
    font-size: 0.8em;
    margin: 1.2em 0;
    outline: none;
    color: #008080;
    border: 2px solid #e3e3e3;
    border-radius: 3px;
    background: white;
    display: block;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.text-left {
    float: left;
}

.text-right {
    float: right;
}

.signin-text {
    margin-top: 1.5em;
}

.signin-text p a {
    color: #999;
}

.signin-text p a:hover {
    color: #000;
    transition: 0.5s all;
    -webkit-transition: 0.5s all;
    -moz-transition: 0.5s all;
    -o-transition: 0.5s all;
    -ms-transition: 0.5s all;
}

.social-icons {
    display: block;
    text-align: center;
    margin-top: 1em;
}

.social-icons ul li {
    display: inline-block;
    margin-right: 5px;
}

.social-icons a {
    background: url(../images/sprite.png) no-repeat 0px 0px;
    display: block;
    width: 33px;
    height: 30px;
    transition: 0.5s all;
    -webkit-transition: 0.5s all;
    -moz-transition: 0.5s all;
    -o-transition: 0.5s all;
    -ms-transition: 0.5s all;
}

.social-icons a:hover {
    transform: rotatey(360deg);
}

.social-icons a.fb {
    background: url(../images/sprite.png) no-repeat 0px -35px;
}

.social-icons a.be {
    background: url(../images/sprite.png) no-repeat 0px -69px;
}

.social-icons a.gg {
    background: url(../images/sprite.png) no-repeat 0px -105px;
}

/*-- main-row2 --*/
.main-row2 {
    margin-top: 1.5em;
}

/*-- skills --*/
.skills {
    position: relative;
    width: 55%;
    background: #fff;
    padding: 1.5em;
    min-height: 190px;
}

.skill-info {
    margin-top: 5em;
    text-align: center;
}

.skills ul {
    margin-top: 1.6em;
    text-align: center;
}

.skills ul li {
    display: inline-block;
    margin: 0 1.2em;
    /*-- w3layouts --*/
}

.skills p {
    font-size: 1.2em;
    color: #555;
    margin-top: 2.5em;
    text-align: center;
    font-weight: 400;
}

.skills select {
    outline: none;
    width: 40%;
    background: none;
    color: #008080;
    font-size: 0.9em;
    padding: 10px 0px 10px 7px;
    border: 1px solid #FF7B0D;
    margin: 1em 0;
}

.skills input[type="text"] {
    outline: none;
    width: 56%;
    background: none;
    color: #008080;
    font-size: 0.9em;
    padding: 11px 0px 11px 12px;
    border: 1px solid #FF7B0D;
    margin: 1em 0;
}




.skills input[type="submit"] {
    margin-top: 10px;
    outline: none;
    padding: 0.6em 0;
    width: 100%;
    text-align: center;
    font-size: 1em;
    border: none;
    color: #fff;
    cursor: pointer;
    background: rgb(255, 168, 76);
    background: -moz-linear-gradient(-45deg, rgba(255, 168, 76, 1) 31%, rgba(255, 123, 13, 1) 60%);
    background: -webkit-linear-gradient(-45deg, rgba(255, 168, 76, 1) 31%, rgba(255, 123, 13, 1) 60%);
    background: linear-gradient(135deg, rgba(255, 168, 76, 1) 31%, rgba(255, 123, 13, 1) 60%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffa84c', endColorstr='#ff7b0d', GradientType=1);
    border: 2px solid rgb(255, 168, 76);
    -webkit-transition: .5s all;
    -moz-transition: .5s all;
    transition: .5s all;
    -o-transition: .5s all;
    -ms-transition: .5s all;
}

.skills input[type="submit"]:hover {
    color: #000000;
    background: rgb(245, 246, 246);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f5f6f6', endColorstr='#f5f6f6', GradientType=1);
}


/*--//skills--*/
/*--subscribe--*/
.profile-grid3 {
    background: #fff;
    padding: 1.5em;
    width: 30%;
    min-height: 190px;
}

.profile-grid3 input[type="text"] {
    outline: none;
    width: 94%;
    background: none;
    color: #008080;
    font-size: 0.9em;
    padding: 11px 0px 11px 12px;
    border: 1px solid #FF7B0D;
    margin: 1.05em 0;
}

.profile-grid3 select {
    outline: none;
    width: 100%;
    background: none;
    color: #008080;
    font-size: 0.9em;
    padding: 10px 0px 10px 7px;
    border: 1px solid #FF7B0D;
    margin: 1em 0;
}

.profile-grid3 input[type="submit"] {
    margin-top: 9px;
    outline: none;
    padding: 0.6em 0;
    width: 100%;
    text-align: center;
    font-size: 1em;
    border: none;
    color: #fff;
    cursor: pointer;
    background: rgb(255, 168, 76);
    background: -moz-linear-gradient(-45deg, rgba(255, 168, 76, 1) 31%, rgba(255, 123, 13, 1) 60%);
    background: -webkit-linear-gradient(-45deg, rgba(255, 168, 76, 1) 31%, rgba(255, 123, 13, 1) 60%);
    background: linear-gradient(135deg, rgba(255, 168, 76, 1) 31%, rgba(255, 123, 13, 1) 60%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffa84c', endColorstr='#ff7b0d', GradientType=1);
    border: 2px solid rgb(255, 168, 76);
    -webkit-transition: .5s all;
    -moz-transition: .5s all;
    transition: .5s all;
    -o-transition: .5s all;
    -ms-transition: .5s all;
}

.profile-grid3 input[type="submit"]:hover {
    color: #000000;
    background: rgb(245, 246, 246);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f5f6f6', endColorstr='#f5f6f6', GradientType=1);
}


.profile-grid4 input[type="submit"] {
    outline: none;
    border: 2px solid #FE7200;
    width: 100%;
    background: #FE7200;
    color: #fff;
    font-size: 0.9em;
    padding: .6em 0;
    cursor: pointer;
    -webkit-transition: .5s all;
    -moz-transition: .5s all;
    transition: .5s all;
    -o-transition: .5s all;
    -ms-transition: .5s all;
}

.profile-grid4 input[type="submit"]:hover {
    background: none;
    color: #FE7200;
}

/*--//subscribe--*/

/* apps download */
.apps-main-title {
    text-align: center;
    font-size: 40px;
}

.download-app-0 {
    width: 100%;
    text-align: center;
}

.download-app-0 input[type="submit"] {
    outline: none;
    /*padding: 0.6em 0;*/
    width: 100%;
    height: 100px;
    font-size: 39px;
    margin-top: 10px;
    text-align: center;
    border: none;
    color: #fff;
    cursor: pointer;
    background: rgb(255, 168, 76);
    background: -moz-linear-gradient(-45deg, rgba(255, 168, 76, 1) 31%, rgba(255, 123, 13, 1) 60%);
    background: -webkit-linear-gradient(-45deg, rgba(255, 168, 76, 1) 31%, rgba(255, 123, 13, 1) 60%);
    background: linear-gradient(135deg, rgba(255, 168, 76, 1) 31%, rgba(255, 123, 13, 1) 60%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffa84c', endColorstr='#ff7b0d', GradientType=1);
    border: 2px solid rgb(255, 168, 76);
    -webkit-transition: .5s all;
    -moz-transition: .5s all;
    transition: .5s all;
    -o-transition: .5s all;
    -ms-transition: .5s all;
}
.download-app-0 input[type="submit"].apps-button-small {
    width: 100%;
    height: 70px;
    font-size: 30px;
}

.download-app-1{
    background: #fff;
    padding: 1.5em;
    width: 95%;
    min-height: 190px;
}

.download-app-1-left {
    width: 47%;
    float: left;
}

.download-app-1-right {
    width: 47%;
    float: right;
}
/* --//apps download*/

/*--address--*/
.address ul li {
    display: block;
    margin-top: 1em;
    /*-- agileits --*/
    color: #999;
    font-size: 1em;
}

.address ul li a {
    color: #999;
}

.address ul li a:hover {
    color: #029eb5;
}

/*--//address--*/
/*-- SAP --*/
.sap_tabs {
    clear: both;
}

.tab_box {
    background: #fd926d;
    padding: 2em;
}

.top1 {
    margin-top: 2%;
}

.resp-tabs-list {
    list-style: none;
    padding-left: 19px;
    text-align: left;
}

.resp-tab-item {
    color: #333;
    font-size: 1em;
    cursor: pointer;
    padding: 6px 18px;
    display: inline-block;
    text-align: center;
    list-style: none;
    outline: none;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
    margin: 0;
    background: #DEDEDE;
}

.resp-tab-active {
    text-shadow: none;
    color: #848DD7;
}

.resp-tabs-container {
    padding: 0px;
    /*-- w3layouts --*/
    background-color: #fff;
    clear: left;
}

h2.resp-accordion {
    cursor: pointer;
    padding: 5px;
    display: none;
}

.resp-tab-content {
    display: none;
}

.resp-content-active, .resp-accordion-active {
    display: block;
}

.resp-tab-item label {
    margin-right: 8px;
}

/*-- //SAP --*/
/*--tab-grids--*/
.skills .sap_tabs ul {
    margin: 0 0 1em;
    padding: 0;
}

.skills .sap_tabs ul li {
    margin: 0 1.2em 0 0;
}

.resp-tab-active {
    text-shadow: none;
    color: #fff;
    background: #FE7200;
}

.sap_tabs h4 {
    font-size: 1.1em;
    font-weight: 600;
    margin-bottom: 0.5em;
}

.sap_tabs h5 {
    font-size: 1em;
    color: #333;
    font-weight: 500;
}

.sap_tabs h5 span {
    margin-left: 3em;
}

.skills .sap_tabs p {
    font-size: 1em;
    text-align: left;
    color: #999;
}

/* Scratch card image*/
.scratch-card {
    width: 50%;
    padding: 5px;
    margin-top: 60px;
}

/* Overriding elements*/
.profile-grid input[type="tel"].alert {
    color: #d50000;
    font-weight: 500;
    border: 2px solid #d50000;
}
p.alert {
    color: #d50000;
    font-weight: 500;
}
h3.alert {color: #d50000;}
.error {
    color: #d50000;
    font-size: 14px;
    font-weight: 500;
}
.box-error {
    border: 2px solid #d50000 !important;
}

/* International Telephone Input plugin (overriding style)*/
.iti-flag {background-image: url("../images/flags.png");}
.intl-tel-input {
    display: inherit;
    margin-top: 1em;
}
.intl-tel-input .flag-container{
    left: 0;
    font-size: 0.8em;
    text-align: center;
}
.intl-tel-input.allow-dropdown.separate-dial-code .selected-dial-code{padding-left: 10px}
.intl-tel-input .country-list .flag-box, .intl-tel-input .country-list .country-name {
    color: inherit;
    font-weight: normal;
    font-size: 12px;
}
.intl-tel-input .country-list .country .dial-code {
    color: inherit;
    font-size: 14px;
    font-weight: normal;
}

/*-- agileits --*/
/*--//tab-grids--*/
/*--copyright--*/
.copyright {
    margin: 2em 0;
    text-align: center;
}

.copyright p {
    font-size: 1em;
    color: #fff;
    line-height: 1.8em;
    letter-spacing: 1px;
    font-weight: 400;
}

.copyright p a {
    color: #fff;
    -webkit-transition: 0.5s all;
    -moz-transition: 0.5s all;
    transition: 0.5s all;
    -o-transition: 0.5s all;
    -ms-transition: 0.5s all;
}

.copyright p a:hover {
    color: #FE7200;
}
/*--//copyright--*/

/*---- responsive-design -----*/
@media (max-width: 1440px) {
    .main-info {
        width: 55%;
        margin: 3em auto;
    }

    .skills input[type="text"] {
        width: 55.75%;
    }

    .activation-page-for-mobile {
        min-height: 351px;
        padding: 3em 1.5em;
    }
}

@media (max-width: 1366px) {
    .main-info {
        width: 59%;
    }

    .skills input[type="text"] {
        width: 55.75%;
    }

    .activation-page-for-mobile {
        min-height: 374px;
        padding: 2.3em 1.5em;
    }
}

@media (max-width: 1280px) {
    .main-info {
        width: 63%;
    }

    .skills input[type="text"] {
        width: 55.25%;
    }
}

@media (max-width: 1080px) {
    .main-info {
        width: 74%;
    }

    .profile-grid {
        min-height: 298px;
    }
    .activation-page-for-desktop {
        padding: 1.5em;
    }

    .skills input[type="text"] {
        width: 55.75%;
    }

    .activation-page-for-mobile {
        min-height: 374px;
    }
}

@media (max-width: 1024px) {
    .main-info {
        width: 74%;
        margin: 2em auto;
    }

    h1 {
        font-size: 2.8em;
    }

    .profile-grid {min-height: 268px;}

    .profile-grid input[type="text"],
    .profile-grid input[type="password"],
    .profile-grid input[type="email"]{
        width: 83%;
    }

    .skills input[type="text"] {
        width: 55%;
    }

    .skills select {
        width: 40.80%;
    }

    .activation-page-for-desktop {
        padding: 0.6em 1.5em;
        min-height: 374px;
    }

    .activation-page-for-mobile {
        min-height: 374px;
    }
}

@media (max-width: 991px) {
    .main-info {
        width: 72%;
        margin: 2em auto;
    }

    .profile-grid input[type="text"],
    .profile-grid input[type="password"],
    .profile-grid input[type="email"] {
        width: 82%;
    }

    .skills ul li {
        margin: 0 0.8em;
    }

    .main {
        padding: 2em 0 0;
    }

    h1 {
        font-size: 2.6em;
    }

    .skills {
        width: 57%;
    }

    .profile-grid {
	    min-height: 268px;
    }

    .profile-grid3 {
        width: 27%;
    }

    .profile-grid3 input[type="text"] {
        width: 92%;
    }

    .skills input[type="text"] {
	    width: 61.25%;
    }

    .skills select {
	    width: 34%;
    }
}

@media (max-width: 900px) {
    .main-info {
        width: 79%;
    }

    .skills input[type="text"] {
        width: 61%;
    }
}

@media (max-width: 800px) {
    .main-info {
        width: 81%;
    }

    .profile-grid {
        width: 41%;
        min-height: 267px;
    }

    .profile-grid input[type="text"],
    .profile-grid input[type="password"],
    .profile-grid input[type="email"] {
        width: 80%;
    }

    .main-row2 {
        margin-top: 0.8em;
    }

    .profile-grid3 {
        width: 100%;
        float: none;
    }

    .skills {
        width: 92.4%;
        float: none;
    }

    .skills input[type="text"] {
        width: 97.75%;
    }

    .skills select {
        width: 100%;
    }

    .profile-grid3 {
        width: 92.4%;
        float: none;
        margin: .8em 0;
        min-height: 0;
    }

    .profile-grid3 input[type="text"] {
        width: 97.5%;
    }

    .activation-page-for-desktop {
        padding: 0.6em 1.5em;
        min-height: 374px;
    }
    .activation-page-for-desktop h2 {
        font-size: 2.2em;
    }
}

/* iPhone 6 plus landscape mode-> */
@media (max-width: 760px) {
    .profile-grid {min-height: 299px;}
    .skills, .profile-grid3 {width: 92%;}
    .profile-grid input[type="text"],
    .profile-grid input[type="password"],
    .profile-grid input[type="email"] {
        width: 78%;
    }

    .activation-page-for-desktop {
        padding: 1.2em 1.5em;
    }

    .activation-page-for-mobile {
        min-height: 429px;
        padding: 0.6em 1.5em;
    }
}
/* <- iPhone 6 plus */

@media (max-width: 667px) {
    .profile-grid p {
        font-size: 0.9em;
    }

    .profile-grid {
        width: 40%;
        min-height: 295px;
    }

    .profile-grid input[type="text"],
    .profile-grid input[type="password"],
    .profile-grid input[type="email"] {
        width: 74.5%;
    }

    .skills, .profile-grid3 {width: 91%;}

    .profile-grid3 input[type="text"] {
        width: 97.25%;
    }

    .skills input[type="text"] {
        width: 97.25%;
    }

    .activation-page-for-desktop {
        float: none;
        width: 73%;
        position: absolute;
        margin-top: 102px;
    }
    .activation-page-for-desktop-form {
        float: none;
        width: 73%;
        position: absolute;
        margin-top: 450px;
    }
    .activation-page-for-desktop-form.profile-grid input[type="text"],
    .activation-page-for-desktop-form.profile-grid input[type="password"],
    .activation-page-for-desktop-form.profile-grid input[type="email"],
    .activation-page-for-desktop-form.profile-grid input[type="tel"] {
        width: 88%;
    }

    .activation-page-for-mobile {
        float: none;
        margin-top: 102px;
        min-height: 0;
        width: 74%;
        position: absolute;
    }
    .activation-page-for-mobile-form {
        float: none;
        width: 74%;
        margin-top: 450px;
        position: absolute;
    }
    .activation-page-for-mobile-form.profile-grid input[type="text"],
    .activation-page-for-mobile-form.profile-grid input[type="password"],
    .activation-page-for-mobile-form.profile-grid input[type="email"] {
        width: 88.75%;
    }
}

@media (max-width: 640px) {
    .profile-grid {
        padding: 1.2em;
    }

    .profile-grid input[type="text"],
    .profile-grid input[type="password"],
    .profile-grid input[type="email"] {
        width: 74%;
    }

    .profile-grid {
        width: 41%;
    }

    .skills, .profile-grid3 {
        width: 90.5%;
    }

    .activation-page-for-desktop {
        float: none;
        width: 73%;
        position: absolute;
        margin-top: 102px;
    }
    .activation-page-for-desktop-form {
        float: none;
        width: 73%;
        position: absolute;
        margin-top: 450px;
    }
    .activation-page-for-desktop-form.profile-grid input[type="text"],
    .activation-page-for-desktop-form.profile-grid input[type="password"],
    .activation-page-for-desktop-form.profile-grid input[type="email"] {
        width: 88%;
    }

    .activation-page-for-mobile {
        float: none;
        margin-top: 102px;
        min-height: 0;
        width: 74%;
        position: absolute;
    }
    .activation-page-for-mobile-form {
        float: none;
        width: 74%;
        margin-top: 450px;
        position: absolute;
    }
    .activation-page-for-mobile-form.profile-grid input[type="text"],
    .activation-page-for-mobile-form.profile-grid input[type="password"],
    .activation-page-for-mobile-form.profile-grid input[type="email"] {
        width: 88.75%;
    }
}

@media (max-width: 600px) {
    .main-info {
        width: 90%;
    }

    .profile-grid input[type="text"],
    .profile-grid input[type="password"],
    .profile-grid input[type="email"] {
        width: 75.5%;
    }

    .activation-page-for-mobile,
    .activation-page-for-mobile-form,
    .activation-page-for-desktop,
    .activation-page-for-desktop-form {
        width: 83%;
    }
}

@media (max-width: 480px) {
    .main {
        padding: 1em 0 0;
    }

    h1 {
        font-size: 2.1em;
    }

    .main-title {
        float: none;
        text-align: center;
        margin: 0;
        min-width: 0;
    }

    .main-logout {
        float: none;
        text-align: center;
        margin-bottom: 10px;
    }

    .profile-grid {
        width: 90%;
        float: none;
        margin-bottom: 0.8em;
        min-height: 220px;
    }

    .profile-grid input[type="text"],
    .profile-grid input[type="password"],
    .profile-grid input[type="email"] {
        width: 86%;
    }

    .profile-grid3 {min-height: 0;}

    .profile-grid3 input[type="text"] {
        width: 96.25%;
    }

    .skills, .profile-grid3 {
        width: 92%;
        padding: 1em;
    }

    .skills ul li {
        margin: 0 0.2em;
    }

    .skills input[type="text"]{
        width: 96.25%;
    }

    .copyright p {
        font-size: 0.9em;
        padding: 0 1em;
    }

    .activation-page-for-desktop, .activation-page-for-desktop-form {
        position: inherit;
        margin-top: 0;
    }
    .activation-page-for-desktop-form.profile-grid input[type="text"],
    .activation-page-for-desktop-form.profile-grid input[type="password"],
    .activation-page-for-desktop-form.profile-grid input[type="email"],
    .activation-page-for-desktop-form.profile-grid input[type="tel"] {
        width: 84%;
    }

    .activation-page-for-mobile, .activation-page-for-mobile-form {
        position: inherit;
        margin-top: 0;
    }
    .activation-page-for-mobile-form.profile-grid input[type="text"],
    .activation-page-for-mobile-form.profile-grid input[type="password"],
    .activation-page-for-mobile-form.profile-grid input[type="email"] {
        width: 86%;
    }
}

@media (max-width: 414px) {
    .main-title {
        text-align: center;
        margin: 0;
        float: none;
    }

    .main-logout {
        float: none;
        text-align: center;
        margin-bottom: 10px;
    }

    .profile-grid input[type="text"],
    .profile-grid input[type="password"],
    .profile-grid input[type="email"] {
        width: 83.5%;
    }

    .profile-grid select {
        width: 100%;
    }

    .signin-text {
        margin-top: 0.5em;
    }

    .profile-grid input[type="submit"] {
        padding: 0.6em 0;
        width: 101%
    }

    .skills ul li {
        margin: 0 auto 0 6em;
        display: block;
    }

    .skills p {
        font-size: 1.1em;
        margin: 0.5em 0 1em;
        text-align: left;
        margin-left: 1.5em;
    }

    .skills input[type="text"] {
        width: 95.75%
    }

    .skills select {
        width: 100%
    }

    .profile-grid3 input[type="text"] {
        width: 95.75%;
    }

    .profile-grid {
        width: 88%;
    }

    .skills, .profile-grid3 {
        width: 90%;
    }

    .skills .sap_tabs ul li {
        margin: 0 0 0.5em 0;
    }

    h1 {
        font-size: 1.8em;
    }

    .activation-page-for-desktop-form.profile-grid input[type="text"],
    .activation-page-for-desktop-form.profile-grid input[type="password"],
    .activation-page-for-desktop-form.profile-grid input[type="email"],
    .activation-page-for-desktop-form.profile-grid input[type="tel"] {
        width: 82%;
    }

    .activation-page-for-mobile-form.profile-grid input[type="text"],
    .activation-page-for-mobile-form.profile-grid input[type="password"],
    .activation-page-for-mobile-form.profile-grid input[type="email"] {
        width: 83.5%;
    }
}

@media (max-width: 375px) {
    .main {
        padding: 1em 0 0;
    }

    .main-title {
        text-align: center;
        margin: 0;
        float: none;
    }

    .main-logout {
        float: none;
        text-align: center;
        margin-bottom: 10px;
    }

    h1 {
        font-size: 1.6em;
    }

    .main-info {
        margin: 1em auto;
    }

    .profile-grid input[type="text"],
    .profile-grid input[type="password"],
    .profile-grid input[type="email"] {
        width: 82.5%;
    }

    .profile-grid select {
        width: 101%;
    }

    .skills ul li {
        margin: 0 auto 0 5em;
    }

    .skills input[type="text"] {
        width: 95.5%;
    }

    .profile-grid3 input[type="text"] {
        width: 95.5%;
    }

    .activation-page-for-desktop-form.profile-grid input[type="text"],
    .activation-page-for-desktop-form.profile-grid input[type="password"],
    .activation-page-for-desktop-form.profile-grid input[type="email"],
    .activation-page-for-desktop-form.profile-grid input[type="tel"] {
        width: 79%;
    }

    .activation-page-for-mobile-form.profile-grid input[type="text"],
    .activation-page-for-mobile-form.profile-grid input[type="password"],
    .activation-page-for-mobile-form.profile-grid input[type="email"] {
        width: 82.5%;
    }
}

@media (max-width: 320px) {
    .main-title {
        text-align: center;
        margin: 0;
        float: none;
    }

    .main-logout {
        float: none;
        text-align: center;
        margin-bottom: 10px;
    }

    .profile-grid {
        padding: 1em;
        min-height: 270px;
    }

    .profile-grid input[type="text"],
    .profile-grid input[type="password"],
    .profile-grid input[type="email"] {
        width: 79.25%;
    }

    .profile-grid input[type="submit"] {
        padding: 0.6em 0;
        font-size: 0.9em;
    }

    .skills, .profile-grid3 {
        width: 88%;
    }

    .skills input[type="text"] {
        width: 94.5%;
    }

    .profile-grid3 input[type="text"] {
        width: 94.5%;
    }

    h3.title {
        margin-bottom: 0.5em;
    }

    .skills .sap_tabs p {
        font-size: 0.9em;
        margin: 0.5em 0 0;
    }

    .address ul li {
        margin-top: 0.5em;
        font-size: 0.9em;
    }

    .skills ul li {
        margin: 0 auto 0 4em;
    }

    .activation-page-for-desktop-form.profile-grid input[type="text"],
    .activation-page-for-desktop-form.profile-grid input[type="password"],
    .activation-page-for-desktop-form.profile-grid input[type="email"],
    .activation-page-for-desktop-form.profile-grid input[type="tel"] {
        width: 76%;
    }

    .activation-page-for-mobile-form.profile-grid input[type="text"],
    .activation-page-for-mobile-form.profile-grid input[type="password"],
    .activation-page-for-mobile-form.profile-grid input[type="email"] {
        width: 79.25%;
    }
}

/*--//responsive-design---*/