@charset "UTF-8";
@font-face {
    font-family: 'zocial';
    font-style: normal;
    font-weight: normal;
    src: url('http://weloveiconfonts.com/api/fonts/zocial/zocial-regular-webfont.eot');
    src: url('http://weloveiconfonts.com/api/fonts/zocial/zocial-regular-webfont.eot?#iefix') format('eot'), 
        url('http://weloveiconfonts.com/api/fonts/zocial/zocial-regular-webfont.woff') format('woff'), 
        url('http://weloveiconfonts.com/api/fonts/zocial/zocial-regular-webfont.ttf') format('truetype'), 
        url('http://weloveiconfonts.com/api/fonts/zocial/zocial-regular-webfont.svg#zocialregular') format('svg');
}
.zocial-acrobat:before{content:"\00E3"}.zocial-amazon:before{content:"a"}.zocial-android:before{content:"&"}.zocial-angellist:before{content:"\00D6"}.zocial-aol:before{content:"\""}.zocial-appnet:before{content:"\00E1"}.zocial-appstore:before{content:"A"}.zocial-bitbucket:before{content:"\00E9"}.zocial-bitcoin:before{content:"2"}.zocial-blogger:before{content:"B"}.zocial-buffer:before{content:"\00E5"}.zocial-call:before{content:"7"}.zocial-cal:before{content:"."}.zocial-cart:before{content:"\00C9"}.zocial-chrome:before{content:"["}.zocial-cloudapp:before{content:"c"}.zocial-creativecommons:before{content:"C"}.zocial-delicious:before{content:"#"}.zocial-digg:before{content:";"}.zocial-disqus:before{content:"Q"}.zocial-dribbble:before{content:"D"}.zocial-dropbox:before{content:"d"}.zocial-drupal:before{content:"\00E4"}.zocial-dwolla:before{content:"\00E0"}.zocial-email:before{content:"]"}.zocial-eventasaurus:before{content:"v"}.zocial-eventbrite:before{content:"|"}.zocial-eventful:before{content:"'"}.zocial-evernote:before{content:"E"}.zocial-facebook:before{content:"f"}.zocial-fivehundredpx:before{content:"0"}.zocial-flattr:before{content:"%"}.zocial-flickr:before{content:"F"}.zocial-forrst:before{content:":"}.zocial-foursquare:before{content:"4"}.zocial-github:before{content:"g"}.zocial-gmail:before{content:"m"}.zocial-google:before{content:"G"}.zocial-googleplay:before{content:"h"}.zocial-googleplus:before{content:"+"}.zocial-gowalla:before{content:"@"}.zocial-grooveshark:before{content:"8"}.zocial-guest:before{content:"?"}.zocial-html5:before{content:"5"}.zocial-ie:before{content:"6"}.zocial-instagram:before{content:"\00DC"}.zocial-instapaper:before{content:"I"}.zocial-intensedebate:before{content:"{"}.zocial-itunes:before{content:"i"}.zocial-klout:before{content:"K"}.zocial-lanyrd:before{content:"-"}.zocial-lastfm:before{content:"l"}.zocial-linkedin:before{content:"L"}.zocial-macstore:before{content:"^"}.zocial-meetup:before{content:"M"}.zocial-myspace:before{content:"_"}.zocial-ninetyninedesigns:before{content:"9"}.zocial-openid:before{content:"o"}.zocial-opentable:before{content:"\00C7"}.zocial-paypal:before{content:"$"}.zocial-pinboard:before{content:"n"}.zocial-pinterest:before{content:"1"}.zocial-plancast:before{content:"P"}.zocial-plurk:before{content:"j"}.zocial-pocket:before{content:"\00E7"}.zocial-podcast:before{content:"`"}.zocial-posterous:before{content:"~"}.zocial-print:before{content:"\00D1"}.zocial-quora:before{content:"q"}.zocial-reddit:before{content:">"}.zocial-rss:before{content:"R"}.zocial-scribd:before{content:"}"}.zocial-skype:before{content:"S"}.zocial-smashing:before{content:"*"}.zocial-songkick:before{content:"k"}.zocial-soundcloud:before{content:"s"}.zocial-spotify:before{content:"="}.zocial-statusnet:before{content:"\00E2"}.zocial-steam:before{content:"b"}.zocial-stripe:before{content:"\00A3"}.zocial-stumbleupon:before{content:"/"}.zocial-tumblr:before{content:"t"}.zocial-twitter:before{content:"T"}.zocial-viadeo:before{content:"H"}.zocial-vimeo:before{content:"V"}.zocial-vk:before{content:"N"}.zocial-weibo:before{content:"J"}.zocial-wikipedia:before{content:","}.zocial-windows:before{content:"W"}.zocial-wordpress:before{content:"w"}.zocial-xing:before{content:"X"}.zocial-yahoo:before{content:"Y"}.zocial-yelp:before{content:"y"}.zocial-youtube:before{content:"U"}

body {
    font-family: Arial, Helvetica, sans-serif;
}

#main {
    width: 100%; 	
}

#logo {
    margin:auto;
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
}

#logo div {
    flex: 0 1 50%;
    padding: 0 1rem;
}

#logo div:last-child {
    display: flex;
    justify-content: flex-end;
}

#contents{
    width:100%;
    margin:auto;
    background-color: #d6d0c5;
    padding-top:5px;
    padding-bottom:100px;
}

#content {
    width:60%;
    margin: 30px auto;
    background-color:#3f5da8;
    padding: 30px 0 50px 0;
    text-align:center;
    box-shadow: 0px 0px 5px 3px #999;
}

#qrcode_android {
    width: 300px;
    height: 300px;
    border-radius:999em;   
    -moz-border-radius:999em; 
    -webkit-border-radius:999em;
    -o-border-radius: 999em;   
    background-color:#ffffff;
    margin:auto;	
}

#qrcode_ios {
    width: 300px;
    height: 300px;
    border-radius:999em;   
    -moz-border-radius:999em; 
    -webkit-border-radius:999em;
    -o-border-radius: 999em;   
    background-color:#ffffff;
    margin:auto;	
}

#qrcode img {
    padding:52px;
    width: 65%;	
}

.title {
    padding: 0;
    margin:0;
    color: #ffffff;
    font-weight: bold;
    letter-spacing: -1.3px;
    min-height: 65px; 
    text-shadow: 0 1px 0 #333;	
}

#content p {
    color:#ffffff;
    font-family:Arial, Helvetica, sans-serif;
    font-size:16px;	
    font-weight:bold;
    margin: 30px auto;		
}

#content p a {
    color: #ffffff;
}

#specifiche {
    font-family:Arial, Helvetica, sans-serif;
    color:#ffffff;
    font-size:11px;	
    width: 60%;
    margin: 40px auto;
    padding: 10px 0;
    border-top:1px solid #ffffff
}

#link a{
    font-family:Arial, Helvetica, sans-serif;
    color:#ffffff;
    font-size:14px;
}


/*  appgate*/

#content_appgate{
    width:60%;
    margin: 30px auto;
    background-color:#3f5da8;
    padding: 0 0 20px 0;
    box-shadow: 0px 0px 5px 3px #999;
    text-align:left;	
}

.row {
    border-bottom: 1px dashed #ffffff;	
    height:80px;
    padding:20px;
    text-align:left;	
}

.row img {
    float: left;	
}

.title_app {
    padding: 0;
    margin: 20px 0 0 30px;
    color: #ffffff;
    font-weight: bold;
    font-size: 34px;
    letter-spacing: -1.3px;
    text-shadow: 0 1px 0 #333;
    float:left;
}

.title_app a {
    color: #ffffff;
    text-decoration:none;
}


/* download app 2 versioni */

#qrcode_container {
}

.qrcode { 
    width: 300px;
    height: 300px;
    border-radius:999em;   
    -moz-border-radius:999em; 
    -webkit-border-radius:999em;
    -o-border-radius: 999em;   
    background-color:#ffffff;
    display:inline-block;
    margin-right:40px;
    margin-top:20px	
}

.qrcode img {
    padding:52px;
    width: 65%;	
}

/* zocial */

[class*="zocial-"]:before {
    font-family: 'zocial', sans-serif;
    font-size:36px;
    color: #ffffff;
}


.qrcode p {
    color:#ffffff;
    font-family:Arial, Helvetica, sans-serif;
    font-size:16px;	
    font-weight:bold;
    margin: 30px auto;	
}

@media  (max-width: 1024px) {
    #content, #logo, #content_appgate {
        width:95%;
    }
}

@media  (max-width: 980px) {
    #content, #logo, #content_appgate {
        width:95%;
    }
}

@media  (max-width: 800px) {
    #content, #logo, #content_appgate {
        width:95%;
    }

    .qrcode {
        margin-top:50px;
        margin-right:0;
    }
}

@media  (max-width: 390px) {
    .title_app{
        font-size:18px;		
    }

    .qrcode {
        margin-top:50px;
        margin-right:0;
    }

    #content p {
        font-size:20px;
        margin: 30px auto;
    }

    #specifiche {
        margin-top: 60px;
        font-size:14px;	
        width: 90%;
    }
}

@media  (max-width: 360px) {
    #logo {
        width:100%;
    }

    #contents {
        padding: 1px 0 20px 0;	
    }

    #content, #content_appgate {
        width:95%;		
    }

    #content p {
        font-size:20px;
        margin: 30px auto;
    }

    #specifiche {
        margin-top: 60px;
        font-size:14px;	
        width: 90%;
    }

    .title_app{
        font-size:17px;		
    }

    .qrcode {
        margin-top:50px ;
        margin-right:0;
    }
}

@media  (max-width: 320px) {
    .title_app{
        font-size:18px;	
    }

    .qrcode { 
        margin-top:50px ;
        margin-right:0;
        width:260px;
        height:260px;
    }
}