diff options
Diffstat (limited to 'assets/stylesheets/app.css')
| -rwxr-xr-x | assets/stylesheets/app.css | 1415 |
1 files changed, 1415 insertions, 0 deletions
diff --git a/assets/stylesheets/app.css b/assets/stylesheets/app.css new file mode 100755 index 0000000..aa9db84 --- /dev/null +++ b/assets/stylesheets/app.css @@ -0,0 +1,1415 @@ +@import url(http://fonts.googleapis.com/css?family=Lato:100,300,400,700,900,100italic,300italic,400italic,700italic,900italic); + +*{ + margin:0; + padding:0; + outline:0; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + font-family: 'Lato', sans-serif; + -webkit-font-smoothing: subpixel-antialiased; +} +*, *:before, *:after { + moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; +} +body{ + overflow-x:hidden; +} + +body.noOverflow{ + overflow:hidden; +} + +body.loading * { + -webkit-transition: all 0 ease 0 !important; + -moz-transition: all 0 ease 0 !important; + transition: all 0 ease 0 !important; +} + +body.pastePaper .mx-scene{ + cursor:url(../img/paintbucket.png), auto; +} + +body.pastePaper .wallpaper.active span:hover{ + cursor:url(../img/paintbucket.png), auto; +} + +a{ + color:black; +} + +/*page*/ + +.topLogo { + width:300px; + margin-top:20px; +} + +.floatingImg { + width: 100%; + cursor: -webkit-grabbing; cursor: -moz-grabbing; +} + +.floatimgImg.edit { + +} + +.ants { +width:320px; +height:auto; +padding:15px; +background:white; +position:absolute; +margin:0 auto; +overflow:hidden; +display: none; +} + +.ants.edit { + display: block; +} + +.ants:before { + content:""; + width:100%; + border-bottom:1px dashed #000; + position:absolute; + top:0px; + left:0px; + background:#fff; + -webkit-animation:borderanimation 10s infinite; + -moz-animation:borderanimation 10s infinite; + -ms-animation:borderanimation 10s infinite; + -o-animation:borderanimation 10s infinite; + animation:borderanimation 10s infinite; + z-index:99; +} + +.ants:after +{ + content:""; + width:100%; + border-bottom:1px dashed #000; + position:absolute; + bottom:0px; + left:0px; + background:#fff; + -webkit-animation:borderanimation 10s infinite; + -moz-animation:borderanimation 10s infinite; + -ms-animation:borderanimation 10s infinite; + -o-animation:borderanimation 10s infinite; + animation:borderanimation 10s infinite; +} + +.leftborder +{ + height:auto; + width:100%; + position:absolute; + top:-3px; + left:-1px; + background:#fff; +} + +.leftborder:before +{ + content:""; + height:250px; + border-left:1px dashed #000; + position:absolute; + top:0px; + left:1px; + background:#fff; + -webkit-animation:borderanimationleftright 10s infinite; + -moz-animation:borderanimationleftright 10s infinite; + -ms-animation:borderanimationleftright 10s infinite; + -o-animation:borderanimationleftright 10s infinite; + animation:borderanimationleftright 10s infinite; +} + +.leftborder:after +{ + content:""; + height:250px; + border-left:1px dashed #000; + position:absolute; + top:0px; + left:100%; + background:#fff; + -webkit-animation:borderanimationleftright 10s infinite; + -moz-animation:borderanimationleftright 10s infinite; + -ms-animation:borderanimationleftright 10s infinite; + -o-animation:borderanimationleftright 10s infinite; + animation:borderanimationleftright 10s infinite; +} + +h5{ + font-weight: 300; + font-style: italic; + margin: 20px 0 0px 0; + font-size: 14px; +} + +.page{ + text-align:center; +} + +.page .profile { + color:white; +} +.page table{ + width:100%; + height:400px; + border-top:1px solid; + margin:40px 0 0 0; + border-spacing: 0; + clear:both; +} +.page table.showcase { + height:70vh; +} +.page table td.border{ + border-right:1px solid; +} +.page table td{ + width: 33.3333%; + background-size: cover; + background-repeat: no-repeat; + background-position: center; + border-bottom:1px solid black; +} + +.page table.showcase td{ + height: 70vh; + background-size: cover; +} + +.viewMore { + color: #017cfe; + text-decoration: none; + font-weight: 300; + font-size: 22px; + padding-top: 20px; + display: block; + border-bottom: 1px solid black; + padding-bottom: 19px; +} + +.viewMore:hover { + text-decoration:underline; +} + +.page .roomName { + font-weight: 300; + font-size: 20px; + letter-spacing: 1px; + color: black; + background: white; + border: 1px solid; + padding: 5px; + box-shadow: -3px 3px black; + text-decoration:none; + max-width: 180px; + display: inline-block; +} + +.page .roomName:hover { + background:black; + color:white; +} + +.room1 { + position: relative; + overflow: hidden; + background-image:url(https://s3.amazonaws.com/luckyplop/7eb159e99924e6e371046d6fa12e566fd77901c9.jpg); +} +.room2 { + background-image:url(https://s3.amazonaws.com/luckyplop/fd4ebe8a7a4246c8273fc999fb1ef0d6a8260b8c.png); +} + +.room1 .editBtn { + position: absolute; + right: 10px; + top: 10px; +} + +.room1 form textarea { + width: 226px; +} + +.room1 .radio-group { + width: 226px; +} + +.room1 .radio-group__label { + width: 106px; + font-size: 13px; +} + +.room1 .formHolder { + top: 0; + padding-top: 10px; + display: table; + width: 100%; + height: 100%; + background: rgba(255,255,255,0.9); + -webkit-transform:translateY(-100%); + -moz-transform:translateY(-100%); +} + +.room1 form { + padding: 0 10px; + max-width: 440px; +} + +.room1 .formInner { + display: table-cell; + vertical-align: middle; +} + +.room1.editing .formHolder { + -webkit-transform:translateY(0); + -moz-transform:translateY(0); +} + +.page .questions { + background: #55efcb; + color:white; + padding:80px; +} +.subButtons a { + margin: 9px 0; + border: 0; + background: transparent; + font-size: 15px; + font-weight: 300; + width: 33.33333333333%; + display: inline-block; + float: left; + text-decoration:none; +} +.subButtons a:hover { + text-decoration:underline; +} +.subButtons a:nth-child(3){ + color:#FF3A2D; + float: right; +} +.page .questions span{ + font-weight:300; + line-height:30px; + font-size:16px; + margin:20px 0 40px 0; + display:inline-block; +} + +.page h2 { + font-weight: 100; + font-size: 40px; +} + +.page h1 { + font-size: 80px; + font-weight: 100; + padding-top: 25px; +} + +.footer { + width: 100%; + margin: 80px 0; +} + +.footer a, .footer span{ + margin: 15px; + font-weight: 300; + font-size: 13px; +} + + +/* PROFILE PAGE */ +.profilepage .profilePic { + font-size: 148px; + background: url(http://www.clevelandfoundation.org/wp-content/uploads/2012/10/ivan-discussing-his-eye-surgery.jpg); + background-size: cover; + background-position: center; +} +.editProfile { + padding: 8px; + float: right; + margin-right: 10px; + font-size: 38px; + color: black; + font-weight: 100; + text-decoration: none +} + +.editProfile span { + vertical-align: middle; +} +.topLink { + padding: 8px; + float: right; + margin: 14px; + font-size: 18px; + color: black; + font-weight: 300; + text-decoration: none; + border-bottom:1px solid white; +} +.topLink:hover { + border-bottom:1px solid lightgreen; +} +.profilepage .bio { + text-align: left; + padding: 0 5%; + width: 66.5%; + background-image:url(../img/pattern.png); + background-size:100%; + background-color: lightyellow; + box-shadow: -4px 6px 7px rgba(0,0,0,0.1) inset; +} + +.profilepage .bio.one { + background-color: lightyellow; +} +.profilepage .bio.two { + background-color: #FFCC00; +} +.profilepage .bio.three { + background-color: #4CD964; +} +.profilepage .bio.four { + background-color: #D1EEFC; +} +.profilepage .bio.five { + background-color: #C7C7CC; +} +.profilepage .bio.six { + background-color: #55EFCB; +} +.profilepage .bio.seven { + background-color: #FFD3E0; +} +.profilepage .bio.eight { + background-color: #F7F7F7; +} +.profilepage .bio.nine { + background-color: #D6CEC3; +} +.profilepage .bio.ten { + background-color: #1AD6FD; +} +.profilepage .bio.eleven { + background-color: #b5bfe4; +} +.profilepage .bio.twelve { + background-color: #85c98f; +} +.profilepage .bio.thirteen { + background-color: #c2cab1; +} + + +.profilepage .bio h2 { + text-align: left; + font-weight: 100; + font-size: 70px; +} +.profilepage .bio span { + font-size: 16px; + font-weight: 300; +} + +.templates { + padding-top: 7vh; +} + +.templates span{ + background-position: center; + background-size: contain; + background-repeat: no-repeat; + background-image: url(http://upload.wikimedia.org/wikipedia/commons/d/d9/Graceland_Memphis_TN_Floorplan_Basement.jpg); + width: 20vw; + height: 20vh; + display: inline-block; + margin: 4vw; + border:1px solid white; +} + +.templates span:hover { + border:1px dashed black; + cursor:pointer; +} + +.templates h1 { + font-weight: 300; + font-size: 21px; + margin: 0; +} + +.templates span.active { + border:1px solid #017cfe; +} + +.clear:after { + visibility: hidden; + display: block; + font-size: 0; + content: " "; + clear: both; + height: 0; +} +.clear{ + display: inline-block; + width:100%; +} +.left { + float:left; +} +.right { + float:right; +} +.mx-scene { + position:fixed; + top:0; + left:0; + cursor: -webkit-grab; cursor: -moz-grab; +} +.mx-scene:active{ + cursor: -webkit-grabbing; cursor: -moz-grabbing; +} + +.rapper { + position:relative; +} +.logo { + float:left; + padding:10px; + z-index:3; + position:relative; +} +.logo:hover { + -webkit-filter:invert(30%); +} +.profile{ + padding:8px; + float:right; + margin-right: 10px; + font-size:41px; + color: black; +} + +.profile:hover { + background:black; + color:white; + cursor:pointer; +} +.vvbox { + border: 1px solid; + position: fixed; + display: inline-block; + background: white; + box-shadow: -3px 3px; +} + +.edit-video.menu, +.edit-image.menu { + right: auto; + top: auto; + z-index: 3; + display: none; +} + +.menu { + right: 10px; + top: 70px; + z-index:3; +} + + +.menu span{ + display: inline-block; + text-align: center; + padding: 15px; + font-size: 17px; + float: left; + clear: both; + width: 55px; +} + +.menu span:hover{ + color:white; + background:black; + cursor:pointer; +} + +.menu span.toggled { + color:white; + background:black; + cursor:pointer; +} + +.menu span.icon-close{ + color:white; + background:black; + cursor:pointer; +} + +.icon-close:before { +content: "\e736"!important; +} + +.menu span:hover:after{ + content: attr(data-info); + position: absolute; + color: black; + background: rgba(255,255,255,0.9); + margin-left: -180px; + display: inline-block; + width: 90px; + text-align: right; + padding: 17px 13px; + margin-top: -16px; + font-size: 13px; +} + +.menu span.icon-close:hover:after{ + content:""; + opacity:0; +} +.menu span.icon-map.hidden:hover:after{ + content:"show map"; +} +.fixed { + position:fixed; + top:0; + left:0; + width:100%; + height:100%; + z-index:2; + overflow-y:scroll; +} + +.fixed::-webkit-scrollbar +{ + width: 3px; +} + +.fixed::-webkit-scrollbar-track +{ + background:white; +} + +.fixed::-webkit-scrollbar-thumb +{ + background: black; +} + +.fixed::-moz-scrollbar +{ + width: 3px; +} + +.fixed::-moz-scrollbar-track +{ + background:white; +} + +.fixed::-moz-scrollbar-thumb +{ + background: black; +} +.animate { + -webkit-transition:all 0.2s ease-in-out; + -moz-transition:all 0.2s ease-in-out; + transform:translateY(-100%); +} +.mediaDrawer { + -webkit-transform:translateY(-100%); + -moz-transform:translateY(-100%); + transform:translateY(-100%); + background:rgba(255,255,255,0.9); + text-align:center; + overflow-x: hidden; +} +.mediaDrawer.active { + -webkit-transform:translateY(0%); + -moz-transform:translateY(0%); + transform:translateY(0%); +} +.mediaDrawer.signin, .mediaDrawer.signup{ + display:table; +} +.image.active { + background-image:url(https://s3.amazonaws.com/luckyplop/735c46b0268cd511a22c37bc0c11e9f60c4459b2.png)!important; + cursor:move; +} +.deleteActive .image { + cursor:pointer; +} +.deleteActive .image:after { + content: "\e68f"; + font-family: 'ionicons'; + speak: none; + font-style: normal; + font-weight: normal; + font-variant: normal; + text-transform: none; + line-height: 1; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + font-size:150px; + color:#FF3B30; +} +.image.editText:after { + content: "hey"; + position: absolute; + width:calc(100% - 100px) ; + background: white; + padding: 30px; + border: 3px solid #000; + margin-left:20px; + box-shadow: 9px 9px 2px #999 inset; + font-size: 30px; + margin-top: 600px; + cursor:text; +} + +.fileUpload{ + position: fixed; + width: 400px; + text-align: center; + font-size: 16px; + top: 30%; + left: 50%; + padding: 26px 20px; + margin-left: -200px; + background: white; + z-index: 4; + -webkit-transform: translateY(-1000%); + -webkit-transition: -webkit-transform 0.6s ease-in-out; + -moz-transform: translateY(-1000%); + -moz-transition: -webkit-transform 0.6s ease-in-out; + transform: translateY(-1000%); + transition: -webkit-transform 0.6s ease-in-out; + border: 1px solid; + box-shadow: -3px 3px black; +} + +.fileUpload.active { + -webkit-transform:translateY(0%); + -moz-transform:translateY(0%); + transform:translateY(0%); +} + +.fileUpload .icon-ios7-upload-outline{ + font-size:40px; +} +.fileUpload input[type="text"]{ + border: 1px solid #ccc; + font-size: 15px; + padding: 5px; + width: 220px; + text-align: center; + border-radius: 20px; +} + +.fileUpload input[type="text"]:focus{ + border: 1px solid #000; +} + +.fileUpload input[type="file"]{ + position: absolute; + margin-left: -134px; + background: blue; + height: 50px; + margin-top: -35px; + opacity: 0; + cursor:pointer; +} +.fileUpload small{ + margin: 5px 0; + display:inline-block; + width:100%; + font-weight:bold; +} +.myMedia { + -webkit-transition: opacity 0.3s ease-in-out; + -moz-transition: opacity 0.3s ease-in-out; + transition: opacity 0.3s ease-in-out; +} +.myMedia.inactive { + opacity:0; +} + +.foundMedia { + position:absolute; + top:0; + left:0; + -webkit-transform: translateX(100%); + -webkit-transition: -webkit-transform 0.3s ease-in-out; + -moz-transform: translateX(100%); + -moz-transition: -webkit-transform 0.3s ease-in-out; + transform: translateX(100%); + transition: -webkit-transform 0.3s ease-in-out; + padding-top:40px; +} + +.foundMedia.active { + -webkit-transform:translateX(0%); + -moz-transform:translateX(0%); + transform:translateX(0%); +} + +.mediaDrawer h2{ + font-size: 18px; + display: inline-block; + margin-top: 20px; + position:relative; + z-index:4; +} + +.mediaDrawer h3{ + margin-top: 28px; + position: relative; + z-index: 4; +} + +.editBtn{ + color: #FF3B30; + padding: 3px; + font-size: 12px; + display: inline-block; + cursor:pointer; + font-weight:600; + text-decoration:none; +} + +.editBtn:hover { + background:lightgreen; +} + +.deleteArmed .mediaDrawer h3 { + background:#FF3B30; + color:white; +} + +.deleteArmed .mediaContainer { + +} + +.deleteArmed .mediaContainer:hover { + background:#FF3B30; + border:1px solid #FF3B30; +} + + +.deleteArmed .mediaContainer:before { + content: "\e68f"; + font-family: 'ionicons'; + speak: none; + font-style: normal; + font-weight: normal; + font-variant: normal; + text-transform: none; + line-height: 1; + -webkit-font-smoothing: antialiased; + font-size: 60px; + margin-top: -62px; + position: absolute; + background: #FF3B30; + border-radius: 1000px; + margin-left: -59px; + color: white; +} + +.deleteArmed .mediaContainer.deleted { + background:#FF3B30; +} +.mediaDrawer h2 a{ + color: #555; + text-decoration:none; + padding:5px; + border:3px solid white; +} + +.mediaDrawer h2 a.active{ + cursor:default; + border:3px solid black; + color:black; +} + +.mediaDrawer h2 a:hover { + border:3px solid #ccc; +} + +.mediaDrawer h2 a.active{ + border:3px solid black; +} + + +.mediaContainer { + border: 1px solid white; + display: inline-block; + width: 25%; + margin: 4%; + vertical-align: top; + border:1px solid white; + padding:2%; +} +.mediaContainer:hover { + border:1px dashed black; + cursor:pointer; +} +.mediaContainer img{ + max-width:100%; +} +#minimap { + position: fixed; + bottom: 20px; + left: 20px; + color: black; + cursor:pointer; + background:black; + -webkit-transform: translateY(0px); + -moz-transform: translateY(0px); + transform: translateY(0px); +} +#minimap.hide{ + -webkit-transform: translateY(155px); + -moz-transform: translateY(155px); + transform: translateY(155px); +} +#minimap.hide canvas{ + opacity:0; +} +#minimap canvas { + display: block; + width:130px; + opacity:1; + -webkit-transition:opacity 0.3s ease-in-out; + -moz-transition:opacity 0.3s ease-in-out; + transition:opacity 0.3s ease-in-out; +} +.wallpaper{ + right: 80px; + margin-top: 77px; + width: 162px; + z-index: 1; + -webkit-transition: -webkit-transform 0.1s ease-in-out; + -webkit-transform: translateX(400px); + -moz-transition: -webkit-transform 0.1s ease-in-out; + -moz-transform: translateX(400px); + transition: -webkit-transform 0.1s ease-in-out; + transform: translateX(400px); +} +.wallpaper.active { + display:inline-block; + -webkit-transform: translateX(0px); + -moz-transform: translateX(0px); + transform: translateX(0px); +} +.wallpaper.active span { + width: 40px; + height: 35px; + display: inline-block; + float: left; + border:1px solid; + background: url(../img/MacPaint.gif); + -webkit-transition: -webkit-transform 0.1s ease-in-out; + -webkit-user-drag: element; +} + +.wallpaper.active span:nth-child(1){ + background-position:103px 70px; +} +.wallpaper.active span:nth-child(2){ + background-position:200px -98px; +} +.wallpaper.active span:nth-child(3){ + background-position:200px -260px; +} +.wallpaper.active span:nth-child(4){ + background-position:200px -350px; +} +.wallpaper.active span:nth-child(5){ + background-position:200px -484px; +} +.wallpaper.active span:nth-child(6){ + background-position:200px -581px; +} +.wallpaper.active span:nth-child(7){ + background-position:200px -645px; +} +.wallpaper.active span:nth-child(8){ + background-position:200px -772px; +} + +.wallpaper.active span:hover { + cursor: pointer; + -webkit-transform: translateX(3px) translateY(-3px); + -moz-transform: translateX(3px) translateY(-3px); + transform: translateX(3px) translateY(-3px); +} + +.lightcontrol { + margin-top: 13%; + right: 80px; + padding: 20px; + -webkit-transform: translateX(400px); + -webkit-transition: -webkit-transform 0.2s ease-in-out; + -moz-transform: translateX(400px); + -moz-transition: -webkit-transform 0.2s ease-in-out; + transform: translateX(400px); + transition: -webkit-transform 0.2s ease-in-out; +} + +.lightcontrol.active { + -webkit-transform: translateX(0px); + -moz-transform: translateX(0px); + transform: translateX(0px); +} + +.lightcontrol .slider { + +} +h4 { + font-weight:300; + font-size:11px; +} +input[type=range] { + -webkit-appearance: none; + -moz-appearance: none; + background-color: black; + width: 200px; + height:3px; +} + +input[type="range"]::-webkit-slider-thumb { + -webkit-appearance: none; + background-color: #000; + width: 10px; + height: 10px; + border-radius:10px; + cursor:pointer; +} + +.settings { + padding: 20px; + bottom: 20px; + right: 10px; + font-size: 12px; + -webkit-transform: translateY(400px); + -webkit-transition: -webkit-transform 0.2s ease-in-out; + -moz-transform: translateY(400px); + -moz-transition: -webkit-transform 0.2s ease-in-out; + transform: translateY(400px); + transition: -webkit-transform 0.2s ease-in-out; +} + +.settings.active { + -webkit-transform: translateY(0px); + -moz-transform: translateY(0px); + transform: translateY(0px); +} + +#startpoint { + text-decoration: none; +} + +#startpoint:hover { + text-decoration: underline; +} +@-webkit-keyframes fade +{ + 50%{ + opacity:0.6; + } +} +@-moz-keyframes fade +{ + 50%{ + opacity:0.6; + } +} +#startpoint.active #moveText{ + -webkit-animation:fade 0.5s infinite; + -moz-animation:fade 0.5s infinite; +} +#moveText{ + display:none; +} +#moveText.show { + display:inline-block; +} +#startText.hide { + display:none; +} +#startpoint.active:after { + content: "done"; + background: black; + color: white; + padding: 2px; + font-weight: 900; + margin-left: 5px; +} +#startpoint.active:hover { + text-decoration:none; +} +.settings input[type="text"], textarea{ + border: 1px solid #000; + font-size: 15px; + padding: 5px; +} + +.settings textarea { + font-size: 12px; + width: 100%; + max-height: 200px; + max-width: 180px; +} + +.settings input[type="text"]:focus{ + border: 1px solid #000; +} + +.settings .setting{ + margin-bottom:10px; +} +.setting.subButtons { + display: inline-block; + width: 100%; + margin-top: 10px; +} +.settings .subButtons a{ + font-size: 12px; + font-weight: 300; + width: 40px; + margin: 0; +} +.settings .setting:last-child{ + margin-bottom:0px; +} + +button { + padding: 8px; + border: 1px solid; + float: right; + font-weight: 500; + background: white; + cursor: pointer; + width: 100%; +} + +button:hover { + background:black; + color:white; +} + + + +.radio-group { + width: 182px; + display: table; + table-layout: fixed; + border-spacing: 0; + border-collapse: separate; +} + +.radio-group__label { + display: table-cell; + height: 28px; + padding: 5px; + vertical-align: middle; + text-align: center; + position: relative; + border: 1px solid #ccc; + cursor:pointer; + border-style: solid none solid solid; + /* border-radius: 5px 0 0 5px;*/ + -webkit-transition:border 250ms, color 250ms); +} + +.radio-group__label + input + .radio-group__label { + /*border-radius: 0 5px 5px 0;*/ + border-style: solid solid solid none; +} + +.radio-group__label + input + .radio-group__label:before { + content: " "; + display: block; + position: absolute; + top:-1px; + width: 100%; + height: 100%; + border: 1px solid #000; + /*border-radius: 5px 0 0 5px;*/ + -webkit-transform: translate3d(-103%,0,0); + -webkit-transition: all 250ms; + -moz-transform: translate3d(-103%,0,0); + -moz-transition: all 250ms; + transform: translate3d(-103%,0,0); + transition: all 250ms; + background:; +} + +.radio-group__label + input:checked + .radio-group__label:before { + -webkit-transform: translate3d(-6px,0,0); + -moz-transform: translate3d(-6px,0,0); + transform: translate3d(-6px,0,0); +} + +.radio-group__option:checked + label { + color: #000; +} + +.radio-group__option { + display: none; +} + +/*FORM STUFF*/ + +form { + max-width: 440px; + margin: 0 auto; + +} +form div { + float:right; +} +form li { + font-size: 20px; + font-weight: 300; + margin: 8px 0; + list-style: none; + display: inline-block; + width: 100%; +} +form label { + float:left; +} +form input[type="text"],form input[type="password"] { + border: 1px solid; + font-size: 20px; + padding: 5px; + font-weight:300; +} +form input[type="submit"] { + width: 100%; + border: 1px solid; + background: white; + font-size: 20px; + font-weight: 300; + padding: 10px 0; +} +form input[type="submit"]:hover { + background:lightgreen; + color:white; + border:1px solid lightgreen; + cursor:pointer; +} +form p{ + display: block; + float: left; + font-size: 15px; + font-weight: 500; + margin-top: 10px; + color: #999; +} +form h3 { + text-align: left; + font-weight: 600; + font-size: 12px; + border-bottom: 1px solid; + padding: 10px 0; + margin-bottom: 10px; +} +#form_container { + clear:both; +} + +.video { + height:80vh; + min-height:300px; +} + +.video span { + font-size:100px; + color:white; + cursor:pointer; +} +.video span.videoTitle { + font-size: 29px; + font-weight: 300; + padding: 3px 7px; +} + +.video span.icon-ios7-play-outline:hover { + color:lightgreen; +} + +.box { + display: table-cell; + vertical-align: middle; + width: 100%; +} + +.bigClose { + font-weight: 100; + font-size: 120px; + float: right; + cursor: pointer; + position: fixed; + right: 20px; +} + +.bigClose:hover { + color:lightgreen; +} + +.facebook { + width: 100%; + display: inline-block; + text-align: right; + font-size: 28px; + font-weight: 300; + background: #1D62F0; + vertical-align: top; + text-decoration: none; + margin-bottom: 20px; + color: white; +} +/* +.facebook:hover{ + background:lightgreen; +} +*/ +.box b.info { + display: inline-block; + width: 100%; + margin-bottom: 18px; + font-weight: 500; + font-size: 12px; + letter-spacing: 2px; +} +.facebook b { + float: left; + font-size: 50px; +} + +.facebook span { + vertical-align: bottom; + padding-right: 14px; + font-size: 19px; + line-height: 16px; +} + +.aboutRoom { + width: 250px; + background: rgba(255,255,255,0.95); + padding: 20px; + position: fixed; + bottom: 10px; + left: 10px; + border: 1px solid; +} + +.aboutRoom h1 a{ + text-decoration: none; + font-style: italic; +} + +.aboutRoom h1 a:hover { + text-decoration:underline; +} + +.aboutRoom h2{ + font-size: 13px; + margin: 5px 0; +} + +.share { + position: fixed; + right: 0px; + bottom: 10px; + padding-right:10px; + background:rgba(255,255,255,0.95); +} + +.share h2 { + font-weight: 300; + font-size: 18px; + text-align: right; +} + +.share a{ + color: #017cfe; + text-decoration: none; + margin-left: 6px; + font-size: 13px; + font-weight: 600; +} + +.share a:hover{ + text-decoration:underline; +} +@-webkit-keyframes borderanimation +{ + 0%{width:600px;} + 100%{width:750px;left:2px;} +} + +@-webkit-keyframes borderanimationleftright +{ + 0%{height:250px;} + 100%{height:500px;top:2px;} +} + +@-moz-keyframes borderanimation +{ + 0%{width:600px;} + 100%{width:750px;left:2px;} +} + +@-moz-keyframes borderanimationleftright +{ + 0%{height:250px;} + 100%{height:500px;top:2px;} +} + +@-ms-keyframes borderanimation +{ + 0%{width:500px;} + 100%{width:750px;left:2px;} +} + +@-ms-keyframes borderanimationleftright +{ + 0%{height:250px;} + 100%{height:500px;top:2px;} +} + +@-o-keyframes borderanimation +{ + 0%{width:500px;} + 100%{width:750px;left:2px;} +} + +@-o-keyframes borderanimationleftright +{ + 0%{height:250px;} + 100%{height:500px;top:2px;} +} + +@keyframes borderanimation +{ + 0%{width:500px;} + 100%{width:750px;left:2px;} +} + +@keyframes borderanimationleftright +{ + 0%{height:250px;} + 100%{height:500px;top:2px;} +} |
