/*
Name: BS_Solar2020
Version: 1.0
Author: Balint Peter
Author URI: http://jupinet-service.hu
*/

*{font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; margin:0px; padding:0px;-webkit-font-smoothing: antialiased;}
html{padding-top:0px !important;width:100%;}
body{font-family: 'Open Sans', "Helvetica", sans-serif;  background-repeat: repeat;color: #3d4451; background-color: #fff; border:1px; padding:0px; margin: 0px; width:100%; height: 100%; text-align:center; display:block; font-size:14px;}
b, strong{font-weight:bold;}
em{font-style:italic;}
del{text-decoration:line-through;}
ins{text-decoration:none; font-size:larger; padding:5px;}
.hp{display:none;}
section{width:1350px;margin:0px auto; box-sizing: content-box;padding:0px;display:inline-block;max-width: 90%;}
p{line-height: 1.4;}
.grid{width:100%; height:auto; box-sizing:content-box;display:inline-block;padding:0px;}
.grid .column{float:left;height:auto; box-sizing:content-box;}
.grid .column.fullwidth{width:100%;}
.grid .column.halfwidth{width:50%;}
.grid .column.onethird{width:33%;}
.grid .column.twothird{width:66%;}
.grid .column.onethird{width:33%;}
.grid .column.twothird{width:66%;}
.grid .column.onefourth{width:25%;}
.grid .column.onefifth{width:20%;}
.grid .column.twofifth{width:40%;}
.grid .column.onesixth{width:calc(100% / 6) ;}
.grid .column.twosixth{width:calc((100% / 6) * 2 );}
.grid .column.threesixth{width:calc((100% / 6) * 3 );}
.grid .column.oneseventh{width:calc(100% / 7);}
.grid .column.oneninth{width:calc(100% / 9);}
.grid .column.twoninth{width:calc((100% / 9) * 2);}
.grid .column.oneeight{width:calc(100% / 8);}
.grid .column.twoeight{width:calc((100% / 8) * 2 );}
.grid .column.sixeight{width:calc((100% / 8) * 6 );}

.grid .column.twoseventh{width:28%;}
.grid .column.threeseventh{width:42%;}
.grid .column.threefourth{width:75%;}
.grid .column.left{text-align:left;}
.grid .column.right{text-align:right;}
.grid .column.rightline{float:right;}
.grid .column.center{text-align:center;}
.grid .column.distinct{padding-top:70px;padding-bottom:70px;}
.grid .column.nicedistinct{padding-top:30px;padding-bottom:30px;}
.grid .column.veryniceistinct{padding-top:15px;padding-bottom:15px;}
.grid .column.normal-minheight{height: 60px;}
.grid .column.head{padding:40px 0px;}
.grid .column.halfheight{height: 45%; margin-bottom:5%;}
.grid .column.minheight{min-height: 150px;}
.grid .column.image{background-size:cover; background-position: center center;position: relative;}
.grid .column.text{height:320px; padding:15px 5%; width:40%; }
.grid .column #holden{padding:20px; width:auto; height: auto; box-sizing: content-box; }
.grid .column.halfrow{width:calc(50% - 50px);padding:0px 25px 0px 25px;}
.grid .column.nicebottombordered{border-bottom:1px solid #ccc;}
.grid .column.image img{max-width:80%; height:auto;  margin:10px auto;}
.left{float:left;}
.right{float:right;}
.bordertop{border-top:1px dashed #ccc;}
a{color:#321d6c;text-decoration: none;}
a:hover{color:#321d6c;text-decoration: none;}

h2{font-family: 'Libre Baskerville', serif;font-size:30px;}
p.italic{letter-spacing: 1px;font-weight: 100;line-height: 1.6; margin-top:5px;}

.slide{width:100%; text-align: center; min-height: auto; padding:0px; margin:0px;}
.slide{width:100%; padding:20px 0px; margin:0px; display:inline-block; height:auto;}

header{position: fixed; z-index: 20; top:0px; left:0px; right:0px; min-height: 30px; padding:30px 0px;-moz-transition: all .25s cubic-bezier(0.37, 0.31, 0.2, 0.85);
    -o-transition: all .25s cubic-bezier(0.37, 0.31, 0.2, 0.85);    -webkit-transition: all .25s cubic-bezier(0.37, 0.31, 0.2, 0.85);    transition: all .25s cubic-bezier(0.37, 0.31, 0.2, 0.85);text-align:center;}
header section{text-align:left;}
    header:before{position: absolute; top:0px; bottom:0px; left:0px; right:0px; background:#fff;content:"";
    will-change: transform;    -moz-transform: scale(1, 0);    -ms-transform: scale(1, 0); -moz-transition: all .25s cubic-bezier(0.37, 0.31, 0.2, 0.85);
    -o-transition: all .25s cubic-bezier(0.37, 0.31, 0.2, 0.85);    -webkit-transition: all .25s cubic-bezier(0.37, 0.31, 0.2, 0.85);    transition: all .25s cubic-bezier(0.37, 0.31, 0.2, 0.85);   -webkit-transform: scale(1, 0);    transform: scale(1, 0);    -moz-transform-origin: 0 0;    -ms-transform-origin: 0 0;
    -webkit-transform-origin: 0 0; transform-origin: 0 0;}
header.move:before,header:hover:before{    -moz-transform: scale(1, 1);    -ms-transform: scale(1, 1);    -webkit-transform: scale(1, 1);    transform: scale(1, 1);}
header logo{height: 40px; width:200px;margin:-10px auto 0px auto; background-size: contain; background-repeat: no-repeat; background-position: center;display:inline-block;position: relative; z-index: 1;}
header logo{background-image:url("images/logo.png"); opacity:0.8;}
header.move logo,header:hover logo{background-image:url("images/logo.png");opacity:1.0;}

header nav{float:right;display:inline-block;opacity:0;}
header nav item{display:inline-block; font-size:16px; letter-spacing: -0.5px; line-height: 20px; font-weight: bold; padding:8px 25px;cursor:pointer; position: relative;opacity:1;color:#e74c3c;border:2px solid #fff;border-radius: 8px;}
header nav item:hover{border:2px solid #e74c3c;background: #e74c3c;color:#fff;}
header nav item:hover a{color:#fff;}
header nav item.cornered{border:2px solid #e74c3c;}
header.move nav,header:hover nav{opacity:1;}

header.color1 nav item{}
header.color1 nav item:hover{}

header nav item.nolink{border:none;text-align: right;max-height:40px;padding:0px;font-size:18px; letter-spacing: 1px;margin-left: 39px;padding-left:39px;max-width:180px;position:relative;float:right;border-left:1px dotted #e74c3c;border-radius: 0px;margin-top:-10px; margin-bottom:-20px;padding-top:10px; padding-bottom:10px;}
header nav item.nolink span{font-size:10px; letter-spacing: 1px; line-height: 14px; text-transform: uppercase; font-weight: 100;}
header nav item.nolink:hover{background:none; color:#e74c3c;}

#about{display:inline-block;background:#ecf0f1;padding:100px 0px;position: relative;}
#about p{max-width:65%; text-align:justify; margin:10px auto; text-align: center;  line-height: 1.8;}
#about h2{font-family: 'Libre Baskerville', serif; margin:0px auto;   letter-spacing: 1px; font-size:20px;}

#modem_carousel{padding:60px 0px;}
#modem_carousel .carousel{width:100%; display:inline-block;}
#modem_carousel .carousel item{width:calc((100% / 5) - 30px); margin:10px; padding:5px; float:left;overflow: hidden;}
#modem_carousel .carousel item img{max-width:200px; width:auto;  height:80px;max-height: 250px;margin-bottom:20px; }
#modem_carousel .carousel item h3{font-weight: bold; color:#e74c3c;margin-top:20px;margin-bottom:10px;}
#modem_carousel .carousel item:nth-child(2) img{min-width: initial;}
#modem_carousel .carousel item:nth-child(5) img{min-width: initial;}

.countdown {width:80%; height:auto; display:inline-block;}
.countdown item{float:left;width:calc((100% / 4) - 20px);margin-right:10px; padding:0px 5px; text-align:center;line-height: 1.4;font-weight: 100; text-transform: uppercase;}
.countdown item label{width:100%; text-align:center; font-weight: bold;font-size:25px;}


#letter{display:inline-block; background:#2b3349; background-image:url("images/chalkbg.jpg"); background-repeat:repeat-y; background-size:cover; background-position:top center;padding:50px 0px 0px 0px;position: relative; }
#letter .letterdesign{width:100%; position: relative;}
#letter .letterdesign .paper{margin-top:150px;width:calc(100% - 46px); background:#fff; padding:20px;padding-top:50px;min-height: 300px;padding-bottom:500px;position: relative;margin-bottom:-40px;}
#letter .letterdesign .paper h2{margin-bottom:50px;font-weight: bold;}
#letter .letterdesign .paper p{font-size:12px; text-align:justify; line-height: 1.4; margin-bottom:10px;}
#letter .letterdesign .paper:after{float:left;content:""; background-repeat: no-repeat; background-size: contain; background-position: bottom center; height:550px;margin-left:-10px; margin-right:-10px; position: absolute; bottom:0px; left:0px; right:0px;background-image:url("images/letter_bottom.png");-webkit-box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.19);
    -moz-box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.19);    box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.19);}
#letter .letterdesign .paper:before{float:left; content:""; background-repeat:no-repeat; background-size:contain; background-position:top left;background-image:url("images/letter_top.png");position: absolute; top:-150px; left:-43px;right:0px; height:269px; }
#letter .story{margin:60px 0px; text-align:left;width:65%;margin-left:20px;display:inline-block; float:none; opacity:0.6; color:#929295;}
#letter .story:hover{opacity:1;}
#letter .story.right{text-align:right;}
#letter .story.first{margin-top:300px;}
#letter .story h3{color:#929295;font-family: 'Lobster', cursive; float:left;font-size:30px;margin-bottom:10px;}
#letter .story h3 number{opacity:1.0 !important;color:#fff;}
#letter .story p{color:#929295;float:left; font-style:italic;line-height: 1.6; text-align: justify; font-size:13px;}



#video_head{min-height:600px; height: 80vh; margin:0px; padding:0px; text-align: center;display:block;background-size:cover; background-position: center;position: relative;}
#video_head .disclaimer{color:#fff; font-style:italic;margin-top:20px; opacity:0.7;}
#video_head .bg{position:absolute; top:0px; left:0px; right:0px; bottom:0px; max-height: 100vh; opacity:0.75;z-index: -1;}
#video_head section{padding-top:140px;}
#video_head section img{margin-top:-20px;}
#video_head .bg{background: linear-gradient(45deg, #ecf0f1 1%, #efefef 64%, #fff 97%);
    background-image: -ms-linear-gradient(45deg, #ecf0f1 1%, #efefef 64%, #fff 97%);
    background-image: -moz-linear-gradient(45deg, #ecf0f1 1%, #efefef 64%, #fff 97%);
    background-image: -o-linear-gradient(45deg, #ecf0f1 1%, #efefef 64%, #fff 97%);
    background-image: -webkit-linear-gradient(45deg, #ecf0f1 1%, #efefef 64%, #fff 97%);
    background-image: linear-gradient(45deg, #ecf0f1 1%, #efefef 64%, #fff 97%);}
#video_head .video{position: absolute; top:0px; bottom:0px; left:0px; right:0px;overflow: hidden;z-index: -1; }
#video_head .video video{width:100%; background-size: cover;float:left;}   
#video_head .column .adatbekero{color:#fff;}
#video_head h1{font-family: 'Lobster', cursive;color:#e74c3c;font-size:60px; line-height: 1.8; margin:0px auto; }
#video_head h2{font-family: 'Open Sans', "Helvetica", sans-serif; color:#000; margin:0px auto; font-weight:bold; letter-spacing: -1px; font-size:16px;margin-bottom:10px;}
#video_head p{color:#000; margin-bottom:10px; font-size:20px; text-align:left; line-height: 1.6;}
#video_head button{border:none;margin-right:10px;cursor:pointer; border:2px solid #e74c3c; border-radius:10px; background:#e74c3c; letter-spacing: 1px; color:#fff; font-weight:bold; text-transform: uppercase; padding:10px 20px;}
#video_head .buttons{margin-top:20px;}
#video_head button:hover{background:none; color:#e74c3c;}
#video_head button.more:hover{background:#e74c3c;color:#fff;}
#video_head button.more{border-color:#e74c3c; background:none; color:#e74c3c;}
#video_head button.go{  animation: shake 5s cubic-bezier(.36,.07,.19,.97) infinite;    transform: translate3d(0, 0, 0);    backface-visibility: hidden;
    perspective: 1000px;}


#dontleaveusman{position: fixed; top:0px; bottom:0px; left:0px; right:0px;z-index:200;opacity:0; display:none;background:rgba(0,0,0,0.8);text-align: center;-webkit-transition: all 0.5s ease-in-out;  -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;  transition: all 0.5s ease-in-out;}
  #dontleaveusman #fog{position: absolute; top:0px; bottom:0px; left:0px; right:0px;}
  #dontleaveusman.show{opacity:1;display:block;}
  #dontleaveusman #popup{margin-top:0px;padding:25px;background:#fff; border:1px solid #eee;width:450px; margin:0px auto;-webkit-transition: all 1s ease-in-out;  -moz-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out;  transition: all 1s ease-in-out;}
  #dontleaveusman.show #popup{margin-top:125px;}
  
  #dontleaveusman #popup h3{font-size:20px; font-weight: bold; color:#e74c3c;margin-bottom:10px; letter-spacing:-1px;}
  #dontleaveusman #popup p{font-size:14px; font-weight: 400; color:#666; line-height: 1.5; margin-bottom:20px;}

footer{width:100%; padding:0px; height:auto;}
#splash{height:80vh;background:#2b3349;position: relative; overflow:hidden}
#splash #draw{position: absolute; bottom:0px; left:0px; right:0px; height:300px; overflow:hidden;background-image:url("images/splash_foot_1.png");background-repeat: no-repeat; background-size: contain; background-position: bottom center; -webkit-animation: blinking 20s linear infinite;}
#splash section{ padding-bottom:100px;}
#splash section h1{font-family: 'Lobster', cursive;color:#fff;font-size:30px; line-height: 1.8; margin:0px auto;padding-top:100px;}
#splash section h2{font-family: 'Libre Baskerville', serif;color:#fff; margin:0px auto;  font-weight:100; letter-spacing: 1px; opacity:0.8;margin-bottom:20px;font-size:16px;}
#splash section p{margin:0px auto;font-weight: normal;line-height: 2.5;font-size:14px;color:#fff;width:70%; margin:0px auto;}
#splash canvas#snow{position: absolute; top:0px; bottom:0px; left:0px; right:0px;}
#splash snowfall:after{
    position:absolute; width:0; height:0; overflow:hidden;  opacity:0;
    content:url("images/splash_foot_1.png") url("images/splash_foot_2.png") url("images/splash_foot_3.png") url("images/splash_foot_4.png");  
 }


 #textblock{padding:50px 0px;}
 #textblock .distinct{padding-top:30px; padding-bottom:30px;}
 #textblock p.italic{max-width:70%; text-align: center; margin:10px auto;}
 #textblock p.story{text-align: justify; font-size:14px; line-height: 1.8; margin-bottom:15px;width:calc(100% - 100px);margin-right:100px;}
 #textblock .imaged img{max-width:90%;}

 #ajanlat{width:100%; display:inline-box; position:relative;padding-bottom:20px;}
 #ajanlat:after{content:""; float:left; position: absolute; top:0px; bottom:0px; left:0px; right:0px;z-index: 1; background: linear-gradient(45deg, #0B4182 1%, #e74c3c 64%, #40BAF5 97%);
     background-image: -ms-linear-gradient(45deg, #0B4182 1%, #e74c3c 64%, #40BAF5 97%);    background-image: -moz-linear-gradient(45deg, #0B4182 1%, #e74c3c 64%, #40BAF5 97%);
     background-image: -o-linear-gradient(45deg, #0B4182 1%, #e74c3c 64%, #40BAF5 97%);    background-image: -webkit-linear-gradient(45deg, #0B4182 1%, #e74c3c 64%, #40BAF5 97%);
     background-image: linear-gradient(45deg, #0B4182 1%, #e74c3c 64%, #40BAF5 97%);opacity:0.9;}
#ajanlat section{position: relative; z-index: 2;padding-top:25px;}

#ajanlat  .cardholder{ margin:20px 0px;   display: -ms-flexbox;    display: -webkit-flex;    display: flex;    -webkit-flex-direction: row;    -ms-flex-direction: row;    flex-direction: row;    -webkit-flex-wrap: nowrap;    -ms-flex-wrap: nowrap;  position: relative;  flex-wrap: nowrap;    -webkit-justify-content: space-around;    -ms-flex-pack: distribute;    justify-content: space-around;    -webkit-align-content: stretch;   -ms-flex-line-pack: stretch;    align-content: stretch;    -webkit-align-items: flex-start;    -ms-flex-align: start;    align-items: flex-start;}
#ajanlat  .cardholder card{background:#fff;    -webkit-order: 0;    -ms-flex-order: 0;    order: 0;    -webkit-flex: 0 1 auto;    -ms-flex: 0 1 auto;    flex: 0 1 auto;    -webkit-align-self: auto;    -ms-flex-item-align: auto;    align-self: auto;}
#ajanlat  .cardholder:after{content:"VAGY"; font-weight: bold; font-size:16px; position: absolute; top:50%; width:100%; text-align:center; color:#fff; left:0px; right:0px;}
#ajanlat  .cardholder card{min-width:270px; text-align:center; min-height: 500px; max-width:calc((100% / 3) - 30px); padding:10px;border-radius:20px;color:#333; box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);}
#ajanlat  .cardholder card .buttonstuff button:hover{animation: shake 3s cubic-bezier(.36,.07,.19,.97) both;    transform: translate3d(0, 0, 0);    backface-visibility: hidden;    perspective: 1000px;}
#ajanlat  .cardholder card icon{margin:20px auto; width:200px;height:200px;border-radius:200px;background:#e74c3c;display:block;overflow:hidden;}
#ajanlat  .cardholder card icon img{text-align:center; max-width:70%; max-height: 70%;filter:invert(100%);margin-top:25px;}
#ajanlat  .cardholder card h2{color:#e74c3c; font-weight: bold;width:100%; font-size:18px;margin-bottom:5px;}
#ajanlat  .cardholder card h3{font-style:italic; color:#666; font-size:12px;margin:0px; margin-bottom:15px; font-weight: normal; letter-spacing: 1px;}
#ajanlat  .cardholder card p{width:90%; text-align:justify; color:#000; font-size:12px; }
#ajanlat  .cardholder card p.most{font-weight: bold;text-align:justify; text-align-last:center;margin-bottom:20px;font-size:13px;}
#ajanlat  .cardholder card p.notso{font-size:11px;line-height: 1.6;text-align:justify; text-align-last:center;}
#ajanlat  .cardholder card subprice{line-height: 1.5;padding:15px 0px;box-sizing: border-box;}
#ajanlat  .cardholder card .buttonstuff{padding-top:20px; padding-bottom:20px;}
#ajanlat  .cardholder card .buttonstuff button{cursor:pointer;margin-right:10px;cursor:pointer; border:2px solid #e74c3c; border-radius:10px; background:#e74c3c; letter-spacing: 1px; color:#fff; font-weight:bold; text-transform: uppercase; padding:10px 20px;}
#ajanlat  .cardholder card .buttonstuff button:hover{background:#fff;color:#e74c3c;}
#ajanlat  .cardholder card .buttonstuff button.alter{background:#fff; color:#e74c3c;}
#ajanlat  .cardholder card .buttonstuff button.alter:hover{background:#e74c3c; color:#fff;}
#ajanlat  .cardholder card subprice span{color:#e74c3c; letter-spacing: 1px;}
#ajanlat  .cardholder card subprice strong{letter-spacing: -1px;}

#ajanlat section h2{color:#fff;}
#ajanlat section h3{color:#fff; font-weight: 16px; font-weight: bold;margin-top:30px;margin-bottom:5px;line-height: 1.5;}
#ajanlat section p{color:#fff;font-style:italic; font-size:13px;width:100%;margin-left:auto; margin-right:auto;margin-top:10px; margin-bottom:10px;}

 #last_cta{width:100%; display:inline-box; position:relative; height: 300px;position: relative; z-index: 1;}
#last_cta:after{content:""; float:left; position: absolute; top:0px; bottom:0px; left:0px; right:0px;z-index: 1; background: linear-gradient(45deg, #0B4182 1%, #e74c3c 64%, #40BAF5 97%);
    background-image: -ms-linear-gradient(45deg, #0B4182 1%, #e74c3c 64%, #40BAF5 97%);    background-image: -moz-linear-gradient(45deg, #0B4182 1%, #e74c3c 64%, #40BAF5 97%);
    background-image: -o-linear-gradient(45deg, #0B4182 1%, #e74c3c 64%, #40BAF5 97%);    background-image: -webkit-linear-gradient(45deg, #0B4182 1%, #e74c3c 64%, #40BAF5 97%);
    background-image: linear-gradient(45deg, #0B4182 1%, #e74c3c 64%, #40BAF5 97%);opacity:0.9;}
#last_cta section{position: relative; z-index: 2;padding-top:50px;}
#last_cta section h2{color:#fff;margin-bottom:15px;}
#last_cta section p{color:#fff;font-style:italic; font-size:12px;max-width:80%;margin-left:auto; margin-right:auto;}
    #last_cta section .comment p{font-size:12px;    color: #38404e; font-weight: 500;line-height: 1.4;text-align: right;font-style: italic;font-size:10px;}    
    #last_cta section .contacthold{width:calc(25% );text-align: center; height: 100px;position:relative;}
    #last_cta section .error input{border:1px solid #e83b35;}
   
    #last_cta section .legycsapo{display: none !important;}
    
    #last_cta section #subtitle{width:90%;-webkit-transition: all 1s ease-in-out;   transition: all 1s ease-in-out;  padding-bottom:5px; padding-left:5px; text-align: left; padding-top:20px; height: 12px;font-size: 12px; font-weight: normal; text-transform: uppercase;color:#fff;opacity:0.2;}
    #last_cta section .column:hover #subtitle{opacity:1;}
    #last_cta section .contacthold #errornote{position: absolute;-webkit-transition: all 1s ease-in-out;   transition: all 1s ease-in-out; left:5px; bottom:-15px; background:#fff;padding:5px 10px;border-radius: 5px;line-height:11px; font-size:11px; font-weight: bold; text-align: left; color:#f00;opacity:0;}
    #last_cta section .error #errornote{opacity:1;}
    #last_cta section input{color:#efefef;}
    #last_cta section input, #last_cta section button{height: 49px;    margin-bottom: 34px;    padding: 2px 16px 0px;
        border-style: none;    border-radius: 2px;    background-color: rgba(255, 255, 255, 0.4);
        font-size: 16px;    line-height: 49px;    vertical-align: middle; width:85%;}
    #last_cta section input::placeholder{color:#efefef;}
    #last_cta section button{-webkit-appearance: button;    border-radius: 3px;    background-color: #fff;    -webkit-transition: all 100ms ease-in-out;
        transition: all 100ms ease-in-out;  
        color: #e74c3c;    font-size: 16px;    font-weight: 400;    text-decoration: none;    border: 0;   display: block;
        width: 100%;    height: 49px;  cursor: pointer;font-weight: bold;}    
    #last_cta section button:hover{background:#fff;}    
    #last_cta section input.invalid{box-shadow: inset 0 -2px 0 0px #ccc;}

    #faux_cta{width:100%; display:inline-box; position:relative; height: 200px;position: relative; z-index: 1;}
    #faux_cta:after{content:""; float:left; position: absolute; top:0px; bottom:0px; left:0px; right:0px;z-index: 1; background: linear-gradient(45deg, #0B4182 1%, #e74c3c 64%, #40BAF5 97%);
        background-image: -ms-linear-gradient(45deg, #0B4182 1%, #e74c3c 64%, #40BAF5 97%);    background-image: -moz-linear-gradient(45deg, #0B4182 1%, #e74c3c 64%, #40BAF5 97%);
        background-image: -o-linear-gradient(45deg, #0B4182 1%, #e74c3c 64%, #40BAF5 97%);    background-image: -webkit-linear-gradient(45deg, #0B4182 1%, #e74c3c 64%, #40BAF5 97%);
        background-image: linear-gradient(45deg, #0B4182 1%, #e74c3c 64%, #40BAF5 97%);opacity:0.9;}
    #faux_cta section{position: relative; z-index: 2;padding-top:50px;}
    #faux_cta section h2{color:#fff;margin-bottom:15px;}
    #faux_cta section p{color:#fff;font-style:italic; font-size:12px;max-width:80%;margin-left:auto; margin-right:auto;}
    #faux_cta  section button{-webkit-appearance: button;    border-radius: 3px;    background-color: #fff;    -webkit-transition: all 100ms ease-in-out;
        transition: all 100ms ease-in-out;  
        color: #e74c3c;    font-size: 16px;    font-weight: 400;    text-decoration: none;    border: 0;   display: block;
        width: 100%;  max-width:200px; margin:20px auto 0px auto;;    height: 49px;  cursor: pointer;font-weight: bold;}    
    #faux_cta section button:hover{background:#fff;}    

    footer{width:100%; background:#333333; position: relative;}
footer .hero h2{font-weight: 100; font-size:25px; line-height: 30px; letter-spacing: 1px;color:#fff;font-family: 'Libre Baskerville', serif;}
footer .hero p{color:#fff; font-style:italic;margin-top:5px;}
footer .hero h2 a.button{font-family: 'Open Sans', sans-serif;font-size:14px; line-height: 14px; padding:10px 15px;border-radius: 10px; border:2px solid #fff;color:#fff;cursor:pointer; position: relative; top:-5px;margin-left: 10px;font-weight: bold;}
footer .hero h2 a.button:hover{background:#e74c3c;border-color:#e74c3c;}
footer .misc{background-color: rgba(0, 0, 0, 0.1);    color: #fff;       padding-bottom: .5em;    padding-top: .5em;}
footer .stuff h3{float:left;color:#fff; text-align: left; width:100%; font-size:14px; line-height: 14px; padding:20px 0px;font-weight:bold;margin-top:20px;}
footer .stuff item{width:calc(100% - 30px); padding:10px 5px; text-align: left;float:left;color: rgba(255, 255, 255, 0.5);line-height: 1.4;font-size:12px; font-style: italic;}
footer .stuff item span{font-weight: bold;font-style: initial;}
footer .stuff item.link a{color: rgba(255, 255, 255, 0.5);}
footer .stuff item.link{cursor:pointer;}
footer .stuff p.smartmoney{opacity:0.7;color:#fff; font-size:11px; text-align:justify; line-height: 1.5; max-width:80%; margin-bottom:15px;}
footer .stuff p.smartmoney:hover{opacity:1.0;}
footer .stuff item.link:hover,footer .stuff item.link:hover a{color:rgba(255,255,255,0.9);}
footer .stuff p.desc{color: rgba(255, 255, 255, 0.5);text-align: left; line-height: 1.5;}
footer logo{height: 40px; width:200px;margin-top:10px;margin-bottom:0px; background-size: contain; background-repeat: no-repeat; background-position: center;display:inline-block; float:left;background-image:url("images/logo.png"); opacity:0.3;margin-right: 10px;}
footer .misc item{-webkit-font-smoothing: antialiased;    font-weight: 500;color: rgba(255, 255, 255, 0.5); font-size:14px; line-height: 20px; padding:20px 10px;float:left;margin-right:10px;}
footer .misc item i.fa{font-size:20px;}
footer .misc .right item{float:right;text-align: right;}
footer .misc item.link{cursor:pointer;}
footer .misc item.link:hover{color: rgba(255, 255, 255, 0.9);}

footer #subscribe{width:100%; padding:20px 0px;}
footer #subscribe .text{width:calc(100% - 20px); padding:10px 10px;border:none;border-radius: 5px;font-size:14px; line-height: 14px;    background: rgba(255, 255, 255, 0.2);    color: #fff;}
footer #subscribe .text:focus{border:none;outline:none;}
footer #subscribe .button{border-radius: 5px; border:2px solid #e74c3c;padding:9px 10px; font-size:14px; line-height: 14px;font-weight: bold;background:#e74c3c;cursor:pointer; color:rgba(255, 255, 255, 0.8);margin-left:5px;}
footer #subscribe .button:hover{background:none;color:#e74c3c;}

#hello{height: 420px;box-shadow: 0 1px 6px rgba(0, 0, 0, 0.12), 0 1px 4px rgba(0, 0, 0, 0.24);margin:-30px 0px;position:relative;}
#hello:after{content:""; float:left; position: absolute; top:0px; bottom:0px; left:0px; right:0px;z-index: 0; background: linear-gradient(45deg, #0B4182 1%, #e74c3c 64%, #40BAF5 97%);
    background-image: -ms-linear-gradient(45deg, #0B4182 1%, #e74c3c 64%, #40BAF5 97%);    background-image: -moz-linear-gradient(45deg, #0B4182 1%, #e74c3c 64%, #40BAF5 97%);
    background-image: -o-linear-gradient(45deg, #0B4182 1%, #e74c3c 64%, #40BAF5 97%);    background-image: -webkit-linear-gradient(45deg, #0B4182 1%, #e74c3c 64%, #40BAF5 97%);
    background-image: linear-gradient(45deg, #0B4182 1%, #e74c3c 64%, #40BAF5 97%);opacity:0.9;}
#hello section{width:1080px;}
#hello .grid .column{height: 480px; position: relative; top:-40px; z-index: 2;-webkit-box-shadow: 0px 5px 13px -1px rgba(0,0,0,0.5);-moz-box-shadow: 0px 5px 13px -1px rgba(0,0,0,0.5);box-shadow: 0px 5px 13px -1px rgba(0,0,0,0.5);}
#hello .grid .column.blued{background:#e83b35;}
#hello .grid .column.imaged{background-image:url("images/hello.jpg"); background-position: top center; background-size: cover;}
#hello .grid .column.texted{width:40%; padding:40px 5%; height: 400px;}
#hello h1{color:#000; font-size: 40px; letter-spacing: -1; font-weight: bold;margin-bottom:5px;}  
#hello h2{font-size:16px; text-transform: uppercase; font-weight: 100;color:#fff;letter-spacing: 1px; margin-bottom:20px;padding-left: 5px; }
#hello p{color: #111; line-height: 1.4; margin-bottom: 5px; font-size: 14px; text-align: justify;}
#hello #signature{background-image:url("images/signiture.png");width:118px; height: 71px;margin-top:15px;}

 @media (min-width:320px) and (max-width:375px){
    body{width:100%;} 
    header{max-width: 100%;}
    .slide{width:100%;}
    #video_head{min-height: 800px;}
    #video_head .bg{    min-height: 100vh;  max-height:initial; }
    #video_head .video video{display:none;}
    #present_video iframe{width:100%; min-height:300px; } 
    #video_head .grid .column:nth-child(2){display:none;}
    .grid .column{width:100% !important;}
    #video_head .adatbekero input#geo{max-width:80%; width:initial;}
    #video_head h1{font-size:35px; line-height: 1.5; text-align:center;}
    #video_head h2{line-height: 1.5; text-align:center;margin-bottom:20px; font-size:14px; text-transform: none; }
    #video_head .adatbekero{line-height: 1.6; font-size:13px;text-align:center;}
    #video_head .buttons{width:100%; text-align:center;}
    #video_head .buttons button{margin:10px auto;}
    #about p{max-width:90%;line-height: 1.6;}
    #letter .letterdesign .paper{padding-bottom:50px;}
    #letter .letterdesign .paper:after{display:none;}
    #letter .story.first,#letter .story{margin:50px auto !important; width:95%;}
    #splash section h1{font-size:30px; line-height: 1.6;padding-top:30px;}
    #splash section h2{line-height: 1.5; text-align:center;margin-bottom:20px; font-size:14px; text-transform: none;}
    #splash section p{font-size:13px;width:95%; line-height: 1.5;}
    #last_cta{ height:auto;}
    #textblock p.story{width:100%; margin-right:0px;}
    #modem_carousel .carousel item{width:100%; max-width:300px; float:none;margin-bottom:20px;}
    #modem_carousel .carousel item img{min-height: initial;min-width: initial;}
    #ajanlat .cardholder card{display:block;margin:20px auto; max-width:calc(90% - 30px);}
    #ajanlat .cardholder{display:block; text-align:center;}
    #ajanlat  .cardholder:after{display:none;}
    footer{overflow-y: hidden;}
    footer .stuff p.smartmoney{max-width:95%;}
           }     
           
     @media (min-width:375px) and (max-width:480px){
        body{width:100%;} 
        header{max-width: 100%;}
        .slide{width:100%;}
        #video_head{min-height: 700px; height:auto;}
        #video_head .bg{    min-height: 100vh;  max-height:initial; }
        #video_head .video video{display:none;}
        #present_video iframe{width:100%; min-height:300px; } 
        #video_head .grid .column:nth-child(2){display:none;}
        .grid .column{width:100% !important;}
        #video_head .adatbekero input#geo{max-width:80%; width:initial;}
        #video_head h1{font-size:35px; line-height: 1.5; text-align:center;}
        #video_head h2{line-height: 1.5; text-align:center;margin-bottom:20px; font-size:14px; text-transform: none; }
        #video_head .adatbekero{line-height: 1.6; font-size:13px;text-align:center;}
        #video_head .buttons{width:100%; text-align:center;}
        #video_head .buttons button{margin:10px auto;}
        #about p{max-width:90%;line-height: 1.6;}
        #letter .letterdesign .paper{padding-bottom:50px;}
        #letter .letterdesign .paper:after{display:none;}
        #letter .story.first,#letter .story{margin:50px auto !important; width:95%;}
        #splash section h1{font-size:30px; line-height: 1.6;padding-top:30px;}
        #splash section h2{line-height: 1.5; text-align:center;margin-bottom:20px; font-size:14px; text-transform: none;}
        #splash section p{font-size:13px;width:95%; line-height: 1.5;}
        #last_cta{ height:auto;}
        #textblock p.story{width:100%; margin-right:0px;}
        #modem_carousel .carousel item{width:100%; max-width:300px; float:none;margin-bottom:20px;}
        #modem_carousel .carousel item img{min-height: initial;min-width: initial;}
        #ajanlat .cardholder card{display:block;margin:20px auto; max-width:calc(90% - 30px);}
        #ajanlat .cardholder{display:block; text-align:center;}
        #ajanlat  .cardholder:after{display:none;}
        footer{overflow-y: hidden;}
        footer .stuff p.smartmoney{max-width:95%;}
              }           
           
    @media (min-width:480px) and (max-width:568px){
        body{width:100%;} 
        header{max-width: 100%;}
        .slide{width:100%;}
        #video_head{min-height: 700px; height:auto;}
        #video_head .bg{    min-height: 100vh;  max-height:initial; }
        #video_head .video video{display:none;}
        #present_video iframe{width:100%; min-height:300px; } 
        #video_head .grid .column:nth-child(2){display:none;}
        .grid .column{width:100% !important;}
        #video_head .adatbekero input#geo{max-width:80%; width:initial;}
        #video_head h1{font-size:35px; line-height: 1.5; text-align:center;}
        #video_head h2{line-height: 1.5; text-align:center;margin-bottom:20px; font-size:14px; text-transform: none; }
        #video_head .adatbekero{line-height: 1.6; font-size:13px;text-align:center;}
        #video_head .buttons{width:100%; text-align:center;}
        #video_head .buttons button{margin:10px auto;}
        #about p{max-width:90%;line-height: 1.6;}
        #letter .letterdesign .paper{padding-bottom:50px;}
        #letter .letterdesign .paper:after{display:none;}
        #letter .story.first,#letter .story{margin:50px auto !important; width:95%;}
        #splash section h1{font-size:30px; line-height: 1.6;padding-top:30px;}
        #splash section h2{line-height: 1.5; text-align:center;margin-bottom:20px; font-size:14px; text-transform: none;}
        #splash section p{font-size:13px;width:95%; line-height: 1.5;}
        #last_cta{ height:auto;}
        #textblock p.story{width:100%; margin-right:0px;}
        #modem_carousel .carousel item{width:100%; max-width:300px; float:none;margin-bottom:20px;}
        #modem_carousel .carousel item img{min-height: initial;min-width: initial;}
        #ajanlat .cardholder card{display:block;margin:20px auto; max-width:calc(90% - 30px);}
        #ajanlat .cardholder{display:block; text-align:center;}
        #ajanlat  .cardholder:after{display:none;}
        footer{overflow-y: hidden;}
        footer .stuff p.smartmoney{max-width:95%;}
             }     
           
    @media (min-width:568px) and (max-width:767px){
        body{width:100%;} 
        header{max-width: 100%;}
        .slide{width:100%;}
        #video_head{min-height: 700px; height:auto;}
        #video_head .bg{    min-height: 100vh;  max-height:initial; }
        #video_head .video video{display:none;}
        #present_video iframe{width:100%; min-height:300px; } 
        #video_head .grid .column:nth-child(2){display:none;}
        .grid .column{width:100% !important;}
        #video_head .adatbekero input#geo{max-width:80%; width:initial;}
        #video_head h1{font-size:35px; line-height: 1.5; text-align:center;}
        #video_head h2{line-height: 1.5; text-align:center;margin-bottom:20px; font-size:14px; text-transform: none; }
        #video_head .adatbekero{line-height: 1.6; font-size:13px;text-align:center;}
        #video_head .buttons{width:100%; text-align:center;}
        #video_head .buttons button{margin:10px auto;}
        #about p{max-width:90%;line-height: 1.6;}
        #letter .letterdesign .paper{padding-bottom:50px;}
        #letter .letterdesign .paper:after{display:none;}
        #letter .story.first,#letter .story{margin:50px auto !important; width:95%;}
        #splash section h1{font-size:30px; line-height: 1.6;padding-top:30px;}
        #splash section h2{line-height: 1.5; text-align:center;margin-bottom:20px; font-size:14px; text-transform: none;}
        #splash section p{font-size:13px;width:95%; line-height: 1.5;}
        #last_cta{ height:auto;}
        #textblock p.story{width:100%; margin-right:0px;}
        #modem_carousel .carousel item{width:100%; max-width:300px; float:none;margin-bottom:20px;}
        #modem_carousel .carousel item img{min-height: initial;min-width: initial;}
        #ajanlat .cardholder card{display:block;margin:20px auto; max-width:calc(90% - 30px);}
        #ajanlat .cardholder{display:block; text-align:center;}
        #ajanlat  .cardholder:after{display:none;}
        footer{overflow-y: hidden;}
        footer .stuff p.smartmoney{max-width:95%;}
              }                
    
    @media (min-width:767px) and (max-width:910px){
        body{width:100%;} 
        header{max-width: 100%;}
        .slide{width:100%;}
        #video_head{min-height: 400px; height:auto;overflow:hidden;}
        #video_head .bg{    min-height: 100vh;  max-height:initial; }
        #video_head .video video{display:none;} 
        #present_video iframe{width:100%; min-height:300px; } 
        #video_head .adatbekero input#geo{max-width:80%; width:initial;}
        #video_head h1{font-size:35px; line-height: 1.5; }
        #video_head h2{line-height: 1.5; ;margin-bottom:20px; font-size:14px; text-transform: none; }
        #video_head .adatbekero{line-height: 1.6; font-size:13px;}
        #video_head .buttons{width:100%; text-align:center;}
        #video_head .buttons button{margin:10px auto;}
        #about p{max-width:90%;line-height: 1.6;}
        #letter .letterdesign .paper{padding-bottom:50px;}
        #letter .grid .column:nth-child(2){display:none;}
        #letter .column{width:80%;}
        #letter .letterdesign .paper:after{display:none;}
        #splash{height:50vh;}
        #last_cta{ height:auto;}
        #textblock p.story{width:100%; margin-right:0px;}
        footer{overflow-y: hidden;}
        footer .stuff p.smartmoney{max-width:95%;}
             } 
    @media (min-width:910px) and (max-width:1124px){
        body{width:100%;} 
        header{max-width: 100%;}
        .slide{width:100%;}
        #video_head{min-height: 400px; height:auto;overflow:hidden;}
        #video_head .bg{    min-height: 100vh;  max-height:initial; }
        #video_head .video video{display:none;} 
        #video_head .adatbekero input#geo{max-width:80%; width:initial;}
        #video_head h1{font-size:35px; line-height: 1.5; }
        #video_head h2{line-height: 1.5; ;margin-bottom:20px; font-size:14px; text-transform: none; }
        #video_head .adatbekero{line-height: 1.6; font-size:13px;}
        #video_head .buttons{width:100%;}
        #video_head .buttons button{margin:10px 0px;}
        #present_video iframe{width:100%; min-height:300px; } 
        #about p{max-width:90%;line-height: 1.6;}
        #letter .letterdesign .paper{padding-bottom:50px;}
        #letter .grid .column:nth-child(2){display:none;}
        #letter .column{width:80%;}
        #letter .letterdesign .paper:after{display:none;}
        #splash{height:50vh;}
    }

    @keyframes shake {
        2.5%, 22.5% {
          transform: translate3d(-1px, 0, 0);
        }
        
        5%, 20% {
          transform: translate3d(2px, 0, 0);
        }
      
        7.5%, 12.5%, 17.5% {
          transform: translate3d(-4px, 0, 0);
        }
      
        10%, 15% {
          transform: translate3d(4px, 0, 0);
        }
      }