
/*region Common Documents styles */
body {
    min-width: 1200px;
}

.menu .container .products {
    -moz-opacity: 0;
    opacity: 0;
    filter: alpha(opacity=0);
}

.text {
    color: #444;
    font-size: 1.375em;
    padding-top: 0;
    line-height: 34px;
}

h2.section-title, h3.section-title, p.section-title {
    margin: 0;
    padding: 0 0 10px;
    color: #323232;
    font-size: 2.75em;
    font-weight: 600;
}

p.section-subtitle {
    padding: 0 0 30px;
    color: #999;
    font-size: 2em;
    line-height: 120%;
    font-weight: normal;
}

.content-block {
    padding: 60px 0;
    border: none;
    border-bottom: 1px solid #f2f2f2;
    overflow: hidden;
}

.content-block .content {
    height: 100%;
    box-sizing: border-box;
}

.content-block .description, .content-block .illustration {
    width: 50%;
}

.next_panel {
    position: absolute;
    bottom: 20px;
    left: 50%;
    display: block;
    width: 40px;
    height: 60px;
    margin: 0 0 0 -20px;
    background: url("/img/common/arrow.svg") no-repeat center center;
    background-size: 40px 60px;
}

.bottom {
    background-color: #fff;
}

.btn {
    display: inline-block;
    min-width: 215px;
    height: 44px;
    margin: 0 10px 0 0;
    padding: 0 30px;
    border: 1px solid #e1e1e1;
    background-color: #fff;
    color: #8c8c8c;
    font-size: 1.063em;
    font-weight: 400;
    line-height: 44px;
    text-align: center;
    border-radius: 6px;
}

.btn.green {
    border: 1px solid #3fc322;
    background-color: #3fc322;
    color: #fff;
}
.btn.green:hover {
    color: #fff;
}
/*endregion*/


/*region Main Banner styles */
.main-banner {
    position: relative;
    height: 800px;
    padding: 0;
    background-color: #919191;
    box-sizing: border-box;
}

.main-banner video {
    position: absolute;
    top: 0;
    bottom: 0;
    left: -10%;
    width: 120%;
}

.main-banner .content {
    padding: 100px 0 0;
}

.main-banner .prefix {
    padding: 0 0 10px;
    color: #fff;
    font-size: 1.625em;
    font-weight: 400;
    line-height: 100%;
}

.main-banner .logo {
    display: block;
    margin: 0 auto;
    width: 140px;
    height: auto;
}

.main-banner .title {
    padding: 20px 0 30px;
    color: #fff;
    font-size: 4.125em;
    font-weight: 600;
    line-height: 100%;
}

.main-banner .subtitle {
    padding: 0 0 60px;
    color: #fff;
    font-size: 2em;
    font-weight: 400;
    line-height: 120%;
}

.main-banner .video_player {
    display: inline-block;
    height: 48px;
    padding: 0 0 0 60px;
    color: #fff;
    font-size: 1.625em;
    font-weight: 600;
    line-height: 48px;
    background: url("/img/common/playbtn.svg") no-repeat 0 0;
    background-size: 48px 48px;
}

.main-banner .btn {
    margin: 60px 0 0;
}
/*endregion*/

/*region Quote block styles */
.quote-block {
    width: 1000px;
    margin: 0 auto;
    padding: 0 0 0 46px;
    background: url("/img/common/quote.svg") no-repeat 0 0;
    background-size: 30px 25px;
}

.quote-block .quote-text {
    padding: 0 0 25px;
    color: #333;
    font-size: 2em;
    font-weight: 400;
    line-height: 120%;
}

.quote-block .quote-author {
    display: inline-block;
}

.quote-block .quote-author.the-verge {
    width: 169px;
    height: auto;
}

.quote-block .quote-author.usa-today {
    width: 152px;
    height: auto;
}
/*endregion*/

/*region Open Any styles*/
.open-any .section-subtitle {
    width: 1000px;
    margin: 0 auto;
}

.open-any .text {
    width: 1000px;
    margin: 0 auto;
    padding: 0 0 60px;
}

.open-any .devices {
    display: block;
    width: 1114px;
    height: auto;
    margin: 60px auto 0;
}

.open-any .icon {
    display: inline-block;
    width: 140px;
    color: #333;
    font-size: 1.5em;
    font-weight: 400;
}

.open-any .icon img {
    display: block;
    margin: 0 auto 10px;
    width: 91px;
    height: auto;
}
/*endregion*/

/*region Files One Place styles*/
.files-one-place .description {
    width: 400px;
    padding: 140px 0 0;
}

.files-one-place .illustration {
    width: 700px;
}

.files-one-place .illustration .devices {
    display: block;
    width: 737px;
    height: auto;
    margin: 0 0 0 -37px;
}
/*endregion*/

/*region Drag n Drop styles */
.drag-drop {
    position: relative;
    height: 800px;
    padding: 0;
    background-color: #919191;
}

.drag-drop video {
    position: absolute;
    top: 0;
    bottom: 0;
    left: -10%;
    width: 120%;
}

.drag-drop .content {
    padding: 180px 0 0;
}

.drag-drop .section-title {
    width: 700px;
    margin: 0 auto;
    padding: 0 0 10px;
    color: #fff;
    font-size: 2.75em;
    font-weight: 600;
    text-transform: none;
}

.drag-drop .section-subtitle {
    width: 1000px;
    margin: 0 auto;
    padding: 0 0 60px;
    color: #fff;
    font-size: 2em;
    font-weight: 400;
}

.drag-drop .video_player {
    display: inline-block;
    height: 48px;
    padding: 0 0 0 60px;
    color: #fff;
    font-size: 1.625em;
    font-weight: 600;
    line-height: 48px;
    background: url("/img/documents/20170525/playbtn.svg") no-repeat 0 0;
    background-size: 48px 48px;
}

.drag-drop .btn {
    margin: 60px 0 0;
}
/*endregion*/

/*region Music and Videos styles*/
.music-videos .section-subtitle {
    width: 1000px;
    margin: 0 auto;
}

.music-videos .text {
    width: 1060px;
    margin: 0 auto;
}

.music-videos .devices {
    display: block;
    width: 1534px;
    height: auto;
    margin: 60px 0 0 -187px;
}
/*endregion*/

/*region Sync iPhone and iPad styles*/
.sync-iphone-ipad .section-subtitle {
    width: 980px;
    margin: 0 auto;
}

.sync-iphone-ipad .text {
    width: 1010px;
    margin: 0 auto;
    padding: 0 0 60px;
}

.sync-iphone-ipad .devices {
    display: block;
    width: 1373px;
    height: auto;
    margin: 0 0 0 -60px;
}
/*endregion*/

/*region Download Files styles*/
.download-files .description {
    width: 460px;
    padding: 80px 0 0;
}

.download-files .illustration {
    width: 640px;
}

.download-files .illustration .devices {
    display: block;
    width: 1085px;
    height: auto;
    margin: 0 0 0 -445px;
}
/*endregion*/

/*region Documents How-Tos styles */
.documents-howtos .howto-list {
    padding: 60px 0 0;
}

.documents-howtos .howto-element {
    display: inline-block;
    width: 230px;
    margin: 0 0 60px;
}

.documents-howtos .howto-element .icon {
    display: block;
    width: 123px;
    height: auto;
    margin: 0 auto 10px;
}

.documents-howtos .howto-element p {
    position: relative;
    display: inline;
    padding: 0;
    color: #0878e7;
}

.documents-howtos .howto-element p:after {
    content: "";
    position: absolute;
    right: -15px;
    bottom: 7px;
    width: 7px;
    height: 7px;
    border-bottom: 2px solid #0878e7;
    border-right: 2px solid #0878e7;
    z-index: 100;
    -moz-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
/*endregion*/


/* Retina styles */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {

    /*region Open Any styles*/
    .open-any .devices {
        content: url("/img/documents/20170525/ipad_iphone_docs_2x.png");
    }
    /*endregion*/

    /*region Files One Place styles*/
    .files-one-place .illustration .devices {
        content: url("/img/documents/20170525/iphone_services_2x.png");
    }
    /*endregion*/

    /*region Sync iPhone and iPad styles*/
    .sync-iphone-ipad .devices {
        content: url("/img/documents/20180607/wifitr_dsk_2x.png");
    }
    /*endregion*/

    /*region Download Files styles*/
    .download-files .illustration .devices {
        content: url("/img/documents/20170525/ipad_download_2x.png");
    }
    /*endregion*/

    /*region Documents How-Tos styles */
    .documents-howtos .howto-element .icon.icon-files {
        content: url("/img/documents/20170525/files_2x.png");
    }

    .documents-howtos .howto-element .icon.icon-mail {
        content: url("/img/documents/20170525/mail_2x.png");
    }

    .documents-howtos .howto-element .icon.icon-web {
        content: url("/img/documents/20170525/web_2x.png");
    }

    .documents-howtos .howto-element .icon.icon-musicvideo {
        content: url("/img/documents/20170525/musicvideo_2x.png");
    }

    .documents-howtos .howto-element .icon.icon-cloud {
        content: url("/img/documents/20170525/cloud_2x.png");
    }

    .documents-howtos .howto-element .icon.icon-twoway {
        content: url("/img/documents/20170525/twoway_2x.png");
    }

    .documents-howtos .howto-element .icon.icon-read {
        content: url("/img/documents/20170525/read_2x.png");
    }

    .documents-howtos .howto-element .icon.icon-download {
        content: url("/img/documents/20170525/dewnload_2x.png");
    }

    .documents-howtos .howto-element .icon.icon-new {
        content: url("/img/documents/20170525/new_2x.png");
    }

    .documents-howtos .howto-element .icon.icon-transfer {
        content: url("/img/documents/20170525/transfer_2x.png");
    }
    /*endregion*/

}
