API tools faq
paste
Advertisement
Guest User

Untitled

a guest
Feb 20th, 2018
82
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 13.50 KB | None | 0 0
raw download clone embed print report
  1.  
  2. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js" type="text/javascript">
  3. </script>
  4.  
  5. <script type="text/javascript">
  6. //<![CDATA[
  7.   $(document).ready(function() {
  8.       $( "#cc-m-9334748168" ).wrap( "<div id='home01' />" );
  9.       $( "#cc-m-9335042068" ).wrap( "<div id='home02' />" );
  10.       $( "#cc-m-9335363868" ).wrap( "<div id='home03' />" );
  11.       $( "#cc-m-9335375068" ).wrap( "<div id='home04' />" );
  12.       $( "#cc-m-9335382168" ).wrap( "<div id='home05' />" );
  13.       $( "#cc-m-9335457268" ).wrap( "<div id='home06' />" );
  14.  
  15.   });
  16. //]]>
  17. </script>
  18.  
  19. <style type="text/css">
  20. /*<![CDATA[*/
  21.  
  22.        /* GENERAL */
  23.        .jtpl-header {
  24.        width: 100%;
  25.        position: relative;
  26.        z-index: 4;
  27.        text-align: right;
  28.        padding: 40px 0px 60px 0px;
  29.        box-sizing: border-box;
  30.         background: linear-gradient(to bottom, rgba(255,152,61,1) 0%, rgba(255,123,84,1) 33%, rgba(255,76,121,1) 87%, rgba(255,76,121,1) 100%);
  31.        background-attachment: fixed;
  32.        background-position: center;
  33.        background-repeat: no-repeat;
  34.        background-size: cover;
  35.        }
  36.  
  37.        .jtpl-navigation {
  38.        position: relative;
  39.        }
  40.  
  41.        .cc-m-form-note{
  42.        display:none;
  43.        }
  44.  
  45.        .j-meta-links {
  46.        display:none;
  47.        }
  48.  
  49.        .j-meta-links {
  50.        display:none;
  51.        }
  52.  
  53.        .jtpl-footer__inner{
  54.        display:none;
  55.        }
  56.  
  57.  
  58.        /* NAVIGATION */
  59.        .jtpl-navigation__inner .j-nav-current{      
  60.        border-bottom: none;
  61.        }
  62.  
  63.        .jtpl-navigation__inner a:link{
  64.        border-bottom: none;
  65.        }
  66.  
  67.        .jtpl-navigation__inner .j-nav-current>a:link {      
  68.        border-bottom: none;
  69.        }
  70.        
  71.        .navigation-colors li a:hover, .navigation-colors li a:active, .navigation-colors li a:focus, .navigation-colors li.cc-nav-current&gt;a:link, .navigation-colors li.cc-nav-current&gt;a:visited, .navigation-colors li.cc-nav-parent&gt;a:link, .navigation-colors li.cc-nav-parent&gt;a:visited {
  72.        color: #ffffff;
  73.        background-color: rgba(255,255,255,0);
  74.        }
  75.  
  76.        .jtpl-navigation .j-nav-level-0&gt;li&gt;a:link, .jtpl-navigation .j-nav-level-0&gt;li&gt;a:visited {
  77.        margin-bottom: .4rem;
  78.        }
  79.  
  80.        .jtpl-navigation a:link, .jtpl-navigation a:visited {
  81.        border-radius: .2rem;
  82.        display: block;
  83.        line-height: 30px;
  84.        padding: .5rem 1.5rem;
  85.        margin: 0 .5rem;
  86.        }
  87.  
  88.        .jtpl-mobile-navigation a:link, .jtpl-mobile-navigation a:visited, .jtpl-navigation a:link, .jtpl-navigation a:visited {
  89.        text-decoration: none;
  90.        transition: background-color .3s ease-in,color .3s ease-in;
  91.        box-sizing: border-box;
  92.        }
  93.  
  94.        .navigation-colors li a:before {
  95.        content: "";
  96.        position: absolute;
  97.        height: 1px;
  98.        bottom: 6px;
  99.        left: 37%;
  100.        right: 25%;
  101.        background-color: #faad7e;
  102.        visibility: hidden;
  103.        -ms-transform: scaleX(0);
  104.        -webkit-transform: scaleX(0);
  105.        transform: scaleX(0);
  106.        -webkit-transition: all 0.3s ease-in-out 0s;
  107.        transition: all 0.3s ease-in-out 0s;
  108.        }
  109.  
  110.        .navigation-colors li a:hover:before,
  111.        .navigation-colors li a:active:before,
  112.        .navigation-colors li a:focus:before {
  113.        visibility: visible;
  114.        -ms-transform: scaleX(1);
  115.        -webkit-transform: scaleX(1);
  116.        transform: scaleX(1);
  117.        -webkit-transition: all 0.3s ease-in-out 0s;
  118.        transition: all 0.3s ease-in-out 0s;
  119.        }
  120.  
  121.        .navigation-colors li .cc-nav-current:before {
  122.        content: "";
  123.        position: absolute;
  124.        height: 1px;
  125.        bottom: 5px;
  126.        left: 0%;
  127.        right: 0%;
  128.        background-color: #1d1c1c;
  129.        visibility: visible;
  130.        -ms-transform: scaleX(1);
  131.        -webkit-transform: scaleX(1);
  132.        transform: scaleX(1);
  133.        -webkit-transition: all 0.3s ease-in-out 0s;
  134.        transition: all 0.3s ease-in-out 0s;
  135.        }
  136.        
  137.        @media only screen and (max-width: 1024px) {
  138.        .jtpl-navigation__inner {
  139.        background-color: #1b1a1a;
  140.        text-align: center;
  141.        }
  142.        }
  143.        
  144.        @media only screen and (max-width: 768px) {
  145.        .jtpl-navigation__inner {
  146.        background-color: #1b1a1a;
  147.        text-align: center;
  148.        }
  149.        }
  150.        
  151.        @media only screen and (max-width: 480px) {
  152.        .jtpl-navigation__inner {
  153.        background-color: #1b1a1a;
  154.        text-align: center;
  155.        }
  156.        }
  157.        
  158.        /* HOME 0l */
  159.        #home01 {
  160.        width: 100vw;
  161.        left: calc(-50vw + 50%);
  162.        position: relative;
  163.        background: url("https://99designs-597b67841f38c.jimdo.com/app/download/9358539268/home01+bg.png") repeat center center;
  164.        }
  165.  
  166.        #cc-matrix-2458916668 {
  167.        border-radius: 15px;
  168.        max-width: 470px;
  169.        background: #ffffff;
  170.        box-shadow: 0 0.55556rem 2.22222rem 0 rgba(0,0,0,.1);
  171.        transform: translateY(-4vw);
  172.        margin-bottom: -3vw;
  173.        padding: 3.55556rem 8.33333% 0.77778rem;
  174.        }
  175.    
  176.        
  177.        @media only screen and (max-width: 768px) {
  178.        #home01 {    
  179.        display: -webkit-box;
  180.        display: -ms-flexbox;
  181.        display: flex;
  182.        min-height: 56.25vw;
  183.        -webkit-box-align: end;
  184.        -ms-flex-align: end;
  185.        align-items: flex-end;
  186.        -webkit-box-pack: center;
  187.        -ms-flex-pack: center;
  188.        justify-content: center;
  189.        padding: 0%;
  190.        background-color: #000;
  191.        -webkit-transform: translateY(-10vw);
  192.        transform: translateY(0vw);
  193.        -webkit-box-ordinal-group: 3;
  194.        -ms-flex-order: 2;
  195.        order: 2;
  196.        background-size: cover;
  197.        background-position: 0 100%;
  198.        background-repeat: no-repeat;
  199.        }
  200.  
  201.        #cc-matrix-2458916668 {
  202.        width: 90%;
  203.        padding-left: 1.38889%;
  204.        padding-right: 1.38889%;
  205.        padding: 1.66667rem 8.33333%;
  206.        box-sizing: border-box;
  207.        -ms-flex-item-align: start;
  208.        align-self: flex-start;
  209.        background-color: #fff;
  210.        box-shadow: 0 0.55556rem 2.22222rem 0 rgba(0,0,0,.1);
  211.        -webkit-transform: translateY(-0vw);
  212.        transform: translateY(-13vw);
  213.        margin: auto;
  214.        }
  215.        }
  216.        
  217.        @media only screen and (max-width: 480px) {
  218.        #home01 {    
  219.        display: -webkit-box;
  220.        display: -ms-flexbox;
  221.        display: flex;
  222.        min-height: 56.25vw;
  223.        -webkit-box-align: end;
  224.        -ms-flex-align: end;
  225.        align-items: flex-end;
  226.        -webkit-box-pack: center;
  227.        -ms-flex-pack: center;
  228.        justify-content: center;
  229.        padding: 0%;
  230.        background-color: #000;
  231.        -webkit-transform: translateY(-10vw);
  232.        transform: translateY(0vw);
  233.        -webkit-box-ordinal-group: 3;
  234.        -ms-flex-order: 2;
  235.        order: 2;
  236.        background-size: cover;
  237.        background-position: 0 100%;
  238.        background-repeat: no-repeat;
  239.        }
  240.  
  241.        #cc-matrix-2458916668 {
  242.        width: 90%;
  243.        padding-left: 1.38889%;
  244.        padding-right: 1.38889%;
  245.        padding: 1.66667rem 8.33333%;
  246.        box-sizing: border-box;
  247.        -ms-flex-item-align: start;
  248.        align-self: flex-start;
  249.        background-color: #fff;
  250.        box-shadow: 0 0.55556rem 2.22222rem 0 rgba(0,0,0,.1);
  251.        -webkit-transform: translateY(-0vw);
  252.        transform: translateY(-13vw);
  253.        margin: auto;
  254.        }
  255.        }
  256.        
  257.         /* HOME 02 */
  258.        #home02 {
  259.        width: 100vw;
  260.        left: calc(-50vw + 50%);
  261.        position: relative;
  262.        background: url("https://99designs-597b67841f38c.jimdo.com/app/download/9341851568/home+02+bg.png") repeat center center;
  263.        background-position: center;
  264.        background-size: cover;
  265.        background-repeat: no-repeat;
  266.        background-attachment: fixed;
  267.        }
  268.  
  269.        #cc-matrix-2459031268 {
  270.        border-radius: 15px;
  271.        max-width: 470px;
  272.        background: #ffffff;
  273.        box-shadow: 0 0.55556rem 2.22222rem 0 rgba(0,0,0,.1);
  274.        transform: translateY(-4vw);
  275.        margin-bottom: -3vw;
  276.        padding: 3.55556rem 8.33333% 0.77778rem;
  277.        margin-left: auto;
  278.        }
  279.        
  280.        @media only screen and (max-width: 768px) {
  281.        #home02 {    
  282.        display: -webkit-box;
  283.        display: -ms-flexbox;
  284.        display: flex;
  285.        min-height: 56.25vw;
  286.        -webkit-box-align: end;
  287.        -ms-flex-align: end;
  288.        align-items: flex-end;
  289.        -webkit-box-pack: center;
  290.        -ms-flex-pack: center;
  291.        justify-content: center;
  292.        padding: 0%;
  293.        background-color: #ea725e;
  294.        -webkit-transform: translateY(-10vw);
  295.        transform: translateY(0vw);
  296.        -webkit-box-ordinal-group: 3;
  297.        -ms-flex-order: 2;
  298.        order: 2;
  299.        background-size: cover;
  300.        background-position: 0 100%;
  301.        background-repeat: no-repeat;
  302.        }
  303.  
  304.        #cc-matrix-2459031268 {
  305.        width: 90%;
  306.        padding-left: 1.38889%;
  307.        padding-right: 1.38889%;
  308.        padding: 1.66667rem 8.33333%;
  309.        box-sizing: border-box;
  310.        -ms-flex-item-align: start;
  311.        align-self: flex-start;
  312.        background-color: #fff;
  313.        box-shadow: 0 0.55556rem 2.22222rem 0 rgba(0,0,0,.1);
  314.        -webkit-transform: translateY(-0vw);
  315.        transform: translateY(-7vw);
  316.        margin: auto;
  317.        }
  318.        }
  319.        
  320.        @media only screen and (max-width: 480px) {
  321.        #home02 {    
  322.        display: -webkit-box;
  323.        display: -ms-flexbox;
  324.        display: flex;
  325.        min-height: 56.25vw;
  326.        -webkit-box-align: end;
  327.        -ms-flex-align: end;
  328.        align-items: flex-end;
  329.        -webkit-box-pack: center;
  330.        -ms-flex-pack: center;
  331.        justify-content: center;
  332.        padding: 0%;
  333.        background-color: #ea725e;
  334.        -webkit-transform: translateY(-10vw);
  335.        transform: translateY(0vw);
  336.        -webkit-box-ordinal-group: 3;
  337.        -ms-flex-order: 2;
  338.        order: 2;
  339.        background-size: cover;
  340.        background-position: 0 100%;
  341.        background-repeat: no-repeat;
  342.        }
  343.  
  344.        #cc-matrix-2459031268 {
  345.        width: 90%;
  346.        padding-left: 1.38889%;
  347.        padding-right: 1.38889%;
  348.        padding: 1.66667rem 8.33333%;
  349.        box-sizing: border-box;
  350.        -ms-flex-item-align: start;
  351.        align-self: flex-start;
  352.        background-color: #fff;
  353.        box-shadow: 0 0.55556rem 2.22222rem 0 rgba(0,0,0,.1);
  354.        -webkit-transform: translateY(-0vw);
  355.        transform: translateY(-7vw);
  356.        margin: auto;
  357.        }
  358.        }
  359.        
  360.        /* HOME 03 */
  361.        #home03 {
  362.        width: 100vw;
  363.        left: calc(-50vw + 50%);
  364.        position: relative;
  365.        background: url("https://99designs-597b67841f38c.jimdo.com/app/download/9341854468/home+03+bg.png") repeat center center;
  366.        }
  367.  
  368.        #cc-matrix-2459153968 {
  369.        border-radius: 15px;
  370.        max-width: 470px;
  371.        background: #ffffff;
  372.        box-shadow: 0 0.55556rem 2.22222rem 0 rgba(0,0,0,.1);
  373.        transform: translateY(-4vw);
  374.        margin-bottom: -3vw;
  375.        padding: 3.55556rem 8.33333% 0.77778rem;
  376.        }
  377.        
  378.        /* HOME 04 */
  379.        #home04 {
  380.        width: 100vw;
  381.        left: calc(-50vw + 50%);
  382.        position: relative;
  383.        background: url("https://99designs-597b67841f38c.jimdo.com/app/download/9341854568/home+04+bg.png") repeat center center;
  384.        background-position: center;
  385.        background-size: cover;
  386.        background-repeat: no-repeat;
  387.        background-attachment: fixed;
  388.        }
  389.  
  390.        #cc-matrix-2459157968 {
  391.        border-radius: 15px;
  392.        max-width: 470px;
  393.        background: #ffffff;
  394.        box-shadow: 0 0.55556rem 2.22222rem 0 rgba(0,0,0,.1);
  395.        transform: translateY(-4vw);
  396.        margin-bottom: -3vw;
  397.        padding: 3.55556rem 8.33333% 0.77778rem;
  398.        margin-left: auto;
  399.        }
  400.        
  401.        /* HOME 05 */
  402.        #home05 {
  403.        width: 100vw;
  404.        left: calc(-50vw + 50%);
  405.        position: relative;
  406.        background: url("https://99designs-597b67841f38c.jimdo.com/app/download/9341854868/home+05+bg.png") repeat center center;
  407.        }
  408.  
  409.        #cc-matrix-2459160468 {
  410.        border-radius: 15px;
  411.        max-width: 470px;
  412.        background: #ffffff;
  413.        box-shadow: 0 0.55556rem 2.22222rem 0 rgba(0,0,0,.1);
  414.        transform: translateY(-4vw);
  415.        margin-bottom: -3vw;
  416.        padding: 3.55556rem 8.33333% 0.77778rem;
  417.        }
  418.        
  419.        /* HOME 06 */
  420.        #home06 {
  421.        width: 100vw;
  422.        left: calc(-50vw + 50%);
  423.        position: relative;
  424.        background: url("https://99designs-597b67841f38c.jimdo.com/app/download/9341855068/home+06+bg.png") repeat center center;
  425.        background-position: center;
  426.        background-size: cover;
  427.        background-repeat: no-repeat;
  428.        background-attachment: fixed;
  429.        }
  430.  
  431.        #cc-matrix-2459189668 {
  432.        border-radius: 15px;
  433.        max-width: 470px;
  434.        background: #ffffff;
  435.        box-shadow: 0 0.55556rem 2.22222rem 0 rgba(0,0,0,.1);
  436.        transform: translateY(-4vw);
  437.        margin-bottom: -3vw;
  438.        padding: 3.55556rem 8.33333% 0.77778rem;
  439.        margin-left: auto;
  440.        }
  441.  
  442.  
  443. /*]]>*/
  444.  
  445. </style>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!