/*-----------------------------------------------------------------------------------*/
/*	MEDIA QUERIES */
/*-----------------------------------------------------------------------------------*/
@media only screen and (min-width: 1100px) {
    #tools_img_desk2 {
        width: 400px;
    height: 221px;}
    .box-hello {font-size: 1vw;}
    .box-hello p {font-size: 2vw;position: relative;top: 9em;padding:0 0;}

}/* END Mobile Portrait 768 to 959 */

@media only screen and (min-width: 960px) and (max-width: 1100px) {

    .box-hello {font-size: 1vw;}
    .box-hello p {font-size: 2vw;position: relative;top: 9em;padding:0 0;}

}/* END Mobile Portrait 768 to 959 */





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

    .personal-info {height: 100%;
        width: 100%;
        padding: 50px 0px 50px 0px;
        margin: 0px 0px 0px 0px;
        border: none;
        float: left;}
    .personal-info p {font-size: 9px;}
    .forms li.form-row1, .forms li.form-row2, .forms li.form-row3  {margin: 0px 0px;padding:0px 0px;}
    .forms li.button-row {margin: 0px 0px 0px 0px;border-radius: 0px 0px 0px 0px;padding: 0px 0px 0px 0px;}
    a.button, .forms fieldset .btn-submit, #commentform input #submit {border-radius: 0px 0px 0px 0px;}

    .forms fieldset .text-area, #comment
    form textarea  {min-height: 46vh;}
    input {border-radius: 0px 0px 0px 0px;border-left:none; border-top:none;}
    input:focus {border-radius: 0px 0px 0px 0px;}
 .box-hello p {
    font-size: 3vw;
    position: relative;
    top: 11em;
  }


}/* END Mobile Portrait 768 to 959 */








/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 565px) and (max-width: 767px) {



    .textbio {background-position: center center;margin: 0px auto;}
    #mailbox {margin: 10px 0px;}
    .box-email {padding: 0% 10% 0% 10%;}
    .personal-info {height: 100%;
        width: 100%;
        padding: 50px 0px 50px 0px;
        margin: 0px 0px 0px 0px;
        border: none;
        float: left;}
    .personal-info p {font-size: 12px;}
    .forms li.form-row1, .forms li.form-row2, .forms li.form-row3  {margin: 0px 0px;padding:0px 0px;}
    .forms li.button-row {margin: 0px 0px 50px 0px;border-radius: 0px 0px 0px 0px;padding: 0px 0px 0px 0px;}
    a.button, .forms fieldset .btn-submit, #commentform input #submit {border-radius: 0px 0px 0px 0px;}
    .box-email h5 {padding: 0px 20px 0px 20px;}
    .forms fieldset .text-area, #commentform textarea  {min-height: 55vh;}
    input {border-radius: 0px 0px 0px 0px;border-left:none; border-top:none;}
    input:focus {border-radius: 0px 0px 0px 0px;}



    #mobile_home6 {min-height:150vh;}
    #mobile_home3 {border: none;}
    #tools2 {width: 80%;right: 0;margin: 0px 0px;float: none;}
    #tools2 p {width: auto;float: none;font-size: 14px;}
    #bg-circle {
            background: #161514 url(../images/mobile/mobile_circlebg.jpg);
            background-position-x: 0%;
            background-position-y: 0%;
            background-repeat: repeat;
            background-size: auto;
            background-repeat: no-repeat;
            background-size: 100%;
            background-position: top left;
            min-height: 100vh;
            margin: 0px 0px 20px 0px;
            padding: 200px 0px 0px 0px;
            overflow: visible;
            width: 100%;
          }
    #mobile-servizi1 p, #mobile-servizi2 p, #mobile-servizi3 p, #mobile-servizi4 p {
            font-size: 2.8vw;
            width: 80%;
          }
    #frame_img2, #frame_img3 { height: 350px;}
    .box-hello p {font-size: 4vw;position: relative;top: 9em;padding: 0 0;}

}/* END Mobile Portrait 480 to 767 */




/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (min-width:351px) and (max-width: 564px) {

    .textbio {background-position: center center;margin: 0px auto;}


    section {min-width: 200vw;}
    #mainback{border: none;height: auto;}
    #bg-circle {
        background: #161514 url(../images/mobile/mobile_circlebg.jpg);
        background-position-x: 0%;
        background-position-y: 0%;
        background-repeat: repeat;
        background-size: auto;
        background-repeat: no-repeat;
        background-size: 100%;
        background-position: top left;
        min-height: 100vh;
        margin: 0px 0px 20px 0px;
        padding: 200px 0px 0px 0px;
        overflow: visible;
        width: 100%;
    }

    #img-hand {height: 12vh;}
    #main-text1 h1 {font-size: 18vw;}
    #main-text1 h3 {font-size: 5vw;}
    #main-text1 h2 {font-size: 3vw;letter-spacing:1px;margin-bottom: 0vh;}
    #vertical_network p, #vertical_code p, #vertical_graphic p {font-size: 4vw;}
    .box-righe2, #bgrighe {height:auto;margin-bottom:20vh;}
    #tableft-btn a {font-size:9vw;padding: 5vh 1vh;}
    #main-text1 {box-sizing: content-box;}
    .box-hello p {font-size: 7vw;
        position: relative;
        top: 8em;padding:0px 0px 0px 0px;}
    .box-hello {
        width:100%;
        top:5%;
        font-size:3vw;
        min-height: 44vh;
        margin: 0% 0% 0% 0%;
    }
    .box-righe2:hover .riga3 {min-height:100%;}
    #tableft-btn {margin-top: 150px;}
    #text-circle3 {
        height: 100vh;
        top: 0vh;
        box-shadow: none;
        width: 100%;
        border-radius: 0px 0px;}
    #text-circle p, #text-circle2 p {padding: 10px 20px 30px 51px;font-size: 9px;font-weight: bold;margin: 10px 0px 0px 0px;right: 0px;
        line-height: 125%;}
    #text-circle4 p, #text-circle5 p {padding: 10px 20px 30px 51px;font-size: 9px;
        font-weight: bold;margin: 10px 0px 0px 0px;right: 0px;line-height:125%;
        letter-spacing: 0px;border-radius: 8px;text-align: right;background: #1615149c;position: absolute;width: 200px;top:50%;
        }
    #bg-circle3 p {width: auto;float: none;font-size: 8px;}
    #tools {width: 50%;right: 0;margin: 0px auto;float: none;}
    #tools2 {
        width: 80%;
        right: 0;
        margin: 0px auto;
        float: none;
      }
    #tools2 p {
        width: auto;
        float: none;
        font-size: 11px;
      }
    #text-circle, #text-circle2, #text-circle4, #text-circle5 {margin: 0px 0px 30px 0px;}

    .open-circle, .open-circle2 {
        background-position: 10% 50% !important;
        width: 90% !important;
        left: 5% !important;
        height: 100% !important;
        padding: 0px 0px 0px 0px;
        border: 2px solid #f26008 !important;
        box-shadow: none !important;
        margin: 0px auto !important;}
    .open-circle4, .open-circle5 {
        background-position: 10% 50% !important;
        width: 90% !important;
        left: 5% !important;
        height: 100% !important;
        padding: 0px 0px 0px 0px;
        border: 2px solid #f26008 !important;
        box-shadow: none !important;
        margin: 0px auto !important;}

    #mailbox {margin: 10px 0px;}
    .box-email {padding: 0% 10% 0% 10%;}
    .personal-info {height: 100%;width: 100%;padding: 50px 0px 50px 0px;margin: 0px 0px 0px 40px;border: none;float: right;}
    .forms li.form-row1, .forms li.form-row2, .forms li.form-row3  {margin: 0px 0px;padding:0px 0px;}
    .forms li.button-row {margin: 0px 0px 50px 0px;border-radius: 0px 0px 0px 0px;padding: 0px 0px 0px 0px;}
    a.button, .forms fieldset .btn-submit, #commentform input #submit {border-radius: 0px 0px 0px 0px;}
    .box-email h5 {padding: 0px 20px 0px 20px;}
    .forms fieldset .text-area, #commentform textarea  {min-height: 55vh;}
    input {border-radius: 0px 0px 0px 0px;border-left:none; border-top:none;}
    input:focus {border-radius: 0px 0px 0px 0px;}

    .servizi8 {background-size: 100%;background-position: center center;height: 26vh;}
    .bigbox8 {
        height: 26vh;
        margin: 0px 0px 0px 140px;
        min-height: 26vh;
        padding: 0px 0px 0px 0px;
        width: 40%;
        top: 300px;
        opacity: 0.5;
      }
    #mobile_home3 {border:none;}
    #mobile_home6 { min-height:150vh; }


}/* END Mobile Portrait 251 to 479 */



/* Mobile (devices and browsers) */
@media only screen and (max-width: 350px) {
    .box-smartphone {
        top: 40.5em;
        left: 10em;
      }
    .box-robot {
        width: 100%;
        height: 40em;
        position: relative;
        background: transparent;
        min-height: 273px;
        overflow: hidden;
        margin: 0;
        padding: 0px 0px 0px 0px;
        z-index: 1;
        border: none;
        border-radius: 0;
        font-size: 2.2vw;
        transition: 1s;
        transform: none;
        top: 0;
        left: 0;
        margin: 70px 0px 0px 0px;
        }

    section {min-width: 200vw;}
    #mainback{border: none;height: auto;}
    #bg-circle {
        background: #161514 url(../images/mobile/mobile_circlebg.jpg);
        background-repeat: no-repeat;
        background-size: 100%;
        background-position: top left;
        min-height: 100vh;
        margin: 0px 0px 20px 0px;
        padding: 200px 0px 0px 0px;
        overflow: visible;
        width: 100%;;
    }
    #img-hand {height: 12vh;}
    #main-text1 h1 {font-size: 18vw;}
    #main-text1 h3 {font-size: 5vw;}
    #main-text1 h2 {font-size: 3vw;letter-spacing:1px;margin-bottom: 0vh;}
    #vertical_network p, #vertical_code p, #vertical_graphic p {font-size: 4vw;}
    .box-righe2, #bgrighe {height:auto;margin-bottom:20vh;top:60px;}
    #tableft-btn a {font-size:9vw;padding: 5vh 1vh;}
    #main-text1 {box-sizing: content-box;}
    #box-circle3 p {font-size:5vw;position:relative;padding:0px 0px 0px 0px;}
    .box-hello {
        width:100%;
        top:14vh;
        font-size:3vw;
        min-height: 44vh;
        margin: 0% 0% 10% 0%;
    }
    .box-righe2:hover .riga3 {min-height:100%;}
    #tableft-btn {margin-top: 150px;}
    #text-circle3 {height: 100vh;top: 0vh;box-shadow: none;width: 100%;border-radius: 0px 0px;padding: 10vw 10vw 0vw 10vw;}
    #text-circle p, #text-circle2 p, #text-circle4 p, #text-circle5 p {
    padding: 10px 10px 30px 80px;
    font-size: 4.8vw;
    font-weight: bold;
    margin: 10px 0px 0px 0px;
    right: 0px;
    line-height: 121%;
    color: #e3dcbf;width:100%;border-radius: 1vh 1vh 0vh 0vh;
    }

    #bg-circle3 p {width: auto;float: none;font-size: 11px;}
    #tools2 p {width: auto;float: none;font-size: 11px;}
    #tools2 {width: 80%;right: 0;margin: 0px auto;float: none;}
    #tools {width: 80%;right: 0;margin: 0px auto;float: none;}
    #text-circle, #text-circle2, #text-circle4, #text-circle5 {margin: 0px 0px 30px 0px;left: -5%;border-left: none;border-radius: 0vh 1vh 1vh 0vh;}
    #text-circle {background: #161514 url(../images/mobile/mobile_textcirclebg.jpg) no-repeat;
        background-position: 90% 50%;background-size: auto;}
    #text-circle2 {background: #161514 url(../images/mobile/mobile_textcirclebg2.jpg) no-repeat;
        background-position: 90% 50%;background-size: auto;}
    #text-circle4 {background: #161514 url(../images/mobile/mobile_textcirclebg4.jpg) no-repeat;
        background-position: 90% 50%;background-size: auto;}
    #text-circle5 {background: #161514 url(../images/mobile/mobile_textcirclebg5.jpg) no-repeat;
        background-position: 90% 50%;background-size: auto;}

    .open-circle, .open-circle2 {
    background-position: 10% 50% !important;
    width: 90% !important;
    left: 5% !important;
    height: 100% !important;
    padding: 0px 0px 0px 0px;
    border: 2px solid #f26008 !important;
    box-shadow: none !important;
    margin: 0px auto !important;}
    .open-circle4, .open-circle5 {
        background-position: 10% 50% !important;
        width:100% !important;
        left: 5% !important;
        height: 100% !important;
        padding: 0px 0px 0px 0px;
        border: 2px solid #f26008 !important;
        box-shadow: none !important;
        margin: 0px auto !important;}


        .textbio {background-position: center center;margin: 0px auto;}

    #mailbox {margin: 10px 0px;}
    .box-email {padding: 0% 3% 0% 3%;}
    .personal-info {
        height: 100%;
        width: 94%;
        padding: 40px 0px 10px 0px;
        margin: 0px auto;
        border: none;
        float: left;
        position: relative;
      }    .personal-info p {color: #f26008;text-align:left;}
    .forms li.form-row1, .forms li.form-row2, .forms li.form-row3  {margin: 0px 0px;padding:0px 0px;}
    .forms li.form-row4 {margin: 145px 0px 0px 0px;}


        .forms li.button-row {margin: 0px 0px 50px 0px;border-radius: 0px 0px 0px 0px;padding: 0px 0px 0px 0px;}
        a.button, .forms fieldset .btn-submit, #commentform input #submit {border-radius: 0px 0px 0px 0px;border-left:none; border-right:none;}
        .box-email h5 {padding: 0px 20px 0px 20px;}
        .forms fieldset .text-area, #commentform textarea {min-height: 45vh;}
        input:focus {border-radius: 0px 0px 0px 0px;}
        .servizi8 {background-size: 100%;background-position: center center;height: 26vh;}




    .bigbox8 {
        height: 26vh;
        margin: 0px 0px 0px 140px;
        min-height: 26vh;
        padding: 0px 0px 0px 0px;
        width: 40%;
        top: 300px;
        opacity: 0.5;
      }
      .ob_box {margin: 0px auto;}
      #mobile_home3 {top: 0vh;border: none;border-radius: 0px;}



}/* END Mobile Portrait 350 */