/*! ------------------------------------------------
   Project Name: Ramio Coming Soon Template
   Project Description: Ramio - awesome coming soon template to kick-start your project
   Tags: Ramio, coming soon, under construction, template, coming soon page, html5, css3
   Version: 1.0.0
   Build Date: April 2018
   Last Update: April 2018
   This product is available exclusively on Themeforest
   Author: mix_design
   Author URI: http://mixdesign.club
   File name: color-1.css
   ------------------------------------------------

   ------------------------------------------------
   Table of Contents
   ------------------------------------------------
    1. Basic Color Options
    2. Typography Colors
    3. Buttons & Triggers Colors
    4. Forms Colors
    5. Main Section Colors
    7. Popup Screens colors
    8. Content Sections Colors
    9. Scroll Custom Colors
    10. Works Gallery & PhotoSwipe Custom Colors
    11. Google Map Controls Colors
   ------------------------------------------------
   Table of Contents End
   ------------------------------------------------ */

   ::-moz-selection {
background-color:#4d3a8f;
color:#40e1e8;
text-shadow:none
}
::selection {
	background-color: #4d3a8f;
	color: #40e1e8;
	text-shadow: none
}
html {
	-webkit-tap-highlight-color: transparent
}
body {
	background-color: #2e2356;
	color: #616161
}
a {
	color: #303030
}
.layer-black {
	background-color: rgba(0,0,0,.4)
}
h1 {
	color: #262626
}
h1 span {
	color: #40e1e8
}
h1.light-text {
	color: #fff
}
h2 {
	color: #262626
}
h3 {
	color: #262626
}
h3 small {
	color: #aaa
}
p {
	color: #303030
}
.section-title span {
	color: #262626
}
.section-title span em {
	color: #262626
}
.section-title p {
	color: #303030
}
.txt-light {
	color: #fff
}
.txt-light-transparent {
	color: rgba(255,255,255,.6)
}
.txt-accent-color {
	color: #40e1e8
}
.blockquote-content::after {
	color: rgba(48,48,48,.1)
}
.blockquote-content blockquote p {
	color: #303030
}
.blockquote-content blockquote cite {
	color: #616161
}
strong {
	color: #303030
}
.btn-dark-outline {
	border: 2px solid #303030;
	color: #303030
}
.btn-dark-outline::after, .btn-dark-outline::before {
	background-color: #303030
}
.btn-dark {
	color: #fff;
	background-color: #4d3a8f
}
.btn-dark::after, .btn-dark::before {
	background-color: #fff
}
.btn-light {
	color: #303030;
	background-color: #fff
}
.btn-light::after, .btn-light::before {
	background-color: #4d3a8f
}
.btn-light-outline {
	background-color: transparent;
	border: 2px solid #fff;
	color: #fff
}
.btn-light-outline::after, .btn-light-outline::before {
	background-color: #fff
}
.section-close {
	color: #4d3a8f;
	border: 2px solid #4d3a8f
}
.section-close.light {
	color: rgba(255,255,255,.6);
	border: 2px solid rgba(255,255,255,.3)
}
.contact-data-item i {
	color: #4d3a8f
}
.contact-data-item p {
	color: #616161
}
.contact-data-item a {
	color: #616161
}
.contact-data-item a::before {
	background-color: #343434
}
.no-touch .contact-data-item a:hover {
	color: #303030
}
.form-dark {
	-moz-placeholder-color: #303030;
	-ms-input-placeholder-color: #303030
}
.form-dark ::-webkit-input-placeholder {
color:#303030
}
.form-dark ::-moz-placeholder {
color:#303030
}
.form-dark input:focus:required:invalid, .form-dark textarea:focus:required:invalid {
color:#303030
}
.form-dark input:required:valid, .form-dark textarea:required:valid {
color:#303030
}
.form-dark input, .form-dark textarea {
	border-bottom: 1px solid #303030;
	color: #303030
}
.form-dark input:focus, .form-dark textarea:focus {
	border-bottom: 1px solid #40e1e8
}
.form-dark .inputs-description {
	color: #aaa
}
.form-light {
	-moz-placeholder-color: rgba(255,255,255,.6);
	-ms-input-placeholder-color: rgba(255,255,255,.6)
}
.form-light ::-webkit-input-placeholder {
color:rgba(255,255,255,.6)
}
.form-light ::-moz-placeholder {
color:rgba(255,255,255,.6)
}
.form-light input:focus:required:invalid, .form-light textarea:focus:required:invalid {
color:#fff
}
.form-light input:required:valid, .form-light textarea:required:valid {
color:#fff
}
.form-light input, .form-light textarea {
	border-bottom: 1px solid #fff;
	color: #d8d8d8
}
.form-light input:focus, .form-light textarea:focus {
	border-bottom: 1px solid #40e1e8
}
.form-light .inputs-description {
	color: rgba(255,255,255,.6)
}
.main {
	background-color: #4d3a8f
}
.main-intro {
	background-color: #4d3a8f
}
.main-intro::before {
	background-color: #3e2e72
}
.intro-content {
	background-color: #4d3a8f
}
.main-media::before {
	background-color: #3e2e72
}
.menu ul li::after {
	background: #40e1e8
}
.no-touch .menu ul li:hover a {
	color: #fff
}
.menu ul li a {
	color: #fff
}
.socials ul li a {
	color: #fff
}
.no-touch .socials ul li:hover a {
	color: #40e1e8
}
.countdown #countdown {
	color: #fff
}
.countdown .help-text {
	color: #fff
}
.notify {
	background-color: #fff
}
.notify .popup-title .title {
	color: #262626
}
.notify-content {
	background-color: #fff
}
.writealine {
	background-color: #4d3a8f
}
.content-section {
	background-color: transparent
}
.scroll {
	background-color: #fff
}
.blocks-container {
	background-color: #fff
}
.about-photo-caption {
	color: #fff
}
.team-socials li a {
	color: #aaa
}
.no-touch .team-socials li:hover a {
	color: #40e1e8
}
.mCSB_draggerContainer {
	background: #40e1e8
}
.mCSB_scrollTools .mCSB_draggerRail {
	background-color: #53e4ea
}
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
	background-color: #4d3a8f
}
.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
	background-color: #4d3a8f
}
.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar {
	background-color: #4d3a8f
}
.my-gallery figure::after {
	background-color: #fff;
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(255,255,255,0)), color-stop(50%, rgba(255,255,255,0)), to(rgba(255,255,255,.6)));
	background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0, rgba(255,255,255,0) 50%, rgba(255,255,255,.6) 100%);
	background: -moz-linear-gradient(top, rgba(255,255,255,0) 0, rgba(255,255,255,0) 50%, rgba(255,255,255,.6) 100%);
	background: -o-linear-gradient(top, rgba(255,255,255,0) 0, rgba(255,255,255,0) 50%, rgba(255,255,255,.6) 100%);
	background: linear-gradient(to bottom, rgba(255,255,255,0) 0, rgba(255,255,255,0) 50%, rgba(255,255,255,.6) 100%)
}
.my-gallery figure:nth-of-type(2)::after {
	background-color: #40e1e8;
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(64,225,232,0)), color-stop(50%, rgba(64,225,232,0)), to(rgba(64,225,232,.6)));
	background: -webkit-linear-gradient(top, rgba(64,225,232,0) 0, rgba(64,225,232,0) 50%, rgba(64,225,232,.6) 100%);
	background: -moz-linear-gradient(top, rgba(64,225,232,0) 0, rgba(64,225,232,0) 50%, rgba(64,225,232,.6) 100%);
	background: -o-linear-gradient(top, rgba(64,225,232,0) 0, rgba(64,225,232,0) 50%, rgba(64,225,232,.6) 100%);
	background: linear-gradient(to bottom, rgba(64,225,232,0) 0, rgba(64,225,232,0) 50%, rgba(64,225,232,.6) 100%)
}
.my-gallery figure:nth-of-type(3)::after {
	background-color: #4d3a8f;
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(77,58,143,0)), color-stop(50%, rgba(77,58,143,0)), to(rgba(77,58,143,.6)));
	background: -webkit-linear-gradient(top, rgba(77,58,143,0) 0, rgba(77,58,143,0) 50%, rgba(77,58,143,.6) 100%);
	background: -moz-linear-gradient(top, rgba(77,58,143,0) 0, rgba(77,58,143,0) 50%, rgba(77,58,143,.6) 100%);
	background: -o-linear-gradient(top, rgba(77,58,143,0) 0, rgba(77,58,143,0) 50%, rgba(77,58,143,.6) 100%);
	background: linear-gradient(to bottom, rgba(77,58,143,0) 0, rgba(77,58,143,0) 50%, rgba(77,58,143,.6) 100%)
}
.my-gallery figure figcaption h4 {
	color: #303030
}
.my-gallery figure figcaption h4 small {
	color: #303030
}
.my-gallery figure:nth-of-type(2) figcaption h4, .my-gallery figure:nth-of-type(3) figcaption h4 {
	color: #fff
}
.my-gallery figure:nth-of-type(2) figcaption h4 small, .my-gallery figure:nth-of-type(3) figcaption h4 small {
	color: rgba(255,255,255,.8)
}

@media only screen and (min-width:1200px) {
.my-gallery figure::after {
	background-color: #fff
}
.my-gallery figure:nth-of-type(2)::after {
	background-color: #40e1e8
}
.my-gallery figure:nth-of-type(3)::after {
	background-color: #4d3a8f
}
}
.pswp__caption__center h4 {
	color: #fff
}
.pswp__caption__center h4 small {
	color: rgba(255,255,255,.8)
}
.pswp__caption__center p {
	color: rgba(255,255,255,.6)
}
.pswp__bg {
	background: #17112b
}
.pswp__caption, .pswp__top-bar {
	background-color: rgba(0,0,0,.3)
}
.pswp__button--close {
	background-color: #40e1e8
}
#zoom-in, #zoom-out {
	background-color: rgba(255,255,255,.4);
	color: #4d3a8f;
	border: 2px solid #4d3a8f
}